:root{
  /* ET4F_TOKENS_DISABLED --bg: #0b0f17; */
  /* ET4F_TOKENS_DISABLED --card: #121a27; */
  /* ET4F_TOKENS_DISABLED --text: #e7eefc; */
  /* __DISABLED__ETAPA2__ */ --muted: var(--ds-muted, #a9b4c7);
  /* __DISABLED__ETAPA2__ */ --accent: var(--brand-accent, #ff7a00);

  --danger: var(--ds-danger, #ff3b3b);
  --ok: var(--ds-success, #2ecc71);
  --info: var(--ds-muted, #a9b4c7);

  /* __DISABLED__ETAPA2__ */ --border: var(--ds-border, rgba(0,0,0,.10));
  /* __DISABLED__ETAPA2__ */ --shadow: var(--ds-shadow, 0 10px 30px rgba(0,0,0,.25));

  --radius-lg: 14px;
  --radius-md: 12px;
  --radius-pill: 999px;

  --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

*{ box-sizing:border-box; }
html,body{
  /* margin:0; */
  /* padding:0; */
  /* font-family:var(--font); */

}

a{ color:var(--accent); text-decoration:none; }
a:hover{ text-decoration:underline; }

/* APP_OWNER_CONTAINER_DISABLED01: moved to brand-2026.css (legacy removed) */ /* .__DISABLED__container{ max-width:920px; margin:0 auto; padding:18px; }

.__DISABLED__APP_TOPBAR_OWNER_OFF01 .topbar{
  /* display:flex; */
  /* align-items:center; */
  /* justify-content:space-between; */
  /* gap:10px; */
  /* margin-bottom:10px; */
}
.__DISABLED__APP_TOPBAR_ACTIONS_RULE_OFF01 .topbar.__DISABLED__APP_TOPBAR_ACTIONS_OWNERFIX01 .actions{ display:flex; gap:10px; flex-wrap:wrap; }

/* ✅ NUEVO: acciones genéricas (usadas en pasajero.html / conductor.html) */
.__DISABLED__APP_ACTIONS_OWNER_OFF01 .actions{
  /* display:flex; */
  /* gap:10px; */
  /* flex-wrap:wrap; */
  /* align-items:center; */
}

/* ET4F_CARD_DISABLED (owner=brand+components) .card{
/* ET4F_CARD_DISABLED (owner=brand+components)   background:var(--card);
/* ET4F_CARD_DISABLED (owner=brand+components)   border:1px solid var(--border);
/* ET4F_CARD_DISABLED (owner=brand+components)   border-radius:var(--radius-lg);
/* ET4F_CARD_DISABLED (owner=brand+components)   padding:16px;
/* ET4F_CARD_DISABLED (owner=brand+components)   margin:12px 0;
/* ET4F_CARD_DISABLED (owner=brand+components)   box-shadow:var(--shadow);
/* ET4F_CARD_DISABLED (owner=brand+components) }

.muted{ color:var(--muted); }

.hr{ height:1px; background:var(--border); margin:14px 0; }

.row{ display:flex; gap:10px; flex-wrap:wrap; }
.col{ flex:1; min-width:220px; }

label{ display:block; font-size:12px; color:var(--muted); margin:6px 0; }

input,select,textarea{
  /* width:100%; */
  /* padding:10px 12px; */
  /* border-radius:12px; */
  /* border:1px solid var(--border); */
  /* background: var(--brand-surface); */
  /* color: var(--brand-text); */
  /* border-color: var(--brand-border); */

  /* outline:none; */
}
textarea{ min-height:90px; resize:vertical; }

  /* APP_BUTTON_BASE_DISABLED_OWNER01 — owner=brand-2026 (no styles here) */
.__DISABLED__APP_BUTTON_BASE_OWNER01 button{
  /* cursor:pointer; */
  /* background:var(--accent); */
  /* border:none; */
  /* color:var(--text); */

  /* font-weight:700; */
  /* padding:10px 14px; */
  /* border-radius:12px; */
  }
  /* APP_BUTTON_BASE_DISABLED_OWNER01 END */

/* ✅ Opcional: por si alguna pantalla usa .primary */
/* ET4F_BTN_DISABLED (owner=brand-2026) button.primary{ background:var(--accent); color:var(--text); } */

/* ET4_STEP2C_DISABLED (brand-2026 owns secondary): button.secondary{ background:transparent; border:1px solid var(--border); color:var(--text); } */
/* ET4F_BTN_DISABLED (owner=components/brand) button.danger{ background:var(--danger); color:#fff; } */
  /* APP_BUTTON_OK_DISABLED_OWNER01 — owner=future components.css (state), currently unused */
.__DISABLED__APP_STATES_OWNER01 button.ok{ background:var(--ok); color: var(--ds-primary-contrast, #fff); }
  /* APP_BUTTON_OK_DISABLED_OWNER01 END */

.badge{
  /* display:inline-block; */
  /* padding:4px 10px; */
  /* border-radius:var(--radius-pill); */
  /* background:rgba(255,255,255,.05); */
  /* border:1px solid var(--border); */
  /* color:var(--muted); */
  /* font-size:12px; */
}
.__DISABLED__APP_STATES_OWNER02 .badge--ok{ color:var(--ok); }
.badge--muted{ color:var(--muted); }
.__DISABLED__APP_STATES_OWNER02 .badge--danger{ color:var(--danger); }

.__DISABLED__APP_STATES_OWNER02 .status--ok{ color:var(--ok); }
.status--info{ color:var(--info); }
.__DISABLED__APP_STATES_OWNER02 .status--error{ color:var(--danger); }

.list{ display:flex; flex-direction:column; gap:10px; }

.item{
  /* padding:12px; */
  /* border:1px solid var(--border); */
  /* border-radius:var(--radius-md); */
  /* background: var(--brand-surface); */
}
.item strong{ display:block; }
/* ET4F_ITEMA_DISABLED (owner=compat) .item-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:10px; } */

.code{
  /* font-family:var(--mono); */
  /* font-size:12px; */
  /* white-space:pre-wrap; */
  /* background: var(--brand-surface); */
  /* border:1px solid var(--border); */
  /* border-radius:12px; */
  /* padding:10px; */
  /* color: var(--brand-text); */
}

.note{
  /* border-left:4px solid var(--accent); */
  /* padding:10px 12px; */
  /* background: var(--brand-surface); */
  /* border-radius:12px; */
}

/* Utilidades */
.mt-10{ margin-top:10px; }
.mt-8{ margin-top:8px; }


/* AUD_LEGACY_MAP_STYLES_DISABLED_BEGIN */
/* ========================= */
   /* MAPA (MapLibre) - opcional */
   /* =========================== */
.__DISABLED__APP_MAP_SHELL01 .map{
  /* width:100%; */
  /* height:280px; */
  /* border-radius: var(--radius-lg); */
  /* overflow:hidden; */
  /* border:1px solid var(--border); */
  /* background: var(--brand-surface); */
}

/* Marker custom */
.__DISABLED__APP_MAP_SHELL01 .ma-marker{
  /* width:14px; */
  /* height:14px; */
  /* border-radius:999px; */
  /* border:2px solid rgba(255,255,255,.9); */
  /* box-shadow: 0 6px 18px rgba(0,0,0,.35); */
}
/* AUD_LEGACY_MAP_STYLES_DISABLED_END */
.__DISABLED__APP_MARKERS01 .ma-marker--driver{ background: var(--accent); }
.__DISABLED__APP_MARKERS01 .ma-marker--origin{ background: var(--ok); }
.__DISABLED__APP_MARKERS01 .ma-marker--dest{ background: var(--danger); }

/* ========================= */
   /* PATCH ETAPA 1 - Legibilidad + Móvil */
   /* Basado en auditoría (container max-width + textos 12px) */
   /* ================================ */

/* Tamaño base */
body{ font-size: 16px; }

/* Labels y textos pequeños: subir de 12px a algo usable */
label{ font-size: 14px; }
.small, .muted, .hint, .help{ font-size: 13px; }

/* Contenedor: en PC se queda bien, en móvil ocupa mejor */
/* LEGACY_CONTAINER_REMOVED: .__DISABLED__container{ padding: 18px; }
@media (max-width: 480px){
  /* LEGACY_CONTAINER_REMOVED: .__DISABLED__container{
    /* max-width: none !important; */
    /* width: 100% !important; */
    /* margin: 0 !important; */
    /* padding: 12px !important; */
  }
}

/* Inputs / botones dedo-friendly */
input, select, textarea{ min-height: 44px; }
button, .btn, input[type="submit"]{ min-height: 44px; }

/* ========================= */
   /* PATCH ETAPA 1 (basado en auditoría de .card) */
   /* Objetivo: más grande y cómodo en móvil */
   /* ================================ */

/* labels y microtextos */


/* inputs dedo-friendly */
input, select, textarea{
  /* min-height:44px !important; */
  /* font-size:16px !important; */
}

/* columnas: en móvil evitar min-width 220px que aprieta */
@media (max-width: 480px){
  .col{ min-width: 100% !important; }
}

/* ========================= */
/* AUD_V2C_ROLE_LEGACY_DISABLED_START — bloque legacy desactivado con @media not all */
@media not all {

   /* PATCH ETAPA 2 - Tema por rol */
   /* ================================ */

/* PASAJERO (claro tipo InDrive) */
body.__DISABLED__role-passenger__OFF{
  /* background:var(--bg) !important; */
  /* color:var(--text) !important; */
}
body.__DISABLED__role-passenger__OFF .card{
  /* background:var(--card) !important; */
  /* border-color: var(--border) !important; */
}
body.__DISABLED__role-passenger__OFF input,
body.__DISABLED__role-passenger__OFF select,
body.__DISABLED__role-passenger__OFF textarea{
  /* background:var(--card) !important; */
  /* color:var(--text) !important; */
  /* border-color: var(--border) !important; */
}

/* CONDUCTOR (oscuro tipo app) */
body.__DISABLED__role-driver__OFF{
  /* background:#0b1220 !important; */
  /* color: rgba(255,255,255,.92) !important; */
}
body.__DISABLED__role-driver__OFF .card{
  /* background: rgba(255,255,255,.06) !important; */
  /* border-color: rgba(255,255,255,.10) !important; */
}
body.__DISABLED__role-driver__OFF input,
body.__DISABLED__role-driver__OFF select,
body.__DISABLED__role-driver__OFF textarea{
  /* background:#0e1522 !important; */
  /* color: rgba(255,255,255,.92) !important; */
  /* border-color: rgba(255,255,255,.14) !important; */
}

/* ========================= */
   /* MA AYACUCHO — ETAPA 3.1 (Conductor Topbar) */
   /* Version: V1_2025-12-28_r06 */
   /* ================================ */
body.__DISABLED__role-driver__OFF .topbar{
  /* position: sticky; */
  /* top: 0; */
  /* z-index: 999; */
  /* padding: 10px 12px; */
  /* margin: 0 0 12px 0; */
  /* border-radius: 14px; */
  /* backdrop-filter: blur(8px); */
  -webkit-backdrop-filter: blur(8px);
  /* border: 1px solid rgba(255,255,255,.10); */
  /* background: rgba(18,18,18,.92); */
  /* box-shadow: 0 10px 30px rgba(0,0,0,.35); */
}

body.__DISABLED__role-driver__OFF .topbar .actions{
  /* display: flex; */
  /* flex-wrap: wrap; */
  /* gap: 10px; */
  /* align-items: center; */
  /* justify-content: space-between; */
}

body.__DISABLED__role-driver__OFF .topbar .actions button{
  /* flex: 1 1 30%; */
  /* min-height: 44px; */
  /* padding: 12px 12px; */
  /* border-radius: 12px; */
  /* font-weight: 700; */
  /* letter-spacing: .2px; */
}

/* Badge GPS visible y “pro” */
body.__DISABLED__role-driver__OFF .topbar .badge{
  /* display: inline-flex; */
  /* align-items: center; */
  /* justify-content: center; */
  /* margin-top: 10px; */
  /* padding: 8px 12px; */
  /* border-radius: 999px; */
  /* font-weight: 800; */
  /* font-size: 13px; */
  /* border: 1px solid rgba(255,255,255,.14); */
  /* background: rgba(255,255,255,.06); */
}

body.__DISABLED__role-driver__OFF #gpsBadge.gps-on{
  /* border-color: rgba(var(--ds-success-rgb, 22,163,74), .35); */
  /* background: rgba(var(--ds-success-rgb, 22,163,74), .14); */
}

body.__DISABLED__role-driver__OFF #gpsBadge.gps-off{
  /* border-color: rgba(var(--ds-danger-rgb, 220,38,38), .35); */
  /* background: rgba(var(--ds-danger-rgb, 220,38,38), .14); */
}

/* En pantallas chicas: 2 columnas para acciones */
@media (max-width: 420px){
  /* body.__DISABLED__role-driver__OFF .topbar .actions button{ */
    /* flex: 1 1 48%; */
  }
}

/* ========================= */
   /* MA AYACUCHO — ETAPA 3.4 (Cards Listas) */
   /* Version: V1_2025-12-28_r08 */
   /* ================================ */
body.__DISABLED__role-driver__OFF .item{
  /* padding: 12px 12px; */
  /* border-radius: 14px; */
  /* border: 1px solid rgba(255,255,255,.10); */
  /* background: rgba(255,255,255,.06); */
  /* margin: 10px 0; */
}

body.__DISABLED__role-driver__OFF .item .muted{
  /* display: block; */
  /* font-size: 14px; */
  /* line-height: 1.25; */
  /* opacity: .90; */
}

body.__DISABLED__role-driver__OFF #available-trips .item:only-child,
body.__DISABLED__role-driver__OFF #my-trips .item:only-child{
  /* text-align: center; */
  /* padding: 18px 14px; */
  /* background: rgba(255,255,255,.05); */
}

body.__DISABLED__role-driver__OFF #available-trips .item:only-child .muted,
body.__DISABLED__role-driver__OFF #my-trips .item:only-child .muted{
  /* font-weight: 700; */
  /* opacity: .95; */
}

