/* =============================================
   BestPixelRepair.com — Custom Theme CSS
   Child theme of Classic (PrestaShop 1.7)
   ============================================= */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700&family=DM+Sans:wght@400;500&display=swap');

:root {
  --dark:    #0d0f12;
  --dark2:   #161a20;
  --dark3:   #1e242c;
  --accent:  #e8531a;
  --accent2: #ff7a45;
  --gold:    #c8a94a;
  --light:   #f4f1eb;
  --muted:   #8a9099;
  --border:  rgba(255,255,255,0.08);
}

/* =====================
   GLOBAL
   ===================== */
*, *::before, *::after { box-sizing: border-box; }

body {
  background: var(--dark) !important;
  color: var(--light) !important;
  font-family: 'DM Sans', sans-serif !important;
}

/* Kill white backgrounds everywhere */
body, #header, #wrapper, #main, main,
#content-wrapper, #left-column, #right-column,
#footer, .container, .row,
section, article, aside, div {
  background-color: transparent;
}

/* Re-apply dark to the page root */
body { background-color: var(--dark) !important; }

a { color: var(--light); transition: color 0.2s; }
a:hover { color: var(--accent); text-decoration: none; }

h1, h2, h3, h4, h5, h6 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  color: var(--light) !important;
}

/* =====================
   HEADER
   ===================== */
#header {
  background: var(--dark) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: none !important;
}

.header-nav {
  background: var(--dark) !important;
  border-bottom: 1px solid var(--border) !important;
  color: var(--muted) !important;
  min-height: 40px;
}

.header-nav a { color: var(--muted) !important; font-size: 13px !important; }
.header-nav a:hover { color: var(--light) !important; }

.header-top {
  background: var(--dark) !important;
}

/* Nav menu */
.top-menu > li > a {
  color: var(--muted) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}
.top-menu > li > a:hover { color: var(--light) !important; background: transparent !important; }

