/* ============================================================================
   TEMA MAINTON — la presentación de la plantilla sobre la web existente.
   Paleta: celeste #16bae1 · amarillo #fbb908 · tinta #1e1e29 · marino #072d5a
   Tipografías: Rubik (títulos) + Sintony (texto), como la plantilla.
   Se carga DE ÚLTIMO para mandar sobre el tema anterior.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;700;900&family=Sintony:wght@400;700&display=swap');

:root{
  --primary: 193 82% 48%;          /* #16bae1 */
  --ring: 193 82% 48%;
  --accent: 45 96% 51%;            /* #fbb908 */
  --radius: .35rem;
}

body{ font-family:'Sintony','Trebuchet MS',system-ui,sans-serif; }
.font-display{ font-family:'Rubik','Trebuchet MS',sans-serif; font-weight:500; }
h2.font-display{ color:#1e1e29; letter-spacing:0; }
.tz-hero .font-display,.mp-hero .font-display{ color:#fff; }

/* ---- Botones: planos con borde, como .btn-style-one de la plantilla ---- */
.mp-btn-pill,.mp-btn-pill-o,.rounded-full[class*="bg-primary"],button.rounded-xl[class*="bg-primary"],
.mp-busca-btn,.mp-btn-lleno{
  border-radius:4px!important;
  box-shadow:none;
  text-transform:none;
  font-family:'Rubik',sans-serif;
  font-weight:500;
  letter-spacing:.01em;
}
.mp-btn-pill-o{ border:2px solid #16bae1; color:#0b7d99; }
.mp-btn-pill-o:hover{ background:#16bae1; border-color:#16bae1; color:#fff; }
.mp-busca-btn,.mp-btn-lleno,.mp-tab2-on,.mp-dest-flecha:hover,.mp-busca-sel:focus{
  background-color:#16bae1; border-color:#16bae1;
}
.mp-busca-btn:hover,.mp-btn-lleno:hover{ background-color:#0d94b5; border-color:#0d94b5; }

/* ---- Tarjetas: blancas con la sombra suave de la plantilla ---- */
.glass,.glass-strong{
  background:#ffffff;
  border:1px solid #e2edf5;
  box-shadow:0 10px 30px rgba(7,45,90,.06);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  transition:box-shadow .3s ease, transform .3s ease;
}
.glass:hover,.glass-strong:hover{ box-shadow:0 18px 40px rgba(7,45,90,.10); }

/* ---- Bandas y fondos de sección ---- */
.mp-banda-gris{ background:#e8f1f7; }
.mp-banda-grad,.mp-banda-marcas,.mp-cat-band{ background:linear-gradient(105deg,#072d5a,#16bae1); }
.mp-prop-a{ background:linear-gradient(135deg,#072d5a,#0d94b5); }
.mp-prop-b{ background:linear-gradient(135deg,#0d94b5,#16bae1); }
.text-gradient{ background:linear-gradient(to right,#072d5a,#16bae1); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* ---- Verdes esmeralda del tema viejo → celeste de la plantilla ---- */
.text-emerald-400,.text-emerald-500{ color:#16bae1; }
.bg-emerald-400,.bg-emerald-500{ background-color:#16bae1; }
.bg-emerald-500\/10{ background-color:rgba(22,186,225,.1); }
.bg-emerald-500\/20{ background-color:rgba(22,186,225,.2); }
.border-emerald-500\/30{ border-color:rgba(22,186,225,.3); }
.mp-h-ico:hover{ color:#16bae1; }

/* ---- Pie de página marino, como la plantilla ---- */
.mp-footer{ background:#072d5a; color:#b7c8de; }
.mp-footer .text-muted-foreground{ color:#92b0d4; }

/* ---- Revelado al hacer scroll (efecto WOW/fadeInUp de la plantilla) ---- */
.ns-rev{ opacity:0; transform:translateY(34px); transition:opacity .7s ease, transform .7s ease; }
.ns-rev.ns-vis{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .ns-rev{ opacity:1; transform:none; transition:none; } }

/* ---- Botón «subir» de la plantilla ---- */
#ns-subir{
  position:fixed; right:18px; bottom:18px; z-index:80;
  width:44px; height:44px; border:none; border-radius:4px;
  background:#16bae1; color:#fff; font-size:20px; line-height:1;
  cursor:pointer; display:none; align-items:center; justify-content:center;
  box-shadow:0 6px 18px rgba(7,45,90,.25); transition:background .2s;
}
#ns-subir:hover{ background:#072d5a; }
#ns-subir.ns-on{ display:flex; }

/* ---- Estado del pedido: letras blancas sobre celeste ---- */
.ns-estado-chip{ display:inline-block; background:#16bae1; color:#fff!important; padding:4px 12px; border-radius:4px; font-weight:600; font-size:13px; }

/* ---- Elección del reembolso: ventana propia que tapa lo de atrás ---- */
.ns-eleccion{
  position:fixed!important; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(560px,92vw); max-height:86vh; overflow-y:auto;
  background:#fff!important; border:none!important; border-radius:16px;
  padding:22px 22px 18px!important; z-index:160;
  box-shadow:0 0 0 100vmax rgba(7,25,45,.6), 0 30px 80px rgba(7,45,90,.35);
}