/* ==========================================================================
   BLACKCRATE WHOLESALE — Thème enfant PrestaShop (base : Classic)
   Identité industrielle / tactique — acier anthracite + orange sécurité
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@500;600;700&family=Share+Tech+Mono&display=swap');

:root {
    --bc-bg: #17191b;
    --bc-bg-alt: #1f2224;
    --bc-bg-panel: #26292c;
    --bc-border: #383c40;
    --bc-border-soft: #4a4f54;
    --bc-orange: #e8541c;
    --bc-orange-dim: #b5410f;
    --bc-steel: #8a9099;
    --bc-text: #e9e9e6;
    --bc-text-dim: #a3a8ad;
    --bc-text-faint: #6b7075;
    --bc-font-display: 'Rajdhani', sans-serif;
    --bc-font-mono: 'Share Tech Mono', monospace;
}

/* ==========================================================================
   BASE
   ========================================================================== */

body {
    background: var(--bc-bg) !important;
    color: var(--bc-text) !important;
    font-family: var(--bc-font-display) !important;
    font-size: 16px;
    font-weight: 500;
}

h1, h2, h3, h4, h5,
.h1, .h2, .h3 {
    font-family: var(--bc-font-display) !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--bc-text) !important;
}

a { color: var(--bc-orange); }
a:hover, a:focus { color: var(--bc-orange); opacity: 0.85; }

p, span, div, label, li { color: var(--bc-text-dim); }

/* ==========================================================================
   HEADER
   ========================================================================== */

#header,
.header-top,
#header .header-nav {
    background: var(--bc-bg-alt) !important;
    border-bottom: 1px solid var(--bc-border);
}

#header .header-nav { border-bottom: 3px solid var(--bc-orange); }

#_desktop_logo img,
.logo { max-height: 48px; }

#header .position-static,
#header .container {
    background: transparent;
}

#search_widget input,
#search_widget .ui-autocomplete-input {
    background: var(--bc-bg-panel) !important;
    border: 1px solid var(--bc-border) !important;
    color: var(--bc-text) !important;
    font-family: var(--bc-font-mono);
}

#_desktop_user_info a,
#_desktop_cart a,
.user-info a,
.blockcart a {
    color: var(--bc-text) !important;
    font-family: var(--bc-font-mono);
    font-size: 13px;
}

.blockcart .header-cart .cart-products-count {
    background: var(--bc-orange) !important;
    color: var(--bc-bg) !important;
}

#header .top-menu a,
.menu > li > a {
    color: var(--bc-text) !important;
    font-family: var(--bc-font-display) !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 14px;
}

#header .top-menu a:hover,
.menu > li > a:hover { color: var(--bc-orange) !important; }

/* ==========================================================================
   BOUTONS
   ========================================================================== */

.btn, button, .btn-primary,
a.btn-primary,
#header button {
    background: var(--bc-orange) !important;
    border: 2px solid var(--bc-orange) !important;
    color: var(--bc-bg) !important;
    font-family: var(--bc-font-display) !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 2px !important;
    transition: background 0.2s ease, border-color 0.2s ease;
}

.btn:hover, button:hover, .btn-primary:hover, a.btn-primary:hover {
    background: var(--bc-orange-dim) !important;
    border-color: var(--bc-orange-dim) !important;
    color: #fff !important;
}

.btn-secondary, .btn-outline-secondary {
    background: transparent !important;
    border: 1px solid var(--bc-border-soft) !important;
    color: var(--bc-text) !important;
}

/* ==========================================================================
   PAGE D'ACCUEIL — sections, blocs
   ========================================================================== */

#wrapper, #content, .page-content {
    background: var(--bc-bg) !important;
}

.container, .container-fluid { background: transparent; }

#content h1, #content h2, .page-content h2,
h1.h1, .h1.page-title {
    color: var(--bc-orange) !important;
    border-bottom: 2px solid var(--bc-border);
    padding-bottom: 12px;
    margin-bottom: 24px;
}

.highlighted-informations,
.featured-products,
.product-accessories {
    background: var(--bc-bg-alt) !important;
    padding: 30px;
    border: 1px solid var(--bc-border);
}

/* ==========================================================================
   GRILLE PRODUITS
   ========================================================================== */

.product-miniature,
.js-product-miniature {
    background: var(--bc-bg-panel) !important;
    border: 1px solid var(--bc-border) !important;
    transition: border-color 0.2s ease, transform 0.2s ease;
}

.product-miniature:hover {
    border-color: var(--bc-orange) !important;
    transform: translateY(-3px);
}

.thumbnail-container {
    background: var(--bc-bg-alt) !important;
}

.product-title, .product-title a {
    color: var(--bc-text) !important;
    font-family: var(--bc-font-display) !important;
    font-weight: 700 !important;
    text-transform: none;
}

.product-title a:hover { color: var(--bc-orange) !important; }

.product-price-and-shipping .price,
.product-price,
span.price {
    color: var(--bc-orange) !important;
    font-family: var(--bc-font-mono) !important;
    font-weight: 700 !important;
}

.regular-price {
    color: var(--bc-text-faint) !important;
}

.product-flags .product-flag {
    background: var(--bc-orange) !important;
    color: var(--bc-bg) !important;
    font-family: var(--bc-font-mono) !important;
    border-radius: 2px !important;
}

/* Filtres / facettes */
#search_filters,
.faceted-slider,
.facet {
    background: var(--bc-bg-alt) !important;
    border: 1px solid var(--bc-border) !important;
}

