/* ============================================================
   ICE DOG — Design System
   Arctic outdoor-performance brand for Ice Dog (icedog.ua)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Inter+Tight:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap');

/* ── Tokens ─────────────────────────────────────────────── */
:root {
  --id-bg:          #f0ece2;
  --id-bg-deep:     #1a2138;
  --id-bg-mid:      #283151;
  --id-ink:         #1a2138;
  --id-ink-soft:    #3a4258;
  --id-ink-faint:   #6e7287;
  --id-line:        #d6cfbf;
  --id-line-soft:   #e5e0d2;
  --id-paper:       #faf6ec;
  --id-ice:         #ecead8;
  --id-steel:       #4a5d8a;
  --id-steel-deep:  #2f3f66;
  --id-signal:      #c4502a;
  --id-signal-bright: #db5e34;
  --id-frost:       #c8c1ad;

  --id-display: 'Archivo Black', 'Helvetica Neue', sans-serif;
  --id-sans:    'Inter Tight', 'Helvetica Neue', sans-serif;
  --id-mono:    'JetBrains Mono', 'SF Mono', monospace;

  --id-max-width: 1480px;
  --id-gutter:    32px;
}

/* ── Base ────────────────────────────────────────────────── */
body {
  background-color: var(--id-bg);
  color: var(--id-ink);
  font-family: var(--id-sans);
  -webkit-font-smoothing: antialiased;
  font-feature-settings: 'ss01', 'cv11';
}

::selection {
  background: var(--id-ink);
  color: var(--id-paper);
}

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--id-bg); }
::-webkit-scrollbar-thumb { background: var(--id-ink-soft); border: 2px solid var(--id-bg); }

/* ── Typography overrides ────────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--id-display);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 0.95;
  text-transform: uppercase;
}

/* ── Layout frame ────────────────────────────────────────── */
.id-frame {
  max-width: var(--id-max-width);
  margin: 0 auto;
  padding: 0 var(--id-gutter);
}

/* ── Utility ─────────────────────────────────────────────── */
.id-mono    { font-family: var(--id-mono); font-variant-numeric: tabular-nums; }
.id-display { font-family: var(--id-display); letter-spacing: -0.02em; line-height: 0.92; text-transform: uppercase; }
.id-eyebrow {
  font-family: var(--id-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--id-ink-faint);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.id-eyebrow::before {
  content: '';
  width: 18px; height: 1px;
  background: currentColor;
  display: inline-block;
}

.id-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--id-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 5px 10px;
  border: 1px solid var(--id-ink);
  background: transparent;
}
.id-chip--filled  { background: var(--id-ink); color: var(--id-paper); }
.id-chip--signal  { background: var(--id-signal); color: var(--id-paper); border-color: var(--id-signal); }

.id-divider       { height: 1px; background: var(--id-line); width: 100%; }
.id-divider--ink  { background: var(--id-ink); }
.id-divider--thick { background: var(--id-ink); height: 2px; }

/* ── Marquee ─────────────────────────────────────────────── */
.id-marquee {
  display: flex;
  overflow: hidden;
  white-space: nowrap;
  border-top: 1px solid var(--id-ink);
  border-bottom: 1px solid var(--id-ink);
  background: var(--id-ink);
  color: var(--id-paper);
}
.id-marquee__track {
  display: flex;
  gap: 48px;
  animation: id-marquee 38s linear infinite;
  padding: 14px 0;
  font-family: var(--id-display);
  font-size: 18px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.id-marquee__track > span {
  display: inline-flex;
  align-items: center;
  gap: 48px;
}
.id-marquee__track > span::after {
  content: '✺';
  font-family: var(--id-sans);
  color: var(--id-signal);
}
@keyframes id-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ── Corner ticks decoration ─────────────────────────────── */
.id-corner-ticks { position: relative; }
.id-corner-ticks::before,
.id-corner-ticks::after {
  content: '';
  position: absolute;
  width: 14px; height: 14px;
  border: 1px solid var(--id-ink);
  pointer-events: none;
}
.id-corner-ticks::before { top: -1px; left: -1px; border-right: none; border-bottom: none; }
.id-corner-ticks::after  { bottom: -1px; right: -1px; border-left: none; border-top: none; }

/* ── Topographic background ──────────────────────────────── */
.id-topo-bg {
  background-image:
    radial-gradient(ellipse 80% 40% at 50% 50%, transparent 30%, rgba(10,22,40,0.04) 31%, rgba(10,22,40,0.04) 32%, transparent 33%),
    radial-gradient(ellipse 60% 30% at 50% 50%, transparent 40%, rgba(10,22,40,0.05) 41%, rgba(10,22,40,0.05) 42%, transparent 43%),
    radial-gradient(ellipse 40% 20% at 50% 50%, transparent 50%, rgba(10,22,40,0.06) 51%, rgba(10,22,40,0.06) 52%, transparent 53%);
}

/* ═══════════════════════════════════════════════════════════
   BLOCKSY OVERRIDES
   ═══════════════════════════════════════════════════════════ */

/* Site background */
.ct-main-container,
#page,
.site {
  background-color: var(--id-bg);
}

/* ── Header / Navbar ─────────────────────────────────────── */
.ct-header {
  background-color: var(--id-bg) !important;
  border-bottom: 1px solid var(--id-line) !important;
  transition: background 0.2s;
}
.ct-header.ct-header--scrolled,
.ct-header.ct-sticky-active {
  background-color: var(--id-paper) !important;
}

/* Tech bar above nav */
.ct-top-bar {
  background-color: var(--id-bg) !important;
  border-bottom: 1px solid var(--id-line-soft) !important;
  font-family: var(--id-mono) !important;
  font-size: 11px !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--id-ink-faint) !important;
}

