/**
 * DA GDPR Cookie Consent – Banner Styles (card + modal)
 *
 * CSS custom properties injected inline from PHP settings:
 *   --da-gdpr-primary  : CTA button background (dark navy default)
 *   --da-gdpr-accent   : Toggle active colour
 *   --da-gdpr-text     : Text on primary buttons
 */

:root {
	--da-gdpr-primary     : #1a2744;
	--da-gdpr-accent      : #1a2744;
	--da-gdpr-text        : #ffffff;
	--da-gdpr-radius      : 8px;
	--da-gdpr-card-radius : 12px;
	--da-gdpr-z           : 999999;
	--da-gdpr-speed       : 0.25s;
	--da-gdpr-card-bg     : #ffffff;
	--da-gdpr-body-text   : #374151;
	--da-gdpr-muted       : #6b7280;
	--da-gdpr-border      : #e5e7eb;
	--da-gdpr-shadow      : 0 8px 32px rgba(0,0,0,.14), 0 2px 8px rgba(0,0,0,.08);
}

/* ── Reset ───────────────────────────────────────────────────────────────── */
/* !important throughout prevents WordPress themes from overriding our layout,
   text colours, or display values. This is standard practice for WP plugins
   that need to survive aggressive theme or page-builder stylesheets. */
#da-gdpr-banner,
#da-gdpr-banner *,
#da-gdpr-overlay,
#da-gdpr-overlay * {
	box-sizing  : border-box !important;
	font-family : -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

/* Text elements: force visible at all times */
#da-gdpr-banner .da-gdpr-title,
#da-gdpr-banner .da-gdpr-body,
#da-gdpr-banner .da-gdpr-link,
#da-gdpr-modal h2,
#da-gdpr-modal .da-gdpr-modal-desc,
#da-gdpr-modal .da-gdpr-toggle-label,
#da-gdpr-modal .da-gdpr-toggle-desc {
	display    : block !important;
	visibility : visible !important;
	opacity    : 1 !important;
	height     : auto !important;
	overflow   : visible !important;
	clip       : auto !important;
	clip-path  : none !important;
}

/* Structural divs: ensure they render as block/flex as intended */
#da-gdpr-banner .da-gdpr-card-inner,
#da-gdpr-banner .da-gdpr-text,
#da-gdpr-banner .da-gdpr-shield,
#da-gdpr-modal .da-gdpr-modal-header,
#da-gdpr-modal .da-gdpr-toggle-list,
#da-gdpr-modal .da-gdpr-modal-actions {
	display  : block !important;
	overflow : visible !important;
}

/* ── Floating bottom card ─────────────────────────────────────────────────── */
#da-gdpr-banner {
	position        : fixed;
	bottom          : 24px;
	left            : 50%;
	transform       : translateX(-50%) translateY(120%);
	z-index         : var(--da-gdpr-z);
	width           : min(680px, calc(100vw - 32px));
	background      : var(--da-gdpr-card-bg);
	border-radius   : var(--da-gdpr-card-radius);
	box-shadow      : var(--da-gdpr-shadow);
	border          : 1px solid var(--da-gdpr-border);
	opacity         : 0;
	transition      : transform var(--da-gdpr-speed) cubic-bezier(.32,.72,0,1),
	                  opacity  var(--da-gdpr-speed) ease;
}

#da-gdpr-banner.da-gdpr--visible {
	transform : translateX(-50%) translateY(0);
	opacity   : 1;
}

/* Close button (top-right of card) */
.da-gdpr-close-btn {
	position         : absolute;
	top              : 12px;
	right            : 12px;
	width            : 28px;
	height           : 28px;
	display          : flex;
	align-items      : center;
	justify-content  : center;
	background       : none;
	border           : none;
	cursor           : pointer;
	color            : var(--da-gdpr-muted);
	border-radius    : 50%;
	padding          : 0;
	font-size        : 20px;
	line-height      : 1;
	transition       : background var(--da-gdpr-speed), color var(--da-gdpr-speed);
}
.da-gdpr-close-btn:hover {
	background : var(--da-gdpr-border);
	color      : var(--da-gdpr-body-text);
}
.da-gdpr-close-btn:focus-visible {
	outline        : 2px solid var(--da-gdpr-primary);
	outline-offset : 2px;
}

/* Card inner layout */
.da-gdpr-card-inner {
	padding : 22px 22px 18px !important;
}

/* Body row: shield + text */
.da-gdpr-card-body {
	display       : flex !important;
	align-items   : flex-start !important;
	gap           : 14px !important;
	margin-bottom : 16px !important;
	padding-right : 24px !important; /* clearance for close btn */
}

.da-gdpr-shield {
	flex-shrink : 0 !important;
	color       : var(--da-gdpr-primary) !important;
	margin-top  : 2px !important;
}

