/* =====================================================
   HOTEL FINDER PRO
   FRONTEND.CSS
   Premium Version
   ===================================================== */


/* =====================================================
   FONT & GENEL
   ===================================================== */

.hfp-results,
.hfp-card,
.hfp-card *{

    font-family:"Montserrat",sans-serif;

    box-sizing:border-box;

}

.hfp-results{

    max-width:1140px;

    margin:50px auto;

    padding:0 20px;

}


/* =====================================================
   HOTEL CARD
   ===================================================== */

.hfp-card{

    max-width:920px;

    margin:40px auto;

    background:#ffffff;

    border:1px solid #e9edf3;

    border-radius:22px;

    overflow:hidden;

    box-shadow:

        0 10px 35px rgba(0,0,0,.06),

        0 2px 10px rgba(0,0,0,.04);

    transition:

        transform .30s ease,

        box-shadow .30s ease;

}

.hfp-card:hover{

    transform:translateY(-8px);

    box-shadow:

        0 18px 45px rgba(0,0,0,.10),

        0 5px 18px rgba(0,0,0,.08);

}

.hfp-card-link{

    display:block;

    text-decoration:none;

    color:inherit;

}


/* =====================================================
   FOTOĞRAF
   ===================================================== */

.hfp-card-image-wrapper{

    position:relative;

    overflow:hidden;

}

.hfp-card-image{

    width:100%;

    height:280px;

    display:block;

    object-fit:cover;

    vertical-align:middle;

    transition:transform .55s ease;

}

.hfp-card:hover .hfp-card-image{

    transform:scale(1.04);

}

.hfp-card-image-placeholder{

    width:100%;

    height:280px;

    display:flex;

    justify-content:center;

    align-items:center;

    background:#eef2f7;

    color:#7b8794;

    font-size:18px;

    font-weight:600;

}


/* =====================================================
   BADGES
   ===================================================== */

