/* style.css */

/* -------------------------------------- */
/* 1. تنسيق شريط التبويب النشط في Auth.html */
/* -------------------------------------- */
.tab-button.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #ffc72c; /* اللون الذهبي الجديد */
    border-radius: 2px 2px 0 0;
    animation: slideInBottom 0.3s ease-out forwards;
}

@keyframes slideInBottom {
    from { transform: translateY(10px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

/* -------------------------------------- */
/* 2. تنسيق شريط التمرير (Sidebar Scrollbar) */
/* -------------------------------------- */

/* تنسيق شريط التمرير لمتصفحات Webkit (Chrome, Safari, Edge) */
.sidebar-scroll::-webkit-scrollbar {
    width: 6px;
}

.sidebar-scroll::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05); /* خلفية شفافة فاتحة */
    border-radius: 10px;
}

.sidebar-scroll::-webkit-scrollbar-thumb {
    background: #ffc72c; /* لون ذهبي */
    border-radius: 10px;
}

.sidebar-scroll::-webkit-scrollbar-thumb:hover {
    background: #e6b222; /* ذهبي أغمق قليلاً عند التمرير */
}

/* تنسيق شريط التمرير لمتصفح Firefox */
.sidebar-scroll {
    scrollbar-width: thin; /* يجعل الشريط نحيفًا */
    scrollbar-color: #ffc72c rgba(255, 255, 255, 0.05); /* لون الإبهام ولون المسار */
}

/* -------------------------------------- */
/* 3. تطبيق Glass-Card على حقول الإدخال للتركيز */
/* -------------------------------------- */
.glass-card input:focus {
    /* يضمن أن حقول الإدخال داخل أي عنصر يحمل فئة glass-card تظهر ظل تركيز ذهبي */
    box-shadow: 0 0 0 3px rgba(255, 199, 44, 0.3), 0 0 10px rgba(255, 199, 44, 0.1);
}