.elementor-232 .elementor-element.elementor-element-137e505{--display:flex;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-232 .elementor-element.elementor-element-80bf558{width:100%;max-width:100%;}.elementor-232 .elementor-element.elementor-element-80bf558 > .elementor-widget-container{margin:53px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-f2c1329{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-232 .elementor-element.elementor-element-10b720c{text-align:center;}.elementor-232 .elementor-element.elementor-element-10b720c .elementor-heading-title{-webkit-text-stroke-color:#000;stroke:#000;color:var( --e-global-color-accent );}.elementor-232 .elementor-element.elementor-element-7e6d1a4{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-232 .elementor-element.elementor-element-00dbe86{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-232 .elementor-element.elementor-element-9337ae7 .elementor-heading-title{color:#3A6DFF;}.elementor-232 .elementor-element.elementor-element-5ac2c5e > .elementor-widget-container{margin:-83px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-5ac2c5e .elementor-heading-title{color:var( --e-global-color-accent );}.elementor-232 .elementor-element.elementor-element-1eb158c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-232 .elementor-element.elementor-element-c19ee68 .elementor-heading-title{color:#3A6DFF;}.elementor-232 .elementor-element.elementor-element-5f82a1b > .elementor-widget-container{margin:-83px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-5f82a1b .elementor-heading-title{color:var( --e-global-color-accent );}.elementor-232 .elementor-element.elementor-element-267736a{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-232 .elementor-element.elementor-element-d19573d{width:var( --container-widget-width, 81% );max-width:81%;--container-widget-width:81%;--container-widget-flex-grow:0;color:var( --e-global-color-accent );}.elementor-232 .elementor-element.elementor-element-d19573d > .elementor-widget-container{margin:-30px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-32cf5e9{--display:flex;--min-height:0px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-232 .elementor-element.elementor-element-f635a5f{font-family:"Mulish", Sans-serif;font-weight:400;color:var( --e-global-color-accent );}.elementor-232 .elementor-element.elementor-element-ba9b9c8 > .elementor-widget-container{margin:-100px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-7ba4f5a{--display:flex;}.elementor-232 .elementor-element.elementor-element-e110021{width:100%;max-width:100%;}.elementor-232 .elementor-element.elementor-element-e110021 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-2674c50{width:100%;max-width:100%;}.elementor-232 .elementor-element.elementor-element-2674c50 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-d7df4b6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-232 .elementor-element.elementor-element-7c1ac63{color:var( --e-global-color-accent );}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-232 .elementor-element.elementor-element-17a7bae .elementor-button{background-color:#0C70FF;font-family:"Mulish", Sans-serif;font-weight:600;}.elementor-232 .elementor-element.elementor-element-17a7bae.elementor-element{--align-self:center;}.elementor-232 .elementor-element.elementor-element-658e4569{--display:flex;--min-height:329px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-232 .elementor-element.elementor-element-2fd20c02 > .elementor-widget-container{margin:74px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-2fd20c02{text-align:center;}.elementor-232 .elementor-element.elementor-element-2fd20c02 .elementor-heading-title{font-family:"Tahoma", Sans-serif;font-weight:600;}.elementor-232 .elementor-element.elementor-element-2ce50707 > .elementor-widget-container{margin:-12px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-2ce50707.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-232 .elementor-element.elementor-element-2ce50707{text-align:center;}.elementor-232 .elementor-element.elementor-element-2ce50707 .elementor-heading-title{font-family:"Mulish", Sans-serif;font-size:16px;font-weight:500;}.elementor-widget-form .elementor-field-group > label, .elementor-widget-form .elementor-field-subgroup label{color:var( --e-global-color-text );}.elementor-widget-form .elementor-field-group > label{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-field-type-html{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-field-group .elementor-field{color:var( --e-global-color-text );}.elementor-widget-form .elementor-field-group .elementor-field, .elementor-widget-form .elementor-field-subgroup label{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-form .e-form__buttons__wrapper__button-next{background-color:var( --e-global-color-accent );}.elementor-widget-form .elementor-button[type="submit"]{background-color:var( --e-global-color-accent );}.elementor-widget-form .e-form__buttons__wrapper__button-previous{background-color:var( --e-global-color-accent );}.elementor-widget-form .elementor-message{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .e-form__indicators__indicator, .elementor-widget-form .e-form__indicators__indicator__label{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-form{--e-form-steps-indicator-inactive-primary-color:var( --e-global-color-text );--e-form-steps-indicator-active-primary-color:var( --e-global-color-accent );--e-form-steps-indicator-completed-primary-color:var( --e-global-color-accent );--e-form-steps-indicator-progress-color:var( --e-global-color-accent );--e-form-steps-indicator-progress-background-color:var( --e-global-color-text );--e-form-steps-indicator-progress-meter-color:var( --e-global-color-text );}.elementor-widget-form .e-form__indicators__indicator__progress__meter{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-232 .elementor-element.elementor-element-15b2e712{width:var( --container-widget-width, 56.938% );max-width:56.938%;--container-widget-width:56.938%;--container-widget-flex-grow:0;--e-form-steps-indicators-spacing:20px;--e-form-steps-indicator-padding:30px;--e-form-steps-indicator-inactive-secondary-color:#ffffff;--e-form-steps-indicator-active-secondary-color:#ffffff;--e-form-steps-indicator-completed-secondary-color:#ffffff;--e-form-steps-divider-width:1px;--e-form-steps-divider-gap:10px;}.elementor-232 .elementor-element.elementor-element-15b2e712 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-15b2e712.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:0;}.elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-field-group{padding-right:calc( 10px/2 );padding-left:calc( 10px/2 );margin-bottom:10px;}.elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-form-fields-wrapper{margin-left:calc( -10px/2 );margin-right:calc( -10px/2 );margin-bottom:-10px;}.elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-field-group.recaptcha_v3-bottomleft, .elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-field-group.recaptcha_v3-bottomright{margin-bottom:0;}body.rtl .elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-labels-inline .elementor-field-group > label{padding-left:0px;}body:not(.rtl) .elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-labels-inline .elementor-field-group > label{padding-right:0px;}body .elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-labels-above .elementor-field-group > label{padding-bottom:0px;}.elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-field-type-html{padding-bottom:0px;font-family:"Mulish", Sans-serif;font-weight:400;}.elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-field-group:not(.elementor-field-type-upload) .elementor-field:not(.elementor-select-wrapper){background-color:#ffffff;}.elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-field-group .elementor-select-wrapper select{background-color:#ffffff;}.elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-button{font-family:"Tahoma", Sans-serif;font-weight:800;}.elementor-232 .elementor-element.elementor-element-15b2e712 .e-form__buttons__wrapper__button-next{color:#ffffff;}.elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-button[type="submit"]{color:#ffffff;}.elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-button[type="submit"] svg *{fill:#ffffff;}.elementor-232 .elementor-element.elementor-element-15b2e712 .e-form__buttons__wrapper__button-previous{color:#ffffff;}.elementor-232 .elementor-element.elementor-element-15b2e712 .e-form__buttons__wrapper__button-next:hover{color:#ffffff;}.elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-button[type="submit"]:hover{color:#ffffff;}.elementor-232 .elementor-element.elementor-element-15b2e712 .elementor-button[type="submit"]:hover svg *{fill:#ffffff;}.elementor-232 .elementor-element.elementor-element-15b2e712 .e-form__buttons__wrapper__button-previous:hover{color:#ffffff;}.elementor-232 .elementor-element.elementor-element-732cf0d6 > .elementor-widget-container{margin:-12px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-732cf0d6.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-232 .elementor-element.elementor-element-732cf0d6{text-align:center;}.elementor-232 .elementor-element.elementor-element-732cf0d6 .elementor-heading-title{font-family:"Mulish", Sans-serif;font-size:16px;font-weight:400;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-232 .elementor-element.elementor-element-2ce50707{width:var( --container-widget-width, 80% );max-width:80%;--container-widget-width:80%;--container-widget-flex-grow:0;}.elementor-232 .elementor-element.elementor-element-2ce50707.elementor-element{--align-self:center;}.elementor-232 .elementor-element.elementor-element-15b2e712{width:var( --container-widget-width, 585.891px );max-width:585.891px;--container-widget-width:585.891px;--container-widget-flex-grow:0;}.elementor-232 .elementor-element.elementor-element-732cf0d6{width:var( --container-widget-width, 80% );max-width:80%;--container-widget-width:80%;--container-widget-flex-grow:0;}.elementor-232 .elementor-element.elementor-element-732cf0d6.elementor-element{--align-self:center;}}@media(min-width:768px){.elementor-232 .elementor-element.elementor-element-00dbe86{--width:50%;}.elementor-232 .elementor-element.elementor-element-1eb158c{--width:50%;}.elementor-232 .elementor-element.elementor-element-32cf5e9{--content-width:100%;}.elementor-232 .elementor-element.elementor-element-658e4569{--content-width:1600px;}}@media(max-width:767px){.elementor-232 .elementor-element.elementor-element-5ac2c5e > .elementor-widget-container{margin:-52px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-5f82a1b > .elementor-widget-container{margin:-52px 0px 0px 0px;}.elementor-232 .elementor-element.elementor-element-d19573d{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}.elementor-232 .elementor-element.elementor-element-658e4569{--min-height:402px;}.elementor-232 .elementor-element.elementor-element-2ce50707{width:var( --container-widget-width, 88.824% );max-width:88.824%;--container-widget-width:88.824%;--container-widget-flex-grow:0;}.elementor-232 .elementor-element.elementor-element-2ce50707 .elementor-heading-title{font-size:11px;}.elementor-232 .elementor-element.elementor-element-732cf0d6{width:var( --container-widget-width, 88.824% );max-width:88.824%;--container-widget-width:88.824%;--container-widget-flex-grow:0;}.elementor-232 .elementor-element.elementor-element-732cf0d6 .elementor-heading-title{font-size:11px;}}/* Start custom CSS for text-editor, class: .elementor-element-ba9b9c8 *//* Tệp: styles.css (Cập nhật: Căn giữa các nút chọn màu) */

/* 1. IMPORT FONT MULISH TỪ GOOGLE FONTS */
@import url('https://fonts.googleapis.com/css2?family=Mulish:wght@400;600;700;800&display=swap');

/* Định nghĩa biến màu */
:root {
    --active-border-color: #3A6DFF; /* VIỀN MỚI */
    --active-text-color: #3A6DFF;
    --default-size: 30px; /* Kích thước nút tròn mặc định */
    --transition-speed: 0.3s;
}

/* 2. ÁP DỤNG FONT CHO TOÀN BỘ TRANG */
body {
    font-family: 'Mulish', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    margin: 20px;
    padding: 0;
    color: #333;
    line-height: 1.6; 
    background-color: #ffffff; 
}

/* --- VÙNG CHỨA CHUNG (Cho bộ chọn màu và ảnh) --- */
.color-picker-section {
    display: flex;
    flex-direction: column; 
    align-items: center; 
    gap: 20px; 
    margin: 40px auto;
    padding: 0;
    width: 100%;
    max-width: 900px;
    justify-content: center; 
}

/* --- HIỂN THỊ ẢNH XE --- */
.car-image-display {
    order: 1; 
    flex-grow: 1;
    max-width: 650px; 
    width: 100%; 
}

.image-wrapper {
    position: relative;
    width: 100%;
    padding-bottom: 50%; 
    overflow: hidden;
    border-radius: 8px; 
}

.image-wrapper img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: contain; 
}

/* --- KHU VỰC CHỌN MÀU VF 8 --- */
.color-selection-container {
    order: 2; 
    width: 100%;
    padding: 0 10px; 
    max-width: 650px; 
}

/* --- ĐỊNH DẠNG NÚT CHỌN MÀU (CHUYỂN ĐỔI: TRÒN -> VIÊN THUỐC) --- */
.color-options-group {
    display: flex;
    flex-direction: row; 
    flex-wrap: wrap; 
    gap: 10px; 
    width: 100%;
    /* THAY ĐỔI QUAN TRỌNG: Căn giữa các nút */
    justify-content: center; 
}

/* Kiểu dáng MẶC ĐỊNH: Nút Hình Tròn */
.color-option {
    display: flex;
    align-items: center;
    justify-content: flex-start; 
    
    width: var(--default-size);
    height: var(--default-size);
    padding: 0;
    border-radius: 50%; 
    
    border: 3px solid #ccc; 
    cursor: pointer;
    overflow: hidden; 
    
    transition: all var(--transition-speed) ease-in-out;
    
    font-size: 0; 
    color: transparent; 
}

/* Nội dung chữ (Mặc định ẩn) */
.color-text {
    white-space: nowrap; 
    opacity: 0; 
    margin-left: 0;
    padding: 0;
    transition: opacity var(--transition-speed) ease-in-out;
}


/* Kiểu dáng KHI CHỌN (ACTIVE): Nút Hình Viên Thuốc */
.color-option.active,
.color-option.active-color { 
    width: auto; 
    height: 35px; 
    padding: 0 15px; 
    border-radius: 20px; 
    
    border-color: var(--active-border-color); 
    background-color: #ffffff !important; 
    
    color: var(--active-text-color); 
    font-size: 14px; 
    font-weight: 700;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); 
    
    justify-content: flex-start;
}

/* TẠO CHẤM MÀU TRÒN */
.color-option.active-color::before {
    content: '';
    display: block;
    width: 18px; 
    height: 18px;
    border-radius: 50%;
    margin-right: 10px;
    
    background-color: inherit; 
    border: 1px solid rgba(0, 0, 0, 0.1); 
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5);
}

/* Hiển thị chữ khi active */
.color-option.active .color-text,
.color-option.active-color .color-text {
    opacity: 1; 
    margin-left: 0; 
}

/* ********** LOGIC MÀU CHỮ & VIỀN ĐẶC BIỆT KHI ACTIVE ********** */

/* Crimson Red */
.color-option[data-hex="#DC143C"].active-color { 
    color: #DC143C; 
    border-color: #DC143C; 
} 
.color-option[data-hex="#DC143C"].active-color::before { background-color: #DC143C; }

/* Jet Black */
.color-option[data-hex="#000000"].active-color { 
    color: #000000; 
    border-color: #000000; 
} 
.color-option[data-hex="#000000"].active-color::before { background-color: #000000; }

/* Infinity Blanc (Trắng) */
.color-option[data-hex="#F8F8F8"].active-color { 
    color: #333; 
    border-color: #888; 
} 
.color-option[data-hex="#F8F8F8"].active-color::before { background-color: #F8F8F8; border-color: #ccc; }

/* Ivy Green */
.color-option[data-hex="#006400"].active-color { 
    color: #006400; 
    border-color: #006400; 
} 
.color-option[data-hex="#006400"].active-color::before { background-color: #006400; }

/* Zenith Grey (Xám) */
.color-option[data-hex="#696969"].active-color { 
    color: #333; 
    border-color: #696969; 
} 
.color-option[data-hex="#696969"].active-color::before { background-color: #696969; }

/* Crimson Velvet (Mái đồng) */
.color-option[data-hex="#8B7355"].active-color { 
    color: #8B7355; 
    border-color: #8B7355; 
} 
.color-option[data-hex="#8B7355"].active-color::before { background-color: #8B7355; }

/* Zenith Grey - Desat Silver Roof (Trắng xám) */
.color-option[data-hex="#D9D9D9"].active-color { 
    color: #333; 
    border-color: #D9D9D9; 
} 
.color-option[data-hex="#D9D9D9"].active-color::before { background-color: #D9D9D9; border-color: #ccc; }

/* Jet Black - Mystery Bronze Roof (Xanh xám) */
.color-option[data-hex="#5C85A3"].active-color { 
    color: #5C85A3; 
    border-color: #5C85A3; 
} 
.color-option[data-hex="#5C85A3"].active-color::before { background-color: #5C85A3; }


/* --- RESPONSIVE --- */
@media (min-width: 769px) {
    .color-selection-container {
        max-width: 650px; 
        padding-top: 0; 
    }
}
/* Đảm bảo căn giữa trên mobile */
@media (max-width: 768px) {
    .color-selection-container {
        width: 100%;
        max-width: 100%;
        padding: 0 10px;
    }
    .color-options-group {
        justify-content: center; /* Đã được đặt, nhưng giữ lại để đảm bảo */
    }
}/* End custom CSS */