.hfp-recommended-badge{

    position:absolute;

    top:20px;

    left:20px;

    background:linear-gradient(135deg,#071a46,#0d2b63);
border:1px solid rgba(230,189,88,.75);

    color:#f2cf70;

    padding:10px 18px;

    border-radius:999px;

    font-size:14px;

    font-weight:700;

    letter-spacing:.2px;

    box-shadow:0 8px 20px rgba(7,26,70,.25);

    z-index:20;

}

.hfp-stars-badge{

    position:absolute;

    top:20px;

    right:20px;

    background:linear-gradient(135deg,#071a46,#0d2b63);
border:1px solid rgba(230,189,88,.75);
color:#f2cf70;

    padding:10px 18px;

    border-radius:999px;

    font-size:15px;

    font-weight:800;

    letter-spacing:1px;

    box-shadow:0 8px 20px rgba(7,26,70,.25);

    z-index:20;

}
/* =====================================================
   CARD BODY
   ===================================================== */

.hfp-card-body{

    padding:24px;

}

.hfp-top-row{

    display:flex;

    gap:18px;

    align-items:flex-start;

    margin-bottom:20px;

}


/* =====================================================
   SCORE BOX
   ===================================================== */

.hfp-score-box{

    width:165px;

    min-width:165px;

    background:linear-gradient(145deg,#071a46,#0d2b63);

    border:1px solid #d6ad4b;

    border-radius:18px;

    padding:18px 14px;

    text-align:center;

    box-shadow:0 8px 24px rgba(7,26,70,.18);

}

.hfp-score-number{

    font-size:44px;

    font-weight:900;

    line-height:1;

    color:#e6bd58;

}

.hfp-score-text{

    margin-top:10px;
font-size:11px;
font-weight:700;
color:#ffffff;
text-transform:uppercase;
letter-spacing:.3px;
line-height:1.5;
overflow-wrap:anywhere;

}


/* =====================================================
   WHY BOX
   ===================================================== */

.hfp-why-box{

    flex:1;

    background:#f8fafc;

    border:1px solid #d9e0ea;

    border-radius:20px;

    padding:20px 24px;

    box-shadow:0 8px 24px rgba(7,26,70,.08);


}

.hfp-why-title{

    display:flex;

    align-items:center;

    gap:10px;

    margin:0 0 14px;

    font-size:23px;

    font-weight:800;

    color:#071a46;

    line-height:1.2;


}

.hfp-why-list{

    list-style:none;

    margin:0;

    padding:0;

}


.hfp-why-list li{

     margin:6px 0;

    font-size:14px;

    font-weight:500;

    line-height:1.5;

    color:#26354d;

}
.hfp-more-reasons{
    color:#9a741c !important;
    font-weight:700 !important;
    margin-top:10px !important;
}
/* =====================================================
   HOTEL INFO
   ===================================================== */

.hfp-info{

    display:flex;

    flex-direction:column;

    gap:12px;

}

.hfp-title{
    margin:0;
    font-size:28px;
    font-family:inherit !important;
    font-weight:800 !important;
    line-height:1.2;
    letter-spacing:-0.4px;
    color:#071a46;
    word-break:break-word;
}
.hfp-title:hover{

    color:#1877f2;

}


/* =====================================================
   META
   ===================================================== */

.hfp-meta{

    display:flex;

    flex-wrap:wrap;

    gap:10px 20px;

}

.hfp-location,
.hfp-meta-item{

    display:flex;

    align-items:center;

    gap:8px;

    font-size:15px;

    font-weight:600;

    color:#6b7280;

}


/* =====================================================
   BUTTON
   ===================================================== */

.hfp-button-wrap{

    margin-top:8px;

}

.hfp-button{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    min-width:220px;

    height:56px;

    padding:0 26px;

    background:#1877f2;

    color:#ffffff;
-webkit-text-fill-color:#ffffff;

    text-decoration:none;

    border-radius:12px;

    font-size:16px;

    font-weight:800;

    text-decoration:none;

    transition:all .25s ease;

    box-shadow:0 8px 18px rgba(24,119,242,.25);

}

.hfp-button:hover{

    background:#1669d8;

    transform:translateY(-2px);

    box-shadow:0 14px 28px rgba(24,119,242,.35);

}

/* =====================================================
   HOTEL FINDER - BUSINESS CLASS
   ===================================================== */

.hfp-finder select{
    width:100%;
    height:52px;

    padding:0 16px;

    background:#ffffff;
    color:#071a46;

    border:2px solid #d9e0ea;
    border-radius:10px;

    font-size:16px;
    font-weight:600;

    outline:none;

    transition:border-color .2s ease,
               box-shadow .2s ease;
}

.hfp-finder select:focus{
    border-color:#d6ad4b;
    box-shadow:0 0 0 3px rgba(214,173,75,.15);
}

/* =====================================================
   HOTEL FINDER - CHECKBOXES
   ===================================================== */

.hfp-finder .hfp-checkbox-section{
    margin-top:22px;
}

.hfp-finder .hfp-checkbox-section > label:first-child{
    display:block;
    margin-bottom:10px;

    color:#071a46;

    font-size:17px;
    font-weight:800;
}

.hfp-finder .hfp-checkbox-item{
    display:inline-flex;
    align-items:center;
    gap:9px;

    margin:0 8px 9px 0;
    padding:10px 14px;

    background:#f8fafc;
    color:#26354d;

    border:1px solid #d9e0ea;
    border-radius:10px;

    font-size:14px;
    font-weight:600;

    cursor:pointer;

    transition:all .2s ease;
}

.hfp-finder .hfp-checkbox-item:hover{
    border-color:#d6ad4b;
    background:#ffffff;

    box-shadow:0 5px 14px rgba(7,26,70,.08);

    transform:translateY(-1px);
}

.hfp-finder .hfp-checkbox-item input[type="checkbox"]{
    width:17px;
    height:17px;

    margin:0;

    accent-color:#071a46;

    cursor:pointer;
}

/* Seçili checkbox - Business Class */

.hfp-finder .hfp-checkbox-item:has(input[type="checkbox"]:checked){
    background:linear-gradient(135deg,#071a46,#0d2b63);
    color:#ffffff;

    border-color:#d6ad4b;

    box-shadow:0 6px 16px rgba(7,26,70,.18);
}

.hfp-finder .hfp-checkbox-item:has(input[type="checkbox"]:checked):hover{
    background:linear-gradient(135deg,#0d2b63,#071a46);
    color:#ffffff;

    border-color:#e6bd58;
}

.hfp-finder .hfp-checkbox-item:has(input[type="checkbox"]:checked)
input[type="checkbox"]{
    accent-color:#d6ad4b;
}

/* =====================================================
   HOTEL FINDER - FIND BUTTON
   ===================================================== */

.hfp-finder button[type="submit"]{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:52px;
    padding:0 28px;

    background:linear-gradient(135deg,#071a46,#0d2b63);
    color:#ffffff;

    border:1px solid #d6ad4b;
    border-radius:10px;

    font-size:15px;
    font-weight:800;
    letter-spacing:.2px;

    cursor:pointer;

    box-shadow:0 7px 18px rgba(7,26,70,.18);

    transition:all .2s ease;
}

.hfp-finder button[type="submit"]:hover{
    background:linear-gradient(135deg,#0d2b63,#071a46);
    color:#ffffff;

    border-color:#e6bd58;

    transform:translateY(-2px);

    box-shadow:0 10px 22px rgba(7,26,70,.25);
}

.hfp-finder button[type="submit"]:active{
    transform:translateY(0);
}

/* =====================================================
   RESPONSIVE
   ===================================================== */

@media (max-width: 992px){

    .hfp-card-body{
        padding:26px;
    }

    .hfp-top-row{
        flex-direction:column;
        align-items:stretch;
        gap:16px;
    }

    .hfp-score-box{
        width:100%;
        min-width:100%;
        box-sizing:border-box;

        background:linear-gradient(145deg,#071a46,#0d2b63);
        border:1px solid #d6ad4b;

        text-align:center;

        box-shadow:0 8px 24px rgba(7,26,70,.18);
    }

    .hfp-score-number{
        color:#e6bd58;
    }

    .hfp-score-text{
        color:#ffffff;
        overflow-wrap:normal;
        word-break:normal;
    }

    .hfp-why-box{
        width:100%;
        box-sizing:border-box;

        background:#f8fafc;
        border:1px solid #d9e0ea;

        box-shadow:0 8px 24px rgba(7,26,70,.08);
    }

    .hfp-why-title{
        color:#071a46;
    }
}


@media (max-width: 768px){

    .hfp-results{
        padding:0 15px;
    }

    .hfp-card{
        margin:25px auto;
        border-radius:18px;
    }

    .hfp-card-image,
    .hfp-card-image-placeholder{
        height:240px;
    }

    .hfp-card-body{
        padding:20px;
    }

    .hfp-top-row{
        flex-direction:column;
        align-items:stretch;
        gap:16px;
        margin-bottom:20px;
    }

    .hfp-score-box{
        width:100%;
        min-width:100%;
        box-sizing:border-box;

        padding:18px 14px;

        background:linear-gradient(145deg,#071a46,#0d2b63);
        border:1px solid #d6ad4b;
        border-radius:18px;

        box-shadow:0 8px 24px rgba(7,26,70,.18);
    }

    .hfp-score-number{
        color:#e6bd58;
    }

    .hfp-score-text{
        color:#ffffff;
        overflow-wrap:normal;
        word-break:normal;
    }

    .hfp-why-box{
        width:100%;
        box-sizing:border-box;

        padding:20px 24px;

        background:#f8fafc;
        border:1px solid #d9e0ea;
        border-radius:20px;

        box-shadow:0 8px 24px rgba(7,26,70,.08);
    }

    .hfp-why-title{
        color:#071a46;
    }

    .hfp-title{
        font-size:28px;
    }

    .hfp-meta{
        flex-direction:column;
        gap:12px;
    }

    .hfp-button{
        width:100%;
        min-width:100%;
    }
}


@media (max-width: 480px){

    .hfp-card-image,
    .hfp-card-image-placeholder{
        height:200px;
    }

    .hfp-card-body{
        padding:16px;
    }

    .hfp-score-box{
        padding:16px 12px;
    }

    .hfp-score-number{
        font-size:42px;
    }

    .hfp-score-text{
        font-size:11px;
        line-height:1.5;
        letter-spacing:.3px;
    }

    .hfp-why-box{
        padding:18px;
    }

    .hfp-why-title{
        font-size:20px;
    }

    .hfp-title{
        font-size:24px;
    }
}

/* MEHR ERFAHREN BUTTON - BUSINESS */

.hfp-button {
    background: #082b63 !important;
    color: #ffffff !important;
    border: 1px solid #d6a928 !important;
}

.hfp-button:hover {
    background: #061f49 !important;
    color: #ffffff !important;
    border-color: #d6a928 !important;
}