.da-gdpr-title {
	font-size   : 15px !important;
	font-weight : 600 !important;
	color       : var(--da-gdpr-body-text) !important;
	margin      : 0 0 4px !important;
	line-height : 1.4 !important;
	background  : transparent !important;
	padding     : 0 !important;
}

.da-gdpr-body {
	font-size   : 13px !important;
	color       : var(--da-gdpr-muted) !important;
	margin      : 0 !important;
	line-height : 1.55 !important;
	background  : transparent !important;
	padding     : 0 !important;
}

.da-gdpr-link {
	color           : var(--da-gdpr-primary) !important;
	text-decoration : underline !important;
}
.da-gdpr-link:hover { opacity: 0.75 !important; }

/* Button row */
.da-gdpr-card-actions {
	display     : flex !important;
	align-items : center !important;
	gap         : 8px !important;
	flex-wrap   : wrap !important;
}

/* ── Shared button styles ─────────────────────────────────────────────────── */
.da-gdpr-btn {
	display         : inline-flex !important;
	align-items     : center !important;
	justify-content : center !important;
	gap             : 6px !important;
	padding         : 9px 18px !important;
	border-radius   : var(--da-gdpr-radius) !important;
	font-size       : 13px !important;
	font-weight     : 600 !important;
	line-height     : 1 !important;
	cursor          : pointer !important;
	white-space     : nowrap !important;
	border          : 1.5px solid transparent !important;
	transition      : opacity var(--da-gdpr-speed), background var(--da-gdpr-speed), border-color var(--da-gdpr-speed) !important;
	font-family     : inherit !important;
	text-decoration : none !important;
	box-shadow      : none !important;
	text-transform  : none !important;
	letter-spacing  : normal !important;
}
.da-gdpr-btn:focus-visible {
	outline        : 2px solid var(--da-gdpr-primary) !important;
	outline-offset : 2px !important;
}

/* Primary – filled dark */
.da-gdpr-btn--primary {
	background   : var(--da-gdpr-primary) !important;
	color        : var(--da-gdpr-text) !important;
	border-color : var(--da-gdpr-primary) !important;
}
.da-gdpr-btn--primary:hover { opacity: 0.85 !important; }

/* Outline – white with border */
.da-gdpr-btn--outline {
	background   : transparent !important;
	color        : var(--da-gdpr-body-text) !important;
	border-color : var(--da-gdpr-border) !important;
}
.da-gdpr-btn--outline:hover {
	border-color : #9ca3af !important;
	background   : #f9fafb !important;
}

/* Ghost – text only */
.da-gdpr-btn--ghost {
	background   : transparent !important;
	color        : var(--da-gdpr-muted) !important;
	border-color : transparent !important;
	padding-left : 10px !important;
	padding-right: 10px !important;
	font-weight  : 500 !important;
}
.da-gdpr-btn--ghost:hover { color: var(--da-gdpr-body-text) !important; }

/* ── Modal overlay ────────────────────────────────────────────────────────── */
#da-gdpr-overlay {
	position        : fixed !important;
	inset           : 0 !important;
	z-index         : calc(var(--da-gdpr-z) + 1) !important;
	background      : rgba(17, 24, 39, 0.55) !important;
	display         : flex !important;
	align-items     : center !important;
	justify-content : center !important;
	padding         : 16px !important;
	opacity         : 0 !important;
	pointer-events  : none !important;   /* hidden = not interactive */
	transition      : opacity var(--da-gdpr-speed) ease !important;
}
#da-gdpr-overlay[hidden] {
	display : none !important;
}
#da-gdpr-overlay.da-gdpr--visible {
	opacity        : 1 !important;
	pointer-events : auto !important;   /* visible = interactive */
}

/* Modal panel */
#da-gdpr-modal {
	position         : relative;
	background       : var(--da-gdpr-card-bg);
	border-radius    : var(--da-gdpr-card-radius);
	box-shadow       : 0 20px 60px rgba(0,0,0,.22);
	width            : 100%;
	max-width        : 580px;
	max-height       : calc(100vh - 48px);
	overflow-y       : auto;
	transform        : translateY(16px) scale(.98);
	transition       : transform var(--da-gdpr-speed) cubic-bezier(.32,.72,0,1);
}
#da-gdpr-overlay.da-gdpr--visible #da-gdpr-modal {
	transform : translateY(0) scale(1);
}

/* Modal close button */
#da-gdpr-modal .da-gdpr-close-btn {
	position : absolute;
	top      : 14px;
	right    : 14px;
}

