/* CSS Document */
/*@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&display=swap');*/
body::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4); /* tmavý overlay */
    z-index: -1;
}

html, body {
    height: 100%;
}
html {
    font-size: 62.5%;
}

body {
    
    font-family: 'Montserrat', sans-serif;
    /* Apply Montserrat font */
    font-size: 1.2rem;
    background-image: url('../img/servisos.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin: 0px 0px;
    padding: 0px;
    text-align: center;
    background-color: #1F1F1F;

}

.formular {
    width: 108px;
    text-align: left;
}

form#fill table {
    margin: 0 auto;
}

p#vystup {
    font-size: 14px;
}

a {

    text-decoration: none;
}




input,
textarea {
    width: 100%;
    padding: 5px 0px 5px 10px;
    margin: 8px 0;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-size: 14px;
    box-sizing: border-box;
}


input:focus,
textarea:focus {
    border-color: #0077cc;
    outline: none;
}


input.search {
    border: 1px solid #1f1f1f;
    width: 180px;
    height: 20px;
    margin-right: 15px;
}

input[type="checkbox"] {
    width: auto;
    margin-right: 10px;
    width: 20px;
}

.main {
    width: 768px;
    margin: 0px auto;
    text-align: center;
    max-width: 1200px;
    margin: 20px auto;
    background: white;
    border-radius: 6px;

}


.mainAdmin {
    width: 1200px;
    margin: 0px auto;
    text-align: center;
    padding: 0px;
}