/* Logo */
.ct-header .site-logo img,
.ct-header .site-logo svg {
  max-height: 40px;
}

/* Navigation links */
.ct-main-header-menu a,
.ct-header .ct-menu > li > a {
  font-family: var(--id-sans) !important;
  font-weight: 500;
  font-size: 13px !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--id-ink) !important;
  text-decoration: none;
}
.ct-main-header-menu a:hover,
.ct-header .ct-menu > li > a:hover {
  color: var(--id-signal) !important;
}

/* ── Buttons ─────────────────────────────────────────────── */
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .single_add_to_cart_button,
.btn {
  display: inline-flex !important;
  align-items: center;
  gap: 12px;
  padding: 14px 22px !important;
  font-family: var(--id-sans) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  border: 1px solid var(--id-ink) !important;
  background: var(--id-ink) !important;
  color: var(--id-paper) !important;
  border-radius: 0 !important;
  cursor: pointer;
  transition: all 0.15s ease !important;
  text-decoration: none !important;
}
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .single_add_to_cart_button:hover {
  background: var(--id-paper) !important;
  color: var(--id-ink) !important;
}

/* Add to cart — signal accent */
.woocommerce .single_add_to_cart_button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
  background: var(--id-signal) !important;
  border-color: var(--id-signal) !important;
  color: var(--id-paper) !important;
}
.woocommerce .single_add_to_cart_button:hover,
.woocommerce a.button.alt:hover {
  background: var(--id-signal-bright) !important;
  border-color: var(--id-signal-bright) !important;
}

/* ═══════════════════════════════════════════════════════════
   WOOCOMMERCE — PRODUCT CARDS (Archive / Shop)
   ═══════════════════════════════════════════════════════════ */

.woocommerce ul.products li.product,
.ct-woo-card-wrapper {
  background: var(--id-paper) !important;
  border: 1px solid var(--id-line) !important;
  border-radius: 0 !important;
  transition: border-color 0.15s ease;
}
.woocommerce ul.products li.product:hover,
.ct-woo-card-wrapper:hover {
  border-color: var(--id-ink) !important;
}

/* Product image area */
.woocommerce ul.products li.product .ct-image-container,
.woocommerce ul.products li.product a img {
  background: var(--id-bg) !important;
}

/* Product title */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.ct-woo-card-wrapper .ct-woo-card-title {
  font-family: var(--id-display) !important;
  font-size: 20px !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  letter-spacing: -0.01em !important;
  color: var(--id-ink) !important;
}

/* Price */
.woocommerce ul.products li.product .price,
.ct-woo-card-wrapper .price {
  font-family: var(--id-mono) !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  color: var(--id-signal) !important;
}
.woocommerce ul.products li.product .price del {
  color: var(--id-ink-faint) !important;
  font-size: 13px !important;
}
.woocommerce ul.products li.product .price ins {
  text-decoration: none !important;
}

