/* Custom CSS for Lucky Paradise */

/* Base Styles */
body {
    font-family: 'Poppins', sans-serif;
    background-color: #1a202c; /* Default dark background */
    color: #e2e8f0; /* Default light gray text color */
}

/* Custom Scrollbar for Chat */
.custom-scrollbar::-webkit-scrollbar {
    width: 8px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    background: #2d3748; /* Darker gray for track */
    border-radius: 10px;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #6b46c1; /* Purple for thumb */
    border-radius: 10px;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: #805ad5; /* Lighter purple on hover */
}

/* Animations */
@keyframes float-slow {
    0% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(5px, 10px) rotate(2deg); }
    50% { transform: translate(0, 0) rotate(0deg); }
    75% { transform: translate(-5px, -10px) rotate(-2deg); }
    100% { transform: translate(0, 0) rotate(0deg); }
}

.animate-float-slow {
    animation: float-slow 15s ease-in-out infinite;
}

@keyframes text-glow {
    0%, 100% { text-shadow: 0 0 5px rgba(168, 85, 247, 0.4), 0 0 10px rgba(168, 85, 247, 0.2); }
    50% { text-shadow: 0 0 10px rgba(168, 85, 247, 0.7), 0 0 20px rgba(168, 85, 247, 0.5); }
}

.animate-text-glow {
    animation: text-glow 4s ease-in-out infinite;
}

@keyframes pulse-slow {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.03); opacity: 0.9; }
}

.animate-pulse-slow {
    animation: pulse-slow 3s ease-in-out infinite;
}

@keyframes pulse-fast {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.animate-pulse-fast {
    animation: pulse-fast 1.5s ease-in-out infinite;
}

/* Game Modal Specific Styles */
#gameModal {
    transition: opacity 0.3s ease-in-out;
}

#gameModal.hidden {
    opacity: 0;
    pointer-events: none;
}

#gameModal:not(.hidden) {
    opacity: 1;
    pointer-events: auto;
}

/* FAQ Accordion Arrow Rotation */
.faq-question svg.rotate-180 {
    transform: rotate(180deg);
}

/* Testimonial Slider */
.testimonial-wrapper {
    width: 100%; /* Ensure wrapper takes full width for flex-shrink-0 to work */
}

.testimonial-card {
    flex: 0 0 100%; /* Each card takes 100% width of the slider */
}

/* Community Messages Slider */
.message-wrapper {
    transition: transform 1s ease-in-out, opacity 1s ease-in-out;
}

/* Footer Image Links */
.footer-img-link img {
    max-width: 120px; /* Default width */
    height: auto;
    object-fit: contain;
    filter: none; /* Ensure no grayscale or other filters */
}

/* Responsive adjustments for footer images */
@media (min-width: 768px) {
    .footer-img-link img {
        max-width: 130px;
    }
}

@media (min-width: 1024px) {
    .footer-img-link img {
        max-width: 140px;
    }
}

/* Adjust for smaller screens if too many images */
@media (max-width: 640px) {
    .footer-img-link img {
        max-width: 100px;
    }
}

/* 18+ icon specific styling */
img[alt="18+"] {
    max-width: 60px; /* Smaller for the 18+ icon */
    filter: none; /* Ensure it's always colored */
}
/* New styles for .securePolicyGrid and its children */

/* Wrapper for policy content */
.securePolicyGrid {
    padding-top: 4rem; /* Top padding for the section */
    padding-bottom: 4rem; /* Bottom padding for the section */
    padding-left: 1.5rem; /* Left padding for content */
    padding-right: 1.5rem; /* Right padding for content */
    max-width: 1200px; /* Maximum width for content */
    margin: 0 auto; /* Center the content horizontally */
    line-height: 1.7; /* Standard line height for readability */
    color: #e2e8f0; /* Default text color, inheriting from body */
}

/* Heading styles within .securePolicyGrid */
.securePolicyGrid h1 {
    font-size: 2.5rem; /* Large heading */
    font-weight: 700; /* Bold font weight */
    margin-top: 3rem; /* Space above heading */
    margin-bottom: 1.5rem; /* Space below heading */
    color: #a855f7; /* Purple color for primary headings */
}

.securePolicyGrid h2 {
    font-size: 2rem; /* Medium-large heading */
    font-weight: 600; /* Semi-bold font weight */
    margin-top: 2.5rem; /* Space above heading */
    margin-bottom: 1.25rem; /* Space below heading */
    color: #c084fc; /* Lighter purple color */
}

.securePolicyGrid h3 {
    font-size: 1.75rem; /* Medium heading */
    font-weight: 600; /* Semi-bold font weight */
    margin-top: 2rem; /* Space above heading */
    margin-bottom: 1rem; /* Space below heading */
    color: #d8b4fe; /* Even lighter purple color */
}

.securePolicyGrid h4 {
    font-size: 1.5rem; /* Small-medium heading */
    font-weight: 500; /* Medium font weight */
    margin-top: 1.75rem; /* Space above heading */
    margin-bottom: 0.75rem; /* Space below heading */
    color: #e2e8f0; /* Inherit default text color */
}

.securePolicyGrid h5 {
    font-size: 1.25rem; /* Small heading */
    font-weight: 500; /* Medium font weight */
    margin-top: 1.5rem; /* Space above heading */
    margin-bottom: 0.5rem; /* Space below heading */
    color: #e2e8f0; /* Inherit default text color */
}

/* Paragraph styles within .securePolicyGrid */
.securePolicyGrid p {
    font-size: 1.125rem; /* Standard paragraph font size */
    margin-bottom: 1.25rem; /* Space below paragraph */
    line-height: inherit; /* Inherit line height from parent */
}

/* Unordered list styles within .securePolicyGrid */
.securePolicyGrid ul {
    list-style-type: disc; /* Default bullet points */
    margin-top: 1.5rem; /* Space above the list */
    margin-bottom: 1.5rem; /* Space below the list */
    padding-left: 1.5rem; /* Indentation for list items */
}

/* List item styles within .securePolicyGrid */
.securePolicyGrid li {
    font-size: 1.125rem; /* Standard list item font size */
    margin-bottom: 0.75rem; /* Space between list items */
    line-height: inherit; /* Inherit line height from parent */
}

.game-card img{
   margin-top: 20px !important;
}

header .navbar-logos, .footer-logos {
   display: flex !important;
   flex-wrap: wrap !important;
   align-items: center !important;
   gap: 10px !important;
}

header .navbar-logos img, .footer-logos  img{
   width: 50px;
   height: 50px;
   object-fit: contain;
}

header .navbar-logos h2, .footer-logos  h2{
   font-size: clamp(18px,2.5vw,25px) !important;
   margin: 0;
   color: rgb(192 132 252 / var(--tw-text-opacity, 1));
}

#hero img{
   object-fit: contain !important;
}

@media(max-width: 767px){
    .mob-d li{
        padding: 0 0 0 10px;
    }
}