/* Meu Roteirista v5.8.1 — Shell adaptativo multiplataforma.
   Objetivo: manter a linguagem visual premium sem tratar todo aparelho como um iPhone gigante. */
:root{
  --mr-safe-top:env(safe-area-inset-top,0px);
  --mr-safe-right:env(safe-area-inset-right,0px);
  --mr-safe-bottom:env(safe-area-inset-bottom,0px);
  --mr-safe-left:env(safe-area-inset-left,0px);
  --mr-tab-content-h:54px;
  --nav-h:var(--mr-tab-content-h);
}
html{min-height:100%;height:100%;overscroll-behavior-y:none}
body.ios-shell-v58{min-height:100dvh;padding-bottom:calc(var(--mr-tab-content-h) + var(--mr-safe-bottom));}
@supports not (height:100dvh){body.ios-shell-v58{min-height:calc(var(--mr-vh,1vh) * 100)}}

/* Barra inferior compacta no celular: 54px de conteúdo + somente a safe-area real do aparelho. */
body.ios-shell-v58 .bottom-nav{
  height:calc(var(--mr-tab-content-h) + var(--mr-safe-bottom));
  padding:3px max(8px,var(--mr-safe-right)) var(--mr-safe-bottom) max(8px,var(--mr-safe-left));
  align-items:stretch;
}
body.ios-shell-v58 .bottom-nav .nav-btn{
  min-width:0;min-height:44px;padding:2px 4px;border-radius:11px;gap:1px;
  font-size:.64rem;line-height:1.05;
}
body.ios-shell-v58 .bottom-nav .nav-btn .ico{width:22px;height:22px}
body.ios-shell-v58 .bottom-nav .nav-btn .ico svg{width:21px;height:21px}
body.ios-shell-v58 .main{padding-bottom:22px}
body.ios-shell-v58 .page-footer{margin-bottom:2px}

/* Barra de ações do motorista: continua grande o suficiente para uso em campo, sem virar um rodapé gigante. */
body.ios-shell-v58 .driver{padding-bottom:calc(68px + var(--mr-safe-bottom))}
body.ios-shell-v58 .driver-bottom{
  padding:6px max(10px,var(--mr-safe-right)) calc(6px + var(--mr-safe-bottom)) max(10px,var(--mr-safe-left));
  min-height:calc(68px + var(--mr-safe-bottom));gap:8px;
}
body.ios-shell-v58 .driver-bottom .btn{min-height:56px;font-size:.98rem;border-radius:14px}
body.ios-shell-v58 .wizard-actions{padding:7px max(12px,var(--mr-safe-right)) calc(7px + var(--mr-safe-bottom)) max(12px,var(--mr-safe-left))}

/* Telefones compactos. */
@media (max-width:430px){
  :root{--mr-tab-content-h:52px;--header-h:78px}
  body.ios-shell-v58 .header{padding-left:max(13px,var(--mr-safe-left));padding-right:max(11px,var(--mr-safe-right))}
  body.ios-shell-v58 .logo{width:40px;height:40px;border-radius:11px}
  body.ios-shell-v58 .brand-copy strong{font-size:1.03rem}
  body.ios-shell-v58 .brand-copy span{font-size:.7rem}
  body.ios-shell-v58 .avatar{width:36px;height:36px}
  body.ios-shell-v58 .main{padding:12px 11px 18px}
  body.ios-shell-v58 .bottom-nav .nav-btn{font-size:.61rem}
}

/* Telefone em paisagem: navegação horizontal, menor e sem roubar altura útil. */
@media (orientation:landscape) and (max-height:540px) and (max-width:980px){
  :root{--mr-tab-content-h:46px;--header-h:62px}
  body.ios-shell-v58 .header{padding-top:0}
  body.ios-shell-v58 .logo{width:36px;height:36px;border-radius:10px}
  body.ios-shell-v58 .brand-copy span{display:none}
  body.ios-shell-v58 .bottom-nav{padding-top:2px}
  body.ios-shell-v58 .bottom-nav .nav-btn{flex-direction:row;gap:5px;min-height:40px;font-size:.64rem}
  body.ios-shell-v58 .bottom-nav .nav-btn .ico{width:20px;height:20px}
  body.ios-shell-v58 .bottom-nav .nav-btn .ico svg{width:19px;height:19px}
  body.ios-shell-v58 .main{padding-top:10px}
  body.ios-shell-v58 .driver{padding-bottom:calc(58px + var(--mr-safe-bottom))}
  body.ios-shell-v58 .driver-bottom{min-height:calc(58px + var(--mr-safe-bottom));padding-top:4px;padding-bottom:calc(4px + var(--mr-safe-bottom))}
  body.ios-shell-v58 .driver-bottom .btn{min-height:48px}
}