/* Dropdowns */
.top-menu .sub-menu, .popover {
  background: var(--dark2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
}
.top-menu .sub-menu a { color: var(--muted) !important; }
.top-menu .sub-menu a:hover { color: var(--light) !important; background: var(--dark3) !important; }

/* Cart */
.blockcart a { color: var(--muted) !important; }
.blockcart .cart-products-count { background: var(--accent) !important; color: #fff !important; }

/* Search */
.search-widget input, #search_widget input {
  background: var(--dark3) !important;
  border: 1px solid var(--border) !important;
  color: var(--light) !important;
  border-radius: 6px !important;
}
.search-widget input::placeholder, #search_widget input::placeholder { color: var(--muted) !important; }
.search-widget button { background: transparent !important; color: var(--muted) !important; border: none !important; }

/* =====================
   BREADCRUMB
   ===================== */
.breadcrumb {
  background: transparent !important;
  border-bottom: 1px solid var(--border) !important;
  padding: 10px 0 !important;
  margin-bottom: 24px !important;
  border-radius: 0 !important;
}
.breadcrumb a, .breadcrumb li, .breadcrumb span { color: var(--muted) !important; font-size: 12px !important; text-transform: uppercase !important; letter-spacing: 0.05em !important; }
.breadcrumb .current span { color: var(--accent) !important; }

/* =====================
   PRODUCT CARDS — full override
   ===================== */
.products-section-title, h2.products-section-title {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 36px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: var(--light) !important;
  border-bottom: 2px solid var(--accent) !important;
  padding-bottom: 12px !important;
  margin-bottom: 28px !important;
}

/* The article */
article.product-miniature {
  background: var(--dark2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  transition: border-color 0.2s, transform 0.2s !important;
}
article.product-miniature:hover {
  border-color: rgba(232,83,26,0.5) !important;
  transform: translateY(-3px) !important;
}

/* Every div inside the card */
article.product-miniature .card,
article.product-miniature .card-body,
article.product-miniature .card-footer,
article.product-miniature .card-img-top,
article.product-miniature .highlighted-informations,
article.product-miniature > div,
article.product-miniature .card > * {
  background: var(--dark2) !important;
  background-color: var(--dark2) !important;
  border-color: var(--border) !important;
}

article.product-miniature .highlighted-informations {
  background: var(--dark3) !important;
  background-color: var(--dark3) !important;
  border-top: 1px solid var(--border) !important;
}

article.product-miniature .product-title a {
  color: var(--light) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

article.product-miniature .price {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  color: var(--accent) !important;
}

article.product-miniature .product-thumbnail img { transition: transform 0.3s !important; }
article.product-miniature:hover .product-thumbnail img { transform: scale(1.04) !important; }

article.product-miniature .wishlist-button-add {
  background: rgba(13,15,18,0.75) !important;
  border-radius: 50% !important;
  color: var(--muted) !important;
}

/* =====================
   CATEGORY PAGE
   ===================== */
/* Left sidebar */
#left-column .block,
#search_filters,
#search_filters_wrapper,
.block-categories {
  background: var(--dark2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  padding: 16px !important;
  margin-bottom: 16px !important;
}

#left-column a, .block-categories a { color: var(--muted) !important; font-size: 13px !important; }
#left-column a:hover, .block-categories a:hover { color: var(--accent) !important; }

.facet .facet-title, .facet-label { color: var(--light) !important; font-size: 13px !important; }
.custom-checkbox input + span { background: var(--dark3) !important; border: 1px solid var(--border) !important; border-radius: 3px !important; }

/* Category header */
.page-header, #js-product-list-header,
#category-description, .category-cover {
  background: var(--dark2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  padding: 24px !important;
  margin-bottom: 20px !important;
}

#category-description p, .category-description { color: var(--muted) !important; }

/* Subcategories */
.subcategories, #subcategories {
  background: var(--dark2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  padding: 20px !important;
  margin-bottom: 20px !important;
}

.subcategories h2, #subcategories h2 { color: var(--muted) !important; font-size: 12px !important; letter-spacing: 0.14em !important; }
.subcategory-image { background: var(--dark3) !important; border: 1px solid var(--border) !important; border-radius: 4px !important; min-height: 60px !important; }
.subcategory-name { color: var(--muted) !important; font-size: 12px !important; text-transform: uppercase !important; letter-spacing: 0.05em !important; }

/* Sort / count bar */
.products-sort-order .select-title { color: var(--muted) !important; }
#js-product-list-top p { color: var(--muted) !important; font-size: 13px !important; }

/* Pagination */
.pagination .page-link { background: var(--dark2) !important; border-color: var(--border) !important; color: var(--muted) !important; border-radius: 4px !important; }
.pagination .page-item.active .page-link, .pagination .page-link:hover { background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important; }

/* =====================
   PRODUCT DETAIL PAGE
   ===================== */
.product-cover img { border-radius: 8px !important; border: 1px solid var(--border) !important; }

.product-images li.thumb-container .thumb {
  border: 1px solid var(--border) !important;
  border-radius: 4px !important;
  opacity: 0.7;
  transition: opacity 0.2s, border-color 0.2s !important;
}
.product-images li.thumb-container .thumb:hover,
.product-images li.thumb-container .thumb.selected { opacity: 1 !important; border-color: var(--accent) !important; }

.product-prices .current-price, .product-prices .price {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 40px !important;
  font-weight: 700 !important;
  color: var(--accent) !important;
}

#product-description-short, .product-description { color: var(--muted) !important; font-size: 15px !important; line-height: 1.7 !important; }

/* Qty */
#quantity_wanted, .bootstrap-touchspin input {
  background: var(--dark3) !important;
  border: 1px solid var(--border) !important;
  color: var(--light) !important;
  border-radius: 6px !important;
  text-align: center !important;
}
.bootstrap-touchspin .btn-touchspin { background: var(--dark3) !important; border: 1px solid var(--border) !important; color: var(--muted) !important; }
.bootstrap-touchspin .btn-touchspin:hover { background: var(--accent) !important; color: #fff !important; }

/* Add to cart button */
.add-to-cart {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  padding: 12px 28px !important;
  border-radius: 6px !important;
  transition: background 0.2s !important;
}
.add-to-cart:hover { background: var(--accent2) !important; border-color: var(--accent2) !important; }

/* Wishlist */
.wishlist-button-add { background: var(--dark3) !important; border: 1px solid var(--border) !important; color: var(--muted) !important; border-radius: 50% !important; }
.wishlist-button-add:hover { color: var(--accent) !important; }

/* Social share */
.social-sharing a {
  background: var(--dark3) !important;
  border: 1px solid var(--border) !important;
  border-radius: 50% !important;
  color: var(--muted) !important;
  transition: background 0.2s !important;
}
.social-sharing a:hover { background: var(--accent) !important; color: #fff !important; border-color: var(--accent) !important; }

/* Product tabs */
.tabs { background: var(--dark2) !important; border: 1px solid var(--border) !important; border-radius: 8px !important; overflow: hidden !important; }
.tabs .nav-tabs { border-bottom: 1px solid var(--border) !important; background: var(--dark2) !important; }
.tabs .nav-tabs .nav-link { color: var(--muted) !important; background: transparent !important; border: none !important; border-bottom: 2px solid transparent !important; font-family: 'Barlow Condensed', sans-serif !important; font-size: 14px !important; font-weight: 600 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; padding: 12px 20px !important; }
.tabs .nav-tabs .nav-link.active, .tabs .nav-tabs .nav-link:hover { color: var(--light) !important; border-bottom-color: var(--accent) !important; }
.tabs .tab-pane { background: var(--dark2) !important; color: var(--muted) !important; padding: 20px !important; font-size: 14px !important; line-height: 1.75 !important; }
.tabs .tab-pane *, #product-description * { color: var(--muted) !important; }
.tabs .tab-pane strong, #product-description strong { color: var(--light) !important; }

/* Policy reassurance */
.product-reassurance { color: var(--muted) !important; font-size: 13px !important; }
.product-reassurance a { color: var(--muted) !important; }

/* Reviews / comments section */
#product-comments-list,
#product-comments-list-footer,
.product-comment,
#comment-form,
#post-product-comment-form,
section#product-comments,
.comments-nb {
  background: var(--dark2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  color: var(--muted) !important;
  padding: 16px !important;
  margin-top: 12px !important;
}

.product-comment { border-bottom: 1px solid var(--border) !important; }
#product-comments-list .no-comments, .no-comments { color: var(--muted) !important; text-align: center !important; padding: 24px !important; }

/* Related products section */
.product-accessories .products-section-title,
section.featured-products .products-section-title {
  color: var(--light) !important;
}

/* =====================
   FORMS & INPUTS
   ===================== */
input, select, textarea {
  background: var(--dark3) !important;
  border: 1px solid var(--border) !important;
  color: var(--light) !important;
  border-radius: 6px !important;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px rgba(232,83,26,0.15) !important;
  outline: none !important;
}
label { color: var(--muted) !important; font-size: 13px !important; }

/* =====================
   BUTTONS
   ===================== */
.btn-primary { background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important; border-radius: 6px !important; font-weight: 500 !important; transition: background 0.2s !important; }
.btn-primary:hover, .btn-primary:focus { background: var(--accent2) !important; border-color: var(--accent2) !important; color: #fff !important; }
.btn-secondary { background: transparent !important; border: 1px solid var(--border) !important; color: var(--light) !important; border-radius: 6px !important; }
.btn-secondary:hover { background: var(--dark3) !important; color: var(--light) !important; }

/* =====================
   NEWSLETTER
   ===================== */
.block_newsletter { background: var(--dark2) !important; border: 1px solid var(--border) !important; border-radius: 8px !important; padding: 24px !important; }
.block_newsletter .h2, .block_newsletter h2, .block_newsletter p { color: var(--light) !important; }
.block_newsletter form p { color: var(--muted) !important; font-size: 12px !important; }
.block_newsletter input[type="email"] { background: var(--dark3) !important; border: 1px solid var(--border) !important; color: var(--light) !important; border-radius: 6px 0 0 6px !important; }
.block_newsletter .btn { background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important; border-radius: 0 6px 6px 0 !important; }

/* =====================
   FOOTER
   ===================== */
#footer { background: var(--dark2) !important; border-top: 1px solid var(--border) !important; }
.footer-container { background: var(--dark2) !important; }

#footer .links .h3, #footer .links h3, #footer .block-contact .h3 {
  color: var(--muted) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  border-bottom: 1px solid var(--border) !important;
  padding-bottom: 10px !important;
  margin-bottom: 12px !important;
}

#footer .links li a { color: rgba(255,255,255,0.4) !important; font-size: 13px !important; }
#footer .links li a:hover { color: var(--light) !important; }
#footer .block-contact { color: var(--muted) !important; font-size: 13px !important; }

#footer .footer-container ~ div,
.footer-bottom-line {
  background: var(--dark) !important;
  color: rgba(255,255,255,0.2) !important;
  font-size: 12px !important;
  border-top: 1px solid var(--border) !important;
  text-align: center !important;
  padding: 16px 0 !important;
}

/* =====================
   MOBILE
   ===================== */
@media (max-width: 768px) {
  #mobile_top_menu_wrapper, .mobile-menu { background: var(--dark2) !important; }
}

/* =====================
   SCROLLBAR
   ===================== */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--dark); }
::-webkit-scrollbar-thumb { background: var(--dark3); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--accent); }

/* === BRUTE FORCE — catch all remaining white boxes === */

/* Every element that could have a white bg */
.card, .card-body, .card-footer, .card-header,
.card-block, .panel, .panel-body, .panel-default,
.well, .jumbotron,
[class*="block-"], [id*="product-comment"],
#product-comments, #product-comments-list,
#post-product-comment, .product-comment-list,
.product-comment-list-item, .comment-infos,
.grade-stars, #product-comments-list-footer,
#product-comments-list-header,
.no-comments, .alert.alert-warning {
  background: var(--dark2) !important;
  background-color: var(--dark2) !important;
  color: var(--muted) !important;
  border-color: var(--border) !important;
}

/* White text on dark bg */
.no-comments, .alert-warning {
  color: var(--muted) !important;
}

/* Related products card body */
.products article.product-miniature .card,
.products article.product-miniature .card-body,
.products article.product-miniature .card-footer,
.product-accessories article.product-miniature .card,
.product-accessories article.product-miniature .card-body {
  background: var(--dark2) !important;
  background-color: var(--dark2) !important;
}

/* === PRECISE FIXES from inspector === */

/* Reviews white box — productcomments.css:332 */
.product-comment-list-item {
  background-color: var(--dark2) !important;
  color: var(--muted) !important;
}

#empty-product-comment {
  background-color: var(--dark2) !important;
  color: var(--muted) !important;
}

#product-comments-list,
#product-comments-list > div,
#product-comments-list-footer,
#post-product-comment-form {
  background-color: var(--dark2) !important;
}

/* Related product cards — white card-body strip */
.product-accessories .card,
.product-accessories .card-body,
.product-accessories .card-footer,
.featured-products .card,
.featured-products .card-body,
.featured-products .card-footer {
  background-color: var(--dark2) !important;
}

/* === PRECISE FIX — from inspector === */

/* Price text color override from theme.css:72 */
.product-miniature .product-price-and-shipping {
  color: var(--accent) !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}

/* thumbnail-container.reviews-loaded — the white bg wrapper */
.thumbnail-container,
.thumbnail-container.reviews-loaded,
article.product-miniature .thumbnail-container {
  background: var(--dark2) !important;
  background-color: var(--dark2) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

/* Every child inside thumbnail-container */
.thumbnail-container .thumbnail-top,
.thumbnail-container .product-description,
.thumbnail-container .product-price-and-shipping,
.thumbnail-container .product-list-reviews,
.thumbnail-container .product-flags,
.thumbnail-container > div {
  background: var(--dark2) !important;
  background-color: var(--dark2) !important;
}

/* === FIX — Cart button in header === */
.blockcart,
.blockcart a,
#_desktop_cart,
#_desktop_cart .blockcart,
#_desktop_cart .blockcart a,
.cart-preview,
.header-nav .blockcart {
  background: var(--dark3) !important;
  background-color: var(--dark3) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
  color: var(--light) !important;
}

#_desktop_cart .blockcart:hover,
.blockcart a:hover {
  background: var(--dark2) !important;
  border-color: rgba(255,255,255,0.15) !important;
}

.blockcart .cart-products-count {
  background: var(--accent) !important;
  color: #fff !important;
}

/* === FIX — Cart button double border === */
.blockcart,
.blockcart a,
#_desktop_cart,
#_desktop_cart .blockcart,
#_desktop_cart .blockcart a,
.cart-preview {
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
}

/* Only the outermost cart wrapper gets the styled box */
#_desktop_cart {
  background: var(--dark3) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
  padding: 4px 10px !important;
}

#_desktop_cart:hover {
  border-color: rgba(255,255,255,0.2) !important;
}

