/* KSK Designer 0.9.12 - refined variant controls, mobile quick color picker. */
/* Gently larger desktop dots without making their panel wider. */
@media(min-width:851px){
 .kskd-shell.kskd-floating-colors .kskd-project-group>.kskd-variant-chooser .kskd-variant-group-color .kskd-variant-options{
   grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px!important;
 }
 .kskd-shell.kskd-floating-colors .kskd-project-group>.kskd-variant-chooser .kskd-variant-group-color .kskd-variant-option{
   width:33px!important;min-width:33px!important;height:33px!important;min-height:33px!important;
   padding:2px!important;
 }
 .kskd-shell.kskd-floating-colors .kskd-project-group>.kskd-variant-chooser .kskd-variant-swatch{
   width:27px!important;min-width:27px!important;height:27px!important;flex:0 0 27px!important;
 }
}
/* No redundant reset label below color swatches; the native WC form stays intact. */
.kskd-shell.kskd-floating-colors .kskd-variant-reset{display:none!important}
/* Compact size chips on the right in normal purchase mode. */
.kskd-buy-card .kskd-buy-sizes .kskd-variant-option{
  min-width:34px!important;min-height:30px!important;
  padding:4px 7px!important;font-size:11px!important;border-radius:7px!important;
}
.kskd-buy-card .kskd-buy-sizes .kskd-variant-options{gap:5px!important}
/* Compact bulk grid: size above quantity, all in one row where possible. */
.kskd-buy-card .kskd-bulk-size-panel{padding:8px!important}
.kskd-buy-card .kskd-bulk-size-grid{gap:5px!important}
.kskd-buy-card .kskd-bulk-size-row{padding:5px 3px!important;gap:3px!important;border-radius:7px!important}
.kskd-buy-card .kskd-bulk-size-row .kskd-bulk-size-name{font-size:11px!important}
.kskd-buy-card .kskd-bulk-size-row input.kskd-bulk-qty{height:28px!important;font-size:11px!important;border-radius:6px!important}
/* A real floating product-color button next to the existing zone tools. */
.kskd-shell .kskd-mobile-variant-picker{display:none!important}
.kskd-shell .kskd-mobile-variant-picker[hidden],
.kskd-shell .kskd-mobile-variant-popup[hidden]{display:none!important}
@media(max-width:850px){
 .kskd-buy-card form.cart tr.kskd-mobile-native-color-row{display:none!important}
 .kskd-shell.kskd-corner-layout .kskd-zone-tools{position:relative!important}
 .kskd-shell.kskd-corner-layout .kskd-mobile-variant-picker:not([hidden]){
   display:block!important;position:absolute!important;right:0!important;
   bottom:calc(100% + 8px)!important;z-index:38!important;
   width:max-content!important;max-width:none!important;pointer-events:auto!important;
 }
 .kskd-shell.kskd-corner-layout .kskd-mobile-variant-toggle{
   display:inline-flex!important;justify-content:center!important;align-items:center!important;
   min-width:92px!important;min-height:32px!important;padding:6px 9px!important;
   margin:0!important;border-radius:9px!important;border:1px solid #c7dcf2!important;
   color:#1769c2!important;background:rgba(255,255,255,.97)!important;
   box-shadow:0 3px 12px rgba(17,50,78,.14)!important;font-size:11px!important;
   line-height:1.2!important;font-weight:700!important;white-space:nowrap!important;
   text-transform:none!important;cursor:pointer!important;
 }
 .kskd-shell.kskd-corner-layout .kskd-mobile-variant-toggle[aria-expanded="true"]{
   background:#eaf4ff!important;border-color:#1769c2!important;
 }
 .kskd-shell.kskd-corner-layout .kskd-mobile-variant-popup:not([hidden]){
   display:block!important;position:absolute!important;right:0!important;
   bottom:calc(100% + 8px)!important;z-index:45!important;
   width:220px!important;max-width:min(220px,calc(100vw - 24px))!important;
   max-height:min(240px,43dvh)!important;overflow-y:auto!important;
   padding:10px!important;border:1px solid #d2e2f2!important;border-radius:12px!important;
   background:#fff!important;box-shadow:0 10px 28px rgba(24,56,87,.20)!important;
   overscroll-behavior:contain!important;
 }
 .kskd-shell .kskd-mobile-variant-options{
   display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
   gap:6px!important;
 }
 .kskd-shell .kskd-mobile-variant-color{
   display:grid!important;place-items:center!important;min-width:0!important;
   width:35px!important;height:35px!important;padding:3px!important;margin:0!important;
   border:1px solid #ccd9e6!important;border-radius:50%!important;background:#fff!important;
   box-shadow:none!important;cursor:pointer!important;
 }
 .kskd-shell .kskd-mobile-variant-color.is-selected{
   border-color:#1769c2!important;box-shadow:0 0 0 2px #1769c2!important;
 }
 .kskd-shell .kskd-mobile-variant-color:disabled{opacity:.35!important;cursor:not-allowed!important}
 .kskd-shell .kskd-mobile-variant-color:focus-visible{outline:2px solid #1769c2!important;outline-offset:3px!important}
 .kskd-shell .kskd-mobile-variant-dot{
   display:block!important;width:27px!important;height:27px!important;border-radius:50%!important;
   border:1px solid rgba(24,55,86,.18)!important;
 }
 .kskd-shell .kskd-mobile-variant-dot.kskd-no-color-code{
   background-image:repeating-linear-gradient(135deg,transparent 0 7px,#a8b6c7 7px 9px)!important;
 }
 /* Zoom has its own shortcut above the color toggle; never stack on top of it. */
 .kskd-shell.kskd-corner-layout .kskd-corner[data-group="zone"]>.kskd-zoom-control.kskd-zoom-zone-aligned.kskd-zoom-compact{
   bottom:calc(100% + 51px)!important;top:auto!important;
 }
 .kskd-shell.kskd-mobile-colors-open .kskd-corner[data-group="zone"]>.kskd-zoom-control{visibility:hidden!important;pointer-events:none!important}
}

.kskd-shell .kskd-mobile-variant-dot.kskd-variant-swatch-photo{background-repeat:no-repeat!important;background-position:center!important;background-size:cover!important;background-color:#fff!important}