/*
Theme Name: Trackday Garage
Template: storefront
Description: Trackday-oriented child theme of Storefront - dark asphalt, vibrant red/yellow/cyan accents, circuit wallpaper.
Version: 1.0
Text Domain: trackday
*/

:root {
  --td-red: #ff2d2d;
  --td-yellow: #ffd400;
  --td-cyan: #00e5ff;
  --td-asphalt: #0d0d12;
  --td-panel: #17171f;
  --td-panel-2: #20202b;
  --td-text: #f2f2f5;
  --td-muted: #a9a9b8;
}

html { background: var(--td-asphalt); }
body, body.custom-background {
  background: var(--td-asphalt) url("wallpaper.svg") center / cover no-repeat fixed !important;
  color: var(--td-text);
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

/* Typography: bold racing italics for headings */
h1, h2, h3, h4, h5, h6, .site-title, .widget-title, .woocommerce-loop-product__title,
.product_title, .main-navigation ul li a, button, .button, input[type="submit"] {
  font-family: "Impact", "Arial Black", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: .04em;
  text-transform: uppercase;
}
h1, h2, h3, h4, h5, h6, .site-title a, .site-title a:hover, .entry-title, .product_title { color: #fff; }
a { color: var(--td-yellow); }
a:hover, a:focus { color: var(--td-red); }
p, li, .woocommerce-result-count, label { color: var(--td-text); }

/* Header */
.site-header {
  background: linear-gradient(180deg, rgba(0,0,0,.92), rgba(13,13,18,.85)) !important;
  border-bottom: 4px solid var(--td-red);
  box-shadow: 0 6px 0 -2px var(--td-yellow), 0 14px 30px rgba(255,45,45,.35);
  color: var(--td-text);
}
.site-branding .site-title a { font-style: italic; font-size: 1.9em; text-shadow: 3px 3px 0 var(--td-red); }
.site-description { color: var(--td-yellow); text-transform: uppercase; letter-spacing: .2em; font-weight: 700; }
.main-navigation ul li a, .site-header .site-search, .site-header-cart a { color: #fff !important; }
.main-navigation ul li a:hover, .main-navigation ul li.current-menu-item > a { color: var(--td-yellow) !important; }
.main-navigation ul ul { background: var(--td-panel) !important; }
.site-header-cart .widget_shopping_cart { background: var(--td-panel); color: var(--td-text); }
.storefront-handheld-footer-bar { background: #000; }
.storefront-handheld-footer-bar ul li > a { background: #000; border-color: var(--td-red); color: #fff; }

input[type="text"], input[type="email"], input[type="search"], input[type="password"],
input[type="number"], input[type="tel"], textarea, select, .select2-container .select2-selection {
  background: var(--td-panel-2) !important;
  color: var(--td-text) !important;
  border: 1px solid #3a3a4a !important;
}

/* Buttons */
button, .button, input[type="submit"], .added_to_cart, .woocommerce a.button,
.woocommerce button.button, .woocommerce #respond input#submit {
  background: linear-gradient(135deg, var(--td-red), #ff6a00) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 2px !important;
  font-style: italic;
  box-shadow: 0 4px 0 #8e0f0f, 0 8px 18px rgba(255,45,45,.35);
  transition: transform .08s ease, box-shadow .08s ease, filter .15s;
}
button:hover, .button:hover, input[type="submit"]:hover, .woocommerce a.button:hover,
.woocommerce button.button:hover {
  filter: brightness(1.15);
  transform: translateY(-2px);
}
button:active, .button:active { transform: translateY(3px); box-shadow: 0 1px 0 #8e0f0f; }
.woocommerce a.button.alt, .woocommerce button.button.alt, .single_add_to_cart_button, .checkout-button {
  background: linear-gradient(135deg, var(--td-yellow), #ff9d00) !important;
  color: #111 !important;
  box-shadow: 0 4px 0 #9a7a00, 0 8px 18px rgba(255,212,0,.35);
}

/* Hero banner on shop/front page */
.td-hero {
  position: relative;
  margin: 0 0 2.5em;
  padding: 4.5em 2em;
  border-radius: 6px;
  overflow: hidden;
  background:
    linear-gradient(100deg, rgba(0,0,0,.85) 0%, rgba(0,0,0,.35) 60%, rgba(255,45,45,.35) 100%),
    url("wallpaper.svg") center / cover no-repeat;
  border: 2px solid #2a2a36;
  box-shadow: 0 0 0 3px var(--td-red), 0 0 40px rgba(255,45,45,.45);
}
.td-hero::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 22px;
  background: repeating-conic-gradient(#f5f5f5 0% 25%, #111 0% 50%) 0 0 / 22px 22px;
}
.td-hero h1 { font-size: clamp(2em, 6vw, 4.2em); font-style: italic; margin: 0 0 .2em; line-height: 1;
  text-shadow: 4px 4px 0 var(--td-red); }
.td-hero h1 span { color: var(--td-yellow); }
.td-hero p { max-width: 36em; font-size: 1.15em; color: #fff; text-shadow: 0 2px 6px #000; }
.td-hero .td-cta { display: flex; gap: 1em; flex-wrap: wrap; margin-top: 1.4em; }
.td-hero .td-cta a { display: inline-block; padding: .9em 1.6em; font-family: Impact, "Arial Black", sans-serif;
  text-transform: uppercase; font-style: italic; letter-spacing: .05em; text-decoration: none; color: #fff;
  background: linear-gradient(135deg, var(--td-red), #ff6a00); box-shadow: 0 4px 0 #8e0f0f; }
.td-hero .td-cta a.alt { background: linear-gradient(135deg, var(--td-yellow), #ff9d00); color: #111; box-shadow: 0 4px 0 #9a7a00; }
.td-hero .td-cta a.cyan { background: transparent; color: var(--td-cyan); border: 2px solid var(--td-cyan); box-shadow: 0 0 16px rgba(0,229,255,.35); }

/* Content panels */
.site-content > .col-full, .site-main { color: var(--td-text); }
.woocommerce-breadcrumb, .woocommerce-breadcrumb a { color: var(--td-muted) !important; }
.storefront-breadcrumb { background: transparent; border: 0; }
.woocommerce-products-header__title, .page-title { border-left: 8px solid var(--td-red); padding-left: .5em; }

/* Product cards */
ul.products li.product {
  background: linear-gradient(180deg, var(--td-panel-2), var(--td-panel));
  border: 1px solid #2f2f3d;
  border-top: 4px solid var(--td-red);
  border-radius: 4px;
  padding: 1em 1em 1.4em !important;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s;
  text-align: left;
}
ul.products li.product:nth-child(3n+2) { border-top-color: var(--td-yellow); }
ul.products li.product:nth-child(3n+3) { border-top-color: var(--td-cyan); }
ul.products li.product:hover {
  transform: translateY(-6px) skewY(-.5deg);
  box-shadow: 0 14px 30px rgba(255,45,45,.35);
}
ul.products li.product img { border-radius: 2px; background: #0b0b10; padding: 8px; }
.woocommerce-loop-product__title { color: #fff; font-size: 1.05em !important; }
.price, .woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--td-yellow) !important; font-weight: 800; font-size: 1.25em; }
.price del, .price del span { color: var(--td-muted) !important; font-weight: 400; }
.price ins { text-decoration: none; color: var(--td-cyan) !important; }
.woocommerce span.onsale {
  background: var(--td-cyan) !important; color: #000 !important; font-family: Impact, sans-serif;
  text-transform: uppercase; font-style: italic; border-radius: 0 !important;
  clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%); padding: .4em 1.2em .4em .8em; min-height: 0; min-width: 0; line-height: 1.2;
}
.woocommerce ul.products li.product .woocommerce-loop-category__title { color: #fff; }
.product_meta, .woocommerce-tabs, .woocommerce-product-details__short-description { color: var(--td-text); }
.woocommerce div.product .woocommerce-tabs ul.tabs li { background: var(--td-panel-2) !important; border-color: #333 !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: var(--td-red) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: #fff !important; }
.woocommerce div.product .woocommerce-tabs .panel { background: var(--td-panel); padding: 1.5em; border-radius: 4px; }

/* Cart / checkout / tables */
table, table th, table td, .woocommerce table.shop_table, .woocommerce table.shop_table td,
.woocommerce-checkout #payment, .woocommerce-checkout #payment div.payment_box,
.woocommerce-cart .cart-collaterals .cart_totals, .woocommerce form.checkout_coupon,
.woocommerce-info, .woocommerce-message, .woocommerce-error {
  background: var(--td-panel) !important; color: var(--td-text) !important; border-color: #33333f !important;
}
.woocommerce-message, .woocommerce-info { border-top-color: var(--td-yellow) !important; }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--td-panel) !important; }
.woocommerce table.shop_table th { color: var(--td-yellow) !important; }
.widget, .widget a { color: var(--td-text); }
.widget-area .widget { background: var(--td-panel); padding: 1em 1.2em; border-radius: 4px; border-left: 4px solid var(--td-red); }

/* Footer */
.site-footer {
  background: #000 !important; color: var(--td-muted) !important;
  border-top: 6px solid var(--td-red);
  background-image: repeating-conic-gradient(#f5f5f5 0% 25%, #000 0% 50%) !important;
  background-size: 0 0 !important;
}
.site-footer a:not(.button), .site-footer h1, .site-footer h2, .site-footer h3, .site-footer .widget-title { color: #fff !important; }
.site-footer a:not(.button):hover { color: var(--td-yellow) !important; }
.site-info { color: var(--td-muted); }

/* --- readability tweaks --- */
body, body.custom-background {
  background: linear-gradient(rgba(5,5,8,.62), rgba(5,5,8,.62)), var(--td-asphalt) url("wallpaper.svg") center / cover no-repeat fixed !important;
}
.site-header .site-description, .site-branding .site-description { color: var(--td-yellow) !important; }
.woocommerce-products-header__title, .page-title, .entry-title { text-shadow: 2px 2px 0 rgba(0,0,0,.8); }
.storefront-sorting select, .woocommerce-result-count { color: var(--td-text) !important; text-shadow: 0 1px 3px #000; }
ul.products li.product img[src*="placeholder"], ul.products li.product img.woocommerce-placeholder {
  filter: invert(.9) brightness(.7) contrast(1.1); opacity: .55;
}
ul.products li.product img { box-shadow: inset 0 0 0 1px #2f2f3d; }
.site-footer { border-top: 6px solid var(--td-red); box-shadow: 0 -8px 0 -2px var(--td-yellow); }