/* ============================================================
   IBH CRM — Premium Dark Theme
   ============================================================ */

:root {
  /* Brand */
  --brand-blue: #0A2E73;
  --brand-red: #ed1c24;

  /* Core palette */
  --primary: #2563eb;
  --primary-light: #60a5fa;
  --primary-dark: #1e3a8a;
  --success: #22c55e;
  --warning: #f59e0b;
  --danger: #ef4444;
  --accent: #ed1c24;

  /* Surfaces */
  --bg-body: #1a1d27;
  --card-bg: rgba(255, 255, 255, .04);
  --card-bg-gradient: linear-gradient(135deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 100%);
  --border: rgba(255, 255, 255, .08);
  --modal-bg: #1e2231;

  /* Gray scale — INVERTED for dark theme inline var() compat */
  --gray-50: rgba(255, 255, 255, .03);
  --gray-100: rgba(255, 255, 255, .05);
  --gray-200: rgba(255, 255, 255, .08);
  --gray-300: rgba(255, 255, 255, .12);
  --gray-400: rgba(255, 255, 255, .38);
  --gray-500: rgba(255, 255, 255, .50);
  --gray-600: rgba(255, 255, 255, .65);
  --gray-700: rgba(255, 255, 255, .80);
  --gray-800: rgba(255, 255, 255, .92);
  --gray-900: #151820;

  /* Radii & shadows */
  --radius: 10px;
  --radius-lg: 16px;
  --shadow: 0 1px 2px rgba(0,0,0,.3), 0 4px 12px rgba(0,0,0,.2);
  --shadow-md: 0 4px 16px rgba(0,0,0,.4), 0 12px 40px rgba(0,0,0,.25);
  --shadow-glow: 0 0 30px rgba(37, 99, 235, .15);

  /* Glass */
  --glass-bg: rgba(255, 255, 255, .04);
  --glass-border: rgba(255, 255, 255, .08);
  --glass-blur: blur(20px);
}

