:root {
    --essens-lblue: #009EDF;
    --essens-blue: #002e5d;
    --essens-pink: #dc0069;
    --essens-green: #4BE1AB;
    --essens-einfo: #17a2b8;
    --essens-bg: #fff;
    --essens-light-blue: #EFF5FA;
    --essens-light-darker-blue: #A3B1C6;

    --bs-essens-blue: 0, 46, 93;
    --bs-essens-light-blue: 239, 245, 250;
    --bs-essens-pink: 220, 0, 105;
    --bs-essens-green: 75, 225, 171;

    --price-type-base: red;
    --price-type-dist: #3c78d8;
    --price-type-dist-temp: #6795e1;
    --price-type-dist-high: #8aaee7;
    --price-type-reg: #e69138;
    --price-type-reg-temp: #ecaa65;
    --price-type-reg-48: #e38421;
    --price-type-reg-high: #e69138;
    --price-type-mem: #a64d79;
    --price-type-mem-temp: #c994ae;
    --price-type-mem-high: #bb6b93;
    --price-type-cb: #dc0069;
    --price-type-pts: #674ea7;
    --price-type-cat: #6aa84f;
    --price-type-buy: #f1c232;
    --price-type-buy-locw: #76a5af;

    --spreadsheets-cell-manual : #ff9900;
    --spreadsheets-cell-select: #f1c232;
    --spreadsheets-cell-auto: #00ffff;
    --spreadsheets-cell-formula: #ff00ff;
    --spreadsheets-cell-btn: #000000;
}

body {
    background-color: var(--essens-light-blue);
    /*font-size: 0.875rem;*/
    font-size: calc(6px + (15 - 7) * ((100vw - 300px) / (1600 - 300))) !important; /* bylo 7px */
    /* calc(minsize + (maxsize - minsize) * (100vm - minviewportwidth) / (maxwidthviewoport - minviewportwidth))) */
    height: 100vh;
    height: 100dvh;
    margin: 0;
}

.einfo {
    color: var(--essens-einfo);
}

div.filter {
    margin-top: 10px;
    background: #212529;
    padding: 10px;
    border-radius: 5px;
    color: white;
}

input, textarea {
    border-radius: 5px;
}

.clickable {
    cursor: pointer;
}

.pointer {
    cursor: pointer;
}

.pointer:hover {
    color: #000000;
}

ul.navbar-nav {
    display: flex;
    align-items: center;
}

li.nav-item .new_loading_list {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
}

@media (max-width: 768px) {
    div.date_block {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
}

.hidden {
    display: none;
}

/* ----- FORMS ----- */
.disabled {
    background-color: #eee;
    cursor: default;
}

/* ----- BACKGROUND ----- */
.bg-indian-red {
    --bs-bg-opacity: 1;
    background-color: rgba(205,92,92, var(--bs-bg-opacity)) !important;
}

.bg-pink {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-essens-pink), var(--bs-bg-opacity)) !important;
}

.bg-light-blue {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-essens-light-blue), var(--bs-bg-opacity)) !important;
}

.bg-blue{
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-essens-blue), var(--bs-bg-opacity)) !important;
}

.bg-green {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-essens-green), var(--bs-bg-opacity)) !important;
}
/* ----- SHADOWS ----- */
.suble-shadow {
    box-shadow: 0 2px 2px rgba(0,0,0,0.1);
}

/* ----- SPOILER ----- */
.spoiler {
    background: #000;
    color: #000;           /* hidden on black initially */
    padding: 0 .5em;
    border-radius: .25em;
    transition: color .15s ease-in-out;
    cursor: pointer;
}
.spoiler:hover,
.spoiler:focus {
    color: #fff;           /* reveal on hover/focus */
}
/* Ensure nested elements follow the reveal color too */
.spoiler * {
    color: inherit !important;
}

/* ----- LINES ----- */
hr {
    margin: 0.5rem 0;
}

/* ----- ICONS ----- */
.image-icon {
    width: 2.5em;
}
.image-grayscale {
    filter: grayscale(100%);
}

/* ----- CONTAINERS ----- */
code {
    /*display: flex;
    flex-wrap: wrap;*/

    color: #000;
    background-color: #e7f0f9;
    border: 1px solid #eaecf0;
    /*padding: 0.5vw;*/
    /*white-space: pre-wrap;*/ /* odskočení */
    /*font-size: 0.7vw;*/
    font-size: 0.9vw;

    align-items: center;
}

code > * {
    background: #e7f0f9;
    padding: 0.5vw;
}

.pre-wrap{
    white-space: pre-wrap; /* odskočení pro <nohtml>*/
}
/*----- Main content -----*/
.main-content-container {
    margin: 1.5em;
    max-width: 100vw;
    flex-grow: 1;
}

.main-content-title {

}

/* ----- Page toolbar ----- */
.page-toolbar-container {
    position: sticky;
    top: 56px; /* fallback */
    z-index: 997;
    padding: 0 1.5rem 0 1.5rem;
    /*padding: 0 .5em;*/
    background: #002e5d;
    opacity: 1;
    color:white;
    border-top: 1px solid gray;
    /*border-bottom: 1px solid white;*/
}

.page-toolbar-breadcrumbs {
    height: 38px;
    line-height:1;
    font-size: 85%;
}

.page-pretender-container {
    position: sticky;
    z-index: 997;
    opacity: 0.75;
    padding: 0 1.5rem 0 1.5rem;
    color: white;
    background: var(--essens-green);
}

.tox-editor-header{
    position: sticky;
    z-index: 996;
    top: 50px;
}

.page-acceptance-info-container-unread, .page-acceptance-info-container-outdated {
    position: sticky;
    top: 96px; /* fallback */
    z-index: 8; /* 998  26.05.2026*/
    opacity: 0.75;
    padding: 0 1.5rem 0 1.5rem;
    border-top: 2px solid #002e5d;
}

.page-acceptance-info-container-unread {
    background: rgb(220, 53, 69);
    color: white;
}

.page-acceptance-info-container-outdated {
    background: rgb(253, 126, 20);
    color: white;
}

.page-toolbar-row {
    height: 2.5rem;
}

.page-toolbar-container .center-title {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.page-toolbar-button {
    color: white !important;
}

.page-toolbar-button:hover {
    color: #dc0069 !important;
}

.breadcrumb-chevron {
    font-size: 0.6rem;
    opacity: 0.7;
}

/* ----- Page title ----- */
.page-title {
    font-weight: bold;
    padding: 1rem;
}

/* ----- Page request ----- */
/* same in main.css */
.page-request-head {
    
}
.page-request-body {
    margin: 2em 0;
}
/* ----- Page footer ----- */
.page-footer-container{
    padding: 1em;
    background: #002e5d;
    opacity: 1;
    color:white;
}

/* ----- Page ----- */
.desc-row {
    margin-top: 1em;
    margin-bottom: 1em;
}