:root {
	--bg: #000000;
	--bg-1: #0b0f14;
	--bg-2: radial-gradient(hsl(210,30%,20%), hsl(210,30%,0%));
    --bg-3:linear-gradient(180deg,#06b8fd54,transparent);
	--bg-button: linear-gradient(    rgb(54, 53, 53),    rgb(0, 0, 0),    rgb(54, 54, 54)  );
	--panel: #0f1620;
	--muted: #9aa6b2;
	--accent: #9be7ff;
	--glass: rgba(255,255,255,0.03);
	--radius: 14px;
	--radius-chip: 10px;
	--mono: 'JetBrains Mono', monospace;
	--ui: 'Inter', system-ui;
	--text: #2b1e10;
	--max-width: 1000px;
	--card: rgba(255,255,255,0.03);
	--border: 0px solid grey;
	--color-bg-primary: #0d0d0d;
	--color-bg-secondary: #1a1a1a;
	--color-bg-tertiary: #141414;
	--color-text-primary: #ffffff;
	--color-text-secondary: #aaaaaa;
	--color-accent: #00c3ff;
	--color-highlight: #FFC300;
	--color-border: #333333;
	--shadow-subtle: 0 4px 10px rgba(0, 0, 0, 0.4);

}


*{box-sizing:border-box;padding:0;}
.under{z-index:1;background-image:url('../Obrazky/paska.png');margin-bottom:-26px;opacity:1;border-top-left-radius:var(--radius);border-top-right-radius:var(--radius);text-align:center;animation:blink-1 2s ease-in-out 1 both;}
.under::before{content:"🛠 Na stránke sa stále pracuje ! 🛠";color:red;font-weight:bold;text-transform:uppercase;text-shadow:1px 1px 5px #000000,1px 1px 2px #000000,1px 1px 0px #000000;}

@keyframes blink-1{0%,50%,100%{opacity:1}25%,75%{opacity:0}}

body{background:black;color:white;font-family:Verdana;font-size:10pt;max-width:var(--max-width);margin:auto;display:flex;flex-direction:column;overflow-x:hidden;overflow-y:scroll;min-width:340px;}
#button{display:inline-block;background-color:#FF9800;width:50px;height:50px;text-align:center;border-radius:4px;position:fixed;bottom:10px;right:30px;background-image:url('../Obrazky/sipka2.png');background-position:center;background-repeat:no-repeat;background-size:60%;transition:background-color .3s,opacity .5s,visibility .5s;opacity:0;visibility:hidden;z-index:1000;box-shadow:2px 3px 3px 1px rgba(0,0,0,0.8);}
#button:hover{cursor:pointer;opacity:0.8 !important;}
#button:active{background-color:#555;}
#button.show{opacity:0.3;visibility:visible;}
#home{cursor:pointer;position:fixed;z-index:999;bottom:90px;right:30px;width:50px;height:50px;background-image:url('../Obrazky/home.png');background-repeat:no-repeat;background-size:90%;background-color:greenyellow;background-position:center;border:none;border-radius:5px;opacity:0.8;box-shadow:2px 3px 3px 1px rgba(0,0,0,0.8);transition:opacity 1s;}
#home:active{opacity:1;}
#home:hover{opacity:0.5;}
#progress-bar{position:fixed;top:0;left:0;width:0%;height:5px;background:linear-gradient(90deg,#3b82f6,#06b6d4);z-index:9999;transition:width 0.1s ease-out;}
.container{display:flex;flex:1;max-width:var(--max-width);margin:0 auto;width:100%;border:var(--border);}
.hamburger-menu{display:none;font-size:30px;cursor:pointer;text-align:right;}
.content{width:100%;border:var(--border);background:black;padding:10px;}
.welcome{max-height:calc(100vh - 55px);width:100%;display:flex;margin:auto;justify-content:center;}
.welcome img{object-fit:contain;width:100%;}
footer{margin:0 10px;text-align:center;border:var(--border);font-family:monospace;color:gray;font-size:small;padding:10px;background:radial-gradient(circle,rgba(0,0,0,1) 0%,rgba(15,22,32,1) 50%,rgba(0,0,0,1) 100%);}
.center{align-items:center;display:flex;height:100%;justify-content:center;}
.center img{width:100%;max-width:400px;}

/* animation button */
@keyframes pulse512{0%{box-shadow:0 0 0 0 rgb(86,159,253);}
70%{box-shadow:0 0 0 15px rgb(218 103 68 / 0%);}
100%{box-shadow:0 0 0 0 rgb(218 103 68 / 0%);}
}

.side-nav{position:sticky;top:10px;height:fit-content;border:var(--border);width:180px;margin:10px 10px 0 10px;background:var(--bg-2);padding-bottom:20px;border-radius:var(--radius);}

a{color:white;text-decoration:none;}
a:hover{text-shadow:2px 2px 2px #000000;}
.tlačítko,.cas{border:1px solid #00FFFF;color:#00FFFF;height:20px;font-size:10pt;text-shadow:1px 1px 1px rgba(0,0,0,1);position:relative;background:linear-gradient(90deg,rgba(5,115,255,1) 0%,rgba(2,0,136,1) 50%,rgba(5,115,255,1) 100%);margin:10px 0;width:100%;display:flex;justify-content:center;align-items:center;}
.tlačítko:hover{-webkit-animation:pulse 2s infinite;animation:pulse512 1.5s infinite;scale:1.1;}
.tlačítko.hi{-webkit-animation:pulse 2s infinite;animation:pulse512 1.5s infinite;border:1px solid #26e815;background:linear-gradient(90deg,#24ff05 0%,#0e2b08 50%,#24ff05 100%);}
.tlačítko.next{animation:pulse512 1.5s infinite;background:linear-gradient(90deg,#24ff05 0%,#000000 50%,#24ff05 100%);border:1px solid #24ff05;color:#24ff05;}
.tlačítko.no{display:none;}
.upd,.readers{text-align:center;font-family:Helvetica;font-size:8pt;color:darkgray;margin-top:10px;}
.cas{height:60px;min-height:30px;font-size:10pt;text-align:center;color:yellow;padding:5px 0 5px 0;margin:0 0 10px 0;}
.kalendar{color:red;text-align:center;}
.counter{width:70%;display:flex;margin:auto;}
.odometer{font-size:20px;margin-top:10px;left:50%;transform:translate(-50%,0);}
.hamb-logo{display:none;}
.loga{width:100%;display:flex;margin:10px auto;}
.loga img{width:90%;margin-left:auto;margin-right:auto;}
.pocitadlo{display:none;letter-spacing:2px;margin:auto;width:fit-content;background:linear-gradient(to bottom,#3A3A3A 0%,#000000 50%,#3A3A3A 100%);padding:2px 0 2px 2px;border:2px solid black;border-radius:4px;    cursor:context-menu;}


/* hide some menu items
.tlačítko:nth-child(n+6):nth-child(-n+8) {
  display:none;
}
*/

.tlačítko:nth-child(1){display:flex;}   /* 1 hlavna */
.tlačítko:nth-child(2){display:flex;}   /* 2 o mne */
.tlačítko:nth-child(3){display:flex;}   /* 3 galeria */
.tlačítko:nth-child(4){display:none;}   /* 4 stranky */
.tlačítko:nth-child(5){display:none;}   /* 5 carcass */
.tlačítko:nth-child(6){display:none;}   /* 6 GNR */
.tlačítko:nth-child(7){display:none;}   /* 7 conn */
.tlačítko:nth-child(8){display:none;}   /* 8 pano */
.tlačítko:nth-child(9){display:flex;}   /* 9 rain */
.tlačítko:nth-child(10){display:flex;}   /* 10 poker */
.tlačítko:nth-child(11){display:none;}   /* 11 graf */
.tlačítko:nth-child(12){display:flex;}   /* 12 poezia */
.tlačítko:nth-child(13){display:flex;}   /* 13 recept */
.tlačítko:nth-child(14){display:flex;}   /* 14 hist */





.download{background:linear-gradient(to bottom,#000000 0%,#3F3F3F 50%,#000000 100%);padding:5px 10px;border-radius:var(--radius-chip);border:1px solid #2b2a2a;display:flex;align-items:center;}
.download:hover{color:var(--accent);box-shadow:0px 0px 5px 1px var(--accent);}
.download:active{color:var(--accent);transform:scale(0.95);}
.dwn::before{display:inline-block;height:15px;width:15px;margin-right:5px;content:"";background:url(Obrazky/download.png) no-repeat 0 0;background-size:15px 15px;}
.det::before{content:"🔍";margin-right:10px;}
.det{cursor:help;}


/* sneženie */
canvas#snowCanvas{position:fixed;left:0;top:0;width:100%;height:100%;z-index:1;pointer-events:none;}
.switch{position:inherit;z-index:10;display:none;align-items:center;cursor:pointer;background:transparent;padding:0;border:none;box-shadow:none;gap:8px;overflow:hidden;height:30px;margin-left:38px;width:100px;justify-content:space-between;}
.switch input{display:none;}
.slider{position:relative;width:70px;border-radius:30px;display:flex;align-items:center;justify-content:space-between;padding:0 6px;font-size:18px;box-shadow:inset 3px 3px 6px 0px rgba(0,0,0,0.72);}
.slider::before{content:'';position:absolute;left:5px;top:1px;width:23px;height:23px;background:white;border-radius:50%;transition:transform 0.1s;z-index:2;box-shadow:0 2px 5px rgba(0,0,0,0.4);}
.slider span{position:relative;z-index:1;pointer-events:none;}
.switch.snowing .slider{background:#bfe9ff;color:#034;}
.switch.sunny .slider{background:#ffeaa7;color:#663c00;}
input:checked + .slider::before{transform:translateX(36px);}





/* ---------------  omne --------------- */

.sidebar{background:var(--bg-2);border-radius:var(--radius);padding: 0px 22px 10px;position:relative;box-shadow:0 6px 30px rgba(2,6,12,0.6);border:1px solid rgba(255,255,255,0.03);margin-bottom:10px;}
.avatar img{width:120px;height:120px;border-radius:var(--radius);object-fit:cover;mix-blend-mode:hard-light;float:right;}
.role{color:var(--muted);font-size:13px;margin-top:6px}
.bio{margin-top:14px;color:var(--muted);line-height:1.5;font-size:14px}
.meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;height:100%;}
.chip{background:var(--glass);border-radius:var(--radius-chip);padding:6px 10px;font-size:13px;color:var(--muted)}
.links{display:flex;flex-direction:row;margin-top:18px; justify-content:space-around;}
.link-btn{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:var(--radius-chip);color:var(--muted);text-decoration:none;border:1px solid rgba(255,255,255,0.03)}
.link-btn:hover{color:var(--accent);border-color:rgba(45,212,191,0.12)}
.main {
/*	padding: 22px;*/
	border-radius: var(--radius);
	background: var(--panel);
	border: 1px solid rgba(255,255,255,0.03);
	box-shadow: 0 6px 40px rgba(2,6,12,0.6);
}

.hero{display:flex;justify-content:space-between;align-items:center;gap:16px}
.title{font-size:22px;font-weight:800}
.subtitle{color:var(--muted);font-size:13px}
.cta{display:flex;gap:10px;margin-top:14px}
.btn{background:transparent;padding:10px 14px;border-radius:var(--radius-chip);border:1px solid rgba(255,255,255,0.04);font-weight:700;color:var(--accent);cursor:pointer}
.grid {
	display: grid;
/*	grid-template-columns: repeat(auto-fit,minmax(250px,1fr));   */
	gap: 16px;
}

.card{background:var(--bg-3);padding:14px;border-radius:var(--radius-chip);overflow:hidden;box-shadow:0 6px 18px rgba(0,0,0,0.6);transition:transform .18s ease,box-shadow .18s ease;display:flex;flex-direction:column;    margin:5px;}
.card:hover{transform:translateY(-6px);box-shadow:0 12px 30px rgba(0,0,0,0.7)}
.card h3{display:flex;align-items:center;gap:6px;font-size:15px;font-weight:600;margin-bottom:8px;text-shadow:2px 2px 3px #000000,2px 2px 3px #000000;}
.card p{color:var(--muted);font-size:13px;line-height:1.5;text-align: justify;}
.tech-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.tech{padding:6px 8px;border-radius:var(--radius-chip);background:rgba(255,255,255,0.02);font-size:13px;color:var(--muted)}
.rig{display:flex;gap:12px;align-items:flex-start;margin-top:10px}
.rig img{width:80px;height:auto;border-radius:var(--radius-chip);object-fit:contain;border:var(--border);}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px;margin-top:10px}
.gallery img{width:100%;height:90px;object-fit:cover;border-radius:var(--radius-chip);border:1px solid rgba(255,255,255,0.05);cursor:pointer;transition:transform 0.2s}
.gallery img:hover{transform:scale(1.05)}
.pro img{object-fit:contain;}
.lightbox{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.9);justify-content:center;align-items:center;z-index:1000}
.lightbox img{max-width:90%;max-height:90%;border-radius:var(--radius-chip)}


/* -------------- historia --------------- */
.nadpis{position:sticky;top:3px;margin:0 0 20px 0;font-size:1.5rem;backdrop-filter:blur(10px);z-index:2;color:#66CCFF;width:100%;}
.timeline{position:relative;margin:0 auto;padding:0 20px 5px;font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif;background:var(--panel);color:#e2e8f0;line-height:1.6;    border-radius:var(--radius);}
.timeline-item{position:relative;margin-bottom:3rem;padding:10px 25px;border-radius:var(--radius-chip);background:var(--bg-3);box-shadow:0 0 20px rgb(0,0,0);backdrop-filter:blur(4px);opacity:0;transform:translateY(40px);transition:all 0.8s ease-out;}
.timeline-item.visible{opacity:1;transform:translateY(0);}
.timeline-item h2{margin:0;font-size:1.5rem;color:#fff;}
.timeline-item p{color:#cbd5e1;margin-top:8px;display:list-item;}
::marker{color:aqua;}
.timeline-item:hover{transform:translateY(-5px) scale(1.02);box-shadow:0px 0px 12px 7px rgba(0,255,255,0.96);transition:all .1s ease-out;}


/* -------------- poker --------------- */
.poker{max-width:400px;position:relative;padding-bottom:0;border-radius:6px;border:2px solid;border-color:#007FF0;width:auto;margin:auto;background:linear-gradient(to bottom right,#2f2f5e,#191919);overflow:hidden;}
TD.PageHead{background-color:#3A6EA5;}
.SectionTitle{font-family:Verdana,Tahoma,Helvetica,Arial;font-weight:bold;font-size:12px;color:#FFFFFF;background-color:#007FF0;}
.SectionEnd{color:#FFFFFF;background-color:#006EA5;}
.SubTitle{font-weight:bold;font-size: clamp(0.625rem, 0.4688rem + 0.5vw, 0.75rem);color:#000000;background-color:#C5915A;}
.LightLine{background:rgba(0,0,0,0.05);}
.DarkLine{background:rgba(0,0,0,0.2);}
.bottom{font-family:Verdana;width:auto;margin:auto;font-size:9px;color:#FFFF76;}
.menu{width:auto;  background:linear-gradient(white,#FFFF24);}
.menu2{width:auto;}
.menu a{color:black;font-size:clamp(0.75rem,-1.9583rem + 6.6667vw,0.875rem);display:block;text-decoration:none;font-family:sans-serif;position:relative;text-align:center;font-weight:bold;}
.menu a:hover{text-shadow:2px 2px 3px rgba(0,0,0,0.4);}
.tooltiptext{visibility:hidden;width:120px;background:rgba(0,0,0,0.7);color:#ffffff;text-align:center;border-radius:6px;border:2px solid;border-color:#007FF0;padding:5px 0;position:absolute;z-index:88;top:50px;left:10px;margin-left:-60px;}
.tooltiptext2{visibility:hidden;width:120px;background:rgba(0,0,0,0.8);color:#ffffff;text-align:center;border-radius:6px;border:2px solid;border-color:#007FF0;padding:5px 0;position:absolute;z-index:88;margin-top:30px;left:50%;margin-left:-60px;}
.menu:hover .tooltiptext{visibility:visible;}
.menu2:hover .tooltiptext2{visibility:visible;}
.plus{color:#00F500;font-weight:bold;}
.minus{color:red;font-weight:bold;}
.rovne{color:white;font-weight:bold;}
div.SectionTitle{font-size:14px;padding:8px 8px;color:#FFFFFF;background-color:#007FF0;background:rgba(0,127,240,0.8);text-shadow:2px 2px 2px #000000;}
div.SectionTitle2{font-family:Verdana,Tahoma,Helvetica,Arial;font-weight:bold;font-size:clamp(0.6875rem,-0.6667rem + 3.3333vw,0.75rem);text-align:center;color:#FFFFFF;padding:3px;background-color:#007FF0;}
div.next{font-size:12px;font-weight:bold;text-align:center;padding:8px 4px;color:#FFFFFF;background-color:red;text-shadow:2px 2px 2px #000000;}
div.text{padding:4px 8px;color:#FFFFFF;}
tr:hover{color:white; background:rgba(0,0,0,0.9);}
div.pokerlogo{background-image:url('../poker/poker_logo_small.png');background-repeat:no-repeat;background-position:right top;background-size:80px;    height:auto;    margin:0;}
.spodok{border-bottom:2px solid #00A0F0;}
.vrch{border-top:2px solid #00A0F0;}
.allert{padding:4px 8px;color:red;font-weight:bold;}
.zvyrazni{text-shadow:0 0 5px #000000,0 0 6px #FFFF00;background:rgba(255,255,98,.08);font-weight:bold;}
.tab{padding:0px;border-spacing:3px;border-collapse:collapse;border:2px;width:100%;font-family:Verdana,Tahoma,Helvetica,Arial;font-size:clamp(0.6875rem,-0.6667rem + 3.3333vw,0.75rem);}
.tab td{padding:3px;width:400px;}
.tab.scroll{display:block;max-height:290px;overflow-y:scroll;}
.miesta{width:100%;text-align:center;font-size:clamp(0.625rem,0.4688rem + 0.5vw,0.75rem);font-weight:bold;font-family:arial,sans-serif;color:black;display:inline-flex;}
.bar-0{background:#F7F7D4;}
.bar-1{background:#FEFE33;}
.bar-2{background:#B2D732;}
.bar-3{background:#66B032;}
.bar-4{background:#1B3409;color:#ffffff;}
.bar-5{background:#092834;color:#ffffff;}
table{border:0;width:100%;border-collapse:collapse;}
.L{text-align:left;}
.C{text-align:center;}
.R{text-align:right;}
.pokdet{
    cursor:pointer;
}


/* -------------- básne --------------- */

.basne{background:#f5deb3;background-image:radial-gradient(circle at 50% 50%,rgba(255,255,255,0.4) 0%,rgba(210,180,140,0.3) 100%),repeating-linear-gradient(0deg,rgba(255,255,255,0.1),rgba(255,255,255,0.1) 1px,transparent 1px,transparent 4px);color:#2b1e10;border-radius:var(--radius);padding:2rem;border:1px solid rgba(0,0,0,0.1);box-shadow:inset 0 0 20px rgba(0,0,0,0.2),0 4px 25px rgba(0,0,0,0.4);font-family:"Kalam",cursive;overflow:hidden;opacity:1;text-align:center;transition:opacity 0.6s ease;animation:mymove 1s infinite;user-select:none;}
.poezia img{width:100px;position:absolute;right:5px;top:5px;}



@keyframes mymove{50%{height:50%;}}

.poem-title{font-size:2rem;margin:0 0 0.35rem 0;color:#3b2b15;}
.poem-meta{color:#5a4632;font-size:0.85rem;margin-bottom:1rem}
.poem-body{white-space:pre-wrap;font-size:calc(1rem + .4vw);line-height:1.9;letter-spacing:0.2px;min-height:4rem;}
.line{opacity:0;transform:translateY(10px);transition:opacity 0.6s ease, transform 0.6s ease;}
.line.visible{opacity:1;transform:translateY(0);}
.line.visible:nth-child(1)::first-letter{color:red;font-size:150%;font-weight:bolder;}
.empty-line{height:1.2em;}
.wrap{max-width:var(--max-width);border-radius:var(--radius);margin:0 auto;display:flex;flex-direction:column;gap:1rem;box-shadow:0 6px 30px rgba(2,6,12,0.6);border:1px solid rgba(255,255,255,0.03);background:#0f1620;}
.brand{display:grid;gap:1rem;align-items:center;margin:10px;font-size:1.4rem;color:#e7eef6;text-align:center;}
p.lead{color:var(--muted);font-size:0.95rem}
nav{background:var(--bg-3);border:var(--border);border-radius:var(--radius-chip);padding:0.75rem;display:flex;flex-wrap:wrap;gap:0.5rem;justify-content:space-evenly;}
nav button{border:0;color:#e7eef6;padding:0.5rem 0.75rem;border-radius:5px;cursor:pointer;background:var(--bg-3);width:100%;max-width:130px;}
nav button::before{content:"📜";margin-right:10px;}
nav button:hover{background:rgba(255,255,255,0.05);color:antiquewhite;}
.poezia{font-family:"Kalam",cursive;color:antiquewhite;}



/* -------------- Rainmeter --------------- */


.rain_header {
	background: var(--bg-2);
	border-radius: var(--radius);
	padding: 0px 22px 10px;
	position: relative;
	box-shadow: 0 6px 30px rgba(2,6,12,0.6);
	border: 1px solid rgba(255,255,255,0.03);
	margin: 0 4px;
}
.logo {
	height: 40px;
	margin: 15px;
	position: absolute;
	right: 0px;
	top: 0px;
    cursor:pointer;
}




.rain{flex-direction:column;}
.thumb{width:100%;overflow:hidden;flex:0 0 auto;filter:drop-shadow(2px 3px 6px #000000);height:150px;}
.thumb img{display:block;width:100%;object-fit:cover;border-radius:8px;}
.title{font-weight:600;margin:0 0 6px;font-size:1.05rem}
.info-line{display:flex;color: var(--color-highlight);font-size:0.8rem;margin-bottom:8px;background:#0d1e26a6;justify-content:space-between;}
.desc{color:var(--muted);font-size:0.95rem;margin:0 0 12px;flex:1 1 auto}
.actions{display:flex;align-items:center;justify-content:space-between;}
.left-actions{display:flex;gap:8px;align-items:center;}
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.8);display:none;align-items:center;justify-content:center;z-index:1000;}
.modal{padding:20px;border-radius:12px;max-width:600px;width:90%;color:#fff;box-shadow:0 0 25px rgba(0,0,0,0.8);text-align:center;backdrop-filter:blur(15px);border: 2px solid #10acda;;}
.modal img{max-width:100%;border-radius:8px;margin-bottom:12px;}
.modal h2{margin:0 0 10px;}
.modal .info-line{display:flex;gap:20px;color: var(--color-highlight);font-size:0.85rem;justify-content:center;margin-bottom:10px;}
.modal p{color:var(--muted);font-size:0.95rem;margin-bottom:16px;}
.close-btn{background:var(--accent);border:none;padding:8px 14px;border-radius:8px;color:#001;font-weight:600;cursor:pointer;}
.grid.rain{grid-template-columns:repeat(auto-fit,minmax(250px,2fr));justify-content:space-around;}
.image-placeholder{object-fit:contain !important;background-color:#374151;}

.info-line span{color: var(--accent);}
.close-btn:active{transform:scale(0.95);}
.close-btn:hover{box-shadow: 0px 0px 5px 1px var(--color-accent);}

/* -------------- Galéria --------------- */



:root{--sirka:152px;--vyska:114px;--pocet:5;--ss:calc(var(--sirka) * var(--pocet) + (var(--pocet) * 20px));}
.button img{max-width:var(--sirka);height:var(--vyska);border:0px solid #242424;border-radius:5px;box-shadow:5px 5px 6px rgba(0,0,0,0.7);object-fit:cover;}
a{color:white;display:contents;}
.header H1::first-letter{color:#F2F0C1;}
.header H1{margin:5px 0;}
.dlazdice{display:flex;flex-wrap:wrap;justify-content: space-around;background:var(--bg-3);flex-direction:row;border-radius: var(--radius);}
.dlazdice .nadpis{font-family:"Kalam",cursive;font-size:2rem;border-top-left-radius:var(--radius);text-align:center;background:var(--panel);border-top-right-radius:var(--radius);box-shadow:0px 13px 14px -6px #23ADFF;background-image:url('../Obrazky/pozadie.png');background-repeat:no-repeat;background-size:cover;background-position:center;}
.dlazdice .nadpis::first-letter{color:#F2F0C1;}
.footer{color:#777;text-align:center;border-top:1px solid grey;width:100%;font-family:monospace;color:#C0C0C0;font-size:small;margin-top:10px;padding:10px 0;}
.header{text-align:center;border:var(--border);position:sticky;top:0;background-color:rgba(0,0,0,0.8);border-radius:5px;z-index:99;box-shadow:3px 3px 20px 1px rgba(35,173,278,1);width:100%;margin-bottom:20px;}
.button{border:var(--border);position:relative;width:var(--sirka);margin:10px auto;transition:transform 0.2s;    overflow:hidden;}
.button:hover{background-position:right center;background-size:200% auto;-webkit-animation:pulse 2s infinite;animation:pulse512 1.5s infinite;transform:scale(1.1);}
.popisok{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:rgba(0,0,0,0.4);width:var(--sirka);text-align:center;border:1px solid black;}
.topright{position:absolute;top:8px;right:8px;font-size:12px;background-color:rgba(0,0,0,0.4);padding:3px;}
.topleft{position:absolute;top:8px;left:8px;font-size:12px;background-color:rgba(0,0,0,0.4);padding:3px;}
.clearfix:after{content:"";display:table;clear:both;}

/* -------------- Recept --------------- */

.recept_header{text-align:center;padding-top:5px;background:var(--bg-2);border-radius:var(--radius);font-family:"Kalam",cursive;}
.image-container{width:95%;height:350px;border-radius:12px;margin:0 auto 20px auto;box-shadow:0 15px 30px rgba(0,0,0,0.7),0 0 0 6px var(--color-accent);position:relative;overflow:hidden;cursor:pointer;transition:box-shadow 0.3s ease;perspective:1000px;}
.image-content{width:100%;height:100%;background-color:transparent;background-image:url('../Obrazky/susterica.jpg');background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:12px;transform:rotate(0deg) scale(1.0) skewY(0deg) translateZ(0);transition:transform 0.4s cubic-bezier(0.25,0.46,0.45,0.94);}
.image-container:hover{transform:none;box-shadow:0 20px 40px rgba(0,0,0,0.9),0 0 0 6px var(--color-accent);}
.image-container:hover .image-content{transform:scale(1.5) rotate(10deg) skewY(-5deg) translateZ(300px);}
.image-container:hover .image-overlay{opacity:0;transition:opacity 0.4s ease-out;}
.intro-text{font-style:italic;color:var(--color-text-secondary);padding:0 10px;font-size:clamp(0.875rem,0.5625rem + 1vw,1.125rem);text-align:center;}
.section{background:var(--bg-3);padding:30px;border-radius:8px;margin:5px;box-shadow:var(--shadow-subtle);transition:transform 0.2s ease;}
.section:hover{box-shadow:0 8px 15px rgba(0,0,0,0.6);}
.section-header-flex{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px;}
.large-time-stat{font-size:1rem;padding:6px 12px;margin-bottom:0;}
.full-width-divider{height:2px;background-color:var(--color-accent);margin-bottom:20px;}
.ingredients-list{list-style:none;font-size:clamp(0.75rem,0.5156rem + 0.75vw,0.9375rem);}
.instructions{background:var(--card);}
.ingredients-list li{padding:12px 15px;border-bottom:none;display:flex;align-items:center;cursor:pointer;transition:background-color 0.2s ease;background-color:var(--color-bg-secondary);}
.ingredients-list li:nth-child(odd){background-color:var(--color-bg-tertiary);}
.ingredients-list li:hover{background-color:#252525;}
.ingredients-list li.checked{background-color:rgba(56,161,105,0.15) !important;}
.ingredients-list li.checked .ingredient-name{text-decoration:none;color:var(--color-text-primary);opacity:1;transition:all 0.3s ease;}
.ingredient-checkbox{display:none;}
.ingredient-name{font-weight:500;flex-grow:1;}
.amount{color:var(--color-accent);font-weight:600;min-width:60px;text-align:right;margin-right:15px;transition:color 0.3s ease,opacity 0.3s ease;}
.checked-indicator{width:20px;height:20px;background-color:var(--color-accent);border-radius:50%;display:none;align-items:center;justify-content:center;color:var(--color-bg-primary);font-weight:900;font-size:1.2rem;flex-shrink:0;}
.ingredients-list li.checked .checked-indicator{display:flex;}
.ingredients-list li.checked .amount{color:var(--color-text-secondary);opacity:0.8;}
.instructions ol{list-style:none;counter-reset:step-counter;}
.instructions li{margin-bottom:25px;padding-left:50px;position:relative;counter-increment:step-counter;}
.instructions li::before{content:counter(step-counter);position:absolute;left:0;top:0;width:30px;height:30px;background-color:var(--color-accent);color:var(--color-bg-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:bold;font-size:1.1rem;}
.step-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;flex-wrap:wrap;gap:10px;}
.step-title{font-weight:700;color:var(--color-accent);font-size:1.1rem;margin:0;display:inline-block;}
.step-time{display:inline-flex;align-items:center;background-color:rgba(255,255,255,0.1);padding:4px 10px;border-radius:12px;font-size:0.85rem;color:var(--color-text-secondary);font-weight:500;}
.step-time .material-symbols-outlined{font-variation-settings:'FILL' 0,'wght' 600,'GRAD' 0,'opsz' 24;margin:0 6px;color:var(--color-accent);font-size:1.2em;}
.step-description{color:var(--color-text-primary);margin:0;text-align:justify;line-height:1.6;font-size:clamp(0.75rem,0.5156rem + 0.75vw,0.9375rem);}
.instructions .highlight-instruction{color:var(--color-highlight);font-weight:700;background:rgba(255,195,0,0.1);padding:2px 4px;border-radius:4px;}
.step-hint{display:block;margin-top:8px;font-size:0.9rem;color:var(--color-text-secondary);font-style:italic;background:rgba(7,7,7,0.34);padding:5px;text-align:justify;line-height:1.6;}
.final-greeting{text-align:right;font-size:1.6rem;font-weight:700;color:var(--color-accent);margin-top:30px;letter-spacing:2px;font-family:"Kalam",cursive;}
.footer-actions{display:flex;justify-content:space-between;align-items:first baseline;margin-top:30px;border-top:2px dashed var(--color-border);flex-wrap:wrap;gap:20px;}
.prt:hover{color:var(--bg);box-shadow:0px 0px 5px 1px var(--color-accent);}
.prt:active{transform:scale(0.95);}
.prt{background:var(--color-accent);color:var(--color-bg-primary);border:none;padding:5px 10px;border-radius:6px;font-weight:700;cursor:pointer;transition:background-color 0.2s ease,transform 0.1s ease;display:flex;align-items:center;gap:10px;}
/*.prt::before{content:"🖨";margin-right:10px;font-size:1.5rem;}    */






/* --- nastavenie stránky pe tlač --- */
@media print {
@page{size:A4 portrait;}
#button,footer,.side-nav,.under,.image-container,.download,.prt,.ingredients-list li.checked .checked-indicator{display:none;}
*{padding:0 !important;margin:0 !important;color:black !important;box-shadow:none !important;line-height:normal;}
.step-title{padding-left:50px !important;}
.instructions li{padding-bottom:20px !important;}
.ingredients-list li{display:contents !important;justify-items:center;border-right:1px solid black !important;}
.ingredients-list li::after{content:" | ";}
.footer-actions{justify-content:end;}
}





/* --- 2. Responzívny Dizajn (Media Query) pre Menšie Obrazovky --- */

@media screen and (max-width:650px){
.container{flex-direction:column;grid-template-columns:1fr}
.side-nav{width:100%;padding:15px;display:flex;justify-content:space-between;align-items:center;margin:auto;position:sticky;top:0;z-index:10;background:#000c;backdrop-filter:blur(10px);}
.hamb-logo{display:block;color:#66CCFF;font-family:Verdana;font-size:calc(1rem + 1vw);text-shadow:0 0 5px #66CCFF,0 0 10px #66CCFF,0 0 20px #66CCFF,0 0 40px #66CCFF,0 0 80px #66CCFF;}
.nav-links{width:150px;text-align:center;position:absolute;top:60px;left:-100%;background-color:#000000b5;z-index:999;transition:.5s;margin:0 0 0 10px;}
.nav-links.active{display:block;left:0px;padding:0 15px 10px 0;}
#odometer,.cas,.kalendar,.readers,.upd,.loga{display:none;}
.sidebar{margin:0 0 10px 0;}
.nadpis{top:70px;margin:0 0 20px 0;}
.hamburger-menu{display:block;user-select:none;-webkit-user-select:none;transition:transform 220ms ease,color 180ms ease;}
.hamburger-menu.open{color:#ff3b30;font-weight:800;transform:rotate(-90deg) scale(1.05);}
.main{padding:0px;}
.basne{padding:1rem 0;}
.pocitadlo{display:block;}
header{flex-direction:column;align-items:flex-start;gap:8px;}
.thumb img{height:130px;}
.card:hover{transform:none;}
.links{flex-direction:column;gap:8px;}
.logo{height:25px;position:absolute;width:19px;object-fit:cover;object-position:0;margin-top:25px;}
.avatar{display:flex;  justify-content:center;}
.switch{top:22px;position:fixed;bottom:unset;z-index:20;margin-left:50px;}
.poezia img{width:60px;position:absolute;}
.section{padding:10px;}
.section-header-flex{flex-direction:column;align-items:center;gap:5px;}
.instructions li{padding-left:1px;}
.step-header{margin-left:40px;}
.instructions li::before{width:28px;height:28px;font-size:1rem;}
.image-container{height:180px;}
.image-container:hover .image-content{transform:scale(2.2);}
.checked-indicator{width:20px;height:20px;}
.final-greeting{text-align:center;}
.prt span:nth-last-child(1){display:none;}












/* hide some menu */


/*    dočasné odstavenie menu
.tlačítko:nth-child(n+6):nth-child(-n+9) {
  display:none;
}
.tlačítko:nth-child(n+11):nth-child(-n+12) {
  display:none;
}
*/


}