/* متغیرهای رنگی مورد نیاز */
:root {
    --primary: #4CC9F0;
    --primary2: #7C3AED;
    --rose: #F7A6B9;
}

/* استایل کلی نوبار شیشه‌ای */
.navbar-glass {
    background: rgba(10, 12, 20, .55);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

/* لینک‌های نوبار */
.navbar .nav-link {
    color: rgba(255, 255, 255, .78);
    border-radius: 999px;
    padding: .45rem .85rem;
    transition: .25s ease;
}

.navbar .nav-link:hover {
    background: rgba(255, 255, 255, .08);
    color: #fff;
}

.navbar .nav-link.active {
    background: rgba(76, 201, 240, .16);
    color: #fff;
}

/* آیکون برند (لوگو) */
.brand-mark {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(76, 201, 240, .22), rgba(247, 166, 185, .20));
    border: 1px solid rgba(255, 255, 255, .12);
    box-shadow: 0 14px 40px rgba(0, 0, 0, .25);
}

/* دکمه آیکون‌دار (برای تم لایت/دارک) */
.btn-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .06);
    color: #fff;
}

.btn-icon:hover {
    background: rgba(255, 255, 255, .10);
    color: #fff;
}

/* دکمه اصلی (Primary) */
.btn-primary {
    background: linear-gradient(90deg, var(--primary), var(--primary2));
    border: 0;
    box-shadow: 0 16px 50px rgba(76, 201, 240, .22);
}

.btn-primary:hover {
    filter: brightness(1.05);
}

/* انیمیشن تپش دکمه (Pulse) */
.btn-pulse {
    position: relative;
}

.btn-pulse::after {
    content: "";
    position: absolute;
    inset: -8px;
    border-radius: 16px;
    border: 1px solid rgba(76, 201, 240, .25);
    opacity: .0;
    animation: pulse 2.2s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(.96);
        opacity: .0;
    }
    35% {
        opacity: .65;
    }
    100% {
        transform: scale(1.08);
        opacity: 0;
    }
}

/* --- تنظیمات مربوط به حالت روشن (Light Theme) --- */
/* زمانی که کلاس light به body اضافه شود اعمال می‌شوند */

body.light .navbar-glass {
    background: rgba(255, 255, 255, .72);
}

body.light .navbar .nav-link {
    color: rgba(11, 16, 32, .72);
}

body.light .navbar .nav-link:hover {
    background: rgba(11, 16, 32, .06);
    color: #0b1020;
}

body.light .navbar .nav-link.active {
    background: rgba(76, 201, 240, .14);
    color: #0b1020;
}

body.light .btn-icon {
    background: rgba(11, 16, 32, .04);
    color: #0b1020;
}