/* Sale badge */
.woocommerce span.onsale {
  background: var(--id-signal) !important;
  color: var(--id-paper) !important;
  font-family: var(--id-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 5px 10px !important;
  min-width: auto !important;
  min-height: auto !important;
  line-height: 1 !important;
}

/* Product meta (SKU, categories) inside card */
.ct-product-card-meta,
.woocommerce ul.products li.product .product-category {
  font-family: var(--id-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--id-ink-faint) !important;
}

/* ═══════════════════════════════════════════════════════════
   WOOCOMMERCE — SINGLE PRODUCT PAGE
   ═══════════════════════════════════════════════════════════ */

.woocommerce div.product .woocommerce-product-gallery {
  background: var(--id-bg);
}

/* Breadcrumb */
.woocommerce .woocommerce-breadcrumb {
  font-family: var(--id-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: var(--id-ink-faint) !important;
}
.woocommerce .woocommerce-breadcrumb a {
  color: var(--id-ink-faint) !important;
}

/* Product title */
.woocommerce div.product h1.product_title {
  font-family: var(--id-display) !important;
  font-size: clamp(36px, 5vw, 64px) !important;
  line-height: 0.92 !important;
  text-transform: uppercase !important;
  letter-spacing: -0.02em !important;
  color: var(--id-ink) !important;
}

/* Product category (above title) */
.woocommerce div.product .posted_in,
.woocommerce div.product .product-cat {
  font-family: var(--id-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: var(--id-ink-faint) !important;
  display: block;
  margin-bottom: 12px;
}

/* Price on single product */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-family: var(--id-mono) !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  color: var(--id-signal) !important;
  border-top: 1px solid var(--id-line);
  padding-top: 20px !important;
  margin-top: 20px !important;
}
.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
  color: var(--id-ink-faint) !important;
  font-size: 16px !important;
}

/* Short description */
.woocommerce div.product .woocommerce-product-details__short-description {
  font-size: 15px !important;
  line-height: 1.55 !important;
  color: var(--id-ink-soft) !important;
}

/* Variations: size / color selectors */
.woocommerce div.product form.variations_form table.variations {
  border: none !important;
}
.woocommerce div.product form.variations_form table.variations td.label {
  font-family: var(--id-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--id-ink-faint) !important;
  padding-bottom: 8px !important;
}
.woocommerce div.product form.variations_form .reset_variations {
  font-family: var(--id-mono) !important;
  font-size: 11px !important;
  color: var(--id-ink-faint) !important;
}

/* Quantity input */
.woocommerce .quantity .qty {
  border: 1px solid var(--id-ink) !important;
  border-radius: 0 !important;
  font-family: var(--id-mono) !important;
  font-size: 16px !important;
  color: var(--id-ink) !important;
  background: transparent !important;
  padding: 12px 16px !important;
}

/* Product tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  padding: 0 !important;
  border-bottom: 1px solid var(--id-ink) !important;
  background: transparent !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  border: none !important;
  background: transparent !important;
  border-radius: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family: var(--id-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--id-ink-faint) !important;
  padding: 14px 20px !important;
  border: none !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--id-ink) !important;
  background: transparent !important;
  border-bottom: 2px solid var(--id-ink) !important;
}
.woocommerce div.product .woocommerce-tabs .panel {
  background: var(--id-paper) !important;
  border: 1px solid var(--id-line) !important;
  border-top: none !important;
  padding: 32px !important;
}

/* Product meta (SKU etc.) */
.woocommerce div.product .product_meta {
  font-family: var(--id-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--id-ink-faint) !important;
  border-top: 1px solid var(--id-line);
  padding-top: 16px !important;
  margin-top: 16px !important;
}

/* Related products heading */
.woocommerce .related h2,
.woocommerce .up-sells h2,
.woocommerce .cross-sells h2 {
  font-family: var(--id-display) !important;
  font-size: 32px !important;
  text-transform: uppercase !important;
  letter-spacing: -0.02em !important;
  border-bottom: 1px solid var(--id-ink);
  padding-bottom: 12px;
}

/* ═══════════════════════════════════════════════════════════
   WOOCOMMERCE — CART & CHECKOUT
   ═══════════════════════════════════════════════════════════ */

.woocommerce-cart table.cart {
  border: 1px solid var(--id-line);
  background: var(--id-paper);
}

/* Checkout: no outer box — keep the layout open like the rest of the site.
   Blocksy already places billing (left) and order review (right) side by side;
   we only restyle the review column as a padded card, without touching the columns. */
.woocommerce-checkout .woocommerce {
  border: none !important;
  background: transparent !important;
}
/* Order-review column: padded card, not tight to content */
.woocommerce-checkout #order_review {
  background: var(--id-paper);
  border: 1px solid var(--id-line);
  padding: 28px 28px 32px;
}
.woocommerce-checkout #order_review .shop_table {
  border: none !important;
  background: transparent !important;
  margin-bottom: 20px;
}
.woocommerce-checkout #order_review .shop_table th,
.woocommerce-checkout #order_review .shop_table td {
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--id-line) !important;
}
.woocommerce-checkout #order_review .shop_table tfoot .order-total th,
.woocommerce-checkout #order_review .shop_table tfoot .order-total td {
  border-bottom: none !important;
  border-top: 1px solid var(--id-ink) !important;
  padding-top: 16px !important;
}
.woocommerce-checkout #order_review .order-total .amount {
  color: var(--id-signal) !important;
  font-family: var(--id-mono) !important;
  font-size: 20px !important;
}
/* Place-order button spans the card full width */
.woocommerce-checkout #order_review #place_order,
.woocommerce-checkout #payment #place_order {
  width: 100% !important;
  justify-content: center;
  margin-top: 20px !important;
}
.woocommerce-checkout #payment {
  background: transparent !important;
  border-radius: 0 !important;
}

