/*
Theme Name: ThermoFlow Shop
Theme URI: https://example.com/thermoflow-shop
Author: Tankless Water Heater Shop
Description: Dark, high-contrast WooCommerce theme for the Tankless Water Heater Shop. Matches the Site Importer plugin: announcement bar, logo header with mobile menu, 5-column footer, product grid, single product with sticky mobile add-to-cart, cart and checkout (classic and block), buttons, logo and favicon.
Version: 1.0.0
Requires at least: 5.8
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: thermoflow-shop
Tags: e-commerce, dark, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

/* ---------- Tokens ---------- */
:root{--ink:#0a0f1c;--ink2:#121a2e;--ink3:#1a2540;--pump:#ff7a1a;--pump-d:#c2410c;--ghost:#46d6e6;--bone:#eaf1f5;--mut:#9fb0c0;--line:#ffffff1f;--good:#3ddc97;--bad:#ff6b6b;--r:14px;--hfont:"Big Shoulders Display",Impact,"Arial Narrow",sans-serif;--bfont:"DM Sans","Segoe UI",Arial,sans-serif;--wc-form-color-text:#eaf1f5;--wc-form-color-background:#0a0f1c;--wc-form-border-color:#ffffff33;--wc-form-border-radius:10px;--wc-form-border-width:1px}

/* ---------- Base ---------- */
html{scroll-behavior:smooth}
body.tfs-theme{margin:0;background:var(--ink);color:var(--bone);font-family:var(--bfont);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
.tfs,.tfs *,.tfs *::before,.tfs *::after{box-sizing:border-box}
.tfs{background:var(--ink);color:var(--bone);min-height:100vh;display:flex;flex-direction:column}
.tfs-main{flex:1}
.tfs img,.tfs svg,.tfs video{max-width:100%;height:auto}
.tfs a{color:inherit;text-decoration:none}
.tfs a:focus-visible,.tfs button:focus-visible,.tfs input:focus-visible,.tfs select:focus-visible,.tfs textarea:focus-visible,.tfs summary:focus-visible{outline:3px solid var(--ghost);outline-offset:3px}
.tfs h1,.tfs h2,.tfs h3,.tfs h4{margin:0 0 .5em;line-height:1.1}
.tfs h1,.tfs h2{font-family:var(--hfont);font-weight:900;text-transform:uppercase;letter-spacing:.01em;line-height:.98}
.tfs h1{font-size:clamp(40px,6vw,76px)}
.tfs h2{font-size:clamp(30px,4vw,48px)}
.tfs h3{font-size:22px;font-weight:700}
.tfs p{margin:0 0 1em}
.tfs-wrap{width:100%;max-width:1280px;margin:0 auto;padding:0 28px}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important}
.skip-link:focus{position:fixed;left:12px;top:12px;z-index:1000;background:var(--pump);color:#1a0b00;padding:10px 16px;border-radius:8px;clip:auto;clip-path:none;width:auto;height:auto}

/* ---------- Buttons (one system, used everywhere) ---------- */
body.tfs-theme .tfs .btn,body.tfs-theme .tfs .button,body.tfs-theme .tfs button.button,body.tfs-theme .tfs input[type=submit],body.tfs-theme .tfs input[type=button],body.tfs-theme .tfs .wp-element-button,body.tfs-theme .tfs .wp-block-button__link,body.tfs-theme .tfs .added_to_cart{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 24px;border-radius:10px;border:0;background:transparent;box-shadow:inset 0 0 0 2px #ffffff40;color:var(--bone);font:700 15px/1.2 var(--bfont);text-align:center;cursor:pointer;transition:box-shadow .2s,transform .2s,background .2s,color .2s,filter .2s}
body.tfs-theme .tfs .btn:hover,body.tfs-theme .tfs .button:hover,body.tfs-theme .tfs input[type=submit]:hover,body.tfs-theme .tfs .wp-element-button:hover,body.tfs-theme .tfs .added_to_cart:hover{box-shadow:inset 0 0 0 2px var(--ghost);color:var(--ghost)}
body.tfs-theme .tfs .btn-hot,body.tfs-theme .tfs .button.alt,body.tfs-theme .tfs .button.checkout-button,body.tfs-theme .tfs button.alt,body.tfs-theme .tfs input[type=submit].alt,body.tfs-theme .tfs #place_order,body.tfs-theme .tfs .single_add_to_cart_button,body.tfs-theme .tfs .wp-block-button__link{background:var(--pump);color:#1a0b00;box-shadow:0 0 0 0 #ff7a1a00}
body.tfs-theme .tfs .btn-hot:hover,body.tfs-theme .tfs .button.alt:hover,body.tfs-theme .tfs .button.checkout-button:hover,body.tfs-theme .tfs button.alt:hover,body.tfs-theme .tfs #place_order:hover,body.tfs-theme .tfs .single_add_to_cart_button:hover,body.tfs-theme .tfs .wp-block-button__link:hover{background:var(--pump);color:#1a0b00;box-shadow:0 0 28px #ff7a1a88;transform:translateY(-2px);filter:brightness(1.05)}
body.tfs-theme .tfs .btn-ghost{background:transparent;box-shadow:inset 0 0 0 2px #ffffff40;color:var(--bone)}
body.tfs-theme .tfs .btn-lg{min-height:56px;padding:14px 32px;font-size:17px}
body.tfs-theme .tfs .button.disabled,body.tfs-theme .tfs .button:disabled,body.tfs-theme .tfs button[disabled],body.tfs-theme .tfs .single_add_to_cart_button.disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
body.tfs-theme .tfs .button.loading{opacity:.7;pointer-events:none}
body.tfs-theme .tfs .button.loading::after{content:"";width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:tfs-spin .7s linear infinite;font-family:inherit}
@keyframes tfs-spin{to{transform:rotate(360deg)}}

/* ---------- Forms ---------- */
body.tfs-theme .tfs label{display:block;font-size:14px;color:var(--mut);margin-bottom:6px}
body.tfs-theme .tfs input[type=text],body.tfs-theme .tfs input[type=email],body.tfs-theme .tfs input[type=tel],body.tfs-theme .tfs input[type=url],body.tfs-theme .tfs input[type=password],body.tfs-theme .tfs input[type=number],body.tfs-theme .tfs input[type=search],body.tfs-theme .tfs textarea,body.tfs-theme .tfs select{width:100%;min-height:46px;background:var(--ink);color:var(--bone);border:1px solid #ffffff33;border-radius:10px;padding:10px 14px;font:inherit;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
body.tfs-theme .tfs select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23ff7a1a' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
body.tfs-theme .tfs textarea{min-height:120px;resize:vertical}
body.tfs-theme .tfs input::placeholder,body.tfs-theme .tfs textarea::placeholder{color:#6f8296}
body.tfs-theme .tfs input:focus,body.tfs-theme .tfs select:focus,body.tfs-theme .tfs textarea:focus{border-color:var(--ghost);box-shadow:0 0 0 3px #46d6e633;outline:0}
body.tfs-theme .tfs input[type=checkbox],body.tfs-theme .tfs input[type=radio]{width:18px;height:18px;min-height:0;accent-color:var(--pump)}
body.tfs-theme .tfs .required{color:var(--pump);text-decoration:none}

/* ---------- Announcement + header ---------- */
.tfs-annc{background:var(--pump);color:#1a0b00;text-align:center;padding:9px 16px;font-size:14px;font-weight:700}
.tfs-annc a{text-decoration:underline}
.tfs-hdr{position:sticky;top:0;z-index:100;background:#000;border-bottom:1px solid var(--line);transition:box-shadow .2s}
.tfs-hdr.is-stuck{box-shadow:0 10px 30px #0009}
.admin-bar .tfs-hdr{top:32px}
@media(max-width:782px){.admin-bar .tfs-hdr{top:46px}}
.tfs-hdr .tfs-wrap{display:flex;align-items:center;gap:18px;min-height:78px}
.tfs-brand{display:block;line-height:0;flex:none}
.tfs-brand img{width:210px;max-width:52vw;height:auto;display:block}
.tfs-nav{margin-left:auto}
.tfs-nav ul{display:flex;gap:2px;margin:0;padding:0;list-style:none}
.tfs-nav li{position:relative}
.tfs-nav a{display:flex;align-items:center;min-height:44px;padding:8px 14px;border-radius:8px;font-weight:600;font-size:15px;transition:color .2s,background .2s}
.tfs-nav a:hover,.tfs-nav .current-menu-item>a,.tfs-nav .current_page_item>a{color:var(--ghost);background:#ffffff0d}
.tfs-nav .sub-menu{position:absolute;left:0;top:100%;min-width:220px;display:none;flex-direction:column;gap:0;background:var(--ink2);border:1px solid var(--line);border-radius:12px;padding:8px;box-shadow:0 20px 40px #000a}
.tfs-nav li:hover>.sub-menu,.tfs-nav li:focus-within>.sub-menu{display:flex}
.tfs-actions{display:flex;align-items:center;gap:10px}
.tfs-cart{position:relative;min-height:46px;padding:10px 20px!important}
.tfs-cart svg{width:20px;height:20px;flex:none}
.tfs-cart-count{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:99px;background:#1a0b00;color:var(--pump);font-size:12px;font-weight:800;line-height:1}
.tfs-cart-count[data-n="0"]{background:#1a0b0033;color:#1a0b00}
.tfs-burger{display:none;width:46px;height:46px;border-radius:10px;border:0;background:transparent;box-shadow:inset 0 0 0 2px #ffffff40;color:var(--bone);cursor:pointer;padding:0;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.tfs-burger span{display:block;width:20px;height:2px;background:currentColor;border-radius:2px;transition:transform .25s,opacity .2s}
.tfs-burger[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.tfs-burger[aria-expanded=true] span:nth-child(2){opacity:0}
.tfs-burger[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:960px){
 .tfs-hdr .tfs-wrap{min-height:68px;gap:12px}
 .tfs-actions{margin-left:auto}
 .tfs-burger{display:inline-flex}
 .tfs-nav{position:absolute;left:0;right:0;top:100%;margin:0;background:#000;border-bottom:1px solid var(--line);max-height:0;overflow:hidden;visibility:hidden;transition:max-height .3s ease,visibility .3s}
 .tfs-nav.is-open{max-height:calc(100vh - 120px);overflow-y:auto;visibility:visible;box-shadow:0 20px 30px #000a}
 .tfs-nav ul{flex-direction:column;gap:0;padding:8px 18px 18px}
 .tfs-nav a{min-height:52px;font-size:17px;border-bottom:1px solid var(--line);border-radius:0;padding:10px 4px}
 .tfs-nav .sub-menu{position:static;display:flex;border:0;box-shadow:none;background:transparent;padding:0 0 0 14px}
 .tfs-cart .tfs-cart-label{display:none}
 .tfs-cart{padding:10px 14px!important}
}

/* ---------- Page hero + content ---------- */
.tfs-hero{padding:64px 0 54px;text-align:center;background:radial-gradient(60% 120% at 50% 0,#1b2a4d,#0a0f1c 70%);border-bottom:1px solid var(--line)}
.tfs-hero.compact{padding:36px 0 30px}
.tfs-hero h1{max-width:1000px;margin:0 auto}
.tfs-hero .eyebrow{display:block;color:var(--pump);font-weight:700;margin-bottom:10px}
.tfs-hero .lead{max-width:720px;margin:16px auto 0;color:var(--mut);font-size:18px}
.tfs-crumbs{font-size:14px;color:var(--mut);margin:0 0 14px;display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.tfs-crumbs a,.tfs .woocommerce-breadcrumb a{color:var(--ghost)}
.tfs-crumbs a:hover,.tfs .woocommerce-breadcrumb a:hover{text-decoration:underline}
.tfs-section{padding:48px 0 80px}
.tfs-doc{max-width:850px;margin:0 auto;padding:56px 28px 90px}
.tfs-doc.wide{max-width:1280px}
.tfs-doc p,.tfs-doc li{color:#c4d1dc}
.tfs-doc ul,.tfs-doc ol{padding-left:22px;margin:0 0 1em}
.tfs-doc h2{font-size:clamp(30px,3.6vw,42px);margin:1.6em 0 .4em}
.tfs-doc h3{margin:1.4em 0 .4em;color:#fff}
.tfs-doc a:not(.btn):not(.button){color:var(--ghost);text-decoration:underline}
.tfs-doc strong{color:#fff}
.tfs-doc img{border-radius:12px}
.tfs-doc blockquote{margin:1.4em 0;padding:16px 22px;border-left:4px solid var(--pump);background:var(--ink2);border-radius:0 12px 12px 0}
.tfs-doc table{width:100%;border-collapse:collapse;background:var(--ink2);border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px var(--line);margin:0 0 1.4em}
.tfs-doc th{text-align:left;padding:12px 14px;background:#ffffff0f;color:var(--mut);font-size:14px}
.tfs-doc td{padding:12px 14px;border-top:1px solid var(--line);color:#c4d1dc}
.tfs-doc .alignwide{max-width:none}
.tfs-doc pre,.tfs-doc code{background:var(--ink2);border-radius:8px;font-size:14px}
.tfs-doc code{padding:2px 6px}.tfs-doc pre{padding:16px;overflow:auto}
.tfs-meta{color:var(--mut);font-size:14px;margin-top:14px}
.tfs-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tfs-card{display:flex;flex-direction:column;background:var(--ink2);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:border-color .2s,transform .2s}
.tfs-card:hover{border-color:var(--pump);transform:translateY(-4px)}
.tfs-card img{width:100%;aspect-ratio:16/9;object-fit:cover}
.tfs-card .in{padding:18px}.tfs-card h2{font:700 20px/1.3 var(--bfont);text-transform:none;margin:0 0 6px}
.tfs-card p{color:var(--mut);font-size:14px;margin:0}
.tfs-pager{display:flex;justify-content:center;gap:6px;margin-top:34px;flex-wrap:wrap}
.tfs-pager a,.tfs-pager span{display:block;padding:9px 14px;border:1px solid var(--line);border-radius:8px}
.tfs-pager .current{background:var(--pump);color:#1a0b00;border-color:var(--pump)}
.tfs-empty{background:var(--ink2);border:1px dashed var(--line);border-radius:var(--r);padding:40px 24px;text-align:center}
.tfs-empty p{color:var(--mut)}
.tfs-404 .big{font:900 clamp(96px,22vw,220px)/.9 var(--hfont);color:var(--pump);text-shadow:0 0 60px #ff7a1a55}
.tfs-search{display:flex;gap:10px;max-width:520px;margin:20px auto 0}.tfs-search input{flex:1}

/* ---------- Footer ---------- */
.tfs-ftr{background:#06090f;border-top:1px solid var(--line);padding:64px 0 22px;font-size:14px;color:var(--mut)}
.tfs-ftr .cols{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr 1.2fr;gap:35px;padding-bottom:45px}
.tfs-ftr h3{font-size:14px;color:#fff;margin:0 0 14px;text-transform:uppercase;letter-spacing:.08em}
.tfs-ftr ul{list-style:none;margin:0;padding:0}
.tfs-ftr li{margin:6px 0;overflow-wrap:anywhere}
.tfs-ftr a{display:inline-block;padding:3px 0}
.tfs-ftr a:hover{color:var(--ghost)}
.tfs-ftr .fb{display:inline-block;line-height:0;margin-bottom:12px}.tfs-ftr .fb img{width:200px;height:auto}
.tfs-ftr .pay{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.tfs-ftr .pay span{border:1px solid var(--line);border-radius:6px;padding:3px 8px;font-size:12px;color:var(--bone)}
.tfs-ftr .contact li{color:var(--mut)}.tfs-ftr .contact strong{color:#fff}
.tfs-ftr .bottom{border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:13px}
@media(max-width:1000px){.tfs-ftr .cols{grid-template-columns:repeat(2,1fr)}.tfs-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){
 .tfs-wrap{padding:0 18px}
 .tfs-ftr{padding:44px 0 22px}
 .tfs-ftr .cols{grid-template-columns:1fr;gap:28px}
 .tfs-ftr .bottom{flex-direction:column}
 .tfs-cards{grid-template-columns:1fr}
 .tfs-doc{padding:40px 18px 70px}
 .tfs-hero{padding:48px 0 40px}
 .tfs-doc table,.tfs-doc thead,.tfs-doc tbody,.tfs-doc tr,.tfs-doc td,.tfs-doc th{display:block;width:100%}
 .tfs-doc thead{display:none}.tfs-doc table{background:none;box-shadow:none}
 .tfs-doc tr{background:var(--ink2);border:1px solid var(--line);border-radius:12px;margin:0 0 10px;padding:6px 0}.tfs-doc td{border:0;padding:6px 14px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.tfs *,.tfs *::before,.tfs *::after{animation:none!important;transition:none!important}}