/* === FIX — Cart button, match Sign In style === */
#_desktop_cart,
#_desktop_cart .blockcart,
#_desktop_cart .blockcart a,
.blockcart, .blockcart a {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  color: var(--muted) !important;
  font-size: 13px !important;
}

#_desktop_cart:hover,
.blockcart a:hover {
  color: var(--light) !important;
}

.blockcart .cart-products-count {
  background: var(--accent) !important;
  color: #fff !important;
  border-radius: 50% !important;
  font-size: 11px !important;
  padding: 1px 5px !important;
}

/* === FIX — Cart vertical alignment === */
#_desktop_cart {
  display: flex !important;
  align-items: center !important;
}

#_desktop_cart .blockcart,
#_desktop_cart .blockcart a {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  line-height: 1 !important;
}

.blockcart .cart-products-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  height: 20px !important;
  background: var(--accent) !important;
  color: #fff !important;
  border-radius: 50% !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

/* === FIX — Cart page text visibility === */

/* Cart main area */
#cart .cart-overview,
.cart-detailed-actions,
#js-checkout-summary,
.cart-summary,
.cart-detailed {
  background: var(--dark2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
}

/* Product name in cart */
.cart-item .product-name,
.cart-item a,
#cart .product-line-info a,
#cart .product-line-info .label,
#cart .product-line-info .value {
  color: var(--light) !important;
  font-size: 14px !important;
}

