/* ==========================================================================
   BajaTrucks — tema sobre Bootstrap 5.3
   Paleta: neutros (zinc) + acento verde azulado (teal 700). Contraste AA.
   ========================================================================== */

:root,
[data-bs-theme="light"] {
    --bt-accent: #0f766e;          /* teal-700: 5.5:1 sobre blanco */
    --bt-accent-hover: #115e59;    /* teal-800 */
    --bt-accent-soft: #ccfbf1;
    --bt-surface: #ffffff;
    --bt-bg: #f6f7f8;
    --bt-border: #e4e4e7;
    --bt-panel-header: #18181b;

    --bs-body-bg: var(--bt-bg);
    --bs-body-color: #18181b;
    --bs-secondary-color: #52525b;
    --bs-border-color: var(--bt-border);
    --bs-primary: var(--bt-accent);
    --bs-primary-rgb: 15, 118, 110;
    --bs-link-color: var(--bt-accent);
    --bs-link-color-rgb: 15, 118, 110;
    --bs-link-hover-color: var(--bt-accent-hover);
    --bs-link-hover-color-rgb: 17, 94, 89;
    --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

[data-bs-theme="dark"] {
    --bt-accent: #2dd4bf;          /* teal-400 sobre fondo oscuro */
    --bt-accent-hover: #5eead4;
    --bt-accent-soft: #134e4a;
    --bt-surface: #1f1f23;
    --bt-bg: #121214;
    --bt-border: #2e2e33;
    --bt-panel-header: #0b0b0c;

    --bs-body-bg: var(--bt-bg);
    --bs-body-color: #e4e4e7;
    --bs-secondary-color: #a1a1aa;
    --bs-border-color: var(--bt-border);
    --bs-primary: var(--bt-accent);
    --bs-primary-rgb: 45, 212, 191;
    --bs-link-color: var(--bt-accent);
    --bs-link-color-rgb: 45, 212, 191;
    --bs-link-hover-color: var(--bt-accent-hover);
    --bs-link-hover-color-rgb: 94, 234, 212;
}

body { -webkit-font-smoothing: antialiased; }

.card { --bs-card-bg: var(--bt-surface); --bs-card-border-color: var(--bt-border); }

/* Botón primario con el acento */
.btn-primary {
    --bs-btn-bg: var(--bt-accent);
    --bs-btn-border-color: var(--bt-accent);
    --bs-btn-hover-bg: var(--bt-accent-hover);
    --bs-btn-hover-border-color: var(--bt-accent-hover);
    --bs-btn-active-bg: var(--bt-accent-hover);
    --bs-btn-active-border-color: var(--bt-accent-hover);
    --bs-btn-disabled-bg: var(--bt-accent);
    --bs-btn-disabled-border-color: var(--bt-accent);
}
[data-bs-theme="dark"] .btn-primary { --bs-btn-color: #042f2e; --bs-btn-hover-color: #042f2e; --bs-btn-active-color: #042f2e; }

.btn-outline-primary {
    --bs-btn-color: var(--bt-accent);
    --bs-btn-border-color: var(--bt-accent);
    --bs-btn-hover-bg: var(--bt-accent);
    --bs-btn-hover-border-color: var(--bt-accent);
    --bs-btn-active-bg: var(--bt-accent-hover);
    --bs-btn-active-border-color: var(--bt-accent-hover);
}
[data-bs-theme="dark"] .btn-outline-primary { --bs-btn-hover-color: #042f2e; --bs-btn-active-color: #042f2e; }

.form-control:focus, .form-select:focus, .form-check-input:focus {
    border-color: var(--bt-accent);
    box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .25);
}
.form-check-input:checked { background-color: var(--bt-accent); border-color: var(--bt-accent); }
.page-link { color: var(--bt-accent); }

/* Marca */
.bt-brand { font-weight: 800; letter-spacing: -.02em; }
.bt-brand span { color: var(--bt-accent); }
.bt-panel-tag { font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; opacity: .75; margin-left: .25rem; }

/* Encabezado público */
.bt-header { background: var(--bt-surface); }

/* Paneles (admin / vendedor): barra oscura para diferenciar de la vista pública */
.bt-panel-header { background: var(--bt-panel-header); }
.bt-panel-header .navbar-brand,
.bt-panel-header .nav-link { color: #e4e4e7; }
.bt-panel-header .nav-link:hover,
.bt-panel-header .nav-link.active { color: #ffffff; }
.bt-panel-header .nav-link.disabled { color: #71717a; }
.bt-panel-header .navbar-toggler { border-color: #52525b; }
.bt-panel-header .navbar-toggler-icon { filter: invert(1); }
.bt-panel-header .bt-brand span { color: #2dd4bf; }
.bt-panel-header--seller { background: #134e4a; }

/* Tarjetas de estadísticas */
.bt-stat { transition: border-color .15s ease; }
a.bt-stat:hover { border-color: var(--bt-accent); }
.bt-stat-value { font-size: 1.75rem; font-weight: 700; line-height: 1.1; color: var(--bs-body-color); }
.bt-stat-label { font-size: .85rem; color: var(--bs-secondary-color); }

/* Formularios */
.bt-auth-card { max-width: 440px; margin: 1rem auto 0; }
.bt-form-page { max-width: 820px; }
.bt-narrow { max-width: 560px; margin-left: auto; margin-right: auto; }

/* Portada */
.bt-chip {
    display: inline-block; padding: .4rem .9rem; border-radius: 999px;
    background: var(--bt-accent-soft); color: var(--bs-body-color); font-weight: 500; font-size: .9rem;
}

/* Interruptor de tema */
.bt-theme-toggle { text-decoration: none; }
.bt-theme-icon::before { content: "☾"; font-size: 1.1rem; }
[data-bs-theme="dark"] .bt-theme-icon::before { content: "☀"; }

/* Accesibilidad: foco visible siempre */
a:focus-visible, button:focus-visible { outline: 3px solid var(--bt-accent); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; animation: none !important; }
}

/* Productos del vendedor */
.bt-thumb { width: 64px; height: 48px; object-fit: cover; border-radius: .375rem; background: var(--bs-secondary-bg); }
.bt-thumb--empty { display: flex; align-items: center; justify-content: center; color: var(--bs-secondary-color); font-size: .8rem; }
.bt-photo { position: relative; aspect-ratio: 4 / 3; background: var(--bs-secondary-bg); border-top-left-radius: inherit; border-top-right-radius: inherit; overflow: hidden; }
.bt-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bt-photo__state { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: .875rem; }
.bt-photo__badge { position: absolute; top: .5rem; left: .5rem; }

/* Portal público */
.bt-search { max-width: 640px; }
.bt-category { transition: border-color .15s, transform .15s; }
.bt-category:hover { border-color: var(--bs-primary); transform: translateY(-2px); }
.bt-card { overflow: hidden; transition: box-shadow .15s; }
.bt-card:hover { box-shadow: 0 .5rem 1.25rem rgba(0, 0, 0, .08); }
.bt-card__media { position: relative; display: block; aspect-ratio: 4 / 3; background: var(--bs-secondary-bg); }
.bt-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bt-card__noimg { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--bs-secondary-color); font-size: .875rem; }
.bt-card__badge { position: absolute; top: .5rem; left: .5rem; }
.bt-price { font-weight: 700; font-size: 1.1rem; }
.bt-price--lg { font-size: 1.75rem; }
.bt-gallery__main { position: relative; aspect-ratio: 4 / 3; background: var(--bs-secondary-bg); border-radius: .5rem; overflow: hidden; }
.bt-gallery__main img { width: 100%; height: 100%; object-fit: contain; display: block; }
.bt-gallery__thumbs { display: flex; gap: .5rem; overflow-x: auto; margin-top: .5rem; padding-bottom: .25rem; }
.bt-gallery__thumb { flex: 0 0 auto; width: 88px; aspect-ratio: 4 / 3; padding: 0; border: 2px solid transparent; border-radius: .375rem; overflow: hidden; background: var(--bs-secondary-bg); }
.bt-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bt-gallery__thumb.is-active, .bt-gallery__thumb:focus-visible { border-color: var(--bs-primary); }
.bt-whatsapp { display: flex; align-items: center; justify-content: center; gap: .5rem; background: #1fa855; border-color: #1fa855; }
.bt-whatsapp:hover { background: #178a45; border-color: #178a45; }
.bt-specs th { font-weight: 400; color: var(--bs-secondary-color); width: 45%; }
.bt-description { overflow-wrap: anywhere; }
/* Ficha: en móvil foto → precio/WhatsApp → descripción; en escritorio dos columnas */
.bt-detail { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr); grid-template-areas: "gallery" "info" "desc"; }
.bt-detail__gallery { grid-area: gallery; }
.bt-detail__info { grid-area: info; }
.bt-detail__desc { grid-area: desc; }
@media (min-width: 992px) {
    .bt-detail { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-areas: "gallery info" "desc info"; grid-template-rows: auto 1fr; align-items: start; }
    .bt-detail__info { align-self: stretch; }
    .bt-sticky { position: sticky; top: 1rem; }
}
.bt-card__badge { box-shadow: 0 0 0 2px rgba(255, 255, 255, .85); }
/* La barra usa .navbar.container: recupera el margen lateral del contenedor en móvil */
.navbar.container { padding-left: .75rem; padding-right: .75rem; }

/* Páginas legales */
.bt-legal { max-width: 52rem; }
.bt-legal h2 { font-size: 1.15rem; margin-top: 2rem; }
.bt-legal h3 { margin-top: 1rem; }
.bt-pending { background: #fef08a; color: #713f12; padding: 0 .25rem; border-radius: .25rem; }

/* Estadísticas del administrador */
.bt-chart__svg { width: 100%; height: auto; display: block; }
.bt-chart__grid { stroke: var(--bs-border-color); stroke-width: 1; }
.bt-chart__tick { fill: var(--bs-secondary-color); font-size: 11px; }
.bt-chart__bar { fill: var(--bt-accent); }
.bt-chart--views .bt-chart__bar { fill: #64748b; }
.bt-chart__bar:hover { opacity: .75; }
.bt-hbar { appearance: none; -webkit-appearance: none; width: 100%; height: .5rem; border: 0; border-radius: 1rem; overflow: hidden; background: var(--bs-secondary-bg); display: block; }
.bt-hbar::-webkit-progress-bar { background: var(--bs-secondary-bg); border-radius: 1rem; }
.bt-hbar::-webkit-progress-value { background: var(--bt-accent); border-radius: 1rem; }
.bt-hbar::-moz-progress-bar { background: var(--bt-accent); border-radius: 1rem; }
.bt-audit-details code { white-space: pre-wrap; word-break: break-word; color: inherit; font-size: .75rem; }
.bt-col-thumb { width: 72px; }

/* Aviso de cookies */
.bt-cookie { position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 1080; max-width: 34rem; margin-left: auto; box-shadow: 0 .75rem 2rem rgba(0, 0, 0, .18); }
