/************************* Popups **************************/

[class^="popup-area-window"] {
    position: absolute; /* umožní posouvání spolu s obsahem stránky */
    left: 50vw;
    top: 120px;
    transform: translate(-50%, 0); /* vycentrování na střed */
    background: white;
    padding: 35px 35px 40px;
    z-index: 1;

    box-shadow: var(--hn-header-box-shadow);
}

@media(min-width: 1450px){
    [class^="popup-area-window"] {
        width: 75vw;
        max-width: 1450px;
        min-height: 250px;
    }
}

@media(max-width: 1450px) AND (min-width: 650px){
    [class^="popup-area-window"] {
        width: 85vw;
        max-width: 1450px;
        min-height: 250px;
    }
}


@media(min-width: 650px){
    .small-screen-directory-path{
        display: none;
    }
    .hideOnBigScreen{
        display: none !important;
    }
    .big-screen-directory-path{
        display: flex;
        font-size: var(--hn-basic-text-size);
        margin-top: 8px;
    }
    .sub-table-action-icon-line .action-icon-wrapper img {
        position: relative;
        visibility: visible !important;
        left: 4px;
    }
    .ajax-sub-table-area-body{
        margin-top: 10px;
    }
}

@media(max-width: 650px){
    .showOnSmallScreenHeaderFilter{
        display: flex !important;
    }
    .hideOnSmallScreen{
        display: none !important;
    }
    .ajax-sub-table-area-body{
        margin-top: 15px;
    }
    .showOnSmallScreenHeaderFilter .default-table-text{
        white-space: nowrap;      /* Zabrání zalomení textu */
        overflow: hidden;         /* Skryje text, který se nevejde */
        text-overflow: ellipsis;
        max-width: 100px;
        font-size: var(--hn-basic-text-font-size-mobile);
        font-weight: 400 !important;
        margin-top: -1px;
    }
    .default-table-header .default-table-header-item{
        display: none;
    }
    .json-dynamic-div fieldset legend{
        width: 89%;
        margin-left: -2px;
        padding: 8px 20px 8px 25px;
        height: auto;
    }
    .json-dynamic-div table input, .json-dynamic-div table textarea{
        width: 97%;
    }
    .third-line-small-screen{
        display: flex;
        flex-direction: row;
    }
    .third-line-small-screen-small-circle{
        width: 20px;
        height: 20px;
        border-radius: 50px;
        margin-left: -2px;
        border: 1px solid black;
    }
    .third-line-small-screen-text{
        margin-left: 7px;
    }
    [class^="popup-area-window"] {
        top: -54px;
        box-shadow: initial;
        width: 100%;
        transform: initial;
        padding: 0;
        left: 0;
    }
    .ajax-form-fieldset-headline{
        width: 100%;
    }
    .hypertextSearchLineInput input {
        border: none !important;
    }
    .ajax-form-headline H2{
        padding-left: 28px;
        font-size: var(--hn-table-headline-font-size-mobile);
    }
    .ajax-form-headline{
        width: 90%;
    }
    .actionIconArea{
        padding-left: 0;
        margin-top: -11px;
        width:90%;
        margin-bottom: -10px;
        display: flex;
        flex-wrap: wrap;
    }


    .alertPopupButtonArea{
        justify-content: start;
    }

    .popup-area-close-cross-line .close-window-cross-wrapper{
        position: absolute;
        z-index: 2;
        top: 23px;
        right: 11px;
    }
    #popup-area-wrapper-notification .popup-area-close-cross-line .close-window-cross-wrapper{
        top: 7px;
    }
    .ajax-form-headline-wrapper{
        margin-top: 8px;
        margin-bottom: 21px;
    }
    .ajax-form-items-wrapper{
        gap: 0;
    }
    .ajax-form-fieldset-headline{
        border-bottom: none;
        padding: 8px 13px 8px 27px;
        margin-left: -20px;
    }
    .ajax-form-item-wrapper{
        padding-left: 7px;
    }

    .json-dynamic-div form{
        margin-top: 5px;
        width: 100%;
        display: flex;
        flex-direction: column;
    }

    [id^="json-dynamic-div"] fieldset,
    #wizard-content fieldset {
        width: 99.5%;
    }

    [id^="json-dynamic-div"] tr,
    #wizard-content tr {
        display: flex;
        flex-direction: column;
    }

    [id^="json-dynamic-div"] tr th,
    [id^="json-dynamic-div"] tr td,
    #wizard-content tr th,
    #wizard-content tr td {
        flex: 1;
        max-width: 96%;
    }

    .json-dynamic-div table th{
        width: 100%;
        padding-top: 11px;
        padding-bottom: 4px;
    }

    .default-table-row .default-table-column {
        padding-left: 0px;
    }
    .json-dynamic-div table{
        margin-top: -10px;
    }
    .json-dynamic-div table select{
        max-width: 105%;
        width: 100%;
    }

    [id^="json-dynamic-div"] tbody .td button,
    #wizard-content tbody .td button{
        margin-top: -40px;
    }
    .page-content-area .sing-in-content-wrapper{
        width: 100vw;
    }
    .table-header-action-icon-area button{
        width: 40px !important;
    }

    .select2-container .select2-selection--single {
        width: 104.5% !important;
    }

    .select2-selection.select2-selection--multiple {
        width: calc(100% - 6px) !important;
    }

    .json-dynamic-div fieldset{
        padding: 0;
    }
    .json-dynamic-div table th label{
        padding-left: 18px;
    }
    .default-table-column.showOnSmallScreen{
        width: initial !important;
    }
    .default-table-area,
    .default-table-row,
    .default-table-wrapper,
    .default-table-content-area{
        width: 100vw !important;
    }

    #json-dynamic-div-notification{
        min-height: 100px;
        align-content: start;
        position: relative;
        display: flex;
        align-items: center;
        padding-left: 19px;
        box-shadow: var(--hn-header-box-shadow);
        font-size: var(--hn-basic-text-size);
    }
    .ajax-sub-table-body .ajax-sub-table-header-row{
        display: none;
    }
    .ajax-sub-table-column{
        display: none;
    }

    .ajax-sub-table-row{
        min-height: 15px;
        padding: 8px 20px 8px 20px; !important;
    }
    .ajax-sub-table-heading-line{
        font-size: var(--hn-basic-text-size) !important;
        margin-left: 25px;
        margin-bottom: 2px;
    }
    .action-icon-wrapper img{
        position: relative;
        bottom: -7px;
        max-width: 37px;
    }
    .sub-table-directory-path-line{
        font-size: 14px;
        position: relative;
        width: 100vw;
        top: -2px;
        left: 22px;
        line-height: 4px;
    }
    .ajax-popup-documents-button{
        line-height: 23px;
        width: 100px;
        font-size: calc( var(--hn-basic-text-size) - 1px);
    }
    .ajax-sub-table-header-icons{
        padding-top: 14px;
        padding-left: 18px;
    }
    .sub-table-action-icon-line img {
        position: relative;
        left: -12px;
        top: -5px;
    }
    .sub-table-action-icon-line .action-icon-wrapper img {
        position: relative;
        left: -10px;
        top: 4px;
    }
    .ajax-sub-table-header-row-wrapper.hide-on-big-screen .ajax-sub-table-heading-line{
        margin-top: 12px;
        padding-bottom: 5px;
    }

    .popup-form-headline-row{
        margin-top: 24px;
        padding-left: 28px;
        font-size: var(--hn-table-headline-font-size-mobile);
        width: 80vw;
        overflow-wrap: break-word;
        white-space: normal;
    }
    .popup-form-title-row{
        margin-top: 24px;
        padding-left: 28px;
        font-size: var(--hn-table-headline-font-size-mobile);
        width: 90vw;
    }
    .select2-container{
        width: calc(100% + 6px) !important;
    }
    .json-dynamic-div table input[type="submit"]{
        padding: 4px 0;
    }
    .ajax-sub-table-row .ajax-sub-table-column-documents{
        padding-left: 5px;
    }

    label[for="frm-tableControl-addDocumentItemForm-use_current_file_name"] input,
    label[for="frm-addItemForm-use_current_file_name"] input{
        width: 15px;
        margin-top: 5px;
        margin-left: 17px;
    }
    form input[type="file"]{
        width: 70%;
        margin-left: 17px;
    }
    .json-dynamic-div{
        padding-bottom: 45px;
        box-shadow: var(--hn-universal-box-shadow);
        max-width: 100%;
    }
    .popup-form-notification-content{
        width: 80%;
        margin-left: 6%;
    }
    .popup-form-warning-content li {
       line-height: 22px;
        padding-bottom: 10px;
    }

    .popup-form-warning-content ul{
        width: 80%;
        font-size: 14px;
        margin-left: 6%;
    }
    .popup-form-warning-content{
        width: 80%;
        margin-left: 6%;
    }
    .sing-out-form-wrapper{
        height: 84px;
    }
    .sing-out-form-area a{
        top: -20px;
        position: relative;
    }
    .ajax-form-wrapper.user-settings-popup .ajax-form-headline-wrapper{
        margin-top: 45px;
    }
    .ajax-form-wrapper.user-settings-popup .ajax-form-headline H2{
        padding-left: 10px;
    }
    .ajax-form-wrapper.user-settings-popup .label-column{
        padding-left: 25px;
        padding-right: 15px;
    }
    .actionIconsPopup:hover{
        top: 7px;
    }
    .strong-on-small-screen{
        font-weight: 600;
    }
    .ajax-sub-table-header-row-wrapper{
        padding-bottom: 4px;
    }
    .no-items-found{
        padding-left: 4px;
    }
    .popup-area-wrapper{
        z-index: 0;
        background: #ffffffdb !important;
    }
    .popup-form-notification-content{
        height: initial;
        min-height: 70px;
        font-size: var(--hn-basic-text-size);
        font-weight: 400;
    }
    .small-screen-table-row-headline.sub-table{
        padding-left: 4px;
        font-size: var(--hn-basic-text-size);
    }

    .documents-button-area{
        margin-top: -120px;
        margin-bottom: 80px;
    }
    .hypertextSearchLineWrapper.document-page{
        margin-top: 30px;
    }
    .file-browser-lines-wrapper{
        margin-top: 20px;
    }
    .file-browser-header .sub-table-action-icon-line img{
        top: 7px;
    }
    .documents-deactivate-custom-width-on-small-screen-devices{
        width: initial !important;
    }
    .file-browser-lines-wrapper .row-action-icon-img.view{
        width: 28px;
        margin-top: -4px;
    }
    .file-browser-lines-wrapper .row-action-icon-img{
        width: 26px;
        margin-top: -2px;
    }
    .document-sub-table-icon-column{
        position: absolute;
        right: 28px;
        display: flex;
        flex-direction: row;
    }
    .default-table-column-documents{
        width: 70px !important;
    }
    .default-table-column-documents .row-icon-href-wrapper {
        width: 10px;
    }

    .json-dynamic-div table input.button {
        min-width: 100px;
        max-width: 120px;
        padding: 0 12px !important;
        margin: 3px;
        /* Zalamování textu + výška */
        white-space: normal;
        word-wrap: break-word;
        min-height: 36px;
        line-height: 1.2;
        /* Centrování víceřádkového textu */
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .json-dynamic-div table input.button:hover {
        min-width: 100px;
        max-width: 120px;
        padding: 0 12px !important;
        margin: 3px;
        /* Zalamování textu + výška */
        white-space: normal;
        word-wrap: break-word;
        min-height: 36px;
        line-height: 1.2;
        /* Centrování víceřádkového textu */
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }


    .default-table-column-documents .row-icon-href-wrapper {
        margin-top: 3px;
    }

    .sub-table-directory-path-line div:empty {
        height: 0px;
        margin: 0;
    }

    .ajax-sub-table-header-row-wrapper.file-browser-header {
        margin-top: 2px !important;
    }

    .file-browser-header .ajax-sub-table-header-icons{
        padding-top: 15px;
    }
    .small-screen-directory-path{
        display: flex;
    }
    .big-screen-directory-path{
        display: none;
    }
    .popup-form-headline-row.request-action-buttons-row{
        margin-top: -10px;
        padding-left: 20px;
    }
    .popup-form-headline-row.request-action-buttons-row button{
        width: 145px !important;
        line-height: 28px;
    }
    .documents-button.file-browser{
        width: 120px;
        line-height: 25px;
    }
    .documents-button-area.file-browser{
        padding-top: 0px;
        padding-left: 10px;
        margin-top: -126px;
    }
    .default-table-action-column.file-browser{
        margin-top: 17px;
    }
    .default-table-action-column{
        padding-bottom: 17px !important;
    }
    .default-table-headline-column.file-browser{
        top: -21px;
    }
    .default-table-headline-column.file-browser H2{
        font-size: var(--hn-basic-text-size);
    }
    .default-table-row.file-browser{
        padding-left: 20px;
    }
    .default-table-column-documents.icon-column{
        width: 50% !important;
    }
    .default-table-column-documents.file-browser-icon-column{
        width: 50% !important;
    }
    .hide-on-small-screen-650{
        display: none !important;
    }
    .paginator-overview{
        width: 100vw;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
    .paginator-previous-next-and-number-wrapper{
        margin-top: 130px;
        padding-bottom: 50px;
    }
    .ajax-sub-table-header-row{
        display: none !important;
    }
    .ajax-sub-table-heading-line{
        width: 75% !important;
        color: white !important;
    }
    .sub-table-action-icon-line{
        width: 25% !important;
    }
    .invert-img-color-on-small-screen{
        filter:  invert(1) brightness(2);
    }
    .table-header-action-icon-area{
        display: flex;
    }
    .header-area-wrapper{
        height: 65px !important;
    }

    .settings-section {
        display: flex;
        flex-direction: column; /* Zajistí, že fieldsety budou pod sebou */
        gap: 20px; /* Mezery mezi fieldsety */
    }

}

@media(max-width: 1250px){
    .hide-on-small-screen{
        display: none !important;
        width: 0 !important;
    }
    .document-sub-table-icon-column{
        justify-content: start;
        padding-right: 10px;
    }

    #flashMessage {
        width: 90%;
        padding: 10px 20px;
        font-size: var(--hn-basic-text-font-size-mobile);
        top: 150px;
    }

}