/* Tablets: o rodapé deixa de ocupar toda a largura e vira um dock compacto centralizado. */
@media (min-width:700px) and (max-width:1099px){
  :root{--mr-tab-content-h:58px;--header-h:80px}
  body.ios-shell-v58{padding-bottom:calc(82px + var(--mr-safe-bottom))}
  body.ios-shell-v58 .main{max-width:820px;padding:20px 22px 34px}
  body.ios-shell-v58 .bottom-nav{
    left:50%;right:auto;bottom:max(10px,var(--mr-safe-bottom));transform:translateX(-50%);
    width:min(560px,calc(100vw - 32px));height:58px;padding:4px 8px;
    border:1px solid var(--border);border-radius:20px;overflow:hidden;
    box-shadow:0 10px 35px rgba(0,0,0,.10);
  }
  body.ios-shell-v58 .bottom-nav .nav-btn{min-height:48px;font-size:.68rem}
  body.ios-shell-v58 .bottom-nav .nav-btn.active{background:var(--blue-soft)!important}
  body.ios-shell-v58 .driver-body{max-width:860px}
}

/* Desktop/notebook: tab bar inferior não faz sentido. Vira uma navigation rail lateral. */
@media (min-width:1100px) and (hover:hover) and (pointer:fine){
  :root{--header-h:72px;--mr-tab-content-h:0px}
  body.ios-shell-v58{padding-bottom:0}
  body.ios-shell-v58 .header{height:var(--header-h);padding-top:0;padding-left:24px;padding-right:24px}
  body.ios-shell-v58 .main{
    max-width:900px;width:auto;margin-left:max(126px,calc((100vw - 900px)/2));margin-right:28px;
    padding:24px 20px 44px;
  }
  body.ios-shell-v58 .bottom-nav{
    top:calc(var(--header-h) + 18px);bottom:auto;left:18px;right:auto;transform:none;
    width:92px;height:auto;padding:7px;grid-template-columns:1fr;gap:4px;
    border:1px solid var(--border);border-radius:22px;overflow:hidden;
    box-shadow:0 10px 34px rgba(0,0,0,.08);
  }
  body.ios-shell-v58 .bottom-nav .nav-btn{min-height:68px;padding:8px 4px;font-size:.68rem;gap:5px}
  body.ios-shell-v58 .bottom-nav .nav-btn .ico{width:25px;height:25px}
  body.ios-shell-v58 .bottom-nav .nav-btn.active{background:var(--blue-soft)!important}
  body.ios-shell-v58 .driver-bottom{left:50%;right:auto;transform:translateX(-50%);width:min(760px,calc(100vw - 220px));bottom:18px;border:1px solid var(--border);border-radius:20px;padding:8px;box-shadow:0 12px 38px rgba(0,0,0,.12)}
  body.ios-shell-v58 .driver{padding-bottom:96px}
}

/* Plataforma: pequenos ajustes sem duplicar a interface. */
body.mr-platform-android.ios-shell-v58 .bottom-nav{backdrop-filter:none;-webkit-backdrop-filter:none}
body.mr-platform-android.ios-shell-v58 .nav-btn{font-family:system-ui,"Roboto","Segoe UI",sans-serif}
body.mr-platform-desktop.ios-shell-v58 .header{backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
body.mr-display-browser.ios-shell-v58 .bottom-nav{background:color-mix(in srgb,var(--surface) 96%,transparent)}

/* Acessibilidade: não reduzimos alvos abaixo de 44px mesmo com o rodapé menor. */
@media (pointer:coarse){
  body.ios-shell-v58 button,body.ios-shell-v58 .btn,body.ios-shell-v58 .nav-btn{touch-action:manipulation}
}
@media (hover:none){body.ios-shell-v58 .btn:hover{transform:none}}
@media (prefers-reduced-motion:reduce){body.ios-shell-v58 *,body.ios-shell-v58 *::before,body.ios-shell-v58 *::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
