/*
    Stylesheet fot ZSE Drive - Štúdia uskutočniteľnosti
    Author: CODES Creative
    Last modified: 19.5.2022
*/
/* common values */
:root {
    --zse-red: #F21C0A;  
    --menu-z-index: 100;
    --dekstop-border-width: 2.5px;
    --desktop-font-size: 28px;
    --header-h: 94px;
}
/*rgb 	zse red (242,28,10)*/

@font-face {
    font-family: poloextrabold;
    src: url(../common/font/Polo11K-Halbfett.ttf);
}
@font-face {
    font-family: polobold;
    src: url(../common/font/Polo11K-Krftg.ttf);
}
@font-face {
    font-family: pololight;
    src: url(../common/font/Polo11R-Leicht_1.ttf);
}
@font-face {
    font-family: poloregular;
    src: url(../common/font/polor_regular-webfont.woff);
}

[v-cloak] {
    display: none;
}

body{
    font-family: 'pololight';
    font-size: 20px;
}

.ex-bold{
    font-family: 'poloextrabold';
    font-weight: 100;
}
h1{
    font-size: 38px;
}

.text-zse-red{
    color: var(--zse-red);
}

body{
    min-height: 100vh;
}
#app{
    height: calc(100vh - var(--header-h));
    overflow: auto;
}
div.bg{
    height: 100vh;
    width: 100vw;
    position: fixed;
    top: 0;
    left: 0;
    background: url(../common/images/web/BG.svg);
    background-position: center;
    z-index: -1;
}

@media (min-width: 1200px){
    #edit_photo.container{
        max-width: 1400px;
    }
    #edit_photo .col-4{
        max-width: 400px !important;
        margin-left: auto;
        margin-right: auto;
    }
}

/* buttons and input*/
.btn-outline-primary{
    color: black;
    border-color: black;
    border-width: var(--dekstop-border-width);
    border-radius: 0%;
    font-family: 'polobold';
    font-size: var(--desktop-font-size);
    padding: 32px 114px;
}

.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active{
    color: var(--zse-red) !important;
    border-color: var(--zse-red) !important;
    /*box-shadow: 0 0 0 0.2rem rgb(242 28 10 / 50%) !important;*/
    background: white !important;
}
.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active,
.form-control:hover, .form-control:focus, .form-control:active,
.no-shadow:hover, .no-shadow:focus, .no-shadow:active{
    box-shadow: unset !important;
}

.form-control{
    max-width: 500px;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 2px solid #ABABAD !important;
    border-radius: unset;
    background: transparent !important;
}

/* headder */
header{
    height: var(--header-h);
}
header.logged{
    border-bottom: 1px solid #ABABAD;
}
#corner_logo{
    width: 176.8px;
    height: 10vw;
    max-height: 28.27px;
    margin-right: 41px;
    margin-top: 33px;
    margin-left: auto;
}
body.logged_in #corner_logo{
    margin-left: unset;
}
#hp_link_block{
    width: 662px;
    height: var(--header-h);
    position: relative;
    margin-left: -12px;
}
#hp_link_block::before{
    content: '';
    position: absolute;
    left: 0; right:0; bottom:0; top: 0;
    background: var(--zse-red);
    transform: skewX(-13deg);
}
#hp_link_block a{
    margin: auto;
    margin-left:55px;
    font-size:40px;
    font-family: 'polobold';
    text-decoration: none !important;
    z-index: var(--menu-z-index);
}
#user_block{
    margin-left: auto;
    margin-right: 78px;
    align-items: center;
}
#user_block > *{
    font-size: 15px;
    line-height: 15px;
}
.u_name{
    margin-top:10px;
    padding-right: 0.75rem;

}
.u_icon{
    height: 38px;
    width: 38px;
    background: url(../common/images/web/login.svg);
    background-position: center;
    background-size: contain;
}
button.logout{
    color:var(--zse-red);
    padding: 0.1rem 0.75rem;
}
#oopened_pdf_id{
    margin-left: auto;
    margin-top: 28px;
}
.opend_offer_number{
    font-size: 28px;
    font-family: 'poloextrabold';
    color: var(--zse-red);
    text-transform: uppercase;
    min-width: 140px;
}
.site_title{
    height: 47px;
    align-self: end;
}