/* Inbound call workspace */
.inbound-start,.inbound-workspace,.inbound-callbar{max-width:1500px;margin-left:auto;margin-right:auto}
.inbound-start-heading{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}
.inbound-start-heading h2{margin:0 0 4px;font-size:22px;color:var(--gray-800)}
.inbound-start-heading p,.inbound-muted{margin:0;color:var(--gray-500);font-size:13px}
.inbound-start-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.inbound-start-section{background:var(--card-bg);border:1px solid var(--glass-border);border-radius:8px;padding:20px}
.inbound-start-section h3{margin:0 0 16px;color:var(--gray-800);font-size:16px}
.inbound-start-section label,.inbound-fields label,.inbound-medical-notes{display:flex;flex-direction:column;gap:5px;color:var(--gray-500);font-size:11px;font-weight:600;text-transform:uppercase}
.inbound-start-section input,.inbound-fields input,.inbound-fields select,.inbound-fields textarea,.inbound-medical-notes textarea{width:100%;box-sizing:border-box;padding:10px 11px;border:1px solid var(--glass-border);border-radius:6px;background:var(--card-bg);color:var(--gray-800);font:400 14px Roboto,sans-serif;text-transform:none}
.inbound-start-section input:focus,.inbound-fields input:focus,.inbound-fields select:focus,.inbound-fields textarea:focus,.inbound-medical-notes textarea:focus{outline:2px solid rgba(59,130,246,.35);border-color:var(--primary-light)}
.inbound-form-grid,.inbound-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.inbound-span-2{grid-column:1/-1}
.inbound-date-parts,.inbound-button-field{margin:0;padding:0;border:0}.inbound-date-parts legend,.inbound-button-field legend{margin-bottom:7px;color:var(--gray-500);font-size:11px;font-weight:600;text-transform:uppercase}.inbound-date-parts{display:grid;grid-template-columns:minmax(150px,1.5fr) minmax(90px,.7fr) minmax(110px,1fr);gap:10px}.inbound-date-parts select{width:100%;box-sizing:border-box;padding:10px 11px;border:1px solid var(--glass-border);border-radius:6px;background:var(--card-bg);color:var(--gray-800);font:400 14px Roboto,sans-serif;text-transform:none}.inbound-button-field .inbound-choice-grid{margin:0}.inbound-button-field-compact .inbound-choice-grid{max-width:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.inbound-button-field-compact .inbound-choice-grid-count-4{grid-template-columns:repeat(4,minmax(0,1fr))}.inbound-button-field-compact .inbound-choice-grid-count-5{grid-template-columns:repeat(5,minmax(0,1fr))}.inbound-button-field-compact .inbound-choice{min-height:40px;padding:6px;font-size:11px}
.inbound-search-results{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.inbound-search-result{display:flex;flex-direction:column;gap:3px;text-align:left;padding:10px 12px;border:1px solid var(--glass-border);border-radius:6px;background:transparent;color:var(--gray-800);cursor:pointer}
.inbound-search-result:hover{border-color:var(--primary-light);background:rgba(59,130,246,.08)}
.inbound-search-result span{font-size:12px;color:var(--gray-500)}
.inbound-error{color:#ef4444;font-size:13px}
.inbound-callbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px;padding:10px 14px;border:1px solid var(--glass-border);border-radius:8px;background:var(--card-bg)}
.inbound-callbar>div{display:flex;align-items:center;gap:10px;min-width:0}
.inbound-callbar strong{color:var(--gray-800)}
.inbound-callbar span{color:var(--gray-500);font-size:12px}
.inbound-callbar-actions{flex-shrink:0}.inbound-save-state{min-width:42px;text-align:right}
.inbound-workspace{display:grid;grid-template-columns:minmax(210px,260px) minmax(420px,1fr) minmax(230px,300px);gap:10px;align-items:stretch}
.inbound-outline,.inbound-stage,.inbound-summary{border:1px solid var(--glass-border);border-radius:8px;background:var(--card-bg)}
.inbound-outline,.inbound-summary{position:sticky;top:12px;max-height:calc(100vh - 180px);overflow:auto}
.inbound-panel-title{position:sticky;top:0;z-index:2;padding:12px 14px;border-bottom:1px solid var(--glass-border);background:var(--card-bg);color:var(--gray-800);font-size:12px;font-weight:700;text-transform:uppercase}
.inbound-outline-section{padding:8px}.inbound-outline-heading{padding:6px 7px;color:var(--gray-500);font-size:10px;font-weight:700;text-transform:uppercase}
.inbound-outline-step{width:100%;display:flex;align-items:center;gap:8px;padding:7px;border:0;border-radius:5px;background:transparent;color:var(--gray-600);font:400 12px Roboto,sans-serif;text-align:left;cursor:pointer}
.inbound-outline-step:hover{background:rgba(148,163,184,.1);color:var(--gray-800)}
.inbound-outline-step span{width:7px;height:7px;border:1px solid var(--gray-500);border-radius:50%;flex-shrink:0}
.inbound-outline-step.current{background:rgba(59,130,246,.14);color:#93c5fd;font-weight:600}.inbound-outline-step.current span{border-color:#60a5fa;background:#60a5fa}
.inbound-outline-step.complete span{border-color:#22c55e;background:#22c55e}.inbound-outline-step.skipped{opacity:.55}
.inbound-stage{position:relative;height:calc(100vh - 180px);min-height:420px;padding:18px 22px;overflow:hidden;display:flex;flex-direction:column}.inbound-step-meta{margin-bottom:6px;color:var(--primary-light);font-size:11px;font-weight:700;text-transform:uppercase}
.inbound-stage-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.inbound-stage-heading h2{min-width:0;margin:0;color:var(--gray-800);font-size:20px}.inbound-script-page{min-height:0;flex-shrink:0}.inbound-script-copy{color:var(--gray-800);font-size:15px;line-height:1.38;white-space:pre-line}.inbound-response-screen-title{padding:12px 0;color:var(--gray-600);font-size:14px;font-weight:700}.inbound-script-pagination{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;padding-top:10px;border-top:1px solid var(--glass-border)}.inbound-script-pagination>span{color:var(--gray-500);font-size:11px;font-weight:600}.inbound-script-pagination>div{display:flex;gap:7px}
.inbound-prompt,.inbound-info-check{margin-top:16px;padding:10px 12px;border-left:3px solid var(--primary-light);background:rgba(59,130,246,.08);color:var(--gray-600);font-size:13px}
.inbound-contact-sms{display:flex;flex-direction:column;gap:10px;padding:13px;border:1px solid var(--glass-border);border-radius:6px;background:rgba(59,130,246,.06)}.inbound-contact-sms>div:first-child{display:flex;justify-content:space-between;gap:12px}.inbound-contact-sms strong{color:var(--gray-800);font-size:13px}.inbound-contact-sms span{color:var(--gray-500);font-size:11px}.inbound-contact-sms p{margin:0;color:var(--gray-600);font-size:12px;line-height:1.4}.inbound-contact-sms-actions{display:flex;align-items:center;gap:10px}.inbound-contact-sms-actions .inbound-contact-sms-error{color:var(--danger)}
#inbound-response-area{margin-top:16px;flex-shrink:0}.inbound-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.inbound-choice-grid-compact{max-width:320px}
.inbound-choice{min-height:52px;padding:10px 14px;border:1px solid var(--glass-border);border-radius:6px;background:transparent;color:var(--gray-800);font:600 14px Roboto,sans-serif;cursor:pointer}
.inbound-choice:hover,.inbound-choice.selected{border-color:var(--primary-light);background:rgba(59,130,246,.12)}
.inbound-fields textarea,.inbound-medical-notes textarea{min-height:72px;resize:vertical}.inbound-step-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px;padding-top:12px;border-top:1px solid var(--glass-border)}
.inbound-stage-compact #inbound-response-area{margin-top:10px}.inbound-stage-compact .inbound-fields{margin-bottom:8px}.inbound-stage-compact .inbound-step-actions{margin-top:10px;padding-top:8px}
.inbound-stage-dense .inbound-stage-heading{margin-bottom:8px}.inbound-stage-dense .inbound-script-copy{font-size:13px;line-height:1.25}.inbound-stage-dense .inbound-script-pagination{margin-top:8px;padding-top:8px}
.inbound-stage-combined{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);grid-template-rows:auto auto minmax(0,1fr) auto;column-gap:18px}.inbound-stage-combined .inbound-step-meta,.inbound-stage-combined .inbound-stage-heading{grid-column:1/-1}.inbound-stage-combined .inbound-script-page{grid-column:1;grid-row:3}.inbound-stage-combined .inbound-script-pagination{grid-column:1;grid-row:4}.inbound-stage-combined #inbound-response-area{grid-column:2;grid-row:3;margin-top:0;min-width:0}.inbound-stage-combined .inbound-fields{grid-template-columns:1fr;gap:8px;margin-bottom:0}.inbound-stage-combined .inbound-fields textarea{min-height:54px}.inbound-stage-combined .inbound-step-actions{grid-column:2;grid-row:4;margin-top:8px;padding-top:8px}.inbound-stage-rates #inbound-response-area{margin-top:7px}.inbound-stage-rates .inbound-step-actions{margin-top:7px;padding-top:7px}
.inbound-stage-no-info-check #inbound-response-area{display:none}.inbound-stage-no-info-check .inbound-step-actions{margin-top:8px;padding-top:8px}
.inbound-toolkits-open{flex-shrink:0;white-space:nowrap}.inbound-toolkits-review[hidden]{display:none}.inbound-toolkits-review{position:fixed;inset:0;z-index:1100}.inbound-toolkits-backdrop{position:absolute;inset:0;background:rgba(4,9,20,.62)}.inbound-toolkits-drawer{position:absolute;top:82px;right:16px;width:min(800px,calc(100vw - 280px));max-height:calc(100vh - 98px);display:grid;grid-template-rows:auto auto auto minmax(180px,1fr);overflow:hidden;border:1px solid var(--glass-border);border-radius:8px;background:#202532;box-shadow:0 24px 70px rgba(0,0,0,.45)}.inbound-toolkits-drawer>header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 14px;border-bottom:1px solid var(--glass-border)}.inbound-toolkits-drawer>header>div{display:flex;align-items:baseline;gap:10px}.inbound-toolkits-drawer>header strong{color:var(--gray-800);font-size:16px}.inbound-toolkits-drawer>header span{color:var(--gray-500);font-size:11px;text-transform:uppercase}.inbound-toolkits-close{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--glass-border);border-radius:6px;background:transparent;color:var(--gray-700);font:400 24px/1 Roboto,sans-serif;cursor:pointer}.inbound-toolkits-close:hover{border-color:var(--primary-light);color:var(--gray-900)}.inbound-toolkits-context,.inbound-toolkits-profile{display:grid;gap:0;margin:0;border-bottom:1px solid var(--glass-border)}.inbound-toolkits-context{grid-template-columns:repeat(4,minmax(0,1fr))}.inbound-toolkits-profile{grid-template-columns:repeat(6,minmax(0,1fr));background:rgba(255,255,255,.025)}.inbound-toolkits-context>div,.inbound-toolkits-profile>div{min-width:0;padding:9px 12px;border-right:1px solid var(--glass-border)}.inbound-toolkits-context>div:last-child,.inbound-toolkits-profile>div:last-child{border-right:0}.inbound-toolkits-context dt,.inbound-toolkits-profile dt{color:var(--gray-500);font-size:9px;font-weight:700;text-transform:uppercase}.inbound-toolkits-context dd,.inbound-toolkits-profile dd{margin:3px 0 0;overflow:hidden;color:var(--gray-800);font-size:12px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.inbound-toolkits-profile dd{font-size:11px}.inbound-toolkits-results{min-height:180px;overflow-y:auto;padding:12px 14px}.inbound-toolkits-loading{min-height:150px;display:flex;align-items:center;justify-content:center;gap:10px;color:var(--gray-600);font-size:13px}.inbound-toolkits-loading .spinner{width:18px;height:18px}.inbound-toolkits-results-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px}.inbound-toolkits-results-heading>div{display:flex;flex-direction:column}.inbound-toolkits-results-heading strong{color:var(--gray-800);font-size:13px}.inbound-toolkits-results-heading span{color:var(--gray-500);font-size:10px}.inbound-toolkits-product-list{display:flex;flex-direction:column;gap:6px}.inbound-toolkits-product{display:grid;grid-template-columns:minmax(220px,1.5fr) minmax(130px,1fr) 96px;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--glass-border);border-radius:6px;background:rgba(255,255,255,.025)}.inbound-toolkits-product.saved{border-color:rgba(96,165,250,.7);background:rgba(59,130,246,.12)}.inbound-toolkits-product>div{min-width:0;display:flex;flex-direction:column}.inbound-toolkits-product strong{color:var(--gray-800);font-size:12px}.inbound-toolkits-product>strong{text-align:right}.inbound-toolkits-product span{overflow:hidden;color:var(--gray-500);font-size:10px;text-overflow:ellipsis;white-space:nowrap}.inbound-toolkits-message{padding:12px;border:1px solid var(--glass-border);border-radius:6px;background:rgba(59,130,246,.07)}.inbound-toolkits-message strong{color:var(--gray-800);font-size:13px}.inbound-toolkits-message p{margin:3px 0 0;color:var(--gray-500);font-size:11px;line-height:1.45}.inbound-toolkits-error{border-color:rgba(239,68,68,.4);background:rgba(239,68,68,.08)}.inbound-toolkits-saved-rates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:9px}.inbound-toolkits-saved-rate{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;align-items:center;padding:8px 9px;border:1px solid var(--glass-border);border-radius:6px}.inbound-toolkits-saved-rate span{grid-row:1/3;color:var(--primary-light);font-size:9px;font-weight:700;text-transform:uppercase}.inbound-toolkits-saved-rate strong{color:var(--gray-800);font-size:12px}.inbound-toolkits-saved-rate em{color:var(--gray-500);font-size:10px;font-style:normal}
.inbound-presented-rates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.inbound-presented-rate{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;align-items:center;padding:9px 10px;border:1px solid var(--glass-border);border-radius:6px;background:transparent;color:var(--gray-800);text-align:left;cursor:pointer}.inbound-presented-rate:hover,.inbound-presented-rate.selected,.inbound-alternate-rate.selected{border-color:var(--primary-light);background:rgba(59,130,246,.1)}.inbound-presented-rate span{grid-row:1/3;color:var(--primary-light);font-size:10px;font-weight:700;text-transform:uppercase}.inbound-presented-rate strong{font-size:14px}.inbound-presented-rate em{color:var(--gray-500);font-size:11px;font-style:normal}.inbound-alternate-rate{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;padding:9px 10px;border:1px solid var(--glass-border);border-radius:6px}.inbound-alternate-rate label{display:flex;flex-direction:column;gap:4px;color:var(--gray-500);font-size:10px;font-weight:700;text-transform:uppercase}.inbound-alternate-rate select,.inbound-alternate-rate input{width:100%;box-sizing:border-box;padding:8px 9px;border:1px solid var(--glass-border);border-radius:5px;background:var(--card-bg);color:var(--gray-800);font:400 13px Roboto,sans-serif}.inbound-alternate-rate>span{grid-column:1/-1;color:var(--gray-500);font-size:10px}
.inbound-medical-entry{display:flex;flex-direction:column;gap:14px}.inbound-record-list{display:flex;flex-direction:column;gap:7px}
.inbound-record-list>div{display:flex;flex-direction:column;gap:2px;padding:7px 0;border-bottom:1px solid var(--glass-border)}
.inbound-record-list strong{color:var(--gray-800);font-size:12px}.inbound-record-list span{color:var(--gray-500);font-size:11px;line-height:1.35}
.inbound-summary{padding-bottom:12px}.inbound-facts{margin:0;padding:8px 14px}.inbound-facts>div{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--glass-border)}
.inbound-companion{display:flex;flex-direction:column;gap:2px;margin:10px 14px 4px;padding:10px;border:1px solid rgba(96,165,250,.35);border-radius:6px;background:rgba(59,130,246,.09)}.inbound-companion span{color:#60a5fa;font-size:10px;font-weight:700;text-transform:uppercase}.inbound-companion strong{color:var(--gray-800);font-size:13px}.inbound-companion small{color:var(--gray-500);font-size:11px}
.inbound-facts dt{color:var(--gray-500);font-size:11px}.inbound-facts dd{margin:0;color:var(--gray-800);font-size:12px;text-align:right}
.inbound-summary-heading{margin:10px 14px 4px;color:var(--gray-500);font-size:10px;font-weight:700;text-transform:uppercase}.inbound-summary .inbound-record-list{padding:0 14px}
.inbound-complete{padding:16px;border:1px solid rgba(34,197,94,.35);border-radius:6px;background:rgba(34,197,94,.08);color:var(--gray-800)}.inbound-complete p{color:var(--gray-500);font-size:13px}
.inbound-match-heading{max-width:1500px;margin:0 auto 10px;display:flex;align-items:center;justify-content:space-between;gap:18px}.inbound-match-heading span{color:var(--primary-light);font-size:11px;font-weight:700;text-transform:uppercase}.inbound-match-heading h2{margin:2px 0 0;color:var(--gray-800);font-size:20px}.inbound-match-heading-actions{display:flex;gap:8px;flex-shrink:0}
.inbound-match-layout{max-width:1500px;height:calc(100vh - 190px);min-height:650px;margin:0 auto;display:grid;grid-template-columns:minmax(430px,520px) minmax(600px,1fr);gap:10px}.inbound-match-profile,.inbound-match-quoter{border:1px solid var(--glass-border);border-radius:8px;background:var(--card-bg);overflow:hidden}.inbound-match-profile{overflow-y:auto;overflow-anchor:none;overscroll-behavior:contain;scroll-behavior:auto}.inbound-match-profile section{padding:13px 14px;border-bottom:1px solid var(--glass-border)}.inbound-match-profile section:last-child{border-bottom:0}.inbound-match-profile h3{margin:0 0 8px;color:var(--gray-800);font-size:12px;text-transform:uppercase}.inbound-match-profile .inbound-facts{padding:0}.inbound-match-records{display:flex;flex-direction:column;gap:7px}.inbound-match-records>div{display:flex;flex-direction:column;gap:2px;padding:7px 8px;border-radius:5px;background:rgba(255,255,255,.04)}.inbound-match-records strong{color:var(--gray-800);font-size:12px}.inbound-match-records span,.inbound-match-records p{margin:0;color:var(--gray-500);font-size:11px;line-height:1.4}.inbound-match-result .inbound-fields{grid-template-columns:1fr 1fr}.inbound-match-result>span{display:block;margin-top:6px;color:var(--gray-500);font-size:10px}.inbound-match-quoter{background:var(--card-bg);overflow-y:auto}.inbound-quote-board{padding:12px 14px;display:flex;flex-direction:column;gap:10px}.inbound-quote-controls{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}.inbound-quote-controls label{display:flex;flex-direction:column;gap:3px;color:var(--gray-500);font-size:11px}.inbound-quote-controls input,.inbound-quote-controls select{padding:6px 8px;border:1px solid var(--glass-border);border-radius:5px;background:var(--card-bg);color:var(--gray-800);font-size:13px}.inbound-quote-status{color:var(--gray-500);font-size:11px}.inbound-quote-table{width:100%;border-collapse:collapse;font-size:12px}.inbound-quote-table th{position:sticky;top:0;background:var(--card-bg);text-align:left;padding:6px 8px;border-bottom:1px solid var(--glass-border);color:var(--gray-800);font-size:11px;text-transform:uppercase}.inbound-quote-table td{padding:6px 8px;border-bottom:1px solid var(--glass-border);color:var(--gray-800)}.inbound-quote-table td.num,.inbound-quote-table th.num{text-align:right;font-variant-numeric:tabular-nums}.inbound-quote-table tbody tr:first-child td{font-weight:600}.inbound-quote-flag{color:#e0a000;font-weight:700;cursor:help}
.inbound-rate-set{margin:2px 0 10px;border-top:1px solid var(--glass-border)}.inbound-rate-row{display:grid;grid-template-columns:88px 1fr 1fr;align-items:end;gap:8px;padding:9px 0;border-bottom:1px solid var(--glass-border)}.inbound-rate-row label,.inbound-result-notes{display:flex;flex-direction:column;gap:4px;color:var(--gray-500);font-size:10px;font-weight:700;text-transform:uppercase}.inbound-rate-row input[type="number"],.inbound-result-notes textarea{width:100%;padding:8px 9px;border:1px solid var(--glass-border);border-radius:5px;background:var(--card-bg);color:var(--gray-800);font:400 13px Roboto,sans-serif;text-transform:none}.inbound-rate-primary{align-self:center!important;flex-direction:row!important;align-items:center;gap:6px!important;color:var(--gray-800)!important}.inbound-rate-primary input{accent-color:var(--primary)}.inbound-result-notes{margin-bottom:9px}.inbound-result-notes textarea{min-height:62px;resize:vertical}
.inbound-match-result [hidden]{display:none!important}
.inbound-objections-fab{position:fixed;right:22px;bottom:84px;z-index:1000;display:inline-flex;align-items:center;gap:9px;padding:12px 20px;border:1px solid var(--glass-border);border-radius:999px;background:linear-gradient(135deg,rgba(10,46,115,.96),rgba(10,46,115,.82));color:#fff;font:700 14px Roboto,sans-serif;letter-spacing:.02em;cursor:pointer;box-shadow:0 12px 34px rgba(4,9,20,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.inbound-objections-fab:hover{border-color:var(--primary-light);box-shadow:0 16px 42px rgba(4,9,20,.6);transform:translateY(-1px)}
.inbound-objections-fab-dot{width:9px;height:9px;border-radius:50%;background:var(--brand-red);box-shadow:0 0 0 4px rgba(237,28,36,.22)}
.inbound-objections-panel[hidden]{display:none}
.inbound-objections-panel{position:fixed;inset:0;z-index:1300}
.inbound-objections-backdrop{position:absolute;inset:0;background:rgba(4,9,20,.62)}
.inbound-objections-drawer{position:absolute;right:16px;bottom:16px;top:auto;width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 96px);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--glass-border);border-radius:12px;background:#202532;box-shadow:0 24px 70px rgba(0,0,0,.5)}
.inbound-objections-drawer>header{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--glass-border)}
.inbound-objections-drawer>header strong{flex:1;color:var(--gray-800);font-size:15px}
.inbound-objections-back{padding:6px 10px;border:1px solid var(--glass-border);border-radius:6px;background:transparent;color:var(--gray-700);font:600 12px Roboto,sans-serif;cursor:pointer}
.inbound-objections-back:hover{border-color:var(--primary-light);color:var(--gray-900)}
.inbound-objections-back[hidden]{display:none}
.inbound-objections-close{width:32px;height:32px;flex-shrink:0;display:grid;place-items:center;border:1px solid var(--glass-border);border-radius:6px;background:transparent;color:var(--gray-700);font:400 24px/1 Roboto,sans-serif;cursor:pointer}
.inbound-objections-close:hover{border-color:var(--primary-light);color:var(--gray-900)}
.inbound-objections-list{display:flex;flex-direction:column;gap:10px;padding:16px;overflow-y:auto}
.inbound-objection-target{display:flex;flex-direction:column;gap:4px;min-height:64px;padding:14px 16px;border:1px solid var(--glass-border);border-radius:9px;background:var(--card-bg);color:var(--gray-800);text-align:left;cursor:pointer}
.inbound-objection-target:hover{border-color:var(--primary-light);background:rgba(59,130,246,.12)}
.inbound-objection-target span{font:700 15px Roboto,sans-serif}
.inbound-objection-target em{color:var(--gray-500);font-size:11px;font-style:normal;text-transform:uppercase;letter-spacing:.03em}
.inbound-objections-detail{padding:16px;overflow-y:auto}
.inbound-objections-detail[hidden]{display:none}
.inbound-objection-detail-pane[hidden]{display:none}
.inbound-objection-detail-label{margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--glass-border);color:var(--primary-light);font:700 12px Roboto,sans-serif;text-transform:uppercase;letter-spacing:.03em}
.inbound-objections-detail .inbound-script-copy{font-size:15px;line-height:1.45}
@media(max-width:768px){.inbound-objections-fab{right:14px;bottom:76px;padding:11px 17px}.inbound-objections-drawer{right:8px;left:8px;bottom:8px;width:auto;max-height:calc(100vh - 80px)}}
@media(max-width:1180px){.inbound-workspace{grid-template-columns:220px minmax(0,1fr)}.inbound-summary{position:static;grid-column:1/-1;display:grid;grid-template-columns:180px 1fr 1fr;max-height:none;gap:10px}.inbound-summary .inbound-panel-title{position:static;border-right:1px solid var(--glass-border);border-bottom:0}}
@media(max-width:1100px){.inbound-match-layout{height:auto;min-height:0;grid-template-columns:1fr}.inbound-match-profile{max-height:none}.inbound-match-quoter{height:760px}}
@media(max-width:768px){.inbound-start-grid,.inbound-workspace{grid-template-columns:1fr}.inbound-start-grid{gap:10px}.inbound-form-grid,.inbound-fields{grid-template-columns:1fr}.inbound-span-2{grid-column:auto}.inbound-date-parts{grid-template-columns:1.4fr .7fr 1fr}.inbound-callbar{align-items:flex-start}.inbound-callbar>div:first-child{flex-direction:column;align-items:flex-start;gap:2px}.inbound-callbar-actions{flex-wrap:wrap;justify-content:flex-end}.inbound-outline{position:static;max-height:210px}.inbound-stage,.inbound-stage-combined{height:auto;min-height:0;padding:16px;display:flex}.inbound-script-copy{font-size:15px}.inbound-choice-grid,.inbound-presented-rates{grid-template-columns:1fr}.inbound-alternate-rate{grid-template-columns:1fr}.inbound-button-field .inbound-choice-grid,.inbound-button-field-compact .inbound-choice-grid-count-4,.inbound-button-field-compact .inbound-choice-grid-count-5{grid-template-columns:repeat(2,minmax(0,1fr))}.inbound-summary{grid-column:auto;display:block}.inbound-summary .inbound-panel-title{border-right:0;border-bottom:1px solid var(--glass-border)}.inbound-step-actions,.inbound-script-pagination{flex-wrap:wrap}.inbound-match-heading{align-items:flex-start;flex-direction:column}.inbound-match-heading-actions{width:100%}.inbound-match-heading-actions .btn{flex:1}.inbound-match-result .inbound-fields{grid-template-columns:1fr}.inbound-match-result .inbound-span-2{grid-column:auto}.inbound-toolkits-drawer{top:66px;right:8px;width:calc(100vw - 16px);max-height:calc(100vh - 74px)}.inbound-toolkits-context{grid-template-columns:1fr 1fr}.inbound-toolkits-profile{grid-template-columns:repeat(2,minmax(0,1fr))}.inbound-toolkits-product{grid-template-columns:1fr 90px}.inbound-toolkits-product>span{grid-column:1/-1;grid-row:2}.inbound-toolkits-saved-rates{grid-template-columns:1fr}}

/* ---- Reset ---- */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--bg-body);
  color: rgba(255, 255, 255, .85);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

/* Ambient background glow */
body::before {
  content: '';
  position: fixed;
  top: -40%;
  left: -20%;
  width: 80%;
  height: 80%;
  background: radial-gradient(ellipse, rgba(37, 99, 235, .1) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}
body::after {
  content: '';
  position: fixed;
  bottom: -30%;
  right: -15%;
  width: 70%;
  height: 70%;
  background: radial-gradient(ellipse, rgba(237, 28, 36, .06) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Fira Sans', 'Roboto', sans-serif;
  color: #fff;
  letter-spacing: -.01em;
}

a { color: var(--primary-light); text-decoration: none; }
a:hover { color: #93bbfc; }

.hidden { display: none !important; }

/* ---- Scrollbars ---- */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,.12); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.2); }

/* ============================================================
   Layout
   ============================================================ */

.app { display: flex; min-height: 100vh; position: relative; z-index: 1; }

/* ---- Sidebar ---- */
.sidebar {
  width: 250px;
  background: rgba(30, 32, 38, .85);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  color: #fff;
  padding: 0;
  position: fixed;
  height: 100vh;
  overflow-y: auto;
  z-index: 100;
  border-right: 1px solid var(--glass-border);
}

.sidebar-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 20px;
  background: rgba(255, 255, 255, .1);
  border-bottom: 1px solid var(--glass-border);
}

