/* Adventný kalendár – všetko je pod .ak-cal, aby téma/Elementor kit nepretiekli dnu ani von. */

.ak-cal {
	--ak-gold: #e9bf5e;
	--ak-gold-dark: #b8892b;
	--ak-cream: #fff7e6;
	--ak-ink: #3a2412;
	--ak-red: #b3122e;
	--ak-night: #0f2238;
	--ak-radius: 14px;
	--ak-gap: clamp(8px, 1.6vw, 16px);
	--ak-col-gap: var(--ak-gap);
	--ak-cols: 6;
	--ak-open: -100deg;          /* uhol otvorených dvierok */
	--ak-persp: 1400px;
	--ak-persp-origin: 0% 50%;   /* perspektíva od pántu – dvierka sa menej "nafúknu" doľava */
	--ak-door-room: 0.24;        /* koľko zo šírky okienka vytŕčajú otvorené dvierka */
	--ak-font-display: Georgia, "Times New Roman", serif;

	position: relative;
	isolation: isolate;
	overflow: hidden; /* otvorené dvierka v ľavom stĺpci nesmú vytvoriť vodorovný scroll */
	box-sizing: border-box;
	width: 100%;
	padding: clamp(14px, 3vw, 32px);
	border-radius: 22px;
	font-family: inherit;
	line-height: 1.5;
}
.ak-cal *, .ak-cal *::before, .ak-cal *::after { box-sizing: border-box; }
.ak-cal [hidden] { display: none !important; }

