:root{
    --oColor: #ff0054;
    --rColor: #04063e;
    --lColor: #f9f0ec;
}
#llogaria-wrapper{
    margin-top:130px!important;
    position:relative;
}

.llogaria-sidebar{
    width:300px;
    padding: 20px;
    border-radius: 0 10px;
    background: var(--lColor);
    border: 1px solid #f9f9f9;
    box-shadow: 0 0 45px #d9d9d9;
}
.llogaria-sidebar ul li{
    list-style-type: none;
    color: var(--rColor);
    background:#fff;
    display:flex;
    align-items:center;
    gap:5px;
    padding:10px;
    cursor:pointer;
    border-radius:0 5px;
}
.llogaria-sidebar ul > :nth-child(odd){
    border-radius:5px 0;
}
.llogaria-sidebar ul li i{
    font-size:24px;
    color:var(--oColor);
    width:33px;
}
.llogaria-sidebar ul{
    margin:0!important;
}

.llogaria-content{
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    margin:30px auto;
    gap:20px;
}
.claim-img{
    width:20px;
    height:20px;
}
.llogaria-userActivity{
    width:100%;
}

.account-useful-links{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:20px;
}
.account-useful-links a{
    background:var(--lColor);
    padding:20px;
    text-decoration: none!important;
    transition:.3s ease-in-out all;
    border-radius: 0 10px;
    background: var(--lColor);
    border: 1px solid #f9f9f9;
    box-shadow: 0 0 45px #d9d9d9;
}
.account-useful-links img{
    transition:.3s ease-in-out all;
}
.account-useful-links a:hover img{
    transition:.3s ease-in-out all;
    transform:scale(1.15);
}
.account-useful-links h5{
    margin:0!important;
}
.account-useful-links div h5{
    display:flex;
    align-items:center;
    gap:20px;
}

.account-useful-links div img{
    width:80px;
    height:80px;
}

.user-arrow{
    width:25px!important;
}

.user-mainB{
    padding:10px 20px;
    background:var(--oColor);
    color:#fff!important;
    border-radius:10px;
    text-decoration: none!important;
    transition:.3s ease-in-out all;
    text-align:center;
}
.user-mainB:hover{
    background: #cc0447;
}
.compenstation-apply-titlebtn{
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    align-items:flex-end;
    gap:10px;
}
.your-claims-wrapper{
    margin-top:40px;
}
.compensation-made{
    background:var(--lColor);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content: center;
    margin-top:20px;
    padding:40px 20px;
    border-radius: 0 10px;
    background: var(--lColor);
    border: 1px solid #f9f9f9;
    box-shadow: 0 0 45px #d9d9d9;
}
.compensation-made .user-mainB{
    background:#fff;
    border:2px solid var(--oColor);
    color:var(--oColor)!important;
}
.compensation-made .user-mainB{
    background:#fff!important;
}

.withClaims{
    justify-content: flex-start;
    align-items: flex-start;
}
.withClaims ul {
    margin:0!important;
    list-style: none!important;
    display:flex;
    flex-direction:column;
    gap:30px;
    width:100%;
}
.withClaims ul li{
    background:#fff;
    border-radius:0 5px!important;
    transition:.3s ease-in-out all;
}
.withClaims ul > :nth-child(odd){
    border-radius:5px 0 !important;
}
.withClaims ul li:hover{
    transform: translateY(-10px);
}
.withClaims ul li:hover img{
    filter: brightness(0) saturate(100%) invert(16%) sepia(90%) saturate(5688%) hue-rotate(333deg) brightness(79%) contrast(103%);
}
.withClaims ul li:hover .complaintype{
    background:#cc0447;
}

