/* === GENERAL STYLES & VARIABLES === */
:root {
    --primary-color: #007BFF;
    --secondary-color: #6c757d;
    --success-color: #28a745;
    --danger-color: #dc3545;
    --warning-color: #ffc107;
    --orange-color: #fd7e14;
    --light-color: #f8f9fa;
    --dark-color: #343a40;
    --border-color: #dee2e6;
    --text-color: #212529;
    --white-color: #fff;
    --light-blue: #e7f3ff;
    --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --score-5-color: #28a745;
    --score-4-color: #ffc107;
    --score-3-color: #fd7e14;
    --score-2-color: #e74c3c;
    --score-1-color: #c0392b;
    --score-0-color: #6c757d;
}

/* === THEME DEFINITIONS === */
/* Theme Sáng (Mặc định) */
.sdp-theme-light {
    --primary-color: #007BFF;
    --secondary-color: #6c757d;
    --background-color: #f4f7f9;
    --text-color: #212529;
    --container-bg: #fff;
    --border-color: #dee2e6;
    --light-blue: #e7f3ff;
}
/* Theme Tối */
.sdp-theme-dark {
    --primary-color: #00a8ff;
    --secondary-color: #adb5bd;
    --background-color: #212529;
    --text-color: #f8f9fa;
    --container-bg: #343a40;
    --border-color: #495057;
    --light-blue: #2c3e50;
}
/* Theme Đại dương */
.sdp-theme-ocean {
    --primary-color: #1abc9c;
    --secondary-color: #95a5a6;
    --background-color: #e4f1fe;
    --text-color: #2c3e50;
    --container-bg: #ffffff;
    --border-color: #bdc3c7;
    --light-blue: #d4f1f4;
}
/* Theme Rừng xanh */
.sdp-theme-forest {
    --primary-color: #27ae60;
    --secondary-color: #828282;
    --background-color: #f2f7f2;
    --text-color: #333333;
    --container-bg: #ffffff;
    --border-color: #cccccc;
    --light-blue: #e9f7ef;
}
/* Theme Hoàng hôn */
.sdp-theme-sunset {
    --primary-color: #e67e22;
    --secondary-color: #a07d60;
    --background-color: #fdf3e6;
    --text-color: #4f3a2d;
    --container-bg: #fff;
    --border-color: #e1c09f;
    --light-blue: #fae5d3;
}


/* === STYLES FOR PRACTICE TOOL ([trinh_thi_mo_phong]) === */
.simulation-container-wrapper {
    font-family: var(--font-family);
    background-color: var(--background-color); /* SỬA */
    margin: 0;
    padding: 20px;
    color: var(--text-color); /* SỬA */
    box-sizing: border-box;
}
.simulation-container-wrapper *, .simulation-container-wrapper *::before, .simulation-container-wrapper *::after { box-sizing: border-box; }

