/* ==========================================================================
   Last Draw – Design
   Farben aus dem Logo: Tischschwarz, Kartencreme, Draw-Rot
   ========================================================================== */

@font-face { font-family: "Barlow"; src: url("../fonts/Barlow-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("../fonts/Barlow-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("../fonts/Barlow-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url("../fonts/BarlowCondensed-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url("../fonts/BarlowCondensed-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

/* Kadence-Palette überschreiben (html:root schlägt Kadences :root) */
html:root {
	--ld-table:   #0E111A;  /* Hintergrund, wie im Logo */
	--ld-card:    #161A25;  /* Flächen */
	--ld-card-2:  #1D2230;  /* erhöhte Flächen */
	--ld-line:    #2A3040;  /* Linien */
	--ld-cream:   #FBF6EA;  /* Text, Kartenrand */
	--ld-muted:   #A3A7B3;  /* Nebentext */
	--ld-red:     #E33639;  /* Akzent */
	--ld-red-dk:  #C4262A;

	--global-palette1: var(--ld-red);
	--global-palette2: var(--ld-red-dk);
	--global-palette3: var(--ld-cream);
	--global-palette4: #EDE8DC;
	--global-palette5: var(--ld-muted);
	--global-palette6: #6E7383;
	--global-palette7: var(--ld-line);
	--global-palette8: var(--ld-table);
	--global-palette9: var(--ld-card);
	--global-palette9rgb: 22, 26, 37;
	--global-palette-highlight: var(--ld-red);
	--global-palette-highlight-alt: var(--ld-cream);
	--global-palette-btn-bg: var(--ld-red);
	--global-palette-btn-bg-hover: var(--ld-red-dk);
	--global-palette-btn: var(--ld-cream);
	--global-palette-btn-hover: var(--ld-cream);

	--global-body-font-family: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
	--global-heading-font-family: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;

	--ld-radius: 10px;
	color-scheme: dark;
}

body {
	background: var(--ld-table);
	color: var(--ld-cream);
	font-family: var(--global-body-font-family);
	font-size: 17px;
	line-height: 1.6;
}

h1, h2, h3, h4, h5, h6,
.woocommerce-loop-product__title,
.product_title {
	font-family: var(--global-heading-font-family);
	font-weight: 700;
	letter-spacing: 0.01em;
	line-height: 1.1;
	color: var(--ld-cream);
}

a { color: var(--ld-cream); }
a:hover { color: var(--ld-red); }

:focus-visible {
	outline: 2px solid var(--ld-red);
	outline-offset: 3px;
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
#masthead,
#masthead .site-header-row-container-inner,
#mobile-header .site-header-row-container-inner {
	background: var(--ld-table);
}
#masthead .site-main-header-wrap .site-header-row-container-inner {
	border-bottom: 1px solid var(--ld-line);
}

/* Logo enthält den Schriftzug – Seitentitel ausblenden */
.wp-custom-logo .site-branding .site-title,
.wp-custom-logo .site-branding .site-description { display: none; }

html .site-branding a.brand img,
html .site-branding a.brand img.svg-logo-image {
	max-width: 210px;
	width: 210px;
	height: auto;
}
@media (max-width: 767px) {
	html .site-branding a.brand img { max-width: 150px; width: 150px; }
}

.main-navigation .primary-menu-container > ul > li.menu-item > a {
	font-family: var(--global-heading-font-family);
	font-weight: 600;
	font-size: 1.15rem;
	color: var(--ld-cream);
	padding-left: 0.9em;
	padding-right: 0.9em;
}
.main-navigation .primary-menu-container > ul > li.menu-item > a:hover,
.main-navigation .primary-menu-container > ul > li.menu-item.current-menu-item > a {
	color: var(--ld-red);
}

.header-cart-button,
.header-cart-button .header-cart-label { color: var(--ld-cream); }
.header-cart-button .header-cart-total {
	background: var(--ld-red);
	color: var(--ld-cream);
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.button, button, input[type="submit"],
.wp-block-button__link,
.woocommerce a.button, .woocommerce button.button {
	font-family: var(--global-heading-font-family);
	font-weight: 600;
	font-size: 1.1rem;
	letter-spacing: 0.02em;
	border-radius: 6px;
}

.ld-btn-ghost {
	display: inline-flex;
	align-items: center;
	padding: 0.55em 1.2em;
	border: 1px solid rgba(251, 246, 234, 0.35);
	border-radius: 6px;
	font-family: var(--global-heading-font-family);
	font-weight: 600;
	font-size: 1.1rem;
	text-decoration: none;
	color: var(--ld-cream);
}
.ld-btn-ghost:hover { border-color: var(--ld-cream); color: var(--ld-cream); }

/* --------------------------------------------------------------------------
   Produktkacheln – gestaltet wie Sammelkarten
   Cremefarbener Kartenrand, weisses "Artwork-Fenster", rote Ecke wie im Logo
   -------------------------------------------------------------------------- */
.woocommerce ul.products li.product,
.wc-block-grid__product {
	position: relative;
	background: var(--ld-card);
	border: 1px solid rgba(251, 246, 234, 0.14);
	border-radius: var(--ld-radius);
	padding: 10px;
	overflow: hidden;
	box-shadow: none;
}
.woocommerce ul.products li.product::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 22px;
	height: 22px;
	background: var(--ld-red);
	clip-path: polygon(0 0, 100% 0, 100% 100%);
	pointer-events: none;
}
.woocommerce ul.products li.product:hover {
	border-color: rgba(251, 246, 234, 0.45);
}

/* Bildfenster: Produktfotos haben meist weissen Hintergrund */
.woocommerce ul.products li.product a.woocommerce-loop-image-link,
.woocommerce ul.products li.product .product-thumbnail {
	display: block;
	background: #FFFFFF;
	border-radius: calc(var(--ld-radius) - 4px);
	overflow: hidden;
}
.woocommerce ul.products li.product a img {
	aspect-ratio: 1 / 1;
	object-fit: contain;
	padding: 8%;
	margin: 0;
	background: #FFFFFF;
}

.woocommerce ul.products li.product .product-details,
.woocommerce ul.products li.product .entry-content-wrap {
	background: transparent;
	padding: 14px 6px 6px;
	box-shadow: none;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-size: 1.2rem;
	font-weight: 600;
	line-height: 1.2;
	padding: 0;
	margin-bottom: 0.5em;
}
.woocommerce ul.products li.product .price {
	font-family: var(--global-heading-font-family);
	font-weight: 700;
	font-size: 1.25rem;
	color: var(--ld-cream);
}
.woocommerce ul.products li.product .price del { color: var(--ld-muted); font-weight: 600; }
.woocommerce ul.products li.product .price ins { color: var(--ld-red); text-decoration: none; }

/* Ausverkauft: Bild gedimmt */
.woocommerce ul.products li.product.ld-soldout a img { opacity: 0.55; }

/* Badges */
.ld-badge,
.woocommerce span.onsale {
	position: absolute;
	top: 18px;
	left: 18px;
	z-index: 2;
	padding: 0.2em 0.65em;
	border-radius: 4px;
	background: var(--ld-table);
	color: var(--ld-cream);
	font-family: var(--global-heading-font-family);
	font-weight: 600;
	font-size: 0.95rem;
	line-height: 1.4;
	min-height: 0;
	min-width: 0;
	margin: 0;
}
.ld-badge--preorder,
.woocommerce span.onsale { background: var(--ld-red); }

/* --------------------------------------------------------------------------
   Produktseite
   -------------------------------------------------------------------------- */
.single-product div.product .woocommerce-product-gallery {
	background: #FFFFFF;
	border-radius: var(--ld-radius);
	overflow: hidden;
}
.single-product .product_title { font-size: clamp(2rem, 4vw, 3rem); }
.single-product div.product p.price,
.single-product div.product span.price {
	font-family: var(--global-heading-font-family);
	font-weight: 700;
	font-size: 2rem;
	color: var(--ld-cream);
}
.single-product .stock.out-of-stock { color: var(--ld-red); font-weight: 600; }

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	font-family: var(--global-heading-font-family);
	font-size: 1.15rem;
}

/* Formulare */
input[type="text"], input[type="email"], input[type="tel"], input[type="number"],
input[type="password"], input[type="search"], textarea, select,
.select2-container .select2-selection {
	background-color: var(--ld-card-2);
	border: 1px solid var(--ld-line);
	color: var(--ld-cream);
	border-radius: 6px;
}
input::placeholder, textarea::placeholder { color: var(--ld-muted); }

/* Hinweise */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
	background: var(--ld-card-2);
	color: var(--ld-cream);
	border-top-color: var(--ld-red);
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
#colophon,
#colophon .site-footer-row-container-inner {
	background: #0A0C13;
	color: var(--ld-muted);
}
#colophon { border-top: 1px solid var(--ld-line); }
#colophon a { color: var(--ld-muted); }
#colophon a:hover { color: var(--ld-cream); }

/* ==========================================================================
   Startseite
   ========================================================================== */
.ld-home { overflow-x: clip; }

.ld-home .ld-hero,
.ld-home .ld-section {
	max-width: var(--global-content-width, 1290px);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--global-content-edge-padding, 1.5rem);
	padding-right: var(--global-content-edge-padding, 1.5rem);
}