@media (max-width: 1320px){
    #hp_link_block {
        max-width: 520px;
    }
    #hp_link_block a{
        font-size:30px;
    }
    .site_title{
        height: 44px;
    }
}
@media (max-width: 1200px){
    #hp_link_block{
        max-width: 390px;
    }
    .site_title {
        height: 54px;
        line-height: 30px;
    }    
    #corner_logo{
        margin-right: 10px;
    }
    #user_block{
        margin-left: 35px;
    }
}
@media (max-width: 1000px){
    header .righ_block_wrap{
        flex-direction: column-reverse;
    }
    #corner_logo{
        margin-top: 10px;
        margin-bottom: 2px !important;      
        width: 140px;
        align-self: end;
    }
    #user_block{
        margin-right: 10px;
    }
}
@media (max-width:900px){
    #hp_link_block{
        max-width: 270px;
    }
    .site_title{
        font-size: 22px;
    }
    #hp_link_block a{
        margin-left:25px;
    }
}

/* footer*/

/* login page */

#beforeLogin, #login_wrap, #login_recover_wrap, .state-screen{
    height: calc(100vh - var(--header-h));
    display: -ms-flexbox;
    display: flex;
}
#login_logo{
    width: 100%;
    height: 10vw;
    max-height: 28.27px;
}
#login-form, #forgoten-password{
    max-width: 520px;
    margin:auto;
    width: 100%;
}
.prihlasenie{
    margin-top: 50px;
    margin-bottom: 50px;
}
.abs-label{
    position: absolute;
    margin-left: 10px;
    margin-top: 6px;
    transition: all 0.4s ease;
    -webkit-transition: all 0.4s ease;
}
.abs-label.hide{
    font-size: 0px;
}

#popup_message{
    position: fixed;
    top: 40vh;
    left: 0;
    right: 0;
    /* bottom: 20vw; */
    max-width: 500px;
    margin: auto;
    border: 2px solid var(--zse-red);
    z-index: 1;
    padding: 30px;
    height: auto;
    background: white;
    display: none;
}


/*  menu after login - 1st level menu */
.btn-menu{
    height: 297px;
    width: 277px;
    border-color: black !important;
    border-width: 3px;
    border-radius: 45px;
    font-size: 28px;
    font-family: 'polobold';
    line-height: 30px;
}
.btn-menu:hover, .btn-menu:focus, .btn-menu:active{
    color: var(--zse-red) !important;
    border-color: var(--zse-red) !important;
    /*box-shadow: 0 0 0 0.2rem rgb(242 28 10 / 50%) !important;*/
    background: white !important;
}


/* create pdf menu */
#menu_edit .btn-menu{
    border-color: unset !important;
    border: none !important;
    font-family: 'poloextrabold';
    display:flex;
    align-items: start;
    flex-direction: column;
}
#menu_edit .btn-menu > img{
    margin-left: auto;
    margin-right: auto;
}
#menu_edit .btn-menu .upravit{
    margin: auto;
}
#menu_edit .btn-menu .hd{
    width: 100%;
}
#menu_edit .btn-menu:hover, #menu_edit .btn-menu:focus, #menu_edit .btn-menu:active{
    border-color: unset !important;
    /*box-shadow: 0 0 0 0.2rem rgb(242 28 10 / 50%) !important;*/
    background: white !important;
}

#menu_edit .btn-menu img, #edit_tech .btn-menu img, #edit_basic .btn-menu img, #edit_situation .btn-menu img, #edit_price .btn-menu img, #edit_photo .btn-menu img{
    width: 161px;
    height: 161px;
}
#menu_edit .btn-menu, #edit_tech .btn-menu, #edit_basic .btn-menu, #edit_situation .btn-menu, #edit_price .btn-menu {
    font-family: 'poloextrabold';
}

#menu_edit .row{
    max-height: 300px;
}

#menu_edit .btn-outline-primary, #edit_tech .btn-outline-primary{
    padding: 28px 86px;
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled{
    color: #333333;
}
.upravit{
    margin-top: 5px; flex-direction: row; align-items: center;
}
.upravit img{
    width: 18px !important; height: 18px !important; margin-left: auto;margin-right: 8px;
}
.upravit .txt{
    margin-right: auto; font-size: 18px; font-family: 'polobold';
}

#table_created_filter, #table_created_filter_offers, #table_created_filter_users{
    position: fixed;
    top: 40vh;
    left: 0;
    right: 0;
    max-width: 500px;
    margin: auto;
    border: 2px solid var(--zse-red);
    z-index: 1;
    padding: 30px;
    height: auto;
    background: white;
    display: none;
}

.back-btn{
    color: var(--zse-red);
    font-size: 26px;
    font-family: 'polobold';
    z-index: 10;
}

@media (max-width:1200px){
    #menu_edit .btn-outline-primary, #edit_tech .btn-outline-primary{
        padding: 16px 26px;
    }
    #menu_edit{
        max-width: 100% !important;
    }
}

