/* ExpressMED · Entregas — identidade do site expressmed.com.br */
:root {
  --azul: #1E40AF; --azul-2: #2563EB; --azul-claro: #DBEAFE; --azul-fundo: #EFF6FF; --azul-borda: #BFDBFE;
  --verde: #15803D; --verde-claro: #DCFCE7; --vermelho: #B91C1C; --vermelho-claro: #FEF2F2; --vermelho-borda: #FECACA;
  --ambar: #92400E; --ambar-claro: #FEF3C7;
  --texto: #0F172A; --texto-2: #334155; --texto-3: #64748B; --borda: #E2E8F0; --borda-2: #CBD5E1;
  --fundo: #F8FAFC; --branco: #FFFFFF; --raio: 10px;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fundo); color: var(--texto); font: 15px/1.45 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
a { color: var(--azul); } a:hover { color: #1D4ED8; }
h1 { font-size: 26px; font-weight: 600; letter-spacing: -0.015em; margin: 0; }
h2 { font-size: 17px; font-weight: 600; margin: 0; }
h3 { font-size: 15px; font-weight: 600; margin: 0; }
p { margin: 0; }
[hidden] { display: none !important; }
.mono { font-family: ui-monospace, Menlo, monospace; }
.suave { color: var(--texto-3); font-size: 13px; }
.oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.faixa-teste { background: #FEF3C7; color: #92400E; text-align: center; font-size: 13px; font-weight: 600; padding: 6px 12px; }
.topo { background: var(--branco); border-bottom: 1px solid var(--borda); }
.topo .in { max-width: 1240px; margin: 0 auto; padding: 12px 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
.marca { font-weight: 700; font-size: 19px; color: var(--azul); text-decoration: none; letter-spacing: -0.01em; }
.marca b { color: var(--azul-2); font-weight: 700; }
.marca span { color: var(--texto-3); font-weight: 400; font-size: 15px; }
.nav { display: flex; flex-wrap: wrap; gap: 4px; flex-grow: 1; }
.nav a { padding: 8px 12px; border-radius: var(--raio); text-decoration: none; color: var(--texto-2); }
.nav a.ativo { background: var(--azul-claro); color: var(--azul); font-weight: 600; }
.quem { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--texto-3); }

.pagina { max-width: 1240px; margin: 0 auto; padding: 24px 20px 56px; display: flex; flex-direction: column; gap: 20px; }
.cabeca { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; }
.linha { display: flex; flex-wrap: wrap; gap: 20px; align-items: flex-start; }
.col-princ { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.col-lado { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }

.card { background: var(--branco); border: 1px solid var(--borda); border-radius: var(--raio); padding: 20px; display: flex; flex-direction: column; gap: 14px; }
.card.sem-pad { padding: 0; gap: 0; overflow: hidden; }
.card.azul { background: var(--azul-fundo); border-color: var(--azul-borda); }
.card.aviso { background: var(--vermelho-claro); border-color: var(--vermelho-borda); color: #991B1B; }
.card.ok { border-color: #BBF7D0; background: #F0FDF4; }

.grade { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px 14px; }
.s1 { grid-column: span 1; } .s2 { grid-column: span 2; } .s3 { grid-column: span 3; } .s4 { grid-column: span 4; } .s6 { grid-column: span 6; }
@media (max-width: 640px) { .grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } .s1 { grid-column: span 1; } .s2, .s3, .s4, .s6 { grid-column: span 2; } }

.campo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
label, .rotulo { font-size: 13px; font-weight: 500; color: var(--texto-2); }
input[type=text], input[type=email], input[type=password], input[type=date], input[type=number], input[type=tel], input:not([type]), select, textarea {
  min-height: 44px; padding: 0 12px; border-radius: var(--raio); border: 1px solid var(--borda-2); font: inherit; color: var(--texto); background: var(--branco); width: 100%; min-width: 0;
}
input[type=file] { font: inherit; font-size: 14px; }
textarea { padding: 10px 12px; min-height: 72px; resize: vertical; }
input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible { outline: 3px solid #93C5FD; outline-offset: 1px; }
.check { display: flex; align-items: center; gap: 10px; font-size: 14px; min-height: 40px; font-weight: 400; color: var(--texto); }
.check input { width: 20px; height: 20px; flex-shrink: 0; }
.opcoes { display: flex; flex-wrap: wrap; gap: 8px; }
.opcao { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border-radius: var(--raio); border: 1px solid var(--borda-2); background: var(--branco); font-size: 14px; color: var(--texto); cursor: pointer; font-weight: 400; }
.opcao:has(input:checked) { border: 2px solid var(--azul-2); background: var(--azul-claro); font-weight: 600; }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
legend { font-size: 13px; font-weight: 500; color: var(--texto-2); margin-bottom: 8px; padding: 0; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: var(--raio); border: 0; background: var(--azul-2); color: #fff; font: inherit; font-weight: 600; text-decoration: none; cursor: pointer; text-align: center; }
.btn:hover { background: #1D4ED8; color: #fff; }
.btn.sec { background: var(--branco); color: var(--texto); border: 1px solid var(--borda-2); font-weight: 500; }
.btn.sec:hover { background: var(--fundo); color: var(--texto); }
.btn.verde { background: var(--verde); } .btn.verde:hover { background: #166534; }
.btn.perigo { background: var(--branco); color: var(--vermelho); border: 1px solid var(--borda-2); }
.btn.grande { min-height: 52px; font-size: 16px; width: 100%; }
.btn.peq { min-height: 36px; padding: 0 10px; font-size: 13px; }
.acoes { display: flex; flex-wrap: wrap; gap: 8px; }

.selo { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.tabela-caixa { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th { text-align: left; font-weight: 600; color: var(--texto-2); background: var(--fundo); padding: 11px 14px; white-space: nowrap; }
td { padding: 11px 14px; border-top: 1px solid var(--borda); vertical-align: top; }
td a.linha-link { text-decoration: none; color: inherit; font-weight: 600; }

.cartoes { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.cartao { background: var(--branco); border: 1px solid var(--borda); border-radius: var(--raio); padding: 12px 16px; }
.cartao .n { font-size: 26px; font-weight: 600; }
.cartao.alerta { background: var(--vermelho-claro); border-color: var(--vermelho-borda); color: #991B1B; }

.filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.filtros .campo { flex: 1 1 160px; }

.flash { background: var(--azul-fundo); border: 1px solid var(--azul-borda); color: var(--azul); padding: 12px 16px; border-radius: var(--raio); font-weight: 500; }
.erro { background: var(--vermelho-claro); border: 1px solid var(--vermelho-borda); color: #991B1B; padding: 12px 16px; border-radius: var(--raio); }

.linha-tempo { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.linha-tempo li { display: flex; gap: 10px; }
.linha-tempo .pt { width: 10px; height: 10px; border-radius: 50%; background: var(--azul-2); margin-top: 6px; flex-shrink: 0; }
.lista-simples { list-style: none; margin: 0; padding: 0; }
.lista-simples li { padding: 12px 16px; border-top: 1px solid var(--borda); display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.lista-simples li:first-child { border-top: 0; }
.lista-simples li.ativo { background: var(--azul-fundo); }
.abas { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid var(--borda); }
.abas a { padding: 12px 14px; text-decoration: none; color: var(--texto-2); border-bottom: 3px solid transparent; margin-bottom: -1px; }
.abas a.ativo { color: var(--azul); font-weight: 600; border-bottom-color: var(--azul-2); }
.copiar { display: flex; gap: 8px; }
.copiar input { font-size: 13px; }

/* Acesso */
.acesso { min-height: 100vh; display: flex; flex-wrap: wrap; }
.acesso .lado { flex: 1 1 380px; background: var(--azul); color: #fff; padding: 48px 40px; display: flex; flex-direction: column; justify-content: space-between; gap: 28px; }
.acesso .lado a { color: #DBEAFE; }
.acesso .lado h1 { font-size: 32px; line-height: 1.15; }
.acesso .form { flex: 1 1 380px; padding: 48px 20px; display: flex; align-items: center; justify-content: center; }
.acesso form { width: 100%; max-width: 380px; display: flex; flex-direction: column; gap: 16px; }

/* Campo (celular) */
.celular { max-width: 480px; margin: 0 auto; min-height: 100vh; background: var(--fundo); display: flex; flex-direction: column; }
.celular .cab { background: var(--azul); color: #fff; padding: 18px 18px 16px; }
.celular .cab.claro { background: var(--branco); color: var(--texto); border-bottom: 1px solid var(--borda); }
.celular .cab small { color: #DBEAFE; font-size: 13px; }
.celular .cab.claro small { color: var(--texto-3); }
.celular .corpo { padding: 14px 16px 24px; display: flex; flex-direction: column; gap: 12px; flex-grow: 1; }
.celular .card { padding: 14px; gap: 10px; border-radius: 12px; }
.celular .pe { padding: 14px 16px 20px; background: var(--branco); border-top: 1px solid var(--borda); display: flex; flex-direction: column; gap: 10px; }
.parada { display: flex; flex-direction: column; gap: 6px; padding: 14px; border-radius: 12px; background: var(--branco); border: 1px solid var(--borda); text-decoration: none; color: var(--texto); }
.parada.feita { background: #F1F5F9; color: var(--texto-3); }
.codigo-grande { font-family: ui-monospace, Menlo, monospace; font-size: 22px; font-weight: 600; letter-spacing: 0.2em; text-align: center; }
.termo { white-space: pre-line; font-size: 13px; color: var(--texto-2); background: var(--branco); border: 1px solid var(--borda); border-radius: var(--raio); padding: 12px; max-height: 220px; overflow: auto; }

/* Comprovante para impressão */
.doc { max-width: 820px; margin: 24px auto; background: #fff; padding: 36px; border: 1px solid var(--borda); display: flex; flex-direction: column; gap: 4px; }
.doc h1 { font-size: 22px; }
.doc .bloco { border-top: 1px solid var(--borda); padding-top: 14px; margin-top: 14px; display: flex; flex-direction: column; gap: 6px; }
@media print { .nao-imprimir { display: none !important; } body { background: #fff; } .doc { border: 0; margin: 0; padding: 0; } }