/* Shared visual refresh for all CRM modules. This layer is presentation-only. */
:root {
  --ivory: #f7f6f2;
  --midnight: #0e2943;
  --midnight-2: #173a5b;
  --gold: #c49a24;
  --gold-pale: #fbf4df;
  --ink: #172f4d;
  --muted-ink: #6d7f94;
  --hairline: #e3e8ee;
  --card-shadow: 0 8px 24px rgba(19, 43, 69, .055);
}

html, body { background: var(--ivory); }
body { color: var(--ink); }

/* Editorial type for headings and prominent numeric figures. */
h1, h2, h3, h4, h5, h6,
.page-head h2,
.stat .val,
.dstat strong,
.dstat .value,
.tile .ct,
.kpi-value,
.kpi strong,
.metric-value,
.amount,
.total,
.count,
.number,
.summary-number,
.chart-number {
  font-family: Georgia, "Times New Roman", serif;
}

.stat .val,
.dstat strong,
.dstat .value,
.tile .ct,
.kpi-value,
.kpi strong,
.metric-value,
.amount,
.total,
.count,
.number,
.summary-number,
.chart-number {
  font-variant-numeric: lining-nums tabular-nums;
}

/* Admin data surfaces use the UI face; Georgia is reserved for headings. */
.layout .stat,
.layout .dstat,
.layout .tile,
.layout .kpi,
.layout .metric,
.layout table,
.layout .badge,
.layout .trow {
  font-family: var(--font-ui);
}
.layout .stat .lbl,
.layout .dstat .lbl,
.layout .tile .nm,
.layout th,
.layout label,
.layout button,
.layout input,
.layout select,
.layout textarea {
  font-family: var(--font-ui);
}

/* Legacy module templates set Inter directly on every element; target the
   numeric nodes themselves so the requested face wins consistently. */
.layout .num,
.layout .dstat .num,
.layout .stat .val,
.layout .tile .ct,
.layout .kpi-value,
.layout .metric-value,
.layout .amount,
.layout .total,
.layout .count,
.layout .number,
.layout .summary-number,
.layout .chart-number {
  font-family: var(--font-ui) !important;
  font-variant-numeric: tabular-nums;
}