@media (max-width:991px){
    #main_menu .col-12.col-md-6.col-lg-4{
        margin-top: 40px;
    }
}

@media (max-height:768px){
    #menu_edit .row{
        max-height: none!important;
    }
    #menu_edit .btn-menu{
        height: auto;
        width: auto;
        margin: auto;
        margin-top: 30px;
    }
}


/* edit tech, edit situation, edit_photo */
#edit_tech textarea, #edit_situation textarea, #edit_photo textarea{
    max-width: 585px;
    margin: auto;
    width: 100%;
    height: 100%;
    min-height: 220px;
    border-left: 1px solid #ABABAD;
    padding: 10px 20px;
}
.edit_tech_help{
    max-width: 585px;
    margin: auto;
    width: 100%;
}
#edit_situation textarea{
    min-height: 190px;
}
#edit_tech .btn-menu, #edit_situation .btn-menu{
    max-height: 220px;
}
span.outside-limit{
    color: var(--zse-red);
}

.btn-back{
    top: 0;
    bottom: 0;
}

.quick_menu{
    max-width: 800px;
}
.quick_menu .btn-menu{
    max-width: 150px !important;
    max-height: 150px !important;
}
.quick_menu .btn-menu img.icon{
    width: 80px !important;
    height: 80px !important;
}

.multiselect__tags, .multiselect__element, .multiselect__single, .multiselect input, .multiselect__content-wrapper{
    border-radius:  unset;
    border-top: unset;
    border-left: unset;
    border-right: unset;
    background: transparent;
    color: #ABABAD;
    border-color: #ABABAD;
}
#select_realizovatelnost .multiselect__content-wrapper, #select_wallbox .multiselect__content-wrapper{
    background: white;
}
.multiselect__option, .multiselect__option--highlight, .multiselect__option--selected.multishighlight, .multiselect__option--selected.multiselect__option--highlight{
    background: transparent;
    color: #ABABAD;
    border-color: #ABABAD;
    padding-left: 0;
}
.multiselect__tags{
    padding-left: 0;
}
.multiselect__option.multiselect__option--highlight.multiselect__option--selected{
    background: transparent;
    font-weight: 400;
}
.multiselect__option.multiselect__option--highlight::after{
    background: transparent;
    color: var(--zse-red);
}
.multiselect__option.multiselect__option--highlight.multiselect__option--selected::after{
    background: transparent;
    color: var(--zse-red);
}
.multiselect__single, .multiselect__option{
    font-size: 20px;
}

input[type="radio"] {
	accent-color: var(--zse-red);
}

/*edit basic, edit_photo */

.basic_headline{
    font-size: 25px;
    font-family: 'polobold';
    margin-top: 20px;
}

#edit_basic .abs-label, #edit_photo .abs_lavel{
    margin-left: 0 !important;
    color: #ABABAD;
    margin-top: 10px;
}
#edit_basic .form-control, #edit_photo .form-control{
    border-color: #ABABAD !important;
    padding-left: 0 !important;
    padding-bottom: 0px;
}

#edit_basic input, #edit_photo input{
    font-size: 20px;
    color: #333333 !important;
    font-family: 'poloregular';
}
.edit-img{
    width: 18px;
    position: absolute;
    right: 0;
    bottom: 8px;
}
.copy-btn{
    margin-top: 22px;
    font-size: 18px;
    color: var(--zse-red);
    line-height: 16px;
    margin-bottom: 10px;
    margin-left: auto;
}

.upload_foto_btn{
    min-height: 220px;
    border: 1px solid #ABABAD;
    display: -ms-flexbox!important;
    display: flex!important;
}
.upload_foto_btn > div{
    display: -ms-flexbox;
    display: flex; 
}
.upload_foto_btn:hover{
    cursor: pointer;
}
.upload_foto_btn div > *{
    pointer-events: none;
    color: var(--zse-red);
}