.sidebar-logo-img {
  width: 100%;
  max-width: 180px;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.3));
}

.sidebar-nav {
  padding: 12px 0;
}

.sidebar-nav a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 24px;
  color: rgba(255,255,255,.45);
  text-decoration: none;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: .01em;
  transition: all .2s ease;
  border-left: 3px solid transparent;
  position: relative;
}

.sidebar-nav a:hover {
  background: rgba(255, 255, 255, .04);
  color: rgba(255,255,255,.9);
  border-left-color: rgba(255,255,255,.2);
}

.sidebar-nav a.active {
  background: linear-gradient(90deg, rgba(37, 99, 235, .12), transparent);
  color: #fff;
  border-left-color: var(--primary-light);
  font-weight: 500;
}

.sidebar-section {
  padding: 24px 24px 6px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: var(--primary-light);
  opacity: .7;
}

/* ---- Main & Topbar ---- */
.main {
  flex: 1;
  margin-left: 250px;
  min-height: 100vh;
  min-width: 0;
  overflow-x: hidden;
  position: relative;
  z-index: 1;
}

.topbar {
  background: rgba(26, 29, 39, .65);
  backdrop-filter: blur(24px) saturate(1.4);
  -webkit-backdrop-filter: blur(24px) saturate(1.4);
  border-bottom: 1px solid var(--glass-border);
  padding: 14px 28px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 50;
  color: #fff;
}

