/* customkaro-system.css: generated from the approved type spec (TYPOGRAPHY-SPEC.md). Assigns a type role to each component. One section per migrated page group.
   Loaded after the older stylesheets, in the page and inside the shadow-DOM pages. Do not edit by hand: change the spec and regenerate. */

/* ---- g1 ---- */
:is(html:root:root,:host) .ck-hero__title{font-family:var(--ck-font-display);font-weight:400;line-height:1.0;letter-spacing:-0.025em;text-transform:uppercase;font-size:3rem}
@media (min-width:768px){:is(html:root:root,:host) .ck-hero__title{font-size:4.5rem}}
:is(html:root:root,:host) .ck-section__title,
:is(html:root:root,:host) .ck-how__title,
:is(html:root:root,:host) .qikink-pdp__info h1{font-family:var(--ck-font-display);font-weight:400;line-height:1.1;letter-spacing:-0.025em;text-transform:uppercase;font-size:2.25rem}
@media (min-width:768px){:is(html:root:root,:host) .ck-section__title,
:is(html:root:root,:host) .ck-how__title,
:is(html:root:root,:host) .qikink-pdp__info h1{font-size:3rem}}
:is(html:root:root,:host) .qikink-pdp__section > h2.qikink-pdp__pd-title,
:is(html:root:root,:host) .ck-mini__title,
:is(html:root:root,:host) .qikink-pdp__section > h2,
:is(html:root:root,:host) .qikink-pdp__slider-head h2{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.5rem}
@media (min-width:768px){:is(html:root:root,:host) .qikink-pdp__section > h2.qikink-pdp__pd-title,
:is(html:root:root,:host) .ck-mini__title,
:is(html:root:root,:host) .qikink-pdp__section > h2,
:is(html:root:root,:host) .qikink-pdp__slider-head h2{font-size:1.875rem}}
:is(html:root:root,:host) .ck-cat__title,
:is(html:root:root,:host) .ck-mini--card .ck-mini__title,
:is(html:root:root,:host) .ck-marquee__copy,
:is(html:root:root,:host) .ck-footer__logo{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.25rem}
@media (min-width:768px){:is(html:root:root,:host) .ck-cat__title,
:is(html:root:root,:host) .ck-mini--card .ck-mini__title,
:is(html:root:root,:host) .ck-marquee__copy,
:is(html:root:root,:host) .ck-footer__logo{font-size:1.5rem}}
:is(html:root:root,:host) .ck-logo__text,
:is(html:root:root,:host) .ck-step__title,
:is(html:root:root,:host) .qikink-pdp__printing h2,
:is(html:root:root,:host) .qikink-pdp__info h2{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.125rem}
@media (min-width:768px){:is(html:root:root,:host) .ck-logo__text,
:is(html:root:root,:host) .ck-step__title,
:is(html:root:root,:host) .qikink-pdp__printing h2,
:is(html:root:root,:host) .qikink-pdp__info h2{font-size:1.25rem}}
:is(html:root:root,:host) .ck-step__n,
:is(html:root:root,:host) .qikink-pdp__price{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:normal;text-transform:none;font-size:1.5rem}
:is(html:root:root,:host) .ck-product__price{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:normal;text-transform:none;font-size:1.125rem}
:is(html:root:root,:host) .qikink-pdp__related-price{font-family:var(--ck-font-display);font-weight:400;line-height:1.4;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) .qikink-pdp__related-name{font-family:var(--ck-font-display);font-weight:400;line-height:1.43;letter-spacing:-0.025em;text-transform:uppercase;font-size:0.875rem}
:is(html:root:root,:host) .ck-quote blockquote,
:is(html:root:root,:host) .ck-mini--card .ck-mini__text,
:is(html:root:root,:host) .qikink-pdp__sku{font-family:var(--ck-font-body);font-weight:400;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) .ck-tag,
:is(html:root:root,:host) .ck-hero__brand,
:is(html:root:root,:host) .ck-footer__badges span,
:is(html:root:root,:host) .qikink-pdp__sku-label{font-family:var(--ck-font-body);font-weight:700;line-height:1.33;letter-spacing:0.025em;text-transform:uppercase;font-size:0.75rem}
:is(html:root:root,:host) .ck-pill,
:is(html:root:root,:host) .qikink-pdp__badge,
:is(html:root:root,:host) .qikink-pdp__pd-label{font-family:var(--ck-font-body);font-weight:700;line-height:1.33;letter-spacing:0.2em;text-transform:uppercase;font-size:0.75rem}
:is(html:root:root,:host) .qikink-pdp__breadcrumbs a,
:is(html:root:root,:host) .qikink-pdp__breadcrumbs-current{font-family:var(--ck-font-body);font-weight:700;line-height:1.33;letter-spacing:0.025em;text-transform:uppercase;font-size:0.75rem}
:is(html:root:root,:host) .qikink-pdp__pill,
:is(html:root:root,:host) .qikink-pdp__choice{font-family:var(--ck-font-body);font-weight:600;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) .ck-slider__btn{font-family:var(--ck-font-body);font-weight:700;line-height:1.5;letter-spacing:normal;text-transform:none;font-size:1.125rem}
:is(html:root:root,:host) .close-cart-side{font-family:var(--ck-font-body);font-weight:700;line-height:1.33;letter-spacing:0.025em;text-transform:uppercase;font-size:0.75rem}
:is(html:root:root,:host) .qikink-pdp__view-size-chart{font-family:var(--ck-font-body);font-weight:600;line-height:1.5;letter-spacing:normal;text-transform:none;font-size:1rem}
:is(html:root:root,:host) .qikink-pdp details > p{font-family:var(--ck-font-body);font-weight:400;line-height:1.6;letter-spacing:normal;text-transform:none;font-size:1rem}
:is(html:root:root,:host) h1.font-display.text-7xl{font-family:var(--ck-font-display);font-weight:400;line-height:1.0;letter-spacing:-0.025em;text-transform:uppercase;font-size:3rem}
@media (min-width:768px){:is(html:root:root,:host) h1.font-display.text-7xl{font-size:4.5rem}}
:is(html:root:root,:host) h1.font-display.text-4xl{font-family:var(--ck-font-display);font-weight:400;line-height:1.1;letter-spacing:-0.025em;text-transform:uppercase;font-size:2.25rem}
@media (min-width:768px){:is(html:root:root,:host) h1.font-display.text-4xl{font-size:3rem}}
:is(html:root:root,:host) .max-w-xs > p.font-display.text-2xl,
:is(html:root:root,:host) .max-w-xs > p.font-display > span{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.25rem}
@media (min-width:768px){:is(html:root:root,:host) .max-w-xs > p.font-display.text-2xl,
:is(html:root:root,:host) .max-w-xs > p.font-display > span{font-size:1.5rem}}
:is(html:root:root,:host) a.flex > span.font-display.text-xl,
:is(html:root:root,:host) a.flex > span.font-display.text-xl > span{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.125rem}
@media (min-width:768px){:is(html:root:root,:host) a.flex > span.font-display.text-xl,
:is(html:root:root,:host) a.flex > span.font-display.text-xl > span{font-size:1.25rem}}
:is(html:root:root,:host) .mt-4 > span.rounded-full.px-3{font-family:var(--ck-font-body);font-weight:700;line-height:1.33;letter-spacing:0.025em;text-transform:uppercase;font-size:0.75rem}
:is(html:root:root,:host) main > p.mt-6.text-xs.font-semibold{font-family:var(--ck-font-body);font-weight:400;line-height:1.33;letter-spacing:normal;text-transform:none;font-size:0.75rem}
:is(html:root:root,:host) .qikink-pdp__size-chart-table td,
:is(html:root:root,:host) .qikink-pdp__size-chart-table th{font-family:var(--ck-font-body);font-weight:400;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) .qikink-pdp__size-chart-table tr:first-child td,
:is(html:root:root,:host) .qikink-pdp__size-chart-table tr:first-child th,
:is(html:root:root,:host) .qikink-pdp__size-chart-table td:first-child,
:is(html:root:root,:host) .qikink-pdp__size-chart-table th:first-child{font-family:var(--ck-font-body);font-weight:700;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) .mobile-navigation ul > li.menu-item > a, :is(html:root:root,:host) .mobile-navigation-categories ul > li.menu-item > a{padding-block:var(--ck-space-4)}
:is(html:root:root,:host) .mobile-navigation .dropdown-toggle, :is(html:root:root,:host) .mobile-navigation-categories .dropdown-toggle{padding-block:var(--ck-space-4)}
:is(html:root:root,:host) .printbe-mobile-nav .mobile-nav-tabs{padding-inline:var(--ck-space-8)}
:is(html:root:root,:host) .printbe-mobile-nav .mobile-nav-tabs ul .mobile-pages-title{margin-right:var(--ck-space-4)}
:is(html:root:root,:host) .site-header-cart-side .cart-side-heading{padding:var(--ck-space-4)}
:is(html:root:root,:host) .site-header-cart-side .close-cart-side{padding-right:var(--ck-space-4)}
:is(html:root:root,:host) .widget_shopping_cart .woocommerce-mini-cart__empty-message{margin:var(--ck-space-6)}
:is(html:root:root,:host) .qikink-pdp__faqs details p, :is(html:root:root,:host) .qikink-pdp__product-faqs details p, :is(html:root:root,:host) body.ck-shop-page .qikink-pdp__faqs details p{margin-bottom:var(--ck-space-4)}
:is(html:root:root,:host) .qikink-pdp__related-grid .qikink-pdp__related-body{gap:var(--ck-space-2)}
:is(html:root:root,:host) .mobile-navigation.mobile-pages-menu{padding-right:var(--ck-space-8)}
:is(html:root:root,:host) .ck-desk-nav{gap:var(--ck-space-6)}
:is(html:root:root,:host) .ck-nav{gap:var(--ck-space-6)}
:is(html:root:root,:host) .qikink-pdp__size-chart-table-wrap table{margin-bottom:var(--ck-space-6)}