.withClaims ul li a{
    font-weight:700;
    width:100%;
    padding:30px 20px;
    text-decoration: none!important;
    display:flex!important;
    flex-direction:row;
    justify-content: space-between;
    position:relative;
}
.airline, .flightdate, .claim_id{
    display:flex;
    flex-direction:column;
    justify-content: center;
    align-items:center;
}
.theflightLi{
    display:flex;
    flex-direction: row!important;
    align-items: flex-end;
}
.theflightLi span{
    max-width: 123px;
    text-align:center;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.pagination-claims{
    padding:10px 0;
    margin-top:10px;
    display:flex;
    gap:15px;
    flex-wrap:wrap;
}

.pagination-claims .page-numbers{
    font-weight:700!important;
}
.pagination-claims .current{
    color:var(--rColor)!important;
}
.pagination-claims a, .pagination-claims span{
    padding:10px;
    box-shadow:0 0 10px #d9d9d9;
    -webkit-box-shadow:0 0 10px #d9d9d9;
    border-radius:10px;
}
#mfn-header-template, .mfn-footer section{
    box-shadow:0 0 10px #d9d9d9;
    -webkit-box-shadow:0 0 10px #d9d9d9;
}
.airline :nth-child(1), .flightdate :nth-child(1), .claim_id :nth-child(1){
    color:var(--rColor);
}

.airline :nth-child(2), .flightdate :nth-child(2), .claim_id :nth-child(2){
    display:flex;
    align-items:center;
    gap:5px;
}
.complaintype{
    position:absolute;
    top:-15px;
    left:0;
    right:0;
    font-size:14px;
    font-weight:700!important;
    color:#fff;
    background:var(--oColor);
    margin:auto;
    width:max-content;
    border-radius:10px;
    padding: 3px 10px;
    transition:.3s ease-in-out all;
}


.back-img{
    display:flex;
    height:70px;
    flex-direction: row;
    gap:20px;
    background:var(--lColor);
    align-items:center;
    padding:10px 20px;
    box-shadow:0 0 10px #d9d9d9;
}
.back-img a{
    display:flex;
}
.back-img .user-mainB{
    height:max-content;
}

.claim-wrapper{
    width:100%;
    display:flex;
    flex-direction:column;
    padding:20px;
}
.claim-wrapper span{
    color:var(--rColor)!important;
}
.under-claim-type-places{
    display: flex;
    align-items: flex-end;
    gap: 5px;
}
.under-claim-type-places span{
    font-weight:700;
    font-size:20px;
    text-align:center;
}
.claim-head-info{
    display:flex;
    align-items:center;
    justify-content: space-between;
    padding:30px 0 40px 0;
    
}
.claimID, .claim-type-places{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
}
.claimID :nth-last-child(1){
    font-weight:700;
}

.outputStatus{
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content: space-between;
    padding-top:10px;
    
}
.outputStatus div{
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:10px;
}
.statusUpdated{
    flex-direction:column!important;
    font-size:14px;
    gap:0!important;
}
.claimContent{
    margin-top:20px;
    padding-bottom: 10px;
}

.borderB{
    border-bottom:2px solid var(--lColor);
}

.addBorders{
    border-left:2px solid var(--lColor);
    border-right:2px solid var(--lColor);
}
.fromTo li{
    color:var(--rColor);
    list-style-position: inside!important;
}
.fromTo{
    list-style-type: disc;
    margin-left:20px;
}
.fromTo ::marker{
    color: var(--rColor);
    font-family: "Comic Sans MS", cursive, sans-serif;
}

.flight-details{
    display:grid!important;
    grid-template-columns: 1fr 1fr 1fr!important;
    gap:15px;
    width:100%;
    margin-bottom:20px;
}
.borderT{
    border-top:2px solid var(--lColor);
}

.theflight, .disruption, .personalDetails{
    display:flex;
    flex-direction:column;
    gap:15px;
}

.theflight div, .disruption div, .personalDetails div{
    display:flex;
    flex-direction:column;
}
.theflight div :nth-last-child(1), .disruption div :nth-last-child(1), .personalDetails div :nth-last-child(1) {
    color:var(--rColor);

}

