/* ═══════════════════════════════════════════════════════════════════════════
   She Thinks, He Inks — shop.css
   Commerce overrides that layer on the TitanCart plugin's storefront CSS (which
   the plugin enqueues site-wide while the theme is active). Scoped to the
   plugin's `.tc-*` selectors and kept higher-specificity so they win despite the
   plugin's stylesheet loading after ours (see KNOWN_ISSUES KI-8).

   Scope so far: the shop / category page header banner. The owner sets a banner
   image, height, overlay and focal point in Theme Options → Shop Page; those
   feed the plugin's tct_shop_banner_* theme mods (bridged in inc/theme-options.php).
   When no image is set, the plugin shows a flat default strip — these rules
   recolor that default to brand navy and keep the title/breadcrumb readable.
   ═══════════════════════════════════════════════════════════════════════════ */

/* No-image header banner → brand navy (replaces the plugin's dark default). */
.tc-shop__banner.tc-shop__banner--theme:not(.tc-shop__banner--has-image) {
	background: var(--sthi-navy);
}

/* Title + breadcrumb: light, readable text on the navy band or image overlay. */
.tc-shop__banner--theme .tc-shop__banner-title {
	color: #fff;
	font-family: var(--sthi-font-script);
}
.tc-shop__banner--theme .tc-breadcrumb,
.tc-shop__banner--theme .tc-breadcrumb__current {
	color: rgba(255, 255, 255, 0.85);
}
.tc-shop__banner--theme .tc-breadcrumb a {
	color: #fff;
}
.tc-shop__banner--theme .tc-breadcrumb a:hover {
	color: var(--sthi-gold);
}


/* ═══════════════════════════════════════════════════════════════════════════
   PRODUCT PAGE (PDP) — main image
   The plugin already rounds the image wrapper, but on a cream page a white-
   background product photo reads as a flat white square. Give it a real lift:
   brand rounding, a warm surface, a soft shadow and a hairline edge so the
   image always reads as a raised, polished card. Scoped under the theme body
   class so it wins over the plugin's later-loaded base rule.
   ═══════════════════════════════════════════════════════════════════════════ */
.she-thinks-he-inks .tc-pdp__main-img-wrap {
	border-radius: var(--sthi-radius-lg);
	background: var(--sthi-bg-tertiary);
	box-shadow: var(--sthi-shadow);
	border: 1px solid var(--sthi-border-subtle);
}

/* PDP description / tab box → solid white (it ships transparent, showing the cream). */
.she-thinks-he-inks .tc-pdp__tab-content {
	background: #fff;
}

/* Let the Shop Page → "banner height" control also size the plain (no-image)
   breadcrumb banner. The plugin only applies the height inline once an image is
   set; this honours --sthi-shop-banner-h (emitted in functions.php from the panel)
   for the image-less navy banner too. */
.she-thinks-he-inks .tc-shop__banner--theme:not(.tc-shop__banner--has-image) {
	height: var(--sthi-shop-banner-h, 250px);
}