/*
 * WCOVALI TMS - FUNDACAO VISUAL
 * Camada final de compatibilidade para telas administrativas antigas.
 * Nao altera fluxos nem telas imersivas de cotacao, viagem ou motorista.
 */

:root{
  --wc-ui-navy:#102a50;
  --wc-ui-blue:#1677ed;
  --wc-ui-text:#17223b;
  --wc-ui-muted:#667085;
  --wc-ui-line:#dfe7f0;
  --wc-ui-surface:#ffffff;
  --wc-ui-canvas:#f5f8fc;
  --wc-ui-radius:16px;
  --wc-ui-shadow:0 24px 70px rgba(15,23,42,.24),0 6px 20px rgba(15,23,42,.09);
}

/* Pop-up administrativo comum: compacto e proporcional ao conteudo. */
body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen).show{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:clamp(16px,4vh,44px) 20px !important;
  overflow:hidden !important;
  z-index:11000 !important;
}

body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
>.modalbox{
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) !important;
  width:min(820px,calc(100vw - 40px)) !important;
  height:auto !important;
  min-height:0 !important;
  max-height:calc(100dvh - 48px) !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  border:1px solid rgba(208,218,231,.92) !important;
  border-radius:var(--wc-ui-radius) !important;
  background:var(--wc-ui-surface) !important;
  box-shadow:var(--wc-ui-shadow) !important;
}

body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
>.modalbox.client-modalbox{
  width:min(600px,calc(100vw - 40px)) !important;
}

body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
>.modalbox.order-modalbox,
body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
>.modalbox.user-modalbox,
body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
>.modalbox.trip-edit-modalbox,
body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
>.modalbox.trip-track-modalbox{
  width:min(1120px,calc(100vw - 40px)) !important;
}

/* Cabecalho unico, sempre visivel e com area de toque segura. */
body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
>.modalbox>div:first-child{
  position:relative !important;
  top:auto !important;
  z-index:30 !important;
  min-height:58px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px !important;
  padding:12px 16px 12px 20px !important;
  border-bottom:1px solid var(--wc-ui-line) !important;
  background:var(--wc-ui-surface) !important;
}

body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen) #mt{
  margin:0 !important;
  color:var(--wc-ui-navy) !important;
  font-size:18px !important;
  line-height:1.25 !important;
}

body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
>.modalbox>div:first-child>button{
  position:relative !important;
  inset:auto !important;
  width:40px !important;
  height:40px !important;
  min-width:40px !important;
  min-height:40px !important;
  flex:0 0 40px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 !important;
  padding:0 !important;
  border:1px solid #d7e0eb !important;
  border-radius:11px !important;
  background:#fff !important;
  color:#475467 !important;
  cursor:pointer !important;
  pointer-events:auto !important;
}

body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
>.modalbox>div:first-child>button::before{
  content:"\00D7" !important;
  display:block !important;
  color:#475467 !important;
  font-size:24px !important;
  font-weight:400 !important;
  line-height:1 !important;
}

body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
>.modalbox>div:first-child>button::after{
  content:none !important;
  display:none !important;
}

/* Somente o corpo rola; o pop-up nao cresce alem da tela. */
body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
>.modalbox>#mb{
  min-width:0 !important;
  min-height:0 !important;
  max-height:none !important;
  padding:18px 20px 20px !important;
  overflow:auto !important;
  overscroll-behavior:contain;
  background:var(--wc-ui-canvas) !important;
}

/* Campos e botoes com proporcao consistente, sem caixas exageradas. */
body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen) #mb
input:not([type="checkbox"]):not([type="radio"]),
body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen) #mb select{
  min-height:40px;
}

body.wc-layout-v3:not(.wc-motorista-mobile)
#modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen) #mb
button:not(.wc-user-tab){
  min-height:38px;
}

@media(max-width:700px){
  body.wc-layout-v3:not(.wc-motorista-mobile)
  #modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen).show{
    align-items:flex-end !important;
    padding:8px !important;
  }

  body.wc-layout-v3:not(.wc-motorista-mobile)
  #modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
  >.modalbox,
  body.wc-layout-v3:not(.wc-motorista-mobile)
  #modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
  >.modalbox.client-modalbox,
  body.wc-layout-v3:not(.wc-motorista-mobile)
  #modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
  >.modalbox.order-modalbox,
  body.wc-layout-v3:not(.wc-motorista-mobile)
  #modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
  >.modalbox.user-modalbox,
  body.wc-layout-v3:not(.wc-motorista-mobile)
  #modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
  >.modalbox.trip-edit-modalbox,
  body.wc-layout-v3:not(.wc-motorista-mobile)
  #modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
  >.modalbox.trip-track-modalbox{
    width:100% !important;
    max-height:calc(100dvh - 16px) !important;
    border-radius:16px 16px 12px 12px !important;
  }

  body.wc-layout-v3:not(.wc-motorista-mobile)
  #modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
  >.modalbox>div:first-child{
    min-height:54px !important;
    padding:9px 10px 9px 14px !important;
  }

  body.wc-layout-v3:not(.wc-motorista-mobile)
  #modal:not(.wc-quote-modal):not(.wc-trip-modal):not(.wc-mm-trip-screen)
  >.modalbox>#mb{
    padding:14px 12px 18px !important;
  }
}