.header {
    width: 768px;
    margin: 0px auto;
    height: 154px;
    background-image: url("../img/top.jpg");
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

a {
    text-decoration: none;
    color: #1F1F1F;
}

.obsah {
    width: 768px;
    margin: 0px auto;
    text-align: center;
    padding-top: 0px;
    padding-bottom: 10px;
    background-color: white;
    border-radius: 6px;
    display: inline-block;

}

.obsahAdmin {
    width: 1200px;
    margin: 0px auto;
    text-align: center;
    padding-top: 0px;
    padding-bottom: 10px;
    background-color: white;
    -webkit-border-radius: .6em;
    -moz-border-radius: .6em;
    border-radius: .6em;
    margin-top: 10px;
}



.nadpis {
    background: url("../img/line745px.png") no-repeat scroll left bottom transparent;
    padding-top: 10px;
    font-size: 1.2rem;
    padding-bottom: 22px;
    margin: auto;
    width: 100%;
    text-align: left;
    display: block;
}

.vlevo {
    width: 50%;
    float: left;
    padding-bottom: 8px;
}

.vlevo span a {
    color: #ca0000;
}

.vpravo {
    width: 50%;
    float: left;
    text-align: right;
    padding-bottom: 8px;
    margin-top: -8px;
}

.vpravo span a {
    color: #ca0000;
}


.article {
    padding-top: 10px;
    font-size: 1.2rem;
    padding-bottom: 8px;
    padding-left: 22px;
    padding-right: 22px;
    text-align: center;
}

.foto {
    padding-top: 10px;
    margin: 0px auto;
    width: 98%;
    text-align: center;
}

h4 {

    position: relative;
    text-align: right;
    padding-right: 10px;
    top: 130px;
    color: #FFF;
    font-weight: bold;
    font-size: 1.4rem;
}

.pager {

    margin: auto;
    margin-top: 10px;
    padding-bottom: 15px;
    width: 100%;
    text-align: left;
    font-size: 1.2rem;
    font-weight: bold;
    color: gray;
    padding-left: 20px;
}

.pager a {

    font-size: 1.2rem;
    font-weight: bold;
    color: #2A3F72;
    text-decoration: none;
}

.rowRez {
    width: 98%;
    height: 25px;
    margin: 0px auto;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 10px;
    line-height: 25px;
}

.rowRezDen {
    width: 98%;
    height: 30px;
    margin: 0px auto;
    text-align: center;
    margin-top: 0px;
    margin-bottom: 10px;

}

.rowRezTyp {
    width: 98%;
    height: 38px;
    margin: 0px auto;
    text-align: center;
    margin-top: 12px;
    line-height: 30px;
}

.rowDenName {
    width: 98%;
    height: 30px;
    margin: 0px auto;
    text-align: center;
    margin-top: 20px;
    line-height: 25px;
}

.rowOpen {
    width: 98%;
    height: 25px;
    margin: 0px auto;
    text-align: center;
    line-height: 25px;
    margin-top: 10px;
}



.rowTyp {
    float: left;
    width: 20%;
    height: 30px;
    margin-left: 8px;
    margin-right: 2px;
    font-weight: bold;
    line-height: 30px;


    /* background: -moz-linear-gradient(top,  #FFF 0%, #E5E5E5 100%); /* FF3.6+ */
    /* background: -webkit-gradient(linear, top, bottom, color-stop(0%,#FFF), color-stop(100%,#E5E5E5)); /* Chrome,Safari4+ */
    /* background: -webkit-linear-gradient(top,  #FFF 0%,#E5E5E5 100%); /* Chrome10+,Safari5.1+ */
    /* background: -o-linear-gradient(top,  #FFF 0%,#E5E5E5 100%); /* Opera 11.10+ */
    /* background: -ms-linear-gradient(top,  #FFF 0%,#E5E5E5 100%); /* IE10+ */
    /* background: linear-gradient(to bottom,  #FFF 0%,#E5E5E5 100%); /* W3C */

    /* -webkit-border-radius: .3em;*/
    /* -moz-border-radius: .3em;*/
    /* border-radius: .3em;*/
}



.rowFree {
    float: left;
    width: 12.5%;
    height: 30px;
    margin-left: 2px;
    margin-right: 2px;
    font-weight: bold;
    line-height: 30px;


    background: lime;


    cursor: pointer;

}

.busy {
    float: left;
    width: 12.5%;
    height: 30px;
    margin-left: 2px;
    margin-right: 2px;
    font-weight: bold;
    line-height: 30px;

    background-color: #ca0000;
    color: white;

    cursor: pointer;
}

.out {
    float: left;
    width: 12.5%;
    height: 30px;
    margin-left: 2px;
    margin-right: 2px;
    font-weight: bold;
    line-height: 30px;


    background-color: black;


}



.rowDen {
    float: left;
    width: 12.5%;
    margin-top: 20px;
    margin-left: 2px;
    margin-right: 2px;
    font-weight: bold;
    line-height: 30px;

}

.rowDenAdmin {
    float: left;
    width: 16%;
    margin-left: 2px;
    margin-right: 2px;
    font-weight: bold;
    line-height: 25px;

}

.DenNameAdmin {
    float: left;
    width: 16%;
    height: 25px;
    margin-left: 2px;
    margin-right: 2px;
    font-weight: bold;
    vertical-align: middle;
    line-height: 28px;


    background: -moz-linear-gradient(top, #FFF 0%, #E5E5E5 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, top, bottom, color-stop(0%, #FFF), color-stop(100%, #E5E5E5));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #FFF 0%, #E5E5E5 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #FFF 0%, #E5E5E5 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #FFF 0%, #E5E5E5 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #FFF 0%, #E5E5E5 100%);
    /* W3C */

    -webkit-border-radius: .3em;
    -moz-border-radius: .3em;
    border-radius: .3em;
}

.OpenTermAdmin {
    float: left;
    width: 16%;
    margin-left: 2px;
    margin-right: 2px;
    font-weight: bold;
    vertical-align: middle;

}

.NoteDay {
    float: left;
    width: 16%;
    height: 30px;
    margin-left: 2px;
    margin-right: 2px;
    font-weight: bold;
    vertical-align: middle;
    line-height: 28px;

}

.DenName {
    float: left;
    width: 12.5%;
    height: 30px;
    margin-left: 2px;
    margin-right: 2px;
    font-weight: bold;
    vertical-align: middle;
    line-height: 30px;


    /*background: -moz-linear-gradient(top,  #FFF 0%, #E5E5E5 100%); /* FF3.6+ */
    /*background: -webkit-gradient(linear, top, bottom, color-stop(0%,#FFF), color-stop(100%,#E5E5E5)); /* Chrome,Safari4+ */
    /*background: -webkit-linear-gradient(top,  #FFF 0%,#E5E5E5 100%); /* Chrome10+,Safari5.1+ */
    /*background: -o-linear-gradient(top,  #FFF 0%,#E5E5E5 100%); /* Opera 11.10+ */
    /*background: -ms-linear-gradient(top,  #FFF 0%,#E5E5E5 100%); /* IE10+ */
    /*background: linear-gradient(to bottom,  #FFF 0%,#E5E5E5 100%); /* W3C */

    /*-webkit-border-radius: .3em;*/
    /*-moz-border-radius: .3em;*/
    /*border-radius: .3em;*/
}



.rowVolnePole {
    float: left;
    width: 20%;
    height: 30px;
    margin-left: 8px;
    margin-right: 2px;
    font-weight: bold;
    line-height: 30px;

}

.rowVolnePoleExp {
    float: left;
    width: 20%;
    height: 30px;
    margin-left: 8px;
    margin-right: 2px;
    font-weight: bold;
    line-height: 30px;
    /*background-color:#e6b745;*/
    /*display:none;*/
    /*left:-10000px;*/
    -webkit-border-radius: .6em;
    -moz-border-radius: .6em;
    border-radius: .6em;
    /*cursor:pointer;*/

}

.rowVolnePoleAdmin {
    float: left;
    width: 10%;
    height: 25px;
    margin-left: 8px;
    margin-right: 2px;
    font-weight: bold;
    line-height: 28px;

}



.logFormOpacity {
    position: fixed;
    inset: 0;
    background-color: #000;
    display: none;
    z-index: 999;
    opacity: 0.5;
}

h3 {
    margin-top: 0px;
}

p {
    margin-top: 8px;
}

.modal {
    padding: 10px;
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    font-size: 14px;
    box-sizing: border-box;
}

.send {
    font-size: 1.2rem;
    font-weight: bold;
    color: #ca0000;
    margin-top: 10px;
    text-decoration: none;
    cursor: pointer;
}

.updateSend {
    margin-top: 0px;
}

.non {
    color: gray;
    cursor: text;
}


.logForm {
    position: fixed;
    z-index: 1000;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 400px;
    max-width: calc(100vw - 20px);
}

div.logForm form table {
    width: 100%;
}

.submit {

    display: block;
    width: 100%;
    background-color: #111;
    color: white;
    font-size: 14px;
    font-weight: bold;
    padding: 12px;
    border: none;
    border-radius: 6px;
    margin-top: 16px;
    cursor: pointer;
    transition: background 0.3s ease;

}

.submit:hover {
    background-color: #0077cc;
}



.submitForm {

    font-family: Arial;
    color: #2A3F72;
    background-color: #FFF;
    font-weight: bold;
    font-size: 1.2rem;
    text-decoration: none;
    border: none;
    cursor: pointer;

}


.pForm {
    padding-top: 30px;
    margin-bottom: 50px;

}

.wrong {
    padding-top: 10px;
    display: none;
    color: #ee3324;

}

.logout {
    padding-top: 10px;
    display: none;
    color: #2A3F72;

}

.in {
    width: 100%;
}






.infoZp {

    position: fixed;
    z-index: 1;
    width: 260px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(61%, -50%);
    transform: translate(61%, -50%);
    display: none;
    background-color: #fff;
    padding: 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    font-size: 14px;

    /*display:none;*/
    /*left:-10000px;*/
    -webkit-border-radius: .6em;
    -moz-border-radius: .6em;
    border-radius: .6em;
}

.infoZp:after {
    content: '';
    position: absolute;
    border-style: solid;
    border-width: 7px 7px 7px 0px;
    border-color: transparent #fff;
    display: block;
    width: 0;
    z-index: 1;
    left: -7px;
    top: 110px;
}


.infoIs {

    position: fixed;
    z-index: 1;
    width: 260px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    display: none;
    background-color: #C7CEFC;
    padding: 10px;

    /*display:none;*/
    /*left:-10000px;*/
    -webkit-border-radius: .6em;
    -moz-border-radius: .6em;
    border-radius: .6em;
}

.infoIs:after {
    content: '';
    position: absolute;
    border-style: solid;
    border-width: 7px 0 7px 7px;
    border-color: transparent #C7CEFC;
    display: block;
    width: 0;
    z-index: 1;
    right: -7px;
    top: 30px;
}

.infoEx {

    position: fixed;
    z-index: 1;
    width: 260px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    display: none;
    background-color: #C7CEFC;
    padding: 10px;

    /*display:none;*/
    /*left:-10000px;*/
    -webkit-border-radius: 65em;
    -moz-border-radius: .6em;
    border-radius: .6em;
}

.infoEx:after {
    content: '';
    position: absolute;
    border-style: solid;
    border-width: 7px 0 7px 7px;
    border-color: transparent #C7CEFC;
    display: block;
    width: 0;
    z-index: 1;
    right: -7px;
    top: 84px;
}

.infoSp {

    position: fixed;
    z-index: 1;
    width: 260px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(61%, -50%);
    transform: translate(61%, -50%);
    display: none;
    background-color: #FFF;
    padding: 10px;
    font-size: 14px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);

    /*display:none;*/
    /*left:-10000px;*/
    -webkit-border-radius: .6em;
    -moz-border-radius: .6em;
    border-radius: .6em;
}

.infoSp:after {
    content: '';
    position: absolute;
    border-style: solid;
    border-width: 7px 7px 7px 0px;
    border-color: transparent #FFF;
    display: block;
    width: 0;
    z-index: 1;
    left: -7px;
    top: 50px;
}



.error {
    border: 1px solid #ee3324;
}

.close {
    position: absolute;
    top: 10px;
    right: 14px;
    font-size: 18px;
    cursor: pointer;
}

.pForm {
    padding-top: 30px;
    margin-bottom: 50px;

}

.wrong {
    padding-top: 10px;
    display: none;
    color: #ee3324;

}

.logout {
    padding-top: 10px;
    display: none;
    color: #2A3F72;

}

.inForm {
    width: 142px;
    border: 1px solid black;
    margin-bottom: 10px;
}

.quantity {
    width: 15%;
    color: green;
}

.odd {
    color: #ee3324;
}

.uvolneni,
#dayNoteBut {

    font-family: Arial;
    background-color: #2A3F72;
    /* Modrá barva tlačítka */
    color: #ffffff;
    /* Bílý text */
    border: none;
    padding: 8px 10px;
    font-size: 1.2rem;
    font-weight: bold;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    display: block;
    margin: 0 auto;

}

