:root{
    --rr-red:#e30613;
    --rr-red-dark:#c90013;
    --rr-dark:#121826;
    --rr-text:#202631;
    --rr-muted:#737984;
    --rr-border:#e1e3e7;
    --rr-bg:#f7f7f8;
    --rr-soft:#fff3f4;
    --rr-green:#25b45b;
    --rr-blue:#1871bd;
}

*{
    box-sizing:border-box;
}

body.rv-body,
body.oc-ref-reservation{
    margin:0 !important;
    background:var(--rr-bg) !important;
    color:var(--rr-text) !important;
    font-family:Arial,Helvetica,sans-serif !important;
}


/* ============================================================
   HEADER
   ============================================================ */

.rv-header{
    background:#fff !important;
    border-bottom:1px solid #e5e5e5 !important;
}

.rv-head{
    width:min(1180px,100%) !important;
    min-height:76px !important;

    margin:auto !important;
    padding:12px 22px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
}

.rv-brand{
    color:#111827 !important;
    text-decoration:none !important;

    font-size:26px !important;
    font-weight:900 !important;
    letter-spacing:-.045em !important;
}

.rv-brand b{
    color:var(--rr-red) !important;
}

.rv-phone{
    display:flex !important;
    align-items:center !important;

    color:var(--rr-red) !important;
    text-decoration:none !important;

    font-size:18px !important;
    font-weight:850 !important;
}


/* ============================================================
   GENERAL WRAPPER
   ============================================================ */

.rv-wrap{
    width:min(1120px,calc(100% - 30px)) !important;
    margin:0 auto !important;
    padding:26px 0 40px !important;
}

.rv-title{
    margin:15px 0 5px !important;

    color:var(--rr-dark) !important;

    font-size:34px !important;
    line-height:1.1 !important;
    font-weight:900 !important;
    letter-spacing:-.035em !important;
}

.rv-sub{
    margin:0 0 20px !important;

    color:var(--rr-muted) !important;

    font-size:16px !important;
    line-height:1.5 !important;
}

.rv-muted{
    color:var(--rr-muted) !important;
}


/* ============================================================
   BOOKING SUMMARY
   ============================================================ */

.rv-summary{
    margin:0 0 24px !important;
    padding:18px 20px !important;

    display:grid !important;
    grid-template-columns:2fr 1.2fr .75fr auto !important;
    gap:12px !important;

    background:#fff !important;

    border:1px solid var(--rr-border) !important;
    border-radius:16px !important;

    box-shadow:0 3px 15px rgba(0,0,0,.035) !important;
}

.rr-book-item{
    min-width:0 !important;

    display:flex !important;
    align-items:center !important;

    gap:10px !important;

    padding:7px 10px !important;
}

.rr-book-icon{
    width:40px !important;
    height:40px !important;

    flex:0 0 40px !important;

    border-radius:50% !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    color:var(--rr-red) !important;
    background:#fff0f2 !important;
}

.rr-book-icon svg{
    width:22px !important;
    height:22px !important;

    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.8 !important;
}

.rr-book-copy small{
    display:block !important;

    margin-bottom:4px !important;

    color:var(--rr-muted) !important;
    font-size:11px !important;
}

.rr-book-copy strong{
    display:block !important;

    color:var(--rr-dark) !important;

    font-size:14px !important;
    line-height:1.35 !important;
}

.rr-edit{
    align-self:center !important;

    padding:10px 13px !important;

    color:var(--rr-red) !important;
    background:#fff !important;

    border:1px solid var(--rr-red) !important;
    border-radius:8px !important;

    text-decoration:none !important;

    font-size:12px !important;
    font-weight:800 !important;
}


/* ============================================================
   INFO BAND + FILTER
   ============================================================ */

.rv-info{
    margin:16px 0 !important;
    padding:12px 15px !important;

    color:#2b689c !important;
    background:#f3f8ff !important;

    border:1px solid #a9c6e1 !important;
    border-radius:9px !important;

    font-size:13px !important;
    line-height:1.4 !important;
}

.rv-filters{
    width:100% !important;

    display:flex !important;
    gap:8px !important;

    margin:17px 0 !important;
    padding:0 0 5px !important;

    overflow-x:auto !important;
    scrollbar-width:none !important;
}

