/* One Drinkwell sidebar — the single source of truth for the nav chrome that
   /js/eos-nav.js renders. Previously this block was copy-pasted into every
   page's <style> and had drifted into a dozen variants (z-index 100 vs 1100,
   two different sign-out hovers, .user-email with and without truncation).
   Every page that imports eos-nav.js links this file instead; do not
   re-inline these rules on a page.

   Depends on three page-level custom properties: --sidebar, --navy, --blue,
   --blue-light. Mobile behaviour (off-canvas drawer, hamburger, overlay)
   lives in /css/mobile.css and layers on top of this. */

.sidebar{
  width:var(--sidebar);flex-shrink:0;background:var(--navy);
  display:flex;flex-direction:column;
  position:fixed;top:0;left:0;height:100vh;overflow-y:auto;z-index:1100;
}
.sidebar-brand{padding:20px 20px 16px;border-bottom:1px solid rgba(255,255,255,.1);}
.one-label{font-size:9px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;
  color:rgba(255,255,255,.4);margin-top:4px;}

.nav{flex:1;padding:16px 0;}
.nav-section{margin-bottom:4px;}
.nav-section-label{font-size:9px;font-weight:800;letter-spacing:2px;text-transform:uppercase;
  color:rgba(255,255,255,.35);padding:10px 20px 6px;}

/* Some pages render nav entries as <button>, so the reset lives here too. */
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 20px;
  font-size:12.5px;font-weight:500;color:rgba(255,255,255,.7);text-decoration:none;
  transition:all .15s;cursor:pointer;border:none;background:none;
  width:100%;text-align:left;font-family:inherit;}
.nav-item:hover{color:#fff;background:rgba(255,255,255,.08);}
.nav-item.active{color:#fff;background:rgba(28,159,216,.25);border-right:3px solid var(--blue-light);}
.nav-icon{font-size:15px;width:18px;text-align:center;flex-shrink:0;}

.sidebar-footer{padding:16px 20px;border-top:1px solid rgba(255,255,255,.1);}
.user-info{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--blue);
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;color:#fff;flex-shrink:0;overflow:hidden;}
.avatar img{width:100%;height:100%;object-fit:cover;}
/* Truncate rather than wrap — long @drinkwell.com addresses blew the footer out. */
.user-name{font-size:12px;font-weight:600;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.user-email{font-size:10px;color:rgba(255,255,255,.45);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

.btn-signout{width:100%;padding:8px;border-radius:7px;border:1px solid rgba(255,255,255,.15);
  background:transparent;color:rgba(255,255,255,.6);font-family:'Inter',sans-serif;
  font-size:11px;font-weight:600;cursor:pointer;transition:all .15s;}
.btn-signout:hover{background:rgba(255,255,255,.1);color:#fff;}