/* =============================================
   First Visit Popup - 5 Color Templates
   Applied via body class or wrapper class
   ============================================= */

/* =============================================
   TEMPLATE 1 - Classic Dark (default)
   ============================================= */
body.fvpt-tpl-classic .fvpt-screen {
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.94) 0%, rgba(30, 41, 59, 0.90) 100%);
}
body.fvpt-tpl-classic .fvpt-panel {
    background: #ffffff;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
}
body.fvpt-tpl-classic .fvpt-panel-header h2 {
    color: #1a1a2e;
}
body.fvpt-tpl-classic .fvpt-age-warning h3 {
    color: #dc2626;
}
body.fvpt-tpl-classic .fvpt-btn-yes {
    background: linear-gradient(135deg, #22c55e, #16a34a);
    color: #fff;
    box-shadow: 0 4px 16px rgba(34, 197, 94, 0.4);
}
body.fvpt-tpl-classic .fvpt-btn-yes:hover {
    background: linear-gradient(135deg, #16a34a, #15803d);
    box-shadow: 0 6px 24px rgba(34, 197, 94, 0.5);
}
body.fvpt-tpl-classic .fvpt-btn-no {
    background: linear-gradient(135deg, #ef4444, #dc2626);
    color: #fff;
    box-shadow: 0 4px 16px rgba(239, 68, 68, 0.4);
}
body.fvpt-tpl-classic .fvpt-btn-no:hover {
    background: linear-gradient(135deg, #dc2626, #b91c1c);
    box-shadow: 0 6px 24px rgba(239, 68, 68, 0.5);
}
body.fvpt-tpl-classic .fvpt-panel::before {
    background: linear-gradient(90deg, #ff6b35, #f7c948, #ff6b35);
}
body.fvpt-tpl-classic .fvpt-disclaimer {
    background: linear-gradient(135deg, #fef2f2, #fee2e2);
    border-color: #fca5a5;
}
body.fvpt-tpl-classic .fvpt-disclaimer p {
    color: #991b1b;
}

/* =============================================
   TEMPLATE 2 - Elegant Gold
   ============================================= */
body.fvpt-tpl-gold .fvpt-screen {
    background: linear-gradient(135deg, rgba(26, 18, 5, 0.95) 0%, rgba(45, 31, 10, 0.92) 100%);
}
body.fvpt-tpl-gold .fvpt-panel {
    background: linear-gradient(135deg, #fefcf5, #fdf6e3);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
    border: 1px solid rgba(212, 168, 67, 0.3);
}
body.fvpt-tpl-gold .fvpt-panel-header h2 {
    color: #5c4a1e;
}
body.fvpt-tpl-gold .fvpt-panel::before {
    background: linear-gradient(90deg, #d4a843, #f7d97e, #d4a843);
}
body.fvpt-tpl-gold .fvpt-age-warning h3 {
    color: #8b6914;
}
body.fvpt-tpl-gold .fvpt-intro {
    color: #6b5a2e;
}
body.fvpt-tpl-gold .fvpt-certify {
    color: #5c4a1e;
}
body.fvpt-tpl-gold .fvpt-checklist li {
    color: #4a3d1e;
}
body.fvpt-tpl-gold .fvpt-checklist li::before {
    background-color: #fef3c7;
    border-color: #d4a843;
}
body.fvpt-tpl-gold .fvpt-checklist li::after {
    border-left-color: #d4a843;
    border-bottom-color: #d4a843;
}
body.fvpt-tpl-gold .fvpt-btn-yes {
    background: linear-gradient(135deg, #d4a843, #b8922e);
    color: #fff;
    box-shadow: 0 4px 16px rgba(212, 168, 67, 0.4);
}
body.fvpt-tpl-gold .fvpt-btn-yes:hover {
    background: linear-gradient(135deg, #b8922e, #9a7825);
    box-shadow: 0 6px 24px rgba(212, 168, 67, 0.5);
}
body.fvpt-tpl-gold .fvpt-btn-no {
    background: linear-gradient(135deg, #8b4513, #6b3410);
    color: #fff;
    box-shadow: 0 4px 16px rgba(139, 69, 19, 0.4);
}
body.fvpt-tpl-gold .fvpt-btn-no:hover {
    background: linear-gradient(135deg, #6b3410, #50280c);
    box-shadow: 0 6px 24px rgba(139, 69, 19, 0.5);
}
body.fvpt-tpl-gold .fvpt-disclaimer {
    background: linear-gradient(135deg, #fefcda, #fdf3c5);
    border-color: #d4a843;
}
body.fvpt-tpl-gold .fvpt-disclaimer p {
    color: #7a5d1a;
}

/* =============================================
   TEMPLATE 3 - Midnight Blue
   ============================================= */
body.fvpt-tpl-midnight .fvpt-screen {
    background: linear-gradient(135deg, rgba(10, 14, 39, 0.96) 0%, rgba(22, 27, 61, 0.94) 100%);
}
body.fvpt-tpl-midnight .fvpt-panel {
    background: linear-gradient(135deg, #1e2345, #2a2f52);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(74, 80, 160, 0.3);
}
body.fvpt-tpl-midnight .fvpt-panel::before {
    background: linear-gradient(90deg, #4f46e5, #818cf8, #4f46e5);
}
body.fvpt-tpl-midnight .fvpt-panel-header h2 {
    color: #e0e7ff;
}
body.fvpt-tpl-midnight .fvpt-age-warning h3 {
    color: #a5b4fc;
}
body.fvpt-tpl-midnight .fvpt-intro {
    color: #c7d2fe;
}
body.fvpt-tpl-midnight .fvpt-certify {
    color: #c7d2fe;
}
body.fvpt-tpl-midnight .fvpt-checklist li {
    color: #c7d2fe;
}
body.fvpt-tpl-midnight .fvpt-checklist li::before {
    background-color: rgba(79, 70, 229, 0.2);
    border-color: #4f46e5;
}
body.fvpt-tpl-midnight .fvpt-checklist li::after {
    border-left-color: #818cf8;
    border-bottom-color: #818cf8;
}
body.fvpt-tpl-midnight .fvpt-btn-yes {
    background: linear-gradient(135deg, #4f46e5, #4338ca);
    color: #fff;
    box-shadow: 0 4px 16px rgba(79, 70, 229, 0.4);
}
body.fvpt-tpl-midnight .fvpt-btn-yes:hover {
    background: linear-gradient(135deg, #4338ca, #3730a3);
    box-shadow: 0 6px 24px rgba(79, 70, 229, 0.5);
}
body.fvpt-tpl-midnight .fvpt-btn-no {
    background: linear-gradient(135deg, #dc2626, #b91c1c);
    color: #fff;
    box-shadow: 0 4px 16px rgba(220, 38, 38, 0.4);
}
body.fvpt-tpl-midnight .fvpt-btn-no:hover {
    background: linear-gradient(135deg, #b91c1c, #991b1b);
    box-shadow: 0 6px 24px rgba(220, 38, 38, 0.5);
}
body.fvpt-tpl-midnight .fvpt-disclaimer {
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.12), rgba(220, 38, 38, 0.08));
    border-color: rgba(220, 38, 38, 0.4);
}
body.fvpt-tpl-midnight .fvpt-disclaimer p {
    color: #fca5a5;
}

/* =============================================
   TEMPLATE 4 - Crimson Red
   ============================================= */
body.fvpt-tpl-crimson .fvpt-screen {
    background: linear-gradient(135deg, rgba(26, 5, 5, 0.96) 0%, rgba(45, 10, 10, 0.94) 100%);
}
body.fvpt-tpl-crimson .fvpt-panel {
    background: linear-gradient(135deg, #1c0a0a, #2d1212);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(155, 44, 44, 0.3);
}
body.fvpt-tpl-crimson .fvpt-panel::before {
    background: linear-gradient(90deg, #dc2626, #ef4444, #dc2626);
}
body.fvpt-tpl-crimson .fvpt-panel-header h2 {
    color: #fecaca;
}
body.fvpt-tpl-crimson .fvpt-age-warning h3 {
    color: #f87171;
}
body.fvpt-tpl-crimson .fvpt-intro {
    color: #fca5a5;
}
body.fvpt-tpl-crimson .fvpt-certify {
    color: #fca5a5;
}
body.fvpt-tpl-crimson .fvpt-checklist li {
    color: #e5e7eb;
}
body.fvpt-tpl-crimson .fvpt-checklist li::before {
    background-color: rgba(239, 68, 68, 0.2);
    border-color: #ef4444;
}
body.fvpt-tpl-crimson .fvpt-checklist li::after {
    border-left-color: #ef4444;
    border-bottom-color: #ef4444;
}
body.fvpt-tpl-crimson .fvpt-btn-yes {
    background: linear-gradient(135deg, #dc2626, #b91c1c);
    color: #fff;
    box-shadow: 0 4px 16px rgba(220, 38, 38, 0.4);
}
body.fvpt-tpl-crimson .fvpt-btn-yes:hover {
    background: linear-gradient(135deg, #b91c1c, #991b1b);
    box-shadow: 0 6px 24px rgba(220, 38, 38, 0.5);
}
body.fvpt-tpl-crimson .fvpt-btn-no {
    background: linear-gradient(135deg, #374151, #1f2937);
    color: #fff;
    box-shadow: 0 4px 16px rgba(55, 65, 81, 0.4);
}
body.fvpt-tpl-crimson .fvpt-btn-no:hover {
    background: linear-gradient(135deg, #1f2937, #111827);
    box-shadow: 0 6px 24px rgba(55, 65, 81, 0.5);
}
body.fvpt-tpl-crimson .fvpt-disclaimer {
    background: linear-gradient(135deg, rgba(55, 65, 81, 0.4), rgba(31, 41, 55, 0.3));
    border-color: rgba(239, 68, 68, 0.4);
}
body.fvpt-tpl-crimson .fvpt-disclaimer p {
    color: #fca5a5;
}

/* =============================================
   TEMPLATE 5 - Forest Nature
   ============================================= */
body.fvpt-tpl-forest .fvpt-screen {
    background: linear-gradient(135deg, rgba(10, 26, 10, 0.95) 0%, rgba(15, 42, 15, 0.92) 100%);
}
body.fvpt-tpl-forest .fvpt-panel {
    background: linear-gradient(135deg, #f0fdf4, #dcfce7);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(74, 222, 128, 0.3);
}
body.fvpt-tpl-forest .fvpt-panel::before {
    background: linear-gradient(90deg, #22c55e, #4ade80, #22c55e);
}
body.fvpt-tpl-forest .fvpt-panel-header h2 {
    color: #166534;
}
body.fvpt-tpl-forest .fvpt-age-warning h3 {
    color: #15803d;
}
body.fvpt-tpl-forest .fvpt-intro {
    color: #166534;
}
body.fvpt-tpl-forest .fvpt-certify {
    color: #166534;
}
body.fvpt-tpl-forest .fvpt-checklist li {
    color: #374151;
}
body.fvpt-tpl-forest .fvpt-checklist li::before {
    background-color: #dcfce7;
    border-color: #22c55e;
}
body.fvpt-tpl-forest .fvpt-checklist li::after {
    border-left-color: #22c55e;
    border-bottom-color: #22c55e;
}
body.fvpt-tpl-forest .fvpt-btn-yes {
    background: linear-gradient(135deg, #22c55e, #16a34a);
    color: #fff;
    box-shadow: 0 4px 16px rgba(34, 197, 94, 0.4);
}
body.fvpt-tpl-forest .fvpt-btn-yes:hover {
    background: linear-gradient(135deg, #16a34a, #15803d);
    box-shadow: 0 6px 24px rgba(34, 197, 94, 0.5);
}
body.fvpt-tpl-forest .fvpt-btn-no {
    background: linear-gradient(135deg, #92400e, #78350f);
    color: #fff;
    box-shadow: 0 4px 16px rgba(146, 64, 14, 0.4);
}
body.fvpt-tpl-forest .fvpt-btn-no:hover {
    background: linear-gradient(135deg, #78350f, #5c2a0b);
    box-shadow: 0 6px 24px rgba(146, 64, 14, 0.5);
}
body.fvpt-tpl-forest .fvpt-disclaimer {
    background: linear-gradient(135deg, #fef2e8, #fde8d0);
    border-color: #d97706;
}
body.fvpt-tpl-forest .fvpt-disclaimer p {
    color: #92400e;
}