.facet-title, .facet .h6 {
    color: var(--bc-orange) !important;
    font-family: var(--bc-font-mono) !important;
    text-transform: uppercase;
    font-size: 12px;
}

/* ==========================================================================
   FICHE PRODUIT
   ========================================================================== */

.product-cover, #main img.js-qv-product-cover {
    background: var(--bc-bg-panel) !important;
    border: 1px solid var(--bc-border);
}

.product-information h1 {
    color: var(--bc-text) !important;
    border-bottom: none;
}

.product-prices .current-price span,
.current-price-value {
    color: var(--bc-orange) !important;
    font-family: var(--bc-font-mono) !important;
    font-size: 28px !important;
    font-weight: 700 !important;
}

.product-quantity input,
#quantity_wanted {
    background: var(--bc-bg-panel) !important;
    border: 1px solid var(--bc-border) !important;
    color: var(--bc-text) !important;
}

.product-add-to-cart .add-to-cart,
#add-to-cart-or-refresh button {
    background: var(--bc-orange) !important;
    border-color: var(--bc-orange) !important;
}

.product-information .data-sheet,
.product-features {
    background: var(--bc-bg-alt) !important;
    border: 1px solid var(--bc-border);
}

.data-sheet dt, .product-features dt {
    color: var(--bc-orange) !important;
    font-family: var(--bc-font-mono) !important;
    font-size: 12px;
    text-transform: uppercase;
}

.data-sheet dd, .product-features dd { color: var(--bc-text-dim) !important; }

.tabs .nav-link {
    color: var(--bc-text-dim) !important;
    font-family: var(--bc-font-display) !important;
    font-weight: 700 !important;
    text-transform: uppercase;
}
.tabs .nav-link.active {
    color: var(--bc-orange) !important;
    border-color: var(--bc-orange) !important;
}

/* ==========================================================================
   PANIER / CHECKOUT
   ========================================================================== */

#cart, .cart-grid, .checkout {
    background: transparent;
}

.cart-summary-products,
.cart-grid-body,
.cart-grid-right,
.card,
.card-block {
    background: var(--bc-bg-panel) !important;
    border: 1px solid var(--bc-border) !important;
}

.cart-summary-line, .cart-total {
    color: var(--bc-text) !important;
    border-color: var(--bc-border) !important;
}

.cart-total .value, .total-price {
    color: var(--bc-orange) !important;
    font-family: var(--bc-font-mono) !important;
}

.step-title, .card-header, h3.card-header {
    background: var(--bc-bg-alt) !important;
    color: var(--bc-orange) !important;
    font-family: var(--bc-font-display) !important;
    text-transform: uppercase;
    border-bottom: 1px solid var(--bc-border) !important;
}

.checkout-step input[type="text"],
.checkout-step input[type="email"],
.checkout-step input[type="password"],
.checkout-step select,
.checkout-step textarea,
#checkout input, #checkout select, #checkout textarea {
    background: var(--bc-bg) !important;
    border: 1px solid var(--bc-border) !important;
    color: var(--bc-text) !important;
}

.custom-radio, .custom-checkbox { color: var(--bc-text-dim); }

/* ==========================================================================
   FOOTER
   ========================================================================== */

#footer,
.footer-container {
    background: #0e0f10 !important;
    border-top: 3px solid var(--bc-orange);
    color: var(--bc-text-dim) !important;
}

#footer h3, #footer .h3 {
    color: var(--bc-orange) !important;
    font-family: var(--bc-font-mono) !important;
    text-transform: uppercase;
    font-size: 13px;
}

#footer a { color: var(--bc-text-dim) !important; }
#footer a:hover { color: var(--bc-orange) !important; }

/* ==========================================================================
   BREADCRUMB / DIVERS
   ========================================================================== */

.breadcrumb {
    background: transparent !important;
    font-family: var(--bc-font-mono);
    font-size: 12px;
}
.breadcrumb a { color: var(--bc-text-dim) !important; }

.alert-success, .alert-danger, .alert-info {
    border-radius: 2px;
    font-family: var(--bc-font-mono);
    font-size: 13px;
}

::selection { background: var(--bc-orange); color: #fff; }

/* ==========================================================================
   ÉLÉMENTS DE TEMPLATE SUR-MESURE (header/footer réécrits)
   ========================================================================== */

.bc-top-strip {
    background: var(--bc-orange);
}
.bc-top-strip .container {
    display: flex;
    justify-content: space-between;
    padding-top: 6px;
    padding-bottom: 6px;
}
.bc-top-strip .mono {
    color: var(--bc-bg) !important;
    font-size: 11px;
    letter-spacing: 0.05em;
}

.bc-footer-columns {
    background: #0e0f10;
    padding: 50px 0;
    border-bottom: 1px solid var(--bc-border);
}
.bc-footer-col h3 {
    color: var(--bc-orange) !important;
    font-size: 13px;
    margin-bottom: 16px;
}
.bc-footer-col p {
    color: var(--bc-text-faint) !important;
    font-size: 13px;
    line-height: 1.7;
}
.bc-footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}
.bc-footer-links li { margin-bottom: 10px; }
.bc-footer-links a {
    color: var(--bc-text-dim) !important;
    font-size: 14px;
}
.bc-footer-links a:hover { color: var(--bc-orange) !important; }

@media (max-width: 900px) {
    .bc-top-strip .container { flex-direction: column; gap: 4px; text-align: center; }
    .bc-footer-col { margin-bottom: 30px; }
}
