:root{
  --black:#0D0D0D;
  --gold:#B8975A;
  --teal:#2D6B7A;
  --light-teal:#E8F2F4;
  --light-gold:#F7F0E3;
  --grey:#6b6b6b;
  --border:#e2ded4;
  --indigo:#5B5A9C;
  --light-indigo:#ECEBF5;
}

*{box-sizing:border-box;}
body{
  margin:0;
  font-family:'Segoe UI', Arial, sans-serif;
  background:var(--light-gold);
  color:var(--black);
}

.topbar{
  background:var(--black);
  padding:18px 32px;
  display:flex; align-items:center; justify-content:space-between;
}
.logout-link{ color:var(--gold); font-size:12px; text-decoration:none; font-weight:600; letter-spacing:0.5px; }
.logout-link:hover{ text-decoration:underline; }
.brand{display:flex; align-items:center; gap:10px;}
.brand-mark{
  width:34px;height:34px;border-radius:50%;
  background:var(--gold); color:var(--black);
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-family:'Playfair Display', serif;
}
.brand-name{
  color:#fff; letter-spacing:2px; font-weight:600; font-size:18px;
}
.brand-sub{
  color:var(--gold); font-weight:400; font-size:13px; letter-spacing:1px; margin-left:6px;
}

.global-search-wrap{ position:relative; flex:1; max-width:420px; margin:0 24px; }
.global-search-input{
  width:100%; padding:9px 14px; border-radius:20px; border:1px solid #333;
  background:#1a1a1a; color:#fff; font-size:13px;
}
.global-search-input::placeholder{ color:#888; }
.global-search-input:focus{ outline:none; border-color:var(--gold); background:#222; }
.global-search-results{
  display:none; position:absolute; top:calc(100% + 8px); left:0; right:0;
  background:#fff; border:1px solid var(--border); border-radius:8px;
  max-height:70vh; overflow-y:auto; box-shadow:0 8px 24px rgba(0,0,0,0.25); z-index:100;
}
.global-search-results.open{ display:block; }
.search-section-label{
  font-size:10px; text-transform:uppercase; letter-spacing:0.5px; font-weight:700; color:var(--teal);
  background:var(--light-teal); padding:6px 14px;
}
.search-result{ padding:9px 14px; cursor:pointer; border-bottom:1px solid var(--border); }
.search-result:hover{ background:var(--light-gold); }
.search-result:last-child{ border-bottom:none; }
.search-result-title{ font-size:13px; color:var(--black); font-weight:600; }
.search-result-sub{ font-size:12px; color:var(--grey); margin-top:2px; }
.search-result mark{ background:var(--light-gold); color:var(--black); font-weight:700; padding:0 1px; }
.search-empty{ padding:16px; text-align:center; color:var(--grey); font-size:13px; }

.summary-strip{
  display:flex; gap:16px; flex-wrap:wrap;
  padding:16px 32px;
}
.summary-card{
  background:#fff; border:1px solid var(--border); border-radius:8px;
  padding:14px 20px; min-width:140px;
}
.summary-card .num{font-size:26px; font-weight:700; color:var(--teal);}
.summary-card .label{font-size:12px; color:var(--grey); text-transform:uppercase; letter-spacing:0.5px;}

.tabs{
  display:flex; flex-wrap:wrap; gap:4px; padding:0 32px; border-bottom:2px solid var(--border);
}
.tab-btn{
  background:none; border:none; padding:12px 14px; cursor:pointer;
  font-size:14px; color:var(--grey); font-weight:600; border-bottom:3px solid transparent;
  white-space:nowrap;
}
.tab-btn.active{ color:var(--teal); border-bottom:3px solid var(--gold); }

main{ padding:24px 32px; }

.toolbar{ display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.cal-toolbar{ position:relative; }
.cal-toolbar-center{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); }
.cal-toolbar-right{ margin-left:auto; }
.add-btn{
  background:var(--teal); color:#fff; border:none; padding:9px 18px;
  border-radius:6px; cursor:pointer; font-size:13px; font-weight:600;
}
.add-btn:hover{ background:var(--black); }

table{ width:100%; border-collapse:collapse; background:#fff; border-radius:8px; overflow:hidden; }
th, td{ text-align:left; padding:10px 14px; border-bottom:1px solid var(--border); font-size:13px; }
th{ background:var(--light-teal); color:var(--teal); text-transform:uppercase; font-size:11px; letter-spacing:0.5px; }
tr:hover td{ background:#fbfaf5; }

.badge{ padding:3px 10px; border-radius:12px; font-size:11px; font-weight:600; }
.badge.pending{ background:#fbe7d0; color:#a15a00; }
.badge.sent, .badge.completed, .badge.active{ background:#dcefe1; color:#1e7a3d; }
.badge.draft{ background:#e8e8e8; color:#555; }
.badge.scheduled{ background:#f7f0e3; color:#a1780a; }
.badge.cancelled{ background:#eee; color:#999; }

.row-actions button{
  border:none; background:none; cursor:pointer; color:var(--teal); font-size:12px; margin-right:8px;
}
.row-actions button.del{ color:#b23b3b; }

.modal-backdrop{
  display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5);
  align-items:center; justify-content:center; z-index:50;
}
.modal-backdrop.open{ display:flex; }
.modal{
  background:#fff; padding:24px; border-radius:10px; width:420px; max-width:90vw;
  max-height:85vh; overflow-y:auto;
}
.modal h3{ margin-top:0; color:var(--teal); }
.modal label{ display:block; font-size:12px; color:var(--grey); margin:10px 0 4px; }
.modal input, .modal select, .modal textarea{
  width:100%; padding:8px; border:1px solid var(--border); border-radius:5px; font-size:13px;
}
.modal textarea{ min-height:70px; }
.checkbox-group{ display:flex; flex-direction:column; gap:6px; padding:4px 0; }
.checkbox-label{ display:flex !important; align-items:center; gap:8px; font-size:13px; color:var(--black); margin:0 !important; }
.checkbox-label input[type="checkbox"]{ width:auto !important; }

.task-timestamps{ font-size:11px; margin:10px 0 4px; padding-top:10px; border-top:1px solid var(--border); }

.subtask-list{ margin-bottom:12px; }
.subtask-row{
  padding:8px 0; border-bottom:1px solid var(--border); font-size:12px;
}
.subtask-row:last-child{ border-bottom:none; }
.subtask-row-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.subtask-row-bottom{ display:flex; align-items:center; gap:8px; margin-top:6px; flex-wrap:wrap; }
.subtask-stage{ width:auto !important; flex-shrink:0; font-size:11px !important; padding:4px 6px !important; }
.subtask-stage.subtask-done{ color:#1e7a3d; }
.subtask-desc{ flex:1; word-break:break-word; }
.subtask-desc.subtask-done{ text-decoration:line-through; color:var(--grey); }
.subtask-meta{ font-size:11px; }
.subtask-row .del{ border:none; background:none; color:#b23b3b; cursor:pointer; font-size:15px; flex-shrink:0; line-height:1; }

.subtask-add-form{
  background:var(--light-gold); border-radius:6px; padding:10px; margin-bottom:14px;
}
.subtask-add-form input, .subtask-add-form select, .subtask-add-form textarea{
  width:100% !important; font-size:12px !important; padding:7px !important; margin-bottom:6px;
}
.subtask-add-form textarea{ min-height:50px; resize:vertical; }

.mom-topic-list{ display:flex; flex-direction:column; gap:8px; margin-bottom:6px; }
.mom-topic-card{ background:var(--light-teal); border-radius:6px; padding:8px 12px; font-size:13px; }
.subtask-add-form-row{ display:flex; gap:6px; }
.subtask-add-form-row > input, .subtask-add-form-row > select{ flex:1; width:auto !important; }
.subtask-add-form-datelabel{
  flex:1; display:flex !important; flex-direction:column; gap:2px; font-size:10px !important;
  color:var(--grey); text-transform:uppercase; margin:0 !important;
}
.subtask-add-form-datelabel input{ margin-bottom:0; }
.subtask-add-form .add-btn{ margin-top:2px; }

.checklist-list{ margin-bottom:10px; }
.checklist-row{
  display:flex; align-items:center; gap:8px; padding:5px 0; border-bottom:1px solid var(--border);
  font-size:13px;
}
.checklist-row:last-child{ border-bottom:none; }
.checklist-row input[type="checkbox"]{ width:auto !important; flex-shrink:0; }
.checklist-text{ flex:1; word-break:break-word; }
.checklist-text.checklist-done{ text-decoration:line-through; color:var(--grey); }
.checklist-row .del{ border:none; background:none; color:#b23b3b; cursor:pointer; font-size:15px; flex-shrink:0; line-height:1; }
.checklist-add-form{ display:flex; gap:6px; margin-bottom:14px; }
.checklist-add-form input{ width:auto !important; flex:1; font-size:13px !important; padding:7px !important; }
.checklist-add-form .add-btn{ flex-shrink:0; padding:7px 14px; font-size:12px; }

.activity-details{ margin-top:10px; font-size:12px; }
.activity-details summary{ cursor:pointer; color:var(--teal); font-weight:600; }
.activity-list{ margin-top:8px; max-height:160px; overflow-y:auto; }
.activity-row{ padding:5px 0; border-bottom:1px solid var(--border); }
.activity-row:last-child{ border-bottom:none; }

.report-totals-row td{ border-top:2px solid var(--teal); font-weight:700; background:var(--light-teal); }
.modal-actions{ display:flex; justify-content:flex-end; gap:8px; margin-top:16px; }
.btn-save{ background:var(--teal); color:#fff; border:none; padding:8px 16px; border-radius:5px; cursor:pointer; }
.btn-cancel{ background:none; border:1px solid var(--border); padding:8px 16px; border-radius:5px; cursor:pointer; }

.empty-state{ padding:40px; text-align:center; color:var(--grey); }

.client-header{
  background:#fff; border:1px solid var(--border); border-radius:8px;
  padding:20px 24px; margin-bottom:20px;
}
.client-header h2{ margin:0 0 8px; color:var(--black); font-family:'Playfair Display', serif; }
.client-meta{ display:flex; gap:14px; flex-wrap:wrap; font-size:13px; color:var(--teal); font-weight:600; margin-bottom:6px; }
.muted{ color:var(--grey); font-size:13px; }
.detail-label{ font-size:11px; text-transform:uppercase; color:var(--gold); font-weight:700; margin-top:10px; letter-spacing:0.5px; }

.home-welcome{ margin-bottom:20px; }
.quick-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px; }
.home-welcome h1{
  margin:0; font-size:26px; font-weight:700; color:var(--teal);
  font-family:'Playfair Display', serif;
}
.home-welcome .muted{ font-size:13px; margin-top:4px; }

.detail-section{ margin-bottom:26px; }
.detail-section h3{ margin:0; font-size:15px; color:var(--teal); }
.detail-section .toolbar{ margin-bottom:10px; }
.detail-section .add-btn{ padding:6px 14px; font-size:12px; }

.notif-header{
  display:flex; align-items:center; gap:10px; cursor:pointer;
  background:var(--light-gold); border-radius:8px; padding:12px 16px;
}
.notif-bell{ font-size:16px; }
.notif-badge{
  background:#b23b3b; color:#fff; font-size:11px; font-weight:700;
  padding:2px 8px; border-radius:10px; min-width:18px; text-align:center;
}
.notif-chevron{ margin-left:auto; font-size:12px; }
.notif-body{
  border:1px solid var(--border); border-top:none; border-radius:0 0 8px 8px;
  padding:14px 16px; background:#fff;
}
.notif-body .add-btn{ width:100%; margin-top:6px; }

.detail-two-col{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media (max-width: 800px){ .detail-two-col{ grid-template-columns:1fr; } }

.detail-card{
  background:#fff; border:1px solid var(--border); border-radius:8px;
  padding:14px 18px; margin-bottom:12px;
}
.detail-card-head{ display:flex; gap:12px; align-items:center; margin-bottom:6px; }

.modal-section{
  margin:18px 0 6px; padding-top:12px; border-top:1px solid var(--border);
  font-size:11px; text-transform:uppercase; letter-spacing:0.5px; font-weight:700; color:var(--teal);
}
.modal-section:first-child{ margin-top:0; padding-top:0; border-top:none; }

.login-wrap{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
}
.login-box{
  background:#fff; border:1px solid var(--border); border-radius:10px;
  padding:36px; width:340px; max-width:90vw;
}
.login-box label{ display:block; font-size:12px; color:var(--grey); margin-bottom:6px; }
.login-box input{ width:100%; padding:10px; border:1px solid var(--border); border-radius:5px; font-size:14px; }
.login-error{
  background:#fbe3e3; color:#b23b3b; padding:10px 14px; border-radius:6px;
  font-size:13px; margin-bottom:16px; text-align:center;
}

.badge.overdue{ background:#fbe3e3; color:#b23b3b; }

.filter-bar{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.filter-bar input, .filter-bar select{
  padding:8px 10px; border:1px solid var(--border); border-radius:6px; font-size:13px; background:#fff;
}
.filter-bar input{ flex:1; min-width:180px; }
.view-toggle{ display:flex; border:1px solid var(--border); border-radius:6px; overflow:hidden; }
.view-toggle button{
  background:#fff; border:none; padding:8px 14px; font-size:13px; cursor:pointer; color:var(--grey);
}
.view-toggle button.active{ background:var(--teal); color:#fff; }

.board-wrap{ display:flex; gap:14px; overflow-x:auto; padding-bottom:8px; }
.board-column{
  background:#fff; border:1px solid var(--border); border-radius:8px;
  min-width:220px; flex:1; display:flex; flex-direction:column; max-height:70vh;
}
.board-column-head{
  padding:10px 14px; font-size:12px; font-weight:700; color:var(--teal); text-transform:uppercase;
  letter-spacing:0.5px; border-bottom:1px solid var(--border); background:var(--light-teal);
  border-radius:8px 8px 0 0;
}
.board-column-body{ padding:10px; overflow-y:auto; flex:1; }
.board-card{
  background:var(--light-gold); border:1px solid var(--border); border-radius:6px;
  padding:10px 12px; margin-bottom:10px; cursor:grab; font-size:13px;
}
.board-card:active{ cursor:grabbing; }
.board-card-desc{ font-weight:600; margin-bottom:6px; }
.board-card-meta{ display:flex; justify-content:space-between; align-items:center; gap:6px; }

.attachment-list{ display:flex; flex-wrap:wrap; gap:8px; margin-top:4px; }
.attachment-chip{
  display:inline-flex; align-items:center; gap:6px; background:var(--light-teal);
  border-radius:14px; padding:4px 6px 4px 12px; font-size:12px;
}
.attachment-chip a{ color:var(--teal); text-decoration:none; font-weight:600; }
.attachment-chip a:hover{ text-decoration:underline; }
.attachment-chip button{
  border:none; background:none; color:var(--grey); cursor:pointer; font-size:14px; line-height:1;
  padding:2px 4px;
}
.attach-btn{
  display:inline-block; margin-top:10px; padding:6px 12px; border:1px dashed var(--border);
  border-radius:6px; font-size:12px; color:var(--teal); cursor:pointer; background:#fff;
}
.attach-btn:hover{ background:var(--light-gold); }

.cal-nav{ display:flex; align-items:center; justify-content:center; gap:20px; margin-bottom:14px; }
.cal-nav button{
  background:#fff; border:1px solid var(--border); border-radius:6px; padding:8px 16px;
  cursor:pointer; font-size:13px; color:var(--teal); font-weight:600;
}
.cal-nav button:hover{ background:var(--light-teal); }
.cal-month-label{ font-size:18px; font-weight:700; color:var(--black); font-family:'Playfair Display', serif; min-width:200px; text-align:center; }

.cal-grid{
  display:grid; grid-template-columns:repeat(7, 1fr); gap:1px;
  background:var(--border); border:1px solid var(--border); border-radius:8px; overflow:hidden;
}
.cal-day-head{
  background:var(--light-teal); color:var(--teal); text-align:center; padding:8px 0;
  font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.5px;
}
.cal-cell{
  background:#fff; min-height:96px; padding:6px; cursor:pointer; transition:background 0.1s;
}
.cal-cell:hover{ background:var(--light-gold); }
.cal-cell-empty{ background:#faf8f2; cursor:default; }
.cal-cell-empty:hover{ background:#faf8f2; }
.cal-cell-today{ background:var(--light-teal); }
.cal-cell-today:hover{ background:var(--light-teal); }
.cal-daynum{ font-size:12px; font-weight:700; color:var(--grey); margin-bottom:4px; }
.cal-chips{ display:flex; flex-direction:column; gap:3px; }
.cal-chip{
  font-size:10px; padding:3px 6px; border-radius:4px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer;
  border-left:3px solid transparent;
}
.cal-chip-principal.cal-chip-completed{ background:var(--light-teal); color:var(--teal); border-left-color:var(--teal); font-weight:600; }
.cal-chip-followup.cal-chip-completed{ background:var(--light-indigo); color:var(--indigo); border-left-color:var(--indigo); font-weight:600; }
.cal-chip-principal.cal-chip-scheduled{ background:#fff; border:1px dashed var(--teal); border-left:1px dashed var(--teal); color:var(--teal); }
.cal-chip-followup.cal-chip-scheduled{ background:#fff; border:1px dashed var(--indigo); border-left:1px dashed var(--indigo); color:var(--indigo); }
.cal-chip-cancelled{ background:#f2f2f2; color:#999; text-decoration:line-through; border:none; border-left:3px solid #ccc; }

.cal-chip-task{ background:var(--light-gold); color:#7a5a1a; border-left-color:var(--gold); }
.cal-chip-task-completed{ background:#dcefe1; color:#1e7a3d; border-left-color:#1e7a3d; text-decoration:line-through; }

.cal-legend{ display:flex; gap:16px; flex-wrap:wrap; margin-bottom:14px; font-size:12px; color:var(--grey); }
.cal-legend-item{ display:flex; align-items:center; gap:6px; }
.cal-legend-swatch{ width:12px; height:12px; border-radius:3px; display:inline-block; }
.cal-legend-swatch.principal{ background:var(--teal); }
.cal-legend-swatch.followup{ background:var(--indigo); }

.visit-progress-wrap{ background:#fff; border:1px solid var(--border); border-radius:8px; padding:16px 20px; }
.visit-progress-row{ display:flex; align-items:flex-start; gap:14px; margin-bottom:16px; padding-bottom:16px; border-bottom:1px solid var(--border); }
.visit-progress-row:last-child{ margin-bottom:0; padding-bottom:0; border-bottom:none; }
.visit-progress-name{ width:200px; font-size:13px; font-weight:600; flex-shrink:0; padding-top:4px; }
.visit-progress-bars{ flex:1; display:flex; flex-direction:column; gap:8px; }
.visit-progress-subrow{ display:flex; align-items:center; gap:12px; }
.visit-progress-sublabel{ width:70px; font-size:11px; color:var(--grey); text-transform:uppercase; letter-spacing:0.5px; flex-shrink:0; }
.visit-progress-bar-track{ flex:1; height:10px; background:var(--light-teal); border-radius:5px; overflow:hidden; }
.visit-progress-bar-fill{ height:100%; border-radius:5px; }
.visit-progress-bar-fill.met{ background:#1e7a3d; }
.visit-progress-bar-fill.under{ background:var(--gold); }
.visit-progress-count{ width:170px; text-align:right; font-size:12px; flex-shrink:0; }