/* Site-Wide Login Protection & Age Gate - Unified Overlay Styles */
/* Version 1.7.0: Perfect layout structure with admin-editable content */

/* Generic Overlay Container */
.swlp-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(0, 0, 0, 0.85) !important; /* Default background */
    z-index: 2147483647 !important;
    color: #ffffff !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-direction: column !important;
    font-family: Arial, sans-serif !important;
    padding: 20px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    animation: swlp-overlay-fadein 0.3s ease-out !important;
    /* NOTE: backdrop-filter is now only applied dynamically from admin settings */
}

/* Generic Content Box - Updated for Lightbox Effect */
.swlp-overlay-content {
    text-align: center !important; /* Center everything for better layout */
    max-width: 500px !important;
    padding: 40px 20px !important;
    background-color: #2d2d2d !important; /* Solid, dark background */
    border-radius: 8px !important;
    border: 1px solid #444 !important; /* Subtle border */
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
    animation: swlp-overlay-fadein 0.5s ease-out 0.1s both !important;
    /* backdrop-filter and transparency removed */
}

/* Logo Container */
.swlp-logo-container {
    text-align: center !important;
    margin-bottom: 25px !important;
}

.swlp-logo-container img {
    max-width: 225px !important;
    height: auto !important;
    display: inline-block !important;
}

/* Age Verification Icon - Big, centered, first after logo */
.swlp-age-icon {
    font-size: 64px !important;
    text-align: center !important;
    margin: 0 0 25px 0 !important;
    line-height: 1 !important;
    display: block !important;
}

/* Header Text - Admin editable, comes after icon - FORCED CENTER */
.swlp-overlay-content h2 {
    font-size: 26px !important;
    margin: 0 0 25px 0 !important;
    color: #ffffff !important;
    font-weight: bold !important;
    text-shadow: none !important;
    line-height: 1.2 !important;
    text-align: center !important;
    width: 100% !important;
    display: block !important;
}

/* Generic Typography - Admin editable message */
.swlp-overlay-content p {
    font-size: 16px !important;
    margin-bottom: 30px !important;
    color: #cccccc !important;
    line-height: 1.5 !important;
    text-align: left !important; /* Keep paragraph text left-aligned for readability */
}

/* Button Group Container */
.swlp-btn-group {
    display: flex !important;
    justify-content: center !important;
    gap: 15px !important;
    margin-top: 20px !important;
    flex-wrap: wrap !important;
}

/* Base Button & Link Styling */
.swlp-btn {
    padding: 12px 30px !important;
    font-size: 18px !important;
    border: none !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    font-weight: bold !important;
    text-decoration: none !important;
    display: inline-block !important;
    line-height: 1.2 !important;
}

.swlp-btn:hover {
    transform: translateY(-2px) !important;
}

/* Primary Button (Age Confirm) - Green */
.swlp-btn-primary {
    background-color: #28a745 !important; /* Green */
    color: white !important;
    box-shadow: 0 4px 15px rgba(40, 167, 69, 0.3) !important;
    border: 2px solid white !important; /* Added white border */
    padding: 10px 28px !important; /* Adjusted padding for border */
}
.swlp-btn-primary:hover {
    background-color: #218838 !important;
    box-shadow: 0 6px 20px rgba(40, 167, 69, 0.4) !important;
}

/* Danger Button Style (For potential future use) */
.swlp-btn-danger {
    background-color: #dc3545 !important; /* Red */
    color: white !important;
    box-shadow: 0 4px 15px rgba(220, 53, 69, 0.3) !important;
}
.swlp-btn-danger:hover {
    background-color: #c82333 !important;
    box-shadow: 0 6px 20px rgba(220, 53, 69, 0.4) !important;
}

/* Secondary Button (Register) - Gray */
.swlp-btn-secondary {
    background-color: #6c757d !important;
    color: white !important;
    box-shadow: 0 4px 15px rgba(108, 117, 125, 0.3) !important;
}
.swlp-btn-secondary:hover {
    background-color: #5a6268 !important;
    box-shadow: 0 6px 20px rgba(108, 117, 125, 0.4) !important;
}

/* Discreet/Deny Button (e.g., Exit) */
.swlp-btn-discreet {
    padding: 10px 25px !important;
    font-size: 16px !important;
    background-color: #ab8c8c !important; /* Muted gray-red background */
    color: #333333 !important; /* Dark gray text */
    border: none !important;
    box-shadow: 0 4px 15px rgba(171, 140, 140, 0.2) !important;
}
.swlp-btn-discreet:hover {
    background-color: #9a7b7b !important; /* Slightly darker on hover */
    color: #333333 !important;
}

/* Warning text styling */
.swlp-warning-text {
    font-size: 14px !important;
    color: #00aeff !important; /* Light blue accent color */
    margin-top: 20px !important;
    font-style: italic !important;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
    .swlp-overlay-content {
        max-width: 90% !important;
        padding: 30px 15px !important;
    }
    .swlp-overlay-content h2 {
        font-size: 22px !important;
    }
    .swlp-age-icon {
        font-size: 56px !important;
        margin: 0 0 20px 0 !important;
    }
    .swlp-btn-group {
        flex-direction: column !important;
        width: 100% !important;
    }
    .swlp-btn {
        width: 100% !important;
        box-sizing: border-box !important;
    }
}

/* Keyframe Animations */
@keyframes swlp-overlay-fadein {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}