/* ================================================================
   EduCantina 4.0.5 — Portal do Colaborador
   Operação em celular, tablet e navegador.
   ================================================================ */
body.role-operator.action-staff,
body.action-staff{
 --st-navy:#0A2E4D;
 --st-navy-dark:#061E33;
 --st-blue:#1E6CFB;
 --st-green:#16B84E;
 --st-orange:#F59E0B;
 --st-purple:#7454D8;
 --st-red:#EF4444;
 --st-bg:#F4F7FA;
 --st-card:#FFFFFF;
 --st-border:#E2E9EF;
 --st-text:#10233A;
 --st-muted:#718196;
 background:var(--st-bg)!important;
}
body.role-operator.action-staff .layout,
body.role-operator.action-staff .main,
body.role-operator.action-staff .content,
body.action-staff .layout,
body.action-staff .main,
body.action-staff .content{
 background:var(--st-bg)!important;
 min-height:100vh!important;
}
body.action-staff .content{
 max-width:none!important;
 padding-top:14px!important;
}

/* Cabeçalho */
body.action-staff .staff-page-head{
 display:flex!important;
 align-items:center!important;
 justify-content:space-between!important;
 gap:16px!important;
 margin-bottom:13px!important;
}
body.action-staff .staff-page-head h2{
 margin:0!important;
 font-size:25px!important;
 letter-spacing:-.04em!important;
 color:var(--st-text)!important;
}
body.action-staff .staff-page-head p{
 margin:4px 0 0!important;
 font-size:8px!important;
 color:var(--st-muted)!important;
}
body.action-staff .staff-page-actions{
 display:flex!important;
 align-items:center!important;
 gap:8px!important;
}

/* Hero */
body.action-staff .staff-hero{
 position:relative!important;
 overflow:hidden!important;
 display:grid!important;
 grid-template-columns:1fr auto!important;
 align-items:center!important;
 gap:16px!important;
 padding:20px!important;
 margin-bottom:12px!important;
 border-radius:17px!important;
 background:
  radial-gradient(circle at 88% 15%,rgba(255,255,255,.13),transparent 24%),
  linear-gradient(135deg,var(--st-navy-dark),var(--st-navy) 58%,var(--st-blue))!important;
 color:#fff!important;
 box-shadow:0 15px 34px rgba(10,46,77,.18)!important;
}
body.action-staff .staff-hero:after{
 content:"";
 position:absolute;
 width:180px;height:180px;
 right:-70px;bottom:-120px;
 border:1px solid rgba(255,255,255,.11);
 border-radius:50%;
}
body.action-staff .staff-hero small,
body.action-staff .staff-hero span{
 display:block!important;
}
body.action-staff .staff-hero small{
 font-size:7.5px!important;
 color:#BFD0DD!important;
}
body.action-staff .staff-hero h3{
 font-size:20px!important;
 color:#fff!important;
 margin:5px 0 4px!important;
 letter-spacing:-.03em!important;
}
body.action-staff .staff-hero span{
 font-size:7.5px!important;
 color:#D5E2EA!important;
}
body.action-staff .staff-hero-icon{
 width:54px!important;
 height:54px!important;
 border-radius:16px!important;
 display:grid!important;
 place-items:center!important;
 background:rgba(255,255,255,.13)!important;
 border:1px solid rgba(255,255,255,.18)!important;
 font-size:23px!important;
 z-index:2!important;
}

/* KPIs */
body.action-staff .staff-kpis{
 display:grid!important;
 grid-template-columns:repeat(4,minmax(0,1fr))!important;
 gap:10px!important;
 margin-bottom:12px!important;
}
body.action-staff .staff-kpis>div,
body.action-staff .staff-kpis>a{
 min-height:101px!important;
 padding:13px!important;
 background:#fff!important;
 border:1px solid var(--st-border)!important;
 border-radius:13px!important;
 box-shadow:0 4px 14px rgba(10,46,77,.045)!important;
 color:var(--st-text)!important;
 position:relative!important;
 overflow:hidden!important;
}
body.action-staff .staff-kpis>div:before,
body.action-staff .staff-kpis>a:before{
 content:"";
 position:absolute;
 left:0;right:0;top:0;
 height:3px;
 background:linear-gradient(90deg,var(--st-blue),var(--st-green));
}
body.action-staff .staff-kpis span,
body.action-staff .staff-kpis small{
 display:block!important;
}
body.action-staff .staff-kpis span{
 font-size:7.5px!important;
 color:#68798B!important;
 font-weight:700!important;
}
body.action-staff .staff-kpis strong{
 display:block!important;
 font-size:20px!important;
 color:var(--st-text)!important;
 margin:7px 0 3px!important;
}
body.action-staff .staff-kpis small{
 font-size:6.7px!important;
 color:#8795A5!important;
}

