/* =====================================================================
   TITANIC SAC — capa visual (oct 2026)
   Se carga DESPUÉS del tema base (Veltrix/Bootstrap 5). Solo cambia la
   apariencia: no toca ids, clases de lógica ni comportamiento.
   Paleta tomada del logo: azul marino del casco + bronce/latón.
   ===================================================================== */
:root {
    --tt-navy: #0f2a44;
    --tt-navy-2: #173d61;
    --tt-brass: #d9a521;
    --tt-brass-soft: #f6e7b8;
    --tt-paper: #f3f5f8;
    --tt-ink: #1d2733;
    --tt-muted: #5f6b7a;
    --tt-line: #dde3ea;
    --tt-primary: #1f5f99;
    --tt-primary-dark: #174a78;
    --tt-radius: 10px;
    --tt-radius-sm: 7px;
    --tt-font: "Manrope", "Segoe UI", Roboto, Arial, sans-serif;
}

body {
    font-family: var(--tt-font);
    font-size: 14px;
    color: var(--tt-ink);
    background-color: var(--tt-paper);
    -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6, .h4, .h5 { font-family: var(--tt-font); color: inherit; letter-spacing: -0.01em; }

/* ---------- Barra superior (el "puente de mando") ---------- */
header, #page-topbar, header .navbar-brand-box {
    background: var(--tt-navy) !important;
}
header .navbar-header { min-height: 64px; }
header .navbar-brand-box { display: flex; align-items: center; }
header .navbar-brand-box img { max-height: 46px; width: auto; }
header .header-profile-user { width: 34px; height: 34px; background: rgba(255,255,255,.08); padding: 4px; }
header .dropdown-menu { border: 0; border-radius: var(--tt-radius); box-shadow: 0 12px 32px rgba(15,42,68,.18); padding: 8px; min-width: 190px; }
header .dropdown-menu .mr { border-radius: var(--tt-radius-sm); margin: 3px 0; }

