/* Vložená data */
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,200;0,400;0,600;0,900;1,200;1,400;1,600;1,900&display=swap');

/* Blokace posuvu stránky po dobu načítání */
html.preloader-lock, html.preloader-lock body { overflow: hidden;}

/* Vlastní vrstva preloaderu */
#preloader { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 9999; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; overflow: hidden; text-align: left; font-family: 'Nunito Sans', sans-serif; background: #171c2c; opacity: 1; visibility: visible; transition: opacity .6s ease-in-out, visibility .6s ease-in-out; animation: preloader-pojistka .6s ease-in-out 10s forwards;}
/* Běží skript - o skrytí vrstvy rozhoduje script.js, nouzová animace se vypíná */
html.js-preloader #preloader { animation: none;}
/* Načteno - odchod vrstvy */
#preloader.preloader-hidden { opacity: 0; visibility: hidden; pointer-events: none;}

/* Grafika v pozadí / stejný motiv jako homepage */
.preloader-creativita { width: 55%; height: 153px; position: absolute; top: 60px; right: -30px; opacity: .10; background: url('../themes/creativita.fw.png') right top no-repeat; background-size: auto 153px;}
.preloader-airbrush { width: 728px; height: 140px; position: absolute; bottom: 0; left: -40px; opacity: .12; background: url('../themes/airbrush.fw.png') bottom left no-repeat; background-size: auto 140px;}

/* Střed vrstvy / logo + průběh načítání */
.preloader-box { width: 280px; height: auto; position: relative; z-index: 10; display: flex; flex-wrap: wrap; justify-content: center; transition: opacity .35s ease-in-out, transform .35s ease-in-out;}
#preloader.preloader-hidden .preloader-box { opacity: 0; transform: translateY(-20px);}

/* Logo projektu */
.preloader-logo { width: 248px; height: 60px; margin: 0 0 30px 0; background: url('../themes/logo.fw.png') top no-repeat; background-size: cover; animation: preloader-puls 1.8s ease-in-out infinite;}

/* Ukazatel průběhu */
.preloader-bar { width: 280px; height: 3px; margin: 0 0 14px 0; overflow: hidden; background: rgba(255,255,255,.15);}
.preloader-bar-fill { width: 0%; height: 3px; background: #D8233C; transition: width .25s ease-out;}

/* Popis stavu */
.preloader-info { width: 280px; height: 20px; display: flex; flex-wrap: wrap; align-content: center; justify-content: space-between; font-size: 13px; letter-spacing: 2px;}
.preloader-text { color: rgba(255,255,255,.4); font-weight: 600;}
.preloader-percent { color: #fff; font-weight: 900;}

/* Rozhraní pro smartphone + mobil */
@media screen and (max-width: 767px) {
    .preloader-creativita { width: 65%; height: 60px; top: 40px; right: -20px; background-size: auto 60px;}
    .preloader-airbrush { width: 364px; height: 70px; left: -20px; background-size: auto 70px;}

    .preloader-box, .preloader-bar, .preloader-info { width: 220px;}
    .preloader-logo { width: 186px; height: 45px; margin: 0 0 24px 0;}
    .preloader-info { font-size: 12px; letter-spacing: 1px;}
}

/* Omezené animace dle nastavení systému */
@media (prefers-reduced-motion: reduce) {
    .preloader-logo { animation: none;}
    #preloader, .preloader-box, .preloader-bar-fill { transition-duration: .1s;}
}

@keyframes preloader-puls {
    0%, 100% { opacity: 1;}
    50% { opacity: .45;}
}

/* Pojistka pro případ nedostupného script.js */
@keyframes preloader-pojistka {
    to { opacity: 0; visibility: hidden;}
}
