/* Drive22 UI System — modernização visual sem alterar contratos JS/PHP */
@import url("drive22-tokens.css");
@import url("drive22-components.css");
@import url("drive22-passenger.css");
@import url("drive22-driver.css");
@import url("drive22-admin.css");
:root{
  --d22-bg:#f4f7fb;
  --d22-surface:#ffffff;
  --d22-surface-soft:#f8fafc;
  --d22-text:#142033;
  --d22-muted:#64748b;
  --d22-line:#e2e8f0;
  --d22-primary:#2457e6;
  --d22-primary-dark:#173a9b;
  --d22-primary-soft:#eef3ff;
  --d22-success:#11845b;
  --d22-danger:#c43d4d;
  --d22-warning:#d98a00;
  --d22-radius-sm:12px;
  --d22-radius:18px;
  --d22-radius-lg:26px;
  --d22-shadow-sm:0 6px 18px rgba(20,32,51,.08);
  --d22-shadow:0 18px 45px rgba(20,32,51,.14);
  --d22-safe-bottom:max(16px,env(safe-area-inset-bottom));
}
*{box-sizing:border-box}
html,body{min-height:100%;background:var(--d22-bg)}
body.drive22-ui{
  margin:0;
  color:var(--d22-text);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.drive22-ui button,.drive22-ui input,.drive22-ui select,.drive22-ui textarea{font:inherit}
.drive22-ui .form-control,.drive22-ui .form-select{
  min-height:52px;
  border:1px solid var(--d22-line);
  border-radius:14px;
  background:#fff;
  color:var(--d22-text);
  padding:.75rem 1rem;
  box-shadow:none;
}
.drive22-ui .form-control:focus,.drive22-ui .form-select:focus{
  border-color:var(--d22-primary);
  box-shadow:0 0 0 4px rgba(36,87,230,.12);
}
.drive22-ui .btn{
  min-height:46px;
  border-radius:14px;
  font-weight:700;
  letter-spacing:.01em;
  border-width:1px;
}
.drive22-ui .btn-primary,.drive22-ui .btn-warning{
  color:#fff!important;
  border-color:var(--d22-primary)!important;
  background:linear-gradient(135deg,var(--d22-primary),var(--d22-primary-dark))!important;
  box-shadow:0 10px 24px rgba(36,87,230,.22);
}
.drive22-ui .btn-success{
  background:var(--d22-success)!important;border-color:var(--d22-success)!important;color:#fff!important
}
.drive22-ui .btn-danger{background:var(--d22-danger)!important;border-color:var(--d22-danger)!important;color:#fff!important}
.drive22-ui .btn-light,.drive22-ui .btn-secondary{
  background:#fff!important;border-color:var(--d22-line)!important;color:var(--d22-text)!important
}
.drive22-ui .modal-content{
  border:0;
  border-radius:24px;
  box-shadow:var(--d22-shadow);
  overflow:hidden;
}
.drive22-ui .modal-header,.drive22-ui .modal-footer{border-color:var(--d22-line);padding:18px 20px}
.drive22-ui .modal-body{padding:20px}
.drive22-ui .modal-title{font-weight:800;color:var(--d22-text)}
.drive22-ui .card{border:1px solid rgba(226,232,240,.9);border-radius:20px;box-shadow:var(--d22-shadow-sm)}
.drive22-ui .material-icons,.drive22-ui .bi{line-height:1}

/* Auth / onboarding passageiro */
.passenger-ui.auth-screen{
  min-height:100vh;
  background:
    radial-gradient(circle at 10% 0%,rgba(36,87,230,.12),transparent 34%),
    linear-gradient(180deg,#f8fbff 0%,#eef3f9 100%);
}
.passenger-ui.auth-screen #loading-page-bb{max-width:520px;margin:0 auto;padding:22px 20px 40px!important}
.passenger-ui.auth-screen #tela_logo{
  background:transparent!important;
  height:auto!important;
  padding-top:24px;
  display:flex!important;
  justify-content:center!important;
}
.passenger-ui.auth-screen #logo{
  width:min(190px,48vw)!important;
  height:auto!important;
  object-fit:contain;
  filter:drop-shadow(0 12px 24px rgba(20,32,51,.08));
}
.passenger-ui.auth-screen #login,
.passenger-ui.auth-screen #container_cadastro{
  background:rgba(255,255,255,.96);
  border:1px solid rgba(226,232,240,.9);
  border-radius:var(--d22-radius-lg);
  padding:24px!important;
  box-shadow:var(--d22-shadow);
}
.passenger-ui.auth-screen #tela_text_box,
.passenger-ui.auth-screen #tela_txt_cadastro,
.passenger-ui.auth-screen #tela_cadastrar,
.passenger-ui.auth-screen #tela_recuperar{
  background:transparent!important;
}
.passenger-ui.auth-screen #tela_text_box p,
.passenger-ui.auth-screen #tela_txt_cadastro p{
  color:var(--d22-text)!important;
  font-size:1.4rem!important;
  font-weight:800!important;
  letter-spacing:-.02em;
  text-align:center;
  margin:8px 0 14px;
}
.passenger-ui.auth-screen #logar_btn{width:100%;min-height:52px}
.passenger-ui.auth-screen #recuperar_lbl,
.passenger-ui.auth-screen #cadastrar_lbl,
.passenger-ui.auth-screen #logar_lbl{display:block;text-align:center;color:var(--d22-muted)!important}
.passenger-ui.auth-screen #cadastrar_lbl span,
.passenger-ui.auth-screen #logar_lbl span{color:var(--d22-primary)!important;font-weight:800}

