/*
Theme Name: Ustone Child — Stairway to Gray
Theme URI: https://stairwaytogray.com
Description: Child theme of Ustone for the Stairway to Gray peptide marketplace. Holds all custom terminal-aesthetic styling and template overrides so the parent theme can be updated safely.
Author: STG
Template: ustone
Version: 1.0.0
Text Domain: ustone-child
*/
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap');

/* -------------------------------------------------------------------------
   Stairway to Gray — dark "gray-market speakeasy" terminal skin
   Layered on top of Ustone's data-bs-theme="dark". Converts the theme's
   white utility wrappers + hardcoded dark text to the STG dark palette.
   ------------------------------------------------------------------------- */
:root{
	--stg-bg:#0f111a; --stg-bg-2:#171a24; --stg-bg-3:#1e2230;
	--stg-fg:#e7e9f0; --stg-muted:#9aa0b4;
	--stg-accent:#7aa2ff; --stg-accent-2:#9ce6c0; --stg-line:#2a2f3d;
	--stg-mono:"JetBrains Mono","SFMono-Regular",ui-monospace,Menlo,Consolas,monospace;
	/* feed Bootstrap dark vars so bs components match */
	--bs-body-bg:var(--stg-bg); --bs-body-color:var(--stg-fg);
	--bs-border-color:var(--stg-line);
}

/* ---- Page canvas ---- */
html, body,
#page, #page.page-content, .page-content,
.main-content, .site, .site-content, .content-area, #content,
.woocommerce, .woocommerce-page{
	background-color:var(--stg-bg) !important;
	color:var(--stg-fg) !important;
}

/* ---- Convert white / light utility surfaces ---- */
.bg-white,.bg-light,.bg-body,.bg-gray-50,.bg-gray-100,
[class*="bg-gray-1"],[class*="bg-gray-50"]{
	background-color:var(--stg-bg-2) !important;
}

/* ---- Text ---- */
body, p, li, dd, dt, blockquote, address, figcaption, caption, cite,
.text-dark,.text-black,.text-body,
[class*="text-gray-9"],[class*="text-gray-8"],[class*="text-gray-7"]{
	color:var(--stg-fg) !important;
}
.text-muted,[class*="text-gray-6"],[class*="text-gray-5"],[class*="text-gray-4"]{
	color:var(--stg-muted) !important;
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3{ color:var(--stg-fg) !important; }
h1,h2,h3,.site-title,.page-title,.entry-title,.woocommerce-loop-product__title,.product_title{
	font-family:var(--stg-mono) !important; letter-spacing:.3px;
}
a{ color:var(--stg-accent); }
a:hover{ color:var(--stg-accent-2); }

/* ---- Borders ---- */
[class*="border-gray"],.border,.border-top,.border-bottom,.border-b-1,hr{
	border-color:var(--stg-line) !important;
}

/* ---- Header ---- */
#masthead,.header,.header.standard,.top-bar,.header-bottom{
	background-color:var(--stg-bg-2) !important;
	border-color:var(--stg-line) !important;
	color:var(--stg-fg) !important;
}
#masthead a,#masthead .site-title,#masthead .menu-item a,#masthead span,
.top-bar a,.header .menu a{ color:var(--stg-fg) !important; }
#masthead .menu-item a:hover{ color:var(--stg-accent) !important; }
.site-title,.site-title a{ font-family:var(--stg-mono) !important; font-weight:700; }

/* ---- Page title band ---- */
.page-header,.page-title-wrap,.breadcrumbs-wrap{
	background:linear-gradient(180deg,var(--stg-bg-2),var(--stg-bg)) !important;
	border-bottom:1px solid var(--stg-line);
}
.page-header .page-title,.page-header h1,.page-header *{ color:var(--stg-fg) !important; }

/* ---- Footer ---- */
footer,.site-footer,.footer,.copyright,.footer-bottom{
	background-color:#0b0d14 !important; color:var(--stg-fg) !important;
	border-color:var(--stg-line) !important;
}
footer a,.site-footer a{ color:var(--stg-muted) !important; }
footer a:hover{ color:var(--stg-accent) !important; }

/* ---- Buttons ---- */
.button,.btn,button,.wp-block-button__link,input[type="submit"],
.single_add_to_cart_button,.checkout-button,.added_to_cart,
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{
	background-color:var(--stg-accent) !important;
	color:#0b0d14 !important; border:none !important; font-weight:600;
	border-radius:8px !important;
}
.button:hover,.btn:hover,.woocommerce a.button:hover,.woocommerce button.button:hover{
	filter:brightness(1.08); color:#0b0d14 !important;
}
.is-style-outline .wp-block-button__link,.btn-outline,.btn-outline-primary{
	background:transparent !important; color:var(--stg-fg) !important;
	border:1px solid var(--stg-line) !important;
}

