/* Thème BLIWE — surcouche Bootstrap 5.3 */
:root {
    --bs-primary: #0d6efd;
    --bs-primary-rgb: 13, 110, 253;
    --bs-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.brand-logo { height: 3rem; width: auto; }
.brand-logo-lg { height: 4.5rem; width: auto; }

/* Cartes */
.card { border: 0; box-shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 4px 16px rgba(0, 0, 0, .04); }
.card-header { background: transparent; border-bottom: 1px solid var(--bs-border-color); font-weight: 600; }

/* Sections de formulaire */
.form-section + .form-section { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--bs-border-color); }
.form-section-title { font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--bs-secondary-color); margin-bottom: 1rem; }

/* Aperçu d'images */
.img-preview {
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    border-radius: .5rem;
    border: 1px solid var(--bs-border-color);
    background: var(--bs-tertiary-bg);
}
.img-preview.is-portrait { aspect-ratio: 9 / 14; max-height: 260px; object-fit: contain; }

/* Lignes de cadeaux (product.html) */
.product-row { background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: .5rem; }
.product-row .product-thumb {
    width: 48px; height: 48px; object-fit: cover; border-radius: .375rem;
    border: 1px solid var(--bs-border-color); cursor: pointer; background: var(--bs-tertiary-bg);
}

/* Liste des roues */
.table-wheels td, .table-wheels th { vertical-align: middle; }
.table-wheels .wheel-name { font-weight: 600; }

/* Login */
.auth-wrapper { min-height: calc(100vh - 8rem); }
.auth-card { max-width: 420px; width: 100%; }

/* Générateur SVG */
#canvas { max-width: 100%; height: auto; border-radius: .5rem; }
.field_wrapper .svg-field + .svg-field { margin-top: .5rem; }
.svg-color { width: 3rem; height: 2.4rem; padding: .2rem; }

/* Champs obligatoires */
.form-label.required::after,
.form-check-label.required::after {
    content: " *";
    color: var(--bs-danger);
    font-weight: 700;
}

/* Navbar : liens en pilule, fond sur l'actif et au survol */
.navbar .nav-link {
    padding: .45rem .9rem;
    border-radius: .5rem;
    color: var(--bs-body-color);
}
.navbar .nav-link:hover { background: var(--bs-tertiary-bg); }
.navbar .nav-link.active {
    background: var(--bs-primary-bg-subtle);
    color: var(--bs-primary-text-emphasis);
    font-weight: 600;
}