/* Bühne: das neueste Produkt als Karte, aufgefächert wie im Logo */
.ld-hero { padding-top: clamp(2.5rem, 6vw, 5rem); padding-bottom: clamp(2.5rem, 6vw, 5rem); }

.ld-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: clamp(2rem, 5vw, 4rem);
	align-items: center;
}

.ld-hero__kicker {
	margin: 0 0 0.75rem;
	color: var(--ld-red);
	font-family: var(--global-heading-font-family);
	font-weight: 600;
	font-size: 1.25rem;
}
.ld-hero__title {
	margin: 0;
	font-size: clamp(2.6rem, 6vw, 4.75rem);
	line-height: 0.98;
	max-width: 14ch;
	text-wrap: balance;
}
.ld-hero__price {
	margin: 1.25rem 0 0;
	font-family: var(--global-heading-font-family);
	font-weight: 700;
	font-size: 1.9rem;
}
.ld-hero__price del { color: var(--ld-muted); font-size: 0.7em; }
.ld-hero__price ins { text-decoration: none; }
.ld-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 2rem;
}
.ld-hero__actions .ld-btn { padding: 0.55em 1.4em; }

.ld-hero__cards {
	position: relative;
	display: block;
	width: min(100%, 420px);
	aspect-ratio: 63 / 88; /* Format einer Sammelkarte */
	margin: 0 auto;
}
.ld-hero__card {
	position: absolute;
	inset: 0;
	border: 3px solid var(--ld-cream);
	border-radius: 16px;
	background: var(--ld-card);
	transform-origin: 50% 100%;
}
.ld-hero__card--back2 { transform: rotate(-14deg) translateX(-10%); opacity: 0.45; }
.ld-hero__card--back1 { transform: rotate(-7deg) translateX(-5%); opacity: 0.7; }
.ld-hero__card--front {
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background: #FFFFFF;
	transform: rotate(2deg);
}
.ld-hero__card--front::after {
	content: "";
	position: absolute;
	top: 10px;
	right: 10px;
	width: 34px;
	height: 34px;
	background: var(--ld-red);
	clip-path: polygon(0 0, 100% 0, 100% 100%);
}
.ld-hero__card--front img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 10%;
}