.trip-content{
    padding:20px;
    width:100%;
}

.addBB{
    background:var(--lColor);
    margin:10px auto;
    box-shadow: 0 0 10px #d9d9d9;
}

.claimApply-wrapper, .user_actions-container{
    margin-top:160px;
    margin-bottom:20px;
    color:var(--rColor)!important;
}
.back-img img{
    height: 80px !important;
}

.departion-to, .connecting-wrap{
    display:flex;
    flex-direction: row;
    gap:40px;
}
.claimApply-container-step1{
    gap:30px;
}
.claimApply-container-step1, .connecting-flights{
    display:flex;
    flex-direction:column;
    justify-content: center;
    width:100%;
    border-radius:10px 0;
}

.claimApply-container{
    display:flex;
    flex-direction:column;
    gap:30px;
    animation: fadeInLeft .3s ease-in;
}
.choose-departing, .connecting-flights{
    width:100%;
    padding:20px;
    border-radius:0 10px;
    background:var(--lColor);
    border: 1px solid #f9f9f9;
    box-shadow: 0 0 45px #d9d9d9;
}

.connecting-flights{
    border-radius: 10px 0!important;
}
.choose-departing div, .connecting-flights div{
    width:100%;
}
.connecting-wrap div{
    display:flex;
    flex-direction:row-reverse;
    align-items:center;
    justify-content: flex-end;
    gap:20px;
    background:#fff;
    border-radius: 10px;
    padding:20px;
    height:45px;
}
.claimApply-wrapper input{
    width:100%!important;
    margin:0!important;
    border:0 !important;
    border-radius:10px 0!important;
    box-shadow:0 0 20px #f9f9f9!important;
    height:45px!important;
}

.claimApply-wrapper input:focus{
    box-shadow: 0 0 40px #ddd !important;
    border-radius:0 10px!important;
}

.connecting-wrap input{
    width:max-content!important;
}
.connecting-wrap label{
    width:100%!important;
    margin:0!important;
}

.claims-by-user li{
    position:relative;
}

li{
    font-size:16px!important;
}
.gotoClaim{
    display:flex;
    align-items:center;
}
.in-case-help{
    color: var(--rColor);
        font-size: 18px;
        display: flex;
        align-items: center;
        background: var(--lColor);
        border-radius: 10px;
        padding: 10px;
        box-shadow: 0 0 10px #d9d9d9;
        
}

.risk-information i, .risk-information strong{
    color:var(--rColor);
}
.risk-information h6{
    margin-bottom:0;
}
.risk-information{
    border-bottom:1px solid var(--rColor);
    max-width:max-content;
    margin-top:20px;
}

.proceed-button{
    display:flex;
    justify-content: flex-end;
}
.bg-necessary{
    width:100%;
    padding:20px;
    border-radius:0 10px;
    background:var(--lColor);
    border: 1px solid #f9f9f9;
    box-shadow: 0 0 45px #d9d9d9;
}
.proceed-button button{
    background:var(--oColor)!important;
    color:#fff!important;
    font-weight:700;
}
.proceed-button button:hover{
    background:transparent!important;
    color:var(--oColor)!important;
}

.two-buttons{
    flex-direction:row;
    justify-content: space-between;
    gap: 10px;
}
.two-buttons .back{
    background:#fff!important;
    color:var(--oColor)!important;
}
.two-buttons .back:hover{
    background:var(--oColor)!important;
    color:#fff!important;
}

.apply-flight-date{
    display:flex;
    flex-direction:row;
    gap:20px;
    align-items: flex-end;
}


.apply-flight-date > div:nth-child(1){
    width: 30%;
}
.apply-flight-date > div:nth-last-child(1){
    width:70%;
}