.woocommerce-cart table.cart th,
.woocommerce table.shop_table th {
  font-family: var(--id-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--id-ink-faint) !important;
  border-bottom: 1px solid var(--id-ink) !important;
  padding: 12px 16px !important;
  background: transparent !important;
}

.woocommerce-cart table.cart td,
.woocommerce table.shop_table td {
  border-bottom: 1px solid var(--id-line) !important;
  padding: 16px !important;
  vertical-align: middle !important;
}

.woocommerce .cart-collaterals .cart_totals h2,
.woocommerce-checkout h3 {
  font-family: var(--id-display) !important;
  font-size: 24px !important;
  text-transform: uppercase !important;
  letter-spacing: -0.01em !important;
  border-bottom: 1px solid var(--id-ink);
  padding-bottom: 12px;
  margin-bottom: 20px !important;
}

/* Form fields */
.woocommerce-checkout .woocommerce-input-wrapper input,
.woocommerce-checkout .woocommerce-input-wrapper select,
.woocommerce-checkout .woocommerce-input-wrapper textarea,
.woocommerce form .input-text {
  border: 1px solid var(--id-line) !important;
  border-radius: 0 !important;
  background: var(--id-paper) !important;
  color: var(--id-ink) !important;
  font-family: var(--id-sans) !important;
  padding: 12px 14px !important;
}
.woocommerce form .input-text:focus {
  border-color: var(--id-ink) !important;
  outline: none !important;
}

/* ═══════════════════════════════════════════════════════════
   WOOCOMMERCE — CART & CHECKOUT *BLOCKS* (Gutenberg-based, .wc-block-*)
   The default WP cart/checkout pages use these block classes, not the
   legacy shortcode markup styled above.
   ═══════════════════════════════════════════════════════════ */

/* Kill rounded corners across all cart/checkout block UI */
.wp-block-woocommerce-cart :where(input, button, select, textarea, .wc-block-components-button, .wc-block-components-panel),
.wp-block-woocommerce-checkout :where(input, button, select, textarea, .wc-block-components-button, .wc-block-components-panel) {
  border-radius: 0 !important;
}

/* Section headings ("Кошик", "Підсумки кошика", checkout steps) */
.wp-block-woocommerce-cart .wc-block-components-title,
.wp-block-woocommerce-checkout .wc-block-components-title,
.wc-block-cart__totals-title,
.wc-block-components-checkout-step__title {
  font-family: var(--id-display) !important;
  text-transform: uppercase !important;
  letter-spacing: -0.01em !important;
  color: var(--id-ink) !important;
}

/* Table headers row ("ТОВАР / ЗАГАЛОМ") */
.wc-block-cart-items__header,
.wc-block-cart-items__header th {
  font-family: var(--id-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--id-ink-faint) !important;
  border-bottom: 1px solid var(--id-ink) !important;
}

/* Cart row separators */
.wc-block-cart-items__row,
.wc-block-cart-item__wrap {
  border-bottom: 1px solid var(--id-line) !important;
}