.edit_photo_btn{
    color: var(--zse-red);
    background: none;
    border: none;
    height: unset;
}
#editor_container, .TweDr, .cmtciE{
    min-height: 60vh;
}
.editor_container_wrap{
    position: fixed;
    top: 10vh;
    left: 0px;
    right: 0px;
    margin: auto;
    min-height: 60vh;
    display:none;
    z-index: 2;
    max-width: 2000px;
}
.FIE_save-file-name-input, .sc-mfrapg-1.gvaMup.SfxSelect-Container{
    display:none !important;
}
.coKTDi{
    background-color: var(--zse-red) !important;
}
:not(button) > svg:not([color]), .hnYdIA[aria-selected="true"] * {
    color: var(--zse-red) !important;
}
.FIE_topbar{
    height: 60px !important;
}
.cdXCJy, .FIE_topbar-buttons-wrapper{
    height: 100% !important; 
}
.FIE_topbar-buttons-wrapper svg{
    width: 30px !important;
    height: 30px !important;
}
.coKTDi .sc-lxwit0-0{
    font-size: 22px !important;
    font-family: 'polobold' !important;
}
.SfxIconButton-root:nth-of-type(1){
    width: 30px !important;
    margin: 0px 5px 0px 8px !important;
}
.sc-lxwit0-2.SfxIconButton-root{
    width: 35px !important;
}
.sc-lxwit0-2.SfxIconButton-root svg{
    width: 100% !important;
    height: 100% !important;
}
.iPfkPS{
    font-family: 'pololight' !important;
    font-size: 14px !important;
}

/*hide unnesesary editor options*/
.FIE_annotation-option-triggerer[title="Pozícia"], .FIE_annotation-option-triggerer[title="Tieň"],
.FIE_polygon-tool-button, .FIE_rotate-tool-button, .FIE_flip-x-tool-button, .FIE_flip-y-tool-button{
    display: none !important;
}


@media (min-width: 1200px){
    #edit_basic,  #edit_situation{
        max-width: 1400px;
    }
}

/* edit price */
.btn-upload .upload_text, .btn-download .upload_text{
    display: block;
    margin: auto;
    text-align: center;
    margin-top: 10px;
    color: var(--zse-red);
    font-size: 22px;
    font-family: 'polobold';
    cursor: pointer;
}
.btn-upload svg, .btn-download svg{
    margin: auto;
    display: block;
    cursor: pointer;
}
.btn-upload:hover, .btn-download:hover{
    cursor:pointer;
}
.btn-download svg{
    transform: rotate(180deg);
}

#edit_price .btn-menu{
    max-width: 400px;
    width: 100%;
    height: auto;
}
#cenova_ponuka_table{
    width: 100%;
}
#cenova_ponuka_table th{
    background-color: var(--zse-red);
    padding: 10px;
    border-right: 1px solid white;
    color: white;
}
#cenova_ponuka_table th:nth-of-type(1) p{
    max-width: 300px;
}
#cenova_ponuka_table th:not(:nth-of-type(1)) p{
    max-width: 112px;
    text-align: center;
}
#cenova_ponuka_table th:not(:nth-of-type(1)){
    min-width: 135px;
}

#cenova_ponuka_table td{
    padding: 20px;
}
#cenova_ponuka_table tbody tr{
    border-bottom: 1px solid #ABABAD;
}
#cenova_ponuka_table tbody tr:nth-last-of-type(1){
    border-bottom: 2px solid var(--zse-red);
}

#cenova_ponuka_table tbody tr td:nth-last-of-type(1), #cenova_ponuka_table tbody tr td:nth-last-of-type(3){
    font-family: 'polobold';
}
#cenova_ponuka_table tbody tr td:not(:nth-of-type(1)){
    text-align: right;
}
#cenova_ponuka_table tfoot tr td:nth-last-of-type(1){
    text-align: right;
}
#cenova_ponuka_table tfoot tr:nth-last-of-type(1) td{
    font-size: 26px;
}
#cenova_ponuka_table tfoot tr:nth-last-of-type(1) td:nth-last-of-type(1){
    color: var(--zse-red);
}
#cenova_ponuka_table tfoot tr:nth-of-type(1){
    border-bottom: 1px solid #ABABAD;
}
#cenova_ponuka_table tfoot tr td{
    font-family: 'poloextrabold';
}
@media (max-width:991px){
    #edit_price{
        max-width: 100% !important;
    }
}


/* created pdfs table */
#list_of_created table th, #list_of_users table th, #list_of_suppliers table th, #list_of_offers table th{
    background-color: var(--zse-red);
    padding: 10px;
    border-right: 1px solid white;
    color: white;
}
#list_of_created table td, #list_of_users table td, #list_of_suppliers table td, #list_of_offers table td{
    padding: 20px;
}
#list_of_created table tbody tr, #list_of_users table tbody tr, #list_of_suppliers table tbody tr, #list_of_offers table tbody tr{
    border-bottom: 1px solid #ABABAD;
}

.change-mode{
    background: #F21C0A;
    color: white;
    padding: 2px 10px 0px 10px;
    font-size: 16px;
    cursor: pointer;
}

/*edit user*/
#edit_user .multiselect__content{
    background: white;
}