.content { padding: 28px; }

/* ============================================================
   Login Page
   ============================================================ */

.login-page {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(37, 99, 235, .15) 0%, transparent 50%),
    radial-gradient(ellipse at 70% 80%, rgba(237, 28, 36, .08) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 50%, rgba(255,255,255,.02) 0%, transparent 80%),
    var(--bg-body);
}

.login-logo {
  display: block;
  width: 100px;
  height: 100px;
  object-fit: contain;
  margin: 0 auto 20px;
  filter: drop-shadow(0 4px 20px rgba(37, 99, 235, .2));
}

.login-box {
  background: rgba(255, 255, 255, .04);
  backdrop-filter: blur(40px) saturate(1.2);
  -webkit-backdrop-filter: blur(40px) saturate(1.2);
  border: 1px solid rgba(255, 255, 255, .08);
  padding: 48px 40px;
  border-radius: 20px;
  box-shadow:
    0 24px 80px rgba(0, 0, 0, .4),
    0 0 1px rgba(255, 255, 255, .1) inset;
  width: 440px;
  max-width: 90vw;
}

.login-box h1 {
  margin-bottom: 4px;
  text-align: center;
  font-family: 'Fira Sans', sans-serif;
  font-size: 26px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.02em;
}

/* ============================================================
   Cards — Glassmorphism
   ============================================================ */