/* Product image placeholder box */
.wc-block-cart-item__image img,
.wc-block-components-order-summary-item__image img {
  border: 1px solid var(--id-line) !important;
  background: var(--id-bg) !important;
}

/* Product names / links */
.wc-block-components-product-name {
  font-family: var(--id-display) !important;
  font-size: 16px !important;
  text-transform: uppercase !important;
  letter-spacing: -0.01em !important;
  color: var(--id-ink) !important;
  text-decoration: none !important;
}
.wc-block-components-product-name:hover { color: var(--id-signal) !important; }

/* Prices / totals in mono */
.wc-block-components-formatted-money-amount,
.wc-block-components-totals-item__value,
.wc-block-cart-item__total-price-and-sale-badge-wrapper {
  font-family: var(--id-mono) !important;
  color: var(--id-ink) !important;
}

/* Totals rows */
.wc-block-components-totals-item__label {
  font-family: var(--id-mono) !important;
  font-size: 12px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--id-ink-soft) !important;
}
.wc-block-components-totals-footer-item {
  border-top: 1px solid var(--id-ink) !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--id-signal) !important;
}

/* Cart sidebar: ONE clean padded card instead of many bordered rows */
.wc-block-cart__sidebar > .wc-block-components-sidebar,
.wp-block-woocommerce-cart .wc-block-cart__sidebar {
  background: var(--id-paper) !important;
  border: 1px solid var(--id-line) !important;
  padding: 24px !important;
}
/* Strip the per-section divider lines that made it look busy */
.wp-block-woocommerce-cart .wc-block-components-totals-wrapper {
  border: 0 !important;
  padding: 8px 0 !important;
}
.wp-block-woocommerce-cart .wc-block-components-panel {
  border: 0 !important;
  background: transparent !important;
}
/* Hide the shipping estimate in the CART (shipping is chosen at checkout) */
.wp-block-woocommerce-cart .wc-block-components-totals-shipping,
.wp-block-woocommerce-cart .wc-block-components-shipping-rates-control,
.wp-block-woocommerce-cart .wc-block-cart__shipping-method {
  display: none !important;
}
/* Keep only a single hairline above the grand total for hierarchy */
.wp-block-woocommerce-cart .wc-block-components-totals-footer-item {
  border-top: 1px solid var(--id-ink) !important;
  margin-top: 4px !important;
  padding-top: 14px !important;
}

/* Quantity selector */
.wc-block-components-quantity-selector {
  border: 1px solid var(--id-ink) !important;
  border-radius: 0 !important;
}
.wc-block-components-quantity-selector__input,
.wc-block-components-quantity-selector__button {
  font-family: var(--id-mono) !important;
  color: var(--id-ink) !important;
  background: transparent !important;
}

/* Form inputs (checkout fields) */
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-select select,
.wp-block-woocommerce-checkout input[type="text"],
.wp-block-woocommerce-checkout input[type="email"],
.wp-block-woocommerce-checkout input[type="tel"] {
  border: 1px solid var(--id-line) !important;
  border-radius: 0 !important;
  background: var(--id-paper) !important;
  color: var(--id-ink) !important;
  font-family: var(--id-sans) !important;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-text-input input:focus {
  border-color: var(--id-ink) !important;
  color: var(--id-ink-faint) !important;
}

/* Coupon accordion */
.wc-block-components-panel__button {
  font-family: var(--id-mono) !important;
  font-size: 12px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--id-ink) !important;
}

/* Primary action buttons: "Перейти до оформлення", "Place order",
   "Apply coupon" — brand terracotta, square, matching the add-to-cart CTA */
.wc-block-components-button.wc-block-components-button.contained,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
  background: var(--id-signal) !important;
  border: 1px solid var(--id-signal) !important;
  color: var(--id-paper) !important;
  border-radius: 0 !important;
  font-family: var(--id-sans) !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}
.wc-block-components-button.wc-block-components-button.contained:hover,
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
  background: var(--id-signal-bright) !important;
  border-color: var(--id-signal-bright) !important;
}

/* Radios & checkboxes → brand accent (was default blue) */
.wp-block-woocommerce-cart input[type="radio"],
.wp-block-woocommerce-cart input[type="checkbox"],
.wp-block-woocommerce-checkout input[type="radio"],
.wp-block-woocommerce-checkout input[type="checkbox"],
.wc-block-components-radio-control__input,
.wc-block-components-checkbox__input {
  accent-color: var(--id-signal) !important;
}