.ak-cal.ak-bg-dark {
	color: #fff;
	background-color: var(--ak-night);
	background-image:
		radial-gradient(ellipse at 20% 0%, rgba(233, 191, 94, .16), transparent 55%),
		radial-gradient(ellipse at 90% 100%, rgba(179, 18, 46, .28), transparent 55%),
		radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .07) 1px, transparent 0);
	background-size: auto, auto, 22px 22px;
}
.ak-cal.ak-bg-light {
	color: var(--ak-ink);
	background-color: #fbf5ea;
	background-image:
		radial-gradient(ellipse at 15% 0%, rgba(179, 18, 46, .10), transparent 55%),
		radial-gradient(ellipse at 90% 100%, rgba(29, 92, 58, .12), transparent 55%),
		radial-gradient(circle at 1px 1px, rgba(122, 22, 48, .08) 1px, transparent 0);
	background-size: auto, auto, 22px 22px;
	box-shadow: inset 0 0 0 1px rgba(184, 137, 43, .35);
}
.ak-cal.ak-bg-light .ak-notice { color: #7a1630; }
.ak-cal.ak-bg-transparent { padding: 0; }

/* sneh */
.ak-cal .ak-snow {
	position: absolute; inset: 0; z-index: 5;
	width: 100%; height: 100%;
	pointer-events: none; border-radius: inherit;
}

/* oznam nad mriežkou */
.ak-cal .ak-notice {
	position: relative; z-index: 6;
	min-height: 1.5em;
	margin: 0 0 clamp(10px, 2vw, 18px);
	text-align: center;
	font-size: clamp(14px, 1.6vw, 17px);
	font-weight: 500;
	transition: opacity .3s;
}
.ak-cal.ak-bg-transparent .ak-notice { color: inherit; }
.ak-cal .ak-notice:empty { opacity: 0; }
.ak-cal .ak-notice.is-preview {
	display: inline-block; left: 50%; transform: translateX(-50%);
	padding: 4px 12px; border-radius: 99px;
	background: #ffe08a; color: #4a3500; font-size: 13px;
}

/* mriežka */
.ak-cal .ak-grid {
	position: relative; z-index: 2;
	display: grid;
	grid-template-columns: repeat(var(--ak-cols), minmax(0, 1fr));
	gap: var(--ak-gap) var(--ak-col-gap);
}
/* Variant 4 v riadku: väčšia vodorovná medzera, do ktorej sa zmestia otvorené dvierka. */
.ak-cal.ak-cols-4 {
	--ak-cols: 4;
	--ak-col-gap: 5.5%; /* % zo šírky mriežky = rastie s okienkom, dvierka (~21 % šírky) sa vždy zmestia */
	--ak-gap: clamp(12px, 2.2vw, 26px);
}
/* Miesto pre dvierka prvého stĺpca, aby ich neorezal okraj kalendára.
   Padding v % sa počíta zo šírky .ak-cal, takže rastie s okienkami; symetricky kvôli vycentrovaniu. */
.ak-cal .ak-grid { padding-inline: calc(100% / var(--ak-cols) * var(--ak-door-room)); }
/* .ak-cal.ak-cal (0,2,0) zámerne prebije .ak-cal.ak-cols-4, lebo je neskôr */
@media (max-width: 900px) { .ak-cal.ak-cal { --ak-cols: 4; } }
@media (max-width: 520px) { .ak-cal.ak-cal { --ak-cols: 3; --ak-col-gap: var(--ak-gap); } }
.ak-cal.is-loading .ak-grid { opacity: .55; }
.ak-cal.is-ended .ak-grid { display: none; }

/* --- okienko: reset štýlov tlačidla z témy (špecifickosť 0,2,1 / 0,3,1 prebije kit 0,1,1 / 0,2,1) --- */
.ak-cal button.ak-cell,
.ak-cal button.ak-cell:hover,
.ak-cal button.ak-cell:focus,
.ak-cal button.ak-cell:active {
	appearance: none;
	-webkit-appearance: none;
	display: block;
	position: relative;
	width: 100%; height: auto; min-height: 0;
	aspect-ratio: 1 / 1;
	margin: 0; padding: 0;
	border: 0; border-radius: var(--ak-radius);
	background: none; background-color: transparent;
	box-shadow: none;
	color: inherit;
	font: inherit; line-height: 1.3;
	white-space: normal; word-break: normal; overflow-wrap: break-word;
	text-align: left; text-transform: none; letter-spacing: normal; text-decoration: none;
	cursor: pointer;
	container-type: inline-size; /* písmo vnútri sa škáluje podľa šírky okienka (cqi) */
	perspective: var(--ak-persp);
	perspective-origin: var(--ak-persp-origin);
	-webkit-tap-highlight-color: transparent;
	outline: none;
}
.ak-cal button.ak-cell:focus-visible { outline: 3px solid var(--ak-gold); outline-offset: 3px; }
.ak-cal button.ak-cell.is-locked { cursor: not-allowed; }

/* vnútro (to, čo je za dvierkami) */
.ak-cal .ak-back {
	position: absolute; inset: 0;
	display: flex; flex-direction: column; align-items: center;
	text-align: center;
	padding: clamp(6px, 1vw, 12px);
	padding: 6cqi 7cqi;
	border-radius: var(--ak-radius);
	background:
		radial-gradient(circle at 50% 0%, #fffdf6, transparent 70%),
		var(--ak-cream);
	box-shadow: inset 0 3px 14px rgba(58, 36, 18, .35), inset 0 0 0 2px var(--ak-gold);
	color: var(--ak-ink);
	overflow: hidden;
}
.ak-cal .ak-back-day {
	font-family: var(--ak-font-display);
	font-size: clamp(15px, 2vw, 22px);
	font-size: clamp(15px, 12cqi, 34px);
	font-weight: 700;
	line-height: 1;
	color: var(--ak-red);
}
.ak-cal .ak-back-text {
	margin: auto 0;             /* vertikálne na stred medzi číslom a tlačidlom */
	font-size: clamp(11px, 1.05vw, 13px);
	font-size: clamp(12px, 9.5cqi, 22px);
	font-weight: 500;
	line-height: 1.25;
	display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;
	overflow: hidden;
	white-space: normal;
	overflow-wrap: anywhere;
	hyphens: auto;
}
.ak-cal .ak-back-more {
	white-space: nowrap;
	padding: 2px 8px; border-radius: 99px;
	padding: .15em .8em;
	background: var(--ak-red); color: #fff;
	font-size: 11px;
	font-size: clamp(11px, 6.2cqi, 15px);
	font-weight: 600; line-height: 1.6;
}
.ak-cal .ak-back-more:empty { display: none; }
.ak-cal .ak-back-more .ak-short { display: none; }
/* malé okienko (mobil, 6 stĺpcov na úzkej obrazovke): len číslo + tlačidlo */
@container (max-width: 105px) {
	.ak-cal .ak-back { justify-content: center; gap: 6px; }
	.ak-cal .ak-back-text { display: none; }
	.ak-cal .ak-back-more .ak-long { display: none; }
	.ak-cal .ak-back-more .ak-short { display: inline; }
	.ak-cal .ak-back-day { font-size: clamp(20px, 22cqi, 28px); }
}

/* dvierka */
.ak-cal .ak-door {
	position: absolute; inset: 0; z-index: 2;
	transform-origin: left center;
	transform-style: preserve-3d;
	transition: transform 1.1s cubic-bezier(.34, 1.3, .5, 1);
}
.ak-cal .ak-door-front,
.ak-cal .ak-door-inner {
	position: absolute; inset: 0;
	border-radius: var(--ak-radius);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.ak-cal .ak-door-front {
	display: flex; align-items: center; justify-content: center;
	overflow: hidden;
	background-color: var(--ak-door);
	background-image:
		radial-gradient(circle at 30% 20%, rgba(255, 255, 255, .22), transparent 60%),
		radial-gradient(circle at 2px 2px, rgba(255, 255, 255, .09) 1.2px, transparent 0);
	background-size: auto, 12px 12px;
	box-shadow: 0 6px 14px rgba(0, 0, 0, .35), inset 0 -4px 0 rgba(0, 0, 0, .18);
}
.ak-cal .ak-door-front::before { /* zlatý prerušovaný rámik */
	content: ""; position: absolute; inset: 6px; z-index: 2;
	border: 2px dashed rgba(233, 191, 94, .75);
	border-radius: calc(var(--ak-radius) - 5px);
	pointer-events: none;
}
.ak-cal .ak-door-front::after { /* kľučka */
	content: ""; position: absolute; right: 9%; top: 50%; z-index: 3;
	width: 7%; aspect-ratio: 1; min-width: 6px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #fff3c4, var(--ak-gold) 45%, var(--ak-gold-dark));
	transform: translateY(-50%);
	box-shadow: 0 1px 2px rgba(0, 0, 0, .4);
}
.ak-cal .ak-door-inner {
	transform: rotateY(180deg);
	background: color-mix(in srgb, var(--ak-door) 70%, #000);
	box-shadow: inset 0 0 0 2px rgba(233, 191, 94, .5);
}

.ak-cal .ak-ico {
	position: relative; z-index: 1;
	width: 58%; height: 58%;
	margin-top: 10%;
	filter: drop-shadow(0 3px 3px rgba(0, 0, 0, .3));
	transition: transform .4s cubic-bezier(.34, 1.56, .64, 1);
}
.ak-cal .ak-door-front.has-img .ak-img {
	position: absolute; inset: 0; z-index: 0;
	width: 100%; height: 100%; max-width: none;
	object-fit: cover; border-radius: 0; margin: 0;
}
.ak-cal .ak-door-front.has-img .ak-num {
	background: rgba(0, 0, 0, .45); padding: 0 .3em; border-radius: 8px;
}
.ak-cal .ak-num {
	position: absolute; left: 12%; top: 7%; z-index: 3;
	font-family: var(--ak-font-display);
	font-size: clamp(20px, 3.2vw, 38px);
	font-size: clamp(15px, 17cqi, 40px);
	font-weight: 700;
	line-height: 1;
	color: #fde9b4;
	text-shadow: 0 2px 0 rgba(0, 0, 0, .35);
}

/* zámok – len na budúcich dňoch */
.ak-cal .ak-lock {
	position: absolute; right: 8%; bottom: 8%; z-index: 3;
	width: clamp(14px, 1.6vw, 20px); height: clamp(14px, 1.6vw, 20px);
	color: rgba(255, 255, 255, .75);
	opacity: 0; transition: opacity .3s;
}
.ak-cal .ak-lock svg { display: block; width: 100%; height: 100%; }
.ak-cal .ak-cell.is-locked .ak-lock { opacity: 1; }
.ak-cal .ak-cell.is-locked .ak-door-front { filter: saturate(.7) brightness(.82); }

/* stuha "Dnes" */
.ak-cal .ak-ribbon {
	position: absolute; top: 14%; right: -30%; z-index: 4;
	width: 100%;
	padding: 2px 0;
	background: var(--ak-gold); color: #4a2a00;
	font-size: clamp(9px, .9vw, 11px); font-size: clamp(8px, 5cqi, 12px); font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase; text-align: center;
	transform: rotate(40deg);
	box-shadow: 0 2px 4px rgba(0, 0, 0, .3);
	display: none;
}
.ak-cal .ak-cell.is-today .ak-ribbon { display: block; }

/* dnešné okienko – pulzuje a láka */
.ak-cal .ak-cell.is-today .ak-door { animation: ak-bob 2.4s ease-in-out infinite; }
.ak-cal .ak-cell.is-today .ak-door-front {
	animation: ak-glow 2.4s ease-in-out infinite;
}
.ak-cal button.ak-cell.is-today:hover .ak-door { animation: none; transform: rotateY(-14deg); transition-duration: .4s; }
.ak-cal button.ak-cell.is-today:hover .ak-ico { transform: scale(1.1) rotate(-4deg); }

/* otvorené */
.ak-cal .ak-cell.is-open .ak-door { transform: rotateY(var(--ak-open)); animation: none; }
/* vývojársky mód: všetky okienka sú "dnešné" – bez pulzovania a stuhy, nech to nie je chaos */
.ak-cal.is-dev .ak-cell.is-today:not(.is-now) .ak-door,
.ak-cal.is-dev .ak-cell.is-today:not(.is-now) .ak-door-front { animation: none; }
.ak-cal.is-dev .ak-cell.is-today:not(.is-now) .ak-ribbon { display: none; }
.ak-cal .ak-notice.is-preview { max-width: calc(100% - 20px); text-align: center; }
.ak-cal.is-dev .ak-notice.is-preview { background: #ffd2d2; color: #6b0f1f; }
.ak-cal .ak-cell.is-open .ak-door-front { animation: none; }
.ak-cal .ak-cell.is-open { z-index: 1; }
.ak-cal button.ak-cell.is-open:hover .ak-back { box-shadow: inset 0 3px 14px rgba(58, 36, 18, .35), inset 0 0 0 3px var(--ak-red); }
.ak-cal .ak-cell.no-anim .ak-door { transition: none; }

/* zamknuté – zatrasenie */
.ak-cal .ak-cell.is-shake { animation: ak-shake .45s; }

/* iskričky pri otvorení */
.ak-cal .ak-spark {
	position: absolute; left: 50%; top: 50%; z-index: 10;
	width: 8px; height: 8px; margin: -4px;
	border-radius: 50%;
	background: var(--c, var(--ak-gold));
	pointer-events: none;
	animation: ak-spark .9s cubic-bezier(.2, .7, .3, 1) forwards;
}

/* koniec */
.ak-cal .ak-end {
	position: relative; z-index: 6;
	padding: 2em 1em;
	text-align: center;
	font-family: var(--ak-font-display);
	font-size: clamp(18px, 2.4vw, 26px);
}

/* --- modálne okno (top layer, ale stále potomok .ak-cal) --- */
.ak-cal .ak-modal {
	width: min(560px, calc(100vw - 32px));
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	margin: auto;
	padding: 0;
	border: 0;
	border-radius: 20px;
	background: transparent;
	color: var(--ak-ink);
	overflow: visible;
}
.ak-cal .ak-modal::backdrop { background: rgba(8, 18, 32, .72); backdrop-filter: blur(3px); }
.ak-cal .ak-modal[open] { animation: ak-pop .45s cubic-bezier(.34, 1.56, .64, 1); }
.ak-cal .ak-modal-card {
	--ak-mp: clamp(20px, 4vw, 32px);
	position: relative;
	display: flex; flex-direction: column;
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	overflow: hidden;            /* posúva sa len .ak-modal-body, hlavička a FB pätička ostávajú */
	padding: 0;
	border-radius: 20px;
	background: var(--ak-cream);
	box-shadow: 0 0 0 4px var(--ak-gold), 0 24px 60px rgba(0, 0, 0, .45);
}
.ak-cal .ak-modal-card::before { /* cukrová "páska" hore */
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 10px;
	border-radius: 20px 20px 0 0;
	background: repeating-linear-gradient(-45deg, var(--ak-red) 0 12px, #fff 12px 24px);
}
.ak-cal .ak-modal-head { flex: none; display: flex; align-items: center; gap: 12px; margin: 0; padding: calc(var(--ak-mp) + 6px) calc(var(--ak-mp) + 40px) 14px var(--ak-mp); }
.ak-cal .ak-modal-body {
	flex: 1 1 auto; min-height: 0;
	overflow-y: auto; overscroll-behavior: contain;
	padding: 0 var(--ak-mp) var(--ak-mp);
}
.ak-cal .ak-modal-body:has(+ .ak-modal-fb:not([hidden])) { padding-bottom: 16px; }
.ak-cal .ak-modal-ico { flex: none; width: 52px; height: 52px; padding: 6px; border-radius: 12px; background: var(--ak-door, var(--ak-red)); }
.ak-cal .ak-modal-ico .ak-ico { width: 100%; height: 100%; margin: 0; }
.ak-cal .ak-modal .ak-modal-title {
	margin: 0; padding: 0;
	font-family: var(--ak-font-display);
	font-size: clamp(22px, 3vw, 28px);
	font-weight: 700; line-height: 1.2;
	color: var(--ak-red);
	text-transform: none; letter-spacing: normal;
}
.ak-cal .ak-modal-q { font-size: clamp(16px, 1.9vw, 19px); line-height: 1.55; color: var(--ak-ink); }
.ak-cal .ak-modal-q p { margin: 0 0 .7em; }
.ak-cal .ak-modal-q p:last-child { margin-bottom: 0; }
.ak-cal .ak-modal-q img { max-width: 100%; height: auto; border-radius: 10px; }
.ak-cal .ak-modal-q a { color: var(--ak-red); text-decoration: underline; }

.ak-cal .ak-modal-answer {
	margin-top: 16px; padding: 12px 14px;
	border-radius: 12px;
	background: #e8f4ec; color: #14432a;
	border: 1px solid #a9d3b6;
}
.ak-cal .ak-modal-answer-label { display: block; margin-bottom: 2px; font-size: 13px; text-transform: uppercase; letter-spacing: .05em; }
.ak-cal .ak-modal-answer-text p { margin: 0; }

.ak-cal .ak-modal-fb {
	flex: none;
	margin: 0; padding: 16px var(--ak-mp) var(--ak-mp);
	border-top: 2px dashed rgba(184, 137, 43, .45);
	background: var(--ak-cream);
	text-align: center;
	transition: box-shadow .2s;
}
.ak-cal .ak-modal.is-scrollable .ak-modal-fb { box-shadow: 0 -12px 18px -12px rgba(58, 36, 18, .35); }
.ak-cal .ak-modal-fb-text { margin: 0 0 12px; font-size: 15px; color: var(--ak-ink); }
.ak-cal a.ak-fb-btn,
.ak-cal a.ak-fb-btn:visited {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 11px 22px;
	border-radius: 99px;
	background: #1877f2; color: #fff;
	font-size: 16px; font-weight: 600; line-height: 1.2;
	text-decoration: none;
	box-shadow: 0 4px 12px rgba(24, 119, 242, .35);
	transition: transform .2s, box-shadow .2s, background-color .2s;
}
.ak-cal a.ak-fb-btn:hover,
.ak-cal a.ak-fb-btn:focus-visible { background: #0d65d9; color: #fff; transform: translateY(-2px); box-shadow: 0 8px 18px rgba(24, 119, 242, .45); }
.ak-cal .ak-fb-btn svg { width: 20px; height: 20px; }

.ak-cal button.ak-close,
.ak-cal button.ak-close:hover,
.ak-cal button.ak-close:focus {
	position: absolute; top: 16px; right: 14px; z-index: 2;
	width: 36px; height: 36px; min-height: 0;
	margin: 0; padding: 0;
	border: 0; border-radius: 50%;
	background: rgba(58, 36, 18, .08);
	box-shadow: none;
	color: var(--ak-ink);
	font: 400 26px/36px Arial, sans-serif;
	text-align: center; text-transform: none;
	cursor: pointer;
}
.ak-cal button.ak-close:hover { background: rgba(179, 18, 46, .15); color: var(--ak-red); }

.ak-cal .ak-noscript { text-align: center; }

/* animácie */
@keyframes ak-glow {
	0%, 100% { box-shadow: 0 6px 14px rgba(0, 0, 0, .35), 0 0 0 0 rgba(233, 191, 94, .0); }
	50%      { box-shadow: 0 6px 14px rgba(0, 0, 0, .35), 0 0 0 5px rgba(233, 191, 94, .65), 0 0 26px 6px rgba(233, 191, 94, .45); }
}
@keyframes ak-bob {
	0%, 100% { transform: rotateY(0) translateY(0); }
	50%      { transform: rotateY(-6deg) translateY(-3px); }
}
@keyframes ak-shake {
	0%, 100% { transform: translateX(0); }
	20% { transform: translateX(-6px) rotate(-2deg); }
	40% { transform: translateX(6px) rotate(2deg); }
	60% { transform: translateX(-4px); }
	80% { transform: translateX(4px); }
}
@keyframes ak-spark {
	0%   { transform: translate(0, 0) scale(1); opacity: 1; }
	100% { transform: translate(var(--dx), var(--dy)) scale(.2); opacity: 0; }
}
@keyframes ak-pop {
	0%   { transform: scale(.85) translateY(20px); opacity: 0; }
	100% { transform: none; opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
	.ak-cal .ak-door { transition-duration: .01s; }
	.ak-cal .ak-cell.is-today .ak-door,
	.ak-cal .ak-cell.is-today .ak-door-front,
	.ak-cal .ak-cell.is-shake,
	.ak-cal .ak-modal[open] { animation: none; }
	.ak-cal .ak-cell.is-today .ak-door-front { box-shadow: 0 0 0 4px var(--ak-gold); }
	.ak-cal .ak-snow, .ak-cal .ak-spark { display: none; }
}
