@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');

:root {

    --gray0: #f8f9fa;
    --gray1: #f1f3f5;
    --gray2: #e9ecef;
    --gray3: #dee2e6;
    --gray4: #ced4da;
    --gray5: #adb5bd;
    --gray6: #868e96;
    --gray7: #495057;
    --gray8: #343a40;
    --gray9: #212529;
    --gray10: #1d2124;
    --gray11: #191c1f;
    --gray12: #15181a;
    --gray13: #111315;
    --gray14: #0e1011;
    --gray15: #0b0c0d;
    --gray16: #08090a;
    --gray17: #060607;
    --gray18: #030404;
    --gray19: #020202;

    --red0: #fff5f5;
    --red1: #ffe3e3;
    --red2: #ffc9c9;
    --red3: #ffa8a8;
    --red4: #ff8787;
    --red5: #ff6b6b;
    --red6: #fa5252;
    --red7: #f03e3e;
    --red8: #e03131;
    --red9: #c92a2a;
    --red10: #b12525;
    --red11: #992020;
    --red12: #811b1b;
    --red13: #691616;
    --red14: #541212;
    --red15: #400d0d;
    --red16: #300a0a;
    --red17: #220707;
    --red18: #140404;
    --red19: #0c0303;


    --pink0: #fff0f6;
    --pink1: #ffdeeb;
    --pink2: #fcc2d7;
    --pink3: #faa2c1;
    --pink4: #f783ac;
    --pink5: #f06595;
    --pink6: #e64980;
    --pink7: #d6336c;
    --pink8: #c2255c;
    --pink9: #a61e4d;
    --pink10: #921a44;
    --pink11: #7e173b;
    --pink12: #6a1331;
    --pink13: #561028;
    --pink14: #460d20;
    --pink15: #350a19;
    --pink16: #280712;
    --pink17: #1c050d;
    --pink18: #110308;
    --pink19: #0a0205;

    --grape0: #f8f0fc;
    --grape1: #f3d9fa;
    --grape2: #eebefa;
    --grape3: #e599f7;
    --grape4: #da77f2;
    --grape5: #cc5de8;
    --grape6: #be4bdb;
    --grape7: #ae3ec9;
    --grape8: #9c36b5;
    --grape9: #862e9c;
    --grape10: #762889;
    --grape11: #662377;
    --grape12: #561d64;
    --grape13: #461851;
    --grape14: #381342;
    --grape15: #2b0f32;
    --grape16: #200b25;
    --grape17: #17081b;
    --grape18: #0d0510;
    --grape19: #080309;

    --violet0: #f3f0ff;
    --violet1: #e5dbff;
    --violet2: #d0bfff;
    --violet3: #b197fc;
    --violet4: #9775fa;
    --violet5: #845ef7;
    --violet6: #7950f2;
    --violet7: #7048e8;
    --violet8: #6741d9;
    --violet9: #5f3dc4;
    --violet10: #5436ac;
    --violet11: #482e95;
    --violet12: #3d277d;
    --violet13: #312066;
    --violet14: #281a52;
    --violet15: #1e143f;
    --violet16: #170f2f;
    --violet17: #100a21;
    --violet18: #0a0614;
    --violet19: #06040c;


    --indigo0: #edf2ff;
    --indigo1: #dbe4ff;
    --indigo2: #bac8ff;
    --indigo3: #91a7ff;
    --indigo4: #748ffc;
    --indigo5: #5c7cfa;
    --indigo6: #4c6ef5;
    --indigo7: #4263eb;
    --indigo8: #3b5bdb;
    --indigo9: #364fc7;
    --indigo10: #3046af;
    --indigo11: #293c97;
    --indigo12: #23337f;
    --indigo13: #1c2967;
    --indigo14: #172154;
    --indigo15: #111940;
    --indigo16: #0d1330;
    --indigo17: #090d22;
    --indigo18: #050814;
    --indigo19: #03050c;

    --blue0: #e7f5ff;
    --blue1: #d0ebff;
    --blue2: #a5d8ff;
    --blue3: #74c0fc;
    --blue4: #4dabf7;
    --blue5: #339af0;
    --blue6: #228be6;
    --blue7: #1c7ed6;
    --blue8: #1971c2;
    --blue9: #1864ab;
    --blue10: #155896;
    --blue11: #124c82;
    --blue12: #0f406d;
    --blue13: #0c3459;
    --blue14: #0a2a48;
    --blue15: #082037;
    --blue16: #061829;
    --blue17: #04111d;
    --blue18: #020a11;
    --blue19: #01060a;

    --cyan0: #e3fafc;
    --cyan1: #c5f6fa;
    --cyan2: #99e9f2;
    --cyan3: #66d9e8;
    --cyan4: #3bc9db;
    --cyan5: #22b8cf;
    --cyan6: #15aabf;
    --cyan7: #1098ad;
    --cyan8: #0c8599;
    --cyan9: #0b7285;
    --cyan10: #0a6475;
    --cyan11: #085765;
    --cyan12: #074955;
    --cyan13: #063b45;
    --cyan14: #053038;
    --cyan15: #04242b;
    --cyan16: #031b20;
    --cyan17: #021317;
    --cyan18: #010b0d;
    --cyan19: #010708;

    --teal0: #e6fcf5;
    --teal1: #c3fae8;
    --teal2: #96f2d7;
    --teal3: #63e6be;
    --teal4: #38d9a9;
    --teal5: #20c997;
    --teal6: #12b886;
    --teal7: #0ca678;
    --teal8: #099268;
    --teal9: #087f5b;
    --teal10: #077050;
    --teal11: #066145;
    --teal12: #05513a;
    --teal13: #04422f;
    --teal14: #033526;
    --teal15: #03291d;
    --teal16: #021e16;
    --teal17: #01160f;
    --teal18: #010d09;
    --teal19: #000805;

    --green0: #ebfbee;
    --green1: #d3f9d8;
    --green2: #b2f2bb;
    --green3: #8ce99a;
    --green4: #69db7c;
    --green5: #51cf66;
    --green6: #40c057;
    --green7: #37b24d;
    --green8: #2f9e44;
    --green9: #2b8a3e;
    --green10: #267937;
    --green11: #21692f;
    --green12: #1c5828;
    --green13: #164820;
    --green14: #123a1a;
    --green15: #0e2c14;
    --green16: #0a210f;
    --green17: #07170b;
    --green18: #040e06;
    --green19: #030804;

    --lime0: #f4fce3;
    --lime1: #e9fac8;
    --lime2: #d8f5a2;
    --lime3: #c0eb75;
    --lime4: #a9e34b;
    --lime5: #94d82d;
    --lime6: #82c91e;
    --lime7: #74b816;
    --lime8: #66a80f;
    --lime9: #5c940d;
    --lime10: #51820b;
    --lime11: #46700a;
    --lime12: #3b5f08;
    --lime13: #304d07;
    --lime14: #273e05;
    --lime15: #1d2f04;
    --lime16: #162403;
    --lime17: #101902;
    --lime18: #090f01;
    --lime19: #060901;

    --yellow0: #fff9db;
    --yellow1: #fff3bf;
    --yellow2: #ffec99;
    --yellow3: #ffe066;
    --yellow4: #ffd43b;
    --yellow5: #fcc419;
    --yellow6: #fab005;
    --yellow7: #f59f00;
    --yellow8: #f08c00;
    --yellow9: #e67700;
    --yellow10: #ca6900;
    --yellow11: #af5a00;
    --yellow12: #934c00;
    --yellow13: #783e00;
    --yellow14: #613200;
    --yellow15: #4a2600;
    --yellow16: #371d00;
    --yellow17: #271400;
    --yellow18: #170c00;
    --yellow19: #0e0700;

    --orange0: #fff4e6;
    --orange1: #ffe8cc;
    --orange2: #ffd8a8;
    --orange3: #ffc078;
    --orange4: #ffa94d;
    --orange5: #ff922b;
    --orange6: #fd7e14;
    --orange7: #f76707;
    --orange8: #e8590c;
    --orange9: #d9480f;
    --orange10: #bf3f0d;
    --orange11: #a5370b;
    --orange12: #8b2e0a;
    --orange13: #712508;
    --orange14: #5b1e06;
    --orange15: #451705;
    --orange16: #341104;
    --orange17: #250c03;
    --orange18: #160702;
    --orange19: #0d0401;

    --brown0: #f8f1e9;
    --brown1: #f1dfcf;
    --brown2: #e3c3a7;
    --brown3: #d2a077;
    --brown4: #bd7d4f;
    --brown5: #a1622f;
    --brown6: #8a4f26;
    --brown7: #70401f;
    --brown8: #5a3319;
    --brown9: #472814;
    --brown10: #3e2312;
    --brown11: #361e0f;
    --brown12: #2d1a0d;
    --brown13: #25150a;
    --brown14: #1e1108;
    --brown15: #170d06;
    --brown16: #110a05;
    --brown17: #0c0703;
    --brown18: #070402;
    --brown19: #040201;

    --gray: #808080;
    --red: #ff0000;
    --pink: #ff1493;
    --grape: #cc00ff;
    --violet: #8000ff;
    --indigo: #4b0082;
    --blue: #0000ff;
    --cyan: #00ffff;
    --teal: #008080;
    --green: #00c853;
    --lime: #80ff00;
    --yellow: #ffff00;
    --orange: #ff8000;
    --brown: #8b4513;
    --white: #ffffff;
    --black: #000000;


    --barva-bila: var(--white);
    --barva-cerna: var(--black);
    --barva-transparentni: rgb(from var(--white) r g b / 0%);

    --barva-pozadi: var(--white);
    --barva-panel: var(--indigo0);
    --barva-pole-pozadi: var(--white);
    --barva-okraj-pozadi: var(--gray0);
    --barva-karta-pozadi: var(--white);
    --barva-karta-pozadi-tlumena: var(--gray0);

    --barva-text: var(--gray9);
    --barva-text-tlumeny: var(--gray7);
    --barva-text-svetly: var(--white);
    --barva-text-ikona: var(--gray13);

    --barva-primarni: var(--blue9);
    --barva-primarni-hover: var(--cyan9);

    --barva-link: var(--blue8);

    --barva-nadpis-text-modra: var(--blue8);
    --barva-nadpis-pozadi-modra: var(--blue0);
    --barva-nadpis-text-zelena: var(--green9);
    --barva-nadpis-pozadi-zelena: var(--green0);
    --barva-nadpis-text-oranzova: var(--orange8);
    --barva-nadpis-pozadi-oranzova: var(--orange0);
    --barva-nadpis-text-seda: var(--gray8);
    --barva-nadpis-pozadi-seda: var(--gray0);
    --barva-nadpis-text-zluta: var(--yellow9);
    --barva-nadpis-pozadi-zluta: var(--yellow0);

    --barva-data: var(--barva-nadpis-text-modra);
    --barva-data-podklad: var(--barva-nadpis-pozadi-modra);

    --barva-sestavy: var(--barva-nadpis-text-zelena);
    --barva-sestavy-podklad: var(--barva-nadpis-pozadi-zelena);

    --barva-nastaveni: var(--barva-nadpis-text-oranzova);
    --barva-nastaveni-podklad: var(--barva-nadpis-pozadi-oranzova);

    --barva-neutral: var(--barva-nadpis-text-seda);
    --barva-neutral-podklad: var(--barva-nadpis-pozadi-seda);

    --barva-okraj-blok-text: var(--gray6);
    --barva-okraj-menu-pozadi: var(--indigo14);
    --barva-okraj-menu-text: var(--white);
    --barva-okraj-menu-hover-pozadi: var(--indigo16);
    --barva-okraj-menu-hover-text: var(--white);
    --barva-okraj-menu-linka: var(--indigo1);

    --barva-ohraniceni: var(--gray4);
    --barva-ohraniceni-jemne: var(--gray2);
    --barva-ohraniceni-svetle: var(--blue1);
    --barva-ohraniceni-tabulka: var(--gray2);
    --barva-ohraniceni-terminal: var(--gray6);

    --barva-volba-pozadi: var(--white);
    --barva-volba-hover-pozadi: var(--blue1);
    --barva-volba-sub-hover-pozadi: var(--gray1);
    --barva-volba-sipka: var(--gray6);

    --barva-form-label: var(--orange7);
    --barva-form-border: var(--gray4);
    --barva-radek-hover: var(--gray0);

    --barva-editor-overlay: rgb(from var(--gray5) r g b / 50%);
    --barva-editor-karta-pozadi: var(--blue0);
    --barva-editor-modal-overlay: rgb(from var(--gray3) r g b / 60%);
    --barva-editor-zavrit: var(--gray7);

    --barva-dialog-pozadi: var(--white);
    --barva-dialog-border: var(--blue1);
    --barva-dialog-primary-pozadi: var(--blue7);
    --barva-dialog-primary-text: var(--white);
    --barva-dialog-error-pozadi: var(--red1);
    --barva-dialog-error-text: var(--red10);
    --barva-dialog-success-pozadi: var(--green1);
    --barva-dialog-success-text: var(--green10);
    --barva-dialog-warning-pozadi: var(--yellow0);
    --barva-dialog-warning-text: var(--yellow10);
    --barva-dialog-question-pozadi: var(--blue0);
    --barva-dialog-question-text: var(--blue7);
    --barva-dialog-text-tlumeny: var(--gray7);

    --barva-report-hlavicka-pozadi: var(--blue0);
    --barva-report-ok-pozadi: var(--green0);
    --barva-report-warning-pozadi: var(--yellow0);
    --barva-report-error-pozadi: var(--red0);
    --barva-report-prazdny-text: var(--gray7);

    --barva-info-pozadi: var(--white);
    --barva-info-border: var(--blue1);
    --barva-info-akcent: var(--blue7);
    --barva-info-zavrit: var(--gray7);

    --barva-naseptavac-pozadi: var(--white);
    --barva-naseptavac-caption-pozadi: var(--gray6);
    --barva-naseptavac-caption-text: var(--white);
    --barva-naseptavac-vybrano-pozadi: var(--blue3);
    --barva-naseptavac-ikona-pozadi: var(--gray0);
    --barva-naseptavac-ikona-hover-pozadi: var(--gray2);

    --barva-login-pozadi: var(--blue2);
    --barva-login-okraj: rgb(from var(--white) r g b / 45%);
    --barva-login-layout-pozadi: rgb(from var(--white) r g b / 33%);
    --barva-login-text: var(--white);
    --barva-login-input-okraj: rgb(from var(--white) r g b / 75%);
    --barva-login-focus-stin: rgb(from var(--white) r g b / 10%);
    --barva-login-button-pozadi: var(--white);
    --barva-login-button-text: var(--indigo6);
    --barva-login-button-stin: rgb(from var(--white) r g b / 18%);
    --barva-login-side-pozadi: rgb(from var(--white) r g b / 72%);
    --barva-login-brand: var(--cyan1);

    --barva-terminal-text-tlumeny: var(--gray6);
    --barva-terminal-text: var(--gray8);
    --barva-terminal-akcent: var(--cyan7);
    --barva-terminal-pozadi-svetle: var(--gray1);
    --barva-terminal-pozadi-tlumene: var(--gray1);
    --barva-terminal-modra: var(--blue6);
    --barva-terminal-cervena: var(--red9);
    --barva-terminal-zelena: var(--green5);
    --barva-terminal-zelena-text: var(--green8);
    --barva-terminal-tlacitko-modre: var(--blue6);
    --barva-terminal-hlavicka: var(--gray8);
    --barva-terminal-seda: var(--gray2);

    --barva-scrollbar-posuvnik: var(--gray2);
    --barva-scrollbar-posuvnik-hover: var(--gray5);

    --barva-stin-panel: rgb(from var(--blue12) r g b / 10%);
    --barva-stin-tlacitko: rgb(from var(--blue12) r g b / 12%);
    --barva-stin-tlacitko-hover: rgb(from var(--blue12) r g b / 18%);
    --barva-stin-vyrazny: rgb(from var(--black) r g b / 20%);
    --barva-stin-info: rgb(from var(--black) r g b / 14%);

    --stin-panel: 0 6px 18px var(--barva-stin-panel);
    --stin-tlacitko: 0 3px 10px var(--barva-stin-tlacitko);
    --stin-tlacitko-hover: 0 5px 14px var(--barva-stin-tlacitko-hover);
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: "Poppins", sans-serif;
    font-size: 13px;
    font-weight: 400;
}

