/* ── RESET ── */
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{background:#080c10;font-family:'Segoe UI',system-ui,sans-serif;overflow-x:hidden;color:#f0f0f0}
input,select,button{font-family:inherit}
select option{background:#1a2230;color:#f0f0f0}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:#0d1520}
::-webkit-scrollbar-thumb{background:#c9a84c55;border-radius:4px}
*{-webkit-text-fill-color:inherit}
.gradient-text{-webkit-text-fill-color:transparent!important}
b,strong{color:inherit;-webkit-text-fill-color:inherit}

/* ── ROOT LAYOUT ── */
#root{
  display:flex;min-height:100vh;width:100%;
  background:linear-gradient(160deg,#080c10,#0d1520);
}

/* ── MOBILE (default) ── */
.app-sidebar{display:none}
.app-main{flex:1;min-width:0;overflow-x:hidden;display:flex;flex-direction:column}
.tab-bar-mobile{
  position:fixed;bottom:0;left:0;right:0;
  background:#0d1520;border-top:1px solid #1e2a35;
  display:flex;z-index:100;
}
.tab-btn-m{
  flex:1;padding:9px 0 6px;background:none;border:none;
  display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;
}

/* ── TABLET (768px+) ── */
@media(min-width:768px){
  #root{flex-direction:row}
  .app-sidebar{
    display:flex;flex-direction:column;
    width:220px;min-width:220px;flex-shrink:0;
    background:#0d1520;border-right:1px solid #1e2a35;
    height:100vh;position:sticky;top:0;overflow-y:auto;
  }
  .app-main{height:100vh;overflow-y:auto;max-width:none}
  .tab-bar-mobile{display:none!important}
  .sidebar-nav{display:flex!important}
  .page-inner{padding:20px 24px!important}
  .kpi-grid-2{grid-template-columns:repeat(4,1fr)!important}
  .cal-slot-day{min-height:52px!important}
}

/* ── DESKTOP (1100px+) ── */
@media(min-width:1100px){
  .app-sidebar{width:240px;min-width:240px}
  .app-main{max-width:none}
  .desktop-2col{display:grid!important;grid-template-columns:1fr 1fr;gap:16px}
  .desktop-3col{display:grid!important;grid-template-columns:repeat(3,1fr);gap:14px}
  .cal-slot-day{min-height:56px!important}
}

/* ── WIDE DESKTOP (1400px+) ── */
@media(min-width:1400px){
  .app-sidebar{width:260px;min-width:260px}
}

/* ── SIDEBAR NAV ── */
.sidebar-nav{display:none;flex-direction:column;padding:14px 12px;gap:3px;flex:1}
.sidebar-nav-btn{
  display:flex;align-items:center;gap:11px;
  padding:11px 14px;border-radius:11px;
  border:none;background:transparent;
  color:#6a7a8a;cursor:pointer;
  font-size:14px;font-weight:600;
  text-align:left;width:100%;
  transition:background .15s,color .15s;
}
.sidebar-nav-btn.active{background:#c9a84c22;color:#c9a84c;border-left:3px solid #c9a84c}
.sidebar-nav-btn:hover:not(.active){background:#1e2a35;color:#f0f0f0}
.sidebar-nav-btn .ico{font-size:20px;flex-shrink:0;width:24px;text-align:center}

/* ── ADMIN RESPONSIVE ── */
@media(min-width:768px){
  .mobile-header{display:none!important}
  .app-main{height:100vh;overflow:hidden}
  .page-inner{padding:20px 24px}
}
@media(min-width:1100px){.page-inner{padding:24px 28px}}

/* ── PUBLIC PAGE ── */
#pub-root{width:100%;min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(160deg,#080c10,#0d1520)}
#pub-hero{width:100%;text-align:center}
@media(min-width:768px){#pub-hero{padding:40px 20px 28px!important}}
#pub-tabs-wrap{width:100%;border-bottom:1px solid #1e2a35}
#pub-tabs{max-width:860px;margin:0 auto;display:flex}
#pub-body{width:100%;flex:1}
#pub-inner{max-width:860px;margin:0 auto;padding:20px 16px 90px}
@media(min-width:768px){#pub-inner{padding:26px 28px 90px}}
@media(min-width:1100px){#pub-inner{max-width:1000px;padding:30px 36px 90px}}

/* ── GRIDS ── */
.svc-grid,.staff-grid{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:640px){
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .staff-grid{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:1000px){
  .svc-grid{grid-template-columns:repeat(3,1fr)}
  .staff-grid{grid-template-columns:repeat(3,1fr)}
}
.svc-grid>div,.staff-grid>div{margin-bottom:0!important}