/* Ações principais */
body.action-staff .staff-action-grid{
 display:grid!important;
 grid-template-columns:repeat(4,minmax(0,1fr))!important;
 gap:10px!important;
 margin-bottom:12px!important;
}
body.action-staff .staff-action-grid a{
 min-height:125px!important;
 padding:15px!important;
 border:1px solid var(--st-border)!important;
 border-radius:14px!important;
 background:#fff!important;
 box-shadow:0 4px 14px rgba(10,46,77,.045)!important;
 color:var(--st-text)!important;
 display:flex!important;
 flex-direction:column!important;
 align-items:flex-start!important;
 justify-content:space-between!important;
 transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease!important;
}
body.action-staff .staff-action-grid a:hover{
 transform:translateY(-2px)!important;
 border-color:#C9D8E2!important;
 box-shadow:0 9px 22px rgba(10,46,77,.08)!important;
}
body.action-staff .staff-action-grid i{
 width:40px!important;
 height:40px!important;
 border-radius:12px!important;
 display:grid!important;
 place-items:center!important;
 font-style:normal!important;
 font-size:18px!important;
}
body.action-staff .staff-action-grid a:nth-child(1) i{
 background:#EAF9EF!important;color:var(--st-green)!important;
}
body.action-staff .staff-action-grid a:nth-child(2) i{
 background:#EAF2FF!important;color:var(--st-blue)!important;
}
body.action-staff .staff-action-grid a:nth-child(3) i{
 background:#FFF4DF!important;color:var(--st-orange)!important;
}
body.action-staff .staff-action-grid a:nth-child(4) i{
 background:#F1EEFF!important;color:var(--st-purple)!important;
}
body.action-staff .staff-action-grid a:nth-child(5) i{
 background:#EAF2FF!important;color:var(--st-blue)!important;
}
body.action-staff .staff-action-grid a:nth-child(6) i{
 background:#E9F9EE!important;color:var(--st-green)!important;
}
body.action-staff .staff-action-grid a:nth-child(7) i{
 background:#FDECEC!important;color:var(--st-red)!important;
}
body.action-staff .staff-action-grid a:nth-child(8) i{
 background:#F2F5F7!important;color:#536579!important;
}
body.action-staff .staff-action-grid strong{
 display:block!important;
 font-size:9.5px!important;
 color:var(--st-text)!important;
}
body.action-staff .staff-action-grid small{
 display:block!important;
 font-size:6.8px!important;
 color:#8493A3!important;
 line-height:1.35!important;
 margin-top:4px!important;
}

