/*
 * Glue between the core views and Cartzilla/Bootstrap: pages the theme does not
 * override (checkout, account, blog…) keep their core markup (konex-* classes);
 * these rules give them the Cartzilla look. Uses Bootstrap variables when present.
 */
.konex-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1.5rem; list-style: none; padding: 0; }
.konex-plp { display: grid; grid-template-columns: 260px 1fr; gap: 2rem; }
/* PDP uses Bootstrap row/col-md-6 so the layout collapses cleanly on mobile. */
.konex-form { display: grid; gap: .75rem; max-width: 34rem; }
.konex-form label { display: grid; gap: .35rem; font-weight: 500; }
.konex-form input:not([type=checkbox]):not([type=radio]), .konex-form select, .konex-form textarea,
.konex-plp-toolbar select, .cart-qty input, .cart-promo input {
    display: block; width: 100%; padding: .625rem 1rem; font: inherit;
    border: var(--cz-border-width, 1px) solid var(--cz-border-color, #e5e7eb); border-radius: var(--cz-border-radius, .5rem);
    background: var(--cz-body-bg, #fff); color: var(--cz-body-color, inherit);
}
.konex-form button, .cart-qty button, .cart-promo button, .konex-account button, .konex-auth button {
    display: inline-flex; align-items: center; justify-content: center; padding: .625rem 1.25rem; font-weight: 500;
    border: 0; border-radius: var(--cz-border-radius, .5rem); background: var(--cz-primary, #f55266); color: #fff; cursor: pointer;
}
.konex-table, .cart-table { width: 100%; border-collapse: collapse; margin-bottom: 1.5rem; }
.konex-table th, .konex-table td, .cart-table th, .cart-table td { padding: .75rem .5rem; border-bottom: 1px solid var(--cz-border-color, #e5e7eb); vertical-align: middle; }
.cart-summary dl { display: grid; grid-template-columns: 1fr auto; gap: .5rem 1rem; }
.cart-summary dd { margin: 0; text-align: right; }
.konex-auth { max-width: 30rem; margin: 0 auto; }
.konex-address { border: 1px solid var(--cz-border-color, #e5e7eb); border-radius: var(--cz-border-radius, .5rem); padding: .75rem 1rem; margin-bottom: .75rem; }
.konex-search-results { position: absolute; top: 100%; left: 0; right: 0; z-index: 1050; margin-top: .25rem; padding: .5rem;
    background: var(--cz-body-bg, #fff); color: var(--cz-body-color, #222); border-radius: var(--cz-border-radius-lg, .75rem); box-shadow: var(--cz-box-shadow, 0 .5rem 1.5rem rgba(0,0,0,.12)); }
.konex-search-results[hidden] { display: none; }
.konex-search-group h6 { margin: .25rem .5rem; font-size: .75rem; text-transform: uppercase; opacity: .6; }
.konex-search-item { display: flex; align-items: center; gap: .75rem; padding: .375rem .5rem; border-radius: .5rem; text-decoration: none; color: inherit; }
.konex-search-item:hover { background: var(--cz-secondary-bg, #f3f4f6); }
.konex-search-item .konex-price { margin-left: auto; font-size: .875rem; }
.konex-toast { position: fixed; right: 1rem; bottom: 1rem; z-index: 1090; max-width: 22rem; padding: .75rem 1rem; border-radius: var(--cz-border-radius, .5rem); box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.15); }
.konex-alert-success { background: var(--cz-success-bg-subtle, #e8f7ee); color: var(--cz-success-text-emphasis, #146c43); }
.konex-alert-error { background: var(--cz-danger-bg-subtle, #fdecef); color: var(--cz-danger-text-emphasis, #b02a37); }
[data-konex-cart-count]:empty { display: none; }
[data-loading] { opacity: .6; pointer-events: none; }
@media (max-width: 991.98px) { .konex-plp { grid-template-columns: 1fr; } }

/* quick purchase rows built by its inline JS */
#konex-quick-results input[type=number] { width: 5rem; padding: .375rem .5rem; border: 1px solid var(--cz-border-color, #e5e7eb); border-radius: var(--cz-border-radius-sm, .375rem); }
#konex-quick-results button { padding: .375rem .875rem; border: 0; border-radius: var(--cz-border-radius-sm, .375rem); background: var(--cz-primary, #222); color: #fff; font-size: .875rem; }
.konex-post-image-0 { background: var(--ed-card-2, linear-gradient(135deg, #c28360, #925544)); }
.konex-post-image-1 { background: linear-gradient(135deg, #e2c8a3, #ba7154); }
.konex-post-image-2 { background: linear-gradient(135deg, #d0bcae, #8e6756); }
.konex-post-card .ed-post-image { height: 200px; }
.konex-post-body img { max-width: 100%; height: auto; border-radius: .75rem; }

/* Product detail gallery: simple, dependency-free frame + thumbnail strip.
   Supplier photos are rarely square, so the image is fitted inside a fixed-height
   frame instead of being cropped. No Swiper dependency, so it cannot blow up to
   9000px if a script fails. */
.konex-gallery { display: flex; flex-direction: column; gap: 1rem; width: 100%; }
.konex-gallery-main {
    display: flex; align-items: center; justify-content: center;
    width: 100%; height: 50vh; max-height: 520px;
    padding: 1rem; box-sizing: border-box;
    background: var(--cz-secondary-bg, #f3f4f6);
    border-radius: .75rem;
}
.konex-gallery-main img { max-width: 100%; max-height: 100%; object-fit: contain; }
.konex-gallery-thumbs { display: flex; gap: .75rem; overflow-x: auto; padding-bottom: .25rem; }
.konex-gallery-thumb { flex: 0 0 auto; padding: 0; border: 2px solid transparent; border-radius: .5rem; overflow: hidden; background: transparent; cursor: pointer; opacity: .8; transition: opacity .15s, border-color .15s; }
.konex-gallery-thumb img { width: 64px; height: 64px; object-fit: cover; display: block; }
.konex-gallery-thumb:hover, .konex-gallery-thumb.active { opacity: 1; border-color: var(--cz-primary, #222); }
.konex-gallery-thumb.active { opacity: 1; }
.konex-gallery .swiper { height: min(70vh, 640px); max-height: none; }
.konex-gallery-thumb img { width: 80px; height: 80px; }

/* PDP: sticky buy box, info sections, mini summary, mobile bottom bar */
@media (min-width: 768px) {
    .konex-pdp-sticky { position: sticky; top: calc(var(--konex-header-offset, 5.5rem)); }
}
.konex-pdp-summary.sticky-top { top: calc(var(--konex-header-offset, 5.5rem)); z-index: 1; }
.konex-pdp-section + .konex-pdp-section { margin-top: 2.5rem; padding-top: 2.5rem; border-top: var(--cz-border-width, 1px) solid var(--cz-border-color, #e5e7eb); }
.konex-description img { max-width: 100%; height: auto; border-radius: .75rem; }
.konex-description ul { padding-left: 1.1rem; }
.konex-description li + li { margin-top: .35rem; }
.konex-pdp-price .konex-price { font-size: inherit; display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; }
.konex-pdp-price .konex-price del { font-size: 1rem; }
.konex-axis legend { float: none; width: auto; }
.konex-add-to-cart .count-input { max-width: 9.5rem; }
.konex-add-to-cart .count-input input { text-align: center; }
.konex-sticky-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030; background: var(--cz-body-bg, #fff); border-top: var(--cz-border-width, 1px) solid var(--cz-border-color, #e5e7eb); box-shadow: 0 -.5rem 1.5rem rgba(0,0,0,.06); }
.konex-sticky-bar[hidden] { display: none !important; }
.konex-sticky-bar .konex-price { font-size: .95rem; }

/* product card: hover swaps to the second image, add-to-cart slides in (always visible on touch) */
.konex-card-media { background: var(--cz-tertiary-bg, #f5f5f4); }
.konex-card-img { object-fit: contain; padding: .75rem; transition: opacity .35s ease, transform .5s ease; }
.konex-card-img-hover { opacity: 0; object-fit: cover; padding: 0; }
.konex-card-media.has-hover:hover .konex-card-img:not(.konex-card-img-hover) { opacity: 0; }
.konex-card-media.has-hover:hover .konex-card-img-hover { opacity: 1; }
.konex-card-media:not(.has-hover):hover .konex-card-img { transform: scale(1.04); }
.konex-card-title { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--cz-heading-color, inherit); text-decoration: none; }
@media (hover: hover) and (min-width: 576px) {
    .konex-card-actions { opacity: 0; transform: translateY(.5rem); transition: opacity .2s, transform .2s; }
    .konex-card:hover .konex-card-actions, .konex-card:focus-within .konex-card-actions { opacity: 1; transform: none; }
}
@media (hover: none), (max-width: 575.98px) {
    .konex-card-actions .btn { padding: .3rem .5rem; font-size: .75rem; }
}

/* PLP: chips, recommended collection banners */
.konex-plp-subnav { scrollbar-width: none; }
.konex-plp-subnav::-webkit-scrollbar { display: none; }
.konex-collection-banner { position: relative; display: flex; align-items: flex-end; height: 100%; min-height: 20rem; overflow: hidden; border-radius: var(--cz-border-radius-xl, 1rem); color: var(--cz-heading-color, #222); text-decoration: none; }
.konex-collection-banner.cz-banner-tone-0 { background: linear-gradient(160deg, #efe6da, #dcc7ae); }
.konex-collection-banner.cz-banner-tone-1 { background: linear-gradient(160deg, #e3e8e1, #bccab8); }
.konex-collection-banner.cz-banner-tone-2 { background: linear-gradient(160deg, #ece3e8, #cdb6c2); }
.konex-collection-banner img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.konex-collection-banner:hover img { transform: scale(1.05); }
.konex-collection-banner.has-image { color: #fff; }
.konex-collection-banner.has-image .konex-collection-banner-body { background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.7)); }
.konex-collection-banner-body { position: relative; display: flex; flex-direction: column; gap: .35rem; width: 100%; padding: 1.25rem; }
.konex-collection-banner-body small { text-transform: uppercase; letter-spacing: .1em; font-size: .7rem; font-weight: 600; opacity: .85; }
.konex-collection-banner-body strong { font-size: 1.35rem; line-height: 1.15; }
.konex-collection-banner-body .cz-banner-text { font-size: .875rem; opacity: .9; }
@media (min-width: 992px) { .konex-collection-banner { min-height: 100%; } }

/* carousels without Swiper initialised (licensed build missing): horizontal scroll */
.konex-carousel .swiper:not(.swiper-initialized) .swiper-wrapper { display: flex; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; }
.konex-carousel .swiper:not(.swiper-initialized) .swiper-slide { flex: 0 0 calc(50% - .5rem); scroll-snap-align: start; }
@media (min-width: 992px) { .konex-carousel .swiper:not(.swiper-initialized) .swiper-slide { flex-basis: calc(25% - .75rem); } }

/* Checkout: payment method selector */
.checkout-gateway { cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease; }
.checkout-gateway:hover { border-color: var(--cz-border-color-translucent, #cad0d9) !important; }
.checkout-gateway:has(input:checked) { border-color: var(--cz-primary, #222) !important; box-shadow: 0 0 0 1px var(--cz-primary, #222); }
.checkout-gateway-icon { width: 2.5rem; height: 2.5rem; }
.checkout-gateway-brands span { font-size: .625rem; font-weight: 700; letter-spacing: .02em; line-height: 1; padding: .3rem .35rem; border: 1px solid var(--cz-border-color, #e2e5f1); border-radius: .25rem; color: var(--cz-heading-color, #222); }
.checkout-gateway-wordmark { font-weight: 800; font-size: .95rem; letter-spacing: -.01em; }
.checkout-gateway-wordmark.is-bizum { color: #05c3dd; }
.checkout-gateway-wordmark.is-paypal { color: #003087; font-style: italic; }
.checkout-gateway-wordmark.is-paypal b { color: #009cde; }

/* One-page checkout */
.checkout-section { background: var(--cz-body-bg, #fff); transition: box-shadow .2s ease, border-color .2s ease; }
.checkout-section.is-current { border-color: var(--cz-heading-color, #222) !important; box-shadow: 0 .5rem 1.5rem -.75rem rgba(0, 0, 0, .18); }
.checkout-section.is-locked { opacity: .55; }
.checkout-section.is-locked header { padding-top: .85rem !important; padding-bottom: .85rem !important; }
.checkout-section-badge { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: 50%; font-size: .8rem; font-weight: 600; border: 1px solid var(--cz-border-color, #e2e5f1); color: var(--cz-body-color, #555); }
.checkout-section.is-current .checkout-section-badge { background: var(--cz-heading-color, #222); border-color: var(--cz-heading-color, #222); color: #fff; }
.checkout-section.is-done .checkout-section-badge { border-color: var(--cz-success, #33b36b); color: var(--cz-success, #33b36b); }
.checkout-section:focus { outline: none; }
.checkout-option { cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease; }
.checkout-option:has(input:checked) { border-color: var(--cz-heading-color, #222) !important; box-shadow: 0 0 0 1px var(--cz-heading-color, #222); }
.checkout-onepage details > summary { cursor: pointer; color: var(--cz-heading-color, #222); }
.checkout-qty { font-size: .65rem; min-width: 1.25rem; }
.checkout-onepage .btn.is-loading { position: relative; color: transparent !important; pointer-events: none; }
.checkout-onepage .btn.is-loading::after { content: ""; position: absolute; inset: 0; margin: auto; width: 1.1rem; height: 1.1rem; border: 2px solid rgba(255, 255, 255, .6); border-top-color: #fff; border-radius: 50%; animation: cz-spin .7s linear infinite; }
@keyframes cz-spin { to { transform: rotate(360deg); } }
.checkout-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030; background: var(--cz-body-bg, #fff); border-top: 1px solid var(--cz-border-color, #e2e5f1); box-shadow: 0 -.5rem 1.25rem -.75rem rgba(0, 0, 0, .2); padding-bottom: env(safe-area-inset-bottom); }
@media (max-width: 991.98px) { body.cz-checkout { padding-bottom: 4.5rem; } }

/* Focused checkout layout (minimal header/footer) */
.cz-checkout-header { border-bottom: 1px solid var(--cz-border-color, #e2e5f1); background: var(--cz-body-bg, #fff); }
.cz-checkout-header .ed-brand img { max-height: 2.25rem; }

/* Slide-out cart drawer (offcanvas) */
body.konex-drawer-open { overflow: hidden; }
.konex-cart-backdrop { position: fixed; inset: 0; z-index: 1080; background: rgba(15, 23, 42, .45); backdrop-filter: blur(2px); }
.konex-cart-backdrop[hidden], .konex-cart-drawer[hidden] { display: none !important; }
.konex-cart-drawer { position: fixed; top: 0; right: 0; bottom: 0; z-index: 1085; width: min(420px, 100vw); background: var(--cz-body-bg, #fff); color: var(--cz-body-color, #222); box-shadow: -12px 0 36px rgba(0, 0, 0, .18); display: flex; flex-direction: column; animation: konex-drawer-in .22s cubic-bezier(.16, 1, .3, 1); }
.konex-cart-drawer input[type=number]::-webkit-inner-spin-button,
.konex-cart-drawer input[type=number]::-webkit-outer-spin-button,
.cart-items input[type=number]::-webkit-inner-spin-button,
.cart-items input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.konex-cart-drawer input[type=number], .cart-items input[type=number] { -moz-appearance: textfield; appearance: textfield; }
@keyframes konex-drawer-in { from { transform: translateX(100%); } to { transform: translateX(0); } }
.cz-checkout-footer { border-top: 1px solid var(--cz-border-color, #e2e5f1); }