/**
 * Tutor LMS Custom Styling
 * تعديل ألوان Tutor LMS لمطابقة ألوان الثيم الأساسية
 * 
 * @package Bzzix
 * @since 1.0.0
 */

:root {
    --primary-dark: #0a192f;
    --primary-blue: #112240;
    --accent-blue: #64ffda;
    --text-light: #e6f1ff;
    --gradient-1: linear-gradient(135deg, #0a192f 0%, #112240 50%, #1a3a5f 100%);
    
    /* Tutor LMS Colors */
    --tutor-color-primary: #64ffda;
    --tutor-color-secondary: #4dabf7;
    --tutor-color-dark: #0a192f;
    --tutor-color-light: #e6f1ff;
    --tutor-bg-primary: linear-gradient(135deg, #64ffda 0%, #4dabf7 100%);
}

/* ============================================
   Tutor Card Styling
   ============================================ */

.tutor-card,
.tutor-course-card,
.course-card {
    background: var(--gradient-1) !important;
    border: 1px solid rgba(100, 255, 218, 0.15) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
    transition: all 0.3s ease !important;
}

.tutor-card:hover,
.tutor-course-card:hover,
.course-card:hover {
    border-color: rgba(100, 255, 218, 0.4) !important;
    box-shadow: 0 8px 24px rgba(100, 255, 218, 0.15) !important;
    transform: translateY(-4px) !important;
}

/* ============================================
   Tutor Card Text
   ============================================ */

.tutor-card h3,
.tutor-card h4,
.tutor-card h5,
.tutor-card h6,
.tutor-course-card h3,
.tutor-course-card h4,
.course-card h3,
.course-card h4,
 {
    color: var(--accent-blue) !important;
    font-weight: 600 !important;
}

.tutor-card p,
.tutor-card span,
.tutor-card a,
.tutor-course-card p,
.tutor-course-card span,
.tutor-course-card a,
.course-card p,
.course-card span,
.course-card a,
.tutor-fw-bold,
.tutor-fw-medium {
    color: var(--text-light) !important;
}

.tutor-card a:hover,
.tutor-course-card a:hover,
.course-card a:hover {
    color: var(--accent-blue) !important;
}

/* ============================================
   Tutor Buttons
   ============================================ */

.tutor-btn,
.tutor-course-btn,
.course-btn,
.btn-tutor {
    background: linear-gradient(135deg, #64ffda 0%, #4dabf7 100%) !important;
    color: var(--primary-dark) !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
    padding: 10px 20px !important;
}

.tutor-btn:hover,
.tutor-course-btn:hover,
.course-btn:hover,
.btn-tutor:hover {
    background: linear-gradient(135deg, #4dabf7 0%, #64ffda 100%) !important;
    box-shadow: 0 4px 12px rgba(100, 255, 218, 0.4) !important;
    transform: translateY(-2px) !important;
    color: var(--primary-dark) !important;
}

/* ============================================
   Tutor Dashboard
   ============================================ */

.tutor-dashboard,
.tutor-dashboard-container,
.tutor-single-course-sidebar .tutor-sidebar-card .tutor-card-body,
.tutor-single-course-sidebar-more>div,
.tutor-single-course-sidebar .tutor-sidebar-card .tutor-card-header,
.tutor-accordion-item-header.is-active,
.tutor-course-content-list-item,
.tutor-course-details-page .tutor-course-details-tab .tutor-is-sticky,
.tutor-accordion-item-header,
.tutor-course-single-sidebar-wrapper .tutor-course-topic-item.is-active a {
    background-color: var(--primary-dark) !important;
}

.tutor-course-single-sidebar-wrapper .tutor-course-topic-item a,
.tutor-course-single-sidebar-wrapper {
    background-color: var(--primary-blue) !important;
}

.tutor-dashboard h1,
.tutor-dashboard h2,
.tutor-dashboard h3,
.tutor-dashboard-container h1,
.tutor-dashboard-container h2,
.tutor-dashboard-container h3 {
    color: var(--accent-blue) !important;
}

.tutor-dashboard p,
.tutor-dashboard-container p {
    color: var(--text-light) !important;
}

/* ============================================
   Tutor Course Meta
   ============================================ */

.tutor-course-meta,
.course-meta,
.tutor-course-info {
    background: rgba(17, 34, 64, 0.5) !important;
    border-left: 3px solid var(--accent-blue) !important;
    padding: 12px 15px !important;
    border-radius: 6px !important;
    margin: 10px 0 !important;
}

.tutor-course-meta span,
.course-meta span,
.tutor-course-info span {
    color: var(--text-light) !important;
}

.tutor-course-meta i,
.course-meta i,
.tutor-course-info i {
    color: var(--accent-blue) !important;
}

/* ============================================
   Tutor Lists and Tables
   ============================================ */

.tutor-list-item,
.tutor-course-item {
    background: rgba(17, 34, 64, 0.3) !important;
    border: 1px solid rgba(100, 255, 218, 0.1) !important;
    border-radius: 8px !important;
    padding: 15px !important;
    margin: 10px 0 !important;
}

.tutor-list-item:hover,
.tutor-course-item:hover {
    background: rgba(17, 34, 64, 0.5) !important;
    border-color: rgba(100, 255, 218, 0.3) !important;
}

table.tutor-table,
table.course-table {
    background: linear-gradient(135deg, rgba(10, 25, 47, 0.7), rgba(17, 34, 64, 0.7)) !important;
    border: 2px solid var(--accent-blue) !important;
    border-collapse: collapse !important;
    width: 100% !important;
    margin-bottom: 1.5rem !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 20px rgba(100, 255, 218, 0.1) !important;
    backdrop-filter: blur(10px) !important;
}

table.tutor-table thead,
table.course-table thead {
    background: transparent !important;
    color: var(--text-light) !important;
}

table.tutor-table thead th,
table.course-table thead th {
    padding: 18px 15px !important;
    font-weight: 700 !important;
    text-align: right !important;
    border-bottom: 3px solid var(--accent-blue) !important;
    color: var(--accent-blue) !important;
    font-size: 1rem !important;
    letter-spacing: 0.5px !important;
    text-transform: capitalize !important;
    background: transparent !important;
}

table.tutor-table tbody tr,
table.course-table tbody tr {
    border-bottom: 1px solid rgba(100, 255, 218, 0.1) !important;
    transition: all 0.3s ease !important;
    background: transparent !important;
}

table.tutor-table tbody tr:nth-child(even),
table.course-table tbody tr:nth-child(even) {
    background: rgba(100, 255, 218, 0.03) !important;
}

table.tutor-table tbody tr:hover,
table.course-table tbody tr:hover {
    background: rgba(100, 255, 218, 0.08) !important;
    box-shadow: inset 4px 0 0 var(--accent-blue), 0 4px 12px rgba(100, 255, 218, 0.15) !important;
}

table.tutor-table tbody tr:last-child,
table.course-table tbody tr:last-child {
    border-bottom: none !important;
}

table.tutor-table td,
table.course-table td {
    color: var(--text-light) !important;
    padding: 16px 15px !important;
    vertical-align: middle !important;
    font-size: 0.95rem !important;
    background: transparent !important;
}

table.tutor-table tbody tr:nth-child(even) td,
table.course-table tbody tr:nth-child(even) td {
    background: rgba(100, 255, 218, 0.03) !important;
}

table.tutor-table tbody tr:hover td,
table.course-table tbody tr:hover td {
    background: rgba(100, 255, 218, 0.08) !important;
    color: #e6f1ff !important;
}

table.tutor-table td a,
table.course-table td a {
    color: var(--accent-blue) !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    font-weight: 500 !important;
}

table.tutor-table td a:hover,
table.course-table td a:hover {
    color: #64ffda !important;
    text-decoration: underline !important;
    text-shadow: 0 0 10px rgba(100, 255, 218, 0.3) !important;
}

/* Table Striped */
table.tutor-table.table-striped tbody tr:nth-child(odd),
table.course-table.table-striped tbody tr:nth-child(odd) {
    background: rgba(100, 255, 218, 0.05) !important;
}

/* Table Responsive */
@media (max-width: 768px) {
    table.tutor-table,
    table.course-table {
        display: block !important;
        overflow-x: auto !important;
    }

    table.tutor-table thead,
    table.course-table thead {
        display: none !important;
    }

    table.tutor-table tbody tr,
    table.course-table tbody tr {
        display: block !important;
        margin-bottom: 15px !important;
        border: 1px solid rgba(100, 255, 218, 0.1) !important;
        border-radius: 6px !important;
        padding: 10px !important;
    }

    table.tutor-table td,
    table.course-table td {
        display: block !important;
        text-align: right !important;
        padding-bottom: 10px !important;
        border-bottom: 1px solid rgba(100, 255, 218, 0.05) !important;
    }

    table.tutor-table td:before,
    table.course-table td:before {
        content: attr(data-label) !important;
        font-weight: 600 !important;
        display: block !important;
        font-size: 0.85rem !important;
        color: var(--accent-blue) !important;
        margin-bottom: 5px !important;
    }
}

/* ============================================
   Tutor Badge and Labels
   ============================================ */

.tutor-badge,
.course-badge,
.tutor-label {
    background: rgba(100, 255, 218, 0.15) !important;
    color: var(--accent-blue) !important;
    border-radius: 20px !important;
    padding: 4px 12px !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
}

.tutor-badge.featured,
.course-badge.featured {
    background: linear-gradient(135deg, rgba(100, 255, 218, 0.2), rgba(77, 171, 247, 0.2)) !important;
}

/* ============================================
   Tutor Progress
   ============================================ */

.tutor-progress,
.course-progress {
    background: rgba(100, 255, 218, 0.1) !important;
    border-radius: 10px !important;
    height: 8px !important;
    overflow: hidden !important;
}

.tutor-progress-bar,
.course-progress-bar {
    background: linear-gradient(90deg, #64ffda 0%, #4dabf7 100%) !important;
    border-radius: 10px !important;
    height: 100% !important;
}

/* ============================================
   Tutor Rating
   ============================================ */

.tutor-rating,
.course-rating {
    color: var(--accent-blue) !important;
}

.tutor-rating-star,
.course-rating-star {
    color: var(--accent-blue) !important;
}

.tutor-rating-empty,
.course-rating-empty {
    color: rgba(100, 255, 218, 0.3) !important;
}

/* ============================================
   Tutor Modals and Popups
   ============================================ */

.tutor-modal,
.tutor-dialog {
    background: var(--primary-blue) !important;
    border: 1px solid rgba(100, 255, 218, 0.2) !important;
    border-radius: 12px !important;
}

.tutor-modal-header,
.tutor-dialog-header {
    background: rgba(100, 255, 218, 0.05) !important;
    border-bottom: 1px solid rgba(100, 255, 218, 0.1) !important;
}

.tutor-modal-header h5,
.tutor-dialog-header h5 {
    color: var(--accent-blue) !important;
}

.tutor-modal-body,
.tutor-dialog-body {
    color: var(--text-light) !important;
}

/* ============================================
   Tutor Forms
   ============================================ */

.tutor-form-group,
.tutor-form-field {
    margin-bottom: 15px !important;
}

.tutor-form-group label,
.tutor-form-field label {
    color: var(--text-light) !important;
    font-weight: 500 !important;
}

.tutor-form-control,
.tutor-input,
input.tutor-form-control,
textarea.tutor-form-control,
select.tutor-form-control {
    background: rgba(17, 34, 64, 0.5) !important;
    border: 1px solid rgba(100, 255, 218, 0.2) !important;
    color: var(--text-light) !important;
    border-radius: 8px !important;
    padding: 10px 12px !important;
    transition: all 0.3s ease !important;
}

.tutor-form-control:focus,
.tutor-input:focus,
input.tutor-form-control:focus,
textarea.tutor-form-control:focus,
select.tutor-form-control:focus {
    background: rgba(17, 34, 64, 0.8) !important;
    border-color: var(--accent-blue) !important;
    box-shadow: 0 0 8px rgba(100, 255, 218, 0.2) !important;
    color: var(--text-light) !important;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {
    .tutor-card,
    .tutor-course-card,
    .course-card {
        margin-bottom: 15px !important;
    }

    .tutor-dashboard {
        padding: 10px !important;
    }

    table.tutor-table,
    table.course-table {
        font-size: 0.9rem !important;
    }
}

/* ============================================
   Tutor Color Utilities
   ============================================ */

/* Primary Color */
.tutor-color-primary {
    color: var(--tutor-color-primary) !important;
}

.tutor-bg-primary {
    background: var(--tutor-bg-primary) !important;
    color: var(--tutor-color-dark) !important;
}

.tutor-text-primary {
    color: var(--tutor-color-primary) !important;
}

/* Secondary Color */
.tutor-color-secondary {
    color: var(--tutor-color-secondary) !important;
}

.tutor-bg-secondary {
    background: rgba(77, 171, 247, 0.15) !important;
    border: 1px solid rgba(77, 171, 247, 0.3) !important;
    border-radius: 8px !important;
    padding: 10px !important;
}

.tutor-text-secondary {
    color: var(--tutor-color-secondary) !important;
}

.tutor-border-secondary {
    border-left: 4px solid var(--tutor-color-secondary) !important;
}

/* Dark Color */
.tutor-color-dark {
    color: var(--tutor-color-dark) !important;
}

.tutor-bg-dark {
    background: var(--tutor-color-dark) !important;
    color: var(--tutor-color-light) !important;
}

/* Light Color */
.tutor-color-light {
    color: var(--tutor-color-light) !important;
}

.tutor-bg-light {
    background: rgba(230, 241, 255, 0.05) !important;
    border: 1px solid rgba(100, 255, 218, 0.1) !important;
}

/* Gradient Background */
.tutor-bg-gradient {
    background: var(--tutor-bg-primary) !important;
    color: var(--tutor-color-dark) !important;
    font-weight: 600 !important;
}

.tutor-bg-gradient-light {
    background: linear-gradient(135deg, rgba(100, 255, 218, 0.1), rgba(77, 171, 247, 0.1)) !important;
    border: 1px solid rgba(100, 255, 218, 0.15) !important;
}

/* Accent Elements */
.tutor-accent {
    color: var(--accent-blue) !important;
}

.tutor-accent-bg {
    background: rgba(100, 255, 218, 0.1) !important;
    border: 1px solid rgba(100, 255, 218, 0.3) !important;
}

.tutor-accent-border {
    border: 2px solid var(--accent-blue) !important;
}

/* Hover Effects */
.tutor-hover-primary:hover {
    color: var(--tutor-color-primary) !important;
    transition: all 0.3s ease !important;
}

.tutor-hover-secondary:hover {
    color: var(--tutor-color-secondary) !important;
    transition: all 0.3s ease !important;
}

.tutor-hover-lift:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 24px rgba(100, 255, 218, 0.15) !important;
    transition: all 0.3s ease !important;
}

/* Status Colors */
.tutor-status-active {
    color: var(--tutor-color-primary) !important;
}

.tutor-status-pending {
    color: var(--tutor-color-secondary) !important;
}

.tutor-status-inactive {
    color: rgba(230, 241, 255, 0.5) !important;
}
