/* ================================================
   ticket53 — Brand overrides
   Cargado después de style.css y responsive.css
   ================================================ */

:root {
  --coral:  #FF5B3B;
  --indigo: #2C2C7A;
  --gold:   #FFD166;
  --mint:   #06D6A0;
  --rose:   #FF8FA3;
  --dark:   #1E1E3F;
  --gray:   #6B6B8A;
}

/* ── FUENTE BODY ── */
body {
  font-family: 'Nunito', sans-serif;
  color: #1E1E3F;
}

/* ── LOGO MOBILE ── */
@media (max-width: 767px) {
  nav.bootsnav .navbar-brand img.logo {
    height: 50px !important;
  }
  nav.bootsnav .navbar-brand {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
}

/* ── NAVBAR — quitar borde blanco attr-nav ── */
nav.navbar.attr-border .attr-nav {
  border-left: none !important;
}

/* ── HAMBURGER BLANCO EN MOBILE ── */
@media (max-width: 767px) {
  nav.navbar.bootsnav .navbar-toggle,
  nav.navbar.bootsnav .navbar-toggle i {
    color: #ffffff !important;
  }
}

/* ── NAVBAR ── */
nav.bootsnav,
nav.bootsnav.sticked {
  background-color: #2C2C7A !important;
  border-bottom: none !important;
  box-shadow: 0 2px 16px rgba(44, 44, 122, 0.3);
}

nav.bootsnav ul.nav > li > a,
nav.bootsnav.sticked ul.nav > li > a {
  color: rgba(255, 255, 255, 0.85) !important;
}

nav.bootsnav ul.nav > li > a:hover,
nav.bootsnav ul.nav > li.active > a,
nav.bootsnav.sticked ul.nav > li > a:hover {
  color: #FFD166 !important;
}

/* Menú mobile desplegado (clase .in que añade Bootstrap al abrir hamburger) */
nav.navbar.bootsnav .navbar-collapse.collapse.in {
  background-color: #2C2C7A !important;
}

/* Línea activa bajo links del nav */
header nav.navbar.border.bootsnav.navbar-fixed.no-background ul li a::after {
  background: #FFD166 none repeat scroll 0 0;
}

/* ── BOTONES — pill shape (override components.css border-radius:0 !important) ── */
.btn-theme,
.btn-theme.border,
a.btn-theme,
button.btn-theme {
  border-radius: 100px !important;
  box-shadow: 0 4px 14px rgba(255, 91, 59, 0.3);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.btn-theme:hover,
.btn-theme:focus,
a.btn-theme:hover,
button.btn-theme:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(255, 91, 59, 0.45);
}

/* Botón outline/border también pill */
.btn-theme.border {
  border-radius: 100px !important;
}

/* ── FOOTER MOBILE LINKS ── */
.footer-mobile-links {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 4px;
  padding-top: 2px;
}

.footer-mobile-links a {
  color: rgba(255, 255, 255, 0.6);
  font-size: 12px;
}

.footer-mobile-links a:hover {
  color: #FFD166;
}

/* ── FOOTER ── */
footer .f-items h4 {
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
}

footer .f-items p,
footer .f-items a {
  color: rgba(255, 255, 255, 0.6);
}

footer .f-items a:hover {
  color: #FFD166;
}

.footer-bottom.bg-dark p {
  color: rgba(255, 255, 255, 0.45);
  font-size: 12px;
}

/* ── SITE HEADING — línea decorativa bajo h2 ── */
.site-heading h2 span,
.site-heading.clean h2 span {
  color: #FF5B3B;
}

/* ── TABLA DASHBOARDS ── */
#tabla-envios {
  width: 100% !important;
}

/* Columna Datos — flex vertical */
.datos-cell {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.datos-cell-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.datos-cell-sub {
  font-size: 0.82em;
  color: #6B6B8A;
}

/* Child row (filas expandidas) — ul flex */
#tabla-envios.dataTable tr.child ul {
  display: block;
  width: 100%;
}

#tabla-envios.dataTable tr.child ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 5px 0;
}

#tabla-envios.dataTable tr.child ul li span.dtr-title {
  font-weight: 700;
  color: #6B6B8A;
  font-size: 0.82em;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  flex-shrink: 0;
}

#tabla-envios.dataTable tr.child ul li span.dtr-data {
  text-align: right;
  flex: 1;
}

/* ── INPUTS FOCUS ── */
input:focus,
textarea:focus,
select:focus {
  border-color: #FF5B3B !important;
  outline: none;
}

/* ── BADGES DE ESTADO (clases utilitarias nuevas) ── */
.badge-success-brand {
  background: rgba(6, 214, 160, 0.15);
  color: #06D6A0;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 100px !important;
}

.badge-active-brand {
  background: rgba(255, 91, 59, 0.12);
  color: #FF5B3B;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 100px !important;
}

.badge-pending-brand {
  background: rgba(255, 209, 102, 0.2);
  color: #a07800;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 100px !important;
}

/* ── STICKY FOOTER EN MÓVIL ──
   El footer se pega al fondo de la pantalla cuando hay poco contenido.
   Si el contenido es largo, el footer fluye normal debajo. */
@media (max-width: 767px) {
  body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
  }
  body > footer {
    margin-top: auto;
  }
}