/* Einmaliger Moment: Karten fächern sich beim Laden auf */
@media (prefers-reduced-motion: no-preference) {
	.ld-hero__card--back2 { animation: ld-fan-2 0.9s cubic-bezier(.2,.8,.2,1) both; }
	.ld-hero__card--back1 { animation: ld-fan-1 0.9s cubic-bezier(.2,.8,.2,1) both; }
	.ld-hero__card--front { animation: ld-fan-0 0.9s cubic-bezier(.2,.8,.2,1) both; }
	@keyframes ld-fan-2 { from { transform: rotate(2deg); opacity: 0; } }
	@keyframes ld-fan-1 { from { transform: rotate(2deg); opacity: 0; } }
	@keyframes ld-fan-0 { from { transform: rotate(0deg) translateY(12px); } }
}

@media (max-width: 800px) {
	.ld-hero__inner { grid-template-columns: 1fr; }
	.ld-hero__cards { width: min(78%, 320px); order: -1; margin-bottom: 1rem; }
}

/* Abschnitte */
.ld-section { padding-top: clamp(2rem, 5vw, 3.5rem); padding-bottom: clamp(1rem, 3vw, 2rem); }
.ld-section__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.5rem;
	border-bottom: 1px solid var(--ld-line);
	padding-bottom: 0.75rem;
}
.ld-section__head h2 { margin: 0; font-size: clamp(2rem, 4vw, 2.75rem); }
.ld-section__head a {
	color: var(--ld-muted);
	text-decoration: underline;
	text-underline-offset: 4px;
	white-space: nowrap;
}
.ld-section__head a:hover { color: var(--ld-cream); }