@media only screen and (max-width: 340px){
    .apply-flight-date{
        flex-direction: column;
        gap:15px!important;
    }
    .apply-flight-date > div:nth-child(1){
        width: 100%!important;
    }
    .apply-flight-date > div:nth-last-child(1){
        width:100%!important;
    }
}


.information-step{
    display:flex;
    flex-direction:column;
    gap:20px;
}

.apply-flight-disruption{
    display:flex;
    flex-direction: row;
    gap:10px;
}
.apply-flight-disruption div{
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: flex-end;
    gap: 20px;
    background: #fff;
    border-radius: 10px;
    padding: 20px;
    height: 45px;
    width:100%;
}

.apply-flight-disruption input{
    width: max-content !important;
}
.apply-flight-disruption label{
    width:100%;
}
.apply-flight-disruption label{
    margin:0!important;
}

.apply-duration-delay{
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.apply-passager-info span{
    font-size:13px!important;
    font-weight:700;
}
.acceptacion input{
    width:max-content!important;
}
.acceptacion {
    display:flex;
    flex-direction:row-reverse;
    align-items:center;
    justify-content: center;
    gap:10px;
}
.acceptacion label{
    width:100%!important;
    margin:0;
}
.address-information{
    display:flex;
    flex-direction: column;
    gap:15px;
}
.city-postal{
    display:flex;
    flex-direction: row;
    gap:15px;
}
.city-postal div{
    width:100%;
}
.click-signature, .drop-documents{
    display:flex;
    flex-direction: column;
    align-items:center;
    justify-content: center;
    border-radius:10px;
    background:#fff;
    padding:40px;
    gap:20px;
    border:1px dotted var(--rColor);
    margin-bottom:20px;
    cursor:pointer;
}
.provide-signature{
    border-radius:10px;
    overflow:hidden;
    border:1px dotted var(--rColor);
    display:flex;
    width:100%;
    margin-bottom:20px;
    height:200px;
    display:none;
    animation:fadeInLeft .3s ease-in;
    position:relative;
}
.provide-signature canvas{
    background:#fff;
    width:100%;
}
.signature-icon{
    background:var(--oColor);
    display:flex;
    padding:10px;
    height:55px;
    width:55px;
    align-items:center;
    justify-content: center;
    border-radius:100%;
    
}
.signature-icon i{
    color:#fff;
    font-size:34px;
}
.click-signature h4, .drop-documents h4{
    font-weight:900;
    margin:0;
}
.accordion-content ul li{
    color:var(--rColor);
}

.what-happened textarea{
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 0 10px #d9d9d9;
    -webkit-box-shadow: 0 0 10px #d9d9d9;
}
.bg-necessary select{
    width:100%;
    max-width:400px;
}
.include-selects label{
    font-weight:400!important;
    font-size:20px!important;
    margin-bottom:10px!important;
}
.split-img-divs{
    display:flex;
    flex-direction:row;
    gap:10px;
    margin-bottom:15px;
}
.split-img-divs h6{
    margin-bottom:5px;
}
.split-img-divs i{
    font-size:20px;
    width:20px;
}

.error-message{
    color: var(--oColor)!important;
    font-weight: 700!important;
    font-size: 13px!important;
}
.addPassangers{
    position:relative;
}


/* .showDuration{
    display:none;
} */

.claimApply-container{
    display:none;
}

#step1{
    display:flex;
}
.departion-to div{
    position:relative;
}
.information-step div{
    position:relative;
}
.showAirports{
    position:absolute!important;
    width:100%!important;
    max-width:400px;
    max-height:70px;
    height:max-content;
    display:flex;
    flex-direction:column;
    overflow-y:auto;
    overflow-x:hidden;
    background:#fff;
    border-radius: 0 0 10px 10px;
    z-index:999;

}
.showAirports span{
    display:block;
    border-bottom:1px solid #f9f9f9;
    padding: 3px 10px;
    font-weight:500;
    cursor:pointer;
}
.showAirports span:hover{
    background:var(--oColor);
    color:#fff;
    border-bottom:2px solid #fff;
}
#step9 .bg-necessary{
    overflow:hidden!important;
}
.clear-signature{
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 14px;
    color: var(--oColor);
    font-weight: 700;
    background: #f9f9f9;
    box-shadow: 0 0 5px #d9d9d9;
    padding: 3px;
    cursor:pointer;
}
.fileUp-name{
    display: block;
    text-align: center;
    margin-top: 5px;
}

