/*
 * SicherSatt design-system SKIN for OnePageCheckout for WooCommerce.
 * ------------------------------------------------------------------
 * The ONE child-theme file for the checkout (visual refinements only, zero
 * checkout functionality). The plugin keeps any stylesheet whose handle
 * contains "onepagecheckout"/"wopc" loaded in distraction-free mode.
 * Everything runs through the plugin's --wopc-* custom properties, plus a
 * handful of brand idioms (sharp corners, mono kickers, yellow CTA, Brauer).
 */

body.wopc {
	/* palette → SicherSatt tokens */
	--wopc-bg: #fafaf7;
	--wopc-bg-summary: #eeeded;
	--wopc-surface: #ffffff;
	--wopc-ink: #1a1a1a;
	--wopc-text: #3f3d3a;
	--wopc-muted: #676562;
	--wopc-faint: #a8a6a0;
	--wopc-line: #eceae3;
	--wopc-line-strong: #1a1a1a;
	--wopc-primary: #f4d435;
	--wopc-primary-ink: #1a1a1a;
	--wopc-accent: #1a1a1a;
	--wopc-success: #27c93f;
	--wopc-error: #e5484d;

	/* shape + type → sharp, Brauer, Plex, JetBrains */
	--wopc-radius: 0;
	--wopc-radius-sm: 0;
	--wopc-font: "IBM Plex Sans", -apple-system, sans-serif;
	--wopc-font-display: "Brauer LL", serif;
	--wopc-font-mono: "JetBrains Mono", ui-monospace, monospace;
	--wopc-fw-display: 700;
	--wopc-tt-btn: uppercase;
	--wopc-ls-btn: .12em;
	--wopc-shadow: none;
	--wopc-focus: 0 0 0 2px #f4d435, 0 0 0 4px rgba(26, 26, 26, .9);
}

/* Brand webfonts (paths relative to this file: assets/css/ → assets/fonts/) */
@font-face { font-family: "Brauer LL"; src: url("../fonts/BrauerLL-Bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("../fonts/IBMPlexSans-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("../fonts/IBMPlexSans-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("../fonts/IBMPlexSans-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../fonts/JetBrainsMono-Regular.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../fonts/JetBrainsMono-SemiBold.woff2") format("woff2"); font-weight: 600; font-display: swap; }

/* --- brand idiom refinements --- */

/* display type: Brauer wants tighter tracking + a size step up */
body.wopc .wopc-h2 { letter-spacing: -.4px; font-size: 22px; }
body.wopc .wopc-ty__h1 { letter-spacing: -.8px; font-size: 32px; }
/* final total: body font (IBM Plex) like every other number, not Brauer */
body.wopc .wopc-totals__row--grand dd { font-family: var(--wopc-font); letter-spacing: normal; }
body.wopc .wopc-logo .wopc-logo__img { max-height: 44px; }

/* mono kickers carry the brand voice — ink-muted, tracked */
body.wopc .wopc-kicker { color: var(--wopc-muted); font-weight: 600; letter-spacing: 2px; }
body.wopc .wopc-header__usps li { font-family: var(--wopc-font-mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; }

/* primary CTA: yellow, uppercase, darkens on hover (site convention) */
body.wopc .wopc-btn-primary { font-size: 13px; font-weight: 600; }
body.wopc .wopc-btn-primary:hover { filter: brightness(.96); }
body.wopc .wopc-btn-secondary { font-size: 13px; font-weight: 600; }

/* selection accent = yellow (matching card/CTA affordances) */
body.wopc .wopc-option.is-selected,
body.wopc #payment ul.wc_payment_methods li.wopc-pm-selected { background: #fffdf2; }
body.wopc .wopc-option.is-selected .wopc-option__row { box-shadow: inset 3px 0 0 #f4d435; }
body.wopc #payment ul.wc_payment_methods li.wopc-pm-selected::before { background: #f4d435; }
body.wopc .wopc-option input[type="radio"],
body.wopc #payment input[type="radio"],
body.wopc .wopc-check input { accent-color: #1a1a1a; }

/* qty badge = ink chip like the header cart counter */
body.wopc .wopc-item__qty { background: #1a1a1a; border-radius: 10px; }

/* thumbs sit on the product-well grey like the shop cards */
body.wopc .wopc-item__thumb { background: #dfdfdf; border: 0; }
body.wopc .wopc-item__thumb img { mix-blend-mode: normal; }

/* trust row reads as the site's mono microcopy */
body.wopc .wopc-trust { color: var(--wopc-muted); }

/* thank-you check chip: brand green on panel */
body.wopc .wopc-ty__check { background: #eafaee; }

/* Gateway bank details on the thank-you page (Gilles 2026-08-20): OPC's skin hides
   `.wopc-ty__ext ul.order_details` to suppress WC core's recap clutter, but WC gives
   the BACS "Unsere Bankverbindung" list that same generic class (`wc-bacs-bank-details
   order_details bacs_details`) — the IBAN/BIC rows were rendered yet invisible.
   Un-hide the BACS list specifically (higher specificity, no !important needed)
   and give it the skin's plain-list look. */
body.wopc .wopc-ty__ext ul.order_details.bacs_details {
	display: block;
	list-style: none;
	margin: 8px 0 0;
	padding: 0;
}
body.wopc .wopc-ty__ext ul.bacs_details li { padding: 2px 0; }