/* Home passageiro — mapa como superfície principal, ações em cards elevados */
.passenger-ui.home-screen{background:#e7edf5;overflow:hidden}
.passenger-ui.home-screen #audio,.passenger-ui.home-screen #audio_message{display:none!important}
.passenger-ui.home-screen #cabecalho{
  top:max(10px,env(safe-area-inset-top))!important;
  left:12px!important;right:12px!important;
  width:auto!important;
  min-height:56px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(255,255,255,.8)!important;
  box-shadow:0 10px 30px rgba(20,32,51,.13)!important;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  overflow:hidden;
}
.passenger-ui.home-screen #txt_cabecalho{color:var(--d22-text)!important;font-weight:800!important}
.passenger-ui.home-screen #icone_menu,.passenger-ui.home-screen #icone_chat{color:var(--d22-text)!important}
.passenger-ui.home-screen #tela_barra_inicio{
  left:10px!important;right:10px!important;bottom:10px!important;
  width:auto!important;height:auto!important;
  max-height:58vh!important;
  border-radius:28px!important;
  background:rgba(255,255,255,.97)!important;
  box-shadow:0 20px 55px rgba(20,32,51,.22)!important;
  border:1px solid rgba(255,255,255,.85)!important;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  padding-bottom:var(--d22-safe-bottom)!important;
  overflow:auto!important;
}
.passenger-ui.home-screen #tela_boas_vindas,
.passenger-ui.home-screen #tela_onde_vamos,
.passenger-ui.home-screen #tela_card_iniciar,
.passenger-ui.home-screen #tela_categorias,
.passenger-ui.home-screen #tela_cabecalho_categorias,
.passenger-ui.home-screen #tela_lista_categorias{
  background:transparent!important;
}
.passenger-ui.home-screen #lbl_boas_vindas{color:var(--d22-muted)!important;font-size:.88rem!important;font-weight:600!important}
.passenger-ui.home-screen #lbl_onde_vamos{color:var(--d22-text)!important;font-size:1.35rem!important;font-weight:800!important;letter-spacing:-.02em}
.passenger-ui.home-screen #card_iniciar,
.passenger-ui.home-screen .meu_card_btn{
  border:1px solid var(--d22-line)!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 7px 18px rgba(20,32,51,.08)!important;
}
.passenger-ui.home-screen #btn_centralizar_mapa{
  width:50px!important;height:50px!important;
  right:18px!important;
  background:#fff!important;
  color:var(--d22-primary)!important;
  border:1px solid rgba(226,232,240,.9)!important;
  box-shadow:var(--d22-shadow-sm)!important;
}
.passenger-ui.home-screen #btn_centralizar_mapa .material-icons{font-size:25px!important}
.passenger-ui.home-screen #tela_menu{
  background:rgba(255,255,255,.98)!important;
  box-shadow:22px 0 55px rgba(20,32,51,.18)!important;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.passenger-ui.home-screen #container_menu{padding:calc(18px + env(safe-area-inset-top)) 16px 26px!important}