.sidebar {
  width: 226px;
  background: linear-gradient(180deg, #102b46 0%, #0e2943 52%, #112f4c 100%);
  box-shadow: 8px 0 26px rgba(8, 26, 44, .12);
}
.sidebar .brand { padding: 28px 22px 24px; }
.sidebar .brand .fn { font-size: 18px; letter-spacing: -.15px; }
.sidebar .brand .tag { color: #e4c75d; }
.userbox { position:relative; padding-left:58px; }
.userbox:before { content:'A'; position:absolute; left:18px; top:18px; width:31px; height:31px; display:grid; place-items:center; border:1px solid #d6b347; border-radius:50%; color:#f2d46d; font:700 13px Georgia,serif; }
.nav { padding: 18px 10px; }
.nav a { min-height: 42px; border-radius: 9px; font-size: 13px; }
.nav a.active { box-shadow: inset 3px 0 0 var(--gold), 0 5px 14px rgba(5,20,37,.14); }
.userbox { padding: 18px 18px 20px 58px; }

.main { margin-left: 244px !important; padding: 112px 34px 44px !important; }
.layout, .main { min-width:0; max-width:100%; width:100%; }
body { overflow-x:hidden; }
.main { overflow-x:hidden; }
.app-topbar { position:absolute !important; top:0; left:244px; right:0; min-height:112px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:18px 34px 16px; background:var(--ivory) !important; border-bottom:1px solid rgba(218,225,232,.85); z-index:80; }
.topbar-title { display:flex; flex-direction:column; gap:2px; }.topbar-title span { color:#9a7014; font:700 10px var(--font-ui); letter-spacing:2px; }.topbar-title strong { color:var(--ink); font:700 clamp(24px,2.4vw,36px) Georgia,serif; letter-spacing:-.7px; }.topbar-title small { color:var(--muted-ink); font:12px var(--font-ui); }
.topbar-tools { display:flex; align-items:center; gap:14px; }
.topbar-search { width:min(360px,42vw); height:42px; display:flex; align-items:center; gap:10px; padding:0 12px; border:1px solid #dce3ea; border-radius:9px; background:#fff; color:#8a9aab; box-shadow:0 3px 12px rgba(20,43,68,.04); }
.topbar-search span { flex:1; font:12px var(--font-ui); }.topbar-search kbd { padding:2px 6px; border:1px solid #dce3ea; border-radius:4px; font:11px var(--font-ui); }
.global-search-panel{position:absolute;top:52px;right:88px;width:min(430px,calc(100vw - 32px));z-index:50;padding:10px;border:1px solid #dce3ea;border-radius:10px;background:#fff;box-shadow:0 12px 30px rgba(20,43,68,.16)}.global-search-input{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid #dce3ea;border-radius:7px;font:13px Poppins,sans-serif;outline:none}.global-search-input:focus{border-color:#173554;box-shadow:0 0 0 2px rgba(23,53,84,.1)}.global-search-results{max-height:360px;overflow:auto;margin-top:6px}.global-search-result{display:flex;align-items:center;gap:10px;width:100%;padding:10px 8px;border:0;border-bottom:1px solid #edf1f5;background:#fff;text-align:left;color:#173554;cursor:pointer;font:13px Poppins,sans-serif}.global-search-result:hover{background:#f5f8fb}.global-search-result i{color:#b38b20}.global-search-result span{display:flex;flex-direction:column;min-width:0}.global-search-result small{color:#8190a0;font-size:11px;margin-top:2px}.global-search-hint{padding:14px 8px;color:#8190a0;font:12px Poppins,sans-serif}
.topbar-actions { display:flex; align-items:center; gap:10px; }.topbar-icon,.topbar-profile { border:1px solid #dce3ea; background:#fff; color:var(--ink); border-radius:9px; height:42px; }.topbar-icon { width:42px; color:var(--gold); }.profile-menu{position:relative}.topbar-profile{display:inline-flex;align-items:center;gap:8px;min-width:76px;padding:4px 9px 4px 5px;font:700 14px Georgia,serif}.profile-avatar{display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:var(--midnight);color:#f2d46d;font:700 12px Georgia,serif}.profile-chevron{display:grid;place-items:center;color:#8a6a13;font-size:12px}.profile-dropdown{display:none;position:absolute;right:0;top:calc(100% + 9px);width:218px;padding:8px;background:#fff;border:1px solid #dce3ea;border-radius:11px;box-shadow:0 14px 34px rgba(13,35,58,.18);z-index:100}.profile-menu.open .profile-dropdown{display:block}.profile-dropdown-user{padding:8px 10px 10px;border-bottom:1px solid #edf1f4}.profile-dropdown-user strong,.profile-dropdown-user span{display:block}.profile-dropdown-user strong{color:var(--ink);font:700 13px var(--font-ui);overflow-wrap:anywhere}.profile-dropdown-user span{margin-top:3px;color:var(--muted-ink);font:11px var(--font-ui)}.profile-signout{display:flex;align-items:center;gap:9px;width:100%;margin-top:5px;padding:9px 10px;border:0;border-radius:7px;background:transparent;color:#9b3328;text-align:left;font:600 12px var(--font-ui);cursor:pointer}.profile-signout:hover,.profile-signout:focus{background:#fdf0ee;outline:none}.profile-signout i{font-size:14px}
.page-head { margin-bottom: 22px; }
.main > .page-head { height:0; min-height:0; margin:0 0 64px !important; padding:0; position:relative; z-index:25; }
.main > .page-head h2, .main > .page-head .sub { display:none; }
.main > .page-head > div:last-child { position:absolute; right:0; top:10px; z-index:30; display:flex; flex-wrap:wrap; gap:8px; }
.main > .page-head > div:last-child .btn,
.main > .page-head > div:last-child .btn-sm { margin:0; min-height:36px; }
.main > .page-head + .panel,
.main > .page-head + .cards,
.main > .page-head + .dstrip,
.main > .page-head + .statgrid { margin-top:0 !important; }
.main > .dstrip, .main > .statgrid, .main > .cards { margin-top:48px; }
.main > .page-head + .cards { margin-top:80px !important; }
.page-head h2 { color: var(--ink); font-size: 26px; letter-spacing: -.55px; }
.page-head .sub { color: var(--muted-ink); }

.panel, .stat, .tile, .trow, .sec {
  border-color: var(--hairline);
  box-shadow: var(--card-shadow);
}
.panel { border-radius: 14px; padding: 21px; background: #fff; }
.grid2 > .panel { align-self:start; }
/* Dashboard cards share a row; stretch the shorter card so the grid does not
   leave a large empty band beside the taller card. */
.main > .grid2 > .panel { align-self:stretch; }
.panel h3 { color: var(--ink); font-size: 15px; }
.stat { border-radius: 13px; background: #fff; }
.stat .lbl { color: var(--muted-ink); }
.stat .val { color: var(--ink); }

input, select, textarea { border-color: #d9e1e9; border-radius: 8px; }
input:focus, select:focus, textarea:focus { outline: 2px solid rgba(196,154,36,.2); border-color: var(--gold); }
.btn-primary { background: var(--midnight); border-radius: 8px; }
.btn-primary:hover { background: var(--midnight-2); }
.btn-light { border: 1px solid #dce4ec; background: #f1f5f8; border-radius: 8px; }
.badge { padding: 5px 10px; }
th { color: var(--muted-ink); border-bottom-color: #d6dfe8; }
td { border-bottom-color: #edf1f4; }
tr:hover td { background: #fbfcfd; }
.modal { border-radius: 15px; box-shadow: 0 22px 70px rgba(13,35,58,.2); }
.modal-bg { background: rgba(10, 25, 42, .58); }

@media (max-width: 900px) {
  .sidebar { width: 250px; }
  .main { margin-left: 0 !important; padding: 18px 14px 34px !important; }
  .main > .page-head { height:auto; min-height:0; margin-bottom:12px !important; }
  .main > .page-head > div:last-child { position:static; width:100%; justify-content:flex-end; margin-bottom:12px; }
  .app-topbar { position:static !important; min-height:72px; padding:12px 14px; align-items:center; flex-wrap:wrap; }
  .topbar-title { min-width:0; flex:1 1 220px; }.topbar-title strong { font-size:20px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.topbar-title small { display:none; }.topbar-title span { font-size:8px; }.topbar-tools { gap:7px; flex:0 1 auto; }.topbar-search { width:min(280px,42vw); }.topbar-search span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .main > .page-head + .cards, .main > .page-head + .panel, .main > .page-head + .dstrip, .main > .page-head + .statgrid { margin-top:0 !important; }
  .grid2, .grid2 > *, .row2, .pcols { min-width:0 !important; width:100%; }
  .main .toolbar { width:100%; }.main .toolbar input, .main .toolbar select { min-width:0; flex:1 1 160px; }.main table { min-width:640px; }
  .mtop { background: var(--midnight); }
  .page-head h2 { font-size: 22px; }
}
@media (max-width: 560px) {
  .main { padding: 14px 10px 28px !important; }
  .app-topbar { align-items:flex-start; gap:8px; }.topbar-title { flex-basis:100%; }.topbar-tools { width:100%; justify-content:space-between; }.topbar-search { width:calc(100% - 98px); }.topbar-actions { flex-shrink:0; }
  .topbar-icon, .topbar-profile { height:38px; }.main > .page-head > div:last-child { justify-content:stretch; }.main > .page-head > div:last-child .btn, .main > .page-head > div:last-child .btn-sm { flex:1 1 130px; }
  .profile-dropdown{right:0;width:min(218px,calc(100vw - 20px));}
  .panel { padding: 15px; border-radius: 12px; }
  .page-head h2 { font-size: 20px; }
}

/* Responsive safety layer: keeps every module usable without changing content. */
html { min-width: 320px; }
*, *::before, *::after { min-width: 0; }
img, video, canvas, svg { max-width: 100%; height: auto; }
button, .btn, .btn-sm { max-width: 100%; white-space: normal; }
.main .panel, .main .cards, .main .grid2, .main .dstrip, .main .statgrid { min-width: 0; }
.main table { width: 100%; }
.main table th, .main table td { overflow-wrap: anywhere; }
.main .panel:has(table) { overflow-x: auto; }
.modal-bg { padding: max(12px, 4vh) 12px; }
.modal { max-height: calc(100vh - 24px); overflow-y: auto; overflow-x: hidden; }
.modal .actions { flex-wrap: wrap; }
.modal .actions button { min-height: 38px; }
@media (max-width: 900px) {
  .app-topbar { left: 0; }
  .main { padding-top: 16px !important; }
  .main > .page-head > div:last-child { gap: 6px; }
  .main > .page-head > div:last-child .btn, .main > .page-head > div:last-child .btn-sm { min-width: 0; }
  .grid2 { grid-template-columns: minmax(0, 1fr) !important; }
  .cards, .statgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .main .toolbar { align-items: stretch; }
  .main .toolbar > * { max-width: 100%; }
}
@media (max-width: 600px) {
  .cards, .statgrid { grid-template-columns: minmax(0, 1fr); }
  .page-head { gap: 8px; }
  .main > .page-head > div:last-child { width: 100%; }
  .main > .page-head > div:last-child .btn, .main > .page-head > div:last-child .btn-sm { flex: 1 1 120px; }
  .main table { min-width: 620px; }
  .modal-bg { align-items: flex-start; padding: 8px; }
  .modal { width: 100%; max-height: calc(100vh - 16px); padding: 16px; }
  .modal .row2, .modal .grid2, .modal .pcols { grid-template-columns: minmax(0, 1fr) !important; }
  .login-shell { width: 100%; }
  .guest-form-grid, .ob-choice-grid, .ob-contact-layout { grid-template-columns: minmax(0, 1fr) !important; }
  .guest-form-grid .full { grid-column: auto; }
}
@media (max-height: 600px) and (max-width: 900px) {
  .login-brand-panel { min-height: 210px; }
  .login-brand-mark { margin-top: 16px; }
  .modal-bg { padding-top: 6px; }
}
@media (min-resolution: 192dpi) {
  body { font-size: 15px; }
  .btn, .btn-sm, input, select, textarea { min-height: 38px; }
}

/* Dialogs stay above floating assistants while preserving reachable actions. */
.modal-bg{z-index:500}.modal{position:relative}


/* Dashboard and task readability tuning */
.main > .statgrid .stat, .main > .cards .stat, .main > .dstrip .dstat { min-height:92px; padding:20px 21px; }
.main > .grid2 > .panel, .main > .panel { padding:24px; }
.main table th { font:700 11px var(--font-ui); letter-spacing:.65px; }
.main table td { font:500 13px var(--font-ui); line-height:1.45; padding:13px 11px; }
.main table td strong, .main table td b, .main .trow b { font-family:var(--font-ui)!important; font-weight:700; }
.main .trow { padding:12px 15px; min-height:58px; }
.main .trow select { font-family:var(--font-ui); }
@media(max-width:900px){.main > .grid2 > .panel, .main > .panel{padding:19px}.main table td{padding:11px 9px}}
@media(max-width:560px){.main > .statgrid .stat,.main > .cards .stat,.main > .dstrip .dstat{min-height:78px;padding:15px 14px}.main > .grid2 > .panel,.main > .panel{padding:15px}.main table td{padding:10px 8px}.main .trow{padding:10px 11px}}

/* Poppins sizing for dense CRM surfaces */
.page-head .sub{font-size:12px;font-weight:400}.panel h3{font-family:var(--font-ui);font-size:15px;font-weight:600}.stat .lbl,.dstat .cap{font-family:var(--font-ui);font-size:11px;font-weight:600}.stat .val,.dstat .num{font-family:var(--font-ui)!important;font-weight:700}.badge{font-family:var(--font-ui);font-size:10.5px;font-weight:600}.trow b{font-family:var(--font-ui)!important;font-size:13px;font-weight:600}.trow{font-size:12px;font-weight:400}
.userbox:before{content:none}.userbox{position:relative}.userbox-avatar{position:absolute;left:18px;top:18px}.userbox-avatar img,.userbox-avatar .avatar{margin:0!important;width:34px!important;height:34px!important}.profile-avatar img,.profile-avatar .avatar{width:31px!important;height:31px!important;margin:0!important;object-fit:cover}.profile-avatar img{border-radius:50%}
.notification-menu{position:relative}.notification-count{position:absolute;right:3px;top:2px;min-width:15px;height:15px;padding:0 4px;border-radius:9px;background:#c0392b;color:#fff;font-size:9px;font-weight:800;line-height:15px;text-align:center}.notification-dropdown{display:none;position:absolute;right:0;top:calc(100% + 10px);width:320px;max-width:calc(100vw - 28px);background:#fff;border:1px solid #dfe6ed;border-radius:12px;box-shadow:0 16px 40px rgba(18,45,73,.2);z-index:140;padding:0;overflow:hidden}.notification-menu.open .notification-dropdown{display:block}.notification-head{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;border-bottom:1px solid #edf1f5;color:#172d49}.notification-refresh{border:0;background:transparent;color:#2871ae;cursor:pointer;font-size:14px}.notification-list{max-height:320px;overflow:auto}.notification-item{display:flex;align-items:flex-start;gap:10px;width:100%;padding:12px 15px;border:0;border-bottom:1px solid #f0f3f6;background:#fff;color:#334a61;text-align:left;font:500 12px Poppins,sans-serif;cursor:pointer}.notification-item:hover{background:#f5f8fb}.notification-item i{color:#c19b27;font-size:15px;margin-top:1px}.notification-empty{padding:24px 15px;color:#7a8b9d;font-size:12px;text-align:center}@media(max-width:600px){.notification-dropdown{right:-52px;width:300px}}
.notification-item.is-read{background:#fafbfd;color:#8997a5}.notification-item.is-read i{color:#9aa8b6}
.dashboard-recent-notifications{margin-top:18px;padding-top:14px;border-top:1px solid #edf1f5}.dashboard-recent-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;color:#172d49;font-size:12px}.dashboard-recent-item{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid #f0f3f6;font-size:11px;color:#334a61}.dashboard-recent-item i{color:#c19b27}.dashboard-recent-item span{flex:1}.dashboard-recent-item small{color:#8a99a8;font-size:9px}.dashboard-recent-empty{padding:14px 0;color:#8a99a8;font-size:11px}
.notification-page-list{width:100%;max-width:none}.notification-page-item{display:grid;grid-template-columns:auto minmax(0,1fr) 110px auto;align-items:center;gap:12px;width:100%;padding:15px 12px;border:0;border-bottom:1px solid #edf1f5;background:#fff;text-align:left;color:#334a61;font:500 13px Poppins,sans-serif}.notification-page-item:hover{background:#f5f8fb}.notification-page-item i{color:#c19b27}.notification-page-item>span:not(.notification-page-actions){min-width:0;overflow-wrap:anywhere}.notification-page-item small{color:#8a99a8;white-space:nowrap}.notification-page-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;white-space:nowrap}.notification-page-actions .btn-sm{cursor:pointer}.notification-page-item.is-read{background:#fafbfd;color:#8997a5}
@media(max-width:700px){.notification-page-item{grid-template-columns:auto minmax(0,1fr);}.notification-page-item small{grid-column:2}.notification-page-actions{grid-column:2;justify-content:flex-start;flex-wrap:wrap}}