/* Selected shipping/payment option outline */
.wc-block-components-radio-control__option--checked,
.wc-block-components-shipping-rates-control__package .wc-block-components-radio-control-accordion-option--checked {
  border-color: var(--id-signal) !important;
}

/* Secondary / outlined block buttons (e.g. apply coupon) */
.wc-block-components-button.outlined {
  border: 1px solid var(--id-ink) !important;
  color: var(--id-ink) !important;
  border-radius: 0 !important;
  font-family: var(--id-mono) !important;
  text-transform: uppercase !important;
}

/* Links inside cart/checkout (remove item, edit) */
.wp-block-woocommerce-cart a:not(.wc-block-components-product-name),
.wp-block-woocommerce-checkout a:not(.wc-block-components-product-name) {
  color: var(--id-signal) !important;
}

/* ═══════════════════════════════════════════════════════════
   WOOCOMMERCE — MY ACCOUNT
   ═══════════════════════════════════════════════════════════ */

.woocommerce-account .woocommerce {
  display: flex;
  gap: 48px;
  align-items: flex-start;
}
.woocommerce-account .woocommerce-MyAccount-navigation {
  flex: 0 0 260px;
  float: none !important;
  width: auto !important;
}
.woocommerce-account .woocommerce-MyAccount-content {
  flex: 1;
  float: none !important;
  width: auto !important;
}

/* Navigation as a bordered list, brand typography */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
  border: 1px solid var(--id-line);
  background: var(--id-paper);
}
.woocommerce-account .woocommerce-MyAccount-navigation li {
  margin: 0;
  border-bottom: 1px solid var(--id-line);
}
.woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
  border-bottom: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 14px 18px;
  font-family: var(--id-mono) !important;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--id-ink-soft) !important;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
  background: var(--id-bg);
  color: var(--id-ink) !important;
}
/* Active item → brand ink (was default blue) */
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
  background: var(--id-ink);
  color: var(--id-paper) !important;
}

/* Content area headings + links */
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
  font-family: var(--id-display) !important;
  text-transform: uppercase !important;
  letter-spacing: -0.01em !important;
  color: var(--id-ink) !important;
}
.woocommerce-account .woocommerce-MyAccount-content a {
  color: var(--id-signal) !important;
}
.woocommerce-account .woocommerce-MyAccount-content a:hover {
  color: var(--id-signal-bright) !important;
}
.woocommerce-account .woocommerce-MyAccount-content mark {
  background: transparent;
  color: var(--id-ink);
  font-weight: 700;
}

/* Account tables (orders, addresses) */
.woocommerce-account .woocommerce-orders-table,
.woocommerce-account .shop_table {
  border: 1px solid var(--id-line) !important;
}
.woocommerce-account .woocommerce-orders-table th,
.woocommerce-account .shop_table th {
  font-family: var(--id-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--id-ink-faint) !important;
}

@media (max-width: 782px) {
  .woocommerce-account .woocommerce { flex-direction: column; gap: 24px; }
  .woocommerce-account .woocommerce-MyAccount-navigation { flex-basis: auto; width: 100% !important; }
}

/* ═══════════════════════════════════════════════════════════
   WOOCOMMERCE — ORDER RECEIVED / THANK YOU
   ═══════════════════════════════════════════════════════════ */

/* "Дякуємо, ваше замовлення отримано" notice */
.woocommerce-order .woocommerce-notice--success,
.woocommerce-order .woocommerce-thankyou-order-received {
  font-family: var(--id-display) !important;
  font-size: 20px !important;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  color: var(--id-ink) !important;
  background: transparent !important;
  border: none !important;
  border-left: 3px solid var(--id-signal) !important;
  padding: 6px 0 6px 18px !important;
  margin: 0 0 36px !important;
}
.woocommerce-order .woocommerce-notice--success::before,
.woocommerce-order .woocommerce-thankyou-order-received::before { display: none !important; }

/* Order overview: Номер / Дата / E-mail / Всього / Спосіб оплати */
.woocommerce-order ul.woocommerce-order-overview {
  list-style: none;
  margin: 0 0 40px !important;
  padding: 26px 30px !important;
  border: 1px solid var(--id-line);
  background: var(--id-paper);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 24px;
}
.woocommerce-order ul.woocommerce-order-overview li {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  font-family: var(--id-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--id-ink-faint);
}
.woocommerce-order ul.woocommerce-order-overview li strong {
  display: block;
  margin-top: 8px;
  font-family: var(--id-sans);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--id-ink);
}

