/* Altokeapp Ciudades — Selector v2 (v1.8.3). Todo dentro de .akc / .akc-welcome */
.akc, .akc *, .akc-welcome, .akc-welcome * { box-sizing: border-box; margin: 0; padding: 0; }
.akc { --akc-bg: #F6F8FC; --akc-txt: #10284A; --akc-gris: #6b7c95; --akc-linea: #e3e9f3;
  position: fixed; inset: 0; z-index: 100000; display: flex; justify-content: center; background: var(--akc-bg);
  font-family: 'Plus Jakarta Sans', 'Nunito', -apple-system, 'Segoe UI', sans-serif; color: var(--akc-txt); -webkit-font-smoothing: antialiased; }
.akc button { font-family: inherit; }
html.akc-lock, html.akc-lock body { overflow: hidden !important; }
.akc-app { position: relative; width: 100%; max-width: 480px; height: 100%; display: flex; flex-direction: column; overflow: hidden; }
.akc-pant { flex: 1; display: flex; flex-direction: column; min-height: 0; }

/* Parte azul con mapa */
.akc-cielo { position: relative; flex: 1; min-height: 240px; display: flex; flex-direction: column; align-items: center; padding: calc(24px + env(safe-area-inset-top, 0px)) 20px 70px; overflow: hidden; color: #fff;
  background: linear-gradient(170deg, var(--akc-dark) 0%, var(--akc-mid) 75%); }
