/* 1. Khai báo bộ font Product Sans */

/* Regular */
@font-face {
    font-family: 'Product Sans';
    src: url('/wp-content/themes/flatsome-child/fonts/Product Sans Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

/* Italic */
@font-face {
    font-family: 'Product Sans';
    src: url('/wp-content/themes/flatsome-child/fonts/Product Sans Italic.otf') format('opentype');
    font-weight: normal;
    font-style: italic;
}

/* Bold */
@font-face {
    font-family: 'Product Sans';
    src: url('/wp-content/themes/flatsome-child/fonts/Product Sans Bold.otf') format('opentype');
    font-weight: bold;
    font-style: normal;
}

/* Bold Italic */
@font-face {
    font-family: 'Product Sans';
    src: url('/wp-content/themes/flatsome-child/fonts/Product Sans Bold Italic.otf') format('opentype');
    font-weight: bold;
    font-style: italic;
}

/* 2. Khai báo font SVN-Revolution */
@font-face {
    font-family: 'SVN-Revolution';
    src: url('/wp-content/themes/flatsome-child/fonts/SVN-Revolution.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

html, body, p, a, span, li, h1, h2, h3, h4, h5, h6, input, button, textarea, select {
    font-family: 'Product Sans', sans-serif !important;
}

/* Thiết lập chung cho tiêu đề */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Product Sans', sans-serif !important;
    font-weight: bold;
    line-height: 1.3; /* Khoảng cách dòng vừa phải cho tiêu đề */
    color: #222; /* Màu chữ tiêu đề (đen đậm nhẹ) */
    margin-bottom: 15px;
    margin-top: 25px;
    text-rendering: optimizeLegibility;
}

/* KÍCH THƯỚC TRÊN DESKTOP (Máy tính) */
@media screen and (min-width: 850px) {
    h1 { font-size: 42px; } /* Tiêu đề trang chính */
    h2 { font-size: 32px; } /* Tiêu đề các mục lớn */
    h3 { font-size: 26px; } /* Tiêu đề mục con trong h2 */
    h4 { font-size: 22px; } /* Tiêu đề bài viết nhỏ */
    h5 { font-size: 18px; } /* Thường dùng cho label hoặc mục nhỏ */
    h6 { font-size: 16px; text-transform: uppercase; letter-spacing: 1px; } /* Rất nhỏ, thường viết hoa */
}

/* KÍCH THƯỚC TRÊN MOBILE (Điện thoại) */
@media screen and (max-width: 849px) {
    h1 { font-size: 30px; }
    h2 { font-size: 24px; }
    h3 { font-size: 20px; }
    h4 { font-size: 18px; }
    h5 { font-size: 16px; }
    h6 { font-size: 14px; }
}

.header-nav-main > li > a{
	font-size: 16px !important;
}

.header-nav.header-nav-main.nav.nav-left {
	justify-content: space-around
}


/* Container chính của nút hotline */
.hd-hotline-wrap {
    display: inline-block; /* Để nút co giãn theo nội dung */
    margin: 10px 0;
}

.hd-hotline-txt {
    display: flex;
    align-items: center;
    background-color: #1b51c9; /* Màu xanh nền */
    padding: 7px 11px; /* Padding trái nhỏ để icon nằm sát lề */
    border-radius: 5px; /* Bo góc nút */
    text-decoration: none !important;
    transition: all 0.3s ease;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* Hiệu ứng hover cho nút */
.hd-hotline-txt:hover {
    background-color: #1541a8;
    transform: translateY(-2px);
}

/* Vòng tròn trắng chứa icon */
.hd-hotline-icon {
    width: 35px;
    height: 35px;
    background-color: #fff; /* Nền trắng của icon */
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 15px;
}

/* Icon điện thoại màu đỏ */
.hd-hotline-icon i {
    color: #e12d2d; /* Màu đỏ của icon */
    font-size: 16px;
}

/* Phần chữ (Hotline và Số điện thoại) */
.hd-hotline-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.hd-hotline-info .label {
    color: #ffffff;
    font-size: 13px;
    margin: 0;
    line-height: 1.2;
    font-family: 'Product Sans', sans-serif;
    opacity: 0.9;
}

.hd-hotline-info .number {
    color: #ffffff;
    font-size: 19px;
    font-weight: bold;
    margin: 0;
    line-height: 1.2;
    font-family: 'Product Sans', sans-serif;
    letter-spacing: 0.5px;
}

/* Hiệu ứng rung nhẹ cho icon (tùy chọn để gây chú ý) */
.hd-hotline-icon i {
    animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
}

@keyframes quick-alo-circle-img-anim {
    0% { transform: rotate(0) scale(1) skew(1deg); }
    10% { transform: rotate(-25deg) scale(1) skew(1deg); }
    20% { transform: rotate(25deg) scale(1) skew(1deg); }
    30% { transform: rotate(-25deg) scale(1) skew(1deg); }
    40% { transform: rotate(25deg) scale(1) skew(1deg); }
    50% { transform: rotate(0) scale(1) skew(1deg); }
    100% { transform: rotate(0) scale(1) skew(1deg); }
}



/* Container chính - Mặc định cho Desktop (Nằm ngang) */
.info-gif {
    display: flex;
    flex-direction: row; /* Ép nằm ngang */
    align-items: center; /* Căn giữa theo chiều dọc */
    justify-content: space-between; /* Đẩy tiêu đề sang trái, nút sang phải */
    padding: 25px 40px;
    background: #ffffff;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    max-width: 1000px; /* Độ rộng tối đa trên desktop */
    border: 1px solid #eee;
    gap: 20px; /* Khoảng cách giữa chữ và nút */
}

/* Tiêu đề H2 - Bỏ margin-bottom cũ để thẳng hàng với nút */
.info-gif h2 {
    font-family: 'Product Sans', sans-serif !important;
    color: #1b51c9;
    font-size: 26px;
    font-weight: bold;
    text-transform: uppercase;
    margin: 0; /* Quan trọng để không bị lệch dòng */
    line-height: 1.2;
    text-align: left;
    flex: 1; /* Để tiêu đề chiếm không gian còn lại */
}

/* Nút gọi ngay - Giữ nguyên các hiệu ứng ấn tượng */
.btn-call-now {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(90deg, #d82d2d, #f34b4b);
    color: #fff !important;
    padding: 12px 30px;
    border-radius: 50px;
    font-size: 20px;
    font-weight: bold;
    text-decoration: none !important;
    position: relative;
    overflow: hidden;
    white-space: nowrap; /* Không cho chữ trong nút xuống dòng */
    transition: all 0.3s ease;
    box-shadow: 0 0 0 0 rgba(216, 45, 45, 0.7);
    animation: pulse-red 2s infinite;
}

/* Icon điện thoại rung */
.btn-call-now i {
    margin-right: 10px;
    font-size: 22px;
    animation: phone-shake 0.5s infinite;
}

/* Hiệu ứng ánh sáng chạy qua nút */
.btn-call-now::after {
    content: "";
    position: absolute;
    top: -50%;
    left: -60%;
    width: 20%;
    height: 200%;
    background: rgba(255, 255, 255, 0.4);
    transform: rotate(30deg);
    animation: shine 3s infinite;
}

/* CẤU HÌNH CHO MOBILE (Dưới 850px) */
@media screen and (max-width: 849px) {
    .info-gif {
        flex-direction: column; /* Chuyển thành hàng dọc */
        text-align: center;
        padding: 30px 20px;
    }

    .info-gif h2 {
        text-align: center;
        font-size: 22px;
        margin-bottom: 20px; /* Tạo khoảng cách với nút khi nằm dọc */
    }

    .btn-call-now {
        width: 100%; /* Cho nút dài hết cỡ trên mobile (tùy chọn) */
        max-width: 300px;
        font-size: 18px;
    }
}

/* CÁC ANIMATION (Giữ nguyên) */
@keyframes pulse-red {
    0% { transform: scale(0.98); box-shadow: 0 0 0 0 rgba(216, 45, 45, 0.7); }
    70% { transform: scale(1); box-shadow: 0 0 0 15px rgba(216, 45, 45, 0); }
    100% { transform: scale(0.98); box-shadow: 0 0 0 0 rgba(216, 45, 45, 0); }
}

@keyframes shine {
    0% { left: -60%; }
    20% { left: 120%; }
    100% { left: 120%; }
}

@keyframes phone-shake {
    0%, 100% { transform: rotate(0); }
    25% { transform: rotate(10deg); }
    50% { transform: rotate(-10deg); }
    75% { transform: rotate(10deg); }
}



/* Container tiêu đề */
.napu-services-header {
    margin-bottom: 20px;
	text-align: center
}

/* Tạo hình khối nghiêng (Màu xanh) */
.napu-label-skew {
    display: inline-block;
    background-color: #1b51c9; /* Màu xanh bạn yêu cầu */
    padding: 8px 30px;
    transform: skewX(-25deg); /* Làm nghiêng khối hình chữ nhật */
    margin-left: 15px; /* Để bù khoảng nghiêng không bị dính lề */
	text-transform: uppercase;
    color: #fff;
}

/* Chữ bên trong nhãn */
.napu-text-inner {
    display: inline-block;
    color: #ffffff;
    font-family: 'Product Sans', sans-serif !important;
    font-weight: bold;
    text-transform: uppercase;
    font-style: italic; /* Chữ nghiêng giống ảnh */
    font-size: 14px;
    letter-spacing: 1px;
    /* Chống nghiêng ngược lại cho chữ nếu bạn muốn chữ đứng thẳng, 
       nhưng ở đây mình để nghiêng theo khối cho giống ảnh */
    transform: skewX(0deg); 
}

/* Tiêu đề H2 bên dưới */
.napu-main-title {
    font-family: 'Product Sans', sans-serif !important;
    font-size: 32px;
    line-height: 1.2;
    color: #222;
    margin-top: 15px;
    text-transform: uppercase;
}

/* Tinh chỉnh cho Mobile */
@media screen and (max-width: 849px) {
    .napu-main-title {
        font-size: 24px;
    }
    .napu-label-skew {
        padding: 6px 20px;
    }
}

.post-item .col-inner,
.post-item .col-inner .box {
	border-radius: 10px;
}

.post-item .col-inner .box .image-cover {
	border-radius: 10px 10px 0 0;
}

.post-item .post-title a {
	font-size: 1.2rem;
}

.post-item  .is-divider {
	background: #fff;
}
.post-item .post-title a,
.post-item .from_the_blog_excerpt {
	display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.service-homepage .button.secondary {
	text-transform: capitalize
}


.service-homepage .button.is-link {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

/* Thêm icon máy bay bằng CSS */
.service-homepage .button.is-link::after {
    /* Mã Unicode của icon máy bay (Paper Plane: \f1d8 hoặc Plane: \f072) */
    content: "\f1d8"; 
    
    /* Khai báo sử dụng Font Awesome */
    font-family: "Font Awesome 5 Free"; /* Hoặc "Font Awesome 6 Free" tùy phiên bản web bạn dùng */
    font-weight: 900; /* Bắt buộc để hiện icon dạng Solid */
    
    margin-left: 10px; /* Khoảng cách với chữ Xem thêm */
    font-size: 0.9em;
    transition: all 0.3s ease; /* Tạo hiệu ứng mượt mà */
}

/* Hiệu ứng khi rê chuột vào (máy bay bay lên) */
.service-homepage .button.is-link:hover::after {
    transform: translate(8px, -8px); /* Máy bay nhích lên trên và sang phải */
    color: #fff; /* Đảm bảo màu icon luôn trắng khi hover */
}

/* Tùy chỉnh danh sách tổng thể */
.tire-features {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

/* Tùy chỉnh từng dòng trong danh sách */
.tire-features li {
    display: flex;
    align-items: center; /* Căn giữa icon và chữ theo chiều dọc */
    font-family: 'Product Sans', sans-serif !important;
    font-size: 17px;
    color: #333; /* Màu chữ chính xám đậm cho dễ đọc */
    margin-bottom: 15px; /* Khoảng cách giữa các dòng */
    line-height: 1.4;
    transition: all 0.3s ease;
}

/* Tùy chỉnh Icon màu đỏ */
.tire-features li i {
    color: #e12d2d; /* Màu đỏ nổi bật */
    font-size: 20px; /* Kích thước icon */
    margin-right: 12px; /* Khoảng cách giữa icon và chữ */
    flex-shrink: 0; /* Đảm bảo icon không bị bóp méo khi chữ dài */
    transition: transform 0.3s ease;
}

/* Hiệu ứng khi rê chuột vào dòng (tùy chọn) */
.tire-features li:hover {
    color: #e12d2d; /* Chữ chuyển sang đỏ nhẹ khi hover */
    transform: translateX(5px); /* Nhích nhẹ sang phải */
}

/* Làm icon xoay nhẹ hoặc phóng to khi hover */
.tire-features li:hover i {
    transform: scale(1.2);
}

/* Responsive cho điện thoại */
@media screen and (max-width: 849px) {
    .tire-features li {
        font-size: 16px;
        margin-bottom: 12px;
    }
}

.about-us-homepage img {
	border-radius: 20px;
}




/* KÍCH THƯỚC TRÊN DESKTOP */
@media screen and (min-width: 850px) {
    .title-about-us {
        font-size: 40px; /* Kích thước to cho dòng 1 */
		margin-bottom: 0px;
    }
    
    .title-about-us.check {
        font-size: 40px; /* Dòng 2 (Tận tâm phục vụ) to hơn nữa để tạo điểm nhấn */
        margin-bottom: 20px; /* Kéo dòng 2 sát lại dòng 1 */
    }
}

/* KÍCH THƯỚC TRÊN MOBILE */
@media screen and (max-width: 849px) {
    .title-about-us {
        font-size: 25px; /* Thu nhỏ để không bị tràn dòng trên điện thoại */
        letter-spacing: 0;
    }
    
    .title-about-us.check {
        font-size: 25px;
        margin-top: 5px;
    }
}

/* Hiệu ứng đổ bóng chữ nhẹ để tăng chiều sâu (tùy chọn) */
.title-about-us {
    text-shadow: 2px 2px 4px rgba(0,0,0,0.05);
}

.about-us-homepage p{
	text-align: justify
}




/* Tổng thể thẻ Feature Card */
.feature-card {
    border-top: 4px solid #e12d2d; /* Thanh đỏ trên đầu đúng như ảnh */
    padding: 40px 25px;
    text-align: center;
    border-radius: 4px; /* Bo góc nhẹ */
    box-shadow: 0 5px 20px rgba(0,0,0,0.05); /* Đổ bóng rất nhẹ */
    transition: all 0.3s ease;
    max-width: 400px;
	height: 100%
}

/* Hiệu ứng khi rê chuột vào card */
.feature-card:hover {
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    transform: translateY(-5px);
}

/* Tiêu đề Feature */
.feature-title {
    font-family: 'Product Sans', sans-serif !important;
    text-transform: uppercase;
    color: #111;
    font-size: 22px;
    line-height: 1.3;
    margin-bottom: 30px;
    letter-spacing: 0.5px;
}

/* Container chứa khối nghiêng */
.icon-container {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
}

/* Khối màu đỏ nghiêng */
.skew-box {
    background-color: #e12d2d;
    width: 80px;
    height: 75px;
    transform: skewX(-15deg); /* Làm nghiêng khối đỏ giống ảnh */
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
}

/* Icon bên trong khối đỏ */
.icon-img {
    width: 45px;
    height: 45px;
    /* Đảo ngược độ nghiêng để icon đứng thẳng lại */
    transform: skewX(15deg); 
    /* Nếu icon là SVG màu đen, dòng dưới sẽ biến nó thành màu trắng */
    filter: brightness(0) invert(1); 
    object-fit: contain;
}

/* Mô tả bên dưới */
.feature-desc {
    font-family: 'Product Sans', sans-serif !important;
    color: #555;
    font-size: 16px;
    line-height: 1.7;
    margin: 0;
    font-weight: 400;
}

/* Responsive cho Mobile */
@media screen and (max-width: 849px) {
    .feature-card {
        padding: 30px 20px;
    }
    .feature-title {
        font-size: 19px;
    }
    .feature-desc {
        font-size: 15px;
    }
}

.why-choose-us .col-inner {
	height: 100%;
	background: #fff;
}













/* Tổng thể card */
.info-card {
    background: #ffffff;
    border-radius: 20px; /* Bo góc tròn mịn như ảnh */
    padding: 40px 30px;
    max-width: 450px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.08); /* Đổ bóng nhẹ nhàng cao cấp */
    font-family: 'Product Sans', sans-serif !important;
}

/* Header chứa Logo */
.card-header {
    margin-bottom: 25px;
    text-align: left; /* Căn trái giống ảnh mẫu */
}

.card-logo {
    max-height: 60px; /* Điều chỉnh kích thước logo phù hợp */
    width: auto;
}

/* Đoạn giới thiệu */
.card-description {
    color: #000;
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 30px;
    text-align: left;
}

/* Danh sách thông tin */
.contact-info-list {
    display: flex;
    flex-direction: column;
}

.info-item {
    display: flex;
    justify-content: space-between; /* Đẩy label sang trái, text sang phải */
    align-items: flex-start;
    padding: 18px 0;
    border-bottom: 1px solid #eeeeee; /* Đường kẻ ngang tinh tế */
}

/* Loại bỏ đường kẻ cho mục cuối cùng */
.info-item.no-border, 
.info-item:last-child {
    border-bottom: none;
}

/* Label (Địa chỉ, Email, Gọi ngay) */
.info-item .label {
    color: #000;
    font-size: 15px;
    font-weight: 500;
    flex-shrink: 0;
    margin-right: 20px;
}

/* Nội dung (Text bên phải) */
.info-item .text {
    color: #333333;
    font-size: 15px;
    font-weight: 700; /* Chữ đậm như ảnh mẫu */
    text-align: right;
    line-height: 1.4;
}

/* Làm nổi bật số điện thoại */
.highlight-phone {
    color: #222222 !important;
    font-size: 17px !important;
}

/* Tinh chỉnh cho Mobile */
@media screen and (max-width: 600px) {
    .info-card {
        padding: 30px 20px;
        margin: 10px;
    }
    
    .info-item .label, 
    .info-item .text {
        font-size: 14px;
    }
}

.footer-1 {
	background: radial-gradient(circle at top left, #1e40af 0%, #000000 40%, #000000 100%);
}

.ux-menu-link__text {
	color: #fff;
}

.ux-menu-link__link.flex:hover {
	color: red !important;
}









/* Tổng thể khung menu */
.sidebar-menu {
    background: #ffffff; /* Đổi thành #1a1a1a nếu muốn nền tối */
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

/* Tiêu đề */
.menu-title {
    font-size: 18px;
    font-weight: 700;
    color: #1c1c1c;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Đường gạch chân trang trí */
.title-underline {
    width: 50px;
    height: 3px;
    background: #e81c2e; /* Màu đỏ làm điểm nhấn (đặc trưng ngành xe) */
    margin-bottom: 20px;
    border-radius: 2px;
}

/* Danh sách menu */
.menu-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.menu-list li {
    border-bottom: 1px solid #f0f0f0; /* Đường kẻ mờ giữa các mục */
}

.menu-list li:last-child {
    border-bottom: none;
}

/* Link menu */
.menu-list li a {
    display: block;
    padding: 12px 0;
    color: #444;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.3s ease;
    position: relative;
}

/* Hiệu ứng Hover */
.menu-list li a:hover {
    color: #e81c2e; /* Đổi màu khi di chuột vào */
    padding-left: 10px; /* Hiệu ứng đẩy sang phải nhẹ */
}

/* Thêm icon mũi tên nhỏ phía trước khi hover (tùy chọn) */
.menu-list li a:before {
    content: '→';
    position: absolute;
    left: -15px;
    opacity: 0;
    transition: all 0.3s ease;
}

.menu-list li a:hover:before {
    left: 0;
    opacity: 1;
}

.menu-list li a:hover {
    padding-left: 20px;
}


.article-inner p {
	text-align: justify
}











/* Tổng thể khung widget */
.abm-related-posts {
    background: #ffffff;
    padding: 15px;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

/* Tiêu đề chính "Bài viết liên quan" */
.abm-related-title {
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #222;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #e81c2e; /* Màu đỏ thương hiệu garage */
    display: inline-block;
}

/* Từng item bài viết */
.abm-related-item {
    margin-bottom: 18px;
    padding-bottom: 15px;
    border-bottom: 1px dashed #eee;
}

.abm-related-item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

/* Cấu trúc ảnh bên trái, chữ bên phải */
.abm-related-inner {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Hình ảnh thumbnail */
.abm-related-thumb {
    flex: 0 0 80px; /* Độ rộng cố định của ảnh */
    height: 60px;
    overflow: hidden;
    border-radius: 6px;
    display: block;
}

.abm-related-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Giúp ảnh không bị méo */
    transition: transform 0.4s ease;
}

/* Nội dung văn bản */
.abm-related-content {
    flex: 1;
}

/* Tiêu đề bài viết nhỏ */
.abm-related-item-title {
    font-size: 14px;
    line-height: 1.4;
    margin: 0 0 5px 0;
    font-weight: 600;
}

.abm-related-item-title a {
    color: #333;
    text-decoration: none;
    transition: color 0.3s;
    /* Giới hạn tiêu đề tối đa 2 dòng */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Ngày tháng */
.abm-related-meta {
    font-size: 12px;
    color: #888;
    display: flex;
    align-items: center;
}

.abm-related-meta:before {
    content: '\f017'; /* Icon đồng hồ (nếu web có fontawesome) */
    font-family: 'Font Awesome 5 Free';
    font-weight: 400;
    margin-right: 5px;
}

/* Hiệu ứng Hover */
.abm-related-item:hover .abm-related-thumb img {
    transform: scale(1.1);
}

.abm-related-item:hover .abm-related-item-title a {
    color: #e81c2e; /* Màu đỏ khi hover */
}

#respond {
	display: none
}

.service-homepage .button.primary {
	text-transform: capitalize
}










/* Khung bao ngoài */
.car-info-wrapper {
    padding: 10px;
}

/* Từng hàng thông tin */
.car-info-row {
    display: flex;
    align-items: center; /* Căn giữa icon và chữ theo chiều dọc */
    margin-bottom: 25px; /* Khoảng cách giữa các hàng */
}

/* Hình tròn đỏ chứa icon */
.car-info-icon-box {
    width: 50px;
    height: 50px;
    background-color: #f01c1c; /* Màu đỏ rực của ảnh mẫu */
    border-radius: 50%; /* Tạo hình tròn */
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px; /* Khoảng cách giữa icon và chữ */
    flex-shrink: 0;
}

/* Màu và kích thước icon trắng */
.car-info-icon-box i {
    color: #ffffff;
    font-size: 20px;
}

/* Khối nội dung chữ */
.car-info-content {
    display: flex;
    flex-direction: column;
}

/* Dòng chữ nhỏ bên trên (Nhãn) */
.car-info-label {
    font-size: 13px;
    font-weight: 600;
    color: #666666; /* Màu xám */
    text-transform: uppercase; /* Viết hoa toàn bộ */
    letter-spacing: 0.5px;
    margin-bottom: 2px;
    line-height: 1.2;
}

/* Dòng chữ to bên dưới (Chi tiết) */
.car-info-detail {
    font-size: 16px;
    font-weight: 500;
    color: #333333; /* Màu đen xám đậm */
    line-height: 1.4;
}

/* Hiệu ứng khi di chuột vào (tùy chọn để web sinh động hơn) */
.car-info-row:hover .car-info-icon-box {
    transform: scale(1.1);
    transition: 0.3s;
}

/* Tổng thể khung form */
.car-booking-form {
    max-width: 800px; /* Độ rộng tối đa của form */
    margin: 0 auto;
}

/* Chia cột cho form-row */
.form-row {
    display: flex;
    gap: 20px; /* Khoảng cách giữa 2 ô */
    margin-bottom: 20px;
}

/* Mỗi cột chiếm 50% */
.form-col {
    flex: 1;
}

/* Responsive cho điện thoại (Chuyển thành 1 cột) */
@media (max-width: 600px) {
    .form-row {
        flex-direction: column;
        gap: 20px;
    }
}

/* Định dạng tất cả các ô nhập liệu (Input, Select, Textarea, Date) */
.car-booking-form input[type="text"],
.car-booking-form input[type="tel"],
.car-booking-form input[type="date"],
.car-booking-form select,
.car-booking-form textarea {
    width: 100% !important;
    padding: 15px 20px !important;
    border: 1px solid #e1e1e1 !important;
    border-radius: 8px !important; /* Bo góc giống hình mẫu */
    background-color: #fff !important;
    color: #333 !important;
    font-size: 15px !important;
    box-shadow: none !important;
    transition: all 0.3s ease;
    height: auto !important;
}

/* Hiệu ứng khi nhấn vào ô nhập liệu */
.car-booking-form input:focus,
.car-booking-form select:focus,
.car-booking-form textarea:focus {
    border-color: #f01c1c !important; /* Đổi sang viền đỏ khi focus */
    outline: none;
    box-shadow: 0 0 8px rgba(240, 28, 28, 0.1) !important;
}

/* Định dạng riêng cho ô nội dung (Textarea) */
.car-booking-form textarea {
    height: 150px !important;
}

/* Xử lý thẻ span mặc định của Contact Form 7 */
.wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

/* Nút bấm Gửi (Submit Button) */
.car-booking-form .form-submit {
    margin-top: 10px;
}

.car-booking-form input[type="submit"] {
    background-color: #f01c1c !important; /* Màu đỏ rực chuẩn ảnh mẫu */
    color: #fff !important;
    padding: 15px 35px !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.3s ease;
}

.car-booking-form input[type="submit"]:hover {
    background-color: #d11616 !important; /* Đỏ đậm hơn khi rê chuột */
}

/* Định dạng ô chọn ngày (Date) để đồng bộ */
.car-booking-form input[type="date"] {
    min-height: 54px;
    font-family: inherit;
}