/* KreftMotion: global black and white look for the Blocksy theme. Loaded by the KreftMotion Style plugin. */

/* 1. Colour palette (black and white) */
html:root {
  --theme-palette-color-1: #ffffff;
  --theme-palette-color-2: #bdbdbd;
  --theme-palette-color-3: #c7c7c7;
  --theme-palette-color-4: #ffffff;
  --theme-palette-color-5: #262626;
  --theme-palette-color-6: #0d0d0d;
  --theme-palette-color-7: #070707;
  --theme-palette-color-8: #000000;
  --theme-text-color: #c7c7c7;
  --theme-headings-color: #ffffff;
  --theme-link-initial-color: #ffffff;
  --theme-link-hover-color: #bdbdbd;
  --theme-border-color: #262626;
  --theme-button-text-initial-color: #000000;
  --theme-button-text-hover-color: #ffffff;
  --theme-button-background-initial-color: #ffffff;
  --theme-button-background-hover-color: transparent;
}
body { background: #000 !important; color: #c7c7c7; }

/* 2. Header: hide the template's promo bar, make the bar black */
.ct-header [data-row*="top"] { display: none !important; }
.ct-header [data-row],
.ct-header [data-row] > div { background-color: #000 !important; background-image: none !important; }
.ct-header [data-row] { border-bottom: 1px solid #262626; }
.ct-header a, .ct-header .site-title a, .ct-header .ct-label,
.ct-header .ct-menu-link, .ct-header .ct-icon { color: #fff !important; fill: #fff !important; }
.ct-header .site-title a { letter-spacing: .28em; font-weight: 800; text-transform: uppercase; }
.ct-header .ct-menu-link { font-weight: 600; letter-spacing: .04em; }
#offcanvas .ct-panel-inner { background: #000 !important; }

/* 3. Footer */
.ct-footer [data-row], .ct-footer [data-row] > div { background-color: #000 !important; }
.ct-footer, .ct-footer a, .ct-footer .widget-title { color: #9a9a9a; }
.ct-footer a:hover { color: #fff; }

/* 4. Buttons everywhere (shop, cart, checkout) */
.button, button[type="submit"], .wp-element-button, .added_to_cart,
.woocommerce a.button, .woocommerce button.button, .wc-block-components-button:not(.is-link) {
  border-radius: 0 !important; font-weight: 700; background: #fff; color: #000; border: 1px solid #fff;
}
.button:hover, button[type="submit"]:hover, .woocommerce a.button:hover,
.woocommerce button.button:hover, .wc-block-components-button:not(.is-link):hover {
  background: transparent; color: #fff;
}

/* 5. Shop, product, cart and checkout pages on black */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title a,
.woocommerce div.product .product_title { color: #fff; }
.woocommerce .price, .woocommerce .price * { color: #fff !important; }
.woocommerce span.onsale { background: #fff; color: #000; border-radius: 0; }
.woocommerce-breadcrumb, .woocommerce-breadcrumb a { color: #9a9a9a; }
.woocommerce table.shop_table, .woocommerce table.shop_table td,
.woocommerce table.shop_table th { border-color: #262626; color: #fff; }
.woocommerce-message, .woocommerce-info, .woocommerce-error {
  background: transparent; color: #fff; border: 1px solid #262626; border-top-color: #fff;
}
input[type="text"], input[type="email"], input[type="tel"], input[type="password"],
input[type="number"], input[type="search"], select, textarea,
.wc-block-components-text-input input {
  background: transparent !important; color: #fff !important;
  border: 1px solid #4a4a4a; border-radius: 0;
}
input:focus, select:focus, textarea:focus { border-color: #fff; }

/* 6. Product image hover zoom (shop pages) */
@media (prefers-reduced-motion: no-preference) {
  .woocommerce ul.products li.product .ct-media-container img { transition: transform .7s ease; }
  .woocommerce ul.products li.product:hover .ct-media-container img { transform: scale(1.045); }
}
.woocommerce ul.products li.product .ct-media-container { overflow: hidden; }

/* 7. Visible keyboard focus */
a:focus-visible, button:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* 8. Mobile menu icon and cart count stay visible on black */
.ct-header-trigger .ct-icon, .ct-header-cart .ct-icon { fill: #fff !important; }
.ct-header-cart .ct-dynamic-count-cart { background: #fff; color: #000; }