/* ---- Forms / inputs ---- */
input,select,textarea,.form-control,.select2-selection,
.select2-container--default .select2-selection--single{
	background-color:var(--stg-bg) !important; color:var(--stg-fg) !important;
	border:1px solid var(--stg-line) !important;
}
input::placeholder,textarea::placeholder{ color:var(--stg-muted) !important; }
.select2-dropdown,.select2-results__option{ background:var(--stg-bg-2) !important; color:var(--stg-fg) !important; }

/* ---- WooCommerce surfaces ---- */
ul.products li.product,.product-inner,.wc-block-grid__product,
.woocommerce ul.products li.product,.type-product{
	background-color:var(--stg-bg-2) !important;
	border:1px solid var(--stg-line) !important; border-radius:14px;
	padding:10px !important;
}
.woocommerce-loop-product__title,ul.products li.product a{ color:var(--stg-fg) !important; }
.price,.woocommerce-Price-amount,.amount{ color:var(--stg-accent-2) !important; }
.woocommerce table,.woocommerce table.shop_table,.cart_totals,
.woocommerce-checkout-review-order-table,.woocommerce-table,
.shop_table,table.cart{
	background-color:var(--stg-bg-2) !important; color:var(--stg-fg) !important;
	border-color:var(--stg-line) !important;
}
.woocommerce table td,.woocommerce table th,.shop_table td,.shop_table th{
	border-color:var(--stg-line) !important; color:var(--stg-fg) !important;
}
.woocommerce-info,.woocommerce-message,.woocommerce-error,.woocommerce .cart-collaterals .cart_totals,
.woocommerce-notices-wrapper .woocommerce-message{
	background-color:var(--stg-bg-3) !important; color:var(--stg-fg) !important;
	border-top-color:var(--stg-accent) !important;
}
.star-rating span{ color:var(--stg-accent-2) !important; }

/* product placeholder image bg */
.woocommerce ul.products li.product a img,.wp-post-image{ border-radius:10px; background:var(--stg-bg-3); }

/* cards / widgets generic */
.card,.widget,.wc-block-components-panel{ background:var(--stg-bg-2) !important; border-color:var(--stg-line) !important; color:var(--stg-fg) !important; }

/* ---- Ustone header inner rows + action boxes (they carry their own white bg) ---- */
.header-row,.header-main,.header-navbar,.header-bottom,.header-top,.header-inner,
.mobile-header,.header-mobile,.header-search-form,
.action-icon,.action-dropdown,.action-dropdown-inner,.action-wrap,.header-actions{
	background-color:var(--stg-bg-2) !important; color:var(--stg-fg) !important;
	border-color:var(--stg-line) !important;
}
.header-navbar{ border-top:1px solid var(--stg-line) !important; }
.action-icon,.action-icon *{ color:var(--stg-fg) !important; }
.action-icon svg,.action-icon path,.header svg,.header path,.menu-toggle span{
	fill:currentColor !important; stroke:currentColor !important; color:var(--stg-fg) !important;
}
.action-count{ background-color:var(--stg-accent) !important; color:#0b0d14 !important; }
.action-text,.action-label,.welcome-text,.action-title{ color:var(--stg-muted) !important; }

/* dropdown panels (account / cart / search) */
.action-dropdown-inner,.mini-cart,.widget_shopping_cart_content,.dropdown-menu{
	background-color:var(--stg-bg-2) !important; color:var(--stg-fg) !important;
	border:1px solid var(--stg-line) !important;
}

/* ---- Page title band ---- */
.page-header-background,.page-header .page-header-background{
	background:linear-gradient(180deg,var(--stg-bg-2),var(--stg-bg)) !important;
	opacity:1 !important;
}
.page-header,.page-header *{ color:var(--stg-fg) !important; }
.page-header .page-title{ color:var(--stg-fg) !important; }

/* ---- Nav menu links ---- */
.header .menu a,.header-navbar .menu-item a,#masthead .menu-item > a{
	color:var(--stg-fg) !important; font-family:var(--stg-mono) !important; font-size:14px;
}
.header .menu a:hover,#masthead .menu-item > a:hover{ color:var(--stg-accent) !important; }