/* ========================= */
   /* MA AYACUCHO — ETAPA 4.1 (Pasajero CTA) */
   /* Version: V1_2025-12-28_r12 */
   /* ================================ */
body.__DISABLED__role-passenger__OFF #btnCreate.cta{
  /* width: 100%; */
  /* min-height: 52px; */
  /* border-radius: 16px; */
  /* font-weight: 900; */
  /* letter-spacing: .4px; */
  /* text-transform: uppercase; */
  /* font-size: 16px; */
}

/* En móvil: botón fijo abajo tipo app */
@media (max-width: 520px){
  /* body.__DISABLED__role-passenger__OFF #btnCreate.cta{ */
    /* position: sticky; */
    /* bottom: 10px; */
    /* z-index: 900; */
    /* box-shadow: 0 14px 30px rgba(0,0,0,.18); */
  }
}

/* ========================= */
   /* ETAPA 4.2 — Trip Status Card (Passenger) */
   /* ========================= */ */
.trip-status{
  /* margin: 12px 0 6px; */
  /* padding: 14px; */
  /* border-radius: 16px; */
  /* border: 1px solid rgba(255,255,255,.10); */
  /* background: rgba(255,255,255,.06); */
}
.trip-status.hidden{ display:none; }

.trip-status__top{
  /* display:flex; */
  /* align-items:center; */
  /* justify-content:space-between; */
  /* gap:12px; */
}
.trip-status__title{
  /* font-weight:700; */
  /* letter-spacing:.2px; */
}
.trip-status__id{
  /* font-size: 12px; */
  /* opacity:.85; */
  /* margin-top:2px; */
}

