/* --- پوشش پذیرش قوانین (Overlay) --- */
.terms-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.7);
    /* مهم: این خط باعث میشه بلور (Blur) به آرامی محو بشه */
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    display: flex;
    justify-content: center;
    align-items: center;
    
    /* ترنزیشن برای محو شدن آرام */
    opacity: 0;
    transform: scale(0.95);
    transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), 
                transform 0.5s cubic-bezier(0.4, 0, 0.2, 1),
                backdrop-filter 0.5s ease;
    animation: fadeInOverlay 0.6s ease forwards;
}

@keyframes fadeInOverlay {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

/* --- کلاس بسته شدن (آرام آرام) --- */
.terms-overlay.closing {
    opacity: 0;
    transform: scale(0.98);
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
    pointer-events: none;
}

.terms-box {
    background: rgba(20, 20, 30, 0.85);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 24px;
    padding: 2.5rem 3rem;
    max-width: 600px;
    width: 90%;
    text-align: center;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(5px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}
.terms-overlay.closing .terms-box {
    opacity: 0;
    transform: translateY(-20px);
}

/* بقیه استایل‌ها (دکمه‌ها، چک‌باکس، لایت مود) دقیقاً مثل قبل است */
.terms-box h2 { font-size: 1.8rem; font-weight: 700; color: #fff; margin-bottom: 1rem; }
.terms-box p { color: #b0b0c0; font-size: 1rem; line-height: 1.6; margin-bottom: 1.5rem; }
.terms-buttons { display: flex; justify-content: center; gap: 1rem; margin-bottom: 1.5rem; }
.terms-buttons button {
    display: inline-flex; align-items: center; gap: 0.6rem;
    padding: 0.6rem 1.4rem; background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 50px;
    color: #fff; font-size: 0.95rem; font-weight: 600; cursor: pointer;
    transition: all 0.3s ease;
}
.terms-buttons button:hover { background: rgba(255, 255, 255, 0.1); transform: translateY(-2px); }
.terms-buttons button img { width: 18px; height: 18px; filter: brightness(0) invert(1); }

.custom-checkbox { display: flex; align-items: center; justify-content: center; gap: 12px; cursor: pointer; margin: 1.5rem 0; color: #d0d0e0; font-size: 1rem; font-weight: 500; }
.custom-checkbox input { display: none; }
.checkmark { width: 24px; height: 24px; border: 2px solid #555; border-radius: 6px; position: relative; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; }
.custom-checkbox input:checked + .checkmark { background: #a855f7; border-color: #a855f7; box-shadow: 0 0 15px rgba(168, 85, 247, 0.4); }
.checkmark .accept-icon { width: 16px; height: 16px; opacity: 0; transform: scale(0.5); transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55); filter: brightness(0) invert(1); }
.custom-checkbox input:checked + .checkmark .accept-icon { opacity: 1; transform: scale(1); }

.btn-continue {
    display: inline-flex; align-items: center; gap: 0.8rem;
    padding: 0.8rem 2.5rem; background: linear-gradient(135deg, #6d28d9, #a855f7);
    border: none; border-radius: 50px; color: #fff; font-size: 1.1rem;
    font-weight: 700; cursor: pointer; transition: all 0.3s ease;
    box-shadow: 0 4px 20px rgba(168, 85, 247, 0.4);
    opacity: 0.6; cursor: not-allowed; filter: grayscale(0.3);
}
.btn-continue:enabled { opacity: 1; cursor: pointer; filter: grayscale(0); }
.btn-continue:enabled:hover { transform: scale(1.05); box-shadow: 0 6px 30px rgba(168, 85, 247, 0.6); }
.btn-continue img { width: 22px; height: 22px; filter: brightness(0) invert(1); }

.shake-error { animation: shake 0.5s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; }
@keyframes shake {
    0%, 100% { transform: translateX(0); }
    10% { transform: translateX(-8px); } 30% { transform: translateX(8px); }
    50% { transform: translateX(-6px); } 70% { transform: translateX(6px); }
    90% { transform: translateX(-4px); }
}

/* حالت لایت مود */
html.light-mode .terms-overlay { background: rgba(255, 255, 255, 0.7); }
html.light-mode .terms-box { background: rgba(255, 255, 255, 0.95); border-color: rgba(0, 0, 0, 0.1); }
html.light-mode .terms-box h2 { color: #1e293b; }
html.light-mode .terms-box p { color: #475569; }
html.light-mode .terms-buttons button { background: rgba(0, 0, 0, 0.05); border-color: rgba(0, 0, 0, 0.1); color: #1e293b; }
html.light-mode .terms-buttons button:hover { background: rgba(0, 0, 0, 0.1); }
html.light-mode .terms-buttons button img { filter: invert(0); }
html.light-mode .custom-checkbox { color: #1e293b; }
html.light-mode .checkmark { border-color: #64748b; }
html.light-mode .btn-continue { background: linear-gradient(135deg, #7c3aed, #a855f7); }