/* Section headings on the order + bank details */
.woocommerce-order .woocommerce-order-details__title,
.woocommerce-order .woocommerce-column__title,
.woocommerce-order h2 {
  font-family: var(--id-display) !important;
  font-size: 20px !important;
  text-transform: uppercase !important;
  letter-spacing: -0.01em !important;
  border-bottom: 1px solid var(--id-ink);
  padding-bottom: 10px;
  margin: 36px 0 16px !important;
}

/* Bank details list */
.woocommerce-order .wc-bacs-bank-details {
  list-style: none;
  margin: 0 0 8px !important;
  padding: 18px 22px !important;
  border: 1px solid var(--id-line);
  background: var(--id-paper);
}
.woocommerce-order .wc-bacs-bank-details li {
  border: none !important;
  padding: 4px 0 !important;
  font-size: 14px;
}

/* Customer details addresses */
.woocommerce-order .woocommerce-customer-details address {
  border: 1px solid var(--id-line) !important;
  border-radius: 0 !important;
  padding: 18px 22px !important;
  font-style: normal;
  line-height: 1.65;
}
.woocommerce-order .woocommerce-columns--addresses {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 28px;
}

/* ═══════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════ */

.ct-footer,
#colophon {
  background: var(--id-bg-deep) !important;
  color: var(--id-ice) !important;
  border-top: none !important;
}

.ct-footer a,
#colophon a {
  color: var(--id-ice) !important;
  text-decoration: none;
}
.ct-footer a:hover,
#colophon a:hover {
  color: var(--id-signal) !important;
}

.ct-footer .widget-title,
#colophon .widget-title {
  font-family: var(--id-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--id-frost) !important;
  margin-bottom: 16px !important;
  border: none !important;
}

.ct-footer .ct-copyright,
.site-info {
  font-family: var(--id-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--id-frost) !important;
  border-top: 1px solid var(--id-steel-deep) !important;
  padding-top: 24px !important;
}

/* ═══════════════════════════════════════════════════════════
   BLOCKS — Global page content
   ═══════════════════════════════════════════════════════════ */

.wp-block-cover,
.wp-block-group {
  border-radius: 0 !important;
}

/* Highlighted / featured section with dark bg */
.id-section--dark {
  background: var(--id-bg-deep) !important;
  color: var(--id-ice) !important;
}
.id-section--dark h1,
.id-section--dark h2,
.id-section--dark h3 {
  color: var(--id-ice) !important;
}

/* ── Product card: SKU chip (injected via PHP hook) ──────── */
.icedog-product-index {
  display: flex;
  justify-content: space-between;
  padding: 8px 12px;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--id-ink-faint);
  border-bottom: 1px solid var(--id-line);
  background: var(--id-paper);
}

/* Single product: category above title */
.icedog-product-cat {
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--id-ink-faint);
  margin-bottom: 10px;
}

/* ── Variation labels ────────────────────────────────────── */
.woocommerce div.product form.variations_form table.variations td.label label {
  font-family: var(--id-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--id-ink-faint) !important;
  font-weight: 400 !important;
}

/* Hide native selects — replaced by swatches */
.woocommerce div.product form.variations_form select[id^="pa_"] {
  display: none !important;
}

/* ── Shared swatch row ───────────────────────────────────── */
.id-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 4px;
}