/* Painéis operacionais */
body.action-staff .staff-panels{
 display:grid!important;
 grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr)!important;
 gap:11px!important;
}
body.action-staff .staff-panel{
 background:#fff!important;
 border:1px solid var(--st-border)!important;
 border-radius:14px!important;
 box-shadow:0 4px 14px rgba(10,46,77,.045)!important;
 overflow:hidden!important;
}
body.action-staff .staff-panel-head{
 display:flex!important;
 justify-content:space-between!important;
 align-items:center!important;
 gap:10px!important;
 padding:13px 14px!important;
 border-bottom:1px solid #EDF2F6!important;
}
body.action-staff .staff-panel-head h3{
 margin:0!important;
 font-size:10px!important;
 color:var(--st-text)!important;
}
body.action-staff .staff-panel-head a{
 font-size:7px!important;
 color:var(--st-blue)!important;
}
body.action-staff .staff-order-row{
 display:grid!important;
 grid-template-columns:33px 1fr auto!important;
 align-items:center!important;
 gap:8px!important;
 padding:10px 13px!important;
 border-bottom:1px solid #EDF2F6!important;
}
body.action-staff .staff-order-row:last-child{
 border-bottom:0!important;
}
body.action-staff .staff-order-row i{
 width:31px!important;height:31px!important;
 border-radius:9px!important;
 background:linear-gradient(135deg,#EAF2FF,#E9F9EE)!important;
 color:var(--st-navy)!important;
 display:grid!important;place-items:center!important;
 font-style:normal!important;
 font-size:8px!important;font-weight:800!important;
}
body.action-staff .staff-order-row strong,
body.action-staff .staff-order-row small{
 display:block!important;
}
body.action-staff .staff-order-row strong{
 font-size:8.5px!important;
 color:var(--st-text)!important;
}
body.action-staff .staff-order-row small{
 font-size:6.6px!important;
 color:#8191A2!important;
 margin-top:2px!important;
}
body.action-staff .staff-order-row b{
 font-size:7px!important;
 color:#536579!important;
}
body.action-staff .staff-shift-status{
 padding:14px!important;
}
body.action-staff .staff-shift-card{
 padding:13px!important;
 border-radius:12px!important;
 background:linear-gradient(135deg,#F9FBFD,#F4F8FB)!important;
 border:1px solid #E6EDF2!important;
}
body.action-staff .staff-shift-card span,
body.action-staff .staff-shift-card small{
 display:block!important;
}
body.action-staff .staff-shift-card span{
 font-size:7px!important;
 color:#718196!important;
}
body.action-staff .staff-shift-card strong{
 display:block!important;
 font-size:14px!important;
 color:var(--st-text)!important;
 margin:5px 0 3px!important;
}
body.action-staff .staff-shift-card small{
 font-size:6.5px!important;
 color:#8795A5!important;
}
body.action-staff .staff-shift-actions{
 display:grid!important;
 grid-template-columns:1fr 1fr!important;
 gap:7px!important;
 margin-top:9px!important;
}

/* Navegação mobile */
body.action-staff .staff-mobile-nav{
 display:none!important;
}
@media(max-width:900px){
 body.action-staff .layout,
 body.action-staff .main,
 body.action-staff .content{
  min-height:100vh!important;
 }
 body.action-staff .side{
  display:none!important;
 }
 body.action-staff .main{
  margin-left:0!important;
 }
 body.action-staff .topbar{
  display:none!important;
 }
 body.action-staff .content{
  max-width:460px!important;
  margin:0 auto!important;
  padding:12px 11px 92px!important;
 }
 body.action-staff .staff-page-head{
  margin-bottom:10px!important;
 }
 body.action-staff .staff-page-head h2{
  font-size:18px!important;
 }
 body.action-staff .staff-page-head p{
  font-size:7px!important;
 }
 body.action-staff .staff-page-actions{
  display:none!important;
 }
 body.action-staff .staff-hero{
  padding:16px!important;
  border-radius:16px!important;
 }
 body.action-staff .staff-hero h3{
  font-size:17px!important;
 }
 body.action-staff .staff-hero-icon{
  width:46px!important;
  height:46px!important;
  border-radius:14px!important;
  font-size:20px!important;
 }
 body.action-staff .staff-kpis{
  grid-template-columns:repeat(2,1fr)!important;
 }
 body.action-staff .staff-kpis>div,
 body.action-staff .staff-kpis>a{
  min-height:82px!important;
  padding:11px!important;
 }
 body.action-staff .staff-kpis strong{
  font-size:17px!important;
 }
 body.action-staff .staff-action-grid{
  grid-template-columns:repeat(2,1fr)!important;
  gap:8px!important;
 }
 body.action-staff .staff-action-grid a{
  min-height:112px!important;
  padding:13px!important;
 }
 body.action-staff .staff-action-grid i{
  width:38px!important;
  height:38px!important;
 }
 body.action-staff .staff-panels{
  grid-template-columns:1fr!important;
 }
 body.action-staff .staff-mobile-nav{
  position:fixed!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  bottom:0!important;
  z-index:3000!important;
  width:min(100%,460px)!important;
  min-height:69px!important;
  padding:7px 9px calc(7px + env(safe-area-inset-bottom))!important;
  display:grid!important;
  grid-template-columns:repeat(5,1fr)!important;
  background:rgba(255,255,255,.97)!important;
  border-top:1px solid var(--st-border)!important;
  box-shadow:0 -8px 22px rgba(10,46,77,.07)!important;
  backdrop-filter:blur(16px)!important;
 }
 body.action-staff .staff-mobile-nav a{
  border-radius:9px!important;
  color:#728296!important;
  font-size:6.2px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
 }
 body.action-staff .staff-mobile-nav a i{
  font-size:15px!important;
  font-style:normal!important;
 }
 body.action-staff .staff-mobile-nav a.active{
  background:#EAF2FF!important;
  color:var(--st-blue)!important;
 }
}

/* Tablet */
@media(min-width:901px) and (max-width:1150px){
 body.action-staff .staff-action-grid{
  grid-template-columns:repeat(3,1fr)!important;
 }
 body.action-staff .staff-kpis{
  grid-template-columns:repeat(2,1fr)!important;
 }
}

/* Impressão */
@media print{
 body.action-staff .side,
 body.action-staff .topbar,
 body.action-staff .staff-mobile-nav,
 body.action-staff .staff-action-grid,
 body.action-staff .staff-page-actions{
  display:none!important;
 }
 body.action-staff .main{
  margin:0!important;
 }
 body.action-staff .content{
  padding:0!important;
 }
}