.showSorry{
    display:flex!important;
}
/* spinner */

.spinner-container {
    display: none; 
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: #fff;
    z-index: 9999;
    flex-direction: column;
    gap:20px;
}
.spinner-container span{
    color:var(--rColor);
    font-weight:700!important;
}

.spinner {
    border: 16px solid var(--rColor);
    border-top: 16px solid var(--oColor);
    border-radius: 50%;
    width: 80px;
    height: 80px;
    animation: spin 1s linear infinite;
}

.necessaryDocumentsWrapper{
    /* padding-top:160px!important; */
    margin-bottom:40px!important;
    width:100%;
}
.necessaryDocumentsContainer .bg-necessary{
    width:auto!important;
}
.necessaryDocumentsContainer h5{
    font-weight:500!important;
}

input:disabled {
    background-color: #eee; /* Light gray background */
    opacity: 0.5; /* Make it slightly transparent */
    cursor: not-allowed; /* Change cursor to indicate it's not clickable */
    color: #ccc; /* Lighten text color */
}

#login-message{
    text-align:center!important;
}

.necessaryFromTo span{
    font-weight:700;
    color:var(--oColor);
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    width:100%;
    max-width:max-content;
}
.necessaryFromTo{
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    text-align: center;
}
/* .necessaryFromTo #necessaryimg{
    min-width:44px!important;
} */
.user_actions-container{
    max-width:500px;
    margin-right:auto;
    margin-left:auto;
    margin-bottom:30px;
    overflow-y:auto;
}

#detajet-llogarise label{
    color:var(--rColor);
}

.detajet-llogarise_fields{
    display:flex;
    flex-direction:row;
    gap:30px;
}
.detajet-llogarise_fields div, .detajet-llogarise_fields input{
    width:100%!important;
}
.bold{
    font-weight:700!important;
}

#register-form, #login-form, #password-forget, .content-section{
    animation: fadeIn .3s ease-in;
}
#register-form, #password-forget{
    display:none;
}
.user_actions-container input, .user_actions-container button{
    width:100%!important;
}
.user_actions-container input{
    margin-bottom:0!important;
}
.img-logo{
    max-width: 200px;
    margin: auto;
    margin-bottom: 30px;
    margin-top: 15px;
}