.rv-filters::-webkit-scrollbar{
    display:none !important;
}

.rv-filter{
    min-width:104px !important;
    height:44px !important;

    flex:0 0 auto !important;

    color:#333 !important;
    background:#fff !important;

    border:1px solid #ddd !important;
    border-radius:9px !important;

    font-size:13px !important;
    font-weight:750 !important;
}

.rv-filter.active{
    color:#fff !important;
    background:var(--rr-red) !important;
    border-color:var(--rr-red) !important;
}


/* ============================================================
   VEHICLE GRID
   ============================================================ */

.rv-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:18px !important;
}


/* ============================================================
   VEHICLE CARD
   ============================================================ */

.rv-card{
    overflow:hidden !important;

    background:#fff !important;

    border:1px solid var(--rr-border) !important;
    border-radius:17px !important;

    box-shadow:0 4px 16px rgba(0,0,0,.035) !important;
}

.rv-card > img{
    display:block !important;

    width:100% !important;
    height:260px !important;

    padding:25px 30px 5px !important;

    object-fit:contain !important;

    background:#fff !important;
}

.rv-card-body{
    padding:18px !important;
}

.rv-cat{
    display:inline-flex !important;

    margin:0 0 8px !important;
    padding:5px 9px !important;

    color:#fff !important;
    background:var(--rr-red) !important;

    border-radius:5px !important;

    text-transform:uppercase !important;

    font-size:11px !important;
    font-weight:850 !important;
}

.rv-card h3{
    margin:0 0 4px !important;

    color:#111 !important;

    font-size:26px !important;
    line-height:1.1 !important;
    font-weight:900 !important;
}

.rv-card-note{
    display:none !important;
}


/* SPECS */

.v3-specs{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;

    gap:7px !important;

    margin-top:15px !important;
}

.v3-spec{
    min-height:54px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    gap:5px !important;

    padding:8px 5px !important;

    color:#222 !important;
    background:#fafafa !important;

    border:1px solid #e5e5e5 !important;
    border-radius:8px !important;

    text-align:center !important;

    font-size:11px !important;
    font-weight:750 !important;
}

.v3-rental-line{
    margin-top:12px !important;
    padding:12px 14px !important;

    color:#222 !important;
    background:#fff1f2 !important;

    border-radius:9px !important;

    font-size:13px !important;
    font-weight:750 !important;
}

.v3-rental-line strong{
    color:var(--rr-red) !important;
}


/* PRICES */

.v3-price-grid{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;

    gap:9px !important;

    margin-top:10px !important;
}

.v3-price-card{
    min-height:108px !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    padding:12px !important;

    color:#171717 !important;
    background:#fff !important;

    border:1.5px solid var(--rr-red) !important;
    border-radius:9px !important;

    text-align:center !important;
}

.v3-price-card span{
    font-size:12px !important;
    font-weight:750 !important;
}

.v3-price-card strong{
    display:block !important;

    margin-top:7px !important;

    font-size:26px !important;
    line-height:1 !important;
    font-weight:900 !important;
}

.v3-price-card small{
    display:block !important;

    margin-top:7px !important;

    font-size:9.5px !important;
    line-height:1.25 !important;
}

.v3-price-card.pay-now{
    color:#fff !important;
    background:var(--rr-red) !important;
}

.v3-price-card.pay-now span,
.v3-price-card.pay-now strong,
.v3-price-card.pay-now small{
    color:#fff !important;
}


/* SELECT */

.v3-select-btn{
    width:100% !important;
    height:54px !important;

    margin-top:10px !important;

    color:#fff !important;
    background:var(--rr-red) !important;

    border:0 !important;
    border-radius:8px !important;

    font-size:19px !important;
    font-weight:850 !important;

    cursor:pointer !important;
}


/* ============================================================
   SELECTED VEHICLE - BILGILER / ONAY
   ============================================================ */

.rr-selected-card{
    margin-bottom:20px !important;
    padding:22px !important;

    background:#fff !important;

    border:1px solid var(--rr-border) !important;
    border-radius:17px !important;
}

.rr-selected-main{
    display:grid !important;
    grid-template-columns:300px minmax(0,1fr) !important;

    gap:22px !important;
    align-items:center !important;
}

.rr-selected-image{
    width:100% !important;
    height:210px !important;

    object-fit:contain !important;
}

