/* =====================================================================
   V2.2.2 — LEFT SIDEBAR + V2.1.20 CLASSIC COLORS
   Layout-only layer. Palette/surfaces remain from V2.1.20.
   ===================================================================== */

@media(min-width:821px){
  #shell{min-height:100vh}

  .clinic-header{
    position:fixed!important;
    inset:0 auto 0 0!important;
    z-index:140!important;
    width:248px!important;
    min-height:100vh!important;
    height:100vh!important;
    padding:22px 15px 18px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:0!important;
    border-top:0!important;
    border-left:0!important;
    border-bottom:0!important;
    border-right:1px solid rgba(37,79,116,.09)!important;
    background:rgba(250,252,252,.86)!important;
    box-shadow:8px 0 30px rgba(37,79,116,.055)!important;
    backdrop-filter:blur(18px) saturate(1.12)!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.12)!important;
  }

  .clinic-brand.site-brand-lockup{
    width:100%!important;
    min-height:92px!important;
    padding:12px 10px 14px!important;
    gap:12px!important;
    align-items:center!important;
  }
  .clinic-brand.site-brand-lockup::before{
    width:58px!important;
    height:58px!important;
    left:2px!important;
  }
  .site-brand-shield{
    width:46px!important;
    height:54px!important;
    flex-basis:46px!important;
  }
  .site-brand-copy{padding-left:2px!important;min-width:0!important}
  .site-brand-name{font-size:19px!important}
  .site-brand-sub{
    margin-top:6px!important;
    font-size:7.2px!important;
    letter-spacing:.08em!important;
    line-height:1.35!important;
    white-space:normal!important;
  }

  .clinic-desktop-nav{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:6px!important;
    width:100%!important;
    margin:24px 0 0!important;
    padding:7px!important;
    border:1px solid rgba(37,79,116,.07)!important;
    border-radius:15px!important;
    background:rgba(241,245,247,.75)!important;
  }
  .clinic-desktop-nav button{
    position:relative!important;
    width:100%!important;
    min-height:44px!important;
    padding:0 13px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:11px!important;
    border-radius:11px!important;
    text-align:left!important;
  }
  .clinic-desktop-nav button::before{
    width:24px;
    height:24px;
    display:grid;
    place-items:center;
    flex:0 0 24px;
    border-radius:8px;
    background:#fff;
    color:#607583;
    box-shadow:0 2px 8px rgba(37,79,116,.05);
    font-size:13px;
    font-weight:900;
  }
  .clinic-desktop-nav button[data-view="home"]::before{content:"⌂"}
  .clinic-desktop-nav button[data-view="calendar"]::before{content:"□"}
  .clinic-desktop-nav button[data-view="tasks"]::before{content:"✓"}
  .clinic-desktop-nav button[data-view="patients"]::before{content:"◉"}
  .clinic-desktop-nav button[data-view="clinic"]::before{content:"↗"}
  .clinic-desktop-nav button[data-view="settings"]::before{content:"⚙"}
  .clinic-desktop-nav button.active::before{color:var(--v21-navy)}

  .clinic-header-actions{
    margin-top:auto!important;
    padding:15px 8px 2px!important;
    display:grid!important;
    gap:10px!important;
    border-top:1px solid rgba(37,79,116,.09)!important;
  }
  .clinic-user-name{
    display:block!important;
    max-width:100%!important;
    padding:0 4px!important;
  }
  .clinic-logout{
    width:100%!important;
    min-height:40px!important;
    justify-content:center!important;
  }

  #main.container{
    width:auto!important;
    max-width:none!important;
    min-height:100vh!important;
    margin:0 0 0 248px!important;
    padding:30px clamp(24px,3.2vw,48px) 120px!important;
  }
}

/* Mobile remains exactly on the V2.1.20 navigation/layout model. */