:root {
    --red:#C62828;
    --red-dark:#8E1515;
    --magenta:#AD1457;
    --yellow:#FFC928;
    --ink:#251B1B;
    --muted:#7D7070;
    --border:#E9DEDA;
    --ivory:#FFF9F5;
    --green:#16844B;
    --blue:#1565C0;
    --orange:#E8710A;
    --shadow-sm:0 7px 22px rgba(76,36,32,.08);
    --shadow-md:0 18px 48px rgba(76,36,32,.16);
    /* Altura visible del encabezado y separación del cintillo del sistema. */
    --topbar-content-height:64px;
    --system-top-inset:max(20px, env(safe-area-inset-top, 0px));
    --topbar:calc(var(--topbar-content-height) + var(--system-top-inset));
    --bottom-nav:76px;
}

* { box-sizing:border-box; }
html { min-height:100%; background:#F7F3F1; }
body { margin:0; color:var(--ink); background:#F7F3F1; font-family:'Inter',system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
button,input,select { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
a { color:inherit; }
[hidden] { display:none !important; }
.eyebrow { margin:0 0 5px; color:var(--red); font-size:10px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.primary-button,.secondary-button { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:50px; padding:0 18px; border:0; border-radius:14px; font-size:12px; font-weight:850; cursor:pointer; }
.primary-button { color:#fff; background:linear-gradient(135deg,var(--red),var(--magenta)); box-shadow:0 9px 22px rgba(198,40,40,.2); }
.secondary-button { border:2px solid var(--border); color:var(--red); background:#fff; }
.primary-button:disabled,.secondary-button:disabled { opacity:.55; cursor:wait; }
.secondary-button.wide { width:100%; }
.text-button { border:0; color:var(--muted); background:transparent; font-size:12px; font-weight:800; cursor:pointer; }
.alert-error { display:flex; gap:9px; align-items:flex-start; margin-bottom:18px; padding:13px 14px; border-radius:13px; color:#A21919; background:#FFEBEE; font-size:12px; font-weight:700; line-height:1.45; }

/* Acceso */
.driver-login-body { min-height:100vh; padding:18px; background:radial-gradient(circle at 15% 0,rgba(255,201,40,.3),transparent 32%),linear-gradient(150deg,#871111,#C62828 48%,#AD1457); }
.driver-login-shell { width:min(100%,930px); min-height:calc(100vh - 36px); margin:auto; overflow:hidden; border-radius:25px; background:#fff; box-shadow:0 28px 70px rgba(46,0,0,.3); }
.driver-login-brand { position:relative; min-height:305px; padding:42px 30px; overflow:hidden; color:#fff; background:linear-gradient(145deg,rgba(123,13,13,.96),rgba(198,40,40,.94)),url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"%3E%3Cpath fill="none" stroke="%23ffffff" stroke-opacity=".08" d="M0 50h100M50 0v100"/%3E%3C/svg%3E'); }
.driver-login-brand::after { content:''; position:absolute; right:-75px; bottom:-90px; width:250px; height:250px; border:45px solid rgba(255,201,40,.18); border-radius:50%; }
.driver-logo { position:relative; z-index:1; display:grid; width:62px; height:62px; margin-bottom:24px; place-items:center; border-radius:18px; color:var(--red-dark); background:var(--yellow); font-size:27px; box-shadow:0 14px 30px rgba(0,0,0,.16); }
.driver-login-brand .eyebrow { position:relative; z-index:1; color:#FFD75C; }
.driver-login-brand h1 { position:relative; z-index:1; max-width:520px; margin:8px 0 13px; font-size:34px; line-height:1.05; letter-spacing:-.05em; }
.driver-login-brand h1 span { color:var(--yellow); }
.driver-login-brand > p:not(.eyebrow) { position:relative; z-index:1; max-width:500px; margin:0; color:rgba(255,255,255,.78); font-size:13px; line-height:1.65; }
.login-live-pill { position:relative; z-index:1; display:inline-flex; align-items:center; gap:8px; margin-top:22px; padding:9px 12px; border:1px solid rgba(255,255,255,.2); border-radius:30px; color:#fff; background:rgba(255,255,255,.1); font-size:10px; font-weight:800; }
.driver-login-card { padding:34px 28px 42px; }
.login-card-heading h2 { margin:5px 0 8px; font-size:28px; letter-spacing:-.04em; }
.login-card-heading > p:last-child { margin:0 0 24px; color:var(--muted); font-size:12px; }
.driver-login-form { display:grid; gap:9px; }
.driver-login-form label { margin-top:7px; font-size:11px; font-weight:800; }
.input-icon { position:relative; }
.input-icon > i { position:absolute; top:50%; left:15px; color:#B5A7A2; transform:translateY(-50%); }
.input-icon input { width:100%; height:54px; padding:0 48px 0 43px; border:2px solid var(--border); border-radius:14px; color:var(--ink); background:#fff; outline:none; }
.input-icon input:focus { border-color:var(--red); box-shadow:0 0 0 4px rgba(198,40,40,.08); }
.password-toggle { position:absolute; top:50%; right:8px; width:38px; height:38px; border:0; border-radius:10px; color:var(--muted); background:transparent; transform:translateY(-50%); cursor:pointer; }
.login-button { width:100%; min-height:56px; margin-top:15px; font-size:14px; }
.login-help { display:flex; align-items:center; justify-content:center; gap:8px; margin:22px 0 0; color:var(--muted); font-size:10px; line-height:1.5; text-align:center; }

/* Estructura principal */
.driver-body { min-height:100vh; padding-top:var(--topbar); padding-bottom:calc(var(--bottom-nav) + env(safe-area-inset-bottom)); }
.driver-topbar { position:fixed; z-index:900; top:0; right:0; left:0; display:flex; height:var(--topbar); padding:var(--system-top-inset) 16px 0; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(233,222,218,.8); background:rgba(255,255,255,.94); box-shadow:0 4px 18px rgba(65,25,20,.06); backdrop-filter:blur(14px); }
.topbar-brand { display:flex; align-items:center; color:var(--ink); font-size:15px; font-weight:800; text-decoration:none; }
.topbar-brand > span { display:grid; width:35px; height:35px; margin-right:8px; place-items:center; border-radius:11px; color:var(--red-dark); background:var(--yellow); }
.topbar-brand strong { color:var(--red); }
.topbar-actions { display:flex; align-items:center; gap:7px; }
.gps-indicator,.socket-indicator { display:inline-flex; min-height:30px; padding:0 9px; align-items:center; gap:6px; border-radius:18px; color:var(--muted); background:#F2ECE9; font-size:9px; font-weight:850; }
.gps-indicator i { color:#A89B96; }
.gps-indicator.online { color:var(--green); background:#E8F5E9; }
.gps-indicator.online i { color:var(--green); }
.gps-indicator.error { color:var(--red); background:#FFEBEE; }
.socket-indicator i { color:#B0A4A0; font-size:7px; }
.socket-indicator.online { color:var(--green); background:#E8F5E9; }
.socket-indicator.online i { color:var(--green); }
.socket-indicator.connecting i { color:var(--orange); }
.driver-main { width:min(100%,920px); min-height:calc(100vh - var(--topbar) - var(--bottom-nav)); margin:0 auto; padding:20px 15px 34px; }
.bottom-navigation { position:fixed; z-index:920; right:0; bottom:0; left:0; display:grid; height:calc(var(--bottom-nav) + env(safe-area-inset-bottom)); padding:7px max(10px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(10px,env(safe-area-inset-left)); grid-template-columns:repeat(4,1fr); border-top:1px solid var(--border); background:rgba(255,255,255,.97); box-shadow:0 -8px 28px rgba(76,36,32,.1); backdrop-filter:blur(14px); }
.bottom-navigation a { position:relative; display:flex; min-width:0; align-items:center; justify-content:center; flex-direction:column; gap:4px; border-radius:13px; color:#9A8C87; font-size:9px; font-weight:800; text-decoration:none; }
.bottom-navigation a i { font-size:19px; }
.bottom-navigation a.active { color:var(--red); background:#FFF0F0; }
.bottom-navigation a b { position:absolute; top:3px; left:calc(50% + 7px); width:8px; height:8px; border:2px solid #fff; border-radius:50%; background:var(--yellow); box-sizing:content-box; }
.live-toast { position:fixed; z-index:1200; top:calc(var(--topbar) + 10px); right:14px; left:14px; max-width:430px; margin:auto; padding:14px 16px; border-radius:14px; color:#fff; background:#292020; box-shadow:var(--shadow-md); font-size:11px; font-weight:750; opacity:0; pointer-events:none; transform:translateY(-15px); transition:.25s; }
.live-toast.show { opacity:1; transform:none; }

/* Dashboard */
.driver-welcome { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.driver-welcome h1,.page-heading h1 { margin:3px 0 6px; font-size:27px; line-height:1.05; letter-spacing:-.045em; }
.driver-welcome > div > p:last-child,.page-heading > p:last-child { margin:0; color:var(--muted); font-size:11px; line-height:1.5; }
.driver-avatar { display:grid; flex:0 0 auto; width:54px; height:54px; place-items:center; border-radius:17px; color:#fff; background:linear-gradient(135deg,var(--red),var(--magenta)); font-size:22px; box-shadow:0 10px 25px rgba(198,40,40,.23); }
.availability-card { display:flex; min-height:82px; margin-bottom:15px; padding:15px 17px; align-items:center; justify-content:space-between; gap:14px; border:1px solid var(--border); border-radius:19px; background:#fff; box-shadow:var(--shadow-sm); }
.availability-copy { display:flex; align-items:center; gap:12px; }
.availability-dot { width:12px; height:12px; border:3px solid #E0D8D4; border-radius:50%; background:#A99E99; box-sizing:content-box; }
.availability-copy small { display:block; color:var(--muted); font-size:9px; font-weight:800; text-transform:uppercase; }
.availability-copy strong { display:block; margin-top:3px; font-size:15px; }
.availability-toggle { position:relative; flex:0 0 auto; width:56px; height:32px; padding:0; border:0; border-radius:20px; background:#D7CFCC; cursor:pointer; transition:.2s; }
.availability-toggle span { position:absolute; top:4px; left:4px; width:24px; height:24px; border-radius:50%; background:#fff; box-shadow:0 3px 8px rgba(0,0,0,.2); transition:.2s; }
.availability-card.status-1 { border-color:#BEE4CB; background:#F4FFF7; }
.availability-card.status-1 .availability-dot { border-color:#C7EAD2; background:var(--green); }
.availability-card.status-1 .availability-toggle { background:var(--green); }
.availability-card.status-1 .availability-toggle span { left:28px; }
.availability-card.status-2 { border-color:#F4D299; background:#FFFAF0; }
.availability-card.status-2 .availability-dot { border-color:#FFE2B5; background:var(--orange); }
.availability-card.status-2 .availability-toggle { background:var(--orange); }
.availability-card.status-2 .availability-toggle span { left:28px; }
.availability-toggle:disabled { opacity:.65; cursor:not-allowed; }
.driver-stats-grid { display:grid; margin-bottom:24px; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.driver-stats-grid article { min-width:0; padding:14px 12px; border:1px solid var(--border); border-radius:16px; background:#fff; box-shadow:var(--shadow-sm); }
.driver-stats-grid article > span { display:flex; align-items:center; gap:5px; overflow:hidden; color:var(--muted); font-size:8px; font-weight:800; text-transform:uppercase; white-space:nowrap; }
.driver-stats-grid article > span i { color:var(--red); }
.driver-stats-grid article > strong { display:flex; align-items:baseline; gap:3px; margin:8px 0 2px; font-size:22px; letter-spacing:-.04em; }
.driver-stats-grid article > strong small { color:var(--red); font-size:11px; }
.driver-stats-grid article > small { color:#A39793; font-size:8px; }
.section-heading { display:flex; margin:0 2px 12px; align-items:flex-end; justify-content:space-between; gap:12px; }
.section-heading h2 { margin:2px 0 0; font-size:20px; letter-spacing:-.035em; }
.section-heading > a { display:flex; align-items:center; gap:5px; color:var(--red); font-size:10px; font-weight:850; text-decoration:none; }
.page-heading { margin-bottom:19px; }
.page-heading h1 { font-size:30px; }
.loading-card { display:flex; min-height:190px; padding:25px; align-items:center; justify-content:center; flex-direction:column; gap:12px; border:1px dashed #D8CBC6; border-radius:20px; color:var(--muted); background:#fff; font-size:11px; font-weight:750; }
.loading-card i { color:var(--red); font-size:24px; }

/* Orden activa */
.service-card { overflow:hidden; border:1px solid var(--border); border-radius:21px; background:#fff; box-shadow:var(--shadow-sm); }
.service-card-head { display:flex; padding:17px; align-items:flex-start; justify-content:space-between; gap:13px; border-bottom:1px solid #F1E9E5; background:linear-gradient(130deg,#FFF8F6,#FFFDF6); }
.service-card-head small { display:block; color:var(--muted); font-size:9px; font-weight:800; text-transform:uppercase; }
.service-card-head strong { display:block; margin-top:4px; font-size:18px; letter-spacing:-.03em; }
.order-status { display:inline-flex; min-height:28px; padding:0 10px; align-items:center; border-radius:17px; color:#925000; background:#FFF0D6; font-size:9px; font-weight:900; white-space:nowrap; }
.order-status.delivering { color:#0C5B92; background:#E3F2FD; }
.order-status.delivered { color:#176238; background:#E8F5E9; }
.order-status.cancelled { color:#9E1B1B; background:#FFEBEE; }
.service-body { padding:18px; }
.service-store { display:flex; align-items:center; gap:12px; }
.service-store > i { display:grid; flex:0 0 auto; width:42px; height:42px; place-items:center; border-radius:13px; color:var(--red); background:#FFF0F0; }
.service-store small,.service-detail-item small { display:block; color:var(--muted); font-size:9px; font-weight:750; }
.service-store strong { display:block; margin-top:3px; font-size:14px; }
.service-details-grid { display:grid; margin:17px 0; grid-template-columns:1fr 1fr; gap:9px; }
.service-detail-item { padding:12px; border-radius:13px; background:var(--ivory); }
.service-detail-item strong { display:block; margin-top:5px; font-size:12px; overflow-wrap:anywhere; }
.service-detail-item.fee strong { color:var(--red); font-size:20px; }
.route-buttons { display:grid; margin:15px 0; grid-template-columns:1fr 1fr; gap:9px; }
.route-button { display:flex; min-height:53px; padding:8px 10px; align-items:center; justify-content:center; gap:8px; border:2px solid var(--border); border-radius:14px; color:var(--ink); background:#fff; font-size:10px; font-weight:850; text-align:center; text-decoration:none; }
.route-button i { color:var(--red); font-size:16px; }
.route-button.store-navigation { color:#fff; border-color:#1565C0; background:linear-gradient(135deg,#1565C0,#0D47A1); }
.route-button.store-navigation i { color:#FFD54F; }
.route-button.release-order { border:0; color:#fff; background:linear-gradient(135deg,#5D4037,#7B1FA2); cursor:pointer; }
.route-button.release-order i { color:#fff; }
.route-button.disabled { opacity:.65; }
.route-button.customer { color:#fff; border-color:var(--red); background:linear-gradient(135deg,var(--red),var(--magenta)); }
.route-button.customer i { color:var(--yellow); }
.service-main-action { width:100%; min-height:62px; margin-top:4px; font-size:14px; }
.service-main-action.start { background:linear-gradient(135deg,var(--red),var(--magenta)); }
.service-main-action.deliver { background:linear-gradient(135deg,#0B7A43,#14975A); }
.customer-destination { margin:16px 0 11px; padding:15px; border:1px solid #CDE0F2; border-radius:15px; background:#F3F9FF; }
.customer-destination span { display:flex; align-items:center; gap:7px; color:var(--blue); font-size:9px; font-weight:850; text-transform:uppercase; }
.customer-destination strong { display:block; margin-top:7px; color:var(--ink); font-size:12px; line-height:1.45; overflow-wrap:anywhere; }
.service-navigation-button { display:flex; width:100%; min-height:64px; align-items:center; justify-content:center; gap:10px; border-radius:16px; color:#fff; background:linear-gradient(135deg,#1565C0,#0D47A1); box-shadow:0 10px 24px rgba(21,101,192,.22); font-size:14px; font-weight:900; text-decoration:none; }
.service-navigation-button i { color:#FFD54F; font-size:20px; }
.service-final-actions { display:grid; margin-top:11px; grid-template-columns:1fr 1fr; gap:9px; }
.service-cancel-button,.service-complete-button { display:flex; min-height:58px; padding:8px; align-items:center; justify-content:center; gap:7px; border:0; border-radius:14px; color:#fff; font-size:9px; font-weight:900; }
.service-cancel-button { background:linear-gradient(135deg,#B71C1C,#D32F2F); }
.service-complete-button { background:linear-gradient(135deg,#08783F,#14975A); }
.service-cancel-button i,.service-complete-button i { font-size:15px; }
.danger-action { background:linear-gradient(135deg,#B71C1C,#D32F2F)!important; }
.success-action { background:linear-gradient(135deg,#08783F,#14975A)!important; }
.service-help { margin:10px 0 0; color:var(--muted); font-size:9px; line-height:1.5; text-align:center; }
.arrival-notice { display:flex; margin-top:6px; padding:14px; align-items:center; gap:12px; border:1px solid #B9DDF5; border-radius:15px; color:#0C5B92; background:#EEF8FF; }
.arrival-notice > i { display:grid; flex:0 0 auto; width:39px; height:39px; place-items:center; border-radius:12px; color:#fff; background:var(--blue); }
.arrival-notice strong,.arrival-notice small { display:block; }
.arrival-notice strong { font-size:11px; }
.arrival-notice small { margin-top:4px; color:#47728D; font-size:9px; line-height:1.45; }
.dispatch-offers { display:grid; gap:12px; }
.offers-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
.offers-heading h2 { margin:3px 0 0; font-size:20px; letter-spacing:-.035em; }
.offers-heading > span { display:inline-flex; padding:7px 10px; align-items:center; gap:6px; border-radius:18px; color:#176238; background:#E8F5E9; font-size:8px; font-weight:850; }
.offer-carousel { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; width:100%; padding:2px; overflow:visible; }
.offer-card { min-width:0; padding:17px; border:1px solid var(--border); border-radius:20px; background:#fff; box-shadow:var(--shadow-sm); }
.offer-card-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.offer-card-top > span { display:inline-flex; padding:6px 9px; border-radius:16px; color:#925000; background:#FFF0D6; font-size:8px; font-weight:850; }
.offer-card-top > strong { color:var(--red); font-size:22px; letter-spacing:-.04em; }
.offer-card > small { display:block; margin-top:15px; color:var(--muted); font-size:8px; font-weight:800; text-transform:uppercase; }
.offer-card h3 { margin:4px 0 9px; font-size:17px; letter-spacing:-.03em; }
.offer-card > p { display:flex; min-height:31px; margin:0; align-items:flex-start; gap:7px; color:var(--muted); font-size:9px; line-height:1.45; }
.offer-card > p i { margin-top:2px; color:var(--red); }
.offer-map-link { display:inline-flex; margin:12px 0; align-items:center; gap:7px; color:var(--blue); font-size:9px; font-weight:850; text-decoration:none; }
.accept-offer-button { width:100%; min-height:55px; }
.offers-help { margin:0; color:var(--muted); font-size:9px; line-height:1.5; text-align:center; }
.waiting-card { min-height:300px; padding:32px 24px; border:1px solid var(--border); border-radius:21px; background:#fff; box-shadow:var(--shadow-sm); text-align:center; }
.waiting-radar { position:relative; display:grid; width:104px; height:104px; margin:8px auto 25px; place-items:center; border-radius:50%; color:#fff; background:linear-gradient(135deg,var(--red),var(--magenta)); font-size:36px; }
.waiting-radar::before,.waiting-radar::after { content:''; position:absolute; inset:-13px; border:2px solid rgba(198,40,40,.18); border-radius:50%; animation:radar 2s infinite; }
.waiting-radar::after { inset:-28px; animation-delay:.55s; }
@keyframes radar { 0%{transform:scale(.82);opacity:.9} 100%{transform:scale(1.18);opacity:0} }
.waiting-card h2 { margin:0 0 8px; font-size:22px; letter-spacing:-.035em; }
.waiting-card p { max-width:410px; margin:0 auto; color:var(--muted); font-size:11px; line-height:1.6; }
.waiting-note { display:inline-flex; margin-top:22px; padding:9px 12px; align-items:center; gap:7px; border-radius:20px; color:var(--green); background:#E8F5E9; font-size:9px; font-weight:850; }
.waiting-note.offline { color:var(--red); background:#FFEBEE; }
.service-detail-container .service-card { box-shadow:var(--shadow-md); }

/* Historial */
.history-filters { display:grid; margin-bottom:16px; grid-template-columns:1fr; gap:9px; }
.history-filters > div { position:relative; }
.history-filters > div i { position:absolute; top:50%; left:14px; color:#A89D99; transform:translateY(-50%); }
.history-filters input,.history-filters select { width:100%; height:48px; padding:0 13px; border:2px solid var(--border); border-radius:13px; color:var(--ink); background:#fff; outline:none; }
.history-filters > div input { padding-left:40px; }
.history-list { display:grid; gap:11px; }
.history-card { padding:16px; border:1px solid var(--border); border-radius:18px; background:#fff; box-shadow:var(--shadow-sm); }
.history-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.history-card-top small,.history-meta small { display:block; color:var(--muted); font-size:8px; font-weight:800; text-transform:uppercase; }
.history-card-top strong { display:block; margin-top:4px; font-size:15px; }
.history-route { display:flex; margin:15px 0; padding:12px; align-items:center; gap:10px; border-radius:13px; background:var(--ivory); }
.history-route > i { color:var(--red); }
.history-route small { display:block; color:var(--muted); font-size:9px; }
.history-route strong { display:block; margin-top:3px; font-size:12px; }
.history-meta { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.history-meta span:last-child { text-align:right; }
.history-meta strong { display:block; margin-top:4px; font-size:11px; }
.empty-state { padding:50px 25px; border:1px dashed var(--border); border-radius:20px; background:#fff; text-align:center; }
.empty-state i { color:#D4C8C3; font-size:42px; }
.empty-state h2 { margin:15px 0 6px; font-size:19px; }
.empty-state p { margin:0; color:var(--muted); font-size:11px; }
.pagination { display:flex; margin-top:18px; align-items:center; justify-content:center; gap:14px; }
.pagination a { display:grid; width:42px; height:42px; place-items:center; border:1px solid var(--border); border-radius:12px; color:var(--red); background:#fff; text-decoration:none; }
.pagination a.disabled { opacity:.35; pointer-events:none; }
.pagination span { color:var(--muted); font-size:10px; }

/* Perfil */
.profile-hero { padding:24px 20px; border-radius:22px; color:#fff; background:linear-gradient(140deg,var(--red-dark),var(--red),var(--magenta)); box-shadow:var(--shadow-md); text-align:center; }
.profile-avatar { display:grid; width:74px; height:74px; margin:0 auto 14px; place-items:center; border:3px solid rgba(255,255,255,.45); border-radius:23px; color:var(--red-dark); background:var(--yellow); font-size:30px; }
.profile-hero .eyebrow { color:#FFE07D; }
.profile-hero h1 { margin:5px 0 13px; font-size:23px; letter-spacing:-.035em; }
.plate-pill { display:inline-flex; min-height:32px; padding:0 12px; align-items:center; gap:8px; border:1px solid rgba(255,255,255,.22); border-radius:18px; background:rgba(255,255,255,.12); font-size:10px; font-weight:850; }
.profile-panel { margin-top:14px; padding:18px; border:1px solid var(--border); border-radius:19px; background:#fff; box-shadow:var(--shadow-sm); }
.profile-panel > h2,.panel-heading h2 { margin:0 0 14px; font-size:16px; letter-spacing:-.025em; }
.profile-row { display:flex; padding:12px 0; align-items:center; gap:12px; border-bottom:1px solid #F1EAE7; }
.profile-row:last-child { border-bottom:0; }
.profile-row > i { display:grid; flex:0 0 auto; width:38px; height:38px; place-items:center; border-radius:12px; color:var(--red); background:#FFF0F0; }
.profile-row small { display:block; color:var(--muted); font-size:9px; }
.profile-row strong { display:block; margin-top:3px; font-size:12px; }
.panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.panel-heading h2 { margin-bottom:10px; }
.icon-button { display:grid; width:38px; height:38px; place-items:center; border:0; border-radius:12px; color:var(--red); background:#FFF0F0; cursor:pointer; }
.permission-status-row { display:flex; padding:12px 0; align-items:center; gap:11px; border-bottom:1px solid #F1EAE7; }
.permission-status-row > i { width:22px; color:var(--red); text-align:center; }
.permission-status-row > div { flex:1; }
.permission-status-row strong { display:block; font-size:11px; }
.permission-status-row small { display:block; margin-top:3px; color:var(--muted); font-size:9px; }
.permission-status-row > span { width:10px; height:10px; border-radius:50%; background:#B9AEAA; }
.permission-status-row > span.allowed { background:var(--green); }
.permission-status-row > span.denied { background:var(--red); }
.permission-settings .secondary-button { margin-top:14px; }
.logout-button { display:flex; min-height:54px; margin-top:14px; align-items:center; justify-content:center; gap:9px; border:1px solid #FFD1D1; border-radius:15px; color:var(--red); background:#FFF0F0; font-size:12px; font-weight:850; text-decoration:none; }

/* Permisos */
.permission-modal { position:fixed; z-index:1400; inset:0; display:grid; padding:18px; place-items:end center; }
.permission-backdrop { position:absolute; inset:0; background:rgba(34,20,18,.66); backdrop-filter:blur(5px); }
.permission-dialog { position:relative; width:min(100%,470px); max-height:calc(100vh - 36px); padding:27px 23px 22px; overflow-y:auto; border-radius:25px; background:#fff; box-shadow:0 30px 80px rgba(0,0,0,.3); text-align:center; }
.permission-icon { display:grid; width:62px; height:62px; margin:0 auto 16px; place-items:center; border-radius:20px; color:var(--red-dark); background:var(--yellow); font-size:24px; }
.permission-dialog h2 { margin:5px 0 10px; font-size:23px; line-height:1.1; letter-spacing:-.04em; }
.permission-dialog > p:not(.eyebrow) { margin:0; color:var(--muted); font-size:11px; line-height:1.6; }
.permission-list { display:grid; margin:19px 0; gap:8px; text-align:left; }
.permission-list > div { display:flex; padding:12px; align-items:center; gap:11px; border-radius:14px; background:var(--ivory); }
.permission-list > div > i { display:grid; flex:0 0 auto; width:36px; height:36px; place-items:center; border-radius:11px; color:var(--red); background:#fff; }
.permission-list span { display:block; }
.permission-list strong { display:block; font-size:10px; }
.permission-list small { display:block; margin-top:3px; color:var(--muted); font-size:8px; line-height:1.4; }
.permission-activate { width:100%; min-height:56px; }
.permission-dialog .text-button { margin-top:8px; min-height:38px; }
.permission-message { min-height:16px; margin-top:6px; color:var(--red); font-size:9px; font-weight:750; }

@media (min-width:650px) {
    .driver-login-body { display:grid; place-items:center; }
    .driver-login-shell { display:grid; min-height:620px; grid-template-columns:1.08fr .92fr; }
    .driver-login-brand { min-height:100%; padding:70px 55px; }
    .driver-login-brand h1 { font-size:47px; }
    .driver-login-card { display:flex; padding:65px 48px; justify-content:center; flex-direction:column; }
    .driver-main { padding:30px 24px 48px; }
    .driver-welcome h1,.page-heading h1 { font-size:35px; }
    .driver-stats-grid { gap:14px; }
    .driver-stats-grid article { padding:18px; }
    .driver-stats-grid article > strong { font-size:29px; }
    .history-filters { grid-template-columns:minmax(180px,1fr) 170px 155px auto; }
    .history-list { grid-template-columns:1fr 1fr; }
    .offer-carousel { grid-template-columns:minmax(0,1fr); }
    .permission-modal { place-items:center; }
    .bottom-navigation { right:50%; left:50%; width:min(100%,660px); transform:translateX(-50%); border:1px solid var(--border); border-bottom:0; border-radius:22px 22px 0 0; }
}

@media (max-width:380px) {
    .driver-main { padding-right:11px; padding-left:11px; }
    .driver-stats-grid article { padding:12px 9px; }
    .driver-stats-grid article > strong { font-size:19px; }
    .gps-indicator span,.socket-indicator span { display:none; }
    .route-buttons:not(.assigned-route-actions) { grid-template-columns:1fr; }
}


/* OKDelivery Driver v34: ajustes exclusivos del dashboard. */
.driver-stats-grid article {
    display: flex;
    min-height: 118px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

.driver-stats-grid article > span,
.driver-stats-grid article > strong,
.driver-stats-grid article > small {
    width: 100%;
    justify-content: center;
    text-align: center;
}

.driver-stats-grid article > strong {
    font-size: 25px;
}

.driver-stats-grid .stat-total-today > strong {
    font-size: 25px;
}

@media (min-width:650px) {
    .driver-stats-grid article > strong,
    .driver-stats-grid .stat-total-today > strong {
        font-size: 32px;
    }
}

@media (max-width:380px) {
    .driver-stats-grid article > strong,
    .driver-stats-grid .stat-total-today > strong {
        font-size: 22px;
    }
}