.rr-selected-name{
    margin:0 0 12px !important;

    color:#111827 !important;

    font-size:32px !important;
    font-weight:900 !important;
}

.rr-selected-specs{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;

    gap:9px !important;
}

.rr-selected-spec{
    min-height:55px !important;

    padding:12px !important;

    display:flex !important;
    align-items:center !important;

    color:#222 !important;
    background:#fafafa !important;

    border:1px solid #e8e8e8 !important;
    border-radius:8px !important;

    font-size:13px !important;
    font-weight:750 !important;
}

.rr-price-summary{
    margin-top:18px !important;
}

.rr-rental-summary{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;

    padding:13px 17px !important;

    color:#222 !important;
    background:#fff1f2 !important;

    border-radius:9px !important;

    font-size:14px !important;
}

.rr-rental-summary strong{
    color:var(--rr-red) !important;
}

.rr-prices{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;

    gap:12px !important;

    margin-top:12px !important;
}

.rr-price{
    min-height:135px !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    padding:15px !important;

    text-align:center !important;

    border-radius:11px !important;
}

.rr-price.office{
    background:#fff !important;
    border:1.5px solid var(--rr-red) !important;
}

.rr-price.online{
    color:#fff !important;
    background:var(--rr-red) !important;
}

.rr-price span{
    font-size:14px !important;
    font-weight:750 !important;
}

.rr-price strong{
    margin-top:8px !important;

    font-size:31px !important;
    line-height:1 !important;
    font-weight:900 !important;
}

.rr-price small{
    margin-top:9px !important;

    font-size:11px !important;
}


/* ============================================================
   FORM CARD
   ============================================================ */

.form-card,
.rr-section{
    margin:18px 0 !important;
    padding:20px !important;

    background:#fff !important;

    border:1px solid var(--rr-border) !important;
    border-radius:17px !important;
}

.rr-section-title{
    margin:0 0 17px !important;

    display:flex !important;
    align-items:center !important;

    gap:8px !important;

    color:#151515 !important;

    font-size:19px !important;
    font-weight:850 !important;
}

.rr-section-title .red{
    color:var(--rr-red) !important;
}

.rr-verify-grid{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;

    margin-bottom:16px !important;
}

.rr-verify{
    padding:12px !important;

    background:#fafafa !important;

    border:1px solid #e6e6e6 !important;
    border-radius:9px !important;
}

.rr-verify strong{
    display:block !important;
    font-size:12px !important;
}

.rr-verify small{
    display:block !important;
    margin:4px 0 9px !important;

    color:var(--rr-muted) !important;
    font-size:9px !important;
}

.form-grid{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;

    gap:13px !important;
}

.field{
    display:flex !important;
    flex-direction:column !important;

    gap:6px !important;
}

.field.full{
    grid-column:1/-1 !important;
}

.field > span{
    color:#222 !important;

    font-size:12px !important;
    font-weight:750 !important;
}

.field input,
.field textarea,
.rr-verify input{
    width:100% !important;

    min-height:48px !important;

    padding:10px 12px !important;

    color:#222 !important;
    background:#fff !important;

    border:1px solid #dedede !important;
    border-radius:8px !important;

    outline:none !important;

    font-size:13px !important;
}

.field textarea{
    resize:vertical !important;
}

.primary{
    width:100% !important;
    height:54px !important;

    margin-top:15px !important;

    color:#fff !important;
    background:var(--rr-red) !important;

    border:0 !important;
    border-radius:8px !important;

    font-size:16px !important;
    font-weight:850 !important;
}


/* ============================================================
   ONAY
   ============================================================ */

.rr-page-heading{
    margin:7px 0 22px !important;
}

.rr-page-heading h1{
    margin:0 !important;

    color:#111827 !important;

    font-size:34px !important;
    font-weight:900 !important;
}

.rr-page-heading p{
    margin:8px 0 0 !important;

    color:var(--rr-muted) !important;

    font-size:15px !important;
}

.rr-two{
    display:grid !important;
    grid-template-columns:.85fr 1.35fr !important;

    gap:14px !important;
}

.rr-info-card{
    padding:18px !important;

    background:#fff !important;

    border:1px solid var(--rr-border) !important;
    border-radius:14px !important;
}