.card {
  background: var(--card-bg-gradient);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow), 0 0 1px rgba(255,255,255,.05) inset;
  padding: 22px;
  margin-bottom: 16px;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  border-color: rgba(255, 255, 255, .12);
}

.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.card-header h2 {
  font-size: 16px;
  font-weight: 600;
  color: #fff;
}

/* ============================================================
   Stats Grid
   ============================================================ */

.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
  margin-bottom: 28px;
}

.stat-card {
  background: var(--card-bg-gradient);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 22px;
  position: relative;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

/* Accent top edge */
.stat-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--primary-light), var(--accent));
  opacity: .5;
}

.stat-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md), var(--shadow-glow);
  border-color: rgba(255, 255, 255, .12);
}

.stat-card .label {
  font-size: 12px;
  font-weight: 500;
  color: rgba(255,255,255,.45);
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.stat-card .value {
  font-size: 30px;
  font-weight: 700;
  color: #fff;
  font-family: 'Fira Sans', sans-serif;
  letter-spacing: -.02em;
}

.stat-card .sub {
  font-size: 12px;
  color: rgba(255,255,255,.35);
  margin-top: 4px;
}

/* ============================================================
   Tables
   ============================================================ */

.table-wrap {
  overflow-x: auto;
  border-radius: var(--radius);
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}

th {
  text-align: left;
  padding: 12px 14px;
  background: rgba(37, 99, 235, .08);
  border-bottom: 1px solid var(--glass-border);
  font-weight: 600;
  color: rgba(255,255,255,.55);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

td {
  padding: 11px 14px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  color: rgba(255,255,255,.75);
}

tr {
  transition: background .15s ease;
}

tr:hover td { background: rgba(255, 255, 255, .03); }

.clickable { cursor: pointer; }

/* ============================================================
   Pipeline / Kanban
   ============================================================ */

.pipeline-board {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  padding-bottom: 16px;
}

.pipeline-column {
  min-width: 280px;
  max-width: 320px;
  flex-shrink: 0;
}

.pipeline-column-header {
  padding: 11px 14px;
  border-radius: var(--radius) var(--radius) 0 0;
  color: white;
  font-weight: 600;
  font-size: 13px;
  display: flex;
  justify-content: space-between;
  letter-spacing: .01em;
}

.pipeline-column-body {
  background: rgba(255, 255, 255, .02);
  border-radius: 0 0 var(--radius) var(--radius);
  padding: 8px;
  min-height: 200px;
  border: 1px solid var(--glass-border);
  border-top: none;
}

.pipeline-card {
  background: rgba(255, 255, 255, .04);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid var(--glass-border);
  border-radius: 10px;
  padding: 14px;
  margin-bottom: 8px;
  box-shadow: var(--shadow);
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.pipeline-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  border-color: rgba(255, 255, 255, .12);
}

.pipeline-card .name { font-weight: 600; font-size: 14px; color: #fff; }
.pipeline-card .meta { font-size: 12px; color: rgba(255,255,255,.4); margin-top: 4px; }

/* ============================================================
   Badges
   ============================================================ */

.badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.badge-green {
  background: rgba(34, 197, 94, .12);
  color: #4ade80;
  border: 1px solid rgba(34, 197, 94, .2);
  box-shadow: 0 0 12px rgba(34, 197, 94, .08);
}
.badge-yellow {
  background: rgba(245, 158, 11, .12);
  color: #fbbf24;
  border: 1px solid rgba(245, 158, 11, .2);
  box-shadow: 0 0 12px rgba(245, 158, 11, .08);
}
.badge-red {
  background: rgba(239, 68, 68, .12);
  color: #f87171;
  border: 1px solid rgba(239, 68, 68, .2);
  box-shadow: 0 0 12px rgba(239, 68, 68, .08);
}
.badge-blue {
  background: rgba(59, 130, 246, .12);
  color: #60a5fa;
  border: 1px solid rgba(59, 130, 246, .2);
  box-shadow: 0 0 12px rgba(59, 130, 246, .08);
}
.badge-gray {
  background: rgba(255, 255, 255, .05);
  color: rgba(255,255,255,.5);
  border: 1px solid rgba(255, 255, 255, .1);
}

/* ---- State / Compliance badges ---- */

.state-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  cursor: help;
  position: relative;
}

.state-badge.federal {
  background: rgba(34, 197, 94, .1);
  color: #4ade80;
  border: 1px solid rgba(34, 197, 94, .2);
}
.state-badge.moderate {
  background: rgba(245, 158, 11, .1);
  color: #fbbf24;
  border: 1px solid rgba(245, 158, 11, .2);
}
.state-badge.strict {
  background: rgba(239, 68, 68, .1);
  color: #f87171;
  border: 1px solid rgba(239, 68, 68, .2);
}

.state-badge .tooltip {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: rgba(26, 29, 39, .95);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: #fff;
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 400;
  white-space: nowrap;
  z-index: 200;
  margin-top: 6px;
  border: 1px solid var(--glass-border);
  box-shadow: var(--shadow-md);
}

.state-badge:hover .tooltip { display: block; }

/* Compliance table row tints */
.compliance-federal  { background: rgba(34, 197, 94, .04); }
.compliance-moderate { background: rgba(245, 158, 11, .04); }
.compliance-strict   { background: rgba(239, 68, 68, .04); }

/* ============================================================
   Forms
   ============================================================ */

.form-group { margin-bottom: 18px; }

.form-group label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: rgba(255,255,255,.55);
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: .04em;
}

input[type="text"], input[type="email"], input[type="password"], input[type="number"],
input[type="date"], input[type="datetime-local"], input[type="tel"],
select, textarea {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 10px;
  font-size: 14px;
  font-family: inherit;
  background: rgba(255, 255, 255, .04);
  color: #fff;
  transition: border-color .2s, box-shadow .2s, background .2s;
}

input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--primary-light);
  background: rgba(37, 99, 235, .06);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .15), 0 0 20px rgba(37, 99, 235, .08);
}

