/* Corano theme — CMS overrides (loaded after style.css). */

/* Hero — rendered as a responsive <img> (see home.blade.php) so the banner keeps
   its natural aspect ratio and is only downscaled, never upscaled/cropped. This
   fixes the blurry/zoomed mobile banner that background-size:cover produced. The
   <picture> element swaps in the uploaded mobile banner under 767px. */
.slider-area .hero-single-slide { line-height: 0; }
.slider-area .hero-slide-img { display: block; width: 100%; height: auto; }

/* Text logo fallback when no image logo is set */
.cms-text-logo { font-size: 26px; font-weight: 700; color: #222; letter-spacing: .5px; }
.mobile-logo .cms-text-logo,
.logo .cms-text-logo { line-height: 1; }

/* Keep product-price partial tidy inside Corano's .price-box */
.price-box .price-regular { color: var(--theme-primary); font-size: 18px; font-weight: 600; }
.price-box del { color: #888; margin-left: 6px; font-size: 15px; }
.price-box ins { text-decoration: none; }

/* Product card rating row */
.product-caption .ratings { margin-bottom: 6px; }
.product-caption .ratings .fa { color: var(--theme-primary); font-size: 13px; }

/* Ensure add-to-cart hover button is usable as a <button> */
.cart-hover .btn-cart { cursor: pointer; border: 0; }

/* Newsletter status message spacing */
#newsletterMsg small { display: inline-block; margin-top: 6px; }

/* Breadcrumb band spacing */
.breadcrumb-area { padding: 22px 0; background: #f6f6f6; margin-bottom: 40px; }
.breadcrumb-area .breadcrumb { margin: 0; background: transparent; padding: 0; }

/* Scroll-to-top uses theme accent */
.scroll-top { background: var(--theme-primary); }

/* ---- Colour × Size variant selector ---- */
.variant-selector-corano .option-title { margin-top: 15px; margin-bottom: 8px; text-transform: capitalize; }
.variant-selector-corano .selected-color-name { color: var(--theme-primary, #c29958); font-weight: 600; text-transform: none; }
.variant-selector-corano .color-categories { list-style: none; padding: 0; margin: 0 0 5px; display: flex; flex-wrap: wrap; gap: 8px; }
/* Reset the theme's circular li wrapper + fixed 12px swatch sizing so chips lay out */
.variant-selector-corano .color-categories li { display: inline-flex; padding: 0; border: 0; border-radius: 0; }
/* Named colour chip: swatch dot + colour name */
.variant-selector-corano .color-categories li a.color-chip { display: inline-flex; width: auto; height: auto; align-items: center; gap: 8px; padding: 5px 14px 5px 6px; border: 1px solid #ddd; border-radius: 30px; background: #fff; color: #333; font-size: 13px; line-height: 1; cursor: pointer; transition: all .2s; }
.variant-selector-corano .color-categories li a.color-chip .swatch-dot { width: 16px; height: 16px; border-radius: 50%; border: 1px solid rgba(0, 0, 0, .15); flex: 0 0 auto; }
.variant-selector-corano .color-categories li a.color-chip:hover { border-color: var(--theme-primary, #c29958); color: var(--theme-primary, #c29958); }
.variant-selector-corano .color-categories li a.color-chip.active { border-color: var(--theme-primary, #c29958); box-shadow: 0 0 0 1px var(--theme-primary, #c29958); color: var(--theme-primary, #c29958); font-weight: 600; }
.variant-selector-corano .size-categories { list-style: none; padding: 0; margin: 0 0 5px; display: flex; flex-wrap: wrap; gap: 8px; }
.variant-selector-corano .size-categories li a { display: inline-block; min-width: 42px; text-align: center; padding: 6px 14px; border: 1px solid #ddd; border-radius: 3px; color: #333; font-size: 13px; cursor: pointer; transition: all .2s; }
.variant-selector-corano .size-categories li a:hover { border-color: #c29958; color: #c29958; }
.variant-selector-corano .size-categories li a.active { background: #c29958; border-color: #c29958; color: #fff; }

/* ---- Detail-page cart actions (Add to cart + Buy now, kept from clashing) ---- */
.quantity-cart-box { gap: 14px; }
.quantity-cart-box .cart-actions { gap: 10px; }
.quantity-cart-box .btn-buy-now { background: var(--theme-primary, #c29958); border: 1px solid var(--theme-primary, #c29958); color: #fff; padding: 10px 28px; border-radius: 3px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; transition: all .2s; }
.quantity-cart-box .btn-buy-now:hover { filter: brightness(.9); color: #fff; }

/* ---- Header nav dropdown (e.g. Categories) — wider + scrolls if the list is long ---- */
.main-menu ul li ul.dropdown { width: 260px; max-height: 70vh; overflow-y: auto; }
.main-menu ul li ul.dropdown li a { white-space: normal; }

/* ---- Out of stock ---- */
.product-label.out-of-stock { background-color: #6c757d; }
.quantity-cart-box .btn.disabled,
.cart-hover .btn.disabled,
.btn.disabled[disabled] { opacity: .55; cursor: not-allowed; pointer-events: none; }
.availability .text-danger { color: #d9534f !important; }

/* ---- Colour swatches on product cards ---- */
.product-caption .color-categories { list-style: none; padding: 0; margin: 6px 0; display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; }
.product-caption .color-categories li a { display: inline-block; width: 16px; height: 16px; border-radius: 50%; border: 1px solid #ddd; }
