/* ════════ LUCINA ADMIN — STYLES ════════ */ *{margin:0;padding:0;box-sizing:border-box} :root{ --p:#9774AD;--pd:#6B4F8A;--pl:#F4EFF9;--pm:#DDD0EA; --dk:#1C1C1A;--mid:#55514E;--mu:#8E8983;--bd:#E7E2DC;--bg:#FAF8F5;--wh:#FFFFFF; --g:#4F8A2E;--gl:#EAF6E0;--am:#C28A2B;--al:#FaF3E4;--rd:#B23B3B;--rl:#FBEDEC; --sb:248px;--th:60px; } body{font-family:'DM Sans',-apple-system,sans-serif;background:var(--bg);color:var(--dk);font-size:14px;-webkit-font-smoothing:antialiased} a{color:inherit;text-decoration:none} ::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--pm);border-radius:8px}::-webkit-scrollbar-track{background:transparent} /* ── SIDEBAR ── */ .sb{position:fixed;top:0;left:0;bottom:0;width:var(--sb);background:var(--wh);border-right:1px solid var(--bd);display:flex;flex-direction:column;z-index:50;transition:transform .25s} .sb-logo{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;height:var(--th);padding:0 20px;border-bottom:1px solid var(--bd);box-sizing:border-box} .sb-logo-img{height:24px;object-fit:contain;display:block} .sb-logo-mark{width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,var(--p),var(--pd));color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:18px;font-weight:600} .sb-logo-txt{font-family:'Cormorant Garamond',serif;font-size:19px;font-weight:600;color:var(--dk);line-height:1} .sb-logo-sub{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--mu)} .sb-nav{flex:1;overflow-y:auto;padding:12px 12px 20px} .sb-sec{font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--mu);font-weight:600;padding:14px 10px 6px} .sb-item{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:8px;color:var(--mid);font-size:13px;font-weight:500;cursor:pointer;margin-bottom:2px;transition:all .13s} .sb-item:hover{background:var(--pl);color:var(--pd)} .sb-item.act{background:var(--p);color:#fff} .sb-item.act .sb-ic{opacity:1} .sb-ic{width:18px;height:18px;flex-shrink:0;opacity:.7;display:flex;align-items:center;justify-content:center} .sb-ic svg{width:17px;height:17px} .sb-badge{margin-left:auto;background:var(--rd);color:#fff;font-size:10px;font-weight:700;border-radius:9px;min-width:18px;height:18px;display:flex;align-items:center;justify-content:center;padding:0 5px} .sb-item.act .sb-badge{background:#fff;color:var(--p)} .sb-foot{border-top:1px solid var(--bd);padding:12px} /* ── TOPBAR ── */ .main{margin-left:var(--sb);min-height:100vh} .tb{position:sticky;top:0;height:var(--th);background:rgba(255,255,255,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--bd);display:flex;align-items:center;gap:14px;padding:0 26px;z-index:40;box-sizing:border-box} .tb-burger{display:none;width:34px;height:34px;border:1px solid var(--bd);border-radius:8px;background:#fff;cursor:pointer;align-items:center;justify-content:center;font-size:16px} .tb-title{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600} .tb-icon{width:36px;height:36px;border-radius:9px;border:1px solid var(--bd);background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative;color:var(--mid)} .tb-icon:hover{border-color:var(--p);color:var(--p)} .tb-icon svg{width:19px;height:19px} .bell-badge{position:absolute;top:-5px;right:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--rd);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid var(--wh)} .bell-badge.zero{display:none} /* user dropdown */ .tb-user{position:relative;display:flex;align-items:center;gap:9px;cursor:pointer;padding:4px 10px 4px 4px;border-radius:9px;border:1px solid var(--bd);background:#fff} .tb-user:hover{border-color:var(--p)} .tb-av{width:30px;height:30px;border-radius:50%;background:var(--p);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;flex-shrink:0} .tb-uname{font-size:12.5px;font-weight:600;line-height:1.1} .tb-urole{font-size:10px;color:var(--mu)} .tb-user-caret{font-size:10px;color:var(--mu)} .tb-user-menu{position:absolute;top:calc(100% + 8px);right:0;width:230px;background:#fff;border:1px solid var(--bd);border-radius:11px;box-shadow:0 12px 36px rgba(28,28,26,.16);padding:6px;opacity:0;transform:translateY(-6px);pointer-events:none;transition:all .16s;z-index:60} .tb-user-menu.open{opacity:1;transform:none;pointer-events:auto} .tb-user-head{padding:9px 11px 10px;border-bottom:1px solid var(--bd);margin-bottom:5px} .tb-user-head .tb-urole{font-family:'DM Mono',monospace} .tb-menu-item{padding:9px 11px;font-size:12.5px;color:var(--mid);border-radius:7px;cursor:pointer} .tb-menu-item:hover{background:var(--pl);color:var(--pd)} .tb-menu-item.logout{color:var(--rd)} .tb-menu-sep{height:1px;background:var(--bd);margin:5px 6px} @media (max-width:600px){.tb-user-meta,.tb-user-caret{display:none}} /* ── CONTENT ── */ .ct{padding:24px 30px 70px;max-width:none;width:100%} .pg-head{margin-bottom:20px} .pg-h1{font-family:'Cormorant Garamond',serif;font-size:27px;font-weight:600;line-height:1.1} .pg-desc{font-size:13px;color:var(--mu);margin-top:4px} /* cards / KPIs */ .kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px} .kpi{background:var(--wh);border:1px solid var(--bd);border-radius:13px;padding:16px 17px;position:relative;overflow:hidden} .kpi-ic{width:34px;height:34px;border-radius:9px;background:var(--pl);color:var(--pd);display:flex;align-items:center;justify-content:center;margin-bottom:11px} .kpi-ic svg{width:18px;height:18px} .kpi-v{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:600;line-height:1} .kpi-k{font-size:11.5px;color:var(--mu);margin-top:5px} .kpi-d{font-size:11px;margin-top:7px;font-weight:600;display:flex;align-items:center;gap:4px} .kpi-d.up{color:var(--g)}.kpi-d.dn{color:var(--rd)} .panel{background:var(--wh);border:1px solid var(--bd);border-radius:13px;padding:18px 20px} .panel-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px} .panel-t{font-size:14px;font-weight:600} .panel-link{font-size:12px;color:var(--p);font-weight:600;cursor:pointer} .grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px} .grid-3{display:grid;grid-template-columns:2fr 1fr;gap:14px;margin-bottom:22px} /* admin round 1 — Yes/No confirmation dialog (adminConfirm) above every modal */ .acf-ov{position:fixed;inset:0;background:rgba(28,28,26,.45);z-index:150;display:flex;align-items:center;justify-content:center;padding:20px} .acf{background:#fff;border-radius:14px;box-shadow:0 18px 50px rgba(28,28,26,.28);max-width:400px;width:100%;padding:22px 22px 18px;animation:acfIn .16s ease} @keyframes acfIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}} .acf-t{font-size:15.5px;font-weight:600;color:var(--dk);margin-bottom:6px} .acf-b{font-size:12.5px;color:var(--mu);line-height:1.55} .acf-btns{display:flex;gap:10px;justify-content:flex-end;margin-top:18px} .acf-danger{background:var(--rd)!important;border-color:var(--rd)!important;color:#fff!important} /* §2 inventory: image thumbnails, centered columns, inline auto-sync switch */ .inv-thumb{width:34px;height:34px;border-radius:8px;object-fit:cover;display:block;background:var(--pl)} .inv-thumb.ph{display:flex;align-items:center;justify-content:center;color:var(--mu);font-size:11px} .tbl th.tc,.tbl td.tc{text-align:center} .inv-autosync{display:inline-flex;align-items:center;gap:7px} /* Leads round §12.2 — Management tab: Tags + Categories cards side by side */ .mng-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:2px;align-items:stretch} /* Both cards fill the equal-height column, and each note pins to the card bottom (feedback). */ .mng-grid .mng-col{display:flex;flex-direction:column} .mng-grid .mng-col>*{flex:1;min-height:0} .mng-grid #lp-cats{display:flex;flex-direction:column} .mng-grid .mng-col .mng-box{flex:1;display:flex;flex-direction:column} .mng-grid .mng-col>.dsec{height:100%;box-sizing:border-box} @media(max-width:1100px){.mng-grid{grid-template-columns:1fr}} /* Leads round §1.1 — lead category tabs use the underline style; count badge kept. Owner 2026-07-06: NEVER wrap to a second line — one row with a light, slim horizontal scrollbar when space runs out. */ .lead-tabs2{margin-bottom:14px;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--pm,#cbb8dc) transparent} .lead-tabs2::-webkit-scrollbar{height:5px} .lead-tabs2::-webkit-scrollbar-track{background:transparent} .lead-tabs2::-webkit-scrollbar-thumb{background:var(--bd);border-radius:3px} .lead-tabs2::-webkit-scrollbar-thumb:hover{background:var(--pm,#cbb8dc)} .lead-tabs2 .mk-tab{flex:0 0 auto;white-space:nowrap} /* Leads round §4.2 — call history + recording rows in the lead Activity tab */ .callrec-row{border:1px solid var(--bd);border-radius:10px;padding:8px 11px;margin-bottom:7px;background:var(--wh)} /* Leads round §5 — overlays ABOVE the email compose modal (media picker, add-sender) */ .lmp-ov{position:fixed;inset:0;z-index:10002;background:rgba(30,20,40,.45);display:flex;align-items:center;justify-content:center;padding:16px} .lmp-box{background:var(--wh);border-radius:14px;max-width:560px;width:100%;padding:18px 20px;box-shadow:0 20px 60px rgba(0,0,0,.3);max-height:86vh;overflow:auto} .lmp-item{display:flex;align-items:center;gap:10px;padding:7px 10px;border:1px solid var(--bd);border-radius:10px;margin-bottom:6px;cursor:pointer;background:var(--wh)} .lmp-item:hover{border-color:var(--pm,#cbb8dc)} .lmp-item .lmp-tick{visibility:hidden;color:var(--p);font-weight:700} .lmp-item.sel{border-color:var(--p);background:var(--pl)} .lmp-item.sel .lmp-tick{visibility:visible} /* Leads round §14.4 — bottom-right export progress notification */ .exnotif{position:fixed;right:18px;bottom:18px;z-index:9000;width:320px;max-width:calc(100vw - 36px);background:var(--wh);border:1px solid var(--bd);border-radius:14px;padding:13px 15px;box-shadow:0 14px 44px rgba(30,20,40,.22)} .lead-tabs2 .lead-tab-n{display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:17px;padding:0 5px;border-radius:9px;background:var(--rd);color:#fff;font-size:10px;font-weight:700;margin-left:4px} .ld-selmenu-btn{display:inline-block;margin-left:3px;cursor:pointer;color:var(--mu);font-size:10px;padding:2px} .ld-selmenu-btn:hover{color:var(--p)} /* Leads round §2.5 — dual-thumb quotation-value slider */ .qv-wrap{padding:2px 2px 10px} .qv-vals{display:flex;justify-content:space-between;font-size:11.5px;font-weight:600;color:var(--dk);margin-bottom:6px} .qv-track{position:relative;height:22px} .qv-track input[type=range]{position:absolute;left:0;right:0;top:0;width:100%;pointer-events:none;appearance:none;-webkit-appearance:none;background:none;height:22px;margin:0} .qv-track input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:3px;background:var(--bd);margin-top:8px} .qv-track input[type=range]:first-child::-webkit-slider-runnable-track{background:linear-gradient(90deg,var(--bd),var(--p),var(--bd))} .qv-track input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:15px;height:15px;border-radius:50%;background:var(--p);border:2px solid #fff;box-shadow:0 1px 4px rgba(28,28,26,.3);pointer-events:auto;margin-top:-5px;cursor:pointer} .qv-track input[type=range]::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:var(--p);border:2px solid #fff;pointer-events:auto;cursor:pointer} .qv-track input[type=range]::-moz-range-track{height:5px;border-radius:3px;background:var(--bd)} /* §6 EL Synchronization — import drop zone, time-under-progress, payload popup */ .imp-drop{border:2px dashed var(--pm,#cbb8dc);border-radius:12px;padding:26px 18px;text-align:center;cursor:pointer;transition:all .15s;background:var(--pl)} .imp-drop:hover,.imp-drop.over{border-color:var(--p);background:#fff} .imp-time{font-size:10.5px;color:var(--mu);margin-top:3px} .chg-err{background:#FBEDED;border:1px solid #EFC7C7;border-radius:8px;padding:8px 11px;font-size:12px;color:#8f3d3d;margin-bottom:7px} .chg-json{background:var(--dk);color:#efe9f5;border-radius:10px;padding:14px;font-size:11px;line-height:1.55;overflow:auto;max-height:320px;font-family:'DM Mono',ui-monospace,monospace;white-space:pre-wrap;word-break:break-word} /* §3.6/§3.7 Email Full Profile page — roomy field spacing + template preview */ .efp .fld{margin-bottom:14px} .efp .fld label{display:block;margin-bottom:6px} .efp .fld-row{display:grid;grid-template-columns:1fr 1fr;gap:12px} .efp-opt{color:var(--mu);font-weight:400} .efp-hint{font-size:11px;color:var(--mu);margin-top:5px} .efp-note{font-size:11.5px;color:var(--mu);line-height:1.5;background:var(--pl);border-radius:9px;padding:10px 12px;margin-top:14px} .efp-preview{border:1px solid var(--bd);border-radius:10px;padding:12px 14px;margin-bottom:14px;background:var(--pl);max-height:190px;overflow:auto} .efp-pv-sub{font-size:12px;font-weight:600;color:var(--dk);margin-bottom:6px} .efp-pv-sub span{color:var(--mu);font-weight:700;text-transform:uppercase;font-size:9.5px;letter-spacing:.05em;margin-right:5px} .efp-pv-body{font-size:12px;color:var(--mid);line-height:1.55;border-top:1px solid var(--bd);padding-top:8px;margin-top:4px;word-break:break-word} /* §3.5 full-profile PDF preparation progress */ .pdfp-track{height:8px;border-radius:5px;background:var(--pl);overflow:hidden;position:relative} .pdfp-fill{height:100%;border-radius:5px;background:linear-gradient(90deg,var(--p),var(--pd));width:0;transition:width .3s} .pdfp-fill.indet{width:40%;position:absolute;left:-40%;animation:pdfpSlide 1.2s ease-in-out infinite} @keyframes pdfpSlide{0%{left:-40%}100%{left:100%}} /* admin round 1 §1.3: the 3 lead charts head the dashboard */ /* R3I — four chart panels (ethnicity bars, cohorts spark, source + category donuts) */ .dash-charts{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px} @media(max-width:1500px){.dash-charts{grid-template-columns:1fr 1fr}} @media(max-width:1100px){.dash-charts{grid-template-columns:1fr}} /* §1.2 Leads by Source donut */ .pie-wrap{display:flex;align-items:center;gap:16px;padding:2px 0} .pie-svg{width:128px;height:128px;flex-shrink:0} .pie-legend{display:flex;flex-direction:column;gap:7px;min-width:0;flex:1} .pie-leg-row{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mid)} .pie-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0} .pie-lbl{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .pie-val{font-size:11px;color:var(--mu);white-space:nowrap} /* bar chart */ .bars{display:flex;flex-direction:column;gap:10px} .bar-row{display:flex;align-items:center;gap:10px;font-size:12px} .bar-lbl{width:130px;flex-shrink:0;color:var(--mid)} .bar-track{flex:1;height:10px;background:var(--pl);border-radius:6px;overflow:hidden} .bar-fill{height:100%;background:linear-gradient(90deg,var(--p),var(--pd));border-radius:6px} .bar-val{width:42px;text-align:right;font-weight:600;font-family:'DM Mono',monospace;font-size:11.5px} /* line/area sparkline */ .spark{display:flex;align-items:flex-end;gap:5px;height:120px;padding-top:8px} .spark-bar{flex:1;background:linear-gradient(180deg,var(--p),var(--pm));border-radius:5px 5px 0 0;min-height:6px;transition:height .3s} .quick-links{display:grid;grid-template-columns:1fr 1fr;gap:10px} .ql{display:flex;align-items:center;gap:11px;padding:13px;border:1px solid var(--bd);border-radius:11px;cursor:pointer;transition:all .13s} .ql:hover{border-color:var(--p);background:var(--pl)} .ql-ic{width:34px;height:34px;border-radius:9px;background:var(--pl);color:var(--pd);display:flex;align-items:center;justify-content:center;flex-shrink:0} .ql-t{font-size:13px;font-weight:600} .ql-d{font-size:11px;color:var(--mu)} /* tables */ .tbl-wrap{background:var(--wh);border:1px solid var(--bd);border-radius:13px;overflow:hidden} .tbl-toolbar{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid var(--bd);flex-wrap:wrap} .tbl-scroll{overflow-x:auto} table.tbl{width:100%;border-collapse:collapse;font-size:12.5px} table.tbl th{text-align:left;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--mu);font-weight:600;padding:11px 14px;border-bottom:1px solid var(--bd);background:var(--bg);white-space:nowrap;position:sticky;top:0} table.tbl td{padding:11px 14px;border-bottom:1px solid var(--bd);color:var(--dk);white-space:nowrap} table.tbl tr:last-child td{border-bottom:none} table.tbl tbody tr{cursor:pointer;transition:background .1s} table.tbl tbody tr:hover{background:var(--pl)} .mono{font-family:'DM Mono',monospace;font-size:11.5px} .pill{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;padding:3px 9px;border-radius:11px;white-space:nowrap} .pill.ok{background:var(--gl);color:var(--g)} .pill.warn{background:var(--al);color:var(--am)} .pill.err{background:var(--rl);color:var(--rd)} .pill.neu{background:var(--pl);color:var(--pd)} .pill.gray{background:#EFEDEA;color:var(--mu)} .pill.dot::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;display:inline-block} .unread-dot{width:8px;height:8px;border-radius:50%;background:var(--rd);display:inline-block} /* inputs / filters */ .fbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .fld{display:flex;flex-direction:column;gap:4px} .fld label{font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:var(--mu);font-weight:600} .inp,select.inp{border:1px solid var(--bd);border-radius:8px;padding:8px 10px;font-size:12.5px;font-family:inherit;background:#fff;color:var(--dk);min-width:120px} .inp:focus{outline:none;border-color:var(--p)} select.inp{padding-right:30px;background-image:linear-gradient(45deg,transparent 50%,var(--mu) 50%),linear-gradient(135deg,var(--mu) 50%,transparent 50%);background-position:calc(100% - 15px) 50%,calc(100% - 10px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;-webkit-appearance:none;appearance:none} .search-mini{position:relative} .search-mini input{padding-left:30px;min-width:200px} /* Phase 4: wider inventory search (owner: "search bar is very small") */ .tbl-toolbar .search-mini{flex:1;max-width:480px} .tbl-toolbar .search-mini input{width:100%;min-width:0} .search-mini svg{position:absolute;left:9px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:var(--mu)} .btn{border:1px solid var(--bd);background:#fff;color:var(--dk);font-size:12.5px;font-weight:600;padding:8px 14px;border-radius:8px;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:6px;transition:all .13s} .btn:hover{border-color:var(--p);color:var(--p)} .btn.pri{background:var(--p);border-color:var(--p);color:#fff} .btn.pri:hover{background:var(--pd);border-color:var(--pd);color:#fff} .btn.sm{padding:6px 11px;font-size:11.5px} .btn.gh{background:transparent} .chip-toggle{font-size:11.5px;padding:6px 12px;border-radius:20px;border:1px solid var(--bd);background:#fff;color:var(--mid);cursor:pointer} .chip-toggle.act{background:var(--p);border-color:var(--p);color:#fff} /* drawer */ .drawer-ov{position:fixed;inset:0;background:rgba(28,28,26,.4);opacity:0;pointer-events:none;transition:opacity .25s;z-index:60} .drawer-ov.open{opacity:1;pointer-events:auto} .drawer{position:fixed;top:0;right:0;bottom:0;width:960px;max-width:96vw;background:var(--bg);box-shadow:-8px 0 40px rgba(0,0,0,.18);transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1),width .3s cubic-bezier(.4,0,.2,1),max-width .3s cubic-bezier(.4,0,.2,1);z-index:61;display:flex;flex-direction:column} /* R5-2 — the lead panel is wider so its full action row fits on one line */ .drawer.drawer-lead{width:1120px} .drawer.open{transform:none} .drawer.drawer-expanded{width:100vw;max-width:100vw} /* PHASE-6: full-screen lead panel for screen-sharing — overrides .drawer + .drawer-lead widths + the 96vw cap; the width transition above animates the resize */ .drawer-h{background:#fff;border-bottom:1px solid var(--bd);padding:18px 22px;display:flex;align-items:flex-start;gap:14px} /* R3 §8.8 — the Read/Unread pill sits vertically centered with the Mark-as button beside it */ /* PHASE-8F Fix 7 — Mark-as-Read/Unread + Version History sit on the same line as the expand + ✕ icons, and the status pill is vertically centred against them (the avatar + name stay top-aligned). */ .drawer-h .pill,.drawer-h #lp-readtoggle,.drawer-h #lp-history,.drawer-h .drawer-close{align-self:center} .drawer-close{margin-left:auto;width:32px;height:32px;border-radius:8px;border:1px solid var(--bd);background:#fff;cursor:pointer;font-size:15px;color:var(--mid)} .drawer-body{flex:1;overflow-y:auto;padding:20px 22px 40px} .dsec{margin-bottom:22px} .dsec-t{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mu);font-weight:600;margin-bottom:10px} .kv{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--bd);border:1px solid var(--bd);border-radius:9px;overflow:hidden} .kv>div{background:#fff;padding:9px 12px} .kv-l{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--mu)} .kv-v{font-size:12.5px;font-weight:500;margin-top:2px} .act-feed{display:flex;flex-direction:column;gap:0} .act-item{display:flex;gap:11px;padding:11px 0;border-bottom:1px solid var(--bd)} .act-item:last-child{border-bottom:none} .act-dot{width:26px;height:26px;border-radius:50%;background:var(--pl);color:var(--pd);display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0} .act-dot.email{background:#E6EEF9;color:#3B6CB0}.act-dot.sys{background:#EFEDEA;color:var(--mu)}.act-dot.call{background:var(--gl);color:var(--g)}.act-dot.note{background:var(--al);color:var(--am)} .act-t{font-size:12.5px;font-weight:500} .act-m{font-size:11px;color:var(--mu);margin-top:1px} .note-box{border:1px solid var(--bd);border-radius:9px;background:#fff;padding:4px} .note-box textarea{width:100%;border:none;resize:vertical;min-height:64px;font-family:inherit;font-size:12.5px;padding:8px;color:var(--dk)} .note-box textarea:focus{outline:none} .note-actions{display:flex;justify-content:space-between;align-items:center;padding:6px 8px} .drawer-cta{display:flex;gap:8px;padding:14px 22px;border-top:1px solid var(--bd);background:#fff} /* json viewer */ .json{background:#1C1C1A;color:#E7E2DC;font-family:'DM Mono',monospace;font-size:11.5px;line-height:1.55;padding:14px 16px;border-radius:9px;overflow-x:auto;white-space:pre} .json .k{color:#C9A9E0}.json .s{color:#9FD89F}.json .n{color:#E0B470} /* settings / integration cards */ .int-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px} .int-card{background:var(--wh);border:1px solid var(--bd);border-radius:13px;padding:18px} .int-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px} .int-logo{width:40px;height:40px;border-radius:10px;background:var(--pl);color:var(--pd);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-weight:600;font-size:17px;flex-shrink:0} .int-name{font-size:14px;font-weight:600} .int-cat{font-size:11px;color:var(--mu)} .int-desc{font-size:12px;color:var(--mid);line-height:1.55;margin-bottom:12px} .int-foot{display:flex;align-items:center;justify-content:space-between;gap:10px} .int-key{font-family:'DM Mono',monospace;font-size:11px;color:var(--mu);background:var(--bg);padding:5px 9px;border-radius:6px;border:1px solid var(--bd)} /* toggle switch */ .sw{width:38px;height:22px;border-radius:12px;background:var(--bd);position:relative;cursor:pointer;transition:background .18s;flex-shrink:0} .sw.on{background:var(--g)} .sw::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .18s;box-shadow:0 1px 3px rgba(0,0,0,.2)} .sw.on::after{left:18px} /* perms matrix */ .perm-grid{display:grid;grid-template-columns:1.4fr repeat(8,1fr);font-size:11px} .perm-grid>div{padding:8px 7px;border-bottom:1px solid var(--bd);border-right:1px solid var(--bd)} .perm-grid .ph{background:var(--bg);font-weight:600;color:var(--mu);text-transform:uppercase;letter-spacing:.03em;font-size:9.5px;text-align:center;position:sticky;top:0} .perm-grid .pr-lbl{font-weight:600;color:var(--dk);font-size:11.5px} .perm-dot{text-align:center} .perm-yes{color:var(--g);font-weight:700}.perm-no{color:var(--bd)} /* ad designer */ .ad-builder{display:grid;grid-template-columns:1fr 420px;gap:18px} .ad-preview-wrap{background:var(--wh);border:1px solid var(--bd);border-radius:13px;padding:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:420px} .ad-prev{width:360px;max-width:100%} /* Ad preview — mirrors the live site cover-ad card verbatim (batch6 §E: the admin preview must match what actually renders on the site). Same classes/markup as site renderCoverAd; scoped under .ad-prev. Admin shares the site purple palette. */ .ad-prev .ad-card{background:#fff;border:1px solid var(--bd);border-radius:12px;overflow:hidden;box-shadow:0 2px 12px rgba(28,28,26,.06);display:flex;flex-direction:column;position:relative} .ad-prev .ad-variant-c{aspect-ratio:1/1;width:100%} .ad-prev .ad-variant-c .ad-image{flex:1 1 auto;background:linear-gradient(135deg,#F7F3FB,var(--pl));display:flex;align-items:center;justify-content:center;color:var(--pd);min-height:0;border-bottom:1px solid var(--bd)} .ad-prev .ad-image .ad-img-inner{text-align:center;padding:22px} .ad-prev .ad-img-mark{font-family:'Cormorant Garamond',serif;font-size:42px;font-weight:600;line-height:1.05;margin-bottom:7px;color:var(--pd)} .ad-prev .ad-img-tag{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--mu)} .ad-prev .ad-variant-c .ad-body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:9px} .ad-prev .ad-variant-a,.ad-prev .ad-variant-b,.ad-prev .ad-variant-d,.ad-prev .ad-variant-e{width:100%} .ad-prev .ad-variant-a .ad-body,.ad-prev .ad-variant-b .ad-body,.ad-prev .ad-variant-d .ad-body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:9px} .ad-prev .ad-variant-b .ad-image{min-height:150px;background:linear-gradient(135deg,#F7F3FB,var(--pl));display:flex;align-items:center;justify-content:center;color:var(--pd);border-bottom:1px solid var(--bd);overflow:hidden} .ad-prev .ad-variant-b .ad-image img{width:100%;height:100%;object-fit:cover} .ad-prev .ad-variant-e .ad-image{width:100%;min-height:170px;overflow:hidden;border-radius:inherit} .ad-prev .ad-variant-e .ad-image img{width:100%;height:100%;object-fit:cover;display:block} .ad-prev .ad-body .ad-list{margin:4px 0 12px;padding-left:20px;font-size:12.5px;color:var(--mid);line-height:1.7} .ad-prev .ad-body .ad-list li{margin-bottom:5px} .ad-prev .ad-body .ad-list li::marker{color:var(--p)} .ad-prev .ad-eyebrow{font-size:9.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--p)} .ad-prev .ad-heading{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;color:var(--dk);line-height:1.18} .ad-prev .ad-subheading{font-size:13.5px;color:var(--mid);line-height:1.55} .ad-prev .ad-cta{background:var(--p);color:#fff;border:none;border-radius:5px;padding:11px 18px;font-size:13px;font-weight:500;cursor:pointer;align-self:flex-start;margin-top:auto} .variant-picker{display:flex;flex-direction:column;gap:8px;margin-bottom:18px} .variant-opt{display:flex;gap:11px;align-items:center;padding:11px 13px;border:1px solid var(--bd);border-radius:10px;cursor:pointer} .variant-opt.act{border-color:var(--p);background:var(--pl)} .variant-opt .vchk{width:20px;height:20px;border-radius:50%;border:2px solid var(--bd);flex-shrink:0;display:flex;align-items:center;justify-content:center} .variant-opt.act .vchk{border-color:var(--p);background:var(--p)} .variant-opt.act .vchk::after{content:"";width:7px;height:7px;border-radius:50%;background:#fff} .vlabel-id{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--pd);margin-right:6px} /* help */ .doc-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:14px} .doc-card{background:var(--wh);border:1px solid var(--bd);border-radius:13px;padding:18px} .doc-card-t{font-size:13px;font-weight:600;margin-bottom:10px;display:flex;align-items:center;gap:8px} .doc-link{font-size:12.5px;color:var(--mid);padding:6px 0;cursor:pointer;display:flex;align-items:center;gap:7px} .doc-link:hover{color:var(--p)} .doc-link::before{content:"›";color:var(--p);font-weight:700} .acct-wrap{max-width:760px;margin:0 auto} .acct-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px} .qr-box{width:112px;height:112px;border:1px solid var(--bd);border-radius:10px;padding:4px;background:#fff;flex-shrink:0;display:flex;align-items:center;justify-content:center} .qr-box svg{border-radius:6px} .acct-tabs{display:flex;align-items:center;gap:10px;flex-wrap:wrap} .row-line{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid var(--bd);font-size:13px} .row-line:last-child{border-bottom:none} .tbl-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 16px;border-top:1px solid var(--bd);flex-wrap:wrap} .tbl-foot-l{font-size:12px;color:var(--mu)} .tbl-foot-r{display:flex;gap:5px;align-items:center} /* Inventory iconic/other quick-filter */ .inv-quickfilter{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap} .ivf-chip{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 14px;border:1px solid var(--bd);background:var(--wh);border-radius:9px;font-size:13px;font-weight:600;color:var(--mid);cursor:pointer;font-family:inherit;transition:all .13s} .ivf-chip:hover{border-color:var(--p);color:var(--pd)} .ivf-chip.act{background:var(--p);border-color:var(--p);color:#fff} .ivf-chip span{font-size:11px;font-weight:700;background:rgba(28,28,26,.07);border-radius:20px;padding:1px 7px;min-width:18px;text-align:center} .ivf-chip.act span{background:rgba(255,255,255,.25)} .pgb2{min-width:32px;height:32px;padding:0 9px;border:1px solid var(--bd);background:#fff;color:var(--mid);border-radius:8px;font-size:12.5px;font-weight:600;cursor:pointer;font-family:'DM Sans',sans-serif} .pgb2:hover:not(:disabled){border-color:var(--p);color:var(--p)} .pgb2.act{background:var(--p);border-color:var(--p);color:#fff} .pgb2:disabled{opacity:.4;cursor:default} .pgb-ell{color:var(--mu);padding:0 2px} .code-list{display:flex;flex-wrap:wrap;gap:7px} .code-chip{font-family:'DM Mono',monospace;font-size:11.5px;background:var(--pl);color:var(--pd);border:1px solid var(--pm);padding:5px 11px;border-radius:7px;font-weight:500} .pe-bar{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--bd);border-radius:11px;padding:10px 14px;margin-bottom:14px;flex-wrap:wrap} .pe-layout{display:grid;grid-template-columns:230px 1fr;gap:16px;align-items:start} .pe-outline{background:#fff;border:1px solid var(--bd);border-radius:11px;padding:14px;position:sticky;top:76px} .pe-outline-item{display:block;font-size:12px;color:var(--mid);padding:7px 9px;border-radius:7px;cursor:pointer} .pe-outline-item:hover{background:var(--pl);color:var(--pd)} .pe-canvas{display:flex;flex-direction:column;gap:12px} .pe-tabs{display:flex;gap:4px;margin-bottom:14px;border-bottom:1px solid var(--bd)} .pe-tab{appearance:none;background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;padding:9px 15px;font:inherit;font-size:13px;font-weight:600;color:var(--mu);cursor:pointer} .pe-tab:hover{color:var(--pd)} .pe-tab.active{color:var(--pd);border-bottom-color:var(--p)} .pe-form{background:#fff;border:1px solid var(--bd);border-radius:11px} .pe-blk{background:#fff;border:1px solid var(--bd);border-radius:11px;overflow:hidden} .pe-blk-head{display:flex;align-items:center;justify-content:space-between;padding:9px 13px;background:var(--bg);border-bottom:1px solid var(--bd)} .pe-blk-type{font-size:11.5px;font-weight:600;color:var(--pd)} .pe-blk-tools{display:flex;gap:5px} .pe-tool{width:26px;height:26px;border:1px solid var(--bd);background:#fff;border-radius:6px;cursor:pointer;color:var(--mid);font-size:12px} .pe-tool:hover:not(:disabled){border-color:var(--p);color:var(--p)} .pe-tool:disabled{opacity:.35;cursor:default} .pe-edit{padding:13px 15px;font-size:13px;color:var(--dk);line-height:1.6;min-height:42px;outline:none} .pe-edit:focus{background:var(--pl)} .pe-edit h1,.pe-edit h2{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--dk);margin:.3em 0;line-height:1.25} .pe-edit h2{font-size:21px}.pe-edit h3{font-size:16px;font-weight:600;color:var(--dk);margin:.45em 0} .pe-edit p{margin:.45em 0}.pe-edit ul,.pe-edit ol{margin:.45em 0;padding-left:22px}.pe-edit li{margin:.22em 0} .pe-edit a{color:var(--p);text-decoration:underline} .pe-edit table{border-collapse:collapse;width:100%;margin:.6em 0;font-size:12px} .pe-edit th,.pe-edit td{border:1px solid var(--bd);padding:5px 8px;text-align:left;vertical-align:top} .pe-edit th{background:var(--bg);font-weight:600} .pe-tb{display:flex;flex-wrap:wrap;align-items:center;gap:3px;padding:7px 10px;background:var(--bg);border-bottom:1px solid var(--bd)} .pe-tb-b{border:1px solid var(--bd);background:#fff;border-radius:5px;min-width:27px;height:27px;padding:0 7px;font-size:12px;cursor:pointer;color:var(--dk);line-height:1;display:inline-flex;align-items:center;justify-content:center} .pe-tb-b:hover{background:var(--pl);border-color:var(--pm);color:var(--pd)} .pe-tb-sep{width:1px;height:18px;background:var(--bd);margin:0 5px} .pe-tb-lbl{font-size:10px;color:var(--mu);text-transform:uppercase;letter-spacing:.05em;margin:0 3px} .pe-note{padding:14px 15px;font-size:12.5px;color:var(--mu);font-style:italic} /* Structured per-field block editor */ .pe-blk-body{padding:13px 15px;display:flex;flex-direction:column;gap:11px} .pe-fld{display:flex;flex-direction:column;gap:4px} .pe-fld label{font-size:11px;font-weight:600;color:var(--mu)} .pe-fld .inp{width:100%} .pe-fld textarea.inp{resize:vertical;font-family:inherit;line-height:1.5} .pe-item,.pe-doc{border:1px solid var(--bd);border-radius:9px;padding:11px 12px;display:flex;flex-direction:column;gap:9px;background:var(--bg)} .pe-item-h{display:flex;align-items:center;justify-content:space-between;font-size:11.5px;font-weight:600;color:var(--pd)} .pe-item-x{border:none;background:none;color:var(--mu);cursor:pointer;font-size:13px;line-height:1;padding:2px 6px;border-radius:4px} .pe-item-x:hover{background:#FBE6E6;color:#B23B3B} .pe-row{display:flex;align-items:center;gap:7px}.pe-row .inp{flex:1} .pe-row2{display:grid;grid-template-columns:1fr 1fr;gap:11px} .pe-doc-photo{display:flex;align-items:center;gap:12px} .pe-doc-photo img{width:54px;height:54px;border-radius:8px;object-fit:cover;border:1px solid var(--bd)} .pe-doc-noimg{width:54px;height:54px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:var(--pl);color:var(--mu);font-size:9.5px;text-align:center;border:1px solid var(--bd)} .pe-pdf{padding:14px 15px} .pe-pdf-prev{margin-top:10px;background:var(--pl);border:1px dashed var(--pm);border-radius:8px;padding:14px;text-align:center;font-size:12px;color:var(--pd)} .pe-cards{padding:14px 15px;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px} .pe-card{border:1px solid var(--bd);border-radius:9px;padding:12px} .pe-card-photo{height:60px;border-radius:7px;background:var(--pl);display:flex;align-items:center;justify-content:center;margin-bottom:8px;font-size:20px} .hist-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border-bottom:1px solid var(--bd)} /* PHASE-7 — Lead version-history rollback diff table (Field | Current | After) */ .lv-diff{width:100%;border-collapse:collapse;font-size:12.5px} .lv-diff th{text-align:left;padding:8px 10px;border-bottom:2px solid var(--bd);color:var(--mu);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.03em} .lv-diff td{padding:8px 10px;border-bottom:1px solid var(--bd);vertical-align:top} .lv-diff .lv-f{font-weight:600;white-space:nowrap} .lv-diff .lv-cur{color:var(--rd,#B23B3B)} .lv-diff .lv-aft{color:var(--g,#4F8A2E)} .ad-warn{background:var(--al);border:1px solid #F0D9B8;color:var(--am);font-size:12.5px;font-weight:600;padding:10px 14px;border-radius:9px;margin-bottom:14px} .team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin-bottom:6px} .team-card{background:#fff;border:1px solid var(--bd);border-radius:12px;padding:15px} .team-card-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px} .team-card-name{font-size:14px;font-weight:600} .team-card-lead{font-size:12px;color:var(--mid);margin-bottom:9px} .team-card-roles{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:11px} .team-card-foot{display:flex;align-items:center;justify-content:space-between;gap:8px} /* ── Users & Teams redesign (mockup parity) ── */ .ut-sec{margin-bottom:30px} .ut-sec-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:12px} .ut-sec-t{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--dk);margin:0;line-height:1.1} .ut-team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:16px} .ut-team{background:var(--wh);border:1px solid var(--bd);border-radius:14px;padding:18px;display:flex;flex-direction:column;transition:box-shadow .18s,border-color .18s} .ut-team:hover{box-shadow:0 12px 26px -16px rgba(107,79,138,.32);border-color:var(--pm)} .ut-team-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px} .ut-team-ic{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-weight:600;font-size:19px;flex:0 0 42px} .ut-team-name{font-family:'Cormorant Garamond',serif;font-size:18px;font-weight:600;color:var(--dk);margin-top:13px} .ut-team-desc{font-size:12.5px;color:var(--mu);line-height:1.5;margin-top:3px} .ut-team-roles{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px} .ut-team-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:14px;border-top:1px solid var(--bd)} .ut-team-foot:first-child{margin-top:14px} .ut-team-foot-l{display:flex;align-items:center;gap:10px;min-width:0} .ut-mstack{display:inline-flex;align-items:center} .ut-mav{width:28px;height:28px;border-radius:50%;color:#fff;border:2px solid var(--wh);margin-left:-7px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;flex:0 0 28px} .ut-mav:first-child{margin-left:0} .ut-mav-more{background:var(--mu)} .ut-team-meta{font-size:12px;color:var(--mu)} .ut-team-actions{display:flex;align-items:center;gap:8px} .ut-manage{font-size:12.5px;color:var(--pd);font-weight:600;cursor:pointer} .ut-manage:hover{color:var(--dk)} .ut-iconbtn{width:32px;height:32px;border:1px solid var(--bd);background:#fff;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;color:var(--mu);font-size:14px;line-height:1} .ut-iconbtn:hover{border-color:var(--p);color:var(--p)} .ut-iconbtn svg{width:15px;height:15px} .ut-table{background:var(--wh);border:1px solid var(--bd);border-radius:14px;overflow:hidden} .ut-scroll{overflow-x:auto} .ut-thead,.ut-trow{display:grid;gap:14px;align-items:center} .ut-thead{padding:12px 22px;background:var(--bg);border-bottom:1px solid var(--bd);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mu);font-weight:700} .ut-trow{padding:13px 22px;border-bottom:1px solid var(--bd);font-size:13px;color:var(--mid)} .ut-trow:last-child{border-bottom:none} .ut-trow:hover{background:var(--bg)} .ut-roles .ut-thead,.ut-roles .ut-trow{grid-template-columns:1.5fr 1fr 2.4fr .7fr 76px;min-width:680px} .ut-users .ut-thead,.ut-users .ut-trow{grid-template-columns:1.5fr 2.1fr 1.2fr 1.2fr .7fr 1fr 1.2fr 92px;min-width:900px} .ut-rdot{width:8px;height:8px;border-radius:50%;display:inline-block;flex:0 0 8px} .ut-cell-name{display:flex;align-items:center;gap:10px;min-width:0} .ut-av{width:30px;height:30px;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;flex:0 0 30px} .ut-name{font-weight:600;color:var(--dk);overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .ut-email{color:var(--mu);overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .ut-role{display:inline-flex;align-items:center;gap:7px;min-width:0} .ut-status{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:12px} .ut-last{color:var(--mu);font-size:12px} .ut-actions{display:flex;gap:5px;align-items:center;justify-content:flex-end} .ut-protected{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:var(--am);background:var(--al);padding:3px 9px;border-radius:11px;white-space:nowrap} .ut-toolbar{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--bd)} .ut-toolbar .search-mini{flex:1;max-width:340px} .ut-toolbar .search-mini input{width:100%} .us-foot{font-size:12px;color:var(--mu);padding:13px 18px} /* ── Popup redesign (E9): subtitle, team color picker, permission accordion, inline captcha ── */ .amodal-sub{font-size:12.5px;color:var(--mu);margin-top:4px;line-height:1.45;font-weight:400} .amodal-foot-note{font-size:12px;color:var(--mu);margin-right:auto} .mini-lbl{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mu);font-weight:700;margin-bottom:7px} /* PHASE-34 — shared trademark superscript (GenieMatch™ / ReflEggction™). Small, raised, never grows line height. */ .tmk{font-size:0.6em;vertical-align:super;line-height:0;margin-left:.5px;font-weight:inherit} .tm-ic{width:50px;height:50px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-weight:600;font-size:22px} .tm-sw-row{display:flex;gap:11px;flex-wrap:wrap} .tm-sw{width:30px;height:30px;border-radius:50%;border:none;cursor:pointer;padding:0;transition:box-shadow .12s} .tm-sw.sel{box-shadow:0 0 0 2px var(--wh),0 0 0 4px rgba(28,28,26,.35)} .pa-strip{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:16px} .pa-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 12px;flex-wrap:wrap} .pa-toolbar-l{display:flex;align-items:center;gap:10px} .pa-pill{font-size:11.5px;font-weight:600;color:var(--pd);background:var(--pl);padding:3px 11px;border-radius:20px} .pa-toolbar-r{display:flex;align-items:center;gap:12px} .pa-link{border:none;background:none;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--pd);cursor:pointer;padding:0} .pa-link:hover{color:var(--dk)} .pa-link.mut{color:var(--mu)} .pa-sep{width:1px;height:13px;background:var(--bd)} .pa-grid{display:flex;flex-direction:column;gap:10px} .pa-group{border:1px solid var(--bd);border-radius:12px;overflow:hidden} .pa-ghead{display:flex;align-items:center;gap:12px;padding:12px 16px;cursor:pointer;background:var(--wh)} .pa-ghead:hover{background:var(--bg)} .pa-chev{color:var(--mu);transition:transform .15s;flex:0 0 15px} .pa-chev.open{transform:rotate(90deg)} .pa-gname{font-size:14px;font-weight:600;color:var(--dk)} .pa-gcount{font-size:11px;font-weight:600;padding:2px 9px;border-radius:20px;background:#EFEDEA;color:var(--mu)} .pa-gcount.has{background:var(--pl);color:var(--pd)} .pa-gall{font-size:12px;color:var(--mu)} .pa-gbody{border-top:1px solid var(--bd);background:var(--bg)} .pa-row{display:flex;align-items:center;gap:16px;padding:10px 16px 10px 42px;border-bottom:1px solid var(--bd)} .pa-row:last-child{border-bottom:none} /* PHASE-24 — a row covered by the module's MANAGE cascade reads as inherited-on (switch stays clickable: toggling one off demotes MANAGE to an explicit selection). */ .pa-row-cascaded .pa-swbtn{opacity:.72} .pa-row-l{flex:1;min-width:0} .pa-row-t{font-size:13px;font-weight:600;color:var(--dk)} .pa-row-d{font-size:11.5px;color:var(--mu);margin-top:1px} .pa-swbtn{border:none;background:none;padding:0;cursor:pointer;flex:0 0 auto} .pa-sw{position:relative;display:block;width:38px;height:22px;border-radius:12px;background:#DCD3D7;transition:background .15s} .pa-sw.on{background:var(--p)} .pa-knob{position:absolute;top:2.5px;left:2.5px;width:17px;height:17px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(28,28,26,.3);transition:left .15s} .pa-sw.on .pa-knob{left:18.5px} .pa-summary{border:1px solid var(--bd);border-radius:12px;overflow:hidden} .pa-summary-h{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mu);padding:10px 14px;background:var(--bg);border-bottom:1px solid var(--bd)} .pa-summary-row{display:flex;gap:16px;padding:9px 14px;border-bottom:1px solid var(--bd)} .pa-summary-row:last-child{border-bottom:none} .pa-summary-m{flex:0 0 130px;font-size:12.5px;font-weight:600;color:var(--dk)} .pa-summary-t{flex:1;font-size:12.5px;color:var(--mid);line-height:1.4} .icap{border:1px solid var(--bd);border-radius:10px;padding:12px;background:var(--bg)} .icap-row{display:flex;align-items:center;gap:10px} .icap-img{flex:1;min-height:54px;display:flex;align-items:center} .icap-img svg{max-height:60px} .perm-table{display:grid;grid-template-columns:1.4fr repeat(5,1fr);border:1px solid var(--bd);border-radius:9px;overflow:hidden} .perm-th{background:var(--bg);font-size:10px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--mu);padding:9px 8px;text-align:center;border-bottom:1px solid var(--bd)} .perm-th:first-child{text-align:left} .perm-mod{font-size:12px;font-weight:600;color:var(--dk);padding:9px 10px;border-bottom:1px solid var(--bd);border-right:1px solid var(--bd);background:var(--bg)} .perm-cell{display:flex;align-items:center;justify-content:center;padding:9px;border-bottom:1px solid var(--bd)} .perm-cell input{accent-color:var(--p);width:15px;height:15px} .route-list{display:flex;flex-direction:column;gap:12px} .route-rule{background:#fff;border:1px solid var(--bd);border-radius:11px;padding:14px 16px} .route-rule-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px} .route-rule-type{font-size:13.5px;font-weight:600;color:var(--pd)} .route-flow{display:flex;align-items:flex-end;gap:8px;flex-wrap:wrap} .route-step{flex:1;min-width:130px} .route-step-l{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--mu);font-weight:600;margin-bottom:4px} .route-arrow{color:var(--p);font-size:16px;padding-bottom:8px} .report-wrap{display:grid;grid-template-columns:240px 1fr;gap:16px;align-items:start} .report-side{background:#fff;border:1px solid var(--bd);border-radius:11px;padding:14px} .report-saved{font-size:12px;color:var(--mid);padding:8px 10px;border-radius:7px;cursor:pointer;margin-top:4px;border:1px solid var(--bd)} .report-saved:hover{background:var(--pl);color:var(--pd);border-color:var(--pm)} .report-main{background:#fff;border:1px solid var(--bd);border-radius:11px;display:flex;flex-direction:column;min-height:460px} .report-feed{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px;max-height:520px} .rmsg{max-width:80%;font-size:13px;line-height:1.55;padding:11px 14px;border-radius:12px} .rmsg-user{align-self:flex-end;background:var(--p);color:#fff;border-bottom-right-radius:3px} .rmsg-sys{align-self:flex-start;background:var(--bg);border:1px solid var(--bd);color:var(--dk);border-bottom-left-radius:3px} .report-input{display:flex;gap:8px;padding:14px;border-top:1px solid var(--bd)} @media(max-width:860px){.report-wrap{grid-template-columns:1fr}} /* upload + link rows (ad editor) */ .up-row{display:flex;align-items:center;gap:10px} .up-thumb{width:46px;height:46px;border-radius:8px;background:var(--pl);border:1px solid var(--bd);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;overflow:hidden} .up-name{font-size:11.5px;color:var(--mu)} .link-row{display:flex;align-items:center;gap:8px;border:1px solid var(--bd);border-radius:8px;padding:0 10px;background:#fff} .link-row .link-ic{color:var(--p)} .link-row .inp{border:none;padding-left:0} .link-row:focus-within{border-color:var(--p)} /* customizable routing */ .route-box{background:#fff;border:1px solid var(--bd);border-radius:13px;padding:18px 20px} .route-rule{border:1px solid var(--bd);border-radius:11px;padding:14px 16px;margin-bottom:12px;background:var(--bg)} .route-rule:last-child{margin-bottom:0} .route-steps{display:flex;flex-direction:column;gap:9px} .route-step-row{display:flex;align-items:center;gap:10px} .route-step-n{width:24px;height:24px;border-radius:50%;background:var(--p);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0} .route-step-row .inp{flex:1;min-width:0} .route-step-arrow{text-align:center;color:var(--pm);font-size:14px;margin:-2px 0 -2px 11px} .route-rm{width:28px;height:28px;border-radius:7px;border:1px solid var(--bd);background:#fff;color:var(--rd);cursor:pointer;flex-shrink:0} .route-rm:hover{background:var(--rl)} .set-tabs{display:flex;gap:6px;border-bottom:1px solid var(--bd);margin-bottom:18px} .set-tab{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;color:var(--mu);background:transparent;border:none;border-bottom:2px solid transparent;padding:10px 16px 12px;cursor:pointer;margin-bottom:-1px} .set-tab.act{color:var(--p);border-bottom-color:var(--p);font-weight:600} .set-card{background:#fff;border:1px solid var(--bd);border-radius:13px;padding:18px 20px} .set-card+.set-card{margin-top:14px} .sec-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid var(--bd)} .sec-row-t{font-size:13px;font-weight:600;color:var(--dk)} .sec-row-d{font-size:11.5px;color:var(--mu);margin-top:2px} .sec-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:14px} /* Settings reskin (F1): login escalation ladder + reflection slider + crm swatch */ .set-ladder{background:var(--bg);border:1px solid var(--bd);border-radius:12px;padding:16px;margin:14px 0} .lad-h{font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--mu);font-weight:700;margin-bottom:12px} .lad-row{display:flex;flex-wrap:wrap;align-items:center;gap:9px} .lad-arr{color:var(--pm);flex:0 0 16px} .lad-chip{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 14px;border-radius:10px;min-width:58px} .lad-chip.trig{background:var(--rl);color:var(--rd)} .lad-chip.lock{background:var(--pl);color:var(--pd)} .lad-chip.more{background:#EFEDEA;color:var(--mu)} .lad-n{font-size:14px;font-weight:700;line-height:1} .lad-s{font-size:10px;font-weight:600;opacity:.85;margin-top:3px;text-transform:uppercase;letter-spacing:.03em} .lad-note{display:flex;align-items:center;gap:7px;margin-top:13px;font-size:12.5px;color:var(--mid)} .refl-range{width:100%;margin-top:14px;accent-color:var(--p);cursor:pointer} .refl-th{font-family:'Cormorant Garamond',serif;font-size:18px;font-weight:600;color:var(--pd)} .refl-scale{display:flex;justify-content:space-between;font-size:11px;color:var(--mu);margin-top:4px} .crm-swatch{width:14px;height:14px;border-radius:50%;flex:0 0 14px;border:1px solid rgba(0,0,0,.08)} .set-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px} .refl-banner{display:flex;align-items:center;gap:10px;border-radius:11px;padding:12px 15px;margin-bottom:18px;font-size:13px;line-height:1.45;background:var(--bg);border:1px solid var(--bd);color:var(--mid)} .refl-banner svg{flex:0 0 auto;color:var(--mu)} .refl-banner.ok{background:var(--gl);border-color:#CFE6C0;color:#356F56} .refl-banner.ok svg{color:var(--g)} .set-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px} .set-stat{border:1px solid var(--bd);border-radius:12px;padding:15px 16px} .set-stat-k{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--mu);font-weight:600} .set-stat-v{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:600;color:var(--dk);margin-top:6px;line-height:1} @media(max-width:700px){.set-grid2,.set-stats{grid-template-columns:1fr}} .sec-list{display:flex;flex-direction:column;gap:9px} .sec-item{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--bd);border-radius:10px;padding:11px 13px} .sec-item.col{flex-direction:column;align-items:stretch} .sec-item-t{font-size:13px;font-weight:600;color:var(--dk);display:flex;align-items:center;gap:7px;flex-wrap:wrap} .sec-item-d{font-size:11.5px;color:var(--mu);margin-top:3px} .sec-verify{font-size:11.5px;color:var(--mid);margin-top:6px;background:var(--pl);border-radius:7px;padding:7px 9px;line-height:1.6} /* Skeleton loaders (replace blank panels / 'Loading…' text while data loads) */ .sk{position:relative;overflow:hidden;background:#ECE7F0;border-radius:6px} .sk::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);animation:sk-shimmer 1.25s ease-in-out infinite} @keyframes sk-shimmer{100%{transform:translateX(100%)}} .sk-line{height:11px;border-radius:5px;margin:9px 0;display:block} @media (prefers-reduced-motion:reduce){.sk::after{animation:none}} /* Member submissions thread + notes */ .sub-dot2{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--p);vertical-align:middle} .sub-thread2{max-height:300px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:4px 2px} .sub-msg2{max-width:80%;padding:8px 11px;border-radius:10px;font-size:12.5px;line-height:1.5;white-space:pre-wrap;word-break:break-word} .sub-msg2.user{align-self:flex-start;background:var(--pl);color:var(--dk);border-bottom-left-radius:3px} .sub-msg2.staff{align-self:flex-end;background:var(--p);color:#fff;border-bottom-right-radius:3px} .sub-msg2-by{font-size:9.5px;opacity:.75;margin-bottom:3px} .sub-notes{display:flex;flex-direction:column;gap:7px} .sub-note{background:#FEF5E7;border:1px solid #F0E0BE;border-radius:7px;padding:7px 10px;font-size:12px;color:var(--mid);white-space:pre-wrap;word-break:break-word} /* Admin sign-in card (login redesign — admin spec §2) */ .al-card{width:380px;max-width:100%;background:#fff;border:1px solid var(--bd);border-radius:14px;box-shadow:0 14px 44px rgba(28,28,26,.12);padding:30px 30px 26px} .al-link{color:var(--p);cursor:pointer;font-weight:500}.al-link:hover{text-decoration:underline} .route-layout{display:grid;grid-template-columns:220px 1fr;gap:18px;align-items:start;margin-top:4px} .route-nav{display:flex;flex-direction:column;gap:3px} .route-nav-item{text-align:left;font-size:12.5px;color:var(--mid);background:transparent;border:1px solid transparent;border-radius:8px;padding:9px 11px;cursor:pointer} .route-nav-item:hover{background:var(--bg)} .route-nav-item.act{background:var(--pl);color:var(--pd);border-color:var(--pm);font-weight:600} .route-detail{background:var(--bg);border:1px solid var(--bd);border-radius:11px;padding:16px 18px;max-width:520px} .route-cstep{background:#fff;border:1px solid var(--bd);border-radius:9px;padding:10px 12px} .route-cstep-top{display:flex;align-items:center;gap:10px} .route-cstep-top .inp{flex:1;min-width:0} .route-cppl{margin-top:9px;padding-top:9px;border-top:1px dashed var(--bd)} .route-cppl-l{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--mu);font-weight:600;margin-bottom:6px} .route-cppl-grid{display:flex;flex-wrap:wrap;gap:6px} .route-cperson{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--mid);background:var(--bg);border:1px solid var(--bd);border-radius:7px;padding:5px 9px;cursor:pointer} .route-cperson input{margin:0;cursor:pointer} @media(max-width:760px){.route-layout{grid-template-columns:1fr}.route-nav{flex-direction:row;flex-wrap:wrap}} .uc-wrap{display:flex;justify-content:center;padding:40px 16px} .uc-card{max-width:480px;text-align:center;background:#fff;border:1px solid var(--bd);border-radius:16px;padding:38px 32px} .uc-ic{width:56px;height:56px;margin:0 auto 16px;border-radius:14px;background:var(--pl);color:var(--pd);display:flex;align-items:center;justify-content:center} .uc-ic svg{width:28px;height:28px} .uc-h{font-family:'Cormorant Garamond',serif;font-size:23px;font-weight:600;color:var(--dk);margin-bottom:8px} .uc-p{font-size:13px;line-height:1.6;color:var(--mid);margin-bottom:20px} .uc-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap} /* B6 — unified Leads area */ .update-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--p);box-shadow:0 0 0 3px var(--pl)} .kind-chip{font-size:9px;font-weight:600;letter-spacing:.02em;padding:1px 6px;border-radius:6px;vertical-align:middle;margin-left:4px} .kind-chip.lead{background:var(--bg2,#f4f1f7);color:var(--mid)} .kind-chip.submission{background:var(--pl);color:var(--pd)} .crm-tags{display:flex;flex-wrap:wrap;gap:7px} .crm-tag{display:inline-flex;align-items:center;gap:6px;font-size:12px;background:var(--pl);color:var(--pd);border:1px solid var(--pm);border-radius:8px;padding:4px 8px} .crm-tag-by{font-size:9.5px;color:var(--mid);background:#fff;border-radius:5px;padding:0 5px} .crm-tag-x{border:none;background:transparent;color:var(--rd);cursor:pointer;font-size:12px;line-height:1;padding:0 2px} /* §5.2 Manage Lead Tags — white box + "Choose a tag" checkbox dropdown + inline add-new. .mng-box/.mng-box-h/.mng-sub/.mng-empty/.mng-note are shared with the category area (§5.3). */ .mng-box{background:#fff;border:1px solid var(--bd);border-radius:12px;padding:15px 15px 0;position:relative} .mng-box-h{font-size:16px;font-weight:800;letter-spacing:-.01em;color:var(--dk);margin:-15px -15px 14px;padding:12px 15px;background:var(--bg2,#f4f1f7);border-bottom:1px solid var(--bd);border-radius:12px 12px 0 0} .mng-sub{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mu);margin:0 0 8px} .mng-empty{font-size:12.5px;color:var(--mu);padding:2px 0 6px} .mng-note{margin:auto -15px 0;padding:11px 15px;background:var(--pl);border-top:1px solid var(--bd);border-radius:0 0 12px 12px;font-size:12px;color:var(--pd,#7A4FA8);font-weight:600;line-height:1.5} .tagdd{position:relative;margin:12px 0 16px} .tagdd-btn{width:100%;text-align:left;background:var(--wh);border:1px solid var(--bd);border-radius:9px;padding:9px 12px;font-size:13px;color:var(--dk);cursor:pointer;display:flex;justify-content:space-between;align-items:center} .tagdd-btn:hover{border-color:var(--p)} .tagdd-caret{color:var(--p);font-size:17px;font-weight:700;line-height:1} .tagdd-menu{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:50;border:1px solid var(--bd);border-radius:9px;background:#fff;box-shadow:0 12px 32px rgba(28,28,26,.18)} .tagdd-list{max-height:220px;overflow:auto;padding:4px} .tagdd-item{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:7px;font-size:13px;cursor:pointer;color:var(--dk)} .tagdd-item:hover{background:var(--pl)} .tagdd-item input{width:15px;height:15px;accent-color:var(--p);cursor:pointer;flex:none} .tagdd-item.is-locked{opacity:.7;cursor:default} .tagdd-nm{flex:1} .tagdd-by{font-size:9.5px;color:var(--mid);background:var(--pl);border-radius:5px;padding:1px 6px} .tagdd-empty{padding:12px 10px;font-size:12.5px;color:var(--mu)} .tagdd-add{border-top:1px solid var(--bd);padding:8px} .tagdd-newlink{display:inline-block;font-size:12.5px;font-weight:700;color:var(--p);cursor:pointer;padding:4px 4px} .tagdd-newlink:hover{text-decoration:underline} .tagdd-newrow{display:flex;gap:8px} .tagdd-newrow .inp{flex:1} .tagdd-newmsg{font-size:11.5px;padding:5px 2px 2px;min-height:14px} .tagdd-newmsg.is-dup{color:var(--rd,#B23B3B)} .tagdd-newmsg.is-ok{color:var(--g,#4F8A2E)} .catdd-search{padding:8px 8px 6px;border-bottom:1px solid var(--bd)} .catdd-search .inp{width:100%} /* §5.4 Management tab — bigger text, summary cards, Lead Routing box, sticky Save bar */ .mng-tab{font-size:13.5px;line-height:1.6} .mng-tab .mng-box-h{font-size:20px} .mng-tab label{font-size:12.5px} .mng-cards{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px} .mng-card{flex:1;min-width:132px;background:var(--pl);border:1px solid var(--bd);border-radius:11px;padding:10px 13px} .mng-card-l{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mid);margin-bottom:3px} .mng-card-v{font-size:14.5px;font-weight:700;color:var(--dk)} .mng-card-s{font-size:11px;color:var(--mid);margin-top:2px} .mng-route{padding-bottom:16px} .mng-route .rt-explain{font-size:13.5px;line-height:1.65;color:var(--mid);margin-bottom:14px} .rt-chain{display:flex;flex-wrap:wrap;align-items:stretch;gap:8px} .rt-step{flex:1;min-width:150px;background:var(--wh);border:1px solid var(--bd);border-radius:10px;padding:10px 12px} .rt-step.is-cur{border-color:var(--p);background:var(--pl);box-shadow:0 0 0 1px var(--p) inset} .rt-step-n{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--p);margin-bottom:3px} .rt-step-role{font-size:13px;font-weight:600;color:var(--dk)} .rt-step-ppl{font-size:11.5px;color:var(--mid);margin-top:3px} .rt-arrow{display:flex;align-items:center;color:var(--mu);font-size:18px;flex:none} .rt-muted{color:var(--mu);font-size:12.5px} .rt-controls{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px} .rt-controls .fld{flex:1;min-width:200px;margin:0} .lp-footer{flex:none} .mng-savebar{display:flex;align-items:center;gap:10px;padding:14px 22px;background:#fff;border-top:1px solid var(--bd)} .mng-savebar-l{font-size:12.5px;color:var(--mid);flex:1;min-width:0} /* §5.5 Notes tab — bigger font + title/subheading */ .notes-tab{font-size:13.5px} .notes-head{margin-bottom:14px} .notes-h{font-size:19px;font-weight:800;letter-spacing:-.01em;color:var(--dk);margin:0 0 4px} .notes-sub{font-size:13px;color:var(--mid);line-height:1.55} .notes-tab .tbl td{font-size:13px} /* §5.5 Insert-a-Link dialog + rendered note HTML */ .amodal-h.lnk-h{background:#fff;border-radius:14px 14px 0 0} .amodal-h.lnk-h .pg-h1{font-family:'DM Sans',system-ui,sans-serif;font-weight:700;font-size:16px} .lnk-check{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:13px;color:var(--dk);cursor:pointer} .lnk-check input{width:15px;height:15px;accent-color:var(--p);cursor:pointer} .lnk-hint{margin-top:12px;font-size:11.5px;color:var(--mu);line-height:1.5} .lnk-err{margin-top:10px;font-size:12px;color:var(--rd);background:var(--rl);border-radius:8px;padding:8px 10px} .lnk-guardmsg{flex:1;min-width:0;font-size:12.5px;color:var(--am,#C28A2B);font-weight:600;align-self:center} .note-html a{color:var(--p);text-decoration:underline} .note-html img{max-width:100%;border-radius:8px;margin:6px 0} .note-html ul,.note-html ol{margin:6px 0;padding-left:22px} .note-html p{margin:0 0 8px} .rte-ed a{color:var(--p);text-decoration:underline} .amodal.note-pop{width:680px} .crm-row{display:flex;align-items:center;gap:8px;margin-bottom:8px} .crm-row .inp{flex:1} .crm-list{display:flex;flex-direction:column} /* batch6 §J: category options as two cards side by side (not big single rows) */ .crm-cards2{display:grid;grid-template-columns:1fr 1fr;gap:10px} .crm-cards2 .crm-row{margin-bottom:0;background:var(--bg);border:1px solid var(--bd);border-radius:9px;padding:9px 11px} @media(max-width:640px){.crm-cards2{grid-template-columns:1fr}} .crm-tagcfg{border:1px solid var(--bd);border-radius:9px;padding:10px 12px;margin-bottom:10px;background:var(--bg)} .crm-tagcfg .crm-row{margin-bottom:8px} .crm-team-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px} .crm-team-l{font-size:11px;color:var(--mu);margin-right:4px} .crm-team-chip{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;color:var(--mid);background:#fff;border:1px solid var(--bd);border-radius:7px;padding:3px 8px;cursor:pointer} .crm-team-chip.on{background:var(--pl);color:var(--pd);border-color:var(--pm)} .crm-team-chip input{margin:0} /* Professional empty-state — dotted marker + centered message (Users & Teams, etc.) */ .empty-zone{border:2px dashed var(--bd);border-radius:14px;padding:40px 24px;text-align:center;background:repeating-linear-gradient(45deg,rgba(141,98,165,.015),rgba(141,98,165,.015) 10px,transparent 10px,transparent 20px)} .empty-zone-ic{width:50px;height:50px;margin:0 auto 14px;border-radius:13px;background:var(--pl);color:var(--pd);display:flex;align-items:center;justify-content:center} .empty-zone-ic svg{width:24px;height:24px} .empty-zone-t{font-family:'Cormorant Garamond',serif;font-size:19px;font-weight:600;color:var(--dk);margin-bottom:5px} .empty-zone-s{font-size:12.5px;color:var(--mu);max-width:380px;margin:0 auto;line-height:1.6} /* C2 — granular per-module capability matrix */ .perm-caps{display:flex;flex-direction:column} .perm-cap-row{display:grid;grid-template-columns:140px 1fr;gap:12px;align-items:start;padding:9px 0;border-bottom:1px solid var(--bd)} .perm-cap-row:last-child{border-bottom:none} .perm-cap-mod{font-size:12.5px;font-weight:600;color:var(--dk);padding-top:4px} .perm-cap-list{display:flex;flex-wrap:wrap;gap:6px} .perm-cap{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--mid);background:var(--bg);border:1px solid var(--bd);border-radius:7px;padding:4px 9px;cursor:pointer;user-select:none} .perm-cap.on{background:var(--pl);color:var(--pd);border-color:var(--pm)} .perm-cap.ro{cursor:default;opacity:.7} .perm-cap input{margin:0;cursor:inherit} @media(max-width:680px){.perm-cap-row{grid-template-columns:1fr;gap:5px}} @media(max-width:860px){.pe-layout{grid-template-columns:1fr}.pe-outline{position:static}} .empty{padding:50px 20px;text-align:center;color:var(--mu)} /* lead sub-tabs */ .lead-tabs{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap} .lead-tab{font-family:'DM Sans',sans-serif;font-size:12.5px;font-weight:500;color:var(--mid);background:#fff;border:1px solid var(--bd);padding:8px 14px;border-radius:20px;cursor:pointer;display:inline-flex;align-items:center;gap:6px} .lead-tab:hover{border-color:var(--p);color:var(--p)} .lead-tab.act{background:var(--p);border-color:var(--p);color:#fff} .lead-tab-n{background:var(--rd);color:#fff;font-size:10px;font-weight:700;border-radius:9px;min-width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;padding:0 4px} .lead-tab.act .lead-tab-n{background:#fff;color:var(--p)} .inp-date{padding-right:30px} /* lead panel */ /* R5-2 — every action stays on ONE row (owner rule): the lead drawer widens (.drawer-lead below), buttons never wrap, and on an extreme squeeze the bar scrolls sideways instead of stacking a second row. */ .lp-actionbar{display:flex;gap:6px;flex-wrap:nowrap;overflow-x:auto;padding:13px 18px;border-bottom:1px solid var(--bd);background:#fff} .lp-actionbar .btn{white-space:nowrap;flex:0 0 auto} /* Fix 2 — Call/SMS channel dropdown (Twilio vs JustCall). Menu is position:fixed (placed by JS off the button rect) so the actionbar's overflow-x:auto can't clip it. */ .lp-chan{position:relative;display:inline-flex;flex:0 0 auto} .lp-chan-menu{position:fixed;display:none;background:#fff;border:1px solid var(--bd);border-radius:8px;box-shadow:0 8px 28px rgba(28,28,26,.16);padding:5px;z-index:400;min-width:190px} .lp-chan-menu.open{display:block} .lp-chan-menu button{display:block;width:100%;text-align:left;background:none;border:none;padding:8px 12px;font-size:13px;color:var(--dk);cursor:pointer;border-radius:6px;font-family:inherit;white-space:nowrap} .lp-chan-menu button:hover{background:var(--pl);color:var(--pd)} .lp-tabs{display:flex;gap:4px;padding:10px 22px 0;background:#fff;border-bottom:1px solid var(--bd)} .lp-tab{font-size:12.5px;font-weight:500;color:var(--mu);background:transparent;border:none;border-bottom:2px solid transparent;padding:9px 12px;cursor:pointer;margin-bottom:-1px} .lp-tab.act{color:var(--p);border-bottom-color:var(--p);font-weight:600} .lp-appt{background:var(--gl);border:1px solid #C5E3A8;color:var(--g);font-size:12px;font-weight:600;padding:9px 13px;border-radius:8px;margin-bottom:14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap} /* PHASE-11 (Part B.4) — purple brand sticky bar for a non-registered lead (Create an Account entry point) */ .lp-noacct{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#8A62A5,#ED75A8);color:#fff;padding:11px 18px;font-size:13px;font-weight:600;position:sticky;top:0;z-index:3} .lp-noacct-btn{background:#fff;color:#8A62A5;border:0;font-weight:700} .lp-noacct-btn:hover{background:#f3ecf7;color:#7a5494} /* PHASE-11 — a newly-arrived lead/submission flashes when the background live feed drops it in at the top */ @keyframes leadRowNew{0%{background:rgba(237,117,168,.34)}70%{background:rgba(237,117,168,.14)}100%{background:transparent}} tr.ld-row.lead-row-new>td{animation:leadRowNew 2.6s ease-out} .lp-meta{font-size:11px;color:var(--mu);font-family:'DM Mono',monospace;margin-top:8px} .resp-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px} .resp-opt{font-size:12px;padding:9px 12px;border:1px solid var(--bd);border-radius:8px;background:#fff;color:var(--mid);cursor:pointer;text-align:left} .resp-opt:hover{border-color:var(--p);color:var(--p)} .resp-opt.act{background:var(--p);border-color:var(--p);color:#fff;font-weight:600} .seg{display:inline-flex;border:1px solid var(--bd);border-radius:8px;overflow:hidden} .seg-btn{font-size:12px;padding:8px 14px;border:none;background:#fff;color:var(--mid);cursor:pointer} .seg-btn.act{background:var(--p);color:#fff;font-weight:600} /* Tooltip — JS-positioned, appended to so it is never clipped by overflow/scroll containers (the old CSS ::after tooltip got cut off inside tables, cards, drawers). */ .jtip{position:fixed;z-index:99999;background:var(--dk);color:#fff;font-size:11px;font-weight:500;font-family:'DM Sans',sans-serif;letter-spacing:0;text-transform:none;padding:6px 10px;border-radius:7px;max-width:240px;line-height:1.4;text-align:center;box-shadow:0 6px 18px rgba(28,28,26,.22);pointer-events:none;opacity:0;transition:opacity .1s} .jtip.on{opacity:1} /* circular clear/reset icon */ .clear-icn{width:38px;height:38px;border-radius:50%;border:1px solid var(--bd);background:#fff;color:var(--mid);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0} .clear-icn:hover{border-color:var(--p);color:var(--p);background:var(--pl)} .clear-icn svg{width:18px;height:18px} .fdrawer-f.split{justify-content:space-between;align-items:center} /* multi-select dropdown */ .msel{position:relative} /* Compact inline variant for table toolbars (batch6 §C: severity/events inline). */ .msel-compact{display:inline-block;min-width:150px;vertical-align:middle} .msel-compact .msel-pop{min-width:200px;right:auto} .msel-btn{width:100%;border:1px solid var(--bd);border-radius:8px;background:#fff;padding:9px 32px 9px 11px;font-size:12.5px;font-family:inherit;color:var(--dk);cursor:pointer;text-align:left;position:relative;min-height:38px} .msel-btn:hover{border-color:var(--p)} .msel-btn::after{content:"▾";position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--mu);font-size:11px} .msel-btn.has::after{content:"▴"} .msel-ph{color:var(--mu)} .msel-chips{display:flex;flex-wrap:wrap;gap:4px} .msel-chip{background:var(--pl);color:var(--pd);font-size:11px;font-weight:600;padding:2px 8px;border-radius:11px} .msel-count{background:var(--p);color:#fff;font-size:10px;font-weight:700;border-radius:9px;padding:1px 7px;margin-left:4px} .msel-pop{position:absolute;top:calc(100% + 5px);left:0;right:0;background:#fff;border:1px solid var(--bd);border-radius:10px;box-shadow:0 12px 30px rgba(28,28,26,.16);z-index:20;max-height:220px;overflow-y:auto;padding:5px;display:none} .msel.open .msel-pop{display:block} .msel-opt{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:7px;font-size:12.5px;cursor:pointer;color:var(--dk)} .msel-opt:hover{background:var(--pl)} .msel-opt .mck{width:16px;height:16px;border:1.5px solid var(--bd);border-radius:4px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff} .msel-opt.on .mck{background:var(--p);border-color:var(--p)} .msel-opt.on .mck::after{content:"✓"} /* date range */ .daterange{display:flex;gap:10px;margin-top:8px} .daterange .fld{flex:1} .daterange input[type=date]{width:100%} /* export history progress */ .prog{height:8px;border-radius:5px;background:var(--pl);overflow:hidden;min-width:90px} .prog-fill{height:100%;background:linear-gradient(90deg,var(--p),var(--pd));border-radius:5px;transition:width .4s} /* dashboard wide widgets */ .dash-wide{display:none} @media(min-width:1280px){.dash-wide{display:grid;grid-template-columns:1.3fr 1fr;gap:14px;margin-bottom:22px}} .mini-feed-item{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid var(--bd);font-size:12px} .mini-feed-item:last-child{border-bottom:none} .mini-feed-dot{width:8px;height:8px;border-radius:50%;margin-top:5px;flex-shrink:0} .qa-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px} .qa-tile{border:1px solid var(--bd);border-radius:11px;padding:14px 12px;text-align:center;cursor:pointer;transition:all .13s} .qa-tile:hover{border-color:var(--p);background:var(--pl)} .qa-tile-ic{width:34px;height:34px;border-radius:9px;background:var(--pl);color:var(--pd);display:flex;align-items:center;justify-content:center;margin:0 auto 8px} .qa-tile-t{font-size:12px;font-weight:600} .pic-up{display:flex;align-items:center;gap:14px} .pic-up-prev{width:72px;height:72px;border-radius:50%;background:var(--pl);border:1px solid var(--bd);display:flex;align-items:center;justify-content:center;color:var(--p);font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:600;overflow:hidden} .pic-up-prev img{width:100%;height:100%;object-fit:cover} .toast-wrap{position:fixed;bottom:20px;right:20px;z-index:300;display:flex;flex-direction:column;gap:9px;align-items:flex-end;max-width:380px} .toast2{background:#fff;border:1px solid var(--bd);border-left:4px solid var(--g);border-radius:10px;box-shadow:0 8px 30px rgba(28,28,26,.16);padding:11px 14px;display:flex;gap:10px;align-items:flex-start;opacity:0;transform:translateX(20px);transition:all .22s;min-width:240px} .toast2.show{opacity:1;transform:none} .toast2.err{border-left-color:var(--rd)} .toast2.warn{border-left-color:var(--am)} .toast2-ic{width:22px;height:22px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;background:var(--g)} .toast2.err .toast2-ic{background:var(--rd)}.toast2.warn .toast2-ic{background:var(--am)} .toast2-body{flex:1;min-width:0} .toast2-t{font-size:12.5px;font-weight:600;color:var(--dk)} .toast2-m{font-size:11.5px;color:var(--mid);margin-top:2px;line-height:1.45} .toast2-code{font-family:'DM Mono',monospace;font-size:10.5px;color:var(--rd);margin-top:3px} .toast2-x{color:var(--mu);cursor:pointer;font-size:14px;line-height:1;flex-shrink:0} .amodal-ov{position:fixed;inset:0;background:rgba(28,28,26,.45);display:none;align-items:center;justify-content:center;z-index:80;padding:20px} .amodal-ov.open{display:flex} /* captcha always sits above other modals incl. the popup-over-popup email dialog (z-90) */ #captcha-ov{z-index:120} /* PHASE-8F Fix 4 — the "Email Full Profile" popup is #amodal (containing .amodal-b.efp), opened FROM the ReflEggction donor side panel (#rg-donor-*, z 130/131) while that panel stays open, so it must render ABOVE the panel. Scoped to the EFP modal's own markup so all other modal + captcha stacking is untouched, and it clears automatically the moment the modal shows other content. */ .amodal-ov:has(.amodal-b.efp){z-index:140} /* Email-full-profile dialog rendered OVER the donor popup (donor amodal is z-80) */ .email-ov{position:fixed;inset:0;background:rgba(28,28,26,.5);display:flex;align-items:center;justify-content:center;z-index:90;padding:22px} .amodal{background:var(--bg);border-radius:14px;width:520px;max-width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.3)} .amodal.lg{width:920px} .amodal-h{display:flex;align-items:flex-start;gap:12px;padding:18px 22px;border-bottom:1px solid var(--bd);background:#fff;position:sticky;top:0;z-index:2} .amodal-h .pg-h1{font-size:20px} /* R3I — flex centering keeps the ✕ glyph dead-center in every square close button (the export progress card's span uses this class too, not just modal