/*
Theme Name: KillerShirts – Flatsome Child
Theme URI: https://killershirts.com
Description: Flatsome child theme for KillerShirts. Dark neon style, WooCommerce tuned.
Author: You
Template: flatsome
Version: 1.3.0
Text Domain: killershirts-flatsome-child
*/

:root {
  --ks-neon: #00d26a;
  --ks-neon-contrast: #0a0a0b;
  --ks-bg: #0a0a0b;
  --ks-text: #f2f2f2;
  --ks-muted: #d0d0d0;
  --ks-neon-hover: color-mix(in srgb, #00d26a 80%, black);
}

body { background-color: var(--ks-bg); color: var(--ks-text); }
a, .ux-menu-link__link { color: var(--ks-neon); }
a:hover, .ux-menu-link__link:hover { color: var(--ks-neon-hover); }

h1, h2, h3, h4, h5, h6 { text-transform: uppercase; letter-spacing: .5px; }
.header, .header-wrapper { background: var(--ks-bg) !important; }

/* Buttons */
.button, .button.primary, button, input[type=submit], .add_to_cart_button {
  background: var(--ks-neon);
  color: var(--ks-neon-contrast) !important;
  border-radius: 6px;
  border: none;
}
.button:hover, .button.primary:hover, button:hover, input[type=submit]:hover, .add_to_cart_button:hover {
  background: var(--ks-neon-hover);
}

/* WooCommerce highlights */
.price, .woocommerce-Price-amount { color: var(--ks-neon); }
.badge-container .badge { background: var(--ks-neon); color: var(--ks-neon-contrast); }
.woocommerce-message, .woocommerce-info { border-top-color: var(--ks-neon); }
.star-rating span::before { color: var(--ks-neon); }

/* Header logo sizing */
.header-logo a img { max-height: 64px; }

/* Product cards */
.box-image .image-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
  pointer-events: none;
}
.product-small .title-wrapper a { color: var(--ks-text); }
.product-small .title-wrapper a:hover { color: var(--ks-neon); }

