/*
 * PageOne Julekalender – lågeskabeloner (Design-API v1)
 *
 * En lågeskabelon ændrer kun lågernes ansigt, aldrig indhold eller indstillinger.
 * Hver låge får klassen .p1jk-set-<id> og data-tone="0–5" (dag modulo 6), så farverne
 * varierer uden at afhænge af rækkefølgen i gitteret (som er tilfældig).
 * Har en låge sit eget billede, vinder billedet (.has-image).
 *
 * Nye skabeloner tilføjes som nye id'er. Eksisterende id'er ændres ikke, så live
 * kalendere ikke ændrer udseende ved en pluginopdatering.
 */

.p1jk-set {
	position: relative; /* tallene i ikon-skabelonen placeres i forhold til lågen, også i forhåndsvisningen i admin */
	--p1jk-tile: #14586b;
	--p1jk-tile-text: #ffffff;
	--p1jk-snow: rgba(255, 255, 255, .55);
	border: 0;
	border-radius: var(--p1jk-set-radius, 3px);
	color: var(--p1jk-tile-text);
	background-color: var(--p1jk-tile);
	/* Små "snefnug" som prikker i hjørnerne */
	background-image:
		radial-gradient(circle at 14% 22%, var(--p1jk-snow) 0 1.6px, transparent 2.4px),
		radial-gradient(circle at 82% 16%, var(--p1jk-snow) 0 1.1px, transparent 1.9px),
		radial-gradient(circle at 70% 80%, var(--p1jk-snow) 0 1.8px, transparent 2.6px),
		radial-gradient(circle at 22% 84%, var(--p1jk-snow) 0 1.1px, transparent 1.9px);
}
.p1jk-set:hover, .p1jk-set:focus-visible { filter: brightness(1.08); background-color: var(--p1jk-tile); }
.p1jk-set .p1jk-door-num { font-family: Georgia, "Times New Roman", serif; font-weight: 700; text-shadow: none; }
.p1jk-set.is-today { color: var(--p1jk-tile-text); box-shadow: inset 0 0 0 3px var(--p1jk-today-color); }
.p1jk-set.has-image { background-image: var(--p1jk-door-image); background-size: cover; }
.p1jk-set.has-image .p1jk-door-num { text-shadow: 0 1px 3px rgba(0, 0, 0, .7); color: #fff; }

/* --- Nordisk: dybe blå-grønne toner, is og sand --- */
.p1jk-set-nordisk[data-tone="0"] { --p1jk-tile: #14586b; --p1jk-tile-text: #e8f2f0; }
.p1jk-set-nordisk[data-tone="1"] { --p1jk-tile: #cfe3e1; --p1jk-tile-text: #14586b; --p1jk-snow: rgba(255, 255, 255, .95); }
.p1jk-set-nordisk[data-tone="2"] { --p1jk-tile: #e5ddd0; --p1jk-tile-text: #27566a; --p1jk-snow: rgba(255, 255, 255, .95); }
.p1jk-set-nordisk[data-tone="3"] { --p1jk-tile: #1b8a9a; --p1jk-tile-text: #ffffff; }
.p1jk-set-nordisk[data-tone="4"] { --p1jk-tile: #0d3b4c; --p1jk-tile-text: #cfe3e1; }
.p1jk-set-nordisk[data-tone="5"] { --p1jk-tile: #a9cdd0; --p1jk-tile-text: #0d3b4c; --p1jk-snow: rgba(255, 255, 255, .9); }

/* --- Traditionel: rød, marineblå, fyrregrøn og fløde --- */
.p1jk-set-traditionel[data-tone="0"] { --p1jk-tile: #b2373b; --p1jk-tile-text: #fbf1e2; }
.p1jk-set-traditionel[data-tone="1"] { --p1jk-tile: #1f2d4a; --p1jk-tile-text: #fbf1e2; }
.p1jk-set-traditionel[data-tone="2"] { --p1jk-tile: #f6ead7; --p1jk-tile-text: #b2373b; --p1jk-snow: rgba(178, 55, 59, .35); }
.p1jk-set-traditionel[data-tone="3"] { --p1jk-tile: #2f5d46; --p1jk-tile-text: #fbf1e2; }
.p1jk-set-traditionel[data-tone="4"] { --p1jk-tile: #7fb7a6; --p1jk-tile-text: #1f2d4a; --p1jk-snow: rgba(255, 255, 255, .9); }
.p1jk-set-traditionel[data-tone="5"] { --p1jk-tile: #e3b04b; --p1jk-tile-text: #1f2d4a; --p1jk-snow: rgba(255, 255, 255, .8); }

/* --- Mørk: natblå med guldtal --- */
.p1jk-set-moerk { box-shadow: inset 0 0 0 1px rgba(231, 201, 120, .35); --p1jk-tile-text: #e7c978; --p1jk-snow: rgba(231, 201, 120, .5); }
.p1jk-set-moerk[data-tone="0"] { --p1jk-tile: #0f1a2e; }
.p1jk-set-moerk[data-tone="1"] { --p1jk-tile: #13213a; }
.p1jk-set-moerk[data-tone="2"] { --p1jk-tile: #18284a; }
.p1jk-set-moerk[data-tone="3"] { --p1jk-tile: #0d1526; }
.p1jk-set-moerk[data-tone="4"] { --p1jk-tile: #162540; }
.p1jk-set-moerk[data-tone="5"] { --p1jk-tile: #1c2e52; }
.p1jk-set-moerk.is-today { box-shadow: inset 0 0 0 3px #e7c978; }

/* --- Ikoner: egne små julemotiver (tegnet som SVG), tolv motiver der gentages --- */
.p1jk-set-ikoner { color: #3a2f2a; border-radius: var(--p1jk-set-radius, 10px); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); background-image: none; }
.p1jk-set-ikoner[data-tone="0"] { --p1jk-tile: #f8efe0; }
.p1jk-set-ikoner[data-tone="1"] { --p1jk-tile: #dcebf5; }
.p1jk-set-ikoner[data-tone="2"] { --p1jk-tile: #e3efe2; }
.p1jk-set-ikoner[data-tone="3"] { --p1jk-tile: #f6e1df; }
.p1jk-set-ikoner[data-tone="4"] { --p1jk-tile: #f8efe0; }
.p1jk-set-ikoner[data-tone="5"] { --p1jk-tile: #e6e1f1; }
.p1jk-set-ikoner::before { content: ""; position: absolute; inset: 14% 14% 10% 14%; background-repeat: no-repeat; background-position: center; background-size: contain; }
.p1jk-set-ikoner .p1jk-door-num { position: absolute; left: 9%; top: 6%; z-index: 1; font-size: clamp(.8rem, 1.6vw, 1.15rem); color: #3a2f2a; text-shadow: none; }
.p1jk-set-ikoner.is-today { box-shadow: inset 0 0 0 3px var(--p1jk-today-color); }
.p1jk-set-ikoner[data-icon="0"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><rect x='12' y='28' width='40' height='26' rx='3' fill='%23c0392b'/><rect x='28' y='28' width='8' height='26' fill='%23f4c542'/><rect x='10' y='22' width='44' height='9' rx='2' fill='%23d84a3a'/><rect x='28' y='22' width='8' height='9' fill='%23f4c542'/><path d='M32 22C22 6 8 14 20 22Z' fill='%23f4c542'/><path d='M32 22C42 6 56 14 44 22Z' fill='%23f4c542'/></svg>"); }
.p1jk-set-ikoner[data-icon="1"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><polygon points='32,10 46,28 38,28 50,44 40,44 54,58 10,58 24,44 14,44 26,28 18,28' fill='%232f6b4f'/><rect x='28' y='56' width='8' height='6' fill='%237a4a21'/><polygon points='32,2 34.5,8 41,8 36,12 38,18 32,14.5 26,18 28,12 23,8 29.5,8' fill='%23f4c542'/></svg>"); }
.p1jk-set-ikoner[data-icon="2"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><path d='M32 8C20 8 16 20 16 32 16 42 10 46 10 50L54 50C54 46 48 42 48 32 48 20 44 8 32 8Z' fill='%23e0a82e'/><circle cx='32' cy='54' r='5' fill='%23b98418'/><circle cx='32' cy='7' r='3' fill='%23b98418'/></svg>"); }
.p1jk-set-ikoner[data-icon="3"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><polygon points='32,5 40,24 60,26 45,40 49,58 32,48 15,58 19,40 4,26 24,24' fill='%23f4c542' stroke='%23d9a521' stroke-width='2' stroke-linejoin='round'/></svg>"); }
.p1jk-set-ikoner[data-icon="4"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><path d='M40 58V24C40 8 22 8 20 22' fill='none' stroke='%23ffffff' stroke-width='10' stroke-linecap='round'/><path d='M40 58V24C40 8 22 8 20 22' fill='none' stroke='%23c0392b' stroke-width='10' stroke-linecap='round' stroke-dasharray='7 7'/></svg>"); }
.p1jk-set-ikoner[data-icon="5"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><path d='M20 8H42V34L54 43C60 48 55 58 46 57L30 47C26 45 24 41 24 37V22H20Z' fill='%23c0392b'/><rect x='17' y='6' width='28' height='11' rx='3' fill='%23ffffff' stroke='%23e2d4c0' stroke-width='1.5'/></svg>"); }
.p1jk-set-ikoner[data-icon="6"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><path d='M18 58V32C18 22 22 16 28 16L28 10C28 5 35 5 35 10L35 16C42 17 46 22 46 30V58Z' fill='%23c0392b'/><path d='M18 38C10 36 8 43 13 49L18 49Z' fill='%23c0392b'/><rect x='15' y='52' width='34' height='9' rx='3' fill='%23ffffff' stroke='%23e2d4c0' stroke-width='1.5'/></svg>"); }
.p1jk-set-ikoner[data-icon="7"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><g stroke='%234a8fc2' stroke-width='4' stroke-linecap='round' fill='none'><path d='M32 6V58M9.5 19L54.5 45M9.5 45L54.5 19'/><path d='M26 12L32 18L38 12M26 52L32 46L38 52M13 24L21 26L17 33M51 40L43 38L47 31M13 40L21 38L17 31M51 24L43 26L47 33'/></g></svg>"); }
.p1jk-set-ikoner[data-icon="8"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><rect x='24' y='26' width='16' height='30' rx='2' fill='%23c0392b'/><path d='M32 6C39 15 39 21 32 24C25 21 25 15 32 6Z' fill='%23f4a024'/><ellipse cx='32' cy='57' rx='15' ry='3.5' fill='%237a4a21'/></svg>"); }
.p1jk-set-ikoner[data-icon="9"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><path d='M8 36C16 20 30 22 32 32 26 42 14 46 8 36Z' fill='%232f6b4f'/><path d='M56 36C48 20 34 22 32 32 38 42 50 46 56 36Z' fill='%232f6b4f'/><circle cx='27' cy='40' r='6.5' fill='%23c0392b'/><circle cx='38' cy='40' r='6.5' fill='%23c0392b'/><circle cx='32.5' cy='49' r='6.5' fill='%23c0392b'/></svg>"); }
.p1jk-set-ikoner[data-icon="10"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><rect x='27' y='3' width='10' height='9' rx='2' fill='%23d9c27a'/><circle cx='32' cy='37' r='23' fill='%23c0392b'/><path d='M16 31C22 20 36 17 46 24' stroke='%23ffffff' stroke-opacity='.5' stroke-width='4.5' fill='none' stroke-linecap='round'/></svg>"); }
.p1jk-set-ikoner[data-icon="11"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><circle cx='32' cy='47' r='14' fill='%23ffffff' stroke='%23c5d4e2' stroke-width='2'/><circle cx='32' cy='27' r='10' fill='%23ffffff' stroke='%23c5d4e2' stroke-width='2'/><rect x='23' y='9' width='18' height='9' fill='%23333333'/><rect x='19' y='17' width='26' height='3.5' fill='%23333333'/><polygon points='32,27 43,29.5 32,32' fill='%23e67e22'/><circle cx='28' cy='24' r='1.7' fill='%23333333'/><circle cx='36' cy='24' r='1.7' fill='%23333333'/><rect x='22' y='35' width='20' height='5' rx='2' fill='%23c0392b'/></svg>"); }

/* --- Farvede stjerner: klare farver til mørk nattehimmel (bruges bl.a. med stjerneformen) --- */
.p1jk-set-stjerner { --p1jk-tile-text: #1a1230; --p1jk-snow: rgba(255, 255, 255, .7); }
.p1jk-set-stjerner[data-tone="0"] { --p1jk-tile: #f4b942; }
.p1jk-set-stjerner[data-tone="1"] { --p1jk-tile: #ef6f6c; }
.p1jk-set-stjerner[data-tone="2"] { --p1jk-tile: #7fc8f8; }
.p1jk-set-stjerner[data-tone="3"] { --p1jk-tile: #8fd694; }
.p1jk-set-stjerner[data-tone="4"] { --p1jk-tile: #c9a7ff; }
.p1jk-set-stjerner[data-tone="5"] { --p1jk-tile: #fff3c4; }
.p1jk-set-stjerner.is-today { box-shadow: none; filter: brightness(1.12); }