/*
 Theme Name:  Astra Child – Kelsper Drip
 Template:    astra
 Version:     1.0.0
*/

/* =========================
   TOKENS (BLUE / WHITE / GREY)
   ========================= */
:root{
  --kd-blue:   #0067FF;
  --kd-white:  #FFFFFF;
  --kd-text:   #0B1220;
  --kd-muted:  #64748B;

  --kd-bg-soft:#F6F7FB;            /* subtle page background */
  --kd-line:   rgba(0,0,0,.10);     /* hairlines */
  --kd-shadow: 0 10px 30px rgba(0,0,0,.08);
}

/* =========================
   BASE
   ========================= */
body{ color:var(--kd-text); background:var(--kd-white); }
a{ color:var(--kd-blue); text-decoration:none; }
a:hover{ opacity:.9; }

button, .button, .wp-element-button,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button{
  background:var(--kd-blue);
  color:#fff; border:none; border-radius:12px; font-weight:700; padding:.6rem .9rem;
}

/* Hide Astra page title on account pages */
.woocommerce-account .entry-title,
.woocommerce-account .ast-archive-title{ display:none !important; }

/* =========================
   GLOBAL INPUTS
   ========================= */
input, select, textarea{
  background:#fff; color:var(--kd-text);
  border:1px solid var(--kd-line); border-radius:12px; padding:12px 14px;
}
input:focus, select:focus, textarea:focus{
  outline:none; border-color:var(--kd-blue);
  box-shadow:0 0 0 3px rgba(0,103,255,.18);
}

/* =========================
   ACCOUNT LAYOUT
   (requires my-account.php + navigation.php overrides)
   ========================= */

/* Soft page bg on account screens */
.woocommerce-account .site{ background:var(--kd-bg-soft); }

/* Container */
.kd-account{ max-width:1180px; margin:32px auto 60px; }
.kd-account__inner{
  display:grid; grid-template-columns:260px 1fr; gap:24px;
}

/* Left navigation card */
.woocommerce-MyAccount-navigation{
  background:#fff;
  border:none;
  padding:8px;
  position:sticky; top:24px; height:max-content;
}
.woocommerce-MyAccount-navigation ul{ list-style:none; margin:0; padding:4px; }
.woocommerce-MyAccount-navigation li{ margin:4px 0; }
.woocommerce-MyAccount-navigation a{
  display:flex; align-items:center; gap:10px;
  padding:12px 14px; border-radius:12px;
  color:var(--kd-text);
  transition:background .18s ease, transform .18s ease;
}
.woocommerce-MyAccount-navigation a:hover{ background:rgba(0,0,0,.04); }
.woocommerce-MyAccount-navigation .is-active a{
  background:var(--kd-blue) !important;
	color:#fff;
}

/* Right content card */
.kd-account__content{
  background:#fff;
  border:1px solid var(--kd-line);
  border-radius:16px;
  box-shadow:var(--kd-shadow);
  padding:22px;
}
.kd-account__content h2, .kd-account__content h3{ color:var(--kd-text); }