textarea { resize: vertical; min-height: 80px; }

select option {
  background: #1a1d24;
  color: #fff;
}

/* ============================================================
   Buttons
   ============================================================ */

.btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 18px;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  letter-spacing: .01em;
  transition: all .2s ease;
  position: relative;
}

.btn:active { transform: scale(.97); }

.btn-primary {
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  color: white;
  box-shadow: 0 2px 12px rgba(37, 99, 235, .3), 0 0 1px rgba(255,255,255,.1) inset;
}

.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(37, 99, 235, .4), 0 0 1px rgba(255,255,255,.15) inset;
}

.btn-success {
  background: linear-gradient(135deg, #16a34a, #15803d);
  color: white;
  box-shadow: 0 2px 12px rgba(22, 163, 74, .3), 0 0 1px rgba(255,255,255,.1) inset;
}

.btn-success:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(22, 163, 74, .4);
}

.btn-danger {
  background: linear-gradient(135deg, #ef4444, #dc2626);
  color: white;
  box-shadow: 0 2px 12px rgba(239, 68, 68, .3), 0 0 1px rgba(255,255,255,.1) inset;
}

.btn-danger:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(239, 68, 68, .4);
}

.btn-outline {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .1);
  color: rgba(255,255,255,.65);
}

.btn-outline:hover {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .18);
  color: #fff;
}

