/**
 * Websycraft Cookies — premium consent UI.
 * https://websycraft.com
 *
 * Brand defaults: Montserrat, amber #FFBD59 → #DCA02A gradient, navy #01121A.
 * Every colour, radius and the font are overridable per site via the CSS
 * variables the plugin sets inline on #wsc-root.
 */

#wsc-root {
	--wsc-primary: #FFBD59;
	--wsc-primary-2: #DCA02A;
	--wsc-accent: #2CC6E0;
	--wsc-on-primary: #01121A;
	--wsc-radius: 20px;
	--wsc-radius-btn: 999px;
	--wsc-font: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	/* light theme */
	--wsc-bg: #ffffff;
	--wsc-surface: #f7f8f9;
	--wsc-text: #01121A;
	--wsc-muted: #56656e;
	--wsc-border: rgba(1, 18, 26, 0.10);
	--wsc-shadow: 0 24px 60px -12px rgba(1, 18, 26, 0.28), 0 8px 24px -8px rgba(220, 160, 42, 0.20);
	--wsc-track: #dfe3e6;
	--wsc-focus: rgba(220, 160, 42, 0.50);
}

#wsc-root .wsc-theme-dark,
#wsc-root.wsc-theme-dark {
	--wsc-bg: #01121A;
	--wsc-surface: #0b222e;
	--wsc-text: #f2f6f8;
	--wsc-muted: #a3b4bd;
	--wsc-border: rgba(255, 255, 255, 0.12);
	--wsc-shadow: 0 24px 70px -12px rgba(0, 0, 0, 0.70), 0 8px 24px -8px rgba(255, 189, 89, 0.28);
	--wsc-track: #26404d;
	--wsc-focus: rgba(255, 189, 89, 0.55);
}

#wsc-root *,
#wsc-root *::before,
#wsc-root *::after { box-sizing: border-box; }

/* ------------------------------------------------------------ blocking veil */

.wsc-blocker {
	position: fixed; inset: 0; z-index: 2147482999;
	background: rgba(1, 18, 26, 0.55);
	backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
	opacity: 0; transition: opacity .35s ease;
}
.wsc-blocker.wsc-in { opacity: 1; }

/* ------------------------------------------------------------------ banner */

.wsc-banner {
	position: fixed;
	z-index: 2147483000;
	font-family: var(--wsc-font);
	color: var(--wsc-text);
	background: var(--wsc-bg);
	border: 1px solid var(--wsc-border);
	border-radius: var(--wsc-radius);
	box-shadow: var(--wsc-shadow);
	opacity: 0;
	transform: translateY(24px);
	transition: opacity .45s cubic-bezier(.16,1,.3,1), transform .45s cubic-bezier(.16,1,.3,1);
	will-change: transform, opacity;
	overflow: hidden;
}
.wsc-banner.wsc-in { opacity: 1; transform: translateY(0); }

/* gradient hairline on top */
.wsc-banner::before {
	content: "";
	position: absolute; inset: 0 0 auto 0; height: 3px;
	background: linear-gradient(90deg, var(--wsc-primary), var(--wsc-accent), var(--wsc-primary-2));
}

.wsc-pos-bottom { left: 24px; right: 24px; bottom: 24px; max-width: 1080px; margin: 0 auto; }
.wsc-pos-bottom-left { left: 24px; bottom: 24px; max-width: 460px; }
.wsc-pos-bottom-right { right: 24px; bottom: 24px; max-width: 460px; }
.wsc-pos-center {
	left: 50%; top: 50%; transform: translate(-50%, -46%) scale(.98);
	max-width: 560px; width: calc(100% - 40px);
}
.wsc-pos-center.wsc-in { transform: translate(-50%, -50%) scale(1); }

/* edge-to-edge bar variant */
.wsc-layout-bar.wsc-pos-bottom,
.wsc-layout-bar.wsc-pos-bottom-left,
.wsc-layout-bar.wsc-pos-bottom-right {
	left: 0; right: 0; bottom: 0; max-width: none;
	border-radius: 0; border-left: 0; border-right: 0; border-bottom: 0;
}
.wsc-layout-bar .wsc-banner-inner { max-width: 1180px; margin: 0 auto; }

.wsc-banner-inner {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: 18px;
	padding: 26px 28px;
}
.wsc-pos-bottom-left:not(.wsc-layout-bar) .wsc-banner-inner,
.wsc-pos-bottom-right:not(.wsc-layout-bar) .wsc-banner-inner,
.wsc-pos-center .wsc-banner-inner { flex-direction: column; gap: 14px; }

.wsc-badge {
	flex: 0 0 auto;
	width: 54px; height: 54px;
	display: grid; place-items: center;
	font-size: 24px; line-height: 1;
	border-radius: 14px;
	background: linear-gradient(135deg, rgba(255,189,89,.20), rgba(44,198,224,.16));
	border: 1px solid var(--wsc-border);
	overflow: hidden;
}
.wsc-badge img { width: 100%; height: 100%; object-fit: contain; display: block; }