/* Modal header */
.da-gdpr-modal-header {
	padding       : 20px 48px 0 20px !important;
	margin-bottom : 8px !important;
}
.da-gdpr-modal-header h2 {
	font-size   : 17px !important;
	font-weight : 600 !important;
	color       : var(--da-gdpr-body-text) !important;
	margin      : 0 !important;
	line-height : 1.3 !important;
	background  : transparent !important;
	padding     : 0 !important;
}

.da-gdpr-modal-desc {
	font-size   : 13px !important;
	color       : var(--da-gdpr-muted) !important;
	margin      : 0 20px 16px !important;
	line-height : 1.55 !important;
	background  : transparent !important;
	padding     : 0 20px !important;
}

/* ── Toggle list ──────────────────────────────────────────────────────────── */
.da-gdpr-toggle-list {
	border-top    : 1px solid var(--da-gdpr-border);
	margin        : 0 20px;
}

.da-gdpr-toggle-row {
	display         : flex;
	align-items     : center;
	justify-content : space-between;
	gap             : 16px;
	padding         : 16px 0;
	border-bottom   : 1px solid var(--da-gdpr-border);
}

.da-gdpr-toggle-info { flex: 1; min-width: 0; }

.da-gdpr-toggle-label {
	display     : block !important;
	font-size   : 14px !important;
	font-weight : 600 !important;
	color       : var(--da-gdpr-body-text) !important;
	margin      : 0 0 3px !important;
	cursor      : default !important;
	padding     : 0 !important;
	background  : transparent !important;
}
label.da-gdpr-toggle-label { cursor: pointer !important; }

.da-gdpr-toggle-desc {
	font-size   : 12px !important;
	color       : var(--da-gdpr-muted) !important;
	margin      : 0 !important;
	line-height : 1.5 !important;
	padding     : 0 !important;
	background  : transparent !important;
}

/* ── Toggle switch ────────────────────────────────────────────────────────── */
.da-gdpr-switch {
	position    : relative;
	display     : inline-block;
	width       : 46px;
	height      : 26px;
	flex-shrink : 0;
	cursor      : pointer;
}

.da-gdpr-switch input {
	opacity  : 0;
	width    : 0;
	height   : 0;
	position : absolute;
}

.da-gdpr-switch-track {
	position          : absolute;
	inset             : 0;
	background        : #d1d5db;
	border-radius     : 26px;
	transition        : background var(--da-gdpr-speed);
}
.da-gdpr-switch-track::before {
	content           : '';
	position          : absolute;
	height            : 20px;
	width             : 20px;
	left              : 3px;
	top               : 3px;
	background        : #ffffff;
	border-radius     : 50%;
	box-shadow        : 0 1px 3px rgba(0,0,0,.2);
	transition        : transform var(--da-gdpr-speed);
}

.da-gdpr-switch input:checked + .da-gdpr-switch-track {
	background : var(--da-gdpr-accent);
}
.da-gdpr-switch input:checked + .da-gdpr-switch-track::before {
	transform : translateX(20px);
}

/* Locked state (necessary) — darker, muted */
.da-gdpr-switch--locked .da-gdpr-switch-track {
	background : #6b7280;
	cursor     : not-allowed;
}
.da-gdpr-switch--locked {
	cursor : not-allowed;
}

.da-gdpr-switch input:focus-visible + .da-gdpr-switch-track {
	outline        : 2px solid var(--da-gdpr-primary);
	outline-offset : 2px;
}

/* ── Modal footer ─────────────────────────────────────────────────────────── */
.da-gdpr-modal-actions {
	display         : flex;
	align-items     : center;
	justify-content : flex-end;
	gap             : 8px;
	padding         : 16px 20px 20px;
}

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media ( max-width: 520px ) {
	#da-gdpr-banner {
		bottom        : 0;
		left          : 0;
		right         : 0;
		width         : 100%;
		border-radius : var(--da-gdpr-card-radius) var(--da-gdpr-card-radius) 0 0;
		transform     : translateX(0) translateY(110%);
	}
	#da-gdpr-banner.da-gdpr--visible {
		transform : translateX(0) translateY(0);
	}

	.da-gdpr-card-actions {
		flex-direction : column;
		align-items    : stretch;
	}
	.da-gdpr-btn {
		width           : 100%;
		justify-content : center;
		padding         : 11px 18px;
	}

	.da-gdpr-modal-actions {
		flex-direction : column-reverse;
	}
	.da-gdpr-modal-actions .da-gdpr-btn {
		width : 100%;
	}
}

/* ── Reduced motion ───────────────────────────────────────────────────────── */
@media ( prefers-reduced-motion: reduce ) {
	#da-gdpr-banner,
	#da-gdpr-overlay,
	#da-gdpr-modal,
	.da-gdpr-switch-track,
	.da-gdpr-switch-track::before,
	.da-gdpr-btn {
		transition : none;
	}
}