/* Cart item details */
.cart-item,
.cart-detailed-totals .cart-summary-line,
.cart-detailed-totals span,
.cart-detailed-totals .label,
.cart-detailed-totals .value {
  color: var(--light) !important;
}

/* Prices in cart */
.cart-item .price,
.cart-item .current-price,
.product-price,
#cart .product-price {
  color: var(--accent) !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
}

/* Cart summary totals */
.cart-summary-line .label,
.cart-summary-line .value,
.cart-total .label,
.cart-total .value {
  color: var(--light) !important;
}

.cart-total .value {
  color: var(--accent) !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}

/* Subtotals and tax lines */
.cart-summary-subtotals .label,
.cart-summary-subtotals .value {
  color: var(--muted) !important;
  font-size: 13px !important;
}

/* Divider line */
.cart-detailed-totals hr,
.cart-summary hr {
  border-color: var(--border) !important;
}

/* Promo code text */
.cart-voucher,
.cart-voucher .cart-summary-line,
#cart-voucher-apply {
  color: var(--muted) !important;
}

/* Continue shopping link */
.cart-overview .continue,
#cart a.continue {
  color: var(--muted) !important;
  font-size: 13px !important;
}

.cart-overview .continue:hover { color: var(--light) !important; }

/* Checkout button */
.cart-detailed-actions .btn-primary,
#cart .checkout a {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  padding: 14px 28px !important;
  border-radius: 6px !important;
  width: 100% !important;
  text-align: center !important;
}

