/* =====================================================================
   MiMarketplace — Tema visual
   Carga después de Bootstrap 5.3 y aprovecha su soporte nativo de
   [data-bs-theme="dark"] en vez de duplicar cada componente a mano.
   ===================================================================== */

:root {
    --brand-primary: #FF6B35;
    --brand-primary-dark: #E5502A;
    --brand-primary-rgb: 255, 107, 53;
    --brand-secondary: #013A63;
    --brand-secondary-dark: #012A47;
    --brand-accent: #00B8A9;
    --brand-accent-rgb: 0, 184, 169;

    --brand-bg: #F7F7FB;
    --brand-surface: #FFFFFF;
    --brand-surface-alt: #F1F2F8;
    --brand-text: #1B2436;
    --brand-muted: #6B7280;
    --brand-border: rgba(27, 36, 54, 0.08);

    /* Reasigna las variables de Bootstrap a nuestra paleta: cualquier
       componente de Bootstrap (botones, links, focus rings) hereda la
       marca automáticamente sin tener que sobreescribirlo uno por uno. */
    --bs-primary: var(--brand-primary);
    --bs-primary-rgb: var(--brand-primary-rgb);
    --bs-link-color: var(--brand-primary);
    --bs-link-color-rgb: var(--brand-primary-rgb);
    --bs-link-hover-color: var(--brand-primary-dark);
    --bs-body-bg: var(--brand-bg);
    --bs-body-color: var(--brand-text);
    --bs-border-radius: .65rem;
    --bs-border-radius-sm: .5rem;
    --bs-border-radius-lg: 1rem;
}

[data-bs-theme="dark"] {
    --brand-bg: #10141F;
    --brand-surface: #1A2030;
    --brand-surface-alt: #212840;
    --brand-text: #E8EAF2;
    --brand-muted: #9AA4B8;
    --brand-border: rgba(255, 255, 255, 0.08);

    --bs-body-bg: var(--brand-bg);
    --bs-body-color: var(--brand-text);
}

/* Cobertura amplia de utilidades de Bootstrap usadas en todo el sitio,
   para que el modo oscuro se vea consistente sin reescribir cada vista
   una por una — ver el README para el alcance/límite de este enfoque. */
[data-bs-theme="dark"] .bg-white,
[data-bs-theme="dark"] .bg-light {
    background-color: var(--brand-surface) !important;
}
[data-bs-theme="dark"] .text-dark { color: var(--brand-text) !important; }
[data-bs-theme="dark"] .border { border-color: var(--brand-border) !important; }
[data-bs-theme="dark"] .table { color: var(--brand-text); }
[data-bs-theme="dark"] .card { background-color: var(--brand-surface); }
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
    background-color: var(--brand-surface-alt);
    color: var(--brand-text);
    border-color: var(--brand-border);
}
[data-bs-theme="dark"] .list-group-item {
    background-color: var(--brand-surface);
    color: var(--brand-text);
    border-color: var(--brand-border);
}

/* Tipografía */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    transition: background-color .2s ease, color .2s ease;
}
h1, h2, h3, h4, h5, h6, .navbar-brand, .fw-bold {
    font-family: 'Poppins', 'Inter', sans-serif;
}

/* Navbar de marca con degradado */
.navbar.brand-navbar {
    background: linear-gradient(120deg, var(--brand-secondary), var(--brand-secondary-dark)) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .12);
}
.navbar.brand-navbar .navbar-brand,
.navbar.brand-navbar .nav-link {
    color: rgba(255, 255, 255, .92) !important;
}
.navbar.brand-navbar .nav-link:hover {
    color: #fff !important;
}
.navbar.brand-navbar .form-control {
    border: none;
}

/* Hero de portada */
.hero-gradient {
    background: linear-gradient(120deg, var(--brand-primary) 0%, #FF8C61 55%, var(--brand-accent) 100%);
    color: #fff;
}
.hero-gradient .form-control {
    border: none;
}

/* Tarjetas con elevación sutil al pasar el mouse */
.card {
    border: none;
    box-shadow: 0 1px 3px rgba(16, 24, 40, .06), 0 1px 2px rgba(16, 24, 40, .04);
    transition: transform .15s ease, box-shadow .15s ease;
}
a .card:hover, .card.card-hover:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(16, 24, 40, .12);
}

/* Botones e insignias */
.btn-primary {
    background: var(--brand-primary);
    border-color: var(--brand-primary);
}
.btn-primary:hover, .btn-primary:focus {
    background: var(--brand-primary-dark);
    border-color: var(--brand-primary-dark);
}
.btn-outline-primary {
    color: var(--brand-primary);
    border-color: var(--brand-primary);
}
.btn-outline-primary:hover {
    background: var(--brand-primary);
    border-color: var(--brand-primary);
}
.badge.bg-warning {
    background: linear-gradient(120deg, #FFB800, #FF8A00) !important;
    color: #1B2436;
}

/* Botón flotante de modo oscuro / selector de idioma en el navbar */
.theme-toggle-btn {
    background: rgba(255, 255, 255, .12);
    border: none;
    color: #fff;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .15s ease;
}
.theme-toggle-btn:hover {
    background: rgba(255, 255, 255, .22);
}
[data-bs-theme="dark"] .theme-toggle-btn .bi-moon-stars { display: none; }
[data-bs-theme="light"] .theme-toggle-btn .bi-sun { display: none; }

.lang-switch .dropdown-menu {
    min-width: 9rem;
}

/* Placeholder de imagen y galería con esquinas redondeadas consistentes */
.card-img-top {
    border-top-left-radius: var(--bs-border-radius-lg);
    border-top-right-radius: var(--bs-border-radius-lg);
}
