/* =========================================================
   1. לוגיקת נראות (חובה להשאיר בראש הקובץ)
   ========================================================= */

/* מצב התחלתי: הכל מוסתר חוץ ממה שציבורי */
.admin-only, 
.premium-only, 
.course-only, 
.member-only,
[data-permission]:not([data-permission="public"]) {
    display: none !important;
}

/* קלאס שה-JS יוסיף למה שמותר להציג - חייב להיות עם !important */
.auth-allowed {
    display: block !important;
}

/* תמיכה בפריטים שהם flex או פריטי רשימה של Bootstrap */
li.auth-allowed {
    display: list-item !important;
}

/* פריטים ציבוריים תמיד גלויים */
[data-permission="public"] {
    display: block !important;
}

/* =========================================================
   2. עיצוב "מורשת קיסרית" (צבעי מותג)
   ========================================================= */

/* רקעים וטקסט Primary */
.bg-primary { background-color: #1A237E ; }
.text-primary { color: #1A237E ; }

/* עיצוב ה-Navbar */
.navbar.bg-primary {
    background-color: #1A237E !important; 
    border-bottom: 3px solid #C5A059; /* קו זהב עבה יותר לנוכחות */
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
.nav-tabs .nav-link {
    color: #1A237E !important;
        border: 1px solid transparent;
        border-top: 3px solid transparent;
        transition: all 0.3s ease;  
}
.nav-link {
    color: #f8f9fa !important;
    transition: all 0.3s ease;
}

.nav-link:hover, .nav-link.active {
    color: #C5A059 !important; 
}

/* תפריטים נפתחים (Dropdown) */
.dropdown-menu-dark {
    background-color: #12182B !important;
    border: 1px solid #C5A059;
}

.dropdown-item:hover {
    background-color: #1A237E !important;
    color: #C5A059 !important;
}

/* הדגשת ה-Admin בתפריט */
.admin-only .nav-link, .admin-only.nav-link {
    color: #FFB300 !important; 
    text-shadow: 0 0 5px rgba(255, 179, 0, 0.2);
    font-weight: bold;
}

/* =========================================================
   3. כפתורים (Buttons)
   ========================================================= */

.btn-primary {
    background-color: #1A237E ;
    border-color: #1A237E ;
    color: #F8F9FA ;
    font-weight: 500;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.btn-primary:hover {
    background-color: #C5A059 ; 
    border-color: #C5A059 ;
    color: #1A237E ; 
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(197, 160, 89, 0.3);
}

.btn-outline-primary {
    color: #1A237E ;
    border-color: #1A237E ;
}

.btn-outline-primary:hover {
    background-color: #1A237E ;
    color: #F8F9FA ;
}

/* =========================================================
   4. מצב כהה (Dark Mode)
   ========================================================= */

.dark-mode {
    background-color: #121212 !important;
    color: #e0e0e0 !important;
}

.dark-mode .card,
.dark-mode .navbar:not(.bg-primary),
.dark-mode .table {
    background-color: #1e1e1e !important;
    color: white !important;
}

/* =========================================================
   5. מבנה ותוספות (Layout)
   ========================================================= */

.container-fluid {
    max-width: 1200px;
}

.lesson-header {
    background: linear-gradient(135deg, #1A237E, #C5A059);
    color: #fff;
    padding: 2rem;
    border-radius: 0 0 20px 200px; /* עיצוב אסימטרי מעניין */
}

#loader {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(255,255,255,0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}
.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table-responsive::-webkit-scrollbar {
  height: 8px; /* show scrollbar */
}

.table-responsive::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.table-responsive::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 4px;
}

/* שיפור מובייל */
@media (max-width: 991px) {
    .navbar-collapse {
        background: #1A237E;
        padding: 1rem;
        border-radius: 0 0 15px 15px;
        border: 1px solid #C5A059;
    }
    
    .btn { width: 100%; margin-bottom: 0.5rem; } /* כפתורים רחבים במובייל */
}

/* מניעת הבהוב כחול באנדרואיד */
* { -webkit-tap-highlight-color: transparent; }