/* Never let the nowrap action buttons squeeze the copy into a narrow column:
   below ~320px of text width the actions wrap onto their own row instead. */
.wsc-content { flex: 1 1 320px; min-width: 0; }
.wsc-title {
	margin: 0 0 6px;
	font-size: 19px; font-weight: 800; letter-spacing: -.01em;
	color: var(--wsc-text); line-height: 1.2;
}
.wsc-body {
	margin: 0;
	font-size: 14px; line-height: 1.6; font-weight: 400;
	color: var(--wsc-muted);
}
.wsc-link, .wsc-inline-link {
	color: var(--wsc-primary-2); text-decoration: none; font-weight: 600;
	border-bottom: 1px solid transparent; transition: border-color .2s;
}
.wsc-theme-dark .wsc-link { color: var(--wsc-primary); }
.wsc-link:hover, .wsc-inline-link:hover { border-bottom-color: currentColor; }

/* ---------------------------------------------------------------- branding */

.wsc-brand {
	margin: 10px 0 0;
	font-size: 11px; line-height: 1; letter-spacing: .02em;
	color: var(--wsc-muted); opacity: .75;
}
.wsc-brand-link {
	color: inherit; text-decoration: none; font-weight: 700;
	border-bottom: 1px solid transparent; transition: color .2s, border-color .2s;
}
.wsc-brand-link:hover { color: var(--wsc-primary-2); border-bottom-color: currentColor; }
.wsc-theme-dark .wsc-brand-link:hover { color: var(--wsc-primary); }

/* ------------------------------------------------------------------ actions */

.wsc-actions {
	flex: 0 0 auto;
	display: flex; align-items: center; gap: 10px;
	flex-wrap: wrap;
	margin-left: auto;
}
.wsc-pos-bottom-left .wsc-actions,
.wsc-pos-bottom-right .wsc-actions,
.wsc-pos-center .wsc-actions { width: 100%; }
.wsc-layout-bar .wsc-actions { width: auto; }

.wsc-btn {
	font-family: var(--wsc-font);
	font-size: 14px; font-weight: 600;
	padding: 12px 22px;
	border-radius: var(--wsc-radius-btn);
	border: 1px solid transparent;
	cursor: pointer;
	line-height: 1;
	white-space: nowrap;
	transition: transform .18s ease, box-shadow .25s ease, background .25s ease, border-color .2s ease, color .2s ease;
}
.wsc-btn:focus-visible { outline: 3px solid var(--wsc-focus); outline-offset: 2px; }
.wsc-btn:active { transform: translateY(1px); }

.wsc-btn-primary {
	color: var(--wsc-on-primary);
	background: linear-gradient(135deg, var(--wsc-primary), var(--wsc-primary-2));
	box-shadow: 0 8px 20px -6px rgba(220, 160, 42, .55);
	font-weight: 700;
}
.wsc-btn-primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 30px -8px rgba(220, 160, 42, .70);
}

.wsc-btn-ghost {
	color: var(--wsc-text);
	background: var(--wsc-surface);
	border-color: var(--wsc-border);
}
.wsc-btn-ghost:hover { border-color: var(--wsc-primary-2); color: var(--wsc-primary-2); }
.wsc-theme-dark .wsc-btn-ghost:hover { border-color: var(--wsc-primary); color: var(--wsc-primary); }

/* ------------------------------------------------------------------ modal */

.wsc-overlay {
	position: fixed; inset: 0; z-index: 2147483001;
	display: grid; place-items: center;
	padding: 20px;
	background: rgba(1, 18, 26, 0.60);
	backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
	opacity: 0; transition: opacity .3s ease;
	font-family: var(--wsc-font);
}
.wsc-overlay.wsc-in { opacity: 1; }

.wsc-modal {
	position: relative;
	width: 100%; max-width: 620px; max-height: 88vh;
	display: flex; flex-direction: column;
	background: var(--wsc-bg); color: var(--wsc-text);
	border: 1px solid var(--wsc-border);
	border-radius: var(--wsc-radius);
	box-shadow: var(--wsc-shadow);
	transform: translateY(16px) scale(.98);
	transition: transform .35s cubic-bezier(.16,1,.3,1);
	overflow: hidden;
}
.wsc-overlay.wsc-in .wsc-modal { transform: translateY(0) scale(1); }
.wsc-modal::before {
	content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
	background: linear-gradient(90deg, var(--wsc-primary), var(--wsc-accent), var(--wsc-primary-2));
}

.wsc-modal-head {
	display: flex; align-items: center; justify-content: space-between;
	padding: 24px 26px 8px;
}
.wsc-modal .wsc-body { padding: 0 26px; }
.wsc-close {
	background: transparent; border: 0; cursor: pointer;
	font-size: 28px; line-height: 1; color: var(--wsc-muted);
	width: 36px; height: 36px; border-radius: 10px;
	transition: background .2s, color .2s;
}
.wsc-close:hover { background: var(--wsc-surface); color: var(--wsc-text); }
.wsc-close:focus-visible { outline: 3px solid var(--wsc-focus); outline-offset: 2px; }