html,
body {
    height: 100%;
    overflow-x: hidden;
}

body.app {
    margin: 0;
    height: 100vh;
    overflow: hidden;
    background: var(--barva-pozadi);
    color: var(--barva-text);
}

.cekacka {
    display: none;
    position: fixed;
    inset: 25%;
    z-index: 5000;
    opacity: 0.75;
    background-color: var(--gray19);
    background-image: url("../Img/nacitani.gif");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.cekacka--zobrazena {
    display: block;
}

* {
    scrollbar-color: var(--barva-scrollbar-posuvnik) auto;
}

*::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

*::-webkit-scrollbar-thumb:not(:hover) {
    background-color: var(--barva-scrollbar-posuvnik);
}

*::-webkit-scrollbar-thumb:hover {
    background-color: var(--barva-scrollbar-posuvnik-hover);
}

h1 {
    flex: 0 0 100%;
    margin: 0 -20px 0 -20px;
    padding: 25px 20px 10px 20px;
    font-size: 28px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--barva-text);
}

h2 {
    min-height: 42px;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0 20px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--barva-primarni);
    background: var(--barva-nadpis-pozadi-modra);
}

h3 {
    margin: 16px 20px 8px 20px;
    font-size: 14px;
    font-weight: 600;
    color: var(--barva-text);
}

h4 {
    margin: 12px 20px 6px 20px;
    font-size: 13px;
    font-weight: 500;
    color: var(--barva-text-tlumeny);
}

h5 {
    font-size: 12px;
    font-weight: 400;
}

h6 {
    font-size: 10px;
    font-weight: 400;
}