/* Page header (greeting) */
.kd-pageheader{ display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.kd-pageheader .kd-avatar{ width:48px; height:48px; border-radius:50%; overflow:hidden; box-shadow:0 4px 12px rgba(0,0,0,.1); }
.kd-pageheader h2{ margin:0; font-size:clamp(22px,2.2vw,32px); font-weight:800; }

/* =========================
   DASHBOARD TILES
   ========================= */
.kd-dash__tiles{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:14px;
}
.kd-tile{
  display:block; background:#fff; border:1px solid var(--kd-line);
  border-radius:14px; padding:16px; text-decoration:none; color:var(--kd-text);
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.kd-tile strong{ display:block; font-weight:800; margin-bottom:4px; }
.kd-tile span{ color:var(--kd-muted); }
.kd-tile:hover{
  transform:translateY(-2px);
  border-color:rgba(0,103,255,.45);
  box-shadow:0 10px 20px rgba(0,0,0,.08);
}

/* =========================
   TABLES (Orders, etc.)
   ========================= */
.woocommerce table.shop_table{
  width:100%; border:1px solid var(--kd-line); border-radius:12px; overflow:hidden;
  box-shadow:0 6px 16px rgba(0,0,0,.06);
}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td{ padding:14px 16px; border-top:1px solid var(--kd-line); }
.woocommerce table.shop_table thead th{
  background:var(--kd-bg-soft); color:var(--kd-text); font-weight:700; border-top:none;
}
.woocommerce-orders-table__row:hover{ background:rgba(0,0,0,.02); }

/* Order status badges (optional helpers) */
.woocommerce-order-status,
.order-status{ display:inline-block; padding:4px 8px; border-radius:999px; font-size:.85rem; font-weight:700; }
.status-completed  { background:#E8F7EF; color:#0A7A46; }
.status-processing { background:#EEF3FF; color:#0B3DD6; }
.status-on-hold    { background:#F6F3E6; color:#8B6D12; }
.status-cancelled  { background:#FDEEEE; color:#A32626; }

/* Action buttons inside tables */
.woocommerce table.shop_table .button{ padding:8px 12px; border-radius:10px; font-weight:700; }

/* =========================
   FORMS (Account details / Addresses)
   ========================= */
.woocommerce form .form-row{ margin-bottom:16px; }
.woocommerce form label{ font-weight:600; color:var(--kd-text); margin-bottom:6px; display:block; }
.woocommerce address{ line-height:1.6; }

/* =========================
   NOTICES
   ========================= */
.woocommerce-message, .woocommerce-error, .woocommerce-info{
  border-radius:12px; padding:14px 16px;
}
.woocommerce-message{ border-color:#DDEF E6; background:#F4FBF7; }
.woocommerce-info   { border-color:#D9E6FF; background:#F2F6FF; }
.woocommerce-error  { border-color:#FFD9D9; background:#FFF3F3; }

/* =========================
   RESPONSIVE
   ========================= */
@media (max-width: 980px){
  .kd-account__inner{ grid-template-columns:1fr; }
  .woocommerce-MyAccount-navigation{ position:static; }
  .kd-dash__tiles{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 560px){
  .kd-dash__tiles{ grid-template-columns:1fr; }
  .kd-account__content{ padding:18px; }

  /* Orders table → cards */
  .woocommerce table.shop_table thead{ display:none; }
  .woocommerce table.shop_table,
  .woocommerce table.shop_table tbody,
  .woocommerce table.shop_table tr,
  .woocommerce table.shop_table td{ display:block; width:100%; }
  .woocommerce table.shop_table tr{ border-bottom:1px solid var(--kd-line); padding:10px 12px; }
  .woocommerce table.shop_table td{ border:none; padding:6px 0; }
  .woocommerce table.shop_table td:before{
    content:attr(data-title) ": "; font-weight:700; margin-right:6px; color:var(--kd-muted);
  }
}

/* === KD My Account – layout fixes === */

.kd-account__inner{
  display: grid;                    /* ensure grid is applied */
  grid-template-columns: 300px minmax(0, 1fr);   /* fixed left, flexible right */
  gap: 24px;
}

/* Lock the sidebar/card width */
.kd-account__nav{ width:300px; min-width:300px; }
.woocommerce-MyAccount-navigation{ width:300px; }

/* Keep menu labels on one line (no letter-per-line wrapping) */
.woocommerce-MyAccount-navigation a{ white-space: nowrap; }

/* Optional: hide the tiny “My account” text heading in the card */
.kd-nav-title{ display:none; }

/* Ensure the content card fills the right column */
.kd-account__content{ width:100%; }

.woocommerce-account .woocommerce-MyAccount-navigation{
	width: 100%;
}

.kd-filterbar{
  display:flex; flex-wrap:wrap; gap:10px; align-items:center;
  margin:0 0 14px; padding:10px 12px;
  background:#fff; border:1px solid rgba(0,0,0,.10); border-radius:12px; box-shadow:0 8px 18px rgba(0,0,0,.06);
}
.kd-filterbar .kd-chip{
  display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border:1px solid rgba(0,0,0,.10);
  border-radius:999px; cursor:pointer; user-select:none; background:#fff;
}
.kd-filterbar .kd-chip input{ accent-color:#0067FF; }
.kd-filterbar .kd-price{
  display:inline-flex; align-items:center; gap:6px; margin-left:6px;
  padding:6px 8px; border:1px solid rgba(0,0,0,.10); border-radius:12px; background:#fff;
}
.kd-filterbar .kd-price input{ width:90px; border:0; outline:none; padding:6px 8px; border-radius:8px; background:transparent; }
.kd-filterbar .kd-price .dash{ opacity:.6; }
.kd-filterbar .button{ padding:.55rem .9rem; border-radius:10px; font-weight:700; }
.kd-filterbar .kd-reset{ margin-left:6px; color:#64748B; }
@media (max-width:640px){
  .kd-filterbar{ gap:8px; }
  .kd-filterbar .kd-price input{ width:74px; }
}

/* Mobile: stack, allow wrapping in links */
@media (max-width:980px){
  .kd-account__inner{ grid-template-columns:1fr; }
  .kd-account__nav,
  .woocommerce-MyAccount-navigation{ width:auto; min-width:0; }
  .woocommerce-MyAccount-navigation a{ white-space:normal; }
}

body .woocommerce-MyAccount-navigation-link{
	border: none !important;
}

/* === KD shop filter drawer === */
.kd-shopbar{
  display:flex; justify-content:flex-start; margin:0 0 14px;
}
.kd-shopbar .kd-filter-open{ border-radius:10px; }

#kd-filter-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.35); z-index:9998;
  backdrop-filter:saturate(110%) blur(1px);
}

/* Off-canvas panel */
.kd-filter-drawer{
  position:fixed; top:0; right:0; height:100%; width:340px; max-width:90%;
  background:#fff; border-left:1px solid rgba(0,0,0,.10); box-shadow: -20px 0 40px rgba(0,0,0,.18);
  transform:translateX(100%); transition:transform .28s ease; z-index:9999; display:flex; flex-direction:column;
  border-top-left-radius:12px; border-bottom-left-radius:12px;
}
.kd-filter-drawer.is-open{ transform:none; }

.kd-filter-head{ display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid rgba(0,0,0,.06); }
.kd-filter-head h3{ margin:0; font-weight:800; color:#0B1220; }
.kd-filter-close{
  background:transparent; border:0; font-size:20px; line-height:1; cursor:pointer; padding:6px 8px; border-radius:8px;
}
.kd-filter-close:hover{ background:rgba(0,0,0,.06); }

.kd-filter-body{ padding:14px 16px; overflow:auto; }

/* Reuse your existing chip/price styles inside the drawer */
.kd-filterform{ display:flex; flex-direction:column; gap:12px; }
.kd-filterform .kd-chip{ display:inline-flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid rgba(0,0,0,.10); border-radius:999px; width:max-content; }
.kd-filterform .kd-price{ display:flex; align-items:center; gap:6px; padding:8px 10px; border:1px solid rgba(0,0,0,.10); border-radius:12px; width:max-content; }
.kd-filterform .kd-price input{ width:110px; border:0; outline:none; padding:6px 8px; background:transparent; }
.kd-filterform .button{ width:max-content; }
.kd-filterform .kd-reset{ color:#64748B; margin-left:8px; }

/* Stop background scrolling while open */
body.kd-no-scroll{ overflow:hidden; }

/* Optional: on large screens you can pin the drawer at 380px */
@media (min-width: 1200px){
  .kd-filter-drawer{ width:380px; }
}

/* Sort (orderby) control */
.woocommerce .woocommerce-ordering{
  display:inline-block;
  position:relative;
}

.woocommerce .woocommerce-ordering select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  border:1px solid var(--kd-line);
  border-radius:12px;
  padding:10px 38px 10px 12px;      /* room for arrow */
  background:#fff;
  font-weight:600;
  color:var(--kd-text);
  cursor:pointer;
}

/* Arrow (SVG) */
.woocommerce .woocommerce-ordering::after{
  content:"";
  position:absolute;
  right:12px; top:50%; transform:translateY(-50%);
  width:12px; height:12px;
  pointer-events:none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%230067FF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat;
  background-position:center;
  opacity:.9;
}

/* Hover/focus states */
.woocommerce .woocommerce-ordering select:focus{
  border-color:var(--kd-blue);
  box-shadow:0 0 0 3px rgba(0,103,255,.18);
}


/* --- Filter drawer polish --- */
.kd-filter-drawer{
  width: 600px;                    /* roomier on desktop */
  max-width: 92vw;
  border-left: 0;
  box-shadow: -24px 0 48px rgba(0,0,0,.18);
}

/* Header: stronger presence */
.kd-filter-head{
  padding: 18px 18px;
  border-bottom: 1px solid var(--kd-line);
  position: sticky; top: 0; z-index: 2;
  background: #fff;
}
.kd-filter-head h3{
  letter-spacing:.2px; font-weight: 800; font-size: 22px;
}
.kd-filter-close{
  width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:10px; font-size:18px;
  transition: background .18s ease, transform .18s ease;
}
.kd-filter-close:hover{ background:rgba(0,0,0,.06); transform:translateY(-1px); }

/* Body area */
.kd-filter-body{
  padding: 18px; overflow:auto; overscroll-behavior: contain;
}
.kd-filterbody-section{ margin-bottom: 14px; }

/* Nice, tactile chips (toggle style) */
.kd-filterform .kd-chip{
  gap:10px; padding:10px 14px;
  border-radius: 999px;
  border:1px solid var(--kd-line);
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.kd-filterform .kd-chip input{ display:none; }                /* hide native box */
.kd-filterform .kd-chip span{ font-weight: 700; color: var(--kd-text); }
.kd-filterform .kd-chip::before{
  content:""; width:16px; height:16px; border-radius:4px;
  border:2px solid var(--kd-line); display:inline-block;
  transition: all .18s ease;
}
.kd-filterform .kd-chip input:checked + span { color:#fff; }
.kd-filterform .kd-chip:has(input:checked){
  background: var(--kd-blue);
  border-color: var(--kd-blue);
  box-shadow: 0 0 0 3px rgba(0,103,255,.15);
}
.kd-filterform .kd-chip:has(input:checked)::before{
  border-color:#fff; background:#fff; mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%230067FF' d='M7.6 14.2 3.8 10.4l1.4-1.4 2.4 2.4 6.2-6.2 1.4 1.4z'/%3E%3C/svg%3E") center/14px 14px no-repeat;
}

/* Price range group */
.kd-filterform .kd-price{
  display:flex; align-items:center; gap:8px;
  padding: 8px 10px;
  border-radius: 14px;
  background:#fff; border:1px solid var(--kd-line);
}
.kd-filterform .kd-price input{
  width:120px; padding:10px 12px; border-radius:10px; background:#F8FAFF;
  border:1px solid rgba(0,0,0,.08);
}
.kd-filterform .kd-price input:focus{
  border-color: var(--kd-blue);
  box-shadow: 0 0 0 3px rgba(0,103,255,.14);
}

/* Sticky footer actions */
.kd-filter-actions{
  position: sticky; bottom:0; z-index:2; margin-top:auto;
  padding: 14px 18px; background: linear-gradient(180deg, rgba(255,255,255,.85), #fff 26px);
  border-top: 1px solid var(--kd-line);
  display:flex; align-items:center; gap:10px;
}
.kd-filter-actions .button{ padding:.7rem 1rem; border-radius:12px; }
.kd-filter-actions .kd-reset{
  margin-left:auto; color:var(--kd-muted); font-weight:700;
}

/* Drawer animation snappier */
.kd-filter-drawer{
  left:0; right:auto;                  /* move to left */
  border-right: 1px solid rgba(0,0,0,.10);
  border-left: 0;
  box-shadow: 20px 0 40px rgba(0,0,0,.18);
  transform: translateX(-100%);        /* hidden off the left edge */
}
.kd-filter-drawer.is-open{ transform:none; }

/* Dimmer overlay a touch softer + click affordance cursor */
#kd-filter-overlay{ background: rgba(10,16,28,.34); cursor: zoom-out; }

.kd-price-block{ display:flex; flex-direction:column; gap:10px; }
.kd-price-slider{
  position:relative; height:28px; margin: 6px 2px 2px;
}
.kd-price-slider .kd-range{
  position:absolute; left:0; right:0;
  width:100%; height:28px; margin:0; padding:0;
  background:transparent; pointer-events:auto;
  -webkit-appearance:none; appearance:none;
}

/* Track (we'll paint the selected range via inline style in JS) */
.kd-price-slider .kd-track{
  position:absolute; top:50%; left:0; right:0;
  height:6px; border-radius:999px; transform:translateY(-50%);
  background:linear-gradient(90deg,#E5EAF3 0%, #E5EAF3 100%);  /* default; JS overrides */
}

/* Thumb */
.kd-price-slider .kd-range::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none;
  width:18px; height:18px; border-radius:50%;
  background:#fff; border:2px solid var(--kd-blue);
  box-shadow:0 2px 8px rgba(0,0,0,.12);
  cursor:pointer;
}
.kd-price-slider .kd-range::-moz-range-thumb{
  width:18px; height:18px; border-radius:50%;
  background:#fff; border:2px solid var(--kd-blue);
  box-shadow:0 2px 8px rgba(0,0,0,.12);
  cursor:pointer;
}

/* Remove default Firefox track so our .kd-track shows through */
.kd-price-slider .kd-range::-moz-range-track{ background:transparent; }

/* Readout (keep your number inputs but nicer container) */
.kd-price-readout{
  display:flex; align-items:center; gap:8px;
  padding: 8px 10px; border:1px solid var(--kd-line);
  border-radius:14px; background:#fff; width:max-content;
}
.kd-price-readout input{
  width:120px; padding:10px 12px; border-radius:10px;
  background:#F8FAFF; border:1px solid rgba(0,0,0,.08);
}
.kd-price-readout input:focus{
  border-color:var(--kd-blue); box-shadow:0 0 0 3px rgba(0,103,255,.14);
}

/* Mobile full-bleed drawer */
@media (max-width:640px){
  .kd-filter-drawer{ width: 100vw; border-top-left-radius:16px; border-bottom-left-radius:16px; }
  .kd-filter-head{ padding:16px; }
  .kd-filter-body{ padding:16px; }
  .kd-filter-actions{ padding:12px 16px; }
  .kd-filterform .kd-price input{ width: 46vw; max-width: 160px; }
}

.kd-attr-search-wrap { margin: 8px 0 6px; }
.kd-attr-search { width:100%; padding:.5rem .6rem; border:1px solid #E5E7EB; border-radius:.5rem; font-size:.9rem; }

.kd-attr-grid {
  display:grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:6px;
}

@media (min-width: 500px){
  .kd-attr-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

.kd-chip { display:flex; align-items:center; gap:8px; padding:6px 8px; border:1px solid #e5e7eb; border-radius:999px; cursor:pointer; }
.kd-chip input { margin:0; }
.kd-chip.is-hidden { display:none; }
.kd-swatch { width:14px; height:14px; border-radius:999px; background:var(--swatch,#e5e7eb); border:1px solid rgba(0,0,0,.08); }
.kd-attr-search-wrap { margin:6px 0 8px; }
.kd-attr-search { width:100%; padding:6px 10px; border:1px solid #e5e7eb; border-radius:8px; }
.kd-attr-more { background:none; border:none; color:var(--kd-accent,#0067FF); padding:6px 0; cursor:pointer; }

/* Roomier drawer on desktop */
@media (min-width: 1100px){
  .kd-filter-drawer{ width:500px; }
}

/* Color block layout */
.kd-color-popular{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px; }
.kd-chip--popular{ padding:8px 10px; }
.kd-color-all{
  max-height: 280px;               /* scroll instead of squashing */
  overflow:auto;
  border:1px solid var(--kd-line);
  border-radius:12px;
  padding:8px;
  background:#fff;
}
.kd-color-all[data-expanded="1"]{ max-height: 520px; }

.kd-color-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
  gap:8px 10px;
}

.kd-color-cell{
  display:flex; align-items:center; gap:8px;
  padding:6px 8px;
  border:1px solid #e9eef5;
  border-radius:10px;
  background:#fff;
  white-space: nowrap;              /* keep names on one line */
  overflow:hidden; text-overflow:ellipsis;
}

.kd-color-dot{
  width:16px; height:16px; border-radius:50%;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.12);
}

.kd-color-toggle{
  background:none; border:0; color:var(--kd-accent,#0067FF);
  font-weight:700; margin-top:8px; cursor:pointer;
}

/* Popular chips row */
.kd-color-popular{ display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 10px; }
.kd-chip--popular{ padding:8px 10px; }
.kd-chip--popular .kd-swatch{ width:14px; height:14px; border-radius:50%; box-shadow:inset 0 0 0 1px rgba(0,0,0,.18); }
/* ensure “White” is visible */
.kd-chip--popular .kd-swatch[style*="#fff"],
.kd-color-dot[style*="#fff"]{ box-shadow:inset 0 0 0 1px rgba(0,0,0,.25); }

/* Scroll box for the full color list */
.kd-color-all{
  max-height: 240px;           /* reduce squish, allow scroll */
  overflow:auto;
  border:1px solid var(--kd-line);
  border-radius:12px;
  padding:8px;
  background:#fff;
}
.kd-color-all[data-expanded="1"]{ max-height: 540px; }

/* Dense, readable grid */
.kd-color-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:8px 10px;
}
@media (min-width: 420px){
  .kd-color-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (min-width: 640px){
  .kd-color-grid{ grid-template-columns: repeat(4, minmax(0,1fr)); }
}

/* Each color option: pill with dot + name, highlight when selected */
.kd-color-cell{
  display:flex; align-items:center; gap:8px;
  padding:6px 8px; border:1px solid #e9eef5; border-radius:10px; background:#fff;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.kd-color-cell input{ display:none; } /* hide native box */
.kd-color-cell:has(input:checked){
  border-color: var(--kd-blue);
  background: rgba(0,103,255,.06);
  box-shadow: 0 0 0 3px rgba(0,103,255,.12) inset;
}
.kd-color-dot{
  width:16px; height:16px; border-radius:50%;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.12);
}
.kd-color-name{ font-weight:700; font-size:.92rem; }

/* Toggle button spacing */
.kd-color-toggle{
  background:none; border:0; color:var(--kd-blue);
  font-weight:800; margin-top:8px; padding:6px 8px; border-radius:8px; cursor:pointer;
}

/* Drawer width a touch larger on desktop */
@media (min-width:1100px){
  .kd-filter-drawer{ width: 500px; }
}

.kd-attr-block[data-attr="category"] .kd-attr-grid{
  display:grid;
  grid-template-columns: 1fr;   /* one per row */
  gap:8px;
}

.kd-attr-block[data-attr="category"] .kd-chip{
  display:flex; align-items:center; gap:10px;
  padding:10px 12px; border-radius:12px;
  border:1px solid #e9eef5; background:#fff;
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease;
  max-width:100%;
}

.kd-attr-block[data-attr="category"] .kd-chip input{ display:none; }

.kd-attr-block[data-attr="category"] .kd-chip-label{
  flex:1; min-width:0;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; /* long names won’t wrap or overlap */
  font-weight:700;
}

/* Count pill on the right (added by PHP below) */
.kd-attr-block[data-attr="category"] .kd-chip-count{
  margin-left:auto;
  padding:2px 8px; border-radius:999px;
  font-size:.78rem; font-weight:800;
  color:var(--kd-blue); background:#EEF4FF; border:1px solid #e3ebff;
}

/* Selected state */
.kd-attr-block[data-attr="category"] .kd-chip:has(input:checked){
  border-color:var(--kd-blue); background:rgba(0,103,255,.06);
  box-shadow:0 0 0 3px rgba(0,103,255,.10) inset;
}

/* Accordion wrapper */
.kd-acc-form { display:flex; flex-direction:column; gap:12px; }

/* Each panel */
.kd-acc {
  background:#f3f4f6;
  border-radius:12px;
  overflow:hidden;
  border:1px solid #e5e7eb;
}

/* Header row */
.kd-acc__summary {
  list-style:none;
  display:flex; align-items:center; justify-content:space-between;
  gap:8px; padding:14px 16px; cursor:pointer; font-weight:800; color:#0b1220;
}
.kd-acc__summary::-webkit-details-marker { display:none; }

/* Chevron */
.kd-acc__summary i {
  width:18px; height:18px; flex:0 0 18px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>") center/contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>") center/contain no-repeat;
  opacity:.8; transform:rotate(180deg); transition:transform .18s ease, opacity .18s ease;
}
.kd-acc[open] .kd-acc__summary i { transform:none; opacity:1; }

/* Panel body */
.kd-acc__body { padding:12px 16px 16px; background:#fff; border-top:1px solid #e5e7eb; }

/* Make long lists scrollable like the screenshot */
.kd-acc .kd-attr-grid,
.kd-acc .kd-color-all {
  max-height: 260px;
  overflow: auto;
  padding-right: 6px;
}

.kd-attr-search { border-radius:999px; padding:10px 14px; }

.kd-shopbar{ display:none; }

/* Keep orderby and the Filter button aligned together on the right */
.woocommerce .woocommerce-result-count{ margin: 0 0 12px; }

.kd-shopbar{ display:none; }                 /* hide the old row */
.woocommerce .woocommerce-ordering{ float:right; margin-left:8px; }
.kd-filter-inline{ float:right; margin-left:8px; border-radius:12px; }

@media (max-width:640px){
  .woocommerce .woocommerce-ordering{ float:none; display:inline-block; }
  .kd-filter-inline{ float:none; display:inline-flex; margin-left:10px; }
}

/* WooCommerce pagination — correct selectors */
nav.woocommerce-pagination { 
  margin-top:16px;
}

nav.woocommerce-pagination ul.page-numbers{
  display:flex;
  gap:8px;
  list-style:none;
  padding:0;
  margin:0;
  justify-content:center;            /* center under the grid */
}

nav.woocommerce-pagination ul.page-numbers li{ margin:0; }

nav.woocommerce-pagination ul.page-numbers li a,
nav.woocommerce-pagination ul.page-numbers li span{
  display:flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border:1px solid var(--kd-blue);
  border-radius:10px;
  text-decoration:none;
  font-weight:700;
  line-height:1;
}

nav.woocommerce-pagination ul.page-numbers li .current,
nav.woocommerce-pagination ul.page-numbers li a:hover{
  background:var(--kd-blue);
  color:#fff;
  border-color:var(--kd-blue);
}

/* Remove browser/Astra outline so we don’t get a second border */
:where(a, button).focus-visible,
:where(a, button):focus { outline: none; }

/* Pagination: single, clean focus state */
nav.woocommerce-pagination ul.page-numbers li a:focus-visible,
nav.woocommerce-pagination ul.page-numbers li span:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(0,103,255,.25);
  border-color: var(--kd-blue);
}

/* Header icons (account / cart / search) – kill theme outline + give tidy ring */
.ast-site-header a:focus,
.ast-site-header .ast-icon:focus,
.ast-header-account-link:focus,
.ast-header-woo-cart-menu a:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(0,103,255,.25);
  border-radius: 10px; /* matches your rounded style */
}

.ast-menu-cart-outline .ast-addon-cart-wrap{
	border: none;
}

.woocommerce nav.woocommerce-pagination ul, .woocommerce nav.woocommerce-pagination ul li{
	border:none;
}