/* styles/terms-privacy.css */

/* Variables (Ensure these are consistent with your theme or define fallbacks) */
:root {
    --legal-text-color: #333; /* For main paragraph text */
    --legal-heading-color: #1a2b3c; /* For h1, h2 headings */
    --legal-link-color: var(--primary-blue, #007bff); /* Your primary blue */
    --legal-icon-color: var(--primary-blue, #007bff);
    --legal-accent-bg: #f0f4f8; /* For the "last updated" note */
    --legal-content-bg: #ffffff;
    --legal-max-width: 800px; /* Max width for the content block */
}

body {
    background-color: #f8f9fa; /* Light grey background for the entire page */
    /* Your global body font should apply */
}

/* Wrapper for the main content of legal pages like Terms or Privacy */
.legal-page-main {
    padding-top: var(--header-height-value, 70px); /* Space for fixed navbar */
    /* If navbar is not fixed or transparent on these pages, adjust padding or remove */
}

.legal-content-section {
    padding: 60px 0; /* Top and bottom padding for the section */
}

/* The white card holding the legal document */
.legal-document-wrapper {
    background-color: var(--legal-content-bg);
    max-width: var(--legal-max-width);
    margin: 0 auto; /* Center the document block */
    padding: 40px 50px; /* Generous padding inside the card */
    border-radius: 12px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.08);
}

.legal-header-icon {
    text-align: center;
    margin-bottom: 25px;
}
.legal-header-icon i {
    font-size: 3rem; /* Large icon */
    color: var(--legal-icon-color);
    /* Optional: give it a light background circle
    background-color: rgba(var(--primary-blue-rgb, 0,123,255), 0.1);
    width: 80px;
    height: 80px;
    line-height: 80px;
    border-radius: 50%;
    display: inline-block;
    */
}

.legal-main-title {
    font-family: 'Times New Roman', Times, serif; /* Your heading font */
    font-size: 2.6rem;
    color: var(--legal-heading-color);
    text-align: center;
    margin-bottom: 40px;
}

.legal-text-content .legal-section {
    margin-bottom: 30px;
}

.legal-text-content .legal-section h2 {
    font-family: 'Roboto', sans-serif; /* Or your subheading font */
    font-size: 1.5rem; /* Slightly larger than image example, adjust if needed */
    font-weight: 600;
    color: var(--legal-heading-color);
    margin-bottom: 15px;
    border-bottom: 1px solid #e0e0e0; /* Subtle separator */
    padding-bottom: 8px;
}

.legal-text-content p {
    font-family: 'Inter', sans-serif; /* Your body text font */
    font-size: 1rem;
    line-height: 1.8;
    color: var(--legal-text-color);
    margin-bottom: 15px;
}

.legal-text-content ul {
    list-style: none;
    padding-left: 0; /* Remove default padding if using custom icons */
    margin-top: 10px;
    margin-bottom: 15px;
}

.legal-text-content ul li {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    line-height: 1.8;
    color: var(--legal-text-color);
    margin-bottom: 10px;
    padding-left: 28px; /* Space for the icon */
    position: relative;
}

.legal-text-content ul li i.fa-check {
    color: var(--legal-icon-color); /* Match other icons or make specific */
    font-size: 0.9em; /* Adjust icon size relative to text */
    position: absolute;
    left: 0;
    top: 7px; /* Adjust for vertical alignment with text */
}

.legal-text-content a {
    color: var(--legal-link-color);
    text-decoration: underline;
}
.legal-text-content a:hover {
    text-decoration: none;
}

.last-updated-note {
    margin-top: 40px;
    padding: 15px 20px;
    background-color: var(--legal-accent-bg);
    border-radius: 6px;
    font-size: 0.9rem;
    color: var(--text-secondary, #5a6f80);
    text-align: center;
    border: 1px solid #e0e6ed;
}

/* Responsive for Legal Pages */
@media (max-width: 768px) {
    .legal-document-wrapper {
        padding: 30px 25px;
    }
    .legal-main-title {
        font-size: 2rem;
        margin-bottom: 30px;
    }
    .legal-text-content .legal-section h2 {
        font-size: 1.3rem;
    }
    .legal-text-content p,
    .legal-text-content ul li {
        font-size: 0.95rem;
        line-height: 1.7;
    }
}

@media (max-width: 480px) {
    .legal-document-wrapper {
        padding: 25px 20px;
        border-radius: 8px; /* Slightly less radius on small screens */
    }
    .legal-main-title {
        font-size: 1.8rem;
    }
     .legal-header-icon i {
        font-size: 2.5rem;
    }
}