/* ---- g2 ---- */
:is(html:root:root,:host) section > h2.font-display.text-2xl,
:is(html:root:root,:host) .mt-12 > p.font-display.text-2xl,
:is(html:root:root,:host) p.font-display.text-3xl.uppercase{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.5rem}
@media (min-width:768px){:is(html:root:root,:host) section > h2.font-display.text-2xl,
:is(html:root:root,:host) .mt-12 > p.font-display.text-2xl,
:is(html:root:root,:host) p.font-display.text-3xl.uppercase{font-size:1.875rem}}
:is(html:root:root,:host) p.font-display.text-xl.uppercase{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.125rem}
@media (min-width:768px){:is(html:root:root,:host) p.font-display.text-xl.uppercase{font-size:1.25rem}}
:host p > a{font-family:var(--ck-font-body);font-weight:600;line-height:1.5;letter-spacing:normal;text-transform:none;font-size:1rem}
:host p > small,
:host small > a{font-family:var(--ck-font-body);font-weight:400;line-height:1.33;letter-spacing:normal;text-transform:none;font-size:0.75rem}
:host p > strong{line-height:inherit}
:host small > a{font-weight:600}
:is(html:root:root,:host) .mobile-navigation.mobile-pages-menu{padding-left:var(--ck-space-8)}

