/* =============================================================================
   TimberThreads — "Timber Fresh" site-wide chrome
   Ported from the Colorado clothing brand redesign (DesignCanvas export).
   Paper #F5F3EF · ink #0C0C0D · red #C0122E · Denver gold #FFC72C.
   ============================================================================= */

:root {
	--tt-paper:#F5F3EF;   /* base bg */
	--tt-card:#E7E2D6;    /* image placeholder bg */
	--tt-ink:#0C0C0D;     /* near-black */
	--tt-red:#C0122E;     /* primary red */
	--tt-red2:#FF3B3B;    /* bright accent red */
	--tt-gold:#FFC72C;    /* Denver gold */
	--tt-muted:#8a8781;   /* muted text */
	--tt-line:rgba(12,12,13,.14);
}

*{ box-sizing:border-box; }
.tt-root{ background:var(--tt-paper); color:var(--tt-ink); font-family:'Archivo',sans-serif; overflow-x:hidden; }
.tt-root ::selection{ background:var(--tt-red); color:#fff; }
.tt-root img{ display:block; }
/* Kill the parent (Bootstrap) blue+underline link default — match the mock's
   global `a{color:inherit;text-decoration:none}`. Explicit inline colors and
   the Woo button/remove rules still win via higher specificity. */
.tt-root a{ color:inherit; text-decoration:none; }
.tt-root a:hover{ text-decoration:none; }
.tt-display{ font-family:'Archivo Black',sans-serif; text-transform:uppercase; }
.tt-mono{ font-family:'DM Mono',monospace; }

/* ---------- Marquee keyframes ---------- */
@keyframes tt-marq{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.tt-marq-track{ display:flex; width:max-content; animation:tt-marq 32s linear infinite; white-space:nowrap; }
.tt-marq-track.slow{ animation-duration:40s; }

/* ---------- Announcement bar (red) ---------- */
.tt-announce{ background:var(--tt-red); color:#fff; overflow:hidden; padding:9px 0; border-bottom:1px solid rgba(0,0,0,.2); }
.tt-announce .tt-marq-track{ font-family:'DM Mono',monospace; font-size:12px; letter-spacing:.16em; text-transform:uppercase; }

/* ---------- Brand marquee (black) ---------- */
.tt-brandmarq{ background:var(--tt-ink); color:var(--tt-paper); overflow:hidden; padding:16px 0; }
.tt-brandmarq .tt-marq-track{ font-family:'Archivo Black',sans-serif; font-size:clamp(22px,3vw,30px); text-transform:uppercase; }

/* ---------- Nav ---------- */
.tt-nav a.tt-navlink{ transition:opacity .2s ease; }
.tt-nav a.tt-navlink:hover{ opacity:.6; }
.tt-cartbtn{ transition:transform .2s ease; }
.tt-cartbtn:hover{ transform:translateY(-1px); }

/* ---------- Buttons ---------- */
.tt-btn{ display:inline-flex; align-items:center; gap:10px; font-family:'Archivo Black',sans-serif; font-size:14px;
	letter-spacing:.02em; text-transform:uppercase; padding:16px 30px; border-radius:2px; border:none; cursor:pointer;
	transition:transform .25s ease, background .25s ease, color .25s ease, box-shadow .25s ease; }
.tt-btn:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(12,12,13,.22); background:#9d0f26; }
/* All buttons: red background, white text. */
.tt-btn-dark,.tt-btn-red,.tt-btn-light,.tt-btn-ghost,.tt-btn-ghost-light{ background:var(--tt-red); color:#fff; border:none; }
/* Exception: a button sitting ON the red rewards band needs contrast — dark. */
.tt-btn-oncrew{ background:var(--tt-ink); color:#fff; }
.tt-btn-oncrew:hover{ background:#000; }

/* underline link */
.tt-ul{ display:inline-block; border-bottom:2px solid var(--tt-red); padding-bottom:3px; transition:opacity .2s ease; }
.tt-ul:hover{ opacity:.6; }

/* ---------- Reveal on scroll ---------- */
[data-reveal]{ opacity:0; transform:translateY(28px); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); will-change:opacity,transform; }
[data-reveal].is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ [data-reveal]{ opacity:1 !important; transform:none !important; } }

/* ---------- Image zoom on hover ---------- */
.tt-zoom{ overflow:hidden; }
.tt-zoom img{ transition:transform 1.1s cubic-bezier(.16,1,.3,1); }
.tt-zoom:hover img{ transform:scale(1.05); }

/* ---------- Product card ---------- */
.tt-prod .tt-prod-img{ position:relative; border-radius:3px; overflow:hidden; background:var(--tt-card); }
.tt-prod .tt-prod-img img{ transition:transform 1.1s cubic-bezier(.16,1,.3,1); }
.tt-prod:hover .tt-prod-img img{ transform:scale(1.05); }
/* Product meta row — keeps name + price tidy even when names wrap */
.tt-prod-meta{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-top:16px; }
.tt-prod-name{ font-weight:800; font-size:14px; text-transform:uppercase; line-height:1.25; }
.tt-prod-price{ font-weight:500; font-size:14px; flex:none; white-space:nowrap; }

.tt-quick{ position:absolute; left:10px; right:10px; bottom:10px; text-align:center; font-family:'Archivo Black',sans-serif;
	font-size:12px; letter-spacing:.02em; text-transform:uppercase; color:#fff; background:var(--tt-red);
	padding:13px; border-radius:2px; opacity:0; transform:translateY(10px); transition:opacity .35s ease, transform .35s ease; cursor:pointer; }
.tt-prod:hover .tt-quick{ opacity:1; transform:translateY(0); }

/* =============================================================================
   SLIDE-OUT CART DRAWER (real WooCommerce mini-cart + free-ship meter)
   ============================================================================= */
.tt-drawer{ position:fixed; inset:0; z-index:6000; font-family:'Archivo',sans-serif; pointer-events:none; }
.tt-drawer-overlay{ position:absolute; inset:0; background:rgba(12,12,13,.5); opacity:0; transition:opacity .4s ease; }
.tt-drawer-panel{ position:absolute; top:0; right:0; height:100%; width:min(430px,94vw); background:var(--tt-paper);
	transform:translateX(100%); transition:transform .45s cubic-bezier(.2,.7,.2,1); display:flex; flex-direction:column;
	box-shadow:-30px 0 80px rgba(12,12,13,.3); }
.tt-drawer.is-open{ pointer-events:auto; }
.tt-drawer.is-open .tt-drawer-overlay{ opacity:1; }
.tt-drawer.is-open .tt-drawer-panel{ transform:translateX(0); }
.tt-drawer-head{ display:flex; align-items:center; justify-content:space-between; padding:20px 24px 14px; }
.tt-drawer-head h3{ font-family:'Archivo Black',sans-serif; font-size:20px; text-transform:uppercase; margin:0; }
.tt-drawer-x{ background:none; border:none; font-size:24px; line-height:1; cursor:pointer; color:var(--tt-ink); }
.tt-ship{ padding:0 24px 16px; border-bottom:1px solid var(--tt-line); }
.tt-ship [data-tt-ship-msg]{ font-family:'DM Mono',monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--tt-muted); margin-bottom:8px; }
.tt-ship-track{ height:5px; border-radius:999px; background:rgba(12,12,13,.12); overflow:hidden; }

.tt-minicart{ flex:1; display:flex; flex-direction:column; min-height:0; }
.tt-minicart .widget_shopping_cart_content{ flex:1; display:flex; flex-direction:column; min-height:0; }
.tt-minicart ul.cart_list, .tt-minicart ul.product_list_widget{ list-style:none; margin:0; padding:6px 24px; flex:1; overflow-y:auto; }
.tt-minicart ul.cart_list li, .tt-minicart ul.product_list_widget li{ position:relative; padding:20px 0; border-bottom:1px solid var(--tt-line); color:var(--tt-ink); }
.tt-minicart ul.cart_list li a{ color:var(--tt-ink); text-decoration:none; font-weight:800; font-size:14px; text-transform:uppercase; }
.tt-minicart ul.cart_list li img{ width:64px; height:auto; float:right; margin-left:14px; border-radius:3px; background:var(--tt-card); }
.tt-minicart ul.cart_list li .quantity{ display:block; margin-top:6px; font-family:'DM Mono',monospace; font-size:12px; color:var(--tt-muted); }
.tt-minicart a.remove{ position:absolute; top:20px; right:0; left:auto; color:var(--tt-red) !important; font-size:15px; font-weight:700; }
.tt-minicart a.remove:hover{ color:var(--tt-red) !important; background:transparent !important; }
.tt-minicart p.total{ padding:18px 24px 6px; margin:0; border-top:1px solid var(--tt-line); display:flex; justify-content:space-between; align-items:baseline;
	font-family:'DM Mono',monospace; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--tt-muted); }
.tt-minicart p.total strong{ font-family:'Archivo Black',sans-serif; font-size:22px; color:var(--tt-ink); letter-spacing:0; text-transform:none; }
.tt-minicart p.buttons{ padding:8px 24px 24px; margin:0; display:flex; flex-direction:column; gap:10px; }
.tt-minicart p.buttons a{ display:block; text-align:center; text-decoration:none; font-family:'Archivo Black',sans-serif;
	font-size:14px; letter-spacing:.02em; text-transform:uppercase; padding:17px; border-radius:2px; }
.tt-minicart p.buttons a.checkout{ background:var(--tt-red); color:#fff; }
.tt-minicart p.buttons a:not(.checkout){ background:transparent; color:var(--tt-ink); border:1px solid rgba(12,12,13,.25); padding:14px; }
.tt-minicart p.woocommerce-mini-cart__empty-message{ flex:1; display:flex; align-items:center; justify-content:center; text-align:center; margin:0; padding:40px;
	font-family:'DM Mono',monospace; font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:var(--tt-muted); }

/* ---------- Responsive ---------- */
@media (max-width:960px){
	.tt-nav-inner{ grid-template-columns:auto 1fr auto !important; }
	.tt-hero-h{ font-size:clamp(40px,10vw,74px) !important; }
	.tt-4col{ grid-template-columns:repeat(2,1fr) !important; }
	.tt-2col{ grid-template-columns:1fr !important; }
	.tt-pdp-grid{ grid-template-columns:1fr !important; }
	.tt-footer-cols{ grid-template-columns:1fr 1fr !important; }
}
@media (max-width:600px){
	.tt-nav-links{ display:none !important; }
	.tt-4col{ grid-template-columns:1fr 1fr !important; }
	.tt-cart-layout{ grid-template-columns:1fr !important; }
	.tt-footer-cols{ grid-template-columns:1fr !important; }
	.tt-pad{ padding-left:18px !important; padding-right:18px !important; }
}
