/* Geometry follows main_window.py, navigation_visuals.py and the stock workspace. */
html { font-family: 'Segoe UI', Arial, sans-serif; }
body { background: var(--bg); color: var(--text); }
#appView,#appView>*,.grid-2>* { min-width:0; max-width:100%; }
#appView[data-view="stock"] { height:calc(100dvh - 160px); min-height:360px; padding:0; }
.desktop-stock-frame { display:block; width:100%; height:100%; border:0; background:var(--bg); }
@media(max-width:920px) { #appView[data-view="stock"] { height:calc(100dvh - 180px); } }
.desktop-dashboard>*+* { margin-top:12px; }
.desktop-dashboard .metric-icon { width:100%; text-align:left; }
.desktop-directory .contact-heading { gap:8px; }
.desktop-search-label { order:-1; }
td { font-weight:400; }
input,select,textarea { background:var(--panel); color:var(--text); border-color:var(--line); border-radius:7px; }
input::placeholder,textarea::placeholder { color:var(--muted); opacity:.8; }
input:focus,select:focus,textarea:focus { border-color:var(--accent); outline-color:var(--accent); }
button { border-radius:7px; font-weight:600; }
button:not(.btn-secondary):not(.nav-item):not(.desktop-section):not(.metric):not(.segmented button):not(.pattern-dot):not(.contact-letter):not(.launcher-tile):not(.launcher-bottom-nav button):not(.mobile-menu) { background-color:var(--button); color:var(--button-text); border-color:var(--button); }
.btn-secondary { background:var(--panel-2); color:var(--text); border-color:var(--line); }
.btn-secondary:hover { background:var(--hover); border-color:var(--muted); color:var(--text); }
.segmented { background:transparent; border:0; padding:0; gap:4px; }
.segmented button { background:transparent; color:var(--muted); border:0; font-weight:500; }
.segmented button.active { background:var(--selection); color:var(--accent); box-shadow:none; }
.desktop-titlebar { display:none; }
.desktop-section { display:flex; align-items:center; justify-content:space-between; width:100%; background:transparent; border:0; color:var(--muted); padding:9px 7px; text-align:left; min-height:30px; font-size:11px; font-weight:500; }
.desktop-section svg { width:12px; height:12px; transition:transform .15s; }
.desktop-section[aria-expanded=false] svg { transform:rotate(-90deg); }
.nav-item { min-height:40px; border:0!important; font-weight:500; color:var(--text); margin:2px 0; }
.desktop-nav-icon { width:28px; height:28px; object-fit:contain; flex:none; }
.nav-item:hover { background:var(--hover); color:var(--text); }
.nav-item.active { background:var(--selection); color:var(--text); position:relative; }
.nav-item.active:before { content:''; position:absolute; left:0; top:10px; bottom:10px; width:3px; border-radius:2px; background:var(--accent); }
.nav-item .count { background:var(--badge); color:var(--muted); border-radius:6px; min-width:24px; font-size:11px; }
.sidebar,.brand,.sidebar-foot { background:var(--sidebar); border-color:var(--line); }
.brand { display:flex; align-items:center; gap:9px; min-height:62px; border:0; }
.brand img { width:32px; height:32px; }
.brand small { font-size:15px; color:var(--text); font-weight:700; flex:1; }
.user-chip { background:transparent; }
.panel { background:var(--panel); border-color:var(--line); border-radius:10px; box-shadow:none; }
.panel-head,.panel-subhead { border-color:var(--line); background:transparent; }
.panel-head h2 { font-size:15px; font-weight:600; }
.table-wrap { border-color:var(--line); background:var(--panel); border-radius:10px; }
table { color:var(--text); font-size:13px; }
th { background:var(--panel-3); color:var(--muted); border-color:var(--line); font-weight:600; padding:11px 10px; }
td { border-color:var(--line); padding:10px; }
tbody tr:nth-child(even) { background:var(--panel-2); }
tbody tr:hover { background:var(--hover); }
.modal-box,.modal-head,.modal-body { background:var(--panel); color:var(--text); border-color:var(--line); }
.modal-box { border-radius:12px; }
.modal-head h2 { font-size:18px; font-weight:600; }
.modal { padding:12px; }
.modal-body { overscroll-behavior:contain; }
.kv,.phone-detail-section,.phone-detail-hero,.phone-detail-value,.smart-summary>div,.contact-facts>div { background:var(--panel); border-color:var(--line); color:var(--text); }
.phone-detail-hero { border-left-color:var(--accent); }
.phone-detail-section h3,.phone-detail-hero h3,.phone-detail-title { color:var(--text); }
.phone-detail-hero .muted,.phone-detail-section .muted { color:var(--muted); }
.metric { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:13px 16px; min-height:88px; }
.metric-icon { font-size:12px; font-weight:600; color:var(--muted); }
.metric b { font-size:26px; font-weight:600; font-variant-numeric:tabular-nums; }
.metric.active b { color:#bd82d8; }.metric.waiting b { color:#4cc4ef; }.metric.ready b { color:var(--green); }.metric.delivered b { color:var(--amber); }
.metric-icon svg { width:16px; height:16px; }
.desktop-dashboard-status { display:flex; align-items:center; gap:14px; flex-wrap:wrap; font-size:12px; color:var(--muted); }
.desktop-dashboard-status button { background:transparent!important; color:var(--accent)!important; border:0!important; padding:3px; }
.desktop-dashboard .metrics { grid-template-columns:repeat(4,minmax(0,1fr)); }
.desktop-dashboard .metric { display:flex; flex-direction:column; justify-content:space-between; text-align:left; }
.desktop-dashboard .metric b { align-self:center; }
.desktop-dashboard .grid-2 { grid-template-columns:1fr; }
.desktop-cash-form .form-grid { grid-template-columns:110px 150px minmax(160px,1fr) minmax(190px,.55fr) auto; align-items:end; gap:8px; }
.desktop-cash-form .span-2 { grid-column:auto; }
.desktop-cash-form .form-actions { margin:0; padding:0; border:0; }
.desktop-cash-form label { font-size:11px; margin-bottom:5px; }
.desktop-page-heading { display:flex; align-items:center; min-height:38px; font-size:20px; margin:0 0 8px; font-weight:600; }
.desktop-directory { display:grid; grid-template-columns:250px minmax(0,1fr); gap:8px; min-height:420px; height:calc(100dvh - 172px); }
.desktop-directory .contact-toolbar { display:flex; flex-direction:column; align-items:stretch; padding:0; gap:8px; background:transparent; border:0; }
.desktop-directory .contact-toolbar label { width:100%; }
.desktop-directory .contact-heading { display:flex; justify-content:space-between; }
.desktop-directory .contact-heading h2 { font-size:13px; }
.desktop-directory .contact-list { overflow:auto; min-height:0; background:var(--panel); border:1px solid var(--line); border-radius:8px; }
.desktop-directory-rail { display:flex; flex-direction:column; min-height:0; gap:8px; }
.desktop-directory .contact-row { background:var(--panel); border:0; border-bottom:1px solid var(--line); border-radius:0; }
.desktop-directory .contact-row summary { display:flex; padding:10px 12px; min-height:55px; gap:8px; cursor:pointer; }
.desktop-directory .contact-row.selected summary { background:var(--selection); border-left:3px solid var(--accent); }
.desktop-directory .contact-name { font-size:12px; font-weight:500; }
.desktop-directory .contact-phone { font-size:11px; color:var(--muted); }
.desktop-directory .contact-activity,.desktop-directory .contact-volume,.desktop-directory .contact-chevron,.desktop-directory .contact-columns,.desktop-directory .contact-details { display:none; }
.desktop-directory-detail { min-width:0; min-height:0; display:flex; flex-direction:column; overflow:auto; }
.desktop-directory-detail .modal-body { padding:0; overflow:visible; max-height:none; }
.desktop-directory-detail h2 { font-size:20px; margin:5px 0 12px; }
.desktop-directory-detail h3 { font-size:14px; margin:16px 0 10px; }
.desktop-directory-detail .table-wrap { min-height:250px; }
.desktop-directory .contact-count { font-size:11px; color:var(--muted); }
.contact-letter-rail { display:flex; flex-wrap:wrap; gap:2px; }
.contact-letter { background:transparent; border:0; color:var(--muted); min-height:23px; padding:3px 6px; font-size:11px; }
.contact-letter:hover { background:var(--selection); color:var(--accent); }
.desktop-directory .smart-summary { grid-template-columns:repeat(3,minmax(0,1fr)); }
.desktop-directory .smart-summary>div { padding:9px; }
.desktop-directory .search-empty { padding:15px; font-size:12px; }
.desktop-theme-select { width:auto; min-width:130px; height:34px; font-size:12px; }
.desktop-appearance-settings label { display:grid; gap:8px; margin-bottom:14px; font-size:12px; font-weight:600; }
.desktop-record-form .form-grid { grid-template-columns:1fr; gap:8px; }
.desktop-record-form .form-grid>div { grid-column:1; }
.desktop-record-form label { font-size:12px; }
.desktop-record-form .pattern-lock { max-width:180px; }
.desktop-pattern-field { padding:8px 10px; border:1px solid var(--line); border-radius:7px; }
.desktop-pattern-field summary { cursor:pointer; color:var(--muted); }
.desktop-pattern-field>label { display:none; }
.desktop-record-form #saveRecordButton { width:100%; min-height:46px; }
#appView[data-view=new]>.panel { background:transparent; border:0; }
#appView[data-view=new]>.panel>.panel-head { display:none; }
#appView[data-view=new]>.panel>.panel-body { padding:0; }
.desktop-placeholder-field>label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.desktop-record-form textarea { min-height:38px; height:38px; }
.desktop-record-form input { min-height:38px; }
@media(min-width:921px) {
    .desktop-record-form .form-grid { grid-template-columns:1fr 1fr; }
    .desktop-record-form .form-grid>div { grid-column:1/-1; }
    .desktop-record-form .form-grid>div:has(>#recordType) { grid-column:1; align-self:center; }
    .desktop-record-form #customerField,.desktop-record-form #partnerField { grid-column:2; }
    .desktop-record-form .contact-picker-summary { display:none; }
}
.desktop-phone-heading { display:flex; align-items:center; gap:16px; padding:18px; background:var(--panel); border:1px solid var(--line); border-left:4px solid var(--button); border-radius:10px; }
.desktop-phone-heading>div:first-child { display:flex; align-items:center; gap:14px; flex:1; }
.desktop-phone-heading>div:first-child>svg { width:30px; height:30px; color:var(--accent); }
.desktop-phone-heading h2 { font-size:20px; margin:0 0 5px; }
.desktop-phone-heading .form-actions { margin:0; }
.desktop-phone-heading .muted { font-size:12px; }
.phone-trade-metrics { border:1px solid var(--line); border-radius:10px; gap:0; overflow:hidden; }
.phone-trade-metrics .metric { border:0; border-right:1px solid var(--line); border-radius:0; min-height:72px; padding:10px; text-align:center; }
.phone-trade-metrics .metric:last-child { border-right:0; }
.phone-trade-metrics .metric b { font-size:16px; color:var(--text); }
.phone-trade-metrics .metric-icon { display:block; }.phone-trade-metrics .metric-icon svg { display:none; }
.desktop-mobile-theme { margin:0 0 8px; display:grid; gap:5px; font-size:12px; }
.toast { background:var(--panel); border-color:var(--line); color:var(--text); }
* { scrollbar-color:var(--line) transparent; scrollbar-width:thin; }
@media(min-width:921px) {
    #appShell { height:100dvh; min-height:0; padding:10px; gap:6px 8px; grid-template-columns:252px minmax(0,1fr); grid-template-rows:48px 54px minmax(0,1fr); grid-template-areas:'title title' 'search search' 'side main'; }
    .desktop-titlebar { grid-area:title; display:flex; align-items:center; gap:18px; padding:0 14px; border:1px solid var(--line); border-radius:18px; background:var(--panel); }
    .desktop-titlebar img { width:26px; height:26px; object-fit:contain; }
    .desktop-titlebar .desktop-banner { width:105px; height:27px; }
    .desktop-titlebar strong { flex:1; text-align:center; font-size:14px; color:var(--accent); }
    .desktop-titlebar .btn-icon { width:34px; min-height:30px; padding:5px; }
    .topbar { grid-area:search; position:static; min-height:0; padding:7px 10px; background:var(--panel); border:1px solid var(--line); border-radius:16px; gap:12px; }
    .topbar .page-title { display:none; }
    .topbar .global-search { flex:1; width:auto; }
    .desktop-search-label { font-size:12px; font-weight:600; }
    .sidebar { grid-area:side; height:auto; min-height:0; position:static; border:1px solid var(--line); border-radius:18px; padding:0 10px 8px; }
    .brand { padding:12px 6px; }
    .nav-scroll { flex:1; min-height:0; padding:0; }
    .sidebar-foot { padding:8px 0 0; }
    .main { grid-area:main; min-height:0; overflow:hidden; }
    .content { min-height:0; overflow:auto; padding:10px 0 0; display:block; scrollbar-gutter:stable; }
    .content>*+* { margin-top:12px; }
    .desktop-mobile-theme { display:none; }
    body.desktop-sidebar-collapsed #appShell { grid-template-columns:64px minmax(0,1fr); }
    body.desktop-sidebar-collapsed .sidebar { padding-inline:6px; }
    body.desktop-sidebar-collapsed .brand img,body.desktop-sidebar-collapsed .brand small,body.desktop-sidebar-collapsed .sidebar-foot,body.desktop-sidebar-collapsed .desktop-section,body.desktop-sidebar-collapsed .nav-item>span { display:none; }
    body.desktop-sidebar-collapsed .brand { justify-content:center; }
    body.desktop-sidebar-collapsed .nav-item { justify-content:center; padding-inline:4px; }
}
@media(max-width:920px) {
    #appShell { display:grid; grid-template-columns:1fr; grid-template-rows:auto minmax(0,1fr); min-height:100dvh; }
    #sidebar { position:fixed; inset:0 auto 0 0; width:min(86vw,300px); height:100dvh; z-index:80; transform:translateX(-105%); visibility:hidden; }
    body.drawer-open #sidebar { transform:translateX(0); visibility:visible; }
    .mobile-menu,.mobile-launcher-toggle { display:inline-flex; }
    .topbar { grid-row:1; background:var(--panel); }
    .main { grid-row:2; }
    .desktop-search-label,.desktop-page-heading { display:none; }
    .desktop-directory { grid-template-columns:210px minmax(0,1fr); height:auto; min-height:60dvh; }
    .desktop-directory .contact-list { max-height:65dvh; }
    .desktop-cash-form .form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .desktop-dashboard .metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:600px) {
    .desktop-phone-heading { flex-direction:column; align-items:stretch; padding:12px; }
    .desktop-directory { display:block; }
    .desktop-directory-rail { max-height:45dvh; }
    .desktop-directory-detail { margin-top:12px; }
    .desktop-directory .contact-toolbar { display:grid; grid-template-columns:1fr 1fr; }
    .desktop-directory .contact-heading,.desktop-directory .page-search { grid-column:1/-1; }
    .desktop-directory-detail .kv { grid-template-columns:90px minmax(0,1fr); }
    .desktop-directory .smart-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .desktop-dashboard-status { gap:8px; }
}
@media(min-width:921px) and (max-height:680px) {
    #appShell { padding:6px; grid-template-rows:40px 46px minmax(0,1fr); }
    .desktop-directory { height:calc(100dvh - 135px); }
    .brand { min-height:48px; padding-block:6px; }.nav-item { min-height:36px; }
}
@media(prefers-reduced-motion:reduce) { .desktop-section svg { transition:none; } }