/* Spiele */
.ld-games {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 12px;
}
.ld-game a {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 150px;
	padding: 1rem 1.1rem;
	background: var(--ld-card);
	border: 1px solid var(--ld-line);
	border-left: 4px solid var(--ld-red);
	border-radius: var(--ld-radius);
	text-decoration: none;
	overflow: hidden;
}
.ld-game a:hover { border-color: rgba(251, 246, 234, 0.45); border-left-color: var(--ld-red); }
.ld-game__img {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 45%;
	max-height: 60%;
	object-fit: contain;
	opacity: 0.9;
}
.ld-game__name {
	position: relative;
	font-family: var(--global-heading-font-family);
	font-weight: 700;
	font-size: 1.6rem;
	line-height: 1.05;
	color: var(--ld-cream);
}
.ld-game__count {
	position: relative;
	margin-top: 0.3rem;
	color: var(--ld-muted);
	font-size: 0.95rem;
}

/* Produktraster auf der Startseite */
.ld-home .woocommerce ul.products { margin-bottom: 0; }

/* --------------------------------------------------------------------------
   Kachel-Button (v1.0.1)
   -------------------------------------------------------------------------- */
.woocommerce ul.products li.product .button {
	display: inline-flex;
	width: 100%;
	justify-content: center;
	margin-top: 0.75rem;
	opacity: 1;
	visibility: visible;
}
.woocommerce ul.products li.product.ld-soldout .button {
	background: transparent;
	border: 1px solid var(--ld-line);
	color: var(--ld-muted);
}

/* --------------------------------------------------------------------------
   Seitennavigation zentriert (v1.0.1)
   -------------------------------------------------------------------------- */
.woocommerce nav.woocommerce-pagination,
.navigation.pagination {
	display: flex;
	justify-content: center;
	text-align: center;
	margin-top: 2.5rem;
}
.woocommerce nav.woocommerce-pagination ul,
.navigation.pagination .nav-links {
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	border: 0;
	margin: 0;
}
.woocommerce nav.woocommerce-pagination ul li { border: 0; margin: 0; }
.woocommerce nav.woocommerce-pagination ul li .page-numbers,
.navigation.pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding: 0 0.6em;
	border: 1px solid var(--ld-line);
	border-radius: 6px;
	background: var(--ld-card);
	color: var(--ld-cream);
	font-family: var(--global-heading-font-family);
	font-weight: 600;
	font-size: 1.1rem;
}
.woocommerce nav.woocommerce-pagination ul li .page-numbers.current,
.navigation.pagination .page-numbers.current {
	background: var(--ld-red);
	border-color: var(--ld-red);
	color: var(--ld-cream);
}
.woocommerce nav.woocommerce-pagination ul li a.page-numbers:hover,
.navigation.pagination a.page-numbers:hover {
	border-color: var(--ld-cream);
	color: var(--ld-cream);
}

/* --------------------------------------------------------------------------
   Titelbereich von Kategorie- und Shopseiten (v1.0.2)
   -------------------------------------------------------------------------- */
.entry-hero .entry-hero-container-inner,
.woocommerce .entry-hero .entry-hero-container-inner {
	background: var(--ld-table);
	border-bottom: 1px solid var(--ld-line);
}
.entry-hero .entry-header,
.product-archive-hero-section .entry-header {
	min-height: 0;
	padding-top: clamp(2rem, 5vw, 3.5rem);
	padding-bottom: clamp(1.5rem, 4vw, 2.5rem);
}
.entry-hero .entry-header h1,
.entry-hero .page-title {
	font-size: clamp(2.5rem, 6vw, 4rem);
}

/* Auswahlfelder: Pfeil nur einmal anzeigen */
select,
.woocommerce-ordering select {
	background-color: var(--ld-card-2);
	background-repeat: no-repeat;
	background-position: right 0.6em center;
	padding-right: 2em;
}

