/* رنگ سبز مدرن */
.custom-header {
    background-color: rgb(70,139,122); /* سبز بوت‌استرپ */
    padding: 0.5rem 1rem;
    min-height: 60px;
}

/* تنظیم متن و لینک کنار نام */
.header-name {
    font-weight: 700;
    font-size: 1.25rem;
    white-space: nowrap;
    color: white;
}

.header-link {
    font-size: 0.875rem;
    color: #d4f8d4;
    margin-right: 0.3rem;
    cursor: pointer;
    text-decoration: underline;
}

    .header-link:hover {
        color: #a6d08a;
        text-decoration: none;
    }

/* دایره پروفایل */
.profile-circle {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background-color: #ffffffcc;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    flex-shrink: 0;
    box-shadow: 0 0 6px rgba(0,0,0,0.15);
}

    .profile-circle img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 50%;
    }

/* لوگو کوچک */
.logo-img {
    height: 38px;
    margin-left: 0.5rem;
    flex-shrink: 0;
}

/* کل هدر همیشه افقی حتی در موبایل */
@media (max-width: 768px) {
    .custom-header {
        flex-wrap: nowrap !important;
    }

    .header-name {
        font-size: 1rem;
    }

    .header-link {
        font-size: 0.75rem;
    }

    .profile-circle {
        width: 36px;
        height: 36px;
    }

    .logo-img {
        height: 32px;
    }
}

/* منوی کشویی همیشه بالاتر از همه */
.dropdown-menu {
    z-index: 1055 !important; /* بالاتر از modal هم میشه گذاشت */
}
.sm, .sm-blue {
    z-index: 100 !important;
}
.dropdown-menu.flipInX2 {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    animation: flipInXFixed 0.8s ease both;
    transform-origin: top center; /* این باعث میشه انیمیشن از لبه بالای منو شروع بشه */
}
@keyframes flipInXFixed {
    0% {
        transform: perspective(600px) rotateX(90deg) translateY(45px);
        opacity: 0;
    }

    40% {
        transform: perspective(600px) rotateX(-10deg) translateY(45px);
    }

    70% {
        transform: perspective(600px) rotateX(10deg) translateY(45px);
    }

    100% {
        transform: perspective(600px) rotateX(0deg) translateY(45px);
        opacity: 1;
    }
}


.dropdown-header {
    border-radius:20px;
    backdrop-filter: blur(24px) saturate(84%);
    -webkit-backdrop-filter: blur(24px) saturate(84%);
    background-color: rgba(255, 255, 255, 0.49);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}

.dropdown-menu {
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}
.profile-dropdown {
    font-size: 16px; /* اندازه فونت بزرگ‌تر */
    line-height: 1.6; /* فاصله خطوط بیشتر */
}
@media(max-width:768px)
{
    .profile-dropdown {
        font-size: 14px; /* اندازه فونت بزرگ‌تر */
        line-height: 1.6; /* فاصله خطوط بیشتر */
    }
}
.profile-dropdown .dropdown-item {
    transition: all 0.3s ease;
    color: #333; /* رنگ پیش‌فرض متن */
}

    .profile-dropdown .dropdown-item:hover,
    .profile-dropdown .dropdown-item:focus {
        background-color: rgb(70 139 122); /* رنگ پس‌زمینه آبی زیبا */
        color: white; /* رنگ متن سفید */
        transform: translateX(5px); /* کمی جابجایی به سمت راست */
        box-shadow: 0 4px 8px rgba(44, 123, 229, 0.4); /* سایه ملایم */
        border-radius: 6px; /* گوشه‌های گرد */
        cursor: pointer;
    }
.dropdown-item.danger:hover,
.dropdown-item.danger:focus {
    background-color: #dc3545 !important;
    color: #fff !important;
    transform: translateX(5px);
    box-shadow: 0 4px 8px rgba(220, 53, 69, 0.4);
    border-radius: 6px;
}
@media (max-width: 768px) {
    .header-name {
        white-space: normal; /* اجازه بده متن بشکنه */

        max-width: 200px; /* عرض کمی بزرگ‌تر از حالت فعلی */
        line-height: 1.6; /* ارتفاع خطوط بهتر */
    }

    #mainNavbar {
        background-color: whitesmoke;
        box-shadow: 0 0 6px rgba(0,0,0,0.5);
    }
    .navbar-toggler-icon
    {
        background-color:white;
    }
}

.navbar-custom {
    background-color: rgb(147,200,168);
}
.bi-list {
    color: white;
    font-size: 2rem;
}
.full-screen-btn i {
    font-size: 28px; /* اندازه بزرگ‌تر */
    line-height: 1; /* تنظیم فاصله عمودی */
    color:white
}
.rounded-circle {
    transition: all 0.5s ease; /* ترتیب درست */
}

    .rounded-circle:hover, rounded-circle:focus {
        transform: scale(1.1);
    }