.akc-mapa { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .15; }
.akc-marca { position: relative; display: flex; align-items: center; gap: 9px; font-size: 21px; font-weight: 800; letter-spacing: -.02em; }
.akc-marca b { color: var(--akc-acc); filter: brightness(1.15); }
.akc-marca i { width: 34px; height: 34px; border-radius: 10px; background: var(--akc-acc); display: flex; align-items: center; justify-content: center; font-style: normal; font-size: 18px; box-shadow: 0 4px 12px rgba(0,0,0,.25); }
.akc-radar { position: relative; margin: auto 0 0; width: 150px; height: 150px; display: flex; align-items: center; justify-content: center; }
.akc-onda { position: absolute; inset: 0; border-radius: 50%; border: 2px solid rgba(255,255,255,.55); animation: akc-onda 2.4s ease-out infinite; }
.akc-onda:nth-child(2) { animation-delay: .8s; } .akc-onda:nth-child(3) { animation-delay: 1.6s; }
@keyframes akc-onda { from { transform: scale(.25); opacity: 1; } to { transform: scale(1); opacity: 0; } }
.akc-pin { position: relative; width: 58px; height: 58px; border-radius: 50% 50% 50% 4px; transform: rotate(-45deg); background: var(--akc-acc); box-shadow: 0 10px 24px rgba(0,0,0,.3); display: flex; align-items: center; justify-content: center; }
.akc-pin::after { content: ""; width: 20px; height: 20px; border-radius: 50%; background: #fff; }
.akc-radar.quieto .akc-pin { animation: akc-caer .5s cubic-bezier(.3,1.6,.6,1); }
@keyframes akc-caer { from { transform: rotate(-45deg) translate(-30px,-30px); opacity: 0; } to { transform: rotate(-45deg); opacity: 1; } }

/* Tarjeta blanca */
.akc-hoja { position: relative; margin-top: -44px; background: #fff; border-radius: 28px 28px 0 0; padding: 26px 22px calc(22px + env(safe-area-inset-bottom, 0px)); box-shadow: 0 -10px 30px rgba(5,43,89,.12); animation: akc-subir .45s ease; }
@keyframes akc-subir { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
.akc-chico { font-size: 13px; font-weight: 800; color: var(--akc-acc); text-transform: uppercase; letter-spacing: .06em; }
.akc-hoja h2 { font-size: 27px; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; margin: 6px 0 4px; color: var(--akc-dark); }
.akc-sub { font-size: 14.5px; color: var(--akc-gris); line-height: 1.45; }
.akc-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 20px; }
.akc-chip { display: flex; align-items: center; gap: 6px; padding: 7px 11px; border-radius: 12px; background: var(--akc-bg); font-size: 12.5px; font-weight: 700; }
.akc-chip svg { width: 16px; height: 16px; color: var(--akc-mid); }
.akc-btn { width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 54px; padding: 0 16px; border-radius: 16px; border: 0; font-size: 16px; font-weight: 800; cursor: pointer; text-decoration: none; -webkit-tap-highlight-color: transparent; transition: transform .1s, opacity .2s; }
.akc-btn:active { transform: scale(.98); }
.akc-btn.pri { background: var(--akc-acc); color: #fff; box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.akc-btn.pri[disabled] { opacity: .45; box-shadow: none; cursor: default; }
.akc-btn.sec { background: none; color: var(--akc-mid); min-height: 48px; margin-top: 6px; font-size: 15px; }
.akc-btn svg { width: 20px; height: 20px; flex: none; }
.akc-btn:focus-visible, .akc-ciudad:focus-visible, .akc-volver:focus-visible, .akc-gps:focus-visible { outline: 3px solid var(--akc-acc); outline-offset: 2px; }
.akc-puntos::after { content: ""; animation: akc-puntos 1.2s steps(4) infinite; }
@keyframes akc-puntos { 0% { content: ""; } 25% { content: "."; } 50% { content: ".."; } 75% { content: "..."; } }

/* Elegir a mano */
.akc-top { color: #fff; padding: calc(16px + env(safe-area-inset-top, 0px)) 16px 16px; background: linear-gradient(170deg, var(--akc-dark), var(--akc-mid)); }
.akc-top-fila { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; min-height: 38px; }
.akc-volver { width: 38px; height: 38px; border-radius: 12px; border: 0; background: rgba(255,255,255,.14); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; flex: none; }
.akc-top h2 { font-size: 19px; font-weight: 800; }
.akc-buscar { display: flex; align-items: center; gap: 8px; height: 48px; background: #fff; border-radius: 14px; padding: 0 14px; }
.akc-buscar svg { width: 20px; height: 20px; color: var(--akc-gris); flex: none; }
.akc-buscar input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: inherit; font-size: 15px; font-weight: 600; color: var(--akc-txt); }
.akc-lista { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 14px 16px 24px; }
.akc-aviso { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; background: #FFF4EE; color: var(--akc-txt); font-size: 13.5px; font-weight: 600; line-height: 1.4; margin-bottom: 14px; }
.akc-aviso b { display: block; font-size: 14.5px; font-weight: 800; color: var(--akc-dark); }
.akc-gps { display: flex; align-items: center; gap: 12px; width: 100%; padding: 14px; border-radius: 16px; border: 1.5px dashed var(--akc-mid); background: #EAF1FB; color: var(--akc-mid); font-size: 14.5px; font-weight: 800; cursor: pointer; margin-bottom: 18px; text-align: left; }
.akc-gps .ic { width: 38px; height: 38px; border-radius: 12px; background: var(--akc-mid); color: #fff; display: flex; align-items: center; justify-content: center; flex: none; }
.akc-gps small { display: block; font-weight: 600; color: var(--akc-gris); font-size: 12px; }
.akc-prov { font-size: 12.5px; font-weight: 800; color: var(--akc-gris); text-transform: uppercase; letter-spacing: .05em; margin: 4px 4px 8px; }
.akc-grupo { background: #fff; border-radius: 18px; overflow: hidden; margin-bottom: 18px; box-shadow: 0 1px 3px rgba(5,43,89,.06); }
.akc-ciudad { display: flex; align-items: center; gap: 12px; width: 100%; padding: 14px; border: 0; border-bottom: 1px solid var(--akc-linea); background: none; text-align: left; cursor: pointer; color: var(--akc-txt); }
.akc-ciudad:last-child { border-bottom: 0; }
.akc-ini { width: 42px; height: 42px; border-radius: 13px; background: linear-gradient(140deg, var(--akc-dark), var(--akc-mid)); color: #fff; font-weight: 800; font-size: 15px; display: flex; align-items: center; justify-content: center; flex: none; }
.akc-info { flex: 1; min-width: 0; }
.akc-info strong { display: block; font-size: 15.5px; font-weight: 800; }
.akc-info small { font-size: 12.5px; color: var(--akc-gris); font-weight: 600; }
.akc-flecha { width: 20px; height: 20px; color: #b5c2d4; flex: none; }
.akc-ciudad.sel { background: #FFF4EE; }
.akc-ciudad.sel .akc-ini { background: var(--akc-acc); }
.akc-ciudad.sel .akc-flecha { color: var(--akc-acc); }
.akc-vacio { text-align: center; padding: 30px 10px; color: var(--akc-gris); font-size: 14px; }
.akc-vacio b { display: block; color: var(--akc-txt); font-size: 16px; margin-bottom: 4px; }
.akc-sumar { display: block; text-align: center; font-size: 13.5px; font-weight: 700; color: var(--akc-mid); text-decoration: none; padding: 6px 0 4px; }
.akc-barra { padding: 12px 16px calc(14px + env(safe-area-inset-bottom, 0px)); background: #fff; border-top: 1px solid var(--akc-linea); }

/* Bienvenida */
.akc-welcome { position: fixed; inset: 0; z-index: 100001; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 30px; color: #fff;
  background: linear-gradient(170deg, var(--akc-dark), var(--akc-mid)); font-family: 'Plus Jakarta Sans', 'Nunito', -apple-system, sans-serif; }
.akc-listo { width: 84px; height: 84px; border-radius: 50%; background: var(--akc-acc); display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 12px rgba(255,255,255,.12); animation: akc-pop .5s cubic-bezier(.3,1.6,.6,1); }
.akc-listo svg { width: 42px; height: 42px; }
@keyframes akc-pop { from { transform: scale(.3); } to { transform: scale(1); } }
.akc-welcome-city { font-size: 26px; font-weight: 800; margin: 24px 0 6px; }
.akc-welcome-sub { color: rgba(255,255,255,.8); font-size: 15px; }
.akc-carga { width: 160px; height: 5px; border-radius: 5px; background: rgba(255,255,255,.2); margin-top: 26px; overflow: hidden; }
.akc-carga i { display: block; height: 100%; width: 40%; background: var(--akc-acc); border-radius: 5px; animation: akc-carga 1.1s ease-in-out infinite; }
@keyframes akc-carga { from { transform: translateX(-100%); } to { transform: translateX(260%); } }

@media (max-height: 600px) { .akc-cielo { min-height: 180px; } .akc-radar { width: 110px; height: 110px; } }
@media (prefers-reduced-motion: reduce) { .akc *, .akc-welcome * { animation: none !important; } }
