/* HPI — tablet, desktop e celular deitado.
   ATENÇÃO: a ordem de carregamento (index.php) é a ordem da cascata. Não reordene. */

/* ===== Tablet (≥ 600px) ===== */
@media (min-width:600px){
  body{padding:24px}
  .app-card{max-width:640px;height:min(100dvh - 48px,860px);border-radius:28px;padding-top:0}
  .form-content{padding:28px 28px 0}
  .entry{padding:20px;margin-bottom:20px}
  .fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .campo-outros{grid-column:1 / -1}
  .fac-grid{flex-direction:row;align-items:flex-start;gap:16px}
  .fac-col{flex:1}
  .sv-filtros{grid-template-columns:1fr 1fr auto}
  .sv-status{grid-column:auto}
  .rec-fields{grid-template-columns:1fr 1fr 100px 44px}
  .rec-fields .r-tipo{grid-column:auto}
}

/* ===== Desktop (≥ 1024px): menu lateral, hambúrguer isolado embaixo ===== */
@media (min-width:1024px){
  .app-card{max-width:1280px;flex-direction:row-reverse;height:min(100dvh - 48px,940px)}
  .form-content{padding:44px 56px 0}
  .bottom-menu{
    flex-direction:column;justify-content:flex-start;gap:20px;width:84px;min-height:auto;
    padding:32px 0;border-top:0;border-right:1px solid rgba(255,255,255,.12);
  }
  .menu-hamburger{margin-top:auto}
  .user-menu{inset:auto auto 24px 100px;width:320px;max-height:calc(100% - 48px);padding-top:0;border:1px solid rgba(255,255,255,.15);border-radius:20px;box-shadow:0 20px 40px rgba(0,0,0,.5);overflow-y:auto}
  .fields{grid-template-columns:minmax(180px,1fr) minmax(280px,1.6fr);gap:16px 18px}
  .rec-fields{grid-template-columns:1fr 1.2fr 110px 44px}
  .sv-filtros{grid-template-columns:minmax(220px,1.6fr) minmax(160px,1.2fr) minmax(130px,1fr) auto;gap:14px}
  .sv-filtros .sv-semana{grid-column:auto}
  .save-btn{width:auto;min-width:280px;padding:0 28px}
  .save-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-direction:row-reverse}
  .save-status{margin:0;text-align:left}
  .entry{padding:24px}
  .glow-1{width:420px;height:420px}
  .glow-2{width:360px;height:360px}
}

/* Celular deitado: tudo rola junto */
@media (max-height:520px){
  .form-content{overflow-y:auto}
  .records,.fac-scroll,.sv-lista{overflow:visible;flex:none}
  .bottom-menu{min-height:52px}
  .user-menu{bottom:calc(52px + env(safe-area-inset-bottom,0px))}
}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}