/*
Theme Name: Teslease Enfant
Theme URI: https://teslease.re
Description: Thème Enfant de Teslease
Author: Ranking
Template:     teslease
Version:      1.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
 */

:root{
    --bg: #f7f7f8;
    --ink: #0f172a;
    --muted: #60646c;
    --brand: #111114;
    --tab-bg: #ececf0;
    --tab-active-bg: #111114;
    --tab-active-ink: #fff;
    --stroke: #e5e7eb;
    --btn-bg: #111114;
    --btn-ink: #fff;
    --radius-md: 8px;
    --shadow: 0 10px 30px rgba(17,17,20,.08);
}

/* aside#moove_gdpr_cookie_info_bar{
	display: none !important;	
}

body.admin-bar aside#moove_gdpr_cookie_info_bar{
	display: block !important;
} */

.main-contain.offcontents {
    padding-top: 200px;
    background: black;
    padding-bottom: 100px;
    text-align: center;
}

.preloader-video{
    position: fixed;
    top: 0; left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 99999999;
    overflow: hidden;
    background: black;
}

.preloader-video video{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.toggle-sound, .pass-intro {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 999999999;
    background: transparent;
    border-radius: 20px;
    cursor: pointer;
    width: 50px;
    height: 50px;
    padding: 10px;
}

.pass-intro {
    width: fit-content;
    height: fit-content;
    right: 80px;
    color: white;
    cursor: pointer;
    font-size: 12px;
}

.flatpickr-current-month select.flatpickr-monthDropdown-months {
    text-transform: capitalize;
}

.devis-form-container h2,
.devis-form-container p{
    margin: 0;
}

.devis-vehicle-form .input-container input:not([type="checkbox"]),
.devis-vehicle-form .input-container textarea,
.devis-vehicle-form .input-container select {
    display: block;
    width: 100%;
    padding: 15px;
    outline: none !important;
    background: #FFFFFF06;
    color: white;
    border-radius: 6px;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #FFFFFF33;
}

.devis-vehicle-form .input-container select option{
    color: #0a0a0a;
}

.devis-vehicle-form .input-container input[type="checkbox"] {
}

.devis-vehicle-form span.wpcf7-list-item{
    margin: 0;
}

.devis-vehicle-form .input-container p {
    margin: 0 0 10px;
}

.devis-vehicle-form .input-container input::placeholder,
.devis-vehicle-form .input-container textarea::placeholder,
.devis-vehicle-form span.wpcf7-list-item-label{
    color: white;
}

.devis-vehicle-form .small-text-form{
    line-height: 1;
    margin-bottom: 15px;
}

.devis-vehicle-form span.wpcf7-list-item-label{
    font-size: 15px;
}

.devis-vehicle-form p small{
    font-family: "Manrope", Sans-serif;
    font-size: 12px;
    font-weight: 400;
}

.devis-vehicle-form .submit-btn-container [type="submit"] {
    margin: 0 auto;
    display: block;
    padding: 15px 30px;
    border: 1px solid var(--e-global-color-primary);
    font-family: "Manrope", Sans-serif;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0px;
    color: #fff;
    border-radius: 6px;
    transition: var(--transition);
    background-color: var(--e-global-color-primary);
    box-shadow: none !important;
    outline: none !important;
}

.custom-contact-form .submit-btn-container [type="submit"]:hover,
.devis-vehicle-form .submit-btn-container [type="submit"]:hover {
    opacity: 0.8;
}

#LeasingWidgetContainer {
    right: 24%;
    bottom: 10%;
}

.leasing-widget {
    width: 420px;
    max-width: 100%;
    background: #fff;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow);
    padding: 20px;
}

/* Tabs */
.tabs {
    display: flex;
    gap: 12px;
    margin-bottom: 14px;
}

.tab {
    flex: 1;
    border: 0;
    border-radius: var(--radius-md);;
    padding: 12px 14px;
    background: var(--tab-bg);
    color: var(--ink);
    font-size: 16px;
    cursor: auto;
    transition: background .2s ease, color .2s ease, transform .02s;
}

.tab:active {
    transform: translateY(1px);
}

.tab.active {
    background: var(--tab-active-bg);
    color: var(--tab-active-ink);
}

/* Cards */
.card {
    border-radius: var(--radius-md);
    overflow: hidden;
    border: 1px solid var(--stroke);
    background: #fff;
}

.card+.card {
    margin-top: 14px;
}

.card__head {
    padding: 8px 8px;
    font-weight: 600;
    text-align: center;
    border: 2px solid;
    border-top-left-radius: var(--radius-md);
    border-top-right-radius: var(--radius-md);
}

