/* ============================================================
   ImportBus · Re-skin "Azul comercial" (handoff Claude Design)
   Pegar en: SitioSimple → Sitio Web → Diseño → CSS (activar)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800&display=swap');

:root {
  --bs-primary: #1c7fd6;
  --bs-primary-rgb: 28, 127, 214;
  --bs-link-color: #1c7fd6;
  --bs-link-hover-color: #166bb8;
  --bs-body-color: #122340;
  --bs-body-bg: #f8fafc;
  --bs-border-color: #e3e8ef;
}

/* Tipografía y fondo general */
body {
  font-family: 'Archivo', 'Mulish', sans-serif !important;
  background-color: #f8fafc !important;
  color: #122340 !important;
}
h1, h2, h3, h4, h5, h6 { font-family: 'Archivo', sans-serif !important; font-weight: 700; color: #122340; }

/* Barra de navegación: navy con logo en blanco */
nav.navbar.bg-primary {
  background-color: #0d2c54 !important;
  box-shadow: 0 2px 10px rgba(13, 44, 84, .25);
}
nav.navbar img { filter: brightness(0) invert(1) !important; }
nav.navbar .nav-link { color: #9fb3cd !important; font-weight: 600; }
nav.navbar .nav-link:hover,
nav.navbar .nav-link.active { color: #ffffff !important; border-bottom: 2px solid #1c7fd6; }
nav.navbar .navbar-toggler { border-color: #9fb3cd; }

/* Botones de acción (azul) */
.btn-primary {
  background-color: #1c7fd6 !important;
  border-color: #1c7fd6 !important;
  border-radius: 8px !important;
  font-weight: 700;
  letter-spacing: .02em;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
  background-color: #166bb8 !important;
  border-color: #166bb8 !important;
}
.btn-outline-primary {
  color: #1c7fd6 !important;
  border-color: #1c7fd6 !important;
  border-radius: 8px !important;
  font-weight: 700;
}
.btn-outline-primary:hover { background-color: #1c7fd6 !important; color: #fff !important; }
.btn-secondary, .btn-dark {
  background-color: #0d2c54 !important;
  border-color: #0d2c54 !important;
  border-radius: 8px !important;
  font-weight: 700;
}

/* Fondos y textos que heredaban el verde agua */
.bg-primary { background-color: #0d2c54 !important; }
.text-primary { color: #1c7fd6 !important; }
a { color: #1c7fd6; }
a:hover { color: #166bb8; }

/* Tarjetas de producto */
.card {
  border: 1px solid #e3e8ef !important;
  border-radius: 12px !important;
  transition: box-shadow .18s ease, transform .18s ease;
}
.card:hover { box-shadow: 0 4px 14px rgba(13, 44, 84, .12); transform: translateY(-2px); }
.card img { border-radius: 8px; }

/* Precios */
.div-price, [class*="price"] {
  font-weight: 800 !important;
  color: #122340 !important;
  font-family: 'Archivo', sans-serif !important;
}

/* Inputs y buscador */
.form-control, .form-select {
  border-radius: 8px !important;
  border-color: #e3e8ef !important;
  color: #122340;
}
.form-control:focus, .form-select:focus {
  border-color: #1c7fd6 !important;
  box-shadow: 0 0 0 3px rgba(28, 127, 214, .18) !important;
}

/* Paginación y badges */
.page-item.active .page-link { background-color: #0d2c54 !important; border-color: #0d2c54 !important; }
.page-link { color: #1c7fd6; border-radius: 6px; }
.badge.bg-primary, .badge.text-bg-primary { background-color: #1c7fd6 !important; }

/* Pie de página: navy (SitioSimple usa clases custom para el color del footer) */
footer,
.footer-custom-background-color {
  background-color: #0d2c54 !important;
  color: #9fb3cd !important;
}
footer a, footer .nav-link, footer span, footer p, footer li,
.footer-custom-text-color, .footer-custom-text-color a,
.footer-custom-text-color span, .footer-custom-text-color p,
.footer-custom-text-color li, .footer-custom-text-color i { color: #9fb3cd !important; }
footer a:hover, .footer-custom-text-color a:hover { color: #ffffff !important; }
footer img { filter: brightness(0) invert(1); }

/* Botón flotante de WhatsApp: verde éxito del sistema */
[class*="whatsapp"], [href*="wa.me"], [href*="whatsapp"] { filter: none; }

/* Toasts / alerts */
.alert-warning { background: #fef7ec; border-color: #f2dfbd; color: #7a5c1e; }