/* Custom CSS for AvisDeServices */

/* Color Variables */
:root {
    --primary-dark-orange: hsl(25, 80%, 35%); /* Deep, rich orange */
    --accent-orange: hsl(25, 90%, 55%); /* Brighter, vibrant orange for accents */
    --light-text: hsl(0, 0%, 95%); /* Off-white for main text */
    --dark-text: hsl(0, 0%, 20%); /* Dark gray for text on light backgrounds */
    --dark-bg: hsl(240, 5%, 15%); /* Very dark gray/almost black for main background */
    --card-bg: hsl(240, 5%, 20%); /* Slightly lighter dark gray for card backgrounds */
    --gray-300: hsl(0, 0%, 70%); /* Lighter gray for secondary text */
    --gray-400: hsl(0, 0%, 60%); /* Medium gray */
    --gray-500: hsl(0, 0%, 50%); /* Darker gray for inactive elements */
    --gray-600: hsl(0, 0%, 40%); /* Even darker gray */
    --gray-700: hsl(0, 0%, 30%); /* Darkest gray for borders */
    --green-success: hsl(120, 70%, 40%); /* Green for success/progress */
    --red-warning: hsl(0, 70%, 50%); /* Red for warnings/errors */
    --yellow-star: hsl(45, 100%, 50%); /* Yellow for star ratings */
}

/* Base styles for the body */
body {
    background-color: var(--dark-bg);
    color: var(--light-text);
    font-family: 'Inter', sans-serif;
    line-height: 1.6;
}

/* General Link Styling */
a {
    color: var(--accent-orange);
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}

a:hover {
    color: var(--primary-dark-orange);
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    color: var(--light-text);
    font-weight: 700;
}

/* Custom Tailwind Overrides/Extensions */
.bg-dark-bg {
    background-color: var(--dark-bg);
}

.text-light-text {
    color: var(--light-text);
}

.text-dark-text {
    color: var(--dark-text);
}

.bg-card-bg {
    background-color: var(--card-bg);
}

.text-accent-orange {
    color: var(--accent-orange);
}

.bg-accent-orange {
    background-color: var(--accent-orange);
}

.hover\:bg-orange-600:hover {
    background-color: var(--primary-dark-orange); /* Darker orange on hover */
}

.border-accent-orange {
    border-color: var(--accent-orange);
}

.text-yellow-400 { /* For star ratings */
    color: var(--yellow-star);
}

.bg-green-500 { /* For progress bars */
    background-color: var(--green-success);
}

/* Gradient for headings */
.bg-gradient-to-r.from-accent-orange.to-orange-400 {
    background-image: linear-gradient(to right, var(--accent-orange), hsl(25, 70%, 70%));
}

/* Specific styling for the disclaimer section */
#disclaimer-section {
    background-color: rgba(100, 20, 20, 0.3); /* Dark red with transparency */
    border-top: 4px solid var(--red-warning);
    border-bottom: 4px solid var(--red-warning);
    color: var(--light-text);
    padding: 2.5rem 1rem;
    margin-top: 3rem;
    box-shadow: inset 0 5px 10px rgba(0,0,0,0.3), inset 0 -5px 10px rgba(0,0,0,0.3);
}

#disclaimer-section h3 {
    color: var(--red-warning);
    font-size: 2rem;
}

#disclaimer-section .material-symbols-outlined {
    color: var(--red-warning);
}
.material-symbols-outlined {
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}
/* Styling for footer organization logos */
footer .flex-wrap img {
    max-width: 150px; /* Max width as per requirement */
    height: 48px; /* Fixed height for consistency */
    object-fit: contain; /* Ensure image scales down without cropping */
    filter: brightness(0.8) saturate(0.8); /* Slightly dim them for dark background */
    transition: filter 0.3s ease;
}

footer .flex-wrap img:hover {
    filter: brightness(1) saturate(1.1); /* Slightly brighter on hover */
}

/* Ensure 18+ icon is visible and distinct */
footer img[alt="18+ Only"] {
    height: 48px;
    width: auto;
    filter: none; /* Keep it vibrant */
}

/* Age Gate specific styles */
#age-gate {
    display: none;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
#age-gate.hidden {
    opacity: 0;
    visibility: hidden;
}

/* Cookie Banner specific styles */
#cookie-banner {
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}
#cookie-banner.hidden {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none; /* Make it unclickable when hidden */
}

/* Cookie Modal specific styles */
#cookie-modal {
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
#cookie-modal.hidden {
    opacity: 0;
    visibility: hidden;
}

/* Main content visibility */
#main-content.hidden {
    display: none;
}/* New styles for .rightsCloudWrap and its nested elements */

/* Wrapper for content, providing spacing and centering */
.rightsCloudWrap {
    padding-top: 4rem; /* Top padding for the section */
    padding-left: 1rem; /* Left padding for the section */
    padding-right: 1rem; /* Right padding for the section */
    max-width: 1200px; /* Maximum width for content readability */
    margin-left: auto; /* Center the block horizontally */
    margin-right: auto; /* Center the block horizontally */
}

/* Heading 1 styles */
.rightsCloudWrap h1 {
    font-size: 2.25rem; /* ~36px */
    line-height: 1.2;
    margin-top: 0; /* Reset default browser margin */
    margin-bottom: 1.5rem; /* Space below heading */
}

/* Heading 2 styles */
.rightsCloudWrap h2 {
    font-size: 1.75rem; /* ~28px */
    line-height: 1.3;
    margin-top: 1.75rem; /* Space above heading */
    margin-bottom: 1.25rem; /* Space below heading */
}

/* Heading 3 styles */
.rightsCloudWrap h3 {
    font-size: 1.5rem; /* ~24px */
    line-height: 1.4;
    margin-top: 1.5rem; /* Space above heading */
    margin-bottom: 1rem; /* Space below heading */
}

/* Heading 4 styles */
.rightsCloudWrap h4 {
    font-size: 1.25rem; /* ~20px */
    line-height: 1.5;
    margin-top: 1.25rem; /* Space above heading */
    margin-bottom: 0.75rem; /* Space below heading */
}

/* Heading 5 styles */
.rightsCloudWrap h5 {
    font-size: 1.125rem; /* ~18px */
    line-height: 1.5;
    margin-top: 1rem; /* Space above heading */
    margin-bottom: 0.5rem; /* Space below heading */
}

/* Paragraph styles */
.rightsCloudWrap p {
    font-size: 1rem; /* Base font size, ~16px */
    line-height: 1.7;
    margin-top: 0; /* Reset default browser margin */
    margin-bottom: 1rem; /* Space below paragraph */
}

/* Unordered list styles */
.rightsCloudWrap ul {
    list-style-type: disc; /* Standard disc bullet points */
    margin-top: 1rem; /* Space above the list */
    margin-bottom: 1rem; /* Space below the list */
    margin-left: 1.5rem; /* Indentation for list items */
    padding-left: 0; /* Reset default browser padding */
}

/* List item styles */
.rightsCloudWrap li {
    font-size: 1rem; /* Base font size, ~16px */
    line-height: 1.7;
    margin-bottom: 0.5rem; /* Space between list items */
}
html {
  scroll-behavior: smooth;
}