.passenger-ui.home-screen #cabecalho_menu{border-radius:22px!important;background:var(--d22-primary-soft)!important}
.passenger-ui.home-screen #tela_carteira_credito,
.passenger-ui.home-screen #tela_meus_dados,
.passenger-ui.home-screen #tela_historico_corridas,
.passenger-ui.home-screen #tela_motoristas_favoritos,
.passenger-ui.home-screen #tela_indique_ganhe,
.passenger-ui.home-screen #tela_fale_conosco,
.passenger-ui.home-screen #tela_politica_privacidade,
.passenger-ui.home-screen #tela_sair{
  background:#fff!important;
  border-bottom:1px solid #eef2f7!important;
}
.passenger-ui.home-screen #tela_status{
  border-radius:28px 28px 0 0!important;
  background:rgba(255,255,255,.98)!important;
  box-shadow:0 -18px 48px rgba(20,32,51,.16)!important;
  overflow:hidden;
}
.passenger-ui.home-screen #tela_status [style*="background-color: #ffffff"],
.passenger-ui.home-screen #tela_status [style*="background-color:#ffffff"]{background:transparent!important}
.passenger-ui.home-screen #img_motorista{
  border-radius:24px!important;
  object-fit:cover;
  box-shadow:0 8px 20px rgba(20,32,51,.14);
}
.passenger-ui.home-screen #txt_status{color:var(--d22-text)!important;font-size:1.2rem!important}
.passenger-ui.home-screen #txt_timer{color:var(--d22-primary)!important;font-size:2rem!important}

/* Telas secundárias passageiro */
.passenger-ui:not(.home-screen):not(.auth-screen){background:var(--d22-bg)}
.passenger-ui .wallet-shell,.passenger-ui .history-shell{max-width:760px;margin:0 auto;padding:18px 14px 34px}
.passenger-ui .history-card,.passenger-ui .wallet-card{
  border:1px solid var(--d22-line)!important;border-radius:20px!important;background:#fff!important;box-shadow:var(--d22-shadow-sm)!important
}
.passenger-ui #cabecalho_msg,.passenger-ui #tela_cabecalho{
  background:rgba(255,255,255,.96)!important;
  color:var(--d22-text)!important;
  border-bottom:1px solid var(--d22-line)!important;
  box-shadow:0 8px 22px rgba(20,32,51,.07);
  backdrop-filter:blur(12px);
}
.passenger-ui #btn_back,.passenger-ui #icone_voltar{color:var(--d22-primary)!important}