/* keep our marketplace components readable everywhere */
.stg-storefront,.stg-timeline,.stg-pay-instructions{ color:var(--stg-fg); }

/* =========================================================================
   Audit fixes (2026-09-23)
   ========================================================================= */
/* No horizontal scroll (footer grid was 16px wider than the viewport). `clip` keeps sticky headers working. */
html,body{ overflow-x:clip; }
.footer-inner{ max-width:100%!important; }

/* Ustone renders <em> as a 12px block — restore normal inline emphasis in content. */
.entry-content em,.page-content .post-content em,main p em,main li em{ display:inline!important; font-size:inherit!important; }
.stg-byline em{ font-size:13px!important; color:var(--stg-muted)!important; }

/* Header brand: emblem + wordmark, never overlapping the menu / cart icons. */
#masthead .brand a{ display:inline-flex!important; align-items:center; gap:10px; white-space:nowrap; font-family:var(--stg-mono)!important; font-weight:700; letter-spacing:-.3px; font-size:24px!important; }
#masthead .brand a::before{ content:""; width:34px; height:34px; flex:0 0 34px; border-radius:50%; background:var(--stg-emblem) center/cover no-repeat,var(--stg-bg-3); box-shadow:0 0 0 1px var(--stg-line); }
@media(max-width:1023px){
	#masthead .brand a{ font-size:17px!important; gap:8px; }
	#masthead .brand a::before{ width:28px; height:28px; flex-basis:28px; }
	#masthead .column.inline-flex{ min-width:0; }
}
@media(max-width:380px){ #masthead .brand a{ font-size:15px!important; } }
#masthead .brand .brand-text{ font-family:var(--stg-mono)!important; font-size:26px!important; line-height:1!important; letter-spacing:-.5px; }
@media(max-width:1023px){
	#masthead .brand,#masthead .brand a{ max-width:100%; min-width:0; }
	#masthead .brand .brand-text{ font-size:16px!important; overflow:hidden; text-overflow:ellipsis; }
}
@media(max-width:360px){ #masthead .brand .brand-text{ font-size:14px!important; } }

/* Drawers (mobile menu, cart, account, search) were white with unreadable text. */
.drawer-inner,.drawer-inner-header,.drawer-inner-body,.drawer .form-search,form.form-search,.mini-cart-inner,.drawer-inner-footer{
	background-color:var(--stg-bg-2)!important; color:var(--stg-fg)!important; border-color:var(--stg-line)!important;
}
.drawer-inner a,.drawer-inner .menu a,.drawer-inner li a,.drawer-inner .entry-title,.drawer-inner h5,.drawer-inner span{ color:var(--stg-fg)!important; opacity:1!important; }
.drawer-inner .menu a:hover,.drawer-inner li a:hover{ color:var(--stg-accent)!important; }
.drawer-inner .menu li,.drawer-inner li{ border-color:var(--stg-line)!important; }
.drawer-inner .close-button svg,.drawer-inner svg{ color:var(--stg-fg)!important; stroke:currentColor; }
.drawer-inner-header .brand a,.drawer-inner .site-title a{ color:var(--stg-fg)!important; }
.drawer-overlay{ background:rgba(6,7,12,.6)!important; }

/* Mobile bottom tab bar was white. */
.mobile-menu,.mobile-menu-inner{ background-color:var(--stg-bg-2)!important; border-top:1px solid var(--stg-line)!important; box-shadow:0 -10px 30px rgba(0,0,0,.35)!important; }
.mobile-menu *,.mobile-menu-label{ color:var(--stg-muted)!important; }
.mobile-menu a:hover *,.mobile-menu .active *{ color:var(--stg-accent)!important; }

/* Product page */
.stock.in-stock,.product-stock-data.in-stock{ background:rgba(156,230,192,.1)!important; color:var(--stg-accent-2)!important; border:1px solid rgba(156,230,192,.35)!important; }
.stock.out-of-stock{ background:rgba(255,155,155,.1)!important; color:#ffb4b4!important; }
.woocommerce-tabs .tabs li a,.wc-tabs li a{ color:var(--stg-muted)!important; }
.woocommerce-tabs .tabs li.active a,.wc-tabs li.active a{ color:var(--stg-fg)!important; border-color:var(--stg-accent)!important; }
.product-sticky-cart{ background-color:var(--stg-bg-2)!important; border-top:1px solid var(--stg-line)!important; box-shadow:0 -10px 30px rgba(0,0,0,.35)!important; }
.product-sticky-cart *{ color:var(--stg-fg)!important; opacity:1!important; }
.product-sticky-cart .price *,.product-sticky-cart .amount{ color:var(--stg-accent-2)!important; }
.product-sticky-cart .button{ color:#0b0d14!important; }
.single-product .product_meta,.single-product .posted_in{ color:var(--stg-muted)!important; }

/* Page title band: tighter, and never repeat content. Home has its own hero. */
.home .page-header{ display:none!important; }
.page-header .entry-description:empty{ display:none; }

/* Buttons groups need breathing room before the next heading. */
.wp-block-buttons{ margin-bottom:28px!important; gap:12px; }

/* Long-form pages (guides, policies, FAQ): readable measure. */
body.stg-reading .post-single .post-body,
body.stg-reading article .post-content{ max-width:780px; margin-left:auto; margin-right:auto; }
body.stg-reading .post-content p,body.stg-reading .post-content li{ line-height:1.75; }
body.stg-reading .post-content h2{ margin-top:2.2em; }
body.stg-reading .post-content img{ border-radius:12px; border:1px solid var(--stg-line); }
.stg-byline{ padding:12px 14px; border:1px solid var(--stg-line); border-radius:10px; background:var(--stg-bg-2); }
.stg-byline + hr{ display:none; }

/* Footer: real columns instead of default widget boxes. */
.site-footer .widget,footer .widget{ background:transparent!important; border:none!important; padding:0!important; }
.stg-foot h4{ font-family:var(--stg-mono)!important; font-size:13px!important; text-transform:uppercase; letter-spacing:.08em; color:var(--stg-fg)!important; margin:0 0 14px!important; }
.stg-foot ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.stg-foot li a{ font-size:14px; color:var(--stg-muted)!important; text-decoration:none; }
.stg-foot li a:hover{ color:var(--stg-accent)!important; }
.stg-foot-brand p{ font-size:14px; line-height:1.6; color:var(--stg-muted)!important; max-width:36ch; margin:10px 0 14px; }
.stg-foot-brand .stg-foot-logo{ display:flex; align-items:center; gap:10px; font-family:var(--stg-mono); font-weight:700; font-size:18px; color:var(--stg-fg); }
.stg-foot-brand .stg-foot-logo:before{ content:""; width:36px; height:36px; border-radius:50%; background:var(--stg-emblem) center/cover no-repeat; box-shadow:0 0 0 1px var(--stg-line); }
.stg-foot-badge{ display:inline-block; font-family:var(--stg-mono); font-size:11px; color:var(--stg-accent-2); border:1px solid var(--stg-line); border-radius:999px; padding:5px 10px; }
.footer-copyright,.footer-copyright *{ font-size:13px!important; color:var(--stg-muted)!important; }
.footer-copyright a:hover{ color:var(--stg-accent)!important; }

/* Ghost / secondary buttons must beat the global accent button rule. */
html body a.button.stg-btn-ghost,html body .button.stg-w-btn-ghost,html body a.button.stg-w-btn-ghost{
	background:transparent!important; color:var(--stg-fg)!important; border:1px solid var(--stg-line)!important;
}
html body a.button.stg-btn-ghost:hover,html body a.button.stg-w-btn-ghost:hover{ border-color:var(--stg-accent)!important; color:var(--stg-fg)!important; filter:none; }

/* Product card quick actions (wishlist / quick view / compare) were white circles. */
.gloria-wishlist-btn,.ustone-quickview-btn,.ustone-compare-btn,.product-buttons a,.product-actions a{
	background:rgba(23,26,36,.85)!important; color:var(--stg-fg)!important; border:1px solid var(--stg-line)!important; backdrop-filter:blur(4px);
}
.gloria-wishlist-btn:hover,.ustone-quickview-btn:hover,.ustone-compare-btn:hover{ border-color:var(--stg-accent)!important; color:var(--stg-accent)!important; }
.gloria-wishlist-btn svg,.ustone-quickview-btn svg,.ustone-compare-btn svg{ color:inherit!important; stroke:currentColor!important; }
.stg-trustbar-item span{ line-height:1.45; }
.stg-foot-badge,.stg-foot-brand .stg-foot-logo{ white-space:nowrap; }
@media(min-width:768px){ footer .footer-inner.grid{ grid-template-columns:1.6fr repeat(3,1fr)!important; gap:32px!important; } }
@media(max-width:767px){ footer .footer-inner.grid{ grid-template-columns:1fr 1fr!important; gap:28px!important; } footer .footer-inner.grid > *:first-child{ grid-column:1 / -1; } }