/* ── Size swatch — квадрат з текстом, як кольоровий ─────── */
.id-size-swatch {
  width: 40px;
  height: 40px;
  border: 1px solid var(--id-ink);
  background: transparent;
  color: var(--id-ink);
  font-family: var(--id-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.12s ease, color 0.12s ease;
  line-height: 1;
}
.id-size-swatch:hover {
  background: var(--id-ice);
}
.id-size-swatch.id-swatch--active {
  background: var(--id-ink);
  color: var(--id-paper);
}
.id-size-swatch.id-swatch--unavailable {
  opacity: 0.3;
  cursor: not-allowed;
  text-decoration: line-through;
}

/* ── Color swatch — суцільний квадрат ───────────────────── */
.id-color-swatch {
  width: 40px;
  height: 40px;
  border: 1px solid var(--id-line);
  cursor: pointer;
  padding: 0;
  position: relative;
  transition: border-color 0.12s ease;
  flex-shrink: 0;
}
.id-color-swatch:hover {
  border-color: var(--id-ink);
}
.id-color-swatch.id-swatch--active {
  border: 2px solid var(--id-ink);
  outline: 2px solid var(--id-paper);
  outline-offset: -4px;
}
.id-color-swatch.id-swatch--unavailable {
  opacity: 0.3;
  cursor: not-allowed;
}
.id-color-swatch.id-swatch--unavailable::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top right,
    transparent calc(50% - 0.5px),
    rgba(0,0,0,0.4) calc(50% - 0.5px),
    rgba(0,0,0,0.4) calc(50% + 0.5px),
    transparent calc(50% + 0.5px)
  );
}

/* ── Generic text-block swatch (non size/color attributes) ── */
.id-text-swatch {
  min-width: 40px;
  height: 40px;
  padding: 0 14px;
  border: 1px solid var(--id-ink);
  background: transparent;
  color: var(--id-ink);
  font-family: var(--id-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.12s ease, color 0.12s ease;
  line-height: 1;
}
.id-text-swatch:hover { background: var(--id-ice); }
.id-text-swatch.id-swatch--active { background: var(--id-ink); color: var(--id-paper); }
.id-text-swatch.id-swatch--unavailable {
  opacity: 0.3;
  cursor: not-allowed;
  text-decoration: line-through;
}

/* Selected color name label under the color swatches */
.id-color-label {
  display: block;
  margin-top: 8px;
  font-family: var(--id-mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--id-ink-soft);
  min-height: 1em;
}

/* Hide the underlying variation dropdowns — the swatches drive them.
   Every attribute now renders a swatch, so no dropdown is needed.
   (Selector kept independent of the .woocommerce/div.product wrapper because
   the custom single-product template does not output those ancestors.) */
form.variations_form .variations td.value select,
form.variations_form .reset_variations {
  display: none !important;
}

/* The chosen variation's price is reflected in the main price (via JS),
   so hide the duplicate price inside the variation wrap. */
.single_variation_wrap .woocommerce-variation-price {
  display: none !important;
}

/* ── Notices / alerts ────────────────────────────────────── */
.woocommerce-message,
.woocommerce-info {
  border-top: 3px solid var(--id-signal) !important;
  background: var(--id-paper) !important;
  border-radius: 0 !important;
}
.woocommerce-error {
  border-top: 3px solid #c0392b !important;
  background: var(--id-paper) !important;
  border-radius: 0 !important;
}

/* ── Pagination ──────────────────────────────────────────── */
.woocommerce nav.woocommerce-pagination ul {
  border: 1px solid var(--id-ink) !important;
  border-radius: 0 !important;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  font-family: var(--id-mono) !important;
  font-size: 13px !important;
  border-right: 1px solid var(--id-ink) !important;
  color: var(--id-ink) !important;
}
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover {
  background: var(--id-ink) !important;
  color: var(--id-paper) !important;
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════ */

/* ── Button variants ─────────────────────────────────────── */

.btn-ghost {
  background: transparent !important;
  color: var(--id-ink) !important;
}
.btn-ghost:hover {
  background: var(--id-ink) !important;
  color: var(--id-paper) !important;
}

.btn-signal {
  background: var(--id-signal) !important;
  border-color: var(--id-signal) !important;
  color: var(--id-paper) !important;
}
.btn-signal:hover {
  background: var(--id-signal-bright) !important;
  border-color: var(--id-signal-bright) !important;
  color: var(--id-paper) !important;
}

/* ── Section sections utility ────────────────────────────── */

.id-product-card {
  background: var(--id-paper);
  border: 1px solid var(--id-line);
  border-radius: 0;
  transition: border-color 0.15s ease;
  display: flex;
  flex-direction: column;
}
.id-product-card:hover {
  border-color: var(--id-ink);
}

/* ── Reveal animation ────────────────────────────────────── */

.reveal {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.reveal.in {
  opacity: 1;
  transform: none;
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  .id-frame {
    padding: 0 16px;
  }

  .woocommerce div.product h1.product_title {
    font-size: 32px !important;
  }

  .id-hero .id-display {
    font-size: clamp(52px, 14vw, 120px) !important;
  }
}
