/* =====================================================================
   KIRAN OMS V4 — Phase 8.0 / 10-point implementation
   UI behavior, responsive header/sidebar, date ranges, shortcut HUD.
   ===================================================================== */

/* ---------- Smart header ---------- */
.header-more-btn,.header-sync-mini{
  height:34px;border:1px solid var(--line)!important;background:var(--surface)!important;color:var(--text-2)!important;
  border-radius:9px;padding:0 10px;font-size:12px;font-weight:800;cursor:pointer;display:none;align-items:center;justify-content:center;
}
.header-sync-mini{width:34px;padding:0;position:relative}
.header-sync-mini .dot{width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.12)}
.header-more-menu{
  display:none;position:fixed;right:12px;top:calc(var(--header-h) - 2px);z-index:15000;width:min(310px,calc(100vw - 24px));
  background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 44px rgba(15,23,42,.20);padding:8px;
}
.header-more-menu.open{display:block}
.header-more-status{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:4px 4px 8px}
.header-more-status>div{border:1px solid var(--line);border-radius:9px;padding:8px 9px;background:var(--surface-soft);font-size:10.5px;color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.header-more-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.header-more-actions button{height:38px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);font-size:11px;font-weight:750;cursor:pointer}
.header-more-actions button:hover{background:var(--surface-soft);border-color:#94a3b8}

@media (max-width:1320px){
  header.app-header{grid-template-columns:minmax(190px,auto) minmax(150px,1fr) auto!important;gap:8px!important;padding-left:12px!important;padding-right:12px!important}
  .header-system-actions{gap:4px!important}
  .header-kpi{min-width:42px!important;padding-left:5px!important;padding-right:5px!important}
  .sys-pill{max-width:122px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media (max-width:1120px){
  .fit-control,#theme-toggle-btn,#fs-btn{display:none!important}
  .header-more-btn{display:inline-flex!important}
  .oms-pill,.lan-pill{width:35px!important;min-width:35px!important;padding:0!important;justify-content:center!important;overflow:hidden!important}
  .oms-pill span,.lan-pill span{display:none!important}
}
@media (max-width:900px){
  header.app-header{grid-template-columns:auto minmax(0,1fr) auto!important;padding:0 9px!important;gap:7px!important}
  .header-kpis,.header-current-date,.oms-pill,.lan-pill{display:none!important}
  .header-sync-mini,.header-more-btn{display:inline-flex!important}
  .header-system-actions{display:flex!important;gap:5px!important}
  #app-page-title{max-width:44vw!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media (max-width:520px){
  .header-brand .brand-copy,.header-brand .brand-mark{display:none!important}
  #app-page-title{max-width:48vw!important}
  .header-sync-mini,.header-more-btn{width:34px;padding:0}
}

/* ---------- Sidebar auto-hide ---------- */
@media (min-width:901px){
  body.p8-sidebar-auto nav.top-nav{width:var(--sidebar-collapsed-w)!important;padding-left:8px!important;padding-right:8px!important;overflow-x:visible!important}
  body.p8-sidebar-auto main{margin-left:var(--sidebar-collapsed-w)!important;width:calc(100% - var(--sidebar-collapsed-w))!important}
  body.p8-sidebar-auto .alert-bar{margin-left:var(--sidebar-collapsed-w)!important;width:calc(100% - var(--sidebar-collapsed-w))!important}
  body.p8-sidebar-auto .sidebar-head{justify-content:center;padding-left:0;padding-right:0}
  body.p8-sidebar-auto .sidebar-head-copy,body.p8-sidebar-auto .sidebar-section-label,body.p8-sidebar-auto .sidebar-footer-copy{display:none!important}
  body.p8-sidebar-auto .sidebar-footer{justify-content:center}
  body.p8-sidebar-auto nav.top-nav>.tab,
  body.p8-sidebar-auto nav.top-nav>.nav-history-menu>.tab,
  body.p8-sidebar-auto nav.top-nav>.nav-admin-menu>.tab{justify-content:center!important;padding:0!important;font-size:0!important;overflow:visible!important}
  body.p8-sidebar-auto nav.top-nav>.tab>*,body.p8-sidebar-auto nav.top-nav>.nav-history-menu>.tab>*,body.p8-sidebar-auto nav.top-nav>.nav-admin-menu>.tab>*{display:none!important}
  body.p8-sidebar-auto nav.top-nav>.tab::before,body.p8-sidebar-auto nav.top-nav>.nav-history-menu>.tab::before,body.p8-sidebar-auto nav.top-nav>.nav-admin-menu>.tab::before{content:attr(data-nav-icon);display:block!important;font-size:18px!important;line-height:1!important}
  body.p8-sidebar-auto nav.top-nav:hover,body.p8-sidebar-auto.sidebar-pinned nav.top-nav{width:var(--sidebar-w)!important;padding-left:10px!important;padding-right:10px!important;box-shadow:16px 0 34px rgba(15,23,42,.18)!important}
  body.p8-sidebar-auto nav.top-nav:hover .sidebar-head,body.p8-sidebar-auto.sidebar-pinned .sidebar-head{justify-content:flex-start;padding-left:7px;padding-right:7px}
  body.p8-sidebar-auto nav.top-nav:hover .sidebar-head-copy,body.p8-sidebar-auto nav.top-nav:hover .sidebar-footer-copy,body.p8-sidebar-auto.sidebar-pinned .sidebar-head-copy,body.p8-sidebar-auto.sidebar-pinned .sidebar-footer-copy{display:flex!important}
  body.p8-sidebar-auto nav.top-nav:hover .sidebar-section-label,body.p8-sidebar-auto.sidebar-pinned .sidebar-section-label{display:block!important}
  body.p8-sidebar-auto nav.top-nav:hover>.tab,body.p8-sidebar-auto nav.top-nav:hover>.nav-history-menu>.tab,body.p8-sidebar-auto nav.top-nav:hover>.nav-admin-menu>.tab,
  body.p8-sidebar-auto.sidebar-pinned nav.top-nav>.tab,body.p8-sidebar-auto.sidebar-pinned nav.top-nav>.nav-history-menu>.tab,body.p8-sidebar-auto.sidebar-pinned nav.top-nav>.nav-admin-menu>.tab{
    justify-content:flex-start!important;padding:0 11px!important;font-size:12.5px!important;overflow:hidden!important
  }
  body.p8-sidebar-auto nav.top-nav:hover>.tab>*,body.p8-sidebar-auto nav.top-nav:hover>.nav-history-menu>.tab>*,body.p8-sidebar-auto nav.top-nav:hover>.nav-admin-menu>.tab>*,
  body.p8-sidebar-auto.sidebar-pinned nav.top-nav>.tab>*,body.p8-sidebar-auto.sidebar-pinned nav.top-nav>.nav-history-menu>.tab>*,body.p8-sidebar-auto.sidebar-pinned nav.top-nav>.nav-admin-menu>.tab>*{display:initial!important}
  body.p8-sidebar-auto nav.top-nav:hover>.tab::before,body.p8-sidebar-auto nav.top-nav:hover>.nav-history-menu>.tab::before,body.p8-sidebar-auto nav.top-nav:hover>.nav-admin-menu>.tab::before,
  body.p8-sidebar-auto.sidebar-pinned nav.top-nav>.tab::before,body.p8-sidebar-auto.sidebar-pinned nav.top-nav>.nav-history-menu>.tab::before,body.p8-sidebar-auto.sidebar-pinned nav.top-nav>.nav-admin-menu>.tab::before{display:none!important}
  body.p8-sidebar-auto.sidebar-pinned main{margin-left:var(--sidebar-w)!important;width:calc(100% - var(--sidebar-w))!important}
  body.p8-sidebar-auto.sidebar-pinned .alert-bar{margin-left:var(--sidebar-w)!important;width:calc(100% - var(--sidebar-w))!important}
}
.sidebar-pin-btn{margin-left:auto;width:25px;height:25px;border:1px solid rgba(255,255,255,.1);border-radius:7px;background:rgba(255,255,255,.04);color:#aebbd0;cursor:pointer;font-size:12px;display:grid;place-items:center}
body.p8-sidebar-auto:not(.sidebar-pinned) .sidebar-pin-btn{display:none}
nav.top-nav:hover .sidebar-pin-btn,body.sidebar-pinned .sidebar-pin-btn{display:grid!important}

/* ---------- Date range controls ---------- */
.p8-date-range{border-top:1px solid var(--line);margin-top:7px;padding-top:8px}
.p8-range-title{font-size:10px;font-weight:800;color:var(--text-2);margin-bottom:6px}
.p8-range-presets{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:7px}
.p8-range-presets button{height:27px;border:1px solid var(--line);border-radius:7px;background:var(--surface);font-size:9.5px;font-weight:700;color:var(--text-2);padding:0 7px;cursor:pointer}
.p8-range-presets button:hover,.p8-range-presets button.on{border-color:#93c5fd;background:#eff6ff;color:#1d4ed8}
.p8-range-custom{display:grid;grid-template-columns:1fr 1fr auto;gap:5px;align-items:center}
.p8-range-custom input{min-width:0;height:30px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--text);font-size:10px;padding:0 6px}
.p8-range-custom button{height:30px;border:0;border-radius:7px;background:var(--brand);color:#fff;font-size:10px;font-weight:800;padding:0 9px;cursor:pointer}

/* ---------- Shortcut bottom HUD ---------- */
#p8-shortcut-hud{position:fixed;left:50%;bottom:12px;transform:translate(-50%,22px);z-index:25000;max-width:calc(100vw - 24px);display:flex;gap:5px;align-items:center;padding:7px 8px;border:1px solid #334155;border-radius:12px;background:rgba(15,23,42,.96);box-shadow:0 14px 38px rgba(15,23,42,.3);opacity:0;pointer-events:none;transition:.14s;overflow-x:auto;white-space:nowrap;color:#e2e8f0}
#p8-shortcut-hud.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
#p8-shortcut-hud .p8-short{height:29px;border:1px solid #475569;border-radius:7px;background:#1e293b;color:#e2e8f0;font-size:9.5px;font-weight:750;padding:0 8px;display:inline-flex;gap:5px;align-items:center;cursor:pointer}
#p8-shortcut-hud kbd{border:1px solid #64748b;border-bottom-width:2px;border-radius:5px;background:#0f172a;color:#93c5fd;padding:2px 5px;font-size:9px}

/* ---------- System / master manager modals ---------- */
.p8-overlay{position:fixed;inset:0;z-index:24000;background:rgba(15,23,42,.62);display:flex;align-items:center;justify-content:center;padding:18px;backdrop-filter:blur(3px)}
.p8-dialog{width:min(720px,96vw);max-height:90vh;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:15px;box-shadow:0 28px 80px rgba(15,23,42,.32);color:var(--text)}
.p8-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);background:var(--surface-soft)}
.p8-dialog-head h3{margin:0;font-size:15px}.p8-x{border:0;background:transparent;color:var(--text-2);font-size:20px;cursor:pointer}
.p8-dialog-body{padding:15px}.p8-dialog-foot{display:flex;gap:7px;justify-content:flex-end;padding:11px 15px;border-top:1px solid var(--line);background:var(--surface-soft)}
.p8-field{display:grid;grid-template-columns:160px 1fr;gap:10px;align-items:center;margin-bottom:10px}.p8-field label{font-size:11px;font-weight:800;color:var(--text-2)}
.p8-field input,.p8-field select{height:36px;min-width:0;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);padding:0 9px;font-size:11px}
.p8-note{font-size:10.5px;color:var(--text-2);line-height:1.55;background:var(--surface-soft);border:1px solid var(--line);border-radius:9px;padding:9px 10px;margin:9px 0}
.p8-btn{height:34px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);font-size:11px;font-weight:800;padding:0 12px;cursor:pointer}.p8-btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}.p8-btn.danger{border-color:#fecaca;color:#b91c1c;background:#fff7f7}
.p8-dup-group{border:1px solid var(--line);border-radius:9px;padding:9px 10px;margin-bottom:7px}.p8-dup-group b{font-size:11px}.p8-dup-group small{display:block;color:var(--text-2);margin-top:3px}
@media(max-width:620px){.p8-field{grid-template-columns:1fr;gap:4px}.p8-dialog{max-height:94vh}.p8-range-custom{grid-template-columns:1fr 1fr}.p8-range-custom button{grid-column:1/-1}}

/* ---------- OMS is optional; never block application ---------- */
#oms-lock-overlay{display:none!important}

@media print{#p8-shortcut-hud,.header-more-menu,.header-more-btn,.header-sync-mini,.sidebar-pin-btn,.p8-overlay{display:none!important}}

/* Phase 8 uses the Alt-key bottom HUD instead of the legacy shortcut popup/button. */
#sc-hint,.qs-shortcuts-btn{display:none!important}


/* ===== Phase 10.6 — Simple Data Storage ===== */
.p106-storage-dialog{width:min(790px,96vw);overflow:hidden}
.p106-storage-head{padding:16px 18px}
.p106-storage-head>div{min-width:0}.p106-storage-head h3{font-size:16px}.p106-storage-head p{margin:3px 0 0;color:var(--text-2);font-size:10.5px}
.p106-storage-body{padding:16px 18px 14px}
.p106-storage-current{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:12px;align-items:center;padding:13px 14px;border:1px solid #cfe0f3;border-radius:12px;background:linear-gradient(135deg,#f8fbff,#f1f7ff);margin-bottom:17px}
.p106-storage-icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;background:#e7f0ff;font-size:20px}
.p106-storage-current-copy{min-width:0;display:flex;flex-direction:column;gap:2px}.p106-storage-current-copy small{font-size:9px;text-transform:uppercase;letter-spacing:.06em;font-weight:800;color:#64748b}.p106-storage-current-copy strong{font-size:11px;color:#1e3a5f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.p106-storage-current-copy span{font-size:9.5px;color:#718096}
.p106-storage-choice-title{font-size:11px;font-weight:900;color:var(--text);margin:0 0 8px}
.p106-storage-choice{display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:9px;align-items:center;padding:11px 12px;margin:7px 0;border:1px solid var(--line);border-radius:11px;background:var(--surface);cursor:pointer;transition:.15s ease}.p106-storage-choice:hover{border-color:#93b8e8;background:#f8fbff}.p106-storage-choice.selected{border-color:#60a5fa;background:#eff6ff;box-shadow:0 0 0 2px rgba(96,165,250,.10)}.p106-storage-choice input{accent-color:#2563eb}.p106-storage-choice div{display:flex;flex-direction:column;gap:2px}.p106-storage-choice b{font-size:11px}.p106-storage-choice span{font-size:9.5px;color:var(--text-2)}.p106-storage-choice em{font-style:normal;font-size:8.5px;color:#15803d;background:#dcfce7;border:1px solid #bbf7d0;border-radius:999px;padding:3px 7px;white-space:nowrap}
.p106-storage-picker{margin:10px 0 12px;padding:12px;border:1px solid #d6e3f2;border-radius:11px;background:#fbfdff}.p106-storage-picker>label{display:block;font-size:9.5px;font-weight:800;color:#475569;margin-bottom:6px}.p106-storage-path-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}.p106-storage-path-row input{height:38px;min-width:0;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#0f172a;padding:0 10px;font-size:10.5px}.p106-storage-path-row input:focus{outline:0;border-color:#60a5fa;box-shadow:0 0 0 3px rgba(96,165,250,.12)}
.p106-path-status{margin-top:7px;min-height:17px;font-size:9.5px;font-weight:700}.p106-path-status.idle{color:#64748b}.p106-path-status.checking{color:#1d4ed8}.p106-path-status.ok{color:#15803d}.p106-path-status.bad{color:#b91c1c}
.p106-storage-advanced{margin-top:11px;border-top:1px dashed #d8e2ef;padding-top:9px}.p106-storage-advanced summary{cursor:pointer;font-size:9.5px;font-weight:800;color:#64748b;user-select:none}.p106-advanced-grid{margin-top:9px;padding:10px;border:1px solid var(--line);border-radius:9px;background:var(--surface-soft);display:grid;gap:7px}.p106-advanced-grid>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:7px;align-items:start}.p106-advanced-grid span{font-size:9px;font-weight:800;color:var(--text-2)}.p106-advanced-grid code{font-size:9px;white-space:normal;overflow-wrap:anywhere;color:var(--text)}.p106-existing-toggle{font-size:9.5px;color:var(--text-2);display:flex;gap:6px;align-items:center}.p106-storage-warning{margin-top:10px;padding:8px 10px;border:1px solid #fed7aa;border-radius:8px;background:#fff7ed;color:#9a3412;font-size:9.5px}
.p106-storage-foot{align-items:center}.p106-foot-spacer{flex:1}.p106-storage-foot .p8-btn{min-height:34px}.p106-storage-foot .p8-btn.primary{min-width:112px}
@media(max-width:620px){.p106-storage-current{grid-template-columns:36px 1fr}.p106-storage-current>#p8-path-open{grid-column:1/-1}.p106-storage-choice{grid-template-columns:20px 1fr}.p106-storage-choice em{grid-column:2}.p106-storage-path-row{grid-template-columns:1fr}.p106-storage-foot{flex-wrap:wrap}.p106-foot-spacer{display:none}.p106-storage-foot .p8-btn{flex:1 1 auto}}