.btn-sm { padding: 5px 12px; font-size: 12px; }
.btn-group { display: flex; gap: 8px; flex-wrap: wrap; }

/* ============================================================
   Filters
   ============================================================ */

.filters {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
  align-items: center;
}

.filters input, .filters select { width: auto; min-width: 180px; }
.search-input { position: relative; }
.search-input input { padding-left: 36px; }

/* ============================================================
   Modals
   ============================================================ */

.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .6);
  backdrop-filter: blur(12px) saturate(.8);
  -webkit-backdrop-filter: blur(12px) saturate(.8);
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: 8vh;
  z-index: 1000;
}

.modal {
  background: var(--modal-bg);
  backdrop-filter: blur(40px) saturate(1.2);
  -webkit-backdrop-filter: blur(40px) saturate(1.2);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 20px;
  box-shadow:
    0 24px 80px rgba(0, 0, 0, .5),
    0 0 1px rgba(255,255,255,.08) inset;
  width: 560px;
  max-width: 90vw;
  max-height: 80vh;
  overflow-y: auto;
}

.modal-header {
  padding: 20px 24px;
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal-header h3 { font-size: 17px; color: #fff; font-weight: 600; }
.modal-body { padding: 24px; }

.modal-footer {
  padding: 16px 24px;
  border-top: 1px solid rgba(255, 255, 255, .06);
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.modal-close {
  background: rgba(255,255,255,.06);
  border: none;
  font-size: 18px;
  cursor: pointer;
  color: rgba(255,255,255,.4);
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .15s;
}

.modal-close:hover {
  background: rgba(255,255,255,.1);
  color: #fff;
}

/* ============================================================
   Notifications
   ============================================================ */

.notif-bell { position: relative; cursor: pointer; font-size: 20px; }

.notif-count {
  position: absolute;
  top: -6px;
  right: -8px;
  background: var(--accent);
  color: white;
  font-size: 10px;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 10px;
  min-width: 16px;
  text-align: center;
  box-shadow: 0 0 10px rgba(237, 28, 36, .4);
}

.notif-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: -12px;
  background: rgba(26, 29, 39, .95);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 14px;
  box-shadow: var(--shadow-md);
  width: 380px;
  max-height: 420px;
  overflow-y: auto;
  z-index: 200;
}

.notif-item {
  padding: 14px 18px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  cursor: pointer;
  font-size: 13px;
  transition: background .15s;
}

.notif-item.unread {
  background: rgba(37, 99, 235, .06);
  border-left: 3px solid var(--primary-light);
}

.notif-item:hover { background: rgba(255, 255, 255, .04); }
.notif-item .title { font-weight: 600; color: #fff; }
.notif-item .time { font-size: 11px; color: rgba(255,255,255,.35); margin-top: 3px; }

/* ============================================================
   Activity Timeline
   ============================================================ */

.timeline { position: relative; padding-left: 28px; }

.timeline::before {
  content: '';
  position: absolute;
  left: 9px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: linear-gradient(180deg, var(--primary-light), rgba(255,255,255,.06));
  border-radius: 1px;
}

.timeline-item {
  position: relative;
  padding-bottom: 18px;
}

.timeline-item::before {
  content: '';
  position: absolute;
  left: -23px;
  top: 4px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--primary-light);
  border: 2px solid var(--bg-body);
  box-shadow: 0 0 10px rgba(37, 99, 235, .4);
}

.timeline-item.system::before { background: rgba(255,255,255,.3); box-shadow: none; }
.timeline-item.stage_change::before { background: var(--warning); box-shadow: 0 0 10px rgba(245, 158, 11, .4); }
.timeline-item.disposition::before { background: #ef4444; box-shadow: 0 0 10px rgba(239, 68, 68, .4); }
.timeline-item.disposition .ti-header strong { color: #ef4444; }

.timeline-item .ti-header { font-size: 13px; color: rgba(255,255,255,.45); }
.timeline-item .ti-body { font-size: 14px; margin-top: 4px; color: rgba(255,255,255,.8); }

/* ============================================================
   Loading / Empty / Spinner
   ============================================================ */

.loading { text-align: center; padding: 48px; color: rgba(255,255,255,.35); }
.empty   { text-align: center; padding: 48px; color: rgba(255,255,255,.35); }

.spinner {
  display: inline-block;
  width: 28px;
  height: 28px;
  border: 3px solid rgba(255,255,255,.08);
  border-top-color: var(--primary-light);
  border-radius: 50%;
  animation: spin .7s linear infinite;
}

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes call-pop { from { transform: scale(0.8); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes pulse-ring { 0% { box-shadow: 0 0 0 0 rgba(34,197,94,.4); } 70% { box-shadow: 0 0 0 20px rgba(34,197,94,0); } 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); } }

/* ============================================================
   Responsive
   ============================================================ */

/* Hamburger — hidden on desktop */
.hamburger {
  display: none;
  background: none;
  border: none;
  color: #fff;
  font-size: 22px;
  cursor: pointer;
  padding: 4px 8px;
  margin-right: 8px;
}

/* Mobile overlay backdrop */
.sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .5);
  z-index: 99;
}

@media (max-width: 768px) {
  .hamburger { display: block; }

  .sidebar {
    transform: translateX(-100%);
    transition: transform .25s ease;
  }
  .sidebar.open {
    transform: translateX(0);
  }

  /* Overlay behind sidebar when open */
  .sidebar.open ~ .main .sidebar-overlay,
  .sidebar.open + .sidebar-overlay {
    display: block;
  }

  .main { margin-left: 0; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .pipeline-board { flex-direction: column; }
  .pipeline-column { min-width: auto; max-width: none; }
  .content { padding: 12px; }
  .topbar { padding: 10px 12px; }

  /* Modals — full width on mobile */
  .modal {
    width: 100%;
    max-width: 100vw;
    max-height: 100vh;
    border-radius: 0;
    margin: 0;
  }
  .modal-overlay {
    padding-top: 0;
    align-items: stretch;
  }
  .modal-body { padding: 16px; }
  .modal-header { padding: 14px 16px; }
  .modal-footer { padding: 12px 16px; }

  /* Notification dropdown — full width on mobile */
  .notif-dropdown {
    position: fixed;
    top: 50px;
    left: 0;
    right: 0;
    width: auto;
    max-height: 70vh;
    border-radius: 0 0 14px 14px;
  }

  /* Forms — stack columns on mobile */
  .modal-body [style*="grid-template-columns: 1fr 1fr"],
  .modal-body [style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Buttons — larger touch targets */
  .btn { min-height: 40px; padding: 8px 16px; }
  .btn-sm { min-height: 36px; padding: 6px 12px; }

  /* Tables — touch-friendly scroll */
  .table-wrap { -webkit-overflow-scrolling: touch; }

  /* Cards — reduce padding */
  .card { padding: 14px; }
  .card-header { flex-wrap: wrap; gap: 8px; }

  /* Featured.com & script modals — full screen on mobile */
  .featured-modal-inner,
  .script-modal-inner {
    max-width: 100vw !important;
    width: 100% !important;
    max-height: 100vh !important;
    border-radius: 0 !important;
    padding: 16px !important;
  }
  #featured-modal,
  #script-modal {
    padding: 0 !important;
  }

  /* Featured modal header/footer padding */
  .featured-modal-inner > div:first-child { padding: 14px 16px 12px !important; }

  /* Inline grids in any modal */
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Action button rows — wrap on mobile */
  [style*="display:flex"][style*="gap"] {
    flex-wrap: wrap;
  }

  /* All multi-column grids — stack on mobile */
  .lead-detail-grid,
  .resp-grid-2,
  .content [style*="grid-template-columns:1fr 1fr"],
  .content [style*="grid-template-columns: 1fr 1fr"],
  .content [style*="grid-template-columns:1fr 2fr"],
  .content [style*="grid-template-columns: 1fr 2fr"],
  .content [style*="grid-template-columns:2fr 1fr"],
  .content [style*="grid-template-columns: 2fr 1fr"],
  .content [style*="grid-template-columns:1fr 1fr 1fr"],
  .content [style*="grid-template-columns: 1fr 1fr 1fr"],
  .content [style*="grid-template-columns:1fr 1fr 1fr auto"] {
    grid-template-columns: 1fr !important;
  }

  /* Profile grid inside lead detail — single column */
  .lead-field { font-size: 13px; }

  /* Filters — stack on mobile */
  .filters {
    flex-direction: column;
    gap: 8px;
  }
  .filters input,
  .filters select {
    width: 100% !important;
  }

  /* Seedance grids — allow smaller cards */
  .content [style*="minmax(320px"],
  .content [style*="minmax(340px"],
  .content [style*="minmax(300px"] {
    grid-template-columns: 1fr !important;
  }

  /* Tables — allow wrapping on mobile */
  td, th { white-space: normal; }
  td { font-size: 13px; }

  /* ContentHelm queue controls */
  .card-header .btn-group { width: 100%; }
  .card-header .btn-group select,
  .card-header .btn-group input { width: 100% !important; min-width: 0 !important; }
}

/* Inbound script agent notes: visually subordinate to spoken script text */
.inbound-script-copy .inbound-note {
  font-size: 0.82em;
  font-style: italic;
  color: var(--gray-500, #8a93a6);
  opacity: 0.85;
}

/* One-click answer-call entry: primary path onto the script */
.inbound-answer-btn {
  display: block;
  width: 100%;
  padding: 16px 20px;
  font-size: 17px;
  font-weight: 600;
  margin: 4px 0 20px;
  border-radius: 12px;
}

/* Inbound email HTML normalization — carrier emails arrive with fixed-width
   tables (600-800px) and images that can 404; constrain everything to the
   modal and let broken images be hidden by the modal's error handler. */
.email-html-body { overflow-x: auto; }
.email-html-body table { width: 100% !important; max-width: 100% !important; }
.email-html-body img { max-width: 100% !important; height: auto !important; }
.email-html-body td, .email-html-body th, .email-html-body div,
.email-html-body p, .email-html-body span {
  max-width: 100% !important;
  overflow-wrap: break-word;
  word-break: break-word;
}
.email-html-body img.email-img-broken { display: none !important; }