/**
 * CLAUDE: CookieConsent v3 Custom Styling | Quiet Luxury | Theme-Farben aus theme.json
 *
 * Farben: Primary Navy #1B365D, Secondary Gold #C5A572, Warm-50 #FDFBF8
 * Typografie: Inter (Body), Playfair Display (Headings)
 * Wie anpassen: CSS Custom Properties von CookieConsent ueberschreiben
 */

/* CLAUDE: Basis-Variablen | CookieConsent v3 nutzt :root-Variablen */
:root {
	--cc-font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
	--cc-modal-border-radius: 0;
	--cc-btn-border-radius: 4px;
	--cc-bg: #FDFBF8;
	--cc-primary-color: #1B365D;
	--cc-secondary-color: #3D3530;

	/* CLAUDE: Consent Modal (Bottom-Bar) */
	--cc-consent-modal-bg: #1B365D;
	--cc-consent-modal-border-radius: 0;

	/* CLAUDE: Buttons */
	--cc-btn-primary-bg: #C5A572;
	--cc-btn-primary-color: #FFFFFF;
	--cc-btn-primary-border-color: #C5A572;
	--cc-btn-primary-hover-bg: #b3935f;
	--cc-btn-primary-hover-color: #FFFFFF;
	--cc-btn-primary-hover-border-color: #b3935f;

	--cc-btn-secondary-bg: transparent;
	--cc-btn-secondary-color: #FFFFFF;
	--cc-btn-secondary-border-color: rgba(255, 255, 255, 0.4);
	--cc-btn-secondary-hover-bg: rgba(255, 255, 255, 0.1);
	--cc-btn-secondary-hover-color: #FFFFFF;
	--cc-btn-secondary-hover-border-color: rgba(255, 255, 255, 0.6);

	/* CLAUDE: Preferences Modal */
	--cc-overlay-bg: rgba(27, 54, 93, 0.6);
	--cc-preferences-modal-bg: #FDFBF8;

	/* CLAUDE: Toggle */
	--cc-toggle-on-bg: #C5A572;
	--cc-toggle-off-bg: #E0D5C9;
	--cc-toggle-on-knob-bg: #FFFFFF;
	--cc-toggle-off-knob-bg: #FFFFFF;
	--cc-toggle-readonly-bg: #1B365D;
	--cc-toggle-readonly-knob-bg: #FFFFFF;

	/* CLAUDE: Separator */
	--cc-separator-border-color: #EDE5DC;

	/* CLAUDE: Section */
	--cc-section-category-border: #EDE5DC;
}

/* CLAUDE: Consent Modal (Bottom-Bar) | Dunkler Hintergrund, helle Schrift */
#cc-main .cm {
	box-shadow: 0 -4px 24px rgba(27, 54, 93, 0.15);
}

#cc-main .cm__body {
	color: rgba(255, 255, 255, 0.9);
	font-size: 0.875rem;
	line-height: 1.6;
}

#cc-main .cm__title {
	color: #FFFFFF;
	font-family: 'Playfair Display', Georgia, serif;
	font-weight: 700;
	font-size: 1.125rem;
	letter-spacing: 0.02em;
}

#cc-main .cm__desc {
	color: rgba(255, 255, 255, 0.85);
}

/* CLAUDE: Links im Consent Modal | Gold-Akzent */
#cc-main .cm__desc a,
#cc-main .cm__desc .cc-link {
	color: #C5A572;
	text-decoration: underline;
	text-underline-offset: 2px;
}

#cc-main .cm__desc a:hover,
#cc-main .cm__desc .cc-link:hover {
	color: #d4b582;
}

/* CLAUDE: Buttons | Gleiche Groesse dank equalWeightButtons */
#cc-main .cm__btn {
	font-size: 0.875rem;
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: none;
	padding: 0.625rem 1.5rem;
	border-width: 1px;
	border-style: solid;
	transition: all 0.2s ease;
}

/* CLAUDE: Einstellungen-Link | Text-Style, kein Button-Look */
#cc-main .cm__btn.cm__btn--secondary:last-child {
	border-color: transparent;
	text-decoration: underline;
	text-underline-offset: 2px;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}

/* CLAUDE: Preferences Modal | Heller Hintergrund, dunkle Schrift */
#cc-main .pm {
	border-radius: 8px;
	box-shadow: 0 8px 40px rgba(27, 54, 93, 0.2);
}

#cc-main .pm__title {
	color: #1B365D;
	font-family: 'Playfair Display', Georgia, serif;
	font-weight: 700;
}

#cc-main .pm__body {
	color: #3D3530;
	font-size: 0.875rem;
	line-height: 1.6;
}

/* CLAUDE: Sections im Preferences Modal */
#cc-main .pm__section--toggle .pm__section-title {
	color: #1B365D;
	font-weight: 600;
}

#cc-main .pm__section-desc {
	color: #8F8071;
	font-size: 0.8125rem;
}

/* CLAUDE: Preferences Modal Buttons */
#cc-main .pm__btn {
	font-size: 0.875rem;
	font-weight: 600;
	letter-spacing: 0.03em;
}

#cc-main .pm__btn.pm__btn--primary {
	background: #C5A572;
	border-color: #C5A572;
	color: #FFFFFF;
}

#cc-main .pm__btn.pm__btn--primary:hover {
	background: #b3935f;
	border-color: #b3935f;
}

#cc-main .pm__btn.pm__btn--secondary {
	background: transparent;
	border-color: #E0D5C9;
	color: #1B365D;
}

#cc-main .pm__btn.pm__btn--secondary:hover {
	background: #F6F1ED;
	border-color: #C5A572;
}

/* CLAUDE: Links im Preferences Modal */
#cc-main .pm__body a,
#cc-main .pm__body .cc-link {
	color: #C5A572;
	text-decoration: underline;
	text-underline-offset: 2px;
}

#cc-main .pm__body a:hover,
#cc-main .pm__body .cc-link:hover {
	color: #b3935f;
}

/* CLAUDE: Footer Revoke-Button | Sieht aus wie normaler Footer-Link */
.wfi-cc-revoke-link {
	background: none;
	border: none;
	color: inherit;
	font: inherit;
	cursor: pointer;
	padding: 0;
	text-decoration: none;
}

.wfi-cc-revoke-link:hover {
	text-decoration: underline;
}