/* Footer */
.footer { background: #0b0b0c; color: var(--ks-muted); }
.footer a { color: var(--ks-neon); }

/* Forms */
input, select, textarea {
  background: #111; color: var(--ks-text); border-color: #222;
}
input:focus, select:focus, textarea:focus { border-color: var(--ks-neon); box-shadow: 0 0 0 1px var(--ks-neon); }

/* Mobile menu accent */
.nav-dropdown {
  border-top: 2px solid var(--ks-neon);
}

/* Promo Bar */
.ks-promo { position: sticky; top: 0; z-index: 9999; background: var(--ks-bg); border-bottom: 2px solid var(--ks-neon); }
.ks-promo-inner { max-width: 1200px; margin: 0 auto; padding: 10px 16px; color: var(--ks-text); display: flex; gap: 12px; align-items: center; justify-content: center; }
.ks-promo .ks-promo-close { background: transparent; border: none; font-size: 20px; line-height: 1; color: var(--ks-muted); margin-left: 8px; cursor: pointer; }
.ks-promo .ks-promo-close:hover { color: var(--ks-neon); }

/* Single Product Layout */
.single-product .product-main { gap: 30px; }
.single-product .product-gallery { flex-basis: 58% !important; }
.single-product .product-info { flex-basis: 42% !important; }
.single-product .single_add_to_cart_button { font-size: 16px; padding: 14px 18px; }
.single-product .cart { display: flex; gap: 10px; align-items: center; }
.single-product .price { font-size: 24px; color: var(--ks-neon); }
.single-product .quantity input.qty { max-width: 90px; background: #111; color: var(--ks-text); border-color: #222; }

/* Off-canvas cart */
#cart-popup, .widget_shopping_cart_content, .off-canvas .widget_shopping_cart, .off-canvas .cart-sidebar {
  background: #0b0b0c;
  color: var(--ks-text);
}
.off-canvas .cart-sidebar a, .off-canvas .widget_shopping_cart a { color: var(--ks-text); }
.off-canvas .cart-sidebar a:hover { color: var(--ks-neon); }
.off-canvas .cart-sidebar .quantity, .off-canvas .cart-sidebar .woocommerce-mini-cart__total strong { color: var(--ks-neon); }
.off-canvas .button.checkout { background: var(--ks-neon); color: var(--ks-neon-contrast)!important; }
.off-canvas .button.checkout:hover { background: var(--ks-neon-hover); }

/* ===== A11y / Focus ===== */
:root { --ks-focus: color-mix(in srgb, var(--ks-neon) 60%, white); }
:focus-visible { outline: 2px solid var(--ks-focus); outline-offset: 2px; }
::selection { background: color-mix(in srgb, var(--ks-neon) 35%, black); color: var(--ks-neon-contrast); }

/* Respect dark UI for form controls (helps date/time pickers) */
html { color-scheme: dark; }

/* ===== Header / Nav ===== */
.header-nav .nav > li > a { color: var(--ks-text); }
.header-nav .nav > li:hover > a,
.header-nav .nav > li.current-menu-item > a,
.header-nav .nav > li.current-menu-ancestor > a { color: var(--ks-neon); }

.nav-dropdown,
.nav-dropdown-has-arrow .nav-dropdown { background: #0b0b0c; border-top: 2px solid var(--ks-neon); }
.nav-dropdown a:hover { color: var(--ks-neon); }

/* Hamburger / mobile toggle */
.mobile-nav .icon-menu, .off-canvas-toggle .icon-menu { color: var(--ks-text); }
.off-canvas-toggle:hover .icon-menu { color: var(--ks-neon); }

/* Sticky header subtle shadow for contrast on dark bg */
.header-wrapper.stuck { box-shadow: 0 2px 12px rgba(0,0,0,.5); }

/* If you ever use header transparency over images */
.header.transparent .header-nav > li > a { color: var(--ks-text); }
.header.transparent .header-nav > li > a:hover { color: var(--ks-neon); }

/* ===== Links / Breadcrumbs / Pagination ===== */
.breadcrumbs a { color: var(--ks-muted); }
.breadcrumbs a:hover { color: var(--ks-neon); }
.breadcrumbs .separator { color: #777; }

.page-numbers li .page-number,
.page-numbers li a,
.pagination a { color: var(--ks-text); background: #111; border: 1px solid #222; border-radius: 6px; }
.page-numbers .current,
.page-numbers a:hover { background: var(--ks-neon); color: var(--ks-neon-contrast); border-color: var(--ks-neon); }

/* ===== Buttons (variants & disabled) ===== */
.button.secondary, .button.outline, .woocommerce a.button.alt {
  background: transparent; color: var(--ks-neon); border: 1px solid var(--ks-neon);
}
.button.secondary:hover, .button.outline:hover, .woocommerce a.button.alt:hover {
  background: var(--ks-neon); color: var(--ks-neon-contrast);
}
button[disabled], .button.disabled, .disabled.button,
input[type=submit][disabled] {
  opacity: .5; cursor: not-allowed; filter: saturate(.6);
}

/* ===== Forms (placeholders, errors, success) ===== */
::placeholder { color: #9a9a9a; }
.woocommerce-error, .woocommerce-info, .woocommerce-message {
  background: #0f0f10; color: var(--ks-text); border: 1px solid #222; border-left: 3px solid var(--ks-neon);
}
.woocommerce-error { border-left-color: #ff5a5a; }
.woocommerce-info { border-left-color: #4aa3ff; }
.woocommerce-message { border-left-color: var(--ks-neon); }

/* Invalid field highlights */
.woocommerce-invalid input.input-text,
input.input-text:invalid, select:invalid, textarea:invalid {
  border-color: #ff5a5a; box-shadow: 0 0 0 1px #ff5a5a33;
}

/* Checkout tweaks */
.select2-container .select2-selection--single {
  background: #111; border: 1px solid #222; color: var(--ks-text);
}
.select2-dropdown { background: #0b0b0c; color: var(--ks-text); border: 1px solid #222; }

/* ===== Tables (cart, account, order summary) ===== */
.shop_table, table {
  background: #0b0b0c; border-color: #222; color: var(--ks-text);
}
.shop_table th, .shop_table td, table th, table td { border-color: #222; }
.shop_table thead th { background: #111; }

/* ===== Product details (tabs, badges, count) ===== */
.woocommerce-tabs .tabs li a { color: var(--ks-muted); }
.woocommerce-tabs .tabs li.active a,
.woocommerce-tabs .tabs li a:hover { color: var(--ks-neon); }
.badge-container .badge { font-weight: 700; }

/* Mini-cart count bubble */
.header-button .cart-icon strong, .cart-icon strong {
  background: var(--ks-neon); color: var(--ks-neon-contrast);
}

/* Variation / reset link */
.variations_form .reset_variations { color: var(--ks-muted); }
.variations_form .reset_variations:hover { color: var(--ks-neon); }

/* Reviews */
.comment-form textarea, .comment-form input[type=text], .comment-form input[type=email] {
  background:#111; border:1px solid #222; color:var(--ks-text);
}

/* ===== Sliders / arrows / dots (Flatsome) ===== */
.slider-nav-light .flickity-prev-next-button,
.slider-nav-light .flickity-prev-next-button:hover {
  background: #111; color: var(--ks-text);
}
.flickity-page-dots .dot { background: #444; }
.flickity-page-dots .dot.is-selected { background: var(--ks-neon); }

/* ===== Overlay / modals ===== */
.mfp-bg, .off-canvas-overlay { background: rgba(0,0,0,.7) !important; }

/* ===== Footer minor elements ===== */
.footer .is-divider { background: #222; }

/* ===== Admin bar + sticky promo spacing (when logged in) ===== */
.admin-bar .ks-promo { top: 32px; } /* WP admin bar height on desktop */
@media (max-width: 782px) { .admin-bar .ks-promo { top: 46px; } }
