/* ══════════════════════════════════════════════════════════════════════════
   sidebar.css  —  left-sidebar redesign for the Audit Extractor (add-on)
   Applies only when <body> has class "na-sidebar-on" (added by sidebar.js).
   Purely visual: no app logic is touched.
   ══════════════════════════════════════════════════════════════════════════ */
:root{
  --na-side:#0f172a; --na-side2:#1e293b; --na-active:#4f46e5;
  --na-bg:#eef1f6; --na-bd:#e5e8ef; --na-t2:#475569; --na-t3:#94a3b8;
}

body.na-sidebar-on{ background:var(--na-bg) !important; padding-left:264px; }

/* ---- sidebar ---- */
#na-sidebar{
  position:fixed; top:0; left:0; width:264px; height:100vh; z-index:1000;
  background:var(--na-side); color:#e2e8f0; display:flex; flex-direction:column;
  padding:20px 14px; gap:4px; overflow-y:auto;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
#na-sidebar .na-brand{display:flex;align-items:center;gap:11px;padding:6px 8px 14px}
#na-sidebar .na-logo{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,#6366f1,#4f46e5);display:flex;align-items:center;justify-content:center;font-size:18px}
#na-sidebar .na-brand h1{font-size:16px;margin:0;font-weight:700;color:#fff;line-height:1.1}
#na-sidebar .na-brand p{font-size:11px;margin:2px 0 0;color:#94a3b8}

#na-sidebar .na-hotelchip{display:flex;align-items:center;gap:9px;background:#1e293b;border:1px solid #334155;border-radius:10px;padding:9px 11px;margin:4px 4px 10px;font-size:12.5px;font-weight:600;color:#e2e8f0}
#na-sidebar .na-hotelchip .na-dot{width:22px;height:22px;border-radius:50%;background:#334155;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}
#na-sidebar .na-hotelchip select{background:#0f172a;color:#e2e8f0;border:1px solid #334155;border-radius:7px;font:inherit;font-size:12px;padding:5px 7px;max-width:100%;width:100%}

#na-sidebar .na-navlabel{font-size:10px;letter-spacing:.12em;color:#64748b;font-weight:700;padding:8px 10px 4px}
#na-sidebar .na-nav{display:flex;flex-direction:column;gap:4px}
#na-sidebar .na-item{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:9px;color:#cbd5e1;font-size:13.5px;font-weight:500;cursor:pointer;border:none;background:none;text-align:left;width:100%;transition:background .12s,color .12s}
#na-sidebar .na-item svg{width:18px;height:18px;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:1.9}
#na-sidebar .na-item:hover{background:#1e293b;color:#fff}
#na-sidebar .na-item.na-active{background:var(--na-active);color:#fff;box-shadow:0 6px 16px -6px rgba(79,70,229,.7)}

/* ---- hide the app's original top bar ---- */
body.na-sidebar-on .na-oldbar-hidden{display:none !important;}

/* ---- light polish on content cards/tables to match the sidebar ---- */
body.na-sidebar-on .section-card{border-radius:16px !important;box-shadow:0 1px 2px rgba(15,23,42,.05) !important;}

@media(max-width:860px){
  body.na-sidebar-on{padding-left:70px;}
  #na-sidebar{width:70px;padding:16px 8px}
  #na-sidebar .na-brand h1,#na-sidebar .na-brand p,#na-sidebar .na-navlabel,#na-sidebar .na-item span,#na-sidebar .na-hotelchip select{display:none}
  #na-sidebar .na-item{justify-content:center}
  #na-sidebar .na-hotelchip{justify-content:center}
}