/* =============================================================
   uwu.money — estilos.etips.css
   CSS mínimo y provisional (B4): solo las clases que usan las plantillas portadas.
   Se reemplaza por el tema uwu en C2. Paleta neutra a propósito.
   ============================================================= */

/* ── Variables ─────────────────────────────────────────────── */
:root {
  --uwu-primary:       #475569;
  --uwu-primary-dark:  #334155;
  --uwu-primary-light: #e2e8f0;
  --uwu-dark:          #1e293b;
  --uwu-muted:         #6c757d;
  --uwu-border:        #ebebeb;
  --uwu-bg:            #f8f8f6;
}

/* ── Base ───────────────────────────────────────────────────── */
body {
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
  color: #333;
}

/* ── Selector de país (dropdown en navbar) ────────────────────── */
.dropdown-menu .dropdown-item.active,
.dropdown-menu .dropdown-item:active {
  background: var(--uwu-primary-light);
  color: var(--uwu-primary-dark);
}

/* ── Logo según tema ─────────────────────────────────────────
   Para fondos que cambian con el tema (C2): poner las dos versiones juntas,
   <img class="uwu-logo-tema-claro"> (para fondo claro) y <img class="uwu-logo-tema-oscuro">;
   se muestra solo la que corresponde. Sin modo oscuro activo, siempre la clara. */
[data-bs-theme="dark"] .uwu-logo-tema-claro,
:root:not([data-bs-theme="dark"]) .uwu-logo-tema-oscuro { display: none !important; }

/* ── Navbar ─────────────────────────────────────────────────── */
.navbar-uwu {
  background: var(--uwu-primary-dark) !important;
  border-bottom: none;
  padding-top: 10px;
  padding-bottom: 10px;
}
.navbar-uwu .navbar-brand {
  padding: 0;
  line-height: 1;
}
/* Alto fijo y ancho automático: el logo oficial es 1636x336 (≈4,9:1) */
.navbar-uwu .navbar-brand img {
  height: 32px;
  width: auto;
  display: block;
}
@media (max-width: 575.98px) {
  .navbar-uwu .navbar-brand img { height: 28px; }
}
.navbar-uwu .navbar-toggler {
  border-color: rgba(255,255,255,.5);
}
.navbar-uwu .navbar-toggler-icon {
  filter: invert(1);
}
.navbar-uwu .navbar-collapse {
  justify-content: flex-end;
}
.nav-link-uwu {
  color: rgba(255,255,255,.9) !important;
  font-weight: 500;
  font-size: .95rem;
}
.nav-link-uwu:hover {
  color: #fff !important;
}
.btn-uwu-navbar {
  background: #fff;
  color: var(--uwu-dark);
  border: none;
  font-weight: 700;
  border-radius: 8px;
  padding: 9px 22px;
  font-size: .93rem;
  transition: background .15s;
  text-decoration: none;
  display: inline-block;
}
.btn-uwu-navbar:hover {
  background: #f5f5f5;
  color: var(--uwu-dark);
}
.btn-uwu-primary {
  background: var(--uwu-primary-dark);
  color: #fff;
  border: none;
  font-weight: 700;
  border-radius: 8px;
  padding: 9px 22px;
  font-size: .93rem;
  transition: background .15s;
  text-decoration: none;
  display: inline-block;
}
.btn-uwu-primary:hover {
  background: var(--uwu-primary-dark);
  color: #fff;
}

/* ── Buscador de ubicaciones (main.etips.js: initBuscadorDonde) ── */
/* El dropdown parte oculto: el JS lo muestra con .show() cuando hay resultados */
.uwu-donde-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 8px 28px rgba(0,0,0,.14);
  max-height: 320px;
  overflow-y: auto;
  z-index: 1050;
  text-align: left;
}
.uwu-donde-item {
  padding: 10px 16px;
  font-size: .92rem;
  color: #333;
  cursor: pointer;
}
.uwu-donde-item:hover,
.uwu-donde-item:focus {
  background: #f5f5f5;
}
.uwu-donde-item small {
  font-size: .82rem;
}

/* ── Auth pages ──────────────────────────────────────────────── */
/* Las pantallas de ingreso (body.page-auth) no muestran el menú principal */
.page-auth nav.navbar { display:none; }
.auth-wrap { min-height:80vh; display:flex; align-items:center; justify-content:center; padding:48px 16px; background:var(--uwu-bg); }
.auth-card { background:#fff; width:100%; max-width:420px; border-radius:16px; overflow:hidden; box-shadow:0 4px 24px rgba(0,0,0,.07); }
.auth-card-logo { background:var(--uwu-primary-dark); padding:28px 36px 24px; text-align:center; }
.auth-card-logo a { color:#fff; font-weight:800; font-size:1.25rem; text-decoration:none; }
.auth-card-logo img { height:34px; width:auto; display:inline-block; }
.auth-card-body { padding:32px 36px 36px; }
.auth-card .form-control { border-radius:8px; border:1px solid #e0e0e0; font-size:.95rem; padding:10px 14px; }
.auth-card .form-control:focus { border-color:var(--uwu-primary); box-shadow:0 0 0 3px var(--uwu-primary-light); }
.auth-card .input-group .form-control:focus { box-shadow:none; }
.auth-card .input-group:focus-within .form-control,
.auth-card .input-group:focus-within .btn-outline-secondary { border-color:var(--uwu-primary); }
.auth-card .input-group:focus-within { border-radius:8px; box-shadow:0 0 0 3px var(--uwu-primary-light); }
.auth-card .form-label { font-size:.85rem; color:var(--uwu-dark); font-weight:600; margin-bottom:4px; }
.auth-card .btn-outline-secondary { border-radius:0 8px 8px 0; border-left:0; border-color:#e0e0e0; }
/* Bootstrap oculta .invalid-feedback salvo junto a .is-invalid; jquery-validate inserta el
   mensaje como elemento propio, así que se fuerza visible o los errores no se verían */
.auth-card .invalid-feedback { display:block; font-size:.8rem; }
.auth-error { border-radius:8px; border:1px solid #ffc107; padding:10px 14px; font-size:.875rem; color:#664d03; background:#fff3cd; }
.auth-link { color:var(--uwu-muted); font-size:.875rem; text-decoration:none; }
.auth-link:hover { color:var(--uwu-primary); }

/* ── Footer ─────────────────────────────────────────────────── */
.uwu-footer {
  background: var(--uwu-dark);
  color: #999;
  padding: 44px 0;
  font-size: .88rem;
}
.uwu-footer .brand img {
  height: 30px;
  width: auto;
  display: block;
}
.uwu-footer a {
  color: #999;
  text-decoration: none;
}
.uwu-footer a:hover {
  color: #fff;
}
.uwu-footer hr {
  border-color: #2e2e45;
}

/* ── Paginación ─────────────────────────────────────────────── */
.pagination .page-link {
  color: var(--uwu-primary);
  border-color: var(--uwu-border);
}
.pagination .page-item.active .page-link {
  background: var(--uwu-primary-dark);
  border-color: var(--uwu-primary-dark);
  color: #fff;
}
.pagination .page-link:focus {
  box-shadow: 0 0 0 3px var(--uwu-primary-light);
}

/* ── Breadcrumb ─────────────────────────────────────────────── */
.breadcrumb-item a {
  color: var(--uwu-primary);
  text-decoration: none;
}
.breadcrumb-item.active {
  color: var(--uwu-muted);
}