/* Textseiten (Impressum, AGB usw.) – angenehme Zeilenlänge (v1.0.3) */
.page .entry-content > h2 { font-size: 1.75rem; margin-top: 2em; }
.page .entry-content > p,
.page .entry-content > ul { max-width: 70ch; }

/* Lange Produktnamen in der Bühne kleiner setzen (v1.0.4) */
.ld-hero__title--long { font-size: clamp(2.2rem, 4.6vw, 3.6rem); max-width: 18ch; }
.ld-hero__title--xl   { font-size: clamp(1.9rem, 3.6vw, 2.9rem); max-width: 22ch; line-height: 1.02; }

/* Footer: Copyright und Links auf einer Linie (v1.0.4) */
#colophon .site-footer-row,
#colophon .site-footer-section { align-items: center; }
#colophon .footer-html p,
#colophon .footer-html-inner p { margin: 0; }
#colophon .footer-navigation ul,
#colophon .footer-navigation .menu { margin: 0; }
#colophon .footer-navigation .menu > li > a {
	padding-top: 0.25em;
	padding-bottom: 0.25em;
}

/* ==========================================================================
   Daily Draw prominent (v1.0.6)
   ========================================================================== */

/* Leiste ganz oben */
.ld-ddbar {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.9rem;
	padding: 0.55rem 1rem;
	background: var(--ld-red);
	color: var(--ld-cream);
	text-decoration: none;
	font-size: 1rem;
	overflow: hidden;
}
.ld-ddbar:hover { color: var(--ld-cream); background: var(--ld-red-dk); }
.ld-ddbar__card {
	flex: none;
	width: 16px;
	height: 22px;
	border: 2px solid var(--ld-cream);
	border-radius: 3px;
	transform: rotate(-8deg);
}
.ld-ddbar__cta {
	flex: none;
	padding: 0.15em 0.8em;
	border: 1px solid rgba(251, 246, 234, 0.7);
	border-radius: 4px;
	font-family: var(--global-heading-font-family);
	font-weight: 600;
	font-size: 1.05rem;
}
/* Lichtreflex, der einmal über die Leiste läuft */
@media (prefers-reduced-motion: no-preference) {
	.ld-ddbar::after {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.28) 50%, transparent 65%);
		transform: translateX(-100%);
		animation: ld-sheen 3.5s ease-in-out 1s infinite;
	}
	@keyframes ld-sheen { 0% { transform: translateX(-100%); } 40%, 100% { transform: translateX(100%); } }
}
@media (max-width: 600px) {
	.ld-ddbar { font-size: 0.9rem; gap: 0.6rem; }
	.ld-ddbar__card { display: none; }
}

/* Menüpunkt hervorheben */
.main-navigation .primary-menu-container > ul > li.menu-item > a[href*="/daily-draw"] {
	margin-right: 0.6em;
	padding: 0.35em 0.9em;
	border: 1px solid var(--ld-red);
	border-radius: 6px;
	background: var(--ld-red);
	color: var(--ld-cream);
	line-height: 1.2;
	align-self: center;
}
.main-navigation .primary-menu-container > ul > li.menu-item > a[href*="/daily-draw"]:hover,
.main-navigation .primary-menu-container > ul > li.current-menu-item > a[href*="/daily-draw"] {
	background: var(--ld-red-dk);
	color: var(--ld-cream);
}
.mobile-navigation ul li a[href*="/daily-draw"] { color: var(--ld-red); font-weight: 700; }

/* Teaser auf der Startseite: gross und direkt unter der Bühne */
.ld-section--first { padding-top: 0; }
.ld-section--teaser .ldd-teaser {
	padding: clamp(1.25rem, 3vw, 2rem) clamp(1.25rem, 3vw, 2.25rem);
	gap: clamp(1rem, 3vw, 2rem);
	border-left-width: 6px;
}
.ld-section--teaser .ldd-teaser__card { width: clamp(64px, 8vw, 92px); border-width: 3px; border-radius: 9px; }
.ld-section--teaser .ldd-teaser__text strong { font-size: clamp(2rem, 4.5vw, 3rem); }
.ld-section--teaser .ldd-teaser__text span { font-size: 1.15rem; }
.ld-section--teaser .ldd-teaser__cta { font-size: 1.3rem; padding: 0.6em 1.5em; }