.uvolneni:hover,
#dayNoteBut:hover {
    background-color: #197de7;
    /* Tmavší modrá při najetí */
}

.rowZp {

    width: 85%;
    height: auto;
    overflow: auto;
    margin: 0 auto;
    margin-top: 25px;
    margin-left: 140px;
    border-width: 1px;
    border-color: gray;
    border-style: solid solid solid none;
    -webkit-border-radius: .6em;
    -moz-border-radius: .6em;
    border-radius: .6em;
}

.rowZpUvod {
    float: left;
    width: 135px;
    position: absolute;
    margin-left: 2px;
    margin-right: 2px;
    font-weight: bold;
    margin-top: 45px;
    background: -moz-linear-gradient(right, #E5E5E5 0%, white 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, right, left, color-stop(0%, #E5E5E5), color-stop(100%, white));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #E5E5E5 0%, white 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(right, #E5E5E5 0%, white 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(right, #E5E5E5 0%, white 100%);
    /* IE10+ */
    background: linear-gradient(to right, #E5E5E5 0%, white 100%);
    /* W3C */

    -webkit-border-radius: .6em;
    -moz-border-radius: .6em;
    border-radius: .6em;

    border-width: 1px;
    border-color: gray;
    border-style: solid none solid solid;
}

.rowSpUvod {
    float: left;
    width: 135px;
    margin-top: 25px;
    margin-left: 2px;
    margin-right: 2px;
    position: absolute;
    font-weight: bold;
    background: -moz-linear-gradient(right, #E5E5E5 0%, white 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, right, left, color-stop(0%, #E5E5E5), color-stop(100%, white));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #E5E5E5 0%, white 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(right, #E5E5E5 0%, white 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(right, #E5E5E5 0%, white 100%);
    /* IE10+ */
    background: linear-gradient(to right, #E5E5E5 0%, white 100%);
    /* W3C */

    -webkit-border-radius: .6em;
    -moz-border-radius: .6em;
    border-radius: .6em;

    border-width: 1px;
    border-color: gray;
    border-style: solid none solid solid;
}

.rowInZp {
    float: left;
    width: 100%;
    height: auto;
    text-align: left;

}



.inZpOut {
    float: left;
    width: 190px;
    overflow: auto;
    margin-left: 2px;
    margin-right: 2px;
    text-align: center;


    background: -moz-linear-gradient(top, #FFF 0%, #E5E5E5 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, top, bottom, color-stop(0%, #FFF), color-stop(100%, #E5E5E5));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #FFF 0%, #E5E5E5 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #FFF 0%, #E5E5E5 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #FFF 0%, #E5E5E5 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #FFF 0%, #E5E5E5 100%);
    /* W3C */

    -webkit-border-radius: .6em;
    -moz-border-radius: .6em;
    border-radius: .6em;

}

.inZp,
.inZpGreen {
    float: left;
    width: 190px;
    overflow: auto;
    margin-left: 2px;
    margin-right: 2px;
    text-align: center;


    background: -moz-linear-gradient(top, #FFF 0%, #ee3324 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, top, bottom, color-stop(0%, #FFF), color-stop(100%, #ee3324));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #FFF 0%, #ee3324 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #FFF 0%, #ee3324 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #FFF 0%, #ee3324 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #FFF 0%, #ee3324 100%);
    /* W3C */

    -webkit-border-radius: .6em;
    -moz-border-radius: .6em;
    border-radius: .6em;

}

.inZpGreen {
    background: -moz-linear-gradient(top, #FFF 0%, #81d359 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, top, bottom, color-stop(0%, #FFF), color-stop(100%, #81d359));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #FFF 0%, #81d359 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #FFF 0%, #81d359 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #FFF 0%, #81d359 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #FFF 0%, #81d359 100%);
    /* W3C */
}


.inZpFree {
    float: left;
    width: 190px;
    height: 120px;
    margin-left: 2px;
    margin-right: 2px;
    overflow: auto;
}

.tabIn {
    width: 98%;
    text-align: left;
    margin: 10px auto;
    margin-left: 2px;
}

td {
    word-wrap: break-word;
}

.showtool {
    position: relative;
    left: 132px;
    top: -24px;
    display: none;
}

.hookimg {
    position: relative;
    top: -20px;
    left: -40px;
    height: 0px;
}

#GdprTable {
    font-size: 1.0rem;
}

#GdprTable a {
    text-decoration: underline;
}

#Gdpr {
    margin-right: 10px;
    width: 20px;
    margin-left: 50px;
}

.footerInfo {
    display: flex;
    flex-direction: column;
    gap: 15px;
    font-family: Arial, sans-serif;
    background-color: #f9f9f9;
    padding: 20px;
    border-radius: 6px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.footerTitle {
    font-weight: bold;
    color: #333;
    margin-right: 5px;
}

.footerContent {
    color: #555;
    line-height: 1.5;
}

.footerContent a {
    color: #007bff;
    text-decoration: none;
}

.footerContent a:hover {
    text-decoration: underline;
}

.infoZPFooter,
.infoBSFooter,
.infoISFooter {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

@media only screen and (max-width: 768px) {


    body {
        font-size: 1rem;
        /* Slightly reduce font size for better fit */
    }

    .main,
    .mainAdmin,
    .header,
    .obsah,
    .obsahAdmin {
        width: 100%;
        /* Reduce width to fit smaller screens */
        margin: 0 auto;
        /* Center the content */
        border-radius: 6px;
        height: 100%;
        padding-left: 2px;
        padding-right: 0px;
        padding-bottom: 100px;
    }

    .header {
        height: auto;
        /* Allow header height to adjust */
        background-size: cover;
        /* Ensure the background image fits */
    }

    .vlevo,
    .vpravo {
        width: 100%;
        /* Stack elements vertically */
        float: none;
        text-align: center;
        /* Center align text */
    }


    .rowTyp,
    .rowFree,
    .busy,
    .out,
    .rowDen,
    .rowDenAdmin,
    .DenNameAdmin,
    .OpenTermAdmin,
    .NoteDay,
    .DenName,
    .rowVolnePole,
    .rowVolnePoleExp,
    .rowVolnePoleAdmin {
        margin: 5px 0;
        /* Adjust margins for spacing */
        margin-right: 1px;
    }

    .rowTyp {
        font-size: 10px;
        line-height: 15px;
    }

    .bezny {
        padding-top: px;
        padding-right: 2px;
        padding-left: 2px;
    }

    .rowZp,
    .rowSpUvod,
    .rowZpUvod,
    .inZp,
    .inZpGreen,
    .inZpFree {
        width: 100%;
        /* Make these elements full width */
        margin: 5px 0;
        /* Adjust margins for spacing */
    }

    .logForm,
    .infoZp,
    .infoEx,
    .infoSp {
        width: 90%;
        /* Reduce width for modals and info boxes */
        transform: translate(-52%, -50%);
        /* Adjust centering */
    }

    .uvolneni,
    #dayNoteBut {
        width: 100%;
        /* Make buttons full width */
        margin: 10px 0;
        /* Adjust margins for spacing */
    }

    .rowRez,
    .rowRezDen,
    .rowRezTyp,
    .rowDenName,
    .rowOpen {
        width: 100%;
        /* Make rows full width */
        margin: 5px 0;
        /* Adjust margins for spacing */
    }

    .foto {
        width: 100%;
        /* Make images full width */
    }

    h4 {
        top: 20px;
        /* Adjust position */
        font-size: 1.2rem;
        /* Adjust font size */
    }

    .pager {
        width: 100%;
        /* Make pager full width */
        text-align: center;
        /* Center align pager */
    }

    .modal {
        width: 100%;
        /* Reduce modal width */
    }

    .submit,
    .submitForm {
        width: 100%;
        /* Make buttons full width */
        margin: 10px 0;
        /* Adjust margins for spacing */
    }

    .in,
    .inForm {
        width: 100%;
        /* Make input fields full width */
    }

    .rowInZp {
        width: 100%;
        /* Make this row full width */
    }

    .tabIn {
        width: 100%;
        /* Make tables full width */
    }

    .showtool {
        left: 0;
        /* Adjust tooltip position */
        top: 0;
        /* Adjust tooltip position */
    }

    .hookimg {
        left: 0;
        /* Adjust hook image position */
        top: 0;
        /* Adjust hook image position */
    }

    .header {
        display: none;
    }
}

.env-warning {
    position: sticky;
    top: 0;
    z-index: 9999;

    width: 100%;
    padding: 10px 15px;

    background: #ffcc00;
    color: #333;
    font-weight: bold;
    text-align: center;

    border-bottom: 1px solid #d9a600;

    box-sizing: border-box;
}