/* Custom styles for achraf site */

/* Make all h1 headings visually thinner for a lighter, refined look */
h1 { font-weight: 300; letter-spacing: -0.01em; line-height: 1.08; }

/* Card styles */
.card { 
  --bs-border-radius: 0 !important; 
  border-radius: 0 !important; 
}
.card-body { 
  text-align: left !important; 
}

/* Navbar styles */
.navbar-brand img { height: 24px; width: auto; margin-right:8px; }
.navbar { min-height: 36px !important; height: auto !important; }
@media (max-width: 576px) {
  /* slightly smaller logo on narrow viewports */
  .navbar-brand img { height: 20px; }
}

/* Navbar cart icon uses brand color for better visual consistency */
body:not(.admin) .navbar .bi-cart, body:not(.admin) a[href$="cart.php"] .bi-cart {
  color: #2c302e; /* brand color */
  transition: color .12s ease;
}
body:not(.admin) .navbar .bi-cart:hover, body:not(.admin) a[href$="cart.php"]:hover .bi-cart {
  color: #474a48; /* hover shade */
}

/* Remove focus border for icon-only links and stretched links to prevent visible border on click */
.navbar .nav-link:focus, .nav-link:active, .nav .bi:focus, .quick-add-toggle:focus, .product-card-clickable .stretched-link:focus {
  box-shadow: none !important;
  outline: none !important;
}
body { background-color: #f5f4f2 !important; }

/* Make sure the parent container centers its children */
.navbar .nav-item.d-flex { align-items: center; }


/* Consistent site width variable */
:root { --site-max-width: 1100px; }

/* Reusable brand color utilities */
.brand-color { color: #2c302e !important; }
.brand-bg { background-color: #2c302e !important; color: #fff !important; }
.brand-border { border-color: #2c302e !important; }



/* Front-end Bootstrap variable overrides so primary buttons inherit site color */
body:not(.admin) {
  --bs-btn-bg: #2c302e;
  --bs-btn-border-color: #2c302e;
  --bs-btn-hover-bg: #474a48;
  --bs-btn-hover-border-color: #474a48;
  --bs-btn-focus-shadow-rgb: 71,74,72;
  --bs-link-color: #2c302e;
  --bs-link-hover-color: #474a48;
} 

/* Prevent layout shift when vertical scrollbar appears/disappears */
html {
  overflow-y: scroll;
  /* keep space for scrollbar to avoid layout shifts when it appears/disappears */
  scrollbar-gutter: stable both-edges;
}

/* Force consistent container width and centering across pages */
.container {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--site-max-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
}

/* Larger badge for totals for better visibility */
.badge-total {
  font-size: 1.05rem;
  padding: 0.45rem 0.75rem;
  border-radius: 0.5rem;
  font-weight: 600;
  line-height: 1;
}

/* Reports: make the main numbers slightly smaller than display-6 for better balance */
.report-number { font-size: 1.15rem; font-weight: 700; }

/* Summary rows for shipping & totals */
.summary-row th, .summary-row td {
  font-weight: 700;
  font-size: 1rem;
  background: rgba(0,0,0,0.03);
}
.summary-row.summary-shipping th, .summary-row.summary-shipping td { font-weight: 400; }
.summary-row.table-primary th, .summary-row.table-primary td {
  background: rgba(13,110,253,0.08);
}
.free-shipping-note {
  font-size: 0.85rem;
  color: #6c757d;
  font-weight: 400;
}
.free-shipping-note strong { font-weight: 700; }

/* Product cards tweaks */
.product-card .brand { font-size: 1.05rem; color: #343a40; font-weight: 700; margin-bottom: 0.15rem; text-transform: uppercase; letter-spacing: 0.02em; }
.product-card .card-title { font-size: 0.92rem; margin-top: 0; margin-bottom: 0.125rem; font-weight: 600; color: #6c757d; line-height: 1.12; text-transform: none; }
.product-card .product-strength { margin-top: 0; margin-bottom: 0.4rem; font-size: 0.78rem; color: #6c757d; letter-spacing: 0.02em; }
.product-card .badge { font-weight: 400; }
.product-card .badge.bg-success, .product-card .badge.bg-warning, .product-card .badge.bg-warning { font-size: 0.72rem; padding: 0.25rem 0.45rem; }
.product-card .price { font-size: 0.98rem; font-weight: 600; color: #343a40; }
.product-card .promo-price { font-size: 0.98rem; font-weight: 700; color: #dc3545; }

/* Product title */
.prod-title, .product-card .card-title { text-transform: none; letter-spacing: 0.02em; }

/* Make the product detail title larger and bold for stronger emphasis */
.product-page .prod-title { text-transform: none; letter-spacing: 0.025em; font-size: 1.45rem; font-weight: 700; margin-bottom: 0.35rem; }

/* Slightly larger titles in product cards/listings for improved readability */
.product-card .card-title { font-size: 1.02rem; font-weight: 700; }

.brand-name, .brand { font-size: 0.85rem; color: #343a40; font-weight: 400; margin-bottom: 0.15rem; text-transform: uppercase; letter-spacing: 0.02em; }
.product-strength { text-transform: uppercase; font-size: 0.78rem; color: #6c757d; letter-spacing: 0.02em; margin-top: 0; margin-bottom: 0.25rem; }
.product-strength .unit { text-transform: lowercase; font-weight: 400; margin-left: 0; }

/* Struck price */
.product-card .struck-price, .product-page .struck-price, .cart .struck-price, .checkout .struck-price { font-size: 0.86rem; font-weight: 400; color: #6c757d; }
.product-card .from-badge { display:inline-block; margin-bottom:0.35rem; font-size:0.78rem; color:#343a40; background:#f8f9fa; border:1px solid #dee2e6; padding:0.15rem 0.4rem; }
.brand-name { font-size: 0.95rem; color: #343a40; font-weight: 700; margin-bottom: 0.15rem; }

/* Product card images: fixed height and cover to keep consistent card sizes */
.card .card-img-top {
  height: 250px;
  width: 100%;
  object-fit: cover;
  display: block;
}

/* Framed print display on product page (matted + subtle shadow) */
.print-frame { max-width: 780px; padding: 18px; background: #fff; border: 1px solid #e9e9e6; box-shadow: 0 18px 40px rgba(28,31,30,0.12); }
.print-mat { background: #fff; padding: 34px; border: 1px solid #f1f1f0; display: block; }
.print-img { display: block; width: 100%; height: auto; object-fit: contain; }
.print-frame figcaption { color: #6c757d; margin-top: .5rem; }

/* Standardized page-hero styling used by About / Exhibitions / Awards / Press / Contact
   - fixed display area for hero images
   - consistent title/subtitle spacing and alignment
*/
/* apply identical hero presentation to all content pages that use the hero-row */
.about-page .hero-figure,
.exhibitions-page .hero-figure,
.awards-page .hero-figure,
.press-page .hero-figure,
.news-page .hero-figure,
.contact-page .hero-figure { max-width: 100%; padding: 0; background: transparent; box-shadow: none; border: none; }
.about-page .hero-figure .hero-img,
.exhibitions-page .hero-figure .hero-img,
.awards-page .hero-figure .hero-img,
.press-page .hero-figure .hero-img,
.news-page .hero-figure .hero-img,
.contact-page .hero-figure .hero-img { width: 100%; height: 320px; object-fit: cover; display: block; border-radius: 6px; }
/* enforce identical hero title/subtitle sizing across content pages (About/Exhibitions/Awards/Press/News/Contact) */
main.about-page h1.display-5, .about-page h1.display-5,
main.about-page h1.display-4, .about-page h1.display-4,
.news-page h1.display-4, .news-page h1.display-5,
.press-page h1.display-4, .exhibitions-page h1.display-4, .awards-page h1.display-4, .contact-page h1.display-4 { font-size: 2.1rem; line-height: 1.1; margin-bottom: 0.35rem; }
main.about-page p.lead, .about-page p.lead, .news-page p.lead, .press-page p.lead, .exhibitions-page p.lead, .awards-page p.lead, .contact-page p.lead { font-size: 1.05rem; margin-bottom: 0.5rem; }
/* More specific left-column overrides to guarantee pixel parity for hero text across content pages */
.about-page .row > .col-md-7 h1.display-5, .about-page .row > .col-md-7 h1.display-4,
.news-page .row > .col-md-7 h1.display-4, .press-page .row > .col-md-7 h1.display-4,
.exhibitions-page .row > .col-md-7 h1.display-4, .awards-page .row > .col-md-7 h1.display-4,
.contact-page .row > .col-md-7 h1.display-4 { font-size: 2.1rem !important; line-height: 1.1 !important; margin: 0 0 0.35rem !important; padding-top: 0 !important; text-transform: uppercase !important; letter-spacing: 0.02em !important; }
.about-page .row > .col-md-7 p.lead, .news-page .row > .col-md-7 p.lead, .press-page .row > .col-md-7 p.lead { font-size: 1.05rem !important; margin-bottom: 0.5rem !important; }

/* Force hero-row top alignment even when Bootstrap utility is present */
.about-page .hero-row.align-items-center, .news-page .hero-row.align-items-center, .awards-page .hero-row.align-items-center, .press-page .hero-row.align-items-center, .exhibitions-page .hero-row.align-items-center, .contact-page .hero-row.align-items-center { align-items: flex-start !important; }
.about-page .row > .col-md-7 .about-content, .news-page .row > .col-md-7 .about-content, .press-page .row > .col-md-7 .about-content { font-size: 1rem !important; color: #6c757d !important; }

/* Ensure hero columns have consistent widths across content pages that use the hero */
.about-page .hero-row,
.exhibitions-page .hero-row,
.awards-page .hero-row,
.press-page .hero-row,
.news-page .hero-row,
.contact-page .hero-row { align-items: flex-start !important; }
.about-page .hero-row > .col-md-7,
.exhibitions-page .hero-row > .col-md-7,
.awards-page .hero-row > .col-md-7,
.press-page .hero-row > .col-md-7,
.news-page .hero-row > .col-md-7,
.contact-page .hero-row > .col-md-7 { flex: 0 0 58.333333% !important; max-width: 58.333333% !important; display: flex; flex-direction: column; justify-content: flex-start; }
.about-page .hero-row > .col-md-5,
.exhibitions-page .hero-row > .col-md-5,
.awards-page .hero-row > .col-md-5,
.press-page .hero-row > .col-md-5,
.news-page .hero-row > .col-md-5,
.contact-page .hero-row > .col-md-5 { flex: 0 0 41.666667% !important; max-width: 41.666667% !important; }

/* Extra vertical spacing after the hero on the homepage */
.hero-block { margin-bottom: 5rem !important; }
@media (max-width: 767.98px) {
  .about-page .hero-row > .col-md-7, .about-page .hero-row > .col-md-5,
  .exhibitions-page .hero-row > .col-md-7, .exhibitions-page .hero-row > .col-md-5,
  .awards-page .hero-row > .col-md-7, .awards-page .hero-row > .col-md-5,
  .press-page .hero-row > .col-md-7, .press-page .hero-row > .col-md-5,
  .news-page .hero-row > .col-md-7, .news-page .hero-row > .col-md-5,
  .contact-page .hero-row > .col-md-7, .contact-page .hero-row > .col-md-5 { width: 100% !important; max-width: 100% !important; flex-basis: 100% !important; }
  /* increased mobile gap */
  .hero-block { margin-bottom: 3rem !important; }
}

/* Collections section (index) - three collections, left square + right two stacked halves
   - Titles moved above each collection
   - Keep the section constrained to the page content width
   - Ensure left tile height == stacked right halves (compensate for internal gap)
   - Increased spacing between collections; remove rounded corners */
.collections-section, .series-section {
  margin: 2rem 0 4rem 0; /* increased bottom margin to add more vertical space before Series */
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
  align-items: flex-start;
  width: 100%;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
}
.collections-section .collection, .series-section .collection {
  flex: 0 0 calc((100% - 3rem) / 3); /* three equal columns accounting for gaps */
  max-width: calc((100% - 3rem) / 3);
  box-sizing: border-box;
  margin-bottom: 0;
}
.collection .collection-title .title { font-weight:700; margin-bottom:0.5rem; }
.collection .art-wrapper { display: flex; gap: 0.75rem; align-items: stretch; }
.collection .col-left { width: 66.666667%; }
.collection .col-right { width: 33.333333%; display:flex; flex-direction:column; gap: 0.75rem; }
.collection .art { background-size: cover; background-position: center; border-radius: 0; overflow: hidden; border: none; box-shadow: none; }
.collection .art.square { width: 100%; padding-top: 100%; }
/* Reduce each half's height by half the vertical gap so top+gap+bottom == left height */
.collection .art.half { width: 100%; padding-top: calc(100% - 0.375rem); }
.collection .collection-meta { margin-top: .5rem; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.collection .collection-meta .title { font-weight:700; }
@media (max-width: 767.98px) {
  .collections-section, .series-section {
    width: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    display: block;
  }
  .collections-section .collection, .series-section .collection { width: 100%; max-width: 100%; flex-basis: 100%; margin-bottom: 1.5rem; }
  .collection .art-wrapper { flex-direction: column; gap: .75rem; }
  .collection .col-left, .collection .col-right { width: 100%; }
  .collection .art.half { padding-top: 100%; }
  .collection .art { border-radius: 0; }
}

/* Frame hover preview removed — restored original product image behavior */
.print-frame { position: static; }
.print-mat img.print-img { transition: none; }

@media (max-width: 767px) {
  .about-page .hero-figure .hero-img,
  .exhibitions-page .hero-figure .hero-img,
  .awards-page .hero-figure .hero-img,
  .press-page .hero-figure .hero-img,
  .news-page .hero-figure .hero-img,
  .contact-page .hero-figure .hero-img { height: 220px; }
  .about-page h1.display-5 { font-size: 1.6rem; }
}

@media (min-width: 992px) {
  .about-page .hero-figure { display: flex; align-items: center; justify-content: center; }
}

@media (max-width: 767px) {
  .print-frame { padding: 12px; }
  .print-mat { padding: 20px; }
}


/* Overlay cart icon on product image when item is in cart */
.img-overlay-wrapper { position: relative; display: block; }
.img-overlay-wrapper .img-cart-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(248,249,250,0.92);
  color: #258bb3;
  border: 1px solid rgba(0,0,0,0.06);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 16px rgba(0,0,0,0.12);
  z-index: 5;
  font-size: 1.25rem;
}
.img-overlay-wrapper .img-cart-overlay .count {
  position: absolute;
  bottom: -8px;
  right: -8px;
  min-width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ffc107;
  color: #000;
  border-radius: 999px;
  padding: 0 6px;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}
.img-overlay-wrapper .img-cart-overlay.d-none { display: none; }
.card > .position-absolute { z-index: 8; }

/* Gift card visuals */
.gift-card { margin-top: 1rem; }
.gift-card .gift-image { position: relative; overflow: hidden; }
.gift-card .gift-image img { width: 100%; height: 160px; object-fit: cover; display:block; }
.gift-card .gift-blurred img { filter: blur(3px); opacity: 0.9; transition: filter .12s ease, opacity .12s ease; }
.gift-card .gift-overlay { position: absolute; inset: 0; display:flex; align-items:center; justify-content:center; color: #fff; text-align:center; padding: .5rem; background: rgba(0,0,0,0.32); flex-direction: column; }
.gift-card .gift-overlay .overlay-icon { font-size: 1.25rem; margin-bottom: 0.35rem; display:flex; align-items:center; justify-content:center; }
.gift-card .gift-overlay .overlay-text { font-size: .95rem; line-height:1.2; }

/* Product page layout - force columns in same row (only for product detail rows) */
.product-page > .container > .row.product-detail-row { display: flex !important; flex-wrap: nowrap !important; width: 100% !important; margin: 0 auto !important; }
.product-page > .container > .row.product-detail-row > [class*="col-"] { flex: 0 0 auto !important; position: relative !important; padding-left: 12px !important; padding-right: 12px !important; }
.product-page > .container > .row.product-detail-row > .col-md-6 { width: 50% !important; max-width: 50% !important; flex-basis: 50% !important; }

/* Ensure media (image+description) is left and info is right on desktop */
.product-page .product-media { order: 0; display: flex; flex-direction: column; justify-content: flex-start; }
.product-page .product-info { order: 1; display: flex; flex-direction: column; justify-content: flex-start; }

/* On small screens keep natural document order (stacked) */
@media (max-width: 767.98px) {
  .product-page .product-media, .product-page .product-info { order: 0; width: 100% !important; max-width: 100% !important; flex-basis: 100% !important; }
}.product-page > .container > .row.product-detail-row > .col-md-2 { width: 16.666% !important; max-width: 16.666% !important; flex-basis: 16.666% !important; }

/* Product meta icons (signature, COA, surface, framing) */
.product-meta { display:block; margin-top:0.5rem; }
.product-meta .product-meta-item { display:block; font-size:0.85rem; color: #6c757d; margin-bottom:0.35rem; line-height:1.2; }
.product-meta .product-meta-item i { font-size:1.05rem; color: #6c757d; margin-right:0.45rem; vertical-align:middle; }

/* Product page icon color: light gray instead of teal */
.product-page .product-meta .product-meta-item i { color: #6c757d !important; /* improved contrast for icons */ }

/* Product claims (small gray cards shown under Reserve edition) */
.product-claims { margin-top: .5rem; }
.product-claims .card { padding: .45rem; background: #f8f9fa; border: 1px solid #ececec; box-shadow: none; min-height: 56px; }
.product-claims .card .fw-bold { font-size: .90rem; color: #495057; }
.product-claims .card .small { font-size: .78rem; color: #6c757d; }
.product-claims .card i.bi { font-size: .65rem; color: #6c757d; margin-right: .32rem; }
.product-claims .col-6 { padding-left: .3rem; padding-right: .3rem; }
@media (max-width: 576px) { .product-claims .card { padding: .4rem; min-height: auto; } .product-claims .card .fw-bold { font-size: .86rem; } .product-claims .card .small { font-size: .75rem; } }

/* Stronger visible focus for interactive controls to meet accessibility contrast */
.btn:focus, .btn:active, .size-selector:focus, .product-card .quick-add-btn:focus, .quick-add-toggle:focus, .quick-add-panel .size-btn:focus {
  box-shadow: 0 0 0 0.2rem rgba(71,74,72,0.25);
  outline: none;
  border-color: #474a48;
} 

@media (max-width: 767px) {
  .product-page > .container > .row.product-detail-row { flex-wrap: wrap !important; }
  .product-page > .container > .row.product-detail-row > .col-md-6,
  .product-page > .container > .row.product-detail-row > .col-md-2 { width: 100% !important; max-width: 100% !important; flex-basis: 100% !important; margin-bottom: 1rem; }
}

/* Use Bootstrap's modal-sm for compact regional modal */
#regionalModal .modal-content { border-radius: .5rem; padding: 0; }
#regionalModal .modal-body { padding: 0.75rem 1rem; }
#regionalModal .modal-header { padding: 0.6rem 0.9rem; }
#regionalModal .modal-footer { padding: 0.6rem 0.9rem; }




/* Mobile cart */
.mobile-price-row .mobile-price { font-weight: 700; }
.mobile-qty-placeholder .qty-group { width: auto !important; }
@media (max-width: 576px) {
  .price-column { display: none !important; }
  .mobile-price-row .mobile-price { font-size: 1rem; }
}

/* Quick add (index product cards) */
.card .quick-add-toggle { position: absolute; right: .5rem; bottom: .5rem; z-index: 4; background: transparent; border: none; border-radius: 0; width: auto; height: auto; padding: .15rem; display:flex; align-items:center; justify-content:center; box-shadow: none; color: #2c302e; cursor: pointer; }
.card .quick-add-toggle:hover, .card .quick-add-toggle:focus { background: transparent; color: #474a48; outline: none; box-shadow: none; }
.card .quick-add-panel { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; background:#fff; border-top-left-radius:8px; border-top-right-radius:8px; padding: .6rem; box-shadow:0 -8px 30px rgba(0,0,0,0.12); transform: translateY(12px); opacity: 0; visibility: hidden; pointer-events: none; transition: transform .26s cubic-bezier(.22,.9,.24,1), opacity .18s linear, visibility 0s linear .26s; }
.card .quick-add-panel.open { transform: translateY(0); opacity: 1; visibility: visible; pointer-events: auto; transition-delay: 0s; }
.quick-add-panel .sizes { display:flex; gap:6px; flex-wrap:wrap; }
footer a { pointer-events: auto; cursor: pointer; text-decoration: underline; color: inherit; }
footer { pointer-events: auto; }
.quick-add-panel .sizes .btn { padding: .25rem .5rem; font-size: .85rem; }

/* Size selector color tuned to CTA color */
.card .quick-add-panel .btn-outline-primary {
  border-color: #2c302e !important;
  color: #2c302e !important;
}
.card .quick-add-panel .btn-outline-primary:hover, .card .quick-add-panel .btn-outline-primary:focus {
  background-color: rgba(71,74,72,0.08) !important;
  border-color: #2c302e !important;
  color: #2c302e !important;
}
.card .quick-add-panel .btn-outline-primary.active, .card .quick-add-panel .btn-outline-primary:active, .card .quick-add-panel .size-btn.active {
  background-color: #2c302e !important;
  color: #fff !important;
  border-color: #2c302e !important;
  box-shadow: none !important;
} 
.quick-add-panel .quick-price { font-weight:700; font-size:1rem; margin-top: .35rem; }
.quick-add-panel .quick-in-cart-note { font-size: 0.78rem; }
.quick-price .promo-price { color: #dc3545; font-weight:700; }
.gift-card .gift-meta { display:flex; align-items:center; gap:12px; }

/* Clickable product card affordances */
.product-card-clickable {
  cursor: pointer;
  transform: none;
  transition: none;
  box-shadow: none;
}
.product-card-clickable:hover, .product-card-clickable:focus-within {
  transform: none;
  box-shadow: none;
}
.product-card-clickable:focus-within {
  box-shadow: 0 0 0 0.12rem rgba(71,74,72,0.12);
  outline: none;
} 
.product-card-clickable .btn {
  position: relative;
  z-index: 3;
}
.product-card-clickable .stretched-link {
  z-index: 1;
  outline-offset: 2px;
}
.product-card-clickable .stretched-link:focus {
  box-shadow: none !important;
  outline: none !important;
} 

/* CTA color: order / reserve, hover & focus (front-end only) */
body:not(.admin) .product-card .btn-primary,
body:not(.admin) .product-page .btn-success,
body:not(.admin) .btn-warning,
body:not(.admin) .product-card .quick-add-btn,
body:not(.admin) .btn-primary.cta {
  background-color: #2c302e !important;
  border-color: #2c302e !important;
  color: #fff !important;
  font-size: 0.92rem;
  padding: .28rem .6rem;
  box-shadow: none;
}
body:not(.admin) .product-card .btn-primary:hover,
body:not(.admin) .product-page .btn-success:hover,
body:not(.admin) .btn-warning:hover,
body:not(.admin) .product-card .quick-add-btn:hover,
body:not(.admin) .btn-primary.cta:focus,
body:not(.admin) .btn-warning:focus {
  background-color: #474a48 !important;
  border-color: #474a48 !important;
  color: #fff !important;
  text-decoration: none;
  box-shadow: none !important;
  outline: none;
}

/* Outline variations (quick add / continue shopping) */
body:not(.admin) .btn-outline-primary,
body:not(.admin) .btn-outline-danger {
  border-color: #2c302e !important;
  color: #2c302e !important;
}
body:not(.admin) .btn-outline-primary:hover,
body:not(.admin) .btn-outline-danger:hover {
  background-color: rgba(71,74,72,0.08) !important;
  color: #2c302e !important;
  border-color: #2c302e !important;
}

/* Size selector on product page using site color */
.size-selector {
  border: 1px solid #2c302e !important;
  color: #2c302e !important;
  background-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  transition: background-color .12s ease, color .12s ease, border-color .12s ease;
}
.size-selector:hover, .size-selector:focus {
  background-color: #2c302e !important;
  border-color: #2c302e !important;
  color: #fff !important;
  box-shadow: none !important;
  outline: none !important;
} 
.btn-check:checked + .size-selector,
.size-selector.active {
  background-color: #2c302e !important;
  color: #fff !important;
  border-color: #2c302e !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Reset outline-primary to Bootstrap default inside admin pages */
.admin .btn-outline-primary { border-color: var(--bs-primary) !important; color: var(--bs-primary) !important; }
.admin .btn-outline-primary:hover, .admin .btn-outline-primary:focus { background-color: var(--bs-primary) !important; color: #000 !important; }
.admin .btn-outline-primary.active, .admin .btn-outline-primary:active { background-color: var(--bs-primary) !important; border-color: var(--bs-primary) !important; color: #000 !important; }

/* Quick-price slide-up animation */
.quick-price {
  transform: translateY(6px);
  opacity: 0;
  transition: transform .22s cubic-bezier(.22,.9,.24,1), opacity .18s linear;
}
.quick-price.show {
  transform: translateY(0);
  opacity: 1;
}

/* Availability line and text */
/* availability visual removed — kept CSS here in case it's needed again later (commented out)
.availability-line { height: 4px; width: 100%; background-color: #CBC462; border-radius: 2px; }
.text-availability { color: #CBC462; font-weight: 400; }
*/

/* Other products links */
.other-product-link, .other-product-link:link, .other-product-link:visited { color: #2c302e; }
.other-product-link:hover, .other-product-link:focus { color: #474a48; text-decoration: none; }

/* Cart icon and navbar price badge */
.navbar-nav a[href$="cart.php"] .bi {
  color: #B2A079;
}
.navbar-nav a[href$="cart.php"] .badge {
  background-color: #ffc107 !important;
  border-color: #ffc107 !important;
  color: #000 !important;
}

/* Navigation links */
#navMain .nav-link { color: inherit; }
#navMain .nav-link:hover, #navMain .nav-link:focus { color: inherit; }

/* Cart page buttons */
.cart-page .btn-primary,
.cart-page a.btn-primary {
  background-color: #258bb3;
  border-color: #258bb3;
  color: #fff;
}
.cart-page .btn-primary:hover,
.cart-page .btn-primary:focus {
  background-color: #1e7290;
  border-color: #1e7290;
  color: #fff;
}
.cart-page .btn-outline-primary,
.cart-page .btn-outline-secondary {
  border-color: #258bb3;
  color: #258bb3;
}
.cart-page .btn-outline-primary:hover,
.cart-page .btn-outline-secondary:hover,
.cart-page .btn-outline-primary:focus,
.cart-page .btn-outline-secondary:focus {
  background-color: rgba(37,139,179,0.06);
  border-color: #1e7290;
  color: #1e7290;
}
.cart-page .btn-outline-primary.active,
.cart-page .btn-outline-secondary.active {
  background-color: #258bb3;
  color: #fff;
  border-color: #258bb3;
  box-shadow: none;
}

/* General primary button override for front-end */
body:not(.admin) .btn-primary {
  background-image: none !important;
  background-color: #2c302e !important;
  border-color: #2c302e !important;
  color: #fff !important;
}
body:not(.admin) .btn-primary:hover, body:not(.admin) .btn-primary:focus {
  background-image: none !important;
  background-color: #474a48 !important;
  border-color: #474a48 !important;
  box-shadow: none !important;
}

/* Uniform H1 sizing */
h1 {
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
  line-height: 1.15;
}
@media (min-width: 768px) { h1 { font-size: 1.5rem; } }

/* Index pagination */
.index-page .pagination .page-link {
  color: #2c302e;
  border-color: #2c302e;
}
.index-page .pagination .page-link:hover,
.index-page .pagination .page-link:focus {
  color: #474a48;
  border-color: #474a48;
}
.index-page .pagination .page-item.active .page-link {
  background-color: #2c302e;
  border-color: #2c302e;
  color: #fff;
  box-shadow: none;
}
.index-page .pagination .page-item.disabled .page-link {
  color: #6c757d;
  border-color: #dee2e6;
} 

/* Hide native number input spinners */
input.qty-input::-webkit-outer-spin-button,
input.qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input.qty-input[type=number] {
  -moz-appearance: textfield;
  appearance: textfield;
}

/* Cart image */
.cart-img {
  height: 120px;
  width: auto;
  object-fit: cover;
  border-radius: 4px;
  display: block;
}

/* Regional settings footer tweaks */
.footer-regional { font-size: 0.95rem; }
.footer-regional .fw-bold { font-size: .95rem; }
.footer-regional .btn { padding: .2rem .6rem; }
@media (min-width: 768px) {
  footer .container { text-align: left; }
}

/* Footer logo and column helpers */
.footer-logo { width: 72px; height: auto; display: block; filter: grayscale(1) contrast(.95); opacity: .9; }
.footer-desc { max-width: 44rem; }
.footer-links h6 { font-size: .95rem; font-weight: 600; margin-bottom: .45rem; }
.footer-links a { color: #6c757d; text-decoration: none; display: block; margin-bottom: .25rem; }
.footer-links a:hover { color: #000; text-decoration: underline; }

/* Public news list */
.news-card .card-body { min-height: 220px; }
.news-card h5 { font-size: 1.05rem; }
.news-card .card-img-top { border-bottom: 1px solid rgba(0,0,0,0.05); }

/* Article gallery */
.article-gallery figure { margin: 0; }
.article-gallery img { border-radius: 4px; display: block; width: 100%; height: auto; }
.article-gallery figcaption { color: #666; font-size: .9rem; margin-top: .4rem; }

/* Admin news cards */
.admin-news-card { transition: transform .12s ease, box-shadow .12s ease; }
.admin-news-card:hover { transform: translateY(-4px); box-shadow: 0 8px 20px rgba(0,0,0,0.08); }

@media (max-width: 576px) {
  .footer-logo { width: 56px; }
  .footer-links { text-align: center; }
}

@media (max-width: 576px) {
  .cart-img { height: 80px; }
  .card .card-img-top { height: 200px; }
  .table-responsive input.qty-input { width: 100%; }
  .cart-actions { display: grid; gap: .5rem; }
  .checkout-actions .btn { width: 100%; }
}

/* User circle for logged-in users */
.user-circle {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background-color: #258bb3;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 1.1rem;
  text-transform: uppercase;
  border: 2px solid rgba(255, 255, 255, 0.3);
}

/* Desktop user menu */
.desktop-user-menu {
  display: flex;
  align-items: center;
  gap: 8px;
}
.desktop-user-menu .user-name {
  font-weight: 500;
  color: #333;
}
.desktop-user-menu .logout-icon {
  color: #6c757d;
  margin-left: 4px;
  transition: color 0.2s;
}
.desktop-user-menu:hover .logout-icon {
  color: #dc3545;
}

/* Offcanvas mobile menu */
.offcanvas-mobile {
  width: 85% !important;
  max-width: 300px;
  background-color: #f8f9fa;
}
.offcanvas-mobile .offcanvas-header {
  border-bottom: 1px solid #dee2e6;
  padding-bottom: 1rem;
}
.offcanvas-mobile .nav-link {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #eee;
  color: #333;
  display: flex;
  align-items: center;
  gap: 10px;
}
.offcanvas-mobile .nav-link:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
.offcanvas-mobile .nav-link.active {
  color: #258bb3;
  font-weight: 600;
}
.offcanvas-mobile .user-info {
  padding: 1rem;
  border-bottom: 1px solid #dee2e6;
  display: flex;
  align-items: center;
  gap: 12px;
  background-color: rgba(203, 170, 98, 0.1);
}
.offcanvas-mobile .user-info .user-circle {
  width: 40px;
  height: 40px;
  font-size: 1.2rem;
}
.offcanvas-mobile .user-info .user-details {
  flex: 1;
}
.offcanvas-mobile .user-info .user-name {
  font-weight: 600;
  color: #333;
  margin-bottom: 2px;
}
.offcanvas-mobile .user-info .user-email {
  font-size: 0.85rem;
  color: #6c757d;
}