/* ---- g3 ---- */
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-navigation-link a{font-family:var(--ck-font-body);font-weight:600;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content .woocommerce-form-row label,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content .form-row label,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content label .required{font-family:var(--ck-font-body);font-weight:600;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content input.input-text,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content select,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content textarea,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content .woocommerce-Input{font-family:var(--ck-font-body);font-weight:400;line-height:1.5;letter-spacing:normal;text-transform:none;font-size:1rem}
:is(html:root:root,:host) body.ck-shop-page .ck-acct-eyebrow{font-family:var(--ck-font-body);font-weight:700;line-height:1.33;letter-spacing:0.2em;text-transform:uppercase;font-size:0.75rem}
:is(html:root:root,:host) body.ck-shop-page .ck-acct-title{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.5rem}
@media (min-width:768px){:is(html:root:root,:host) body.ck-shop-page .ck-acct-title{font-size:1.875rem}}
:is(html:root:root,:host) body.ck-shop-page .ck-acct-hello{font-family:var(--ck-font-body);font-weight:400;line-height:1.5;letter-spacing:normal;text-transform:none;font-size:1.125rem}
:is(html:root:root,:host) body.ck-shop-page .ck-acct-hello strong,
:is(html:root:root,:host) body.ck-shop-page .ck-acct-hello a{font-family:var(--ck-font-body);font-weight:700;line-height:1.5;letter-spacing:normal;text-transform:none;font-size:1.125rem}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-orders-table time{font-family:var(--ck-font-body);font-weight:400;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-orders-table__header,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-orders-table__header .nobr{font-family:var(--ck-font-body);font-weight:700;line-height:1.33;letter-spacing:0.025em;text-transform:uppercase;font-size:0.75rem}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-table th,
:is(html:root:root,:host) .wc-block-components-order-summary-item__description h3{font-family:var(--ck-font-body);font-weight:700;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-table .woocommerce-Price-amount,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-table .woocommerce-Price-amount bdi,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-table .woocommerce-Price-currencySymbol{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:normal;text-transform:none;font-size:1.125rem}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-order-details__title,
:is(html:root:root,:host) .wc-block-components-checkout-step__heading h2{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.25rem}
@media (min-width:768px){:is(html:root:root,:host) body.ck-shop-page .woocommerce-order-details__title,
:is(html:root:root,:host) .wc-block-components-checkout-step__heading h2{font-size:1.5rem}}
:is(html:root:root,:host) .wc-block-components-radio-control__label,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content .woocommerce-info,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-orders-table__cell > p{font-family:var(--ck-font-body);font-weight:400;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-column__title{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.5rem}
@media (min-width:768px){:is(html:root:root,:host) body.ck-shop-page .woocommerce-column__title{font-size:1.875rem}}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content form > h2{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.25rem}
@media (min-width:768px){:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content form > h2{font-size:1.5rem}}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-Address-title h2{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.125rem}
@media (min-width:768px){:is(html:root:root,:host) body.ck-shop-page .woocommerce-Address-title h2{font-size:1.25rem}}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content legend{font-family:var(--ck-font-body);font-weight:600;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content em{font-family:var(--ck-font-body);font-weight:400;line-height:1.33;letter-spacing:normal;text-transform:none;font-size:0.75rem}
:is(html:root:root,:host) .qke-pin-chip{letter-spacing:normal}
:is(html:root:root,:host) mark.order-number{line-height:inherit}
:is(html:root:root,:host) .woocommerce-order-overview__order > strong{line-height:inherit}
:is(html:root:root,:host) .qke-pin-chip{padding-inline:var(--ck-space-4)}
:is(html:root:root,:host) .qke-pin-box{margin-top:var(--ck-space-2)}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content .woocommerce-form-row label{margin-bottom:var(--ck-space-1)}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content .form-row label{margin-bottom:var(--ck-space-1)}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content input.input-text{padding:var(--ck-space-3) var(--ck-space-4)}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content select{padding:var(--ck-space-3) var(--ck-space-4)}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content textarea{padding:var(--ck-space-3) var(--ck-space-4)}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-MyAccount-content .woocommerce-Input{padding:var(--ck-space-3) var(--ck-space-4)}
:is(html:root:root,:host) .wc-block-cart-item__image{padding-block:var(--ck-space-6)}
:is(html:root:root,:host) .wc-block-cart-items .wc-block-cart-items__row{padding-top:var(--ck-space-8)}
:is(html:root:root,:host) .wc-block-cart-items__header th{padding-block:var(--ck-space-3)}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-order-overview__order{padding-inline:var(--ck-space-6)}
:is(html:root:root,:host) mark.order-number{padding-inline:var(--ck-space-2)}
:is(html:root:root,:host) .wc-block-checkout__actions{margin-bottom:var(--ck-space-8)}
:is(html:root:root,:host) .checkout-order-summary-block-fill-wrapper{padding-bottom:var(--ck-space-8)}

/* ---- g4 ---- */
:is(html:root:root,:host) .qke-cw-title{font-family:var(--ck-font-body);font-weight:700;line-height:1.5;letter-spacing:normal;text-transform:none;font-size:1.125rem}
:is(html:root:root,:host) .qke-cw-message{font-family:var(--ck-font-body);font-weight:400;line-height:1.5;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) .qke-cw-btn{font-family:var(--ck-font-body);font-weight:700;line-height:1.5;letter-spacing:normal;text-transform:none;font-size:1rem}
:host form[data-ck-contact] input,
:host form[data-ck-contact] textarea{font-family:var(--ck-font-body);font-weight:400;line-height:1.5;letter-spacing:normal;text-transform:none;font-size:1rem}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-error li,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-message,
:is(html:root:root,:host) body.ck-shop-page .woocommerce-info,
:is(html:root:root,:host) .woocommerce-error li{font-family:var(--ck-font-body);font-weight:400;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) .qikink-tracking-eyebrow{font-family:var(--ck-font-body);font-weight:700;line-height:1.33;letter-spacing:0.2em;text-transform:uppercase;font-size:0.75rem}
:is(html:root:root,:host) .qikink-tracking-title{font-family:var(--ck-font-display);font-weight:400;line-height:1.2;letter-spacing:-0.025em;text-transform:uppercase;font-size:1.5rem}
@media (min-width:768px){:is(html:root:root,:host) .qikink-tracking-title{font-size:1.875rem}}
:is(html:root:root,:host) .woocommerce-form-track-order label,
:is(html:root:root,:host) form.track_order label{font-family:var(--ck-font-body);font-weight:600;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) .woocommerce-form-track-order input.input-text,
:is(html:root:root,:host) form.track_order input.input-text{font-family:var(--ck-font-body);font-weight:400;line-height:1.5;letter-spacing:normal;text-transform:none;font-size:1rem}
:is(html:root:root,:host) body.ck-shop-page .woocommerce-password-hint{font-family:var(--ck-font-body);font-weight:400;line-height:1.33;letter-spacing:normal;text-transform:none;font-size:0.75rem}
:is(html:root:root,:host) body.ck-shop-page #password_strength{font-family:var(--ck-font-body);font-weight:400;line-height:1.43;letter-spacing:normal;text-transform:none;font-size:0.875rem}
:is(html:root:root,:host) .qke-cw-backdrop{font-family:var(--ck-font-body);background:rgba(26,24,22,.55)}
:is(html:root:root,:host) .qke-cw-card{background:var(--ck-white);color:var(--ck-ink);padding:var(--ck-modal-pad)}
:is(html:root:root,:host) .qke-cw-title{margin:0 0 var(--ck-space-2);color:var(--ck-ink)}
:is(html:root:root,:host) .qke-cw-message{margin:0 0 var(--ck-space-6);color:var(--ck-ink-muted)}
:is(html:root:root,:host) .qke-cw-actions{gap:var(--ck-space-2)}
:is(html:root:root,:host) .qke-cw-btn{min-height:var(--ck-btn-h-md);padding:0 var(--ck-space-4);font-family:var(--ck-font-body)}
:is(html:root:root,:host) .qke-cw-btn-primary{background:var(--ck-coral-text-bg);color:#fff}
:is(html:root:root,:host) .qke-cw-btn-primary:hover{background:var(--ck-coral-text-bg-hover);color:#fff}
:is(html:root:root,:host) .qke-cw-btn-secondary{background:var(--ck-white);color:var(--ck-ink);border:1px solid var(--ck-ink)}
:is(html:root:root,:host) .qke-cw-btn-secondary:hover{background:var(--ck-cream);color:var(--ck-ink)}

/* ---- g5 ---- */
html body #qikink-konva-editor.qke-root{--qke-primary:#f04a2a !important;--qke-primary-hover:#1a1816 !important;--qke-text:#1a1816 !important;--qke-text-secondary:rgba(26,24,22,.7) !important;--qke-border:rgba(26,24,22,.15) !important;--qke-bg-secondary:#f6f4ec !important;--qke-bg-accent:#f6f4ec !important;font-family:var(--ck-font-body) !important}

html body #qikink-konva-editor .qke-title{font-family:var(--ck-font-display) !important;font-weight:400 !important;font-size:1.125rem !important;line-height:1.2 !important;letter-spacing:-.025em !important;text-transform:uppercase !important;color:var(--ck-ink) !important}
@media (min-width:768px){html body #qikink-konva-editor .qke-title{font-size:1.25rem !important}}
html body #qikink-konva-editor .qke-mode-toggle{background:var(--ck-cream) !important}
html body #qikink-konva-editor .qke-mode-btn{font-family:var(--ck-font-body) !important;font-weight:700 !important;font-size:.875rem !important;line-height:1.43 !important;color:var(--ck-ink) !important}
html body #qikink-konva-editor .qke-mode-btn.is-active{background:var(--ck-coral-text-bg) !important;color:#fff !important}

html body #qikink-konva-editor .qke-tool-label{font-family:var(--ck-font-body) !important;font-weight:400 !important;font-size:.75rem !important;line-height:1.33 !important;color:var(--ck-ink) !important}
html body #qikink-konva-editor .qke-tool-button.is-active{background:var(--ck-cream) !important;color:var(--ck-ink) !important;box-shadow:inset 3px 0 0 var(--ck-coral) !important}
html body #qikink-konva-editor .qke-tool-button.is-active .qke-tool-label{color:var(--ck-ink) !important}
html body #qikink-konva-editor .qke-mobile-tab.is-active{background:var(--ck-cream) !important}

html body #qikink-konva-editor .qke-view-tab{font-family:var(--ck-font-body) !important;font-weight:600 !important;font-size:.875rem !important;line-height:1.43 !important;color:var(--ck-ink) !important;background:var(--ck-white) !important;border:1px solid var(--ck-line) !important}
html body #qikink-konva-editor .qke-view-tab.is-active{background:var(--ck-coral-text-bg) !important;color:#fff !important;border-color:var(--ck-coral-text-bg) !important}

html body #qikink-konva-editor .qke-panel-title-text{font-family:var(--ck-font-body) !important;font-weight:700 !important;font-size:.875rem !important;line-height:1.43 !important;letter-spacing:.025em !important;text-transform:uppercase !important;color:var(--ck-ink) !important}
html body #qikink-konva-editor .qke-product-section-title,html body #qikink-konva-editor .qke-text-section-label,html body #qikink-konva-editor .qke-graphics-category-title,html body #qikink-konva-editor .qke-text-section-title,html body #qikink-konva-editor .qke-text-discover-title{font-family:var(--ck-font-body) !important;font-weight:600 !important;font-size:.875rem !important;line-height:1.43 !important;color:var(--ck-ink) !important}
html body #qikink-konva-editor .qke-option-button{font-family:var(--ck-font-body) !important;font-weight:600 !important;font-size:.875rem !important;line-height:1.43 !important;color:var(--ck-ink) !important;border:1px solid var(--ck-line) !important;background:var(--ck-white) !important}
html body #qikink-konva-editor .qke-option-button.qke-size-button{font-size:.75rem !important;line-height:1.33 !important;font-weight:700 !important;text-transform:uppercase !important;letter-spacing:.025em !important}
html body #qikink-konva-editor .qke-option-button.is-selected{border-color:var(--ck-ink) !important;box-shadow:inset 0 0 0 1px var(--ck-ink) !important}
html body #qikink-konva-editor .qke-color-swatch.is-selected{border-color:var(--ck-ink) !important}
html body #qikink-konva-editor .qke-qty-label{font-weight:400 !important;font-size:.875rem !important;color:var(--ck-ink-muted) !important}
html body #qikink-konva-editor .qke-quantity-input,html body #qikink-konva-editor .qke-zoom-percent{font-family:var(--ck-font-body) !important;font-size:1rem !important}
html body #qikink-konva-editor .qke-layers-empty-copy,html body #qikink-konva-editor .qke-loading-label,html body #qikink-konva-editor .qke-text-counter{color:var(--ck-ink-muted) !important;font-size:.75rem !important}
html body #qikink-konva-editor .qke-graphics-view-more,html body #qikink-konva-editor .qke-text-view-more{color:var(--ck-ink) !important;font-weight:700 !important;text-decoration:underline !important;text-decoration-color:var(--ck-coral) !important;text-underline-offset:3px !important}

html body #qikink-konva-editor .qke-footer{background:var(--ck-cream) !important}
html body #qikink-konva-editor .qke-atc-button,html body #qikink-konva-editor .qke-mobile-cart-fab{background:var(--ck-coral-text-bg) !important;color:#fff !important}
html body #qikink-konva-editor .qke-atc-label{color:#fff !important;font-weight:700 !important}

html body #qikink-konva-editor .qke-design-files-backdrop{background:rgba(26,24,22,.55) !important}
html body #qikink-konva-editor .qke-design-files-title{font-family:var(--ck-font-display) !important;font-weight:400 !important;font-size:1.125rem !important;line-height:1.2 !important;letter-spacing:-.025em !important;text-transform:uppercase !important;color:var(--ck-ink) !important}
html body #qikink-konva-editor .qke-design-files-label,html body #qikink-konva-editor .qke-design-files-hint{font-weight:400 !important;font-size:.875rem !important;color:var(--ck-ink) !important}
html body #qikink-konva-editor .qke-design-files-required{color:var(--ck-coral) !important}
html body #qikink-konva-editor .qke-design-files-dropzone{background:var(--ck-cream) !important;border-color:var(--ck-ink) !important}
html body #qikink-konva-editor .qke-design-files-apply{background:var(--ck-coral-text-bg) !important;color:#fff !important;font-weight:700 !important}


html body #qikink-konva-editor .qke-header,html body #qikink-konva-editor .qke-mode-toggle,html body #qikink-konva-editor .qke-quantity-input,html body #qikink-konva-editor .qke-zoom-percent,html body #qikink-konva-editor .qke-text-font-search,html body #qikink-konva-editor .qke-graphics-search,html body #qikink-konva-editor .qke-graphics-thumb,html body #qikink-konva-editor .qke-text-preset-card{border-color:var(--ck-line) !important}
html body #qikink-konva-editor .qke-design-files-header,html body #qikink-konva-editor .qke-design-files-footer{border-color:var(--ck-line) !important}
html body #qikink-konva-editor .qke-mode-btn.qke-mode-btn--inactive,html body #qikink-konva-editor .qke-graphics-thumb,html body #qikink-konva-editor .qke-text-preset-card,html body #qikink-konva-editor .qke-preview-banner,html body #qikink-konva-editor .qke-layers-empty-art,html body #qikink-konva-editor .qke-product-thumbnail,html body #qikink-konva-editor .qke-panel-close-btn,html body #qikink-konva-editor .qke-design-files-close{background:var(--ck-cream) !important}
html body #qikink-konva-editor .qke-design-files-icon{background:var(--ck-coral-text-bg) !important;color:#fff !important}
html body #qikink-konva-editor .qke-sheet-scrim{background:rgba(26,24,22,.55) !important}
html body #qikink-konva-editor .qke-text-section-title,html body #qikink-konva-editor .qke-text-discover-title,html body #qikink-konva-editor .qke-graphics-category-title{text-transform:none !important;letter-spacing:normal !important;font-family:var(--ck-font-body) !important}
html body #qikink-konva-editor .qke-product-name,html body #qikink-konva-editor .qke-design-files-title{font-size:1.125rem !important}
@media (min-width:768px){html body #qikink-konva-editor .qke-product-name,html body #qikink-konva-editor .qke-design-files-title{font-size:1.25rem !important}}
html body #qikink-konva-editor .qke-preview-banner-title{line-height:1.2 !important}
html body #qikink-konva-editor .qke-design-files-required{font-weight:700 !important}
html body #qikink-konva-editor .qke-mode-btn.is-active:hover,html body #qikink-konva-editor .qke-view-tab.is-active:hover,html body #qikink-konva-editor .qke-atc-button:not(:disabled):hover,html body #qikink-konva-editor .qke-mobile-cart-fab:not(:disabled):hover,html body #qikink-konva-editor .qke-design-files-apply:not(:disabled):hover,html body #qikink-konva-editor .qke-atc-button:not(:disabled):active,html body #qikink-konva-editor .qke-mobile-cart-fab:not(:disabled):active,html body #qikink-konva-editor .qke-design-files-apply:not(:disabled):active{background:var(--ck-coral-text-bg-hover) !important;color:#fff !important}

/* ---- g6 ---- */
/* ===== batch A and B (appended verbatim by gen_system.py) =====
   A: heading overflow, links, white text on coral, stray borders, header line.  B: one focus system.
   Rules use :is(html:root:root,:host) so they apply in the page and inside the shadow-DOM pages. */

/* ---- A2/B1 root cause: the theme and the Elementor kit define a purple "primary" (#5137ff), and a blue WordPress admin accent is used by select2 and swiper.
   Remapping them puts every theme hover, border and highlight on our palette in one place. */
:root,
html:root body[class] {
	--e-global-color-primary: #f04a2a;
	--e-global-color-secondary: #1a1816;
	--e-global-color-text: #1a1816;
	--e-global-color-accent: #1a1816;
	--e-global-color-dark: #1a1816;
	--e-global-color-lighter: rgba(26, 24, 22, 0.7);
	--e-global-color-border: rgba(26, 24, 22, 0.15);
	--swiper-theme-color: #f04a2a;
	--wp-admin-theme-color: #1a1816;
	--wp-admin-theme-color-darker-10: #1a1816;
	--wp-admin-theme-color-darker-20: #1a1816;
}

/* ---- A2: places where a link or control still takes a theme colour */
:is(html:root:root,:host) .ck-plus:hover { color: var(--ck-ink); }
:is(html:root:root,:host) .site-search .widget_product_search #searchsubmit:focus { color: var(--ck-ink); background: var(--ck-cream); box-shadow: none; }
:is(html:root:root,:host) .hentry .entry-content :is(.wp-block-archives, .wp-block-categories, .wp-block-rss, .wp-block-latest-comments, .wp-block-latest-posts, .wp-block-page-list) a:hover { color: var(--ck-ink); }
:is(html:root:root,:host) .select2-container--default .select2-results__option--highlighted[aria-selected],
:is(html:root:root,:host) .select2-container--default .select2-results__option--highlighted[data-selected] { background: var(--ck-ink); color: #fff; }

/* ---- A1: headings stay inside their box */
:is(html:root:root,:host) :is(h1, h2, h3, h4, h5, h6, .ck-display, .font-display, .ck-mini__title) { overflow-wrap: anywhere; max-width: 100%; min-width: 0; }
:is(html:root:root,:host) .ck-mini { min-width: 0; }
@media (min-width: 1024px) {
	/* the grid was drawn for six small tiles (span 2 of 12); with the real categories the tiles share the row */
	.ck-bento > :first-child:nth-last-child(5) ~ .ck-mini { grid-column: span 4; }
	.ck-bento > :first-child:nth-last-child(4) ~ .ck-mini { grid-column: span 6; }
	.ck-bento > :first-child:nth-last-child(6) ~ .ck-mini { grid-column: span 3; }
}
@media (max-width: 767.98px) {
	:is(html:root:root,:host) .ck-hero__title { font-size: min(3rem, 10.4vw); }
}

/* ---- A3: white text and icons on every coral fill (site pages) */
:is(html:root:root,:host) :is(
	span.ck-pill, a.ck-btn--coral, .ck-mini--coral, .ck-mini--coral *, .bg-coral, .bg-coral *, span.qikink-pdp__badge,
	.woocommerce button.button, .woocommerce a.button, .woocommerce-page button.button, .woocommerce-page a.button, .woocommerce input.button,
	.wc-block-components-button:not(.is-link):not(.wc-block-components-button--outlined), .wc-block-components-button:not(.is-link) .wc-block-components-button__text,
	.qke-cw-btn-primary, [class*="hover:bg-coral"]:hover, .ck-slider__btn:hover:not(:disabled), .ck-slider__btn:active:not(:disabled)
) { color: #fff !important; }
:is(html:root:root,:host) :is(a.ck-btn--coral, .woocommerce button.button, .woocommerce a.button, .wc-block-components-button:not(.is-link), .qke-cw-btn-primary):is(:hover, :focus, :active, :visited) {
	color: #fff !important;
}
:is(html:root:root,:host) :is(.ck-btn--coral, .ck-mini--coral, .bg-coral) svg,
:is(html:root:root,:host) :is(.ck-btn--coral, .ck-mini--coral, .bg-coral) i { color: #fff; stroke: currentColor; }
:is(html:root:root,:host) .wc-block-components-checkbox__input:checked + .wc-block-components-checkbox__mark,
:is(html:root:root,:host) .wc-block-components-checkbox__mark { fill: #fff; color: #fff; }
:is(html:root:root,:host) .qke-cw-btn-primary:hover { background: var(--ck-ink); color: #fff !important; }
:is(html:root:root,:host) .printbe-mobile-nav .mobile-nav-tabs,
:is(html:root:root,:host) .printbe-mobile-nav .mobile-nav-tabs * { color: #fff !important; }

/* ---- A4: stray borders */
/* round arrow buttons on the home sliders: the grey 1px ring showed on the coral hover fill */
:is(html:root:root,:host) .ck-home button.ck-slider__btn:hover:not(:disabled),
:is(html:root:root,:host) .ck-home button.ck-slider__btn:active:not(:disabled),
:is(html:root:root,:host) .ck-home button.ck-slider__btn:focus-visible { background: var(--ck-coral); border-color: var(--ck-coral); }
/* "Edit billing / shipping address": a grey outline on a pill is not part of the button spec; it is a link */
:is(html:root:root,:host) body.ck-shop-page .woocommerce-Address a.edit { border: 0; background: transparent; padding: 0 var(--ck-space-1); min-height: var(--ck-tap); text-decoration: underline; text-decoration-color: var(--ck-coral); text-underline-offset: 3px; color: var(--ck-ink); font-weight: 600; font-size: 0.875rem; }
:is(html:root:root,:host) body.ck-shop-page .woocommerce-Address a.edit:hover { background: transparent; border: 0; color: var(--ck-ink); text-decoration-thickness: 2px; }

/* ---- A5: header line: fixed at the source (lovable-props.css now loads on every shop page; see class-customkaro-lovable.php) */

/* ---- B2: one focus system */
:root, :host { -webkit-tap-highlight-color: transparent; }
:is(html:root:root,:host) * { -webkit-tap-highlight-color: transparent; }
/* keyboard focus: 2px ink ring, 2px offset */
:is(html:root:root,:host) :is(a, button, summary, input, select, textarea, label, [role="button"], [role="tab"], [role="menuitem"], [tabindex]:not([tabindex="-1"])):focus-visible {
	outline: 2px solid var(--ck-ink) !important;
	outline-offset: 2px !important;
	box-shadow: none;
}
/* controls with their own coral or ink fill: white ring drawn inside, so it is never clipped and never lost on the fill */
:is(html:root:root,:host) :is(
	a.ck-btn:not(.ck-btn--ghost), .ck-btn--coral, .ck-cart, .ck-mini--coral, a.bg-coral, button.bg-coral, a.bg-ink, button.bg-ink, .bg-coral:is(a, button), .bg-ink:is(a, button),
	.woocommerce button.button, .woocommerce a.button, .woocommerce-page button.button, .woocommerce-page a.button, .woocommerce input.button,
	.wc-block-components-button:not(.is-link), .qke-cw-btn-primary, .qikink-pdp__pill.is-selected, .qikink-pdp__design-now, .ck-slider__btn:hover
):focus-visible {
	outline: 2px solid #fff !important;
	outline-offset: -4px !important;
}
/* controls on dark sections (footer, how-it-works, hero, marquee) */
:is(html:root:root,:host) :is(footer, .bg-ink, .ck-footer, .ck-how, .ck-hero, .ck-marquee, [class*="bg-ink"]) :is(a, button, summary):focus-visible { outline-color: #fff !important; }
/* inputs, selects, textareas: ink border on focus, plus the ring; no blue glow */
:is(html:root:root,:host) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]):not(.wc-block-components-quantity-selector__input), select, textarea):is(:focus, :focus-visible) {
	border-color: var(--ck-ink) !important;
	outline: 2px solid var(--ck-ink) !important;
	outline-offset: 2px !important;
	box-shadow: none !important;
}
:is(html:root:root,:host) .select2-container--default.select2-container--focus .select2-selection--single,
:is(html:root:root,:host) .select2-container--default.select2-container--open .select2-selection--single { border-color: var(--ck-ink); outline: 2px solid var(--ck-ink); outline-offset: 2px; }
/* a mouse click leaves no ring (links, buttons, summaries only; text fields keep theirs) */
:is(html:root:root,:host) :is(a, button, summary, [role="button"], [role="tab"]):focus:not(:focus-visible) { outline: none !important; box-shadow: none; }

/* rings that would be clipped by an overflow:hidden parent are drawn inside; focusable scrollers get a ring too */
:is(html:root:root,:host) :is(
	.wc-block-components-quantity-selector input, .wc-block-components-quantity-selector button, .wc-block-components-panel__button, .wc-block-components-checkbox input,
	.wc-block-components-checkout-order-summary__title, .qikink-pdp__thumbs, .qikink-pdp__related-card, .ck-product a, .ck-product > a
):focus-visible:focus-visible {
	outline: 2px solid var(--ck-ink) !important;
	outline-offset: -2px !important;
}

/* keep a focused control clear of the sticky header and the screen edge, so its ring is never cut off */
html { scroll-padding-top: 5rem; scroll-padding-bottom: 6rem; }
:is(html:root:root,:host) :is(a, button, summary, input, select, textarea, [tabindex]):focus-visible { scroll-margin: 0.75rem; }

/* ---- A3 (decision: darker coral behind text): every coral fill that carries text uses --ck-coral-text-bg (white text 4.5:1);
   hover/active use --ck-coral-text-bg-hover. Decorative coral (logo, underlines, bars, the empty arrow circle, borders) keeps --ck-coral. */
:is(html:root:root,:host) :is(
	span.ck-pill, a.ck-btn--coral, .ck-mini--coral, .bg-coral:not(:empty):not(.ck-slider__btn), span.qikink-pdp__badge,
	.woocommerce button.button, .woocommerce a.button, .woocommerce-page button.button, .woocommerce-page a.button, .woocommerce input.button,
	.wc-block-components-button:not(.is-link):not(.wc-block-components-button--outlined),
	.printbe-mobile-nav .mobile-nav-tabs, [class*="hover:bg-coral"]:hover
) { background-color: var(--ck-coral-text-bg); }
:is(html:root:root,:host) :is(
	a.ck-btn--coral, .ck-mini--coral, .bg-coral:is(a, button):not(.ck-slider__btn),
	.woocommerce button.button, .woocommerce a.button, .woocommerce-page button.button, .woocommerce-page a.button, .woocommerce input.button,
	.wc-block-components-button:not(.is-link):not(.wc-block-components-button--outlined)
):is(:hover, :active):not(:disabled):not([aria-disabled="true"]) { background-color: var(--ck-coral-text-bg-hover); color: #fff !important; }
:is(html:root:root,:host) .qke-cw-btn-primary:hover { background: var(--ck-coral-text-bg-hover); }
/* the cart/checkout block buttons are still set with !important in customkaro-shop-skin.css (to be removed in Stage 3) */
:is(html:root:root,:host) body.ck-shop-page :is(.wc-block-components-button:not(.wc-block-components-button--outlined):not(.is-link), .wc-block-cart__submit-button) { background: var(--ck-coral-text-bg) !important; color: #fff !important; }
:is(html:root:root,:host) body.ck-shop-page :is(.wc-block-components-button:not(.wc-block-components-button--outlined):not(.is-link), .wc-block-cart__submit-button):is(:hover, :active):not(:disabled) { background: var(--ck-coral-text-bg-hover) !important; color: #fff !important; }

/* ---- checkout order summary (mobile accordion): the title sat flush against the card edge (0 side padding) and WC's own top/bottom separator lines doubled the card border */
:is(html:root:root,:host) body.ck-shop-page .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__title {
	padding: var(--ck-space-4);
	border-top: 0;
}
:is(html:root:root,:host) body.ck-shop-page .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__title:not(.is-open) { border-bottom: 0; }
:is(html:root:root,:host) body.ck-shop-page .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__title.is-open { border-bottom: 1px solid var(--ck-line); }
/* the opened accordion has its rows flush to the card edge on the mobile/medium layout (the large layout already pads each row 16px) */
:is(html:root:root,:host) body.ck-shop-page .wc-block-components-sidebar-layout:is(.is-mobile, .is-small, .is-medium) .wc-block-components-checkout-order-summary__content { padding-inline: var(--ck-space-4); }

/* ---- cart: with quantity 1 the unit price under the name repeats the line total; show it only from quantity 2 (CSS only, markup and totals untouched).
   The checkout order summary has no quantity attribute to key on, so it is not handled here. */
:is(html:root:root,:host) body.ck-shop-page .wc-block-cart-items__row:has(input.wc-block-components-quantity-selector__input[value="1"]) .wc-block-cart-item__prices { display: none; }
:is(html:root:root,:host) body.ck-shop-page .wc-block-components-order-summary-item[data-ck-qty="1"] .wc-block-components-order-summary-item__individual-prices { display: none; }

/* ---- home category tiles: one tile per row below 768px (the coral tile was squeezed beside the T-shirts card) */
@media (max-width: 767.98px) {
	:is(html:root:root,:host) .ck-bento { gap: var(--ck-space-4); }
	:is(html:root:root,:host) .ck-bento > :is(.ck-cat, .ck-mini, .ck-mini--coral) { grid-column: 1 / -1; }
	:is(html:root:root,:host) .ck-mini--coral { min-height: 0; padding: var(--ck-space-5); justify-content: flex-start; }
	:is(html:root:root,:host) .ck-mini__title { overflow-wrap: break-word; word-break: normal; hyphens: manual; }
}

/* ---- Stage 3: form controls and Woo block buttons fall back to the theme's Inter; give them the body font (element/class level so any role rule still wins) */
button, input, select, textarea, .wc-block-components-button { font-family: var(--ck-font-body); }
/* the cart's "Proceed to checkout" link-button: same button spec as the checkout's Place Order (it kept the theme's Inter 600 capitalised) */
:is(html:root:root,:host) body.ck-shop-page a.wc-block-components-button.wc-block-cart__submit-button { font-family: var(--ck-font-body); font-weight: 700; text-transform: none; letter-spacing: normal; }

/* ---- Stage 3 / spec test: values still outside the token spec, moved onto the nearest role/step ---- */
/* theme buttons carry 0.01em tracking; the button roles have none */
:is(html:root:root,:host) :is(button.button, button.woocommerce-Button, button.woocommerce-button, button.ck-login-tab, button.ck-pw-toggle, button.ck-menu-btn, button.qikink-pdp__slider-next, button.qikink-pdp__slider-prev, .woocommerce form label span) { letter-spacing: normal; }
/* design-studio step chips: Tailwind tracking-wider (0.05em) -> caps tracking token */
:is(html:root:root,:host) :is(.tracking-wider) { letter-spacing: var(--ck-ls-caps); }
/* line-heights to role values */
:is(html:root:root,:host) body.ck-shop-page .entry-content h2 { line-height: 1.2; }
:is(html:root:root,:host) h2.wp-block-heading { line-height: 1.2; }
:is(html:root:root,:host) p.font-display { line-height: 1.43; }
:is(html:root:root,:host) .qikink-pdp__pd-text { line-height: 1.6; }
:is(html:root:root,:host) .qikink-pdp__pill.qikink-pdp__choice { padding-top: var(--ck-space-1); padding-bottom: var(--ck-space-1); }
:is(html:root:root,:host) body.ck-shop-page .col-full { padding-bottom: var(--ck-space-16); }
/* hero title on phones: the 36px h1 step instead of a fluid size */
@media (max-width: 767.98px) { :is(html:root:root,:host) .ck-hero__title { font-size: var(--ck-fs-36); } }
/* login / lost-password screen */
:is(html:root:root,:host) body.ck-login-screen .ck-login-card { padding: var(--ck-space-6); }
:is(html:root:root,:host) body.ck-login-screen .ck-login-title { font-size: var(--ck-fs-24); }
:is(html:root:root,:host) body.ck-login-screen .ck-login-sub, :is(html:root:root,:host) body.ck-login-screen .ck-login-card--plain form.lost_reset_password p:first-child { font-size: var(--ck-fs-16); }
:is(html:root:root,:host) body.ck-login-screen .ck-login-tab { font-size: var(--ck-fs-14); }
:is(html:root:root,:host) body.ck-login-screen .ck-login-foot, :is(html:root:root,:host) body.ck-login-screen .ck-login-card .woocommerce-privacy-policy-text p, :is(html:root:root,:host) body.ck-login-screen .ck-login-foot a { font-size: var(--ck-fs-14); }
:is(html:root:root,:host) body.ck-login-screen .ck-login-card :is(label, label span, .required) { line-height: 1.43; }
:is(html:root:root,:host) body.ck-login-screen .ck-login-card button.button { line-height: 1.5; }
:is(html:root:root,:host) body.ck-login-screen .ck-login-card input.woocommerce-Input { padding: var(--ck-space-3) var(--ck-space-4); }
/* order tracking form */
:is(html:root:root,:host) body.ck-shop-page .woocommerce-form-track-order :is(.column-desktop-2, .column-desktop-5) { padding-left: var(--ck-space-4); padding-right: var(--ck-space-4); }
:is(html:root:root,:host) body.ck-shop-page .woocommerce-form-track-order input.input-text { padding-left: var(--ck-space-8); padding-right: var(--ck-space-8); }
:is(html:root:root,:host) main h2:not([class]) { line-height: 1.2; }
@media (min-width: 641px) { :is(html:root:root,:host) body.ck-shop-page.ck-home-page #content .col-full { padding-bottom: var(--ck-space-16); } }

/* ---- Razorpay "pay for order" page (order-pay): overview strip, message and the Pay Now / Cancel buttons. CSS only: markup, ids and the Razorpay script are untouched. */
:is(html:root:root,:host) body.woocommerce-order-pay .entry-content > .woocommerce { max-width: var(--ck-container-text); margin-inline: auto; text-align: left; }
:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details {
	display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 2fr);
	max-width: none; margin: 0 0 var(--ck-space-8); padding: 0; list-style: none; overflow: hidden;
	background: var(--ck-white); border: 1px solid var(--ck-line); border-radius: 1rem;
}
:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li {
	float: none; margin: 0; padding: var(--ck-space-4); text-align: left; border: 0; border-left: 1px solid var(--ck-line);
	font-size: var(--ck-fs-14); line-height: 1.43; font-weight: 400; color: var(--ck-ink-muted); text-transform: none; letter-spacing: normal; overflow-wrap: break-word; text-wrap: balance;
}
:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li:first-child { border-left: 0; }
:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li strong { display: block; margin-top: var(--ck-space-1); font-size: var(--ck-fs-16); line-height: 1.5; font-weight: 700; color: var(--ck-ink); }
:is(html:root:root,:host) body.woocommerce-order-pay .entry-content > .woocommerce > p:not(:has(#btn-razorpay)):not(.woocommerce-info) { margin: 0 0 var(--ck-space-6); font-size: var(--ck-fs-16); line-height: 1.5; text-align: left; }
:is(html:root:root,:host) body.woocommerce-order-pay .entry-content > .woocommerce > p:has(#btn-razorpay) { display: flex; flex-wrap: wrap; gap: var(--ck-space-4); margin: 0; }
:is(html:root:root,:host) body.woocommerce-order-pay :is(#btn-razorpay, #btn-razorpay-cancel) {
	display: inline-flex; align-items: center; justify-content: center; min-height: var(--ck-btn-h-md); margin: 0; padding: 0 var(--ck-btn-px-md);
	border: 1px solid transparent; border-radius: 999px; font-family: var(--ck-font-body); font-size: var(--ck-fs-14); line-height: 1.43; font-weight: 700; letter-spacing: normal; text-transform: none; cursor: pointer;
}
:is(html:root:root,:host) body.woocommerce-order-pay #btn-razorpay { background: var(--ck-coral-text-bg); border-color: var(--ck-coral-text-bg); color: #fff; }
:is(html:root:root,:host) body.woocommerce-order-pay #btn-razorpay:is(:hover, :active, :focus) { background: var(--ck-coral-text-bg-hover); border-color: var(--ck-coral-text-bg-hover); color: #fff; }
:is(html:root:root,:host) body.woocommerce-order-pay #btn-razorpay:focus-visible { outline: 2px solid #fff !important; outline-offset: -4px !important; }
:is(html:root:root,:host) body.woocommerce-order-pay #btn-razorpay-cancel { background: var(--ck-white); border-color: var(--ck-ink); color: var(--ck-ink); }
:is(html:root:root,:host) body.woocommerce-order-pay #btn-razorpay-cancel:is(:hover, :active) { background: var(--ck-cream); border-color: var(--ck-ink); color: var(--ck-ink); }
@media (max-width: 767.98px) {
	:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details { display: block; }
	:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li { display: flex; justify-content: space-between; align-items: baseline; gap: var(--ck-space-4); border-left: 0; border-top: 1px solid var(--ck-line); text-wrap: wrap; }
	:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li:first-child { border-top: 0; }
	:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li strong { margin-top: 0; text-align: right; }
	:is(html:root:root,:host) body.woocommerce-order-pay .entry-content > .woocommerce > p:has(#btn-razorpay) { flex-direction: column; }
	:is(html:root:root,:host) body.woocommerce-order-pay :is(#btn-razorpay, #btn-razorpay-cancel) { width: 100%; }
}
/* the theme's clearfix pseudo-elements would become grid items; its dashed right border and 2em paddings are replaced by the spec dividers */
:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details::before, :is(html:root:root,:host) body.woocommerce-order-pay ul.order_details::after { display: none; content: none; }
:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li { border-right: 0; }
:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li { display: block; width: auto; justify-self: stretch; }
@media (max-width: 767.98px) { :is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li { display: flex; } }
@media (max-width: 767.98px) { :is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li { text-align: left; } :is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li strong { flex: 1 1 auto; } }
:is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li::before, :is(html:root:root,:host) body.woocommerce-order-pay ul.order_details li::after { display: none; content: none; }

/* ---- "Pay for order" form page (My Account > Pay): site spec instead of the theme's grey frame, uppercase display labels and Inter heading. CSS only. */
:is(html:root:root,:host) body.woocommerce-order-pay form#order_review { border: 0; border-radius: 0; background: transparent; padding: 0; box-shadow: none; }
:is(html:root:root,:host) body.woocommerce-order-pay form#order_review table.shop_table { table-layout: auto; margin: 0 0 var(--ck-space-6); }
:is(html:root:root,:host) body.woocommerce-order-pay form#order_review table.shop_table thead th {
	font-family: var(--ck-font-body); font-size: var(--ck-fs-12); font-weight: 700; line-height: 1.33; letter-spacing: var(--ck-ls-caps); text-transform: uppercase; color: var(--ck-ink-muted);
	padding: var(--ck-cell-py) var(--ck-cell-px); text-align: left; overflow-wrap: normal; word-break: normal; background: var(--ck-cream);
}
:is(html:root:root,:host) body.woocommerce-order-pay form#order_review table.shop_table tfoot th {
	font-family: var(--ck-font-body); font-size: var(--ck-fs-14); font-weight: 600; line-height: 1.43; letter-spacing: normal; text-transform: none; color: var(--ck-ink);
	padding: var(--ck-cell-py) var(--ck-cell-px); text-align: left; overflow-wrap: normal; word-break: normal; background: transparent;
}
:is(html:root:root,:host) body.woocommerce-order-pay form#order_review table.shop_table :is(td, tbody td, tfoot td) { font-family: var(--ck-font-body); font-size: var(--ck-fs-14); font-weight: 400; line-height: 1.43; padding: var(--ck-cell-py) var(--ck-cell-px); color: var(--ck-ink); text-align: right; }
:is(html:root:root,:host) body.woocommerce-order-pay form#order_review table.shop_table tfoot tr:last-child :is(th, td) { font-weight: 700; }
:is(html:root:root,:host) body.woocommerce-order-pay form#order_review table.shop_table thead th.product-total, :is(html:root:root,:host) body.woocommerce-order-pay form#order_review table.shop_table thead th.product-quantity { text-align: right; }
:is(html:root:root,:host) body.woocommerce-order-pay #payment { background: transparent; border-radius: 0; }
:is(html:root:root,:host) body.woocommerce-order-pay #payment ul.payment_methods { padding: 0; margin: 0 0 var(--ck-space-4); border: 0; list-style: none; }
:is(html:root:root,:host) body.woocommerce-order-pay #payment li.wc_payment_method { padding: var(--ck-space-3) var(--ck-space-4); background: var(--ck-white); border: 1px solid var(--ck-line); border-radius: 0.75rem; }
:is(html:root:root,:host) body.woocommerce-order-pay #payment li.wc_payment_method > label { font-family: var(--ck-font-body); font-size: var(--ck-fs-16); font-weight: 700; line-height: 1.5; letter-spacing: normal; text-transform: none; color: var(--ck-ink); }
:is(html:root:root,:host) body.woocommerce-order-pay #payment div.payment_box { padding: var(--ck-space-2) 0 0; margin: 0; background: transparent; font-size: var(--ck-fs-14); line-height: 1.43; color: var(--ck-ink-muted); }
:is(html:root:root,:host) body.woocommerce-order-pay #payment div.payment_box::before { display: none; }
:is(html:root:root,:host) body.woocommerce-order-pay #payment div.form-row { padding: var(--ck-space-4) 0 0; margin: 0; }
:is(html:root:root,:host) body.woocommerce-order-pay .woocommerce-privacy-policy-text, :is(html:root:root,:host) body.woocommerce-order-pay .woocommerce-privacy-policy-text p { font-size: var(--ck-fs-14); line-height: 1.43; color: var(--ck-ink-muted); margin: 0 0 var(--ck-space-4); }
:is(html:root:root,:host) body.woocommerce-order-pay .woocommerce-terms-and-conditions-wrapper { margin: 0 0 var(--ck-space-4); }
:is(html:root:root,:host) body.woocommerce-order-pay .woocommerce-form__label-for-checkbox { font-size: var(--ck-fs-16); font-weight: 400; line-height: 1.5; color: var(--ck-ink); }
:is(html:root:root,:host) body.woocommerce-order-pay button#place_order { min-height: var(--ck-btn-h-md); padding: 0 var(--ck-btn-px-md); font-size: var(--ck-fs-14); font-weight: 700; line-height: 1.43; letter-spacing: normal; text-transform: none; background: var(--ck-coral-text-bg); color: #fff; border: 1px solid var(--ck-coral-text-bg); }
:is(html:root:root,:host) body.woocommerce-order-pay button#place_order:is(:hover, :active) { background: var(--ck-coral-text-bg-hover); border-color: var(--ck-coral-text-bg-hover); color: #fff; }
@media (max-width: 767.98px) { :is(html:root:root,:host) body.woocommerce-order-pay button#place_order { width: 100%; } }
:is(html:root:root,:host) body.woocommerce-order-pay form#order_review table.shop_table :is(td, th) { word-break: normal; overflow-wrap: break-word; hyphens: manual; }
:is(html:root:root,:host) body.woocommerce-order-pay #payment div.form-row { padding-inline: 0; }
:is(html:root:root,:host) body.woocommerce-order-pay #payment div.form-row .woocommerce-terms-and-conditions-wrapper, :is(html:root:root,:host) body.woocommerce-order-pay #payment div.form-row .woocommerce-privacy-policy-text { padding: 0; }
:is(html:root:root,:host) body.woocommerce-order-pay #payment div.form-row button#place_order { float: none; width: auto; min-height: var(--ck-btn-h-md); padding: 0 var(--ck-btn-px-md); font-family: var(--ck-font-body); font-size: var(--ck-fs-14); font-weight: 700; line-height: 1.43; letter-spacing: normal; text-transform: none; border-radius: 999px; }
@media (max-width: 767.98px) { :is(html:root:root,:host) body.woocommerce-order-pay #payment div.form-row button#place_order { width: 100%; } }
:is(html:root:root,:host) body.woocommerce-order-pay #payment :is(.place-order, div.form-row.place-order) { padding: var(--ck-space-4) 0 0; margin: 0; }
:is(html:root:root,:host) body.woocommerce-order-pay #payment .woocommerce-terms-and-conditions-wrapper, :is(html:root:root,:host) body.woocommerce-order-pay #payment .validate-required { margin-left: 0; padding-left: 0; }
:is(html:root:root,:host) body.woocommerce-order-pay #payment { padding: 0; }
:is(html:root:root,:host) body.woocommerce-order-pay #payment .woocommerce-terms-and-conditions-wrapper .form-row, :is(html:root:root,:host) body.woocommerce-order-pay #payment .woocommerce-form__label-for-checkbox { padding-left: 0; margin-left: 0; }
/* theme: .woocommerce-checkout #payment div.form-row { padding: 1em } also reaches this page */
:is(html:root:root,:host) body.woocommerce-order-pay #payment :is(div.form-row, p.form-row) { padding-left: 0 !important; padding-right: 0 !important; }