.simulation-container-wrapper .container-inner {
    max-width: 950px;
    margin: auto;
    background: var(--container-bg); /* SỬA */
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}
.simulation-container-wrapper h1, .simulation-container-wrapper h2 {
    color: var(--text-color); /* SỬA */
    border-bottom: 2px solid var(--primary-color);
    padding-bottom: 10px;
    margin-top: 20px;
    margin-bottom: 15px;
}
.simulation-container-wrapper h1 { text-align: center; font-size: 2.2em; }
.simulation-container-wrapper h2 { font-size: 1.8em; }
.simulation-container-wrapper p, .simulation-container-wrapper li { line-height: 1.7; text-align: justify; font-size: 1.1em; color: var(--text-color); } /* SỬA */
.simulation-container-wrapper ol { padding-left: 25px; }
.simulation-container-wrapper .simulation-tool {
    margin-top: 30px;
    border: 1px solid var(--border-color); /* SỬA */
    border-radius: 8px;
    padding: 20px;
}
.simulation-container-wrapper .video-wrapper { position: relative; background: #000; border-radius: 8px; overflow: hidden; }
.simulation-container-wrapper #videoPlayer { width: 100%; display: block; height: auto; }
.simulation-container-wrapper #score-overlay { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: var(--white-color); font-size: 5em; font-weight: bold; text-shadow: 2px 2px 8px rgba(0,0,0,0.8); opacity: 0; transition: opacity 0.3s ease-in-out; pointer-events: none; }
.simulation-container-wrapper .video-info { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; padding: 0 5px; font-family: monospace; font-size: 1.1em; color: var(--text-color); } /* SỬA */
.simulation-container-wrapper .auto-next-toggle { display: flex; align-items: center; font-family: var(--font-family); font-size: 0.9em; }
.simulation-container-wrapper .auto-next-toggle label { margin: 0 0 0 8px; cursor: pointer; user-select: none; }
.simulation-container-wrapper .auto-next-toggle input { cursor: pointer; }
.simulation-container-wrapper .progress-bar-container { position: relative; width: 100%; background-color: var(--secondary-color); border-radius: 5px; margin-top: 5px; overflow: hidden; height: 20px; border: 1px solid var(--border-color); } /* SỬA */
.simulation-container-wrapper #scoreZonesContainer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.simulation-container-wrapper .score-zone { position: absolute; height: 100%; opacity: 0.8; }
.simulation-container-wrapper .score-zone-5 { background-color: var(--score-5-color); }
.simulation-container-wrapper .score-zone-4 { background-color: var(--score-4-color); }
.simulation-container-wrapper .score-zone-3 { background-color: var(--score-3-color); }
.simulation-container-wrapper .score-zone-2 { background-color: var(--score-2-color); }
.simulation-container-wrapper .score-zone-1 { background-color: var(--score-1-color); }
.simulation-container-wrapper #progressBar { position: absolute; top: 0; left: 0; height: 100%; width: 0%; background-color: var(--success-color); z-index: 5; transition: width 0.1s linear; }
.simulation-container-wrapper #userFlag { display: none; position: absolute; top: -5px; width: 3px; height: calc(100% + 10px); background-color: var(--danger-color); z-index: 10; transform: translateX(-50%); box-shadow: 0 0 5px rgba(0,0,0,0.5); }
.simulation-container-wrapper #userFlag::before { content: '▼'; color: var(--danger-color); position: absolute; top: -18px; left: 50%; transform: translateX(-50%); font-size: 16px; }
.simulation-container-wrapper .controls { display: flex; justify-content: space-between; margin-top: 15px; }
.simulation-container-wrapper .btn { padding: 12px 20px; font-size: 1em; font-weight: bold; border: none; border-radius: 6px; cursor: pointer; transition: all 0.2s ease; color: var(--white-color); background-color: var(--secondary-color); } /* SỬA */
.simulation-container-wrapper .btn:disabled { cursor: not-allowed; opacity: 0.6; }
.simulation-container-wrapper #prevBtn, .simulation-container-wrapper #nextBtn { flex-basis: 20%; }
.simulation-container-wrapper #spaceBtn { background-color: var(--primary-color); flex-basis: 55%; font-size: 1.2em; }
.simulation-container-wrapper #spaceBtn:hover { filter: brightness(90%); } /* SỬA */
.simulation-container-wrapper .utility-controls { display: flex; justify-content: center; align-items: center; gap: 15px; margin-top: 10px; }
.simulation-container-wrapper .btn-utility { padding: 8px 15px; font-size: 0.9em; background-color: #5a6268; }
.simulation-container-wrapper .btn-utility:hover { background-color: #494f54; }
.simulation-container-wrapper .info-display { display: flex; justify-content: space-between; margin-top: 20px; font-size: 1.1em; font-weight: 500; background: var(--light-blue); color: var(--text-color); padding: 15px; border-radius: 6px; } /* SỬA */
.simulation-container-wrapper .question-grid { margin-top: 20px; }
.simulation-container-wrapper .chapter-container { margin-bottom: 25px; }
.simulation-container-wrapper .chapter-title { background-color: var(--light-blue); color: var(--text-color); padding: 10px 15px; border-radius: 6px; margin-bottom: 15px; font-size: 1.1em; font-weight: bold; border-left: 5px solid var(--primary-color); } /* SỬA */
.simulation-container-wrapper .chapter-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); gap: 10px; }
.simulation-container-wrapper .question-box { padding: 10px; text-align: center; border: 1px solid var(--border-color); color: var(--text-color); border-radius: 5px; cursor: pointer; transition: all 0.2s ease; position: relative; } /* SỬA */
.simulation-container-wrapper .question-box:hover { background: var(--light-blue); } /* SỬA */
.simulation-container-wrapper .question-box.active { background-color: var(--primary-color); color: var(--white-color); border-color: var(--primary-color); } /* SỬA */
.simulation-container-wrapper .question-box .score-badge { position: absolute; top: -8px; right: -8px; background: var(--success-color); color: var(--white-color); width: 24px; height: 24px; border-radius: 50%; font-size: 0.9em; font-weight: bold; display: flex; align-items: center; justify-content: center; box-shadow: 0 1px 3px rgba(0,0,0,0.2); } /* SỬA */
.simulation-container-wrapper .question-box .score-badge.zero { background: var(--danger-color); }
.simulation-container-wrapper .results-section { display: none; text-align: center; padding: 20px; border: 2px dashed var(--primary-color); border-radius: 8px; margin-top: 20px; background: var(--light-blue); } /* SỬA */


/* === STYLES FOR TEST TOOL ([thi_thu_mo_phong_lái_xe]) === */
.simulation-wrapper { font-family: var(--font-family); background-color: var(--background-color); margin: 0; padding: 20px; color: var(--text-color); box-sizing: border-box; } /* SỬA */
.simulation-wrapper *, .simulation-wrapper *::before, .simulation-wrapper *::after { box-sizing: border-box; }
.simulation-wrapper .sim-test-container { max-width: 950px; margin: auto; background: var(--container-bg); padding: 25px; border-radius: 12px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); } /* SỬA */
.simulation-wrapper h1, .simulation-wrapper h2, .simulation-wrapper h3 { color: var(--text-color); border-bottom: 2px solid var(--primary-color); padding-bottom: 10px; margin-top: 25px; margin-bottom: 20px; } /* SỬA */
.simulation-wrapper h1 { text-align: center; font-size: 2em; border-bottom-width: 3px; }
.simulation-wrapper h2 { font-size: 1.6em; }
.simulation-wrapper h3 { font-size: 1.2em; border-bottom-style: dashed; border-bottom-color: var(--border-color); color: var(--primary-color); } /* SỬA */
.simulation-wrapper p, .simulation-wrapper li { text-align: justify; line-height: 1.7; font-size: 1.1em; }
.simulation-wrapper ul { padding-left: 20px; }
.simulation-wrapper .sim-test-video-area { margin-bottom: 20px; }
.simulation-wrapper .sim-test-video-wrapper { position: relative; background: #000; border-radius: 8px; overflow: hidden; border: 1px solid var(--border-color); }
.simulation-wrapper #sim-test-placeholderImage { width: 100%; display: block; border-radius: 8px; }
.simulation-wrapper #sim-test-videoPlayer { width: 100%; display: block; height: auto; }
.simulation-wrapper #sim-test-score-overlay { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: var(--white-color); font-size: 5em; font-weight: bold; text-shadow: 2px 2px 8px rgba(0,0,0,0.8); opacity: 0; transition: opacity 0.3s ease-in-out; pointer-events: none; } /* SỬA */
.simulation-wrapper .sim-test-progress-bar-container { position: relative; width: 100%; background-color: var(--light-blue); border-radius: 5px; margin-top: 5px; overflow: hidden; height: 15px; } /* SỬA */
.simulation-wrapper #sim-test-scoreZonesContainer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.simulation-wrapper .sim-test-score-zone { position: absolute; height: 100%; opacity: 0.8; }
.simulation-wrapper .sim-test-score-zone-5 { background-color: var(--score-5-color); }
.simulation-wrapper .sim-test-score-zone-4 { background-color: var(--score-4-color); }
.simulation-wrapper .sim-test-score-zone-3 { background-color: var(--score-3-color); }
.simulation-wrapper .sim-test-score-zone-2 { background-color: var(--score-2-color); }
.simulation-wrapper .sim-test-score-zone-1 { background-color: var(--score-1-color); }
.simulation-wrapper #sim-test-userFlag { display: none; position: absolute; top: -5px; width: 3px; height: calc(100% + 10px); background-color: var(--danger-color); z-index: 10; transform: translateX(-50%); box-shadow: 0 0 5px rgba(0,0,0,0.5); }
.simulation-wrapper #sim-test-userFlag::before { content: '▼'; color: var(--danger-color); position: absolute; top: -18px; left: 50%; transform: translateX(-50%); font-size: 16px; }
.simulation-wrapper .sim-test-playback-controls { display: flex; align-items: center; gap: 15px; margin-top: 10px; }
.simulation-wrapper .sim-test-playback-progress-bar { flex-grow: 1; height: 8px; background-color: var(--border-color); border-radius: 4px; overflow: hidden; } /* SỬA */
.simulation-wrapper #sim-test-playback-progress { width: 0; height: 100%; background-color: var(--success-color); transition: width 0.1s linear; }
.simulation-wrapper #sim-test-realtime-score { font-weight: bold; font-size: 1em; padding: 5px 10px; background-color: var(--text-color); color: var(--white-color); border-radius: 5px; white-space: nowrap; } /* SỬA */
.simulation-wrapper #sim-test-nextQuestionBtn { display: none; padding: 8px 15px; font-size: 0.9em; background-color: var(--success-color); color: var(--white-color); border: none; } /* SỬA */
.simulation-wrapper .sim-test-controls-main { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-bottom: 15px; }
.simulation-wrapper .sim-test-btn { padding: 12px 20px; font-size: 1em; font-weight: bold; border: 1px solid var(--primary-color); border-radius: 6px; cursor: pointer; transition: all 0.2s ease; color: var(--primary-color); background-color: var(--container-bg); } /* SỬA */
.simulation-wrapper .sim-test-btn:hover { background-color: var(--light-blue); }
.simulation-wrapper .sim-test-btn:disabled { cursor: not-allowed; opacity: 0.5; background-color: var(--light-blue); border-color: var(--border-color); color: var(--secondary-color); } /* SỬA */
.simulation-wrapper #sim-test-spaceBtn { color: var(--white-color); background-color: var(--primary-color); border-color: var(--primary-color); } /* SỬA */
.simulation-wrapper #sim-test-spaceBtn:hover:not(:disabled) { filter: brightness(90%); } /* SỬA */
.simulation-wrapper .sim-test-info-bar { display: flex; justify-content: space-between; padding: 10px; border: 1px solid var(--border-color); border-radius: 6px; margin-bottom: 20px; background-color: var(--light-blue); font-size: 0.9em; } /* SỬA */
.simulation-wrapper .sim-test-info-bar span { font-weight: bold; }
.simulation-wrapper .sim-test-section-title { font-size: 1.2em; font-weight: bold; color: var(--primary-color); margin-top: 30px; margin-bottom: 15px; border-bottom: 2px solid var(--light-blue); padding-bottom: 5px; } /* SỬA */
.simulation-wrapper .sim-test-section-title::before { content: '🔹'; margin-right: 8px; }
.simulation-wrapper .sim-test-custom-table { width: 100%; border-collapse: collapse; border: 1px solid var(--border-color); border-radius: 8px; overflow: hidden; font-size: 0.95em; } /* SỬA */
.simulation-wrapper .sim-test-custom-table th, .simulation-wrapper .sim-test-custom-table td { padding: 12px; text-align: center; border-bottom: 1px solid var(--border-color); vertical-align: middle; } /* SỬA */
.simulation-wrapper .sim-test-custom-table thead th { background-color: var(--light-blue); font-weight: bold; color: var(--text-color); } /* SỬA */
.simulation-wrapper .sim-test-custom-table tbody tr:last-child td { border-bottom: none; }
.simulation-wrapper .sim-test-custom-table tbody tr.active-question { background-color: var(--light-blue); font-weight: bold; }
.simulation-wrapper .sim-test-score-cell.pass { color: var(--success-color); font-weight: bold; }
.simulation-wrapper .sim-test-score-cell.fail { color: var(--danger-color); font-weight: bold; }
.simulation-wrapper .sim-test-score-cell.forgot-press { color: var(--danger-color); font-style: italic; }
.simulation-wrapper .sim-test-action-buttons { display: flex; gap: 5px; justify-content: center; }
.simulation-wrapper .sim-test-action-buttons .sim-test-btn-small { padding: 5px 10px; font-size: 0.85em; font-weight: normal; }
.simulation-wrapper .sim-test-history-section { position: relative; }
.simulation-wrapper #sim-test-clearHistoryBtn { position: absolute; top: 25px; right: 0; padding: 6px 12px; font-size: 0.85em; background-color: var(--danger-color); border-color: var(--danger-color); color: var(--white-color); } /* SỬA */
.simulation-wrapper #sim-test-clearHistoryBtn:hover { filter: brightness(90%); } /* SỬA */
.simulation-wrapper .sim-test-selection-section .sim-test-grid-buttons { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 10px; }
.simulation-wrapper .sim-test-selection-section .sim-test-btn-test { padding: 10px; font-size: 0.9em; font-weight: normal; }
.simulation-wrapper .sim-test-final-result-box { margin-top: 30px; padding: 25px; border: 2px solid var(--primary-color); border-radius: 10px; background-color: var(--light-blue); text-align: center; } /* SỬA */
.simulation-wrapper .sim-test-final-result-box h3 { margin-top: 0; border: none; text-align: center; }
.simulation-wrapper .sim-test-final-score { font-size: 2.5em; font-weight: bold; margin: 10px 0 15px 0; }
.simulation-wrapper .sim-test-final-score.pass { color: var(--success-color); }
.simulation-wrapper .sim-test-final-score.fail { color: var(--danger-color); }
.simulation-wrapper .sim-test-final-actions { display: flex; justify-content: center; gap: 15px; margin-top: 20px; flex-wrap: wrap; }
.simulation-wrapper .sim-test-final-actions .sim-test-btn { min-width: 150px; }
#sim-test-finalRetryBtn { background-color: var(--orange-color); color: var(--white-color); border-color: var(--orange-color); } /* SỬA */
#sim-test-finalNewExamBtn { background-color: var(--success-color); color: var(--white-color); border-color: var(--success-color); } /* SỬA */


/* ========================================================================= */
/* === PHIÊN BẢN TỐI ƯU MOBILE NÂNG CAO (THEO FEEDBACK) === */
/* ========================================================================= */

@media (max-width: 768px) {
    
    /* --- Giảm kích thước font chữ gốc cho toàn bộ công cụ trên mobile --- */
    .simulation-container-wrapper,
    .simulation-wrapper {
        padding: 10px;
        font-size: 14px; /* Giảm font gốc, các đơn vị em sẽ nhỏ theo */
    }
    .simulation-container-wrapper .container-inner,
    .simulation-wrapper .sim-test-container {
        padding: 10px;
    }
    .simulation-container-wrapper h1,
    .simulation-wrapper h1 {
        font-size: 1.5em; /* Nhỏ hơn */
    }
    .simulation-container-wrapper h2,
    .simulation-wrapper h2 {
        font-size: 1.2em; /* Nhỏ hơn */
    }
    .simulation-container-wrapper p, .simulation-container-wrapper li,
    .simulation-wrapper p, .simulation-wrapper li {
        font-size: 1em; /* Tương đương 14px */
    }
    .simulation-container-wrapper #score-overlay,
    .simulation-wrapper #sim-test-score-overlay {
        font-size: 3em; /* Nhỏ hơn */
    }

    /* ========================================================== */
    /* === TỐI ƯU CHI TIẾT CHO CÔNG CỤ ÔN TẬP === */
    /* ========================================================== */
    .simulation-container-wrapper .simulation-tool {
        padding: 10px;
    }
    .simulation-container-wrapper .video-info {
        font-size: 0.9em; /* Nhỏ hơn */
    }

    /* === Sắp xếp 3 nút chính trên một hàng ngang === */
    .simulation-container-wrapper .controls {
        display: flex;
        flex-direction: row; /* Quan trọng: Bắt buộc là hàng ngang */
        gap: 8px;
    }
    .simulation-container-wrapper #spaceBtn {
        flex: 2 1 auto; /* Chiếm nhiều không gian hơn, ở giữa */
        order: 0; /* Reset lại thứ tự */
        padding: 12px 5px;
        font-size: 1em; /* Tương đương 14px */
    }
    .simulation-container-wrapper #prevBtn,
    .simulation-container-wrapper #nextBtn {
        flex: 1 1 auto; /* Chiếm ít không gian hơn, ở hai bên */
        padding: 12px 5px;
        font-size: 0.85em; /* Nhỏ hơn nút Space */
    }
    /* === Kết thúc sắp xếp 3 nút === */

    .simulation-container-wrapper .utility-controls {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    .simulation-container-wrapper .btn-utility {
        font-size: 0.85em;
        padding: 8px;
    }
    
    .simulation-container-wrapper .info-display {
        flex-direction: column;
        text-align: center;
        gap: 8px;
        padding: 10px;
        font-size: 0.95em;
    }
    .simulation-container-wrapper .chapter-grid {
        grid-template-columns: repeat(auto-fill, minmax(60px, 1fr)); /* Ô nhỏ hơn */
        gap: 8px;
    }
    .simulation-container-wrapper .question-box {
        font-size: 0.9em;
        padding: 8px 5px;
    }
    .simulation-container-wrapper .question-box .score-badge {
        width: 20px;
        height: 20px;
        font-size: 0.8em;
        top: -5px;
        right: -5px;
    }

    /* ========================================== */
    /* === TỐI ƯU CHO CÔNG CỤ THI THỬ === */
    /* ========================================== */
    .simulation-wrapper .sim-test-btn {
        padding: 10px 15px;
        font-size: 0.95em;
    }
    .simulation-wrapper .sim-test-info-bar {
        flex-direction: column;
        gap: 5px;
        text-align: center;
        font-size: 0.9em;
    }
    .simulation-wrapper .sim-test-controls-main {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .simulation-wrapper .sim-test-playback-controls {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }
    .simulation-wrapper .sim-test-playback-progress-bar {
        width: 100%;
        flex-basis: 100%;
    }
    .simulation-wrapper .sim-test-custom-table th,
    .simulation-wrapper .sim-test-custom-table td {
        padding: 8px 5px;
        font-size: 0.9em;
    }
    .simulation-wrapper .sim-test-action-buttons {
        flex-direction: column;
        gap: 5px;
    }
    .simulation-wrapper #sim-test-clearHistoryBtn {
        position: static;
        width: 100%;
        margin-top: 15px;
        margin-bottom: 10px;
    }
    .simulation-wrapper .sim-test-final-actions {
        flex-direction: column;
    }
     .simulation-wrapper .sim-test-final-actions .sim-test-btn {
        width: 100%;
    }
}