@media(max-width: 1250px) AND (min-width: 650px) {
    .ajax-sub-table-header-row-wrapper.file-browser-header .ajax-sub-table-header-icons {
        position: initial;
    }
    .hypertextSearchLineLabel{
        display: none;
    }
    .documents-small-screen-width{
        width: 75% !important;
    }

}

@media(max-width: 1000px) AND (min-width: 650px) {
    .default-table-header-area{
        flex-direction: column;
    }
    .default-table-action-column{
        margin-top: -20px;
        padding-bottom: 10px !important;
    }
    .default-table-action-column{
        justify-content: start !important;
    }
    .default-table-action-column{
        width: 100% !important;
    }
    .hypertextSearchLineWrapper{
        justify-content: start !important;
    }
    .table-header-action-icon-area{
            position: relative;
            top: -4px;
    }
}

.default-table-header-item.file-browser-path{
    width: 50%;
}


@media(min-width: 1150px) {
    .chat-headline{
     margin-top: 1.5px !important;
        position: relative;
        top: -43px;
    }
    .side-div {
        min-width: 250px;
        max-width: 300px;
        background: var(--hn-box-background-color);
        margin: 10px 14px 5px 14px;
        padding-left: 9px;
        padding-right: 9px;
        position: relative; /* Abychom zajistili, že se výška přizpůsobí obsahu */
        flex-direction: column;
        #chat-input-area{
            margin-top: -30px;
        }
    }
}
@media(max-width: 1150px){
    .side-div {
        z-index: 100;
        min-width: 300px;
        max-width: 300px;
        background: var(--hn-box-background-color);
        margin: 0;
        box-shadow: var(--hn-universal-box-shadow);
        position: absolute;
        border-radius: 5px;
        flex-direction: column;
        padding: 15px;
        top: 190px;
        right: 35px;
    }
}

@media(max-width: 650px) and (min-width: 500px){
   .popup-content .side-div {
       position: absolute;
       width: calc(100vw - 30px) !important;
       max-width: calc(100vw - 30px) !important;
       top: 1px;
       right: 0 !important;
       padding: 30px 15px;
       .button-chat{
           cursor: pointer;
           width: 180px;
       }
    }
}

@media(max-width: 500px){
    .popup-content .side-div {
        position: absolute;
        width: calc(100vw - 30px) !important;
        max-width: calc(100vw - 30px) !important;
        top: 1px;
        right: 0 !important;
        padding: 30px 15px;

        .button-chat{
            cursor: pointer;
            width: 180px;
        }
    }
}

.fast-filter-dropdown{
    display: none;
}
@media(max-width: 650px){
    .fast-filter-dropdown{
        display: block;
    }
}