/* Menú principal */
nav.navbar.navbar-expand-lg {
    background: var(--tt-navy-2) !important;
    padding: 0;
    border-bottom: 1px solid rgba(0,0,0,.15);
    position: sticky;
    top: 0;
    z-index: 1020;
}
nav.navbar .navbar-nav { gap: 0; flex-wrap: wrap; }
nav.navbar > .container { max-width: 100% !important; padding-left: 16px; padding-right: 16px; }
nav.navbar .nav-item { border-radius: 0; }
nav.navbar .nav-item > .nav-link {
    color: #e8eef5 !important;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .01em;
    white-space: nowrap;
    padding: 14px 8px 12px !important;
    border-bottom: 2px solid transparent;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: background-color .15s ease, border-color .15s ease;
}
nav.navbar .nav-item > .nav-link i { color: var(--tt-brass) !important; font-size: 14px; margin: 0; }
nav.navbar .nav-item > .nav-link:hover,
nav.navbar .nav-item > .nav-link:focus-visible,
nav.navbar .nav-item.show > .nav-link {
    background: rgba(255,255,255,.07);
    border-bottom-color: var(--tt-brass);
    outline: none;
}
nav.navbar .dropdown-menu {
    border: 0;
    border-radius: 0 0 var(--tt-radius) var(--tt-radius);
    box-shadow: 0 14px 30px rgba(15,42,68,.2);
    padding: 6px;
    margin-top: 0;
}
nav.navbar .dropdown-item { border-radius: var(--tt-radius-sm); padding: 8px 12px; font-size: 13px; color: var(--tt-ink); }
nav.navbar .dropdown-item:hover { background: var(--tt-brass-soft); }
/* Aviso de "Intercambio Productos": se mantiene destacado, sin parpadeo agresivo */
nav.navbar .panel-palpitante { animation: none; background: rgba(217,165,33,.18); border-radius: 6px; margin: 6px 4px; }
nav.navbar .panel-palpitante > .nav-link { padding-top: 9px !important; padding-bottom: 7px !important; }
nav.navbar .navbar-toggler { border: 0; padding: 12px 14px; }
nav.navbar .navbar-toggler i { color: #fff !important; font-size: 20px; }
@media (max-width: 991.98px) {
    nav.navbar .navbar-nav { padding: 6px 0 10px; }
    nav.navbar .nav-item > .nav-link { padding: 11px 14px !important; border-bottom: 0; border-left: 3px solid transparent; }
    nav.navbar .nav-item > .nav-link:hover { border-left-color: var(--tt-brass); }
    nav.navbar .dropdown-menu { box-shadow: none; background: rgba(255,255,255,.06); }
    nav.navbar .dropdown-item { color: #e8eef5; }
    nav.navbar .dropdown-item:hover { background: rgba(255,255,255,.1); }
}

/* ---------- Contenido ---------- */
#contenedor-app { padding-top: 18px; padding-bottom: 40px; }
.page-title-box { padding-bottom: 6px; }
.page-title-box h4, .page-title-box .page-title { font-size: 19px; font-weight: 700; color: var(--tt-navy); }
.breadcrumb { font-size: 12.5px; }
.breadcrumb-item a { color: var(--tt-muted); }

.card {
    border: 1px solid var(--tt-line);
    border-radius: var(--tt-radius);
    box-shadow: 0 1px 2px rgba(15,42,68,.05);
}
.card-header { background: transparent; border-bottom: 1px solid var(--tt-line); font-weight: 600; }
.card-title { font-weight: 700; color: var(--tt-navy); }

/* Botones */
.btn { border-radius: var(--tt-radius-sm); font-weight: 600; font-size: 13px; letter-spacing: .005em; }
.btn-sm { font-size: 12px; }
.btn-primary { background-color: var(--tt-primary); border-color: var(--tt-primary); }
.btn-primary:hover, .btn-primary:focus { background-color: var(--tt-primary-dark); border-color: var(--tt-primary-dark); }
.btn:focus-visible { box-shadow: 0 0 0 3px rgba(217,165,33,.45) !important; }

/* Formularios */
.form-control, .form-select, .input-group-text, .bootstrap-select > .dropdown-toggle {
    border-radius: var(--tt-radius-sm);
    border-color: #cfd7e1;
    font-size: 13.5px;
}
.input-group > .form-control:not(:first-child), .input-group > .btn:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.input-group > .form-control:not(:last-child), .input-group > .btn:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.form-control:focus, .form-select:focus {
    border-color: var(--tt-primary);
    box-shadow: 0 0 0 3px rgba(31,95,153,.15);
}
label, .form-label { font-weight: 600; font-size: 12.5px; color: var(--tt-muted); margin-bottom: 4px; }

/* Tablas (DataTables incluido) */
.table { font-size: 13px; }
.table > thead th {
    background: #eef2f7;
    color: var(--tt-navy);
    font-weight: 700;
    font-size: 12px;
    border-bottom: 2px solid #d3dbe5 !important;
    vertical-align: middle;
}
.table > tbody td { vertical-align: middle; border-color: #e8edf3; }
.table-hover > tbody > tr:hover > *, table.dataTable tbody tr:hover > * { background-color: #f6f9fc; }
.table td .btn { padding: 4px 9px; }
td, .table td { font-variant-numeric: tabular-nums; }
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    border-radius: var(--tt-radius-sm);
    border: 1px solid #cfd7e1;
    padding: 5px 9px;
}
.dataTables_wrapper .dataTables_info { color: var(--tt-muted); font-size: 12.5px; }
.page-link { border-radius: var(--tt-radius-sm) !important; margin: 0 2px; border-color: var(--tt-line); color: var(--tt-primary); font-size: 12.5px; }
.page-item.active .page-link { background-color: var(--tt-primary); border-color: var(--tt-primary); }

.badge { font-weight: 600; border-radius: 6px; padding: .38em .6em; }

/* Modales y alertas */
.modal-content { border: 0; border-radius: 14px; box-shadow: 0 24px 60px rgba(15,42,68,.25); }
.modal-header { border-bottom-color: var(--tt-line); }
.modal-footer { border-top-color: var(--tt-line); }
.swal2-popup { border-radius: 14px !important; font-family: var(--tt-font) !important; }
.swal2-styled.swal2-confirm { background-color: var(--tt-primary) !important; border-radius: var(--tt-radius-sm) !important; }

/* Pie con crédito */
.tt-credito {
    text-align: center;
    font-size: 12px;
    color: var(--tt-muted);
    padding: 18px 12px 26px;
}
.tt-credito a { color: var(--tt-primary); font-weight: 600; text-decoration: none; }
.tt-credito a:hover { text-decoration: underline; }

/* Celular: tablas con desplazamiento horizontal y menos aire */
@media (max-width: 767.98px) {
    #contenedor-app { padding-left: 10px; padding-right: 10px; }
    .card-body { padding: 14px; }
    .dataTables_wrapper { overflow-x: auto; }
    .btn { font-size: 12.5px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Pantallas de oficina (laptops / monitores de 1366-1600 px): el menú de administrador tiene
   14 opciones; sin los íconos entra en una sola línea */
@media (min-width: 992px) and (max-width: 1599.98px) {
    nav.navbar .nav-item > .nav-link i { display: none; }
    nav.navbar .nav-item > .nav-link { padding-left: 9px !important; padding-right: 9px !important; }
}

/* Recuadros de totales (SUMA PEDIDO, etc.) y textos de color primario con la paleta */
.bg-primary { background-color: var(--tt-navy-2) !important; }
.text-primary { color: var(--tt-primary) !important; }
.bg-primary.pv-15, .bg-primary.p-3 { border-radius: var(--tt-radius-sm); box-shadow: inset 0 -3px 0 var(--tt-brass); }