.documentsRequired{
    display:flex;
    flex-direction: row!important;
    justify-content: space-between;
    gap:10px;
}
.addNeccesaries{
    padding: 20px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px #d9d9d9 inset;
    -webkit-box-shadow: 0 0 10px #d9d9d9 inset;
}
.addNeccesaries li{
    color: var(--oColor);
    font-size: 18px !important;
    margin: 10px;
    font-weight:700!important;
}
.addNeccesaries ul{
    list-style: circle!important;
    margin:0 20px !important;
}
.addNeccesaries i{
    color:var(--oColor);
    margin-right:5px;
}
.documentsRequired > div{
    width:100%;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@media only screen and (max-width: 1240px) {
    .llogaria-content{
        flex-direction:column;
    }
    .llogaria-sidebar{
        width:100%;
    }
    .llogaria-sidebar ul{
        display:flex;
        flex-direction:row;
        gap:20px;
    }
    .llogaria-sidebar ul li{
        margin:0!important;
    }
    .llogaria-sidebar li{
        flex:1;
    }
    .llogaria-sidebar li:nth-last-child(1){
        flex:0.5;
    }
}
.necessaryDocumentsContainer .error-message{
    display:block;
}
.necessaryResponse{
    gap:10px!important
}
.necessaryResponse p{
    margin:0!important;
}
@media only screen and (max-width: 960px){
    .claimApply-container-step1 .departion-to, .connecting-wrap{
        gap:20px!important;
    }
    .multiple-posts .claims-by-user{
        display:grid!important;
        grid-template-columns: 1fr 1fr;
        gap:20px;
    }
    .multiple-posts .claims-by-user li a{
        flex-direction: column!important;
        gap: 20px;
        align-items: flex-start;
        position:relative;
    }
    .multiple-posts .flightdate, .multiple-posts .airline, .multiple-posts .claim_id{
        align-items:flex-start;
    }
    .multiple-posts .gotoClaim{
        position:absolute;
        right:10px;
        bottom:0;
        top:0;
    }
    .claims-by-user span{
        font-size:14px!important;
        text-align: center;
        word-break: break-all;
    }
    .claim-by-user a{
        gap:5px;
    }
    .claim-by-user span{
        text-align:center
    }
    .flight-details span{
        font-size:16px!important;
    }
    .theflight div :nth-last-child(1), .disruption div :nth-last-child(1), .personalDetails div :nth-last-child(1), #h-cl {
        font-size:14px!important;
    }
    .necessaryFromTo{
        font-size:16px!important;
    }
    
}

.header-section{
    width:100%;
}

@media only screen and (max-width: 767px){
    .apply-flight-disruption{
        flex-direction: column;
        gap:15px;
    }
    .logo-wrapper{
        width:220px!important;
    }
    .claims-by-user{
        grid-template-columns: 1fr!important;
    }
    .account-useful-links h5{
        flex-direction: column;
        font-weight:700;
    }
    .account-useful-links .user-arrow{
        display:none;
    }
    .llogaria-sidebar ul{
        gap:10px;
    }
    /* .llogaria-sidebar ul li{
        font-weight:700;
    } */
    .section_wrapper{
        padding:0 10px!important;
    }
    .claim-head-info{
        padding: 30px 10px 40px 10px!important;
    }
    .in-case-help{
        font-size:16px;
    }
    .theflightLi span{
        width:100%;
        max-width:max-content;
    }
    #llogaria-wrapper{
        margin-top:100px!important;
    }
    .mfn-footer-tmpl .mcb-section:not(.full-width){
        max-width:100%!important;
        width:100%;
    }
    .header-section{
        display: grid !important;
        grid-template-columns: 1.7fr 0.3fr;
        width:auto!important;
    }
    .documentsRequired{
        flex-direction: column-reverse!important;
    }
    .documentsRequired > div{
        width:auto!important;
    }
    h4{
        font-size:18px!important;
        font-weight:500!important;
    }
    h5{
        font-size:16px!important;  
    }
    .claimApply-wrapper, .user_actions-container{
        margin-top:120px!important;
    }
    .necessaryDocumentsWrapper {
        margin-top:140px!important;
    }
    .claimApply-container label, .claimApply-container a{
        font-size:15px!important;
    }
}
.claimApply-wrapper h5, .claimApply-wrapper label{
    font-weight:500!important
}

@media only screen and (max-width: 545px){
    .apply-duration-delay{
        grid-template-columns: 1fr 1fr;
    }
}

@media only screen and (max-width: 545px){
    .account-useful-links{
        grid-template-columns: 1fr!important;
    }
    .compenstation-apply-titlebtn{
        align-items: center!important;
    }
    .detajet-llogarise_fields{
        gap:20px;
    }
    
}
@media only screen and (max-width: 500px){
    .connecting-wrap{
        flex-direction:column;
    }
    .departion-to{
        gap:20px;
    }
}
@media only screen and (max-width: 479px){
    h4{
        font-size:18px!important;
        font-weight:500!important;
    }
    h5{
        font-size:16px!important;  
    }
    .detajet-llogarise_fields{
        flex-direction: column;
        gap:10px;
    }
}