.rr-info-card h3{
    margin:0 0 14px !important;

    color:var(--rr-red) !important;

    font-size:15px !important;
    font-weight:850 !important;
}

.rr-detail{
    margin-bottom:13px !important;
}

.rr-detail small{
    display:block !important;

    margin-bottom:4px !important;

    color:var(--rr-muted) !important;
    font-size:10px !important;
}

.rr-detail strong{
    display:block !important;

    color:#222 !important;

    font-size:14px !important;
    line-height:1.4 !important;
}

.rr-approval-grid{
    display:grid !important;
    grid-template-columns:repeat(3,1fr) !important;

    gap:10px !important;
}

.rr-approval{
    padding:14px !important;

    background:#fafafa !important;

    border:1px solid #e4e4e4 !important;
    border-radius:9px !important;
}

.rr-approval strong{
    display:block !important;

    font-size:13px !important;
}

.rr-approval .state{
    display:block !important;

    margin:5px 0 !important;

    color:#2eaf61 !important;

    font-size:11px !important;
    font-weight:750 !important;
}

.rr-approval small{
    color:#555 !important;

    font-size:9px !important;
    line-height:1.4 !important;
}

.rr-customer-grid{
    display:grid !important;
    grid-template-columns:repeat(4,1fr) !important;

    gap:12px !important;
}

.rr-customer small{
    display:block !important;

    margin-bottom:6px !important;

    color:#555 !important;
    font-size:10px !important;
    font-weight:750 !important;
}

.rr-customer strong{
    display:block !important;

    color:#222 !important;
    font-size:14px !important;
}

.rr-security{
    margin-top:15px !important;
    padding:13px !important;

    color:#53606c !important;
    background:#f8fafc !important;

    border:1px solid #dde3ea !important;
    border-radius:8px !important;

    font-size:11px !important;
}

.rr-final-actions{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;

    gap:12px !important;

    margin-top:18px !important;
}

.rr-final-btn{
    min-height:64px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    gap:8px !important;

    border-radius:9px !important;

    text-decoration:none !important;

    font-size:16px !important;
    font-weight:850 !important;
}

.rr-final-btn.whatsapp{
    color:#20a856 !important;
    background:#fff !important;

    border:1.5px solid #20a856 !important;
}