/* DÁN TOÀN BỘ KHỐI NÀY VÀO CUỐI FILE assets/css/main.css */

/* ========================================================================= */
/* === LÀM NỔI BẬT TIÊU ĐỀ HƯỚNG DẪN & MIỄN TRỪ TRÁCH NHIỆM === */
/* ========================================================================= */

/* Áp dụng chung cho cả hai công cụ Ôn tập và Thi thử */
.simulation-container-wrapper .content-section,
.simulation-wrapper .content-section {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid var(--border-color);
}

/* Kiểu cho tiêu đề H2 (Hướng Dẫn) */
.content-section h2 {
    font-size: 1.5em !important; /* Tăng kích thước chữ */
    color: var(--primary-color) !important; /* Sử dụng màu chính của theme */
    border-bottom: 2px solid var(--primary-color) !important;
    padding-bottom: 10px !important;
    margin-bottom: 20px !important;
    position: relative;
    font-weight: bold;
}

/* Thêm icon quyển sách vào trước tiêu đề H2 */
.content-section h2::before {
    content: '📖'; /* Icon quyển sách */
    margin-right: 12px;
    font-size: 1.1em;
}

/* Kiểu cho tiêu đề H3 (Miễn Trừ Trách Nhiệm) */
.content-section h3 {
    font-size: 1.3em !important;
    color: var(--orange-color) !important; /* Sử dụng màu cam để nhấn mạnh */
    border-left: 4px solid var(--orange-color) !important; /* Tạo một đường kẻ dọc nổi bật */
    padding-left: 15px !important;
    border-bottom: none !important; /* Bỏ đường gạch ngang mặc định */
    margin-top: 35px !important;
    font-weight: bold;
}

/* Thêm icon cảnh báo vào trước tiêu đề H3 */
.content-section h3::before {
    content: '⚠️'; /* Icon cảnh báo */
    margin-right: 10px;
}