.card__body {
    padding: 10px;
    background: #fff;
}

.subtle {
    color: var(--muted);
    font-size: 14px;
    margin: 0 0 8px 0;
}

.price-row {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.amount {
    font-size: 30px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -0.5px;
    color: #0a0a0a;
}

.price-include{
	line-height: 1;
    color: #0a0a0a;
    font-size: 10px;
    margin: 0;
}

.card hr {
    background-color: #d1d1d1;
}

.per {
    color: var(--ink);
    font-size: 16px;
}

.chip {
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
}

.card--red .card__head {
    background: var(--e-global-color-primary);
    color: white;
}

.card--inverted-red .card__head {
    background: white;
    color: var(--e-global-color-primary);
}

.vehicle-model {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 4px;
    text-align: center;
    color: #0a0a0a;
}

/* Informations de location : durée et kilométrage */
.vehicle-info {
    font-size: 14px;
    color: var(--muted);
    text-align: center;
    margin-bottom: 12px;
}

/* Prix total du véhicule */
.vehicle-price {
    font-size: 14px;
    color: var(--muted);
    text-align: center;
    margin-top: 10px;
}

/* Footer */
.catalog {
    text-align: center;
    font-size: 14px;
    color: var(--muted);
    margin: 16px 0 18px;
}

.catalog strong {
    color: var(--ink);
}

.btn {
    width: 100%;
    border: 0;
    border-radius: var(--radius-md);
    background: var(--btn-bg);
    color: var(--btn-ink);
    padding: 16px 18px;
    font-size: 16px;
    cursor: pointer;
    transition: opacity .2s ease, transform .02s;
}

.btn:active {
    transform: translateY(1px);
}

.btn:hover {
    opacity: .94;
}

.custom-contact-form *, .devis-vehicle-form *{
    font-family: "Manrope", Sans-serif;
    font-size: 15px;
}

.custom-contact-form .input-container *:not([type="checkbox"]) {
    width: 100%;
    font-family: "Manrope", Sans-serif;
    font-size: 16px;
    font-weight: 600;
}

.custom-contact-form .input-container input[type="checkbox"],
.custom-contact-form .input-container span.wpcf7-list-item{
	margin: 0;
}

.custom-contact-form .input-container p
{
	margin-top: 0;
}

.custom-contact-form .input-container input:not([type="checkbox"]),
.custom-contact-form .input-container textarea
{
	padding: 16px 10px;
	color: white;
	background: transparent;
	border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #FFFFFF33;
	border-radius: 6px;
}

.custom-contact-form .input-container input:not([type="checkbox"])::placeholder,
.custom-contact-form .input-container textarea::placeholder,
.custom-contact-form .input-container textarea::placeholder
{
	color: white;
}

.custom-contact-form [type="submit"]{
	background-color: var(--e-global-color-primary);
    padding: 12px 20px 12px 20px;
    font-family: "Manrope", Sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #FFFFFF;
    border-style: none;
    border-radius: 6px 6px 6px 6px;
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.5);
}

body .mf_select__single-value, body .mf-input-select {
    color: white !important;
}

button#DevisVehicleFormScrollBtn, section.card.card--red {
    display: none;
}

body .react-sideabr .widget_block label.wp-block-search__label, 
body .react-sideabr .widget_block h2, 
body .react-sideabr .widget-title,
body .react-sideabr .recent-post-widget .post-desc a,
body .react-sideabr section#tag_cloud-1.widget.widget_tag_cloud .tagcloud a,
body.blog .reactheme-blog .blog-item .full-blog-content .title-wrap .blog-title a,
body.archive .reactheme-blog .blog-item .full-blog-content .title-wrap .blog-title a{
    color: var(--white) !important;
}

body #reactheme-blog > div > div.contents-sticky.col-md-12.col-lg-8 > div.row > div > article > div > div.full-blog-content > div.blog-desc,
body .react-sideabr .recent-post-widget .post-desc span{
    color: var(--body-font-color)!important;
}

@media screen and (max-width:1370px) {
    #LeasingWidgetContainer {
        right: 15%;
        bottom: -5%;
    }
}

@media (max-width:1025px) {
    #LeasingWidgetContainer {
        right: 25%;
        bottom: 5%;
    }
}

@media (max-width:721px) {
    #LeasingWidgetContainer {
        right: 17%;
        bottom: 5%;
    }
}

@media (max-width:500px) {
    #LeasingWidgetContainer {
        right: 1%;
        bottom: 0;
        position: relative;
    }
}

/* Small screens */
@media (max-width:420px) {
    .amount {
        font-size: 36px;
    }

    .card__head,
    .card__body {
        padding: 16px;
    }
}