.rr-final-btn.complete{
    color:#fff !important;
    background:var(--rr-red) !important;

    border:1.5px solid var(--rr-red) !important;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:760px){

    .rv-head{
        min-height:62px !important;
        padding:10px 15px !important;
    }

    .rv-brand{
        font-size:18px !important;
    }

    .rv-phone{
        font-size:12px !important;
    }

    .rv-wrap{
        width:calc(100% - 22px) !important;
        padding:18px 0 25px !important;
    }

    .rv-title{
        font-size:27px !important;
        margin-top:8px !important;
    }

    .rv-sub{
        margin-bottom:14px !important;
        font-size:13px !important;
    }


    /* booking summary */

    .rv-summary{
        grid-template-columns:1fr 1fr 70px !important;

        gap:5px !important;

        padding:9px !important;
        margin-bottom:16px !important;

        border-radius:12px !important;
    }

    .rr-book-item{
        padding:5px !important;
        gap:5px !important;
    }

    .rr-book-item:first-child{
        grid-column:1/-1 !important;
    }

    .rr-book-icon{
        width:29px !important;
        height:29px !important;
        flex-basis:29px !important;
    }

    .rr-book-icon svg{
        width:16px !important;
        height:16px !important;
    }

    .rr-book-copy small{
        font-size:7.5px !important;
    }

    .rr-book-copy strong{
        font-size:10px !important;
    }

    .rr-edit{
        padding:7px !important;

        font-size:8px !important;
    }


    /* select page */

    .rv-info{
        margin:12px 0 !important;
        padding:9px 11px !important;

        font-size:10px !important;
    }

    .rv-filters{
        margin:11px 0 !important;
    }

    .rv-filter{
        min-width:78px !important;
        height:38px !important;

        font-size:10px !important;
    }

    .rv-grid{
        grid-template-columns:1fr !important;
        gap:13px !important;
    }

    .rv-card > img{
        height:225px !important;
        padding:15px 15px 0 !important;
    }

    .rv-card-body{
        padding:14px !important;
    }

    .rv-card h3{
        font-size:24px !important;
    }

    .v3-specs{
        grid-template-columns:repeat(4,minmax(0,1fr)) !important;
        gap:5px !important;

        margin-top:10px !important;
    }

    .v3-spec{
        min-height:47px !important;
        padding:5px 3px !important;

        font-size:8px !important;
        line-height:1.2 !important;
    }

    .v3-rental-line{
        margin-top:8px !important;
        padding:10px !important;

        font-size:10px !important;
    }

    .v3-price-grid{
        gap:7px !important;
        margin-top:8px !important;
    }

    .v3-price-card{
        min-height:91px !important;

        padding:8px !important;
    }

    .v3-price-card span{
        font-size:9px !important;
    }

    .v3-price-card strong{
        font-size:22px !important;
    }

    .v3-price-card small{
        font-size:7.5px !important;
    }

    .v3-select-btn{
        height:48px !important;

        margin-top:8px !important;

        font-size:16px !important;
    }


    /* bilgiler selected */

    .rr-selected-card{
        padding:14px !important;
    }

    .rr-selected-main{
        grid-template-columns:42% 1fr !important;
        gap:10px !important;
    }

    .rr-selected-image{
        height:130px !important;
    }

    .rr-selected-name{
        margin-bottom:7px !important;
        font-size:22px !important;
    }

    .rr-selected-specs{
        gap:5px !important;
    }

    .rr-selected-spec{
        min-height:42px !important;

        padding:6px !important;

        font-size:8px !important;
    }

    .rr-rental-summary{
        padding:9px !important;
        font-size:10px !important;
    }

    .rr-price{
        min-height:100px !important;
        padding:8px !important;
    }

    .rr-price span{
        font-size:10px !important;
    }

    .rr-price strong{
        font-size:25px !important;
    }

    .rr-price small{
        font-size:8px !important;
    }


    /* form */

    .form-card,
    .rr-section{
        padding:13px !important;
        margin:12px 0 !important;

        border-radius:12px !important;
    }

    .rr-section-title{
        margin-bottom:11px !important;

        font-size:15px !important;
    }

    .rr-verify-grid{
        gap:6px !important;
        margin-bottom:11px !important;
    }

    .rr-verify{
        padding:8px !important;
    }

    .rr-verify strong{
        font-size:9px !important;
    }

    .rr-verify small{
        margin:2px 0 6px !important;
        font-size:7px !important;
    }

    .form-grid{
        gap:8px !important;
    }

    .field > span{
        font-size:9px !important;
    }

    .field input,
    .field textarea,
    .rr-verify input{
        min-height:43px !important;

        padding:8px !important;

        font-size:10px !important;
    }

    .primary{
        height:48px !important;
        margin-top:11px !important;

        font-size:13px !important;
    }


    /* onay */

    .rr-page-heading h1{
        font-size:27px !important;
    }

    .rr-page-heading p{
        font-size:12px !important;
    }

    .rr-two{
        grid-template-columns:1fr 1.3fr !important;
        gap:8px !important;
    }

    .rr-info-card{
        padding:11px !important;
    }

    .rr-info-card h3{
        margin-bottom:10px !important;
        font-size:11px !important;
    }

    .rr-detail small{
        font-size:7px !important;
    }

    .rr-detail strong{
        font-size:10px !important;
    }

    .rr-approval-grid{
        gap:5px !important;
    }

    .rr-approval{
        padding:8px !important;
    }

    .rr-approval strong{
        font-size:8px !important;
    }

    .rr-approval .state{
        font-size:7px !important;
    }

    .rr-approval small{
        font-size:6px !important;
    }

    .rr-customer-grid{
        gap:6px !important;
    }

    .rr-customer small{
        font-size:7px !important;
    }

    .rr-customer strong{
        font-size:9px !important;
    }

    .rr-final-btn{
        min-height:54px !important;
        font-size:12px !important;
    }

}


@media(max-width:390px){

    .rv-brand{
        font-size:16px !important;
    }

    .rv-phone{
        font-size:10.5px !important;
    }

    .rr-selected-main{
        grid-template-columns:1fr !important;
    }

    .rr-selected-image{
        height:165px !important;
    }

    .rr-two{
        grid-template-columns:1fr !important;
    }

}