/*
 Theme Name:   tireswheels Child
 Theme URI:    http://themes.webdevia.com/roofing-child/
 Description:  tireswheels Child Theme
 Author:       Mymoun
 Author URI:   http://www.webdevia.com/
 Template:     tireswheels
 Version:      1.0.0
 License: 	   ---
 License URI:  ----
 Tags:         two-columns, custom-background, threaded-comments, translation-ready, custom-menu
 Text Domain:  tireswheels
*//* ====== Lux black + deep-green + gold look ====== */:root{  --lux-black:#0b0d0f;  --lux-green:#0f1b17;  --lux-gold:#d4af37;  --lux-gold-deep:#a67c00;}/* Main content background (covers most themes incl. TiresWheels) */.main,.site-content,.content-area {  position: relative;  color: #e9e6df;  background:    radial-gradient(1200px 800px at 85% -10%, rgba(15,27,23,.65) 0%, rgba(15,27,23,0) 60%),    radial-gradient(800px 600px at 10% 90%,  rgba(15,27,23,.45) 0%, rgba(15,27,23,0) 55%),    linear-gradient(180deg, #0b0d0f 0%, #0b0d0f 40%, #101316 100%),    /* subtle noise so gradients feel “expensive” */    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='120' height='120' filter='url(%23n)' opacity='0.035'/></svg>");  background-attachment: fixed,fixed,scroll,scroll;  background-blend-mode: normal,normal,overlay,normal;}/* Slim gold bar under header */.site-header + .main::before,.header + .main::before {  content:"";  display:block;  height:6px;  margin:0 0 24px;  background: linear-gradient(90deg, rgba(0,0,0,0) 0, var(--lux-gold) 15%, #f2d98a 50%, var(--lux-gold) 85%, rgba(0,0,0,0) 100%);  box-shadow: 0 0 22px rgba(212,175,55,.35);}/* Gold gradient headings */.main h1, .main h2, .woocommerce-products-header__title {  background: linear-gradient(180deg, #f5e9bd 0, var(--lux-gold) 35%, var(--lux-gold-deep) 100%);  -webkit-background-clip: text;  background-clip: text;  color: transparent;  letter-spacing:.02em;}/* Product cards: subtle gold frame & depth */.woocommerce ul.products li.product {  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));  border:1px solid rgba(212,175,55,.18);  border-radius:14px;  box-shadow: 0 10px 30px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.03) inset;  padding:12px;}.woocommerce ul.products li.product a img {  background:#0d1114;  padding:8px;  border:1px solid rgba(212,175,55,.22);  border-radius:10px;  transition:transform .3s ease, box-shadow .3s ease;}.woocommerce ul.products li.product:hover a img {  transform: translateY(-2px);  box-shadow: 0 8px 24px rgba(212,175,55,.12);}/* Buttons: tasteful gold */.woocommerce a.button,.woocommerce button.button,.woocommerce .button {  background-image: linear-gradient(180deg, #f0d989 0, var(--lux-gold) 38%, var(--lux-gold-deep) 100%);  color:#0b0d0f;  border:none;  border-radius:999px;  padding:.7em 1.2em;  text-transform:uppercase;  letter-spacing:.04em;  box-shadow:0 6px 20px rgba(212,175,55,.25);}.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce .button:hover {  filter:brightness(1.05);  transform: translateY(-1px);}/* Small gold accents for links & price */a, .woocommerce div.product p.price, .woocommerce ul.products li.product .price {  color: rgba(212,175,55,.9);}/* ===== Lux base palette (reuse your gold #ffcb21) ===== */:root{  --lux-black:#0b0d0f;  --lux-green:#0f1b17;  --lux-gold:#ffcb21;       /* matches your current brand color */  --lux-gold-deep:#a67c00;}/* 1) Site & content background (the page wrapper is #page-content) */html, body { background:#0b0d0f; }#page-content{  position:relative;  color:#e9e6df;  background:    radial-gradient(1100px 700px at 85% -10%, rgba(15,27,23,.65) 0%, rgba(15,27,23,0) 60%),    radial-gradient(800px 600px at 10% 90%,  rgba(15,27,23,.45) 0%, rgba(15,27,23,0) 55%),    linear-gradient(180deg, #0b0d0f 0%, #0b0d0f 40%, #101316 100%),    /* subtle noise so gradients feel premium */    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='90' height='90'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2' stitchTiles='stitch'/></filter><rect width='90' height='90' filter='url(%23n)' opacity='0.03'/></svg>");  background-attachment: fixed,fixed,scroll,scroll;  background-blend-mode: normal,normal,overlay,normal;}/* 2) Header / menu (override theme inline colors on top-bar & sticky bar)   Theme targets these, so we use the same selectors and place ours later.  */.l-header .top-bar,.l-header .contain-to-grid .top-bar,.top-bar,.top-bar-section,.header-top,.contain-to-grid.sticky{  position:relative;  background: linear-gradient(180deg, #0f1316 0%, #0b0d0f 100%) !important;  box-shadow: 0 4px 18px rgba(0,0,0,.35);}/* Slim gold accent bar under the header */.l-header .top-bar::after,.top-bar::after{  content:"";  position:absolute;  left:0; right:0; bottom:-1px;  height:6px;  background: linear-gradient(90deg, transparent, var(--lux-gold) 18%, #f2d98a 50%, var(--lux-gold) 82%, transparent);  box-shadow: 0 0 18px rgba(255,203,33,.35);}/* 3) Navigation links – elegant gold + subtle hover underline */.top-bar-section ul li > a{  color: rgba(255,203,33,.92) !important;  letter-spacing:.02em;}.top-bar-section ul li > a:hover,.top-bar-section ul li.current-menu-item > a{  color:#fff !important;  text-shadow: 0 0 18px rgba(255,203,33,.35);}.top-bar-section ul li > a::after{  content:"";  display:block;  height:2px;  width:0;  margin-top:6px;  background: linear-gradient(90deg, transparent, var(--lux-gold), transparent);  transition:width .25s ease;}.top-bar-section ul li:hover > a::after,.top-bar-section ul li.current-menu-item > a::after{ width:100%; }/* 4) Section “panels” (optional): gives rows a soft green glass & gold edge.   Add class 'lux-panel' to any WPBakery row you want framed. */#page-content .lux-panel{  background: linear-gradient(180deg, rgba(15,27,23,.25), rgba(15,27,23,.12));  border:1px solid rgba(255,203,33,.18);  border-radius:16px;  box-shadow: 0 10px 30px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.03) inset;  padding:24px;}/* 5) Headings – gold gradient text (keep readable on dark) */#page-content h1, #page-content h2, #page-content .wd-section-title h2{  background: linear-gradient(180deg, #f7e6ad 0, var(--lux-gold) 38%, var(--lux-gold-deep) 100%);  -webkit-background-clip:text; background-clip:text;  color:transparent;}/* 6) Footer tidy-up to match */.l-footer-columns, .copyright{  background: #0b0d0f;  border-top:1px solid rgba(255,203,33,.12);}/* Panel */.wsf-search-form{  position:relative;  color:var(--lux-text);  background:    linear-gradient(180deg, rgba(15,27,23,.28), rgba(15,27,23,.12)),    linear-gradient(180deg, #0d1114, #0b0d0f);  border:1px solid var(--lux-line);  border-radius:18px;  box-shadow: 0 14px 36px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.03) inset;  padding:20px;  overflow:hidden;}/* Gold glow line on top */.wsf-search-form::before{  content:"";  position:absolute;  left:0; right:0; top:0;  height:4px;  background:linear-gradient(90deg, transparent, var(--lux-gold) 18%, #f2d98a 50%, var(--lux-gold) 82%, transparent);  box-shadow:0 0 16px rgba(255,203,33,.35);}/* Tabs */.wsf-tabs{  display:flex;  gap:8px;  margin:0 0 14px 0;  border-bottom:1px solid rgba(255,255,255,.06);  padding-bottom:6px;}.wsf-tab-btn{  appearance:none;  background:transparent;  color:rgba(255,203,33,.9);  border:1px solid var(--lux-line);  border-radius:4px;  padding:.45rem .9rem;  font-weight:600;  letter-spacing:.02em;  transition:all .2s ease;}.wsf-tab-btn:hover{ filter:brightness(1.08); box-shadow:0 0 0 2px rgba(255,203,33,.12) inset; }.wsf-tab-btn.active{  background:linear-gradient(180deg, #f0d989, var(--lux-gold) 42%, var(--lux-gold-deep));  color:#0b0d0f;  border-color:transparent;  box-shadow:0 8px 24px rgba(255,203,33,.25);}/* Fields layout */.wsf-field-row{  display:grid;  grid-template-columns: repeat(auto-fit, minmax(160px,1fr));  gap:12px;  margin-bottom:12px;}.wsf-field label{  display:block;  font-size:.8rem;  opacity:.85;  margin:0 0 6px 6px;  letter-spacing:.04em;  text-transform:uppercase;}/* Inputs / selects */.wsf-field select,.wsf-field input[type="text"],.wsf-field input[type="number"]{  width:100%;  background:var(--lux-surface);  color:var(--lux-text);  border:1px solid var(--lux-line);  border-radius:4px;  padding:.6rem .9rem;  line-height:1.2;  outline:none;  transition:border-color .2s ease, box-shadow .2s ease, transform .06s ease;}.wsf-field select:focus,.wsf-field input:focus{  border-color:rgba(255,203,33,.65);  box-shadow:0 0 0 3px rgba(255,203,33,.15);  transform:translateY(-1px);}.wsf-field select::placeholder,.wsf-field input::placeholder{ color:rgba(233,230,223,.5); }/* Custom select arrow (pure CSS) */.wsf-field select{  background-image:    linear-gradient(45deg, transparent 50%, var(--lux-gold) 50%),    linear-gradient(135deg, var(--lux-gold) 50%, transparent 50%);  background-position:    calc(100% - 22px) calc(50% - 3px),    calc(100% - 16px) calc(50% - 3px);  background-size:6px 6px, 6px 6px;  background-repeat:no-repeat;  padding-right:40px;}/* Checkboxes (conditions, used/new etc.) */.wsf-checkbox label{  display:flex; align-items:center; gap:8px;  background:rgba(255,255,255,.03);  border:1px solid var(--lux-line);  padding:.5rem .75rem;  border-radius:10px;  cursor:pointer;}.wsf-checkbox input[type="checkbox"]{  appearance:none; width:18px; height:18px; border-radius:4px;  border:1px solid var(--lux-line); background:var(--lux-surface);  position:relative; display:inline-block;}.wsf-checkbox input[type="checkbox"]:checked{  background:linear-gradient(180deg, #f0d989, var(--lux-gold));  border-color:var(--lux-gold-deep);}.wsf-checkbox input[type="checkbox"]:checked::after{  content:""; position:absolute; left:4px; top:1px; width:7px; height:12px;  border:2px solid #0b0d0f; border-top:none; border-left:none; transform:rotate(45deg);}/* Submit button */.wsf-search-form button[type="submit"],.wsf-search-form input[type="submit"]{  width:100%;  background-image:linear-gradient(180deg, #f0d989 0, var(--lux-gold) 38%, var(--lux-gold-deep) 100%);  color:#0b0d0f;  border:none; border-radius:4px;  padding:.8rem 1.2rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;  box-shadow:0 10px 26px rgba(255,203,33,.25);  transition:transform .08s ease, filter .2s ease;}.wsf-search-form button[type="submit"]:hover,.wsf-search-form input[type="submit"]:hover{  filter:brightness(1.06);  transform:translateY(-1px);}/* Compact on mobile */@media (max-width: 640px){  .wsf-search-form{ padding:16px; border-radius:14px; }  .wsf-tabs{ gap:6px; }  .wsf-field-row{ gap:10px; }}