.trip-status__body{
  /* margin-top:10px; */
}
.trip-status__state{
  /* font-size: 22px; */
  /* font-weight: 800; */
  /* letter-spacing:.3px; */
  /* margin: 2px 0 6px; */
}
.trip-status__hint{
  /* font-size: 13px; */
  /* line-height: 1.35; */
}

.trip-status__actions{
  /* margin-top: 12px; */
  /* display:flex; */
  /* justify-content:flex-end; */
}

/* ========================= */

/* ===== Pasajero: MapLibre ===== */
body.__DISABLED__role-passenger__OFF #map{
  /* width: 100%; */
  /* height: 52vh; */
  /* border-radius: 14px; */
  /* overflow: hidden; */
  /* background: var(--card); */
  /* margin-top: 10px; */
}

/* Marker pasajero */
.__DISABLED__APP_MARKERS01 .ma-marker--passenger{ background: var(--ds-info, #2d8cff); }

/* === UI: Align map height between passenger & driver === */
body.__DISABLED__role-driver__OFF #map{
  /* height: 52vh; */
}

}
/* AUD_V2C_ROLE_LEGACY_DISABLED_END */

/* === MA BRANDING (CITY PACK) === */
.brand-row{
  /* display:flex; */
  /* align-items:center; */
  /* gap:.5rem; */
  /* margin:.25rem 0; */
}
.brand-platform{
  /* font-weight:800; */
  /* letter-spacing:.08em; */
}
.brand-city{
  /* font-weight:700; */
}
.brand-support{
  /* margin-left:auto; */
  /* font-weight:600; */
  /* text-decoration:none; */
}

/* util */
.hidden{display:none !important;}

/* ---------------------------------------------------------
   /* APP_BRANDMAP01 — Dark: map brand-surface/text a tokens */
   /* Motivo: evitar fallback #fff/#111 en modo oscuro */
--------------------------------------------------------- */
html[data-mode="dark"]{
  --brand-surface: var(--card);
  --brand-text: var(--text);
}