.cart-detailed-actions .btn-primary:hover { background: var(--accent2) !important; }

/* === FIX — Homepage custom text/CMS block white background === */
#custom-html-1,
#custom-html-2,
[id^="custom-html-"],
.custom-html,
.blockcmstext,
#index .page-content,
.cms-block,
.block-cms-custom,
#main .rte,
.rte,
#main section > div > div,
#content .container > div,
#index #content > div,
#index section {
  background: var(--dark2) !important;
  background-color: var(--dark2) !important;
  color: var(--muted) !important;
  border-radius: 8px !important;
}

/* Text inside */
#custom-html-1 *,
#custom-html-2 *,
[id^="custom-html-"] *,
.rte * {
  color: var(--muted) !important;
  background: transparent !important;
}

.rte strong, [id^="custom-html-"] strong { color: var(--light) !important; }

/* === FIX — #wrapper background from theme.css:72 === */
#wrapper {
  background: var(--dark) !important;
  background-color: var(--dark) !important;
}

/* === FIX — Homepage content text visibility === */
#wrapper .rte,
#wrapper [id^="custom-html-"],
#wrapper .custom-html,
#wrapper section p,
#wrapper section li,
#wrapper section ul,
#wrapper section div {
  color: #b0b8c4 !important;
}

#wrapper section h1,
#wrapper section h2,
#wrapper section h3,
#wrapper section strong {
  color: var(--light) !important;
}