.wsc-cats {
	padding: 16px 26px 4px;
	overflow-y: auto;
	display: flex; flex-direction: column; gap: 12px;
}
.wsc-cat {
	background: var(--wsc-surface);
	border: 1px solid var(--wsc-border);
	border-radius: 14px;
	padding: 16px 18px;
}
.wsc-cat-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.wsc-cat-title { font-size: 15px; font-weight: 700; }
.wsc-cat-desc { margin: 8px 0 0; font-size: 13px; line-height: 1.55; color: var(--wsc-muted); }
.wsc-always { font-size: 12px; font-weight: 700; color: var(--wsc-primary-2); white-space: nowrap; }
.wsc-theme-dark .wsc-always { color: var(--wsc-primary); }

/* toggle switch */
.wsc-switch { position: relative; display: inline-block; width: 46px; height: 26px; flex: 0 0 auto; }
.wsc-switch input { opacity: 0; width: 0; height: 0; }
.wsc-slider {
	position: absolute; inset: 0; cursor: pointer;
	background: var(--wsc-track); border-radius: 9999px; transition: background .25s;
}
.wsc-slider::before {
	content: ""; position: absolute; height: 20px; width: 20px; left: 3px; top: 3px;
	background: #fff; border-radius: 50%; transition: transform .25s cubic-bezier(.16,1,.3,1);
	box-shadow: 0 2px 5px rgba(0,0,0,.25);
}
.wsc-switch input:checked + .wsc-slider { background: linear-gradient(135deg, var(--wsc-primary), var(--wsc-primary-2)); }
.wsc-switch input:checked + .wsc-slider::before { transform: translateX(20px); }
.wsc-switch input:focus-visible + .wsc-slider { outline: 3px solid var(--wsc-focus); outline-offset: 2px; }

.wsc-modal-foot {
	display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
	padding: 18px 26px 24px;
	border-top: 1px solid var(--wsc-border);
	margin-top: 8px;
}
.wsc-modal-foot .wsc-brand { margin: 0; }
.wsc-foot-btns { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; margin-left: auto; }

/* ------------------------------------------------------------ floating btn */

.wsc-float {
	position: fixed; bottom: 20px; z-index: 2147482000;
	width: 54px; height: 54px; border-radius: 50%;
	border: 1px solid var(--wsc-border);
	background: var(--wsc-bg);
	font-size: 22px; cursor: pointer; padding: 6px;
	box-shadow: 0 10px 26px -8px rgba(1,18,26,.40);
	opacity: 0; transform: scale(.6) translateY(10px);
	transition: opacity .35s ease, transform .35s cubic-bezier(.16,1,.3,1), box-shadow .25s;
	display: grid; place-items: center;
}
.wsc-float-left { left: 20px; }
.wsc-float-right { right: 20px; }
.wsc-float.wsc-in { opacity: .92; transform: scale(1) translateY(0); }
.wsc-float:hover { opacity: 1; transform: scale(1.08); box-shadow: 0 14px 30px -8px rgba(220,160,42,.55); }
.wsc-float:focus-visible { outline: 3px solid var(--wsc-focus); outline-offset: 3px; }
.wsc-float-icon { display: grid; place-items: center; width: 100%; height: 100%; line-height: 1; }
.wsc-float-icon img { width: 100%; height: 100%; object-fit: contain; display: block; }

/* --------------------------------------------------------- policy table */

.wsc-policy-table {
	width: 100%; border-collapse: collapse; font-family: var(--wsc-font, sans-serif);
	margin: 16px 0; font-size: 14px;
}
.wsc-policy-table th, .wsc-policy-table td {
	text-align: left; padding: 12px 14px; border: 1px solid rgba(1,18,26,.10); vertical-align: top;
}
.wsc-policy-table thead th { background: #f7f8f9; font-weight: 700; }

/* ------------------------------------------------------------- responsive */

@media (max-width: 720px) {
	.wsc-pos-bottom:not(.wsc-layout-bar) { left: 12px; right: 12px; bottom: 12px; }
	.wsc-banner-inner { flex-direction: column; gap: 14px; padding: 22px; }
	.wsc-actions { width: 100%; }
	.wsc-actions .wsc-btn { flex: 1 1 auto; text-align: center; }
	.wsc-badge { width: 46px; height: 46px; }
	.wsc-modal-foot { justify-content: center; }
	.wsc-foot-btns { width: 100%; margin-left: 0; }
	.wsc-foot-btns .wsc-btn { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
	.wsc-banner, .wsc-overlay, .wsc-modal, .wsc-float, .wsc-btn, .wsc-slider::before, .wsc-blocker {
		transition: none !important;
	}
}