/* Motorista */
.driver-ui{
  background:
    radial-gradient(circle at 50% -10%,rgba(36,87,230,.10),transparent 34%),
    var(--d22-bg)!important;
  color:var(--d22-text);
}
.driver-ui .cabecalho{
  margin:10px 10px 0!important;
  border-radius:18px!important;
  background:rgba(14,29,53,.96)!important;
  color:#fff!important;
  padding:14px 16px!important;
  box-shadow:0 12px 28px rgba(14,29,53,.2)!important;
  backdrop-filter:blur(12px);
}
.driver-ui #lbl_localizacao{color:#d7e2ff!important;font-size:.78rem}
.driver-ui .form-switch .form-check-input:checked{background-color:var(--d22-success);border-color:var(--d22-success)}
.driver-ui .ganhos-wrapper{background:transparent!important;padding:10px!important}
.driver-ui .ganhos-card{
  border:1px solid rgba(226,232,240,.9)!important;
  border-radius:22px!important;
  box-shadow:var(--d22-shadow)!important;
}
.driver-ui .ganhos-subtitulo{color:var(--d22-muted)!important}
.driver-ui .ganhos-valor{color:var(--d22-success)!important;font-size:1.75rem!important}
.driver-ui .ganhos-kpi-grid{border-color:var(--d22-line)!important}
.driver-ui .ganhos-kpi-label{color:var(--d22-muted)!important}
.driver-ui .ganhos-kpi-value{color:var(--d22-text)!important}
.driver-ui .card_corrida_disponivel{
  width:calc(100% - 20px)!important;
  max-width:620px;
  border:1px solid rgba(226,232,240,.92)!important;
  border-radius:24px!important;
  box-shadow:0 24px 65px rgba(20,32,51,.24)!important;
  overflow:hidden;
}
.driver-ui .card_corrida_disponivel .card-header{
  background:var(--d22-surface-soft)!important;
  color:var(--d22-text)!important;
  border-bottom:1px solid var(--d22-line)!important;
  padding:14px 16px!important;
}
.driver-ui .card_corrida_disponivel .card-body{padding:18px!important}
.driver-ui .mensagens-box,.driver-ui .chamados{
  border-radius:24px!important;
  background:#fff!important;
  box-shadow:var(--d22-shadow)!important;
}
.driver-ui .mensagem-motorista{
  background:#edf2f7!important;color:var(--d22-text)!important;border-radius:16px 16px 16px 4px!important
}
.driver-ui .mensagem-usuario{
  background:var(--d22-primary)!important;color:#fff!important;border-radius:16px 16px 4px 16px!important
}
.driver-ui .bottom-nav{
  left:10px!important;right:10px!important;bottom:10px!important;width:auto!important;
  border:1px solid rgba(226,232,240,.92)!important;
  border-radius:22px!important;
  padding:7px 5px calc(7px + env(safe-area-inset-bottom))!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 14px 38px rgba(20,32,51,.18)!important;
}
.driver-ui .bottom-nav .nav-item a{color:var(--d22-muted)!important;font-weight:700!important}
.driver-ui .bottom-nav .nav-item a.active{color:var(--d22-primary)!important}
.driver-ui #btn_toggle_ganhos{
  background:var(--d22-primary)!important;
  box-shadow:0 8px 20px rgba(36,87,230,.28)!important;
}
.driver-ui.auth-screen .login-card{
  border:1px solid var(--d22-line)!important;
  border-radius:26px!important;
  box-shadow:var(--d22-shadow)!important;
  background:rgba(255,255,255,.97)!important;
}
.driver-ui.auth-screen .btn-custom{
  background:linear-gradient(135deg,var(--d22-primary),var(--d22-primary-dark))!important;
  color:#fff!important;border:0!important;border-radius:14px!important;min-height:52px;font-weight:800
}
.driver-ui .card-historico{
  border:1px solid var(--d22-line)!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:var(--d22-shadow-sm)!important;
}

/* Acessibilidade e interação */
.drive22-ui :focus-visible{outline:3px solid rgba(36,87,230,.35);outline-offset:2px}
.drive22-ui a{color:var(--d22-primary)}
.drive22-ui .text-primary{color:var(--d22-primary)!important}
@media (prefers-reduced-motion:reduce){
  .drive22-ui *{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
@media (min-width:768px){
  .passenger-ui.home-screen #tela_barra_inicio{left:50%!important;right:auto!important;transform:translateX(-50%)!important;width:min(560px,calc(100% - 32px))!important}
  .driver-ui .card_corrida_disponivel{width:min(620px,calc(100% - 32px))!important}
}

/* Login social */
.passenger-ui.auth-screen .social-login-divider{
  display:flex;
  align-items:center;
  gap:12px;
  margin:20px 0 14px;
  color:var(--d22-muted);
  font-size:.85rem;
  font-weight:700;
}
.passenger-ui.auth-screen .social-login-divider::before,
.passenger-ui.auth-screen .social-login-divider::after{
  content:"";
  flex:1;
  height:1px;
  background:var(--d22-line);
}
.passenger-ui.auth-screen .social-login-actions{
  display:grid;
  gap:10px;
}
.passenger-ui.auth-screen .social-login-btn{
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:1px solid var(--d22-line);
  border-radius:14px;
  background:#fff;
  color:var(--d22-text);
  text-decoration:none;
  font-weight:800;
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.passenger-ui.auth-screen .social-login-btn:hover{
  color:var(--d22-text);
  border-color:#cbd5e1;
  box-shadow:var(--d22-shadow-sm);
  transform:translateY(-1px);
}
.passenger-ui.auth-screen .social-login-btn .bi{
  font-size:1.15rem;
}
.passenger-ui.auth-screen .social-login-facebook .bi{
  color:#1877f2;
}