@media only screen and (max-width: 450px){
    
    .llogaria-sidebar ul li:nth-last-child(1){
        position:absolute;
        top:-8px;
        right:0;
        color:var(--oColor);
        font-weight: 900;
        text-decoration: none;
        text-transform: uppercase;
        box-shadow: 0 0 15px #d9d9d9;
        background:none;
    }
    .llogaria-sidebar ul li:nth-last-child(1) a{
        color:var(--rColor);
        font-weight:500;
    }
    .claim-head-info .claimID{
        position: absolute;
        right:20px;
        top:12px;
        gap:5px;
    }
    .header-section{
        grid-template-columns: 1fr;
    }
    .under-claim-type-places span{
        overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
    }
}
.line-clamp2{
        overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.information-step .apply-from-to{
    display:flex;
    align-items: flex-end;
}
.information-step .apply-from-to span{
    text-align: center;
}

.click-signature h4, .click-signature span, .drop-documents h4, .drop-documents span{
    text-align: center!important;
}

@media only screen and (max-width: 400px) {
    .flight-details{
        grid-template-columns: 1fr!important;
    }
    .flight-details h5{
        margin-bottom:5px!important;
    }
    .flight-details > div{
        gap:10px;
        border-bottom: 1px solid var(--lColor);
        padding-bottom: 10px;
    }
    .departion-to{
        flex-direction: column;
    }
    .apply-duration-delay{
        grid-template-columns: 1fr;
    }
}
.apply-passager-info .error-message, .addPassangers .error-message{
    display:block;
}
@media only screen and (max-width: 346px){
    .llogaria-sidebar ul li{
        flex-direction:column;
        text-align: center;
    }
    #logout{
        flex-direction: row;
    }
    .necessaryFromTo{
        flex-direction: column!important;
        align-items: center!important;
    }

}

@media only screen and (max-width: 330px){
    #logout a{
        display:none;
    }
    
}


.detajet-llogarise_fields input{
    margin-bottom:0!important;
}
.detajet-llogarise_fields{
    margin-bottom:20px;
}

#detajet-logout{
    height:100%;
}
#detajet-logout .bg-necessary{
    display:flex;
    min-height: 100%;
}
#detajet-logout .loader{
    margin:auto;
}

.passager-exit-button{
    position:absolute;
    top:10px;
    right:20px;
    font-size:28px!important;
    color:var(--rColor)!important;
    font-weight:500!important;
}

.spec-header{
    height:125px;
}



#password-criteria {
    list-style-type: disc;
    padding: 0;
}

#password-criteria li {
    margin-bottom: 5px;
}

#password-criteria .valid {
    color: var(--rColor);
}

#password-criteria .invalid {
    color: var(--oColor);
}



/* loader */
.loader {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    position: relative;
    animation: rotate 1s linear infinite;
    margin: auto;
    margin-top: 15px;
    display:none;
  }
  .loader::before , .loader::after {
    content: "";
    box-sizing: border-box;
    position: absolute;
    inset: 0px;
    border-radius: 50%;
    border: 3px solid var(--rColor);
    animation: prixClipFix 2s linear infinite ;
  }
  .loader::after{
    inset: 5px;
    transform: rotate3d(90, 90, 0, 180deg );
    border-color: var(--oColor);
  }

  @keyframes rotate {
    0%   {transform: rotate(0deg)}
    100%   {transform: rotate(360deg)}
  }

  @keyframes prixClipFix {
      0%   {clip-path:polygon(50% 50%,0 0,0 0,0 0,0 0,0 0)}
      50%  {clip-path:polygon(50% 50%,0 0,100% 0,100% 0,100% 0,100% 0)}
      75%, 100%  {clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,100% 100%,100% 100%)}
  }