/* =====================================================================
   MI CUENTA — app de clientes "Tribu NURVA", Fase 1 (5-oct-2026)
   Mismo lenguaje que la landing negra: bordes duros blancos, sombra azul,
   acentos tornasol para los drops. Pensada primero para celular.
   ===================================================================== */
.ct-body{min-height:100vh;}
.ct-nav-tag{font-family:'Archivo',sans-serif;font-weight:900;text-transform:uppercase;letter-spacing:.12em;font-size:12px;color:#fff;border:2px solid #fff;border-radius:999px;padding:5px 12px;}
.ct-wrap{max-width:560px;margin:0 auto;padding:28px 16px 140px;}
.ct-card{border:3px solid #fff;border-radius:18px;background:#0E0E12;box-shadow:6px 6px 0 var(--cobalt);padding:24px 20px;margin-bottom:22px;}
.ct-center{text-align:center;}
.ct-kicker{font-family:'Archivo',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--cobalt-2,#3F5CFF);}
.ct-title{font-size:clamp(30px,8vw,44px);line-height:.95;margin:6px 0 10px;text-transform:uppercase;}
.ct-lead{color:rgba(255,255,255,.78);line-height:1.5;margin:0 0 18px;}
.ct-sub{color:rgba(255,255,255,.55);font-size:13px;}
.ct-btn-full{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;}
.ct-sep{display:flex;align-items:center;gap:10px;margin:18px 0;color:rgba(255,255,255,.5);font-size:12px;text-transform:uppercase;letter-spacing:.1em;}
.ct-sep::before,.ct-sep::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.2);}
.ct-form{display:flex;flex-direction:column;gap:12px;}
.ct-form label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700;color:rgba(255,255,255,.8);}
.ct-form input,.ct-form textarea{background:#000;color:#fff;border:2px solid rgba(255,255,255,.6);border-radius:10px;padding:12px;font:inherit;font-size:16px;}
.ct-form input:focus,.ct-form textarea:focus{outline:none;border-color:var(--cobalt-2,#3F5CFF);}
.ct-msg{min-height:1.2em;margin:12px 0 0;font-size:14px;color:rgba(255,255,255,.8);}
.ct-msg.err{color:#FF6B6B;}
.ct-msg.ok{color:#7CF0A9;}
.ct-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px;}
.ct-link-btn{background:none;border:0;color:rgba(255,255,255,.7);text-decoration:underline;font:inherit;cursor:pointer;padding:6px;}
.ct-lista{display:flex;flex-direction:column;gap:14px;margin-bottom:20px;}
.ct-vacio{color:rgba(255,255,255,.7);text-align:center;padding:24px 8px;border:2px dashed rgba(255,255,255,.3);border-radius:14px;}
.ct-pedir{margin-top:6px;}
.ct-legal{color:rgba(255,255,255,.4);font-size:12px;text-align:center;margin-top:28px;line-height:1.5;}

/* Tarjeta de pedido en la lista */
.ct-ped{display:block;text-align:left;width:100%;border:2px solid #fff;border-radius:14px;background:#0E0E12;color:#fff;padding:14px 16px;cursor:pointer;font:inherit;}
.ct-ped:hover{border-color:var(--cobalt-2,#3F5CFF);}
.ct-ped-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px;}
.ct-ped-num{font-family:'Archivo',sans-serif;font-weight:900;letter-spacing:.06em;}
.ct-ped-items{color:rgba(255,255,255,.75);font-size:14px;line-height:1.4;}
.ct-ped-meta{color:rgba(255,255,255,.5);font-size:12px;margin-top:6px;}

/* Estado */
.ct-estado{display:inline-block;border-radius:999px;padding:3px 10px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;background:#22232A;color:#fff;}
.ct-estado.e-nuevo{background:#2A1B1B;color:#FF8A8A;}
.ct-estado.e-prep{background:#1B2140;color:#9FB0FF;}
.ct-estado.e-pickup{background:#123A22;color:#7CF0A9;}
.ct-estado.e-transit{background:#3A2E12;color:#FFD27A;}
.ct-estado.e-done{background:#22232A;color:rgba(255,255,255,.7);}
.ct-drop{display:inline-block;margin-bottom:6px;padding:2px 9px;border:2px solid #000;border-radius:8px;background:var(--holo);background-size:260% 100%;animation:holo-shift 9s linear infinite;color:#0A0A0C;font-family:'Archivo',sans-serif;font-weight:900;font-size:11px;letter-spacing:.06em;text-transform:uppercase;}

/* Detalle del pedido */
.ct-back{margin-bottom:12px;}
.ct-pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:14px 0 18px;}
.ct-paso{text-align:center;font-size:11px;font-weight:700;color:rgba(255,255,255,.45);text-transform:uppercase;letter-spacing:.04em;}
.ct-paso i{display:block;height:6px;border-radius:4px;background:#2A2B33;margin-bottom:6px;}
.ct-paso.on{color:#fff;}
.ct-paso.on i{background:var(--cobalt-2,#3F5CFF);}
.ct-paso.now i{background:var(--holo);background-size:260% 100%;animation:holo-shift 6s linear infinite;}
.ct-bloque{border-top:1px solid rgba(255,255,255,.15);padding-top:14px;margin-top:14px;}
.ct-bloque h2{font-family:'Archivo',sans-serif;font-size:14px;text-transform:uppercase;letter-spacing:.1em;margin:0 0 10px;}
.ct-linea{display:flex;justify-content:space-between;gap:10px;font-size:15px;padding:3px 0;}
.ct-caja-sab{color:rgba(255,255,255,.6);font-size:13px;margin:-2px 0 6px 12px;}
.ct-total{font-weight:800;border-top:1px dashed rgba(255,255,255,.25);margin-top:8px;padding-top:8px;}

/* Llegada */
.ct-llegada{border:3px solid #fff;border-radius:16px;padding:16px;background:#000;}
.ct-llegada p{margin:0 0 12px;color:rgba(255,255,255,.8);}
.ct-mins{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;}
.ct-min{flex:1;min-width:64px;white-space:nowrap;border:2px solid #fff;border-radius:10px;background:#0E0E12;color:#fff;font-family:'Archivo',sans-serif;font-weight:900;padding:12px 4px;cursor:pointer;font-size:14px;}
.ct-min:hover,.ct-min:focus-visible{background:var(--cobalt);}
.ct-llegue{width:100%;border:3px solid #000;border-radius:14px;padding:18px;font-family:'Archivo',sans-serif;font-weight:900;font-size:22px;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;color:#0A0A0C;background:var(--holo);background-size:260% 100%;animation:holo-shift 7s linear infinite;box-shadow:5px 5px 0 var(--cobalt);}
.ct-llegue:disabled{opacity:.6;cursor:default;}
.ct-nota{margin-top:10px;}
.ct-nota input{width:100%;background:#0E0E12;color:#fff;border:2px solid rgba(255,255,255,.4);border-radius:10px;padding:10px;font:inherit;font-size:16px;}
.ct-aviso{border-radius:12px;padding:12px 14px;margin-bottom:12px;font-weight:700;}
.ct-aviso.camino{background:#1B2140;color:#C9D2FF;}
.ct-aviso.llego{background:#123A22;color:#B6F7CF;}
.ct-aviso small{display:block;font-weight:500;opacity:.8;margin-top:3px;}

/* Valoración */
.ct-val-sabor{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.1);}
.ct-val-nombre{font-weight:700;margin-bottom:6px;}
.ct-stars{display:flex;gap:4px;}
.ct-star{background:none;border:0;font-size:30px;line-height:1;color:rgba(255,255,255,.25);cursor:pointer;padding:2px;}
.ct-star.on{color:transparent;background:var(--holo);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;}
.ct-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.ct-tag{border:1.5px solid rgba(255,255,255,.5);border-radius:999px;background:none;color:#fff;font-size:12px;padding:5px 10px;cursor:pointer;}
.ct-tag.on{background:#fff;color:#000;border-color:#fff;}
.ct-gracias{text-align:center;padding:10px 0;color:#B6F7CF;font-weight:700;}
.ct-invita{border:2px dashed rgba(255,255,255,.35);border-radius:14px;padding:14px;margin-top:18px;text-align:center;color:rgba(255,255,255,.8);font-size:14px;}
.ct-invita a{color:#fff;font-weight:800;}

@media (prefers-reduced-motion:reduce){.ct-drop,.ct-paso.now i,.ct-llegue{animation:none;}}

/* Fotos de la tribu (Fase 2) */
.ct-fotos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px;}
.ct-foto{display:flex;flex-direction:column;gap:4px;}
.ct-foto img,.ct-foto-vacia{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px;border:2px solid #fff;background:#1a1b22;}
.ct-foto-vacia{display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.4);}
.ct-foto-estado{font-size:11px;font-weight:700;line-height:1.3;}
.ct-foto-estado.e-aprobada{color:#7CF0A9;}
.ct-foto-estado.e-pendiente{color:#C9D2FF;}
.ct-foto-estado.e-rechazada{color:rgba(255,255,255,.5);}
.ct-foto-retirar{font-size:12px;padding:0;text-align:left;}
.ct-foto-elegir{cursor:pointer;margin-bottom:12px;}
.ct-foto-preview{width:100%;max-height:420px;object-fit:contain;border-radius:12px;border:2px solid #fff;margin-bottom:12px;background:#000;}
.ct-check{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.45;color:rgba(255,255,255,.85);margin-bottom:10px;cursor:pointer;}
.ct-check input{margin-top:3px;width:18px;height:18px;flex-shrink:0;accent-color:var(--cobalt);}
.ct-foto-botones{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px;}
.ct-foto-botones .ct-foto-elegir{margin:0;text-align:center;justify-content:center;}
.ct-foto-botones .ct-foto-elegir{padding:12px 6px;font-size:14px;}

/* Seguimiento de delivery en vivo */
.ct-mapa{height:300px;border-radius:14px;border:3px solid #fff;overflow:hidden;background:#111;}
.ct-mapa .leaflet-tile{filter:invert(1) hue-rotate(180deg) brightness(.95) contrast(.9);}
.ct-mapa-info{margin-top:8px;font-size:14px;font-weight:700;color:#B6F7CF;}
.ct-pin{font-size:30px;line-height:40px;text-align:center;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6));}

/* Cámara propia (selfie) */
.ct-cam{position:fixed;inset:0;z-index:9999;background:#000;display:flex;flex-direction:column;}
.ct-cam video{flex:1;min-height:0;width:100%;object-fit:cover;background:#000;}
.ct-cam-acc{display:flex;justify-content:space-around;align-items:center;gap:10px;padding:18px 14px calc(18px + env(safe-area-inset-bottom));background:#000;}
.ct-cam-disparo{width:74px;height:74px;border-radius:50%;border:5px solid #fff;background:rgba(255,255,255,.25);cursor:pointer;}
.ct-cam-disparo:active{background:#fff;}

.ct-van{filter:drop-shadow(0 3px 5px rgba(0,0,0,.55));} .ct-van-in{width:84px;height:48px;transition:transform .25s;}
.ct-ped-mapa{display:flex;align-items:center;gap:8px;margin:8px 0 2px;padding:8px 10px;border-radius:10px;background:rgba(30,58,255,.18);border:1px solid #4F6BFF;color:#fff;font-weight:800;font-size:13px;}
.ct-van-mini{width:40px;height:23px;flex:none;display:inline-block;}
