* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Cairo', sans-serif;
}

:root {
    --primary: #667eea;
    --primary-dark: #4c51bf;
    --secondary: #764ba2;
    --ink: #1a202c;
    --muted: #718096;
    --line: #e2e8f0;
    --surface: #ffffff;
    --soft: #f7fafc;
    --success-bg: #c6f6d5;
    --success-text: #22543d;
    --error-bg: #fed7d7;
    --error-text: #742a2a;
}

body {
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
    min-height: 100vh;
    color: #333;
}

button, input, select, textarea {
    font: inherit;
}

button {
    cursor: pointer;
}

.header {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    padding: 20px 0;
    box-shadow: 0 2px 20px rgba(0,0,0,0.1);
    position: sticky;
    top: 0;
    z-index: 1000;
}

.nav {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.logo {
    font-size: 1.8em;
    font-weight: 900;
    color: var(--primary);
}

.login-btn,
.btn-primary,
.btn-secondary,
.modal-btn,
.action-btn {
    border: none;
    text-decoration: none;
    font-weight: 700;
    transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
}

.login-btn,
.modal-btn,
.action-btn.primary {
    background: linear-gradient(135deg, var(--primary), var(--secondary));
    color: white;
}

.login-btn {
    padding: 12px 30px;
    border-radius: 30px;
    font-size: 1em;
}

.login-btn:hover,
.btn-primary:hover,
.action-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(102, 126, 234, 0.28);
}

.hero {
    padding: 80px 20px;
    text-align: center;
    color: white;
}

.hero h1 {
    font-size: 3.5em;
    margin-bottom: 20px;
    font-weight: 900;
    text-shadow: 2px 2px 8px rgba(0,0,0,0.2);
}

.hero p {
    font-size: 1.3em;
    margin: 0 auto 40px;
    opacity: 0.95;
    max-width: 700px;
    line-height: 1.8;
}

.cta-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

.btn-primary,
.btn-secondary {
    padding: 15px 40px;
    border-radius: 30px;
    font-size: 1.1em;
}

.btn-primary {
    background: white;
    color: var(--primary);
}

.btn-secondary {
    background: transparent;
    color: white;
    border: 2px solid white;
}

.btn-secondary:hover {
    background: white;
    color: var(--primary);
}

.features {
    background: white;
    padding: 80px 20px;
    border-radius: 50px 50px 0 0;
    margin-top: -30px;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
}

.section-title {
    text-align: center;
    font-size: 2.5em;
    margin-bottom: 60px;
    color: #2d3748;
    font-weight: 900;
}

.features-grid,
.subjects-grid,
.dashboard-grid {
    display: grid;
    gap: 24px;
}

.features-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
}

.feature-card {
    background: linear-gradient(135deg, #f6f9fc, #ffffff);
    padding: 40px 30px;
    border-radius: 20px;
    text-align: center;
    transition: all 0.3s;
    border: 2px solid transparent;
}

.feature-card:hover {
    transform: translateY(-8px);
    border-color: var(--primary);
    box-shadow: 0 20px 40px rgba(102, 126, 234, 0.15);
}

.feature-icon {
    font-size: 3em;
    margin-bottom: 20px;
}

.feature-card h3 {
    color: #2d3748;
    margin-bottom: 15px;
    font-size: 1.4em;
}

.feature-card p {
    color: var(--muted);
    line-height: 1.7;
}

.subjects {
    background: var(--soft);
    padding: 80px 20px;
}

.subjects-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
}

.subject-card {
    background: white;
    padding: 30px 20px;
    border-radius: 15px;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    transition: all 0.3s;
}

.subject-card:hover {
    transform: scale(1.03);
    box-shadow: 0 15px 30px rgba(102, 126, 234, 0.2);
}

.subject-icon {
    font-size: 2.5em;
    margin-bottom: 15px;
}

.subject-card h4 {
    color: #2d3748;
    font-size: 1.2em;
}

.footer {
    background: var(--ink);
    color: white;
    padding: 60px 20px 30px;
    text-align: center;
}

.footer-content {
    max-width: 1200px;
    margin: 0 auto;
}

.footer h3 {
    margin-bottom: 20px;
    font-size: 1.5em;
}

.footer p {
    opacity: 0.8;
    margin-bottom: 10px;
}

.social-links {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin: 30px 0;
}

.social-links a {
    color: white;
    font-size: 1.5em;
    opacity: 0.8;
    transition: opacity 0.3s;
    text-decoration: none;
}

.social-links a:hover {
    opacity: 1;
}

.copyright {
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: 20px;
    margin-top: 30px;
    opacity: 0.6;
}

.modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.7);
    z-index: 2000;
    justify-content: center;
    align-items: center;
    padding: 20px;
}

.modal.active {
    display: flex;
}

.modal-content {
    background: white;
    padding: 40px;
    border-radius: 20px;
    max-width: 420px;
    width: 100%;
    box-shadow: 0 24px 80px rgba(0,0,0,0.25);
}

.modal-content h2 {
    margin-bottom: 25px;
    color: #2d3748;
    text-align: center;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    color: #4a5568;
    font-weight: 700;
}

.form-group input {
    width: 100%;
    padding: 12px 15px;
    border: 2px solid var(--line);
    border-radius: 10px;
    font-size: 1em;
    transition: border 0.3s;
}

.form-group input:focus {
    outline: none;
    border-color: var(--primary);
}

.modal-btn {
    width: 100%;
    padding: 15px;
    border-radius: 10px;
    font-size: 1.1em;
}

.close-btn {
    float: left;
    background: none;
    border: none;
    font-size: 1.5em;
    color: #a0aec0;
}

.login-message,
.notice {
    margin-top: 15px;
    padding: 10px;
    border-radius: 8px;
    text-align: center;
    display: none;
}

.login-message.success,
.notice.success {
    background: var(--success-bg);
    color: var(--success-text);
    display: block;
}

.login-message.error,
.notice.error {
    background: var(--error-bg);
    color: var(--error-text);
    display: block;
}

.app-shell {
    min-height: 100vh;
    background: #FAF6EC;
    display: grid;
    grid-template-columns: 270px 1fr;
}

.sidebar {
    background:
        radial-gradient(circle at top left, rgba(212,169,90,0.18), transparent 35%),
        linear-gradient(180deg, #1F3A2E 0%, #203D31 48%, #172B23 100%);
    color: #F5F1E8;
    padding: 24px 18px;
    border-left: 1px solid rgba(212,169,90,0.18);
    box-shadow: 10px 0 34px rgba(31,58,46,0.1);
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 1.05rem;
    font-weight: 900;
    margin-bottom: 26px;
    padding: 0 8px 22px;
    border-bottom: 1px solid rgba(184,137,58,0.18);
    color: #F5F1E8;
}

.brand-mark {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    background: linear-gradient(135deg, #D4A95A, #B8893A);
    color: #1F3A2E;
    border: 1px solid rgba(245,241,232,0.22);
    box-shadow: 0 8px 22px rgba(184,137,58,0.24);
}

.sidebar-brand strong {
    display: block;
    color: #F5F1E8;
    line-height: 1.3;
}

.sidebar-brand span {
    display: block;
    color: #D4A95A;
    font-size: 0.72rem;
    font-weight: 700;
    margin-top: 2px;
}

.sidebar-nav {
    display: grid;
    gap: 14px;
}

.sidebar-nav-group {
    display: grid;
    gap: 6px;
}

.sidebar-nav-title {
    color: rgba(245,241,232,0.42);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-align: center;
    text-transform: uppercase;
    margin: 2px 0 4px;
}

.sidebar-nav a,
.sidebar-nav button {
    display: grid;
    grid-template-columns: 22px 1fr auto;
    align-items: center;
    gap: 8px;
    color: rgba(245,241,232,0.7);
    background: transparent;
    border: 0;
    text-align: right;
    text-decoration: none;
    padding: 12px 14px;
    border-radius: 8px;
    font-weight: 700;
    position: relative;
    transition: background 0.2s, color 0.2s, transform 0.2s, border-color 0.2s, box-shadow 0.2s;
}

.sidebar-nav a b {
    font: inherit;
}

.sidebar-nav a small {
    background: #E44D4D;
    color: #fff;
    border-radius: 999px;
    padding: 2px 7px;
    font-size: 0.65rem;
    font-weight: 900;
}

.sidebar-nav a:hover,
.sidebar-nav button:hover {
    background: rgba(212,169,90,0.11);
    color: #F5F1E8;
    transform: translateX(-2px);
}

.sidebar-nav a.active {
    background: linear-gradient(135deg, #D4A95A, #B8893A);
    color: #1F3A2E;
    box-shadow: 0 10px 24px rgba(184,137,58,0.24);
}

.sidebar-nav a.active::before {
    content: '';
    position: absolute;
    right: -18px;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 24px;
    background: #D4A95A;
    border-radius: 4px 0 0 4px;
}

.sidebar-nav button {
    margin-top: 12px;
    border: 1px solid rgba(212,169,90,0.22);
    background: rgba(245,241,232,0.055);
    color: rgba(245,241,232,0.72);
}

.sidebar-nav button:hover {
    border-color: rgba(212,169,90,0.45);
    background: rgba(184,137,58,0.14);
    color: #F5F1E8;
}

.main-panel {
    min-width: 0;
}

.topbar {
    background: white;
    border-bottom: 1px solid var(--line);
    padding: 18px 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.topbar h1 {
    font-size: 1.35rem;
    color: var(--ink);
}

.user-chip {
    color: var(--muted);
    font-weight: 700;
}

.content {
    padding: 28px;
}

.dashboard-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.panel,
.stat-card {
    background: white;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 22px;
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.05);
}

.stat-card strong {
    display: block;
    font-size: 2rem;
    color: var(--ink);
    margin-bottom: 8px;
}

.stat-card span,
.panel p {
    color: var(--muted);
    line-height: 1.7;
}

.panel h2,
.panel h3 {
    color: var(--ink);
    margin-bottom: 12px;
}

.action-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 18px;
}

.action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 16px;
    border-radius: 8px;
    background: white;
    color: var(--primary-dark);
    border: 1px solid var(--line);
}

.qr-box {
    width: 180px;
    height: 180px;
    display: grid;
    place-items: center;
    border: 2px dashed #cbd5e0;
    border-radius: 12px;
    color: var(--muted);
    background: #f8fafc;
    margin-top: 16px;
}

/* Data-driven landing page */
.home-page {
    --home-olive: #1F3A2E;
    --home-olive-2: #2D5043;
    --home-gold: #B8893A;
    --home-gold-light: #D4A95A;
    --home-cream: #F5F1E8;
    --home-paper: #FAF6EC;
    --home-ink: #1A1815;
    --home-muted: #5F665F;
    --home-line: rgba(31,58,46,0.1);
    background: var(--home-paper);
    color: var(--home-ink);
    min-height: 100vh;
    line-height: 1.7;
}

.home-page a {
    color: inherit;
    text-decoration: none;
}

.home-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: rgba(250,246,236,0.94);
    border-bottom: 1px solid rgba(31,58,46,0.08);
    backdrop-filter: blur(14px);
}

.home-nav {
    max-width: 1240px;
    margin: 0 auto;
    padding: 14px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.home-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 210px;
}

.home-brand-mark,
.home-avatar,
.home-card-icon,
.home-feature-icon,
.home-empty-mark {
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--home-gold-light), var(--home-gold));
    color: var(--home-olive);
    font-weight: 900;
}

.home-brand-mark {
    width: 42px;
    height: 42px;
    box-shadow: 0 8px 24px rgba(184,137,58,0.2);
}

.home-brand strong {
    display: block;
    color: var(--home-olive);
    line-height: 1.25;
}

.home-brand small {
    display: block;
    color: var(--home-muted);
    font-size: 11px;
    margin-top: 1px;
}

.home-nav-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
}

.home-nav-links a {
    color: var(--home-muted);
    padding: 8px 10px;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 800;
}

.home-nav-links a:hover {
    background: rgba(184,137,58,0.1);
    color: var(--home-olive);
}

.home-nav-actions,
.home-hero-actions,
.home-inline-links,
.home-socials {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.home-login-btn,
.home-signup-btn,
.home-primary-btn,
.home-secondary-btn,
.home-ghost-btn,
.home-whatsapp-btn,
.home-plan-card button,
.home-parent-box button,
.home-message-form button,
.home-disabled-btn,
.home-disabled-button,
.home-banners a,
.home-course-body a,
.home-grade-card a,
.home-banner-card a {
    min-height: 40px;
    border-radius: 100px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 16px;
    border: 0;
    font-weight: 900;
    cursor: pointer;
}

.home-login-btn,
.home-ghost-btn {
    background: white;
    color: var(--home-olive);
    border: 1px solid var(--home-line);
}

.home-user-chip {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 100px;
    background: rgba(52, 105, 74, 0.08);
    color: var(--home-olive);
    font-weight: 900;
}

.home-signup-btn,
.home-primary-btn,
.home-plan-card button,
.home-message-form button,
.home-course-body a,
.home-grade-card a,
.home-banner-card a {
    background: var(--home-olive);
    color: var(--home-cream);
}

.home-secondary-btn,
.home-whatsapp-btn,
.home-parent-box button {
    background: var(--home-gold);
    color: var(--home-olive);
}

.home-alert-bar {
    background: var(--home-olive);
    color: var(--home-cream);
    overflow: hidden;
}

.home-alert-inner {
    max-width: 1240px;
    margin: 0 auto;
    padding: 10px 22px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    font-size: 13px;
}

.home-alert-inner strong {
    color: var(--home-gold-light);
}

.home-alert-inner span {
    background: rgba(245,241,232,0.08);
    border: 1px solid rgba(184,137,58,0.16);
    border-radius: 100px;
    padding: 3px 10px;
}

.home-hero {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}










.home-eyebrow,
.home-section-heading span,
.home-parent-box span {
    color: var(--home-gold);
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 900;
}

.home-hero h1 {
    color: var(--home-olive);
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1.16;
    margin: 12px 0 16px;
    font-weight: 900;
}

.home-hero p {
    color: var(--home-muted);
    font-size: 17px;
    max-width: 760px;
}

.home-hero-actions {
    margin-top: 24px;
}

.home-hero-visual {
    min-height: 430px;
    border-radius: 22px;
    background:
        radial-gradient(circle at 20% 18%, rgba(212,169,90,0.28), transparent 28%),
        linear-gradient(135deg, var(--home-olive), var(--home-olive-2));
    position: relative;
    overflow: hidden;
    box-shadow: 0 24px 70px rgba(31,58,46,0.18);
    border: 1px solid rgba(184,137,58,0.22);
}

.home-teacher-photo {
    position: absolute;
    inset: 44px 48px 72px 48px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    background: rgba(245,241,232,0.1);
    border: 1px solid rgba(245,241,232,0.18);
    color: var(--home-gold-light);
    font-size: 72px;
    font-weight: 900;
    width: auto;
    height: auto;
    object-fit: cover;
    object-position: center;
}

.home-hero-card {
    position: absolute;
    background: var(--home-paper);
    border: 1px solid rgba(184,137,58,0.22);
    border-radius: 14px;
    padding: 14px 16px;
    box-shadow: 0 14px 40px rgba(0,0,0,0.14);
}

.home-hero-card strong,
.home-hero-card span {
    display: block;
}

.home-hero-card strong {
    color: var(--home-olive);
}

.home-hero-card span {
    color: var(--home-muted);
    font-size: 12px;
}

.home-hero-card.first {
    right: 22px;
    bottom: 90px;
}

.home-hero-card.second {
    left: 22px;
    top: 96px;
}

.home-hero-note {
    position: absolute;
    right: 22px;
    left: 22px;
    bottom: 22px;
    color: rgba(245,241,232,0.72);
    font-size: 11px;
    text-align: center;
}

.home-section {
    max-width: 1240px;
    margin: 0 auto;
    padding: 34px 22px;
}

.home-section-heading {
    margin-bottom: 22px;
}

.home-section-heading h2,
.home-parent-box h2 {
    color: var(--home-olive);
    font-size: clamp(24px, 3vw, 36px);
    line-height: 1.25;
    margin-top: 6px;
    font-weight: 900;
}

.home-section-heading p {
    color: var(--home-muted);
    max-width: 880px;
}

.home-about-grid,
.home-contact-grid,
.home-content-grid {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 22px;
}

.home-about-photo {
    min-height: 300px;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(31,58,46,0.12), rgba(184,137,58,0.14));
    border: 1px solid var(--home-line);
    display: grid;
    place-items: center;
    color: var(--home-olive);
    font-weight: 900;
    overflow: hidden;
}

.home-about-photo img {
    width: 100%;
    height: 100%;
    min-height: 300px;
    object-fit: cover;
    object-position: center;
    display: block;
}

.home-about-content,
.home-grade-card,
.home-course-card,
.home-feature-card,
.home-honor-card,
.home-testimonial-card,
.home-banner-card,
.home-plan-card,
.home-contact-card,
.home-message-form,
.home-parent-box,
.home-footer {
    background: white;
    border: 1px solid var(--home-line);
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(31,58,46,0.05);
}

.home-about-content {
    padding: 26px;
}

.home-about-content p {
    color: var(--home-muted);
}

.home-mini-stats,
.home-grade-grid,
.home-course-grid,
.home-feature-grid,
.home-honor-grid,
.home-testimonial-grid,
.home-banner-grid,
.home-plan-grid,
.home-faq-grid {
    display: grid;
    gap: 16px;
}

.home-mini-stats {
    grid-template-columns: repeat(3, 1fr);
    margin: 20px 0;
}

.home-mini-stats div {
    background: var(--home-paper);
    border-radius: 10px;
    padding: 14px;
}

.home-mini-stats strong {
    display: block;
    color: var(--home-olive);
    font-size: 26px;
}

.home-mini-stats span {
    color: var(--home-muted);
    font-size: 12px;
}

.home-inline-links a,
.home-socials a {
    color: var(--home-olive);
    background: rgba(184,137,58,0.1);
    border-radius: 100px;
    padding: 7px 12px;
    font-size: 13px;
    font-weight: 900;
}

.home-grade-grid,
.home-plan-grid {
    grid-template-columns: repeat(3, 1fr);
}

.home-course-grid,
.home-feature-grid,
.home-honor-grid,
.home-testimonial-grid {
    grid-template-columns: repeat(3, 1fr);
}

.home-banner-grid {
    grid-template-columns: repeat(3, 1fr);
}

.home-grade-card,
.home-course-card,
.home-feature-card,
.home-honor-card,
.home-testimonial-card,
.home-banner-card,
.home-plan-card {
    padding: 20px;
}

.home-card-icon,
.home-feature-icon,
.home-avatar {
    width: 46px;
    height: 46px;
    margin-bottom: 12px;
}

.home-grade-card h3,
.home-course-card h3,
.home-feature-card h3,
.home-honor-card h3,
.home-banner-card h3,
.home-plan-card h3 {
    color: var(--home-olive);
    margin-bottom: 8px;
}

.home-grade-card p,
.home-feature-card p,
.home-course-card p,
.home-testimonial-card p,
.home-banner-card p,
.home-plan-card li,
.home-parent-box p {
    color: var(--home-muted);
    font-size: 14px;
}

.home-track {
    color: var(--home-gold);
    font-weight: 900;
    margin: 12px 0;
}

.home-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0;
}

.home-tags span {
    background: var(--home-paper);
    border: 1px solid var(--home-line);
    border-radius: 100px;
    color: var(--home-muted);
    padding: 5px 10px;
    font-size: 12px;
}

.home-course-card {
    overflow: hidden;
    padding: 0;
}

.home-course-thumb {
    height: 150px;
    background: linear-gradient(135deg, var(--home-olive), var(--home-olive-2));
    display: grid;
    place-items: center;
    color: var(--home-gold-light);
    font-weight: 900;
}

.home-course-body {
    padding: 18px;
}

.home-course-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0;
}

.home-course-meta span,
.home-course-meta strong {
    background: var(--home-paper);
    border-radius: 100px;
    padding: 5px 10px;
    color: var(--home-muted);
    font-size: 12px;
}

.home-course-meta strong {
    color: var(--home-gold);
}

.home-soft-band {
    max-width: none;
    padding-right: max(22px, calc((100vw - 1240px) / 2 + 22px));
    padding-left: max(22px, calc((100vw - 1240px) / 2 + 22px));
    background: rgba(31,58,46,0.04);
    border-block: 1px solid rgba(31,58,46,0.06);
}

.home-honor-card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    align-items: start;
}

.home-honor-card strong,
.home-honor-card small {
    grid-column: 1 / -1;
    color: var(--home-gold);
    font-weight: 900;
}

.home-honor-card p,
.home-honor-card span,
.home-testimonial-card span {
    color: var(--home-muted);
    font-size: 12px;
}

.home-testimonial-card {
    display: grid;
    gap: 8px;
}

.home-testimonial-card p {
    min-height: 74px;
}

.home-banner-card {
    background: linear-gradient(135deg, white, rgba(184,137,58,0.09));
}

.home-plan-card {
    display: grid;
    gap: 10px;
}

.home-plan-card strong {
    color: var(--home-gold);
    font-size: 24px;
}

.home-plan-card span {
    color: var(--home-muted);
}

.home-plan-card ul {
    padding: 0 18px 0 0;
}

.home-steps {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
}

.home-steps div {
    background: white;
    border: 1px solid var(--home-line);
    border-radius: 12px;
    padding: 16px;
}

.home-steps strong {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    background: var(--home-olive);
    color: var(--home-gold-light);
    border-radius: 50%;
    margin-bottom: 10px;
}

.home-steps span {
    color: var(--home-muted);
    font-size: 13px;
}

.home-parent-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 22px;
    padding: 28px;
}

.home-faq-grid {
    grid-template-columns: repeat(2, 1fr);
}

.home-faq-grid details {
    background: white;
    border: 1px solid var(--home-line);
    border-radius: 12px;
    padding: 16px 18px;
}

.home-faq-grid summary {
    color: var(--home-olive);
    cursor: pointer;
    font-weight: 900;
}

.home-faq-grid p {
    color: var(--home-muted);
    margin-top: 10px;
    font-size: 14px;
}

.home-contact-grid {
    grid-template-columns: 1fr 1fr;
}

.home-contact-card,
.home-message-form {
    padding: 24px;
}

.home-contact-card p {
    color: var(--home-muted);
    margin-bottom: 10px;
}

.home-message-form {
    display: grid;
    gap: 12px;
}

.home-message-form input,
.home-message-form textarea {
    width: 100%;
    border: 1px solid var(--home-line);
    border-radius: 10px;
    padding: 12px 14px;
    background: var(--home-paper);
}

.home-message-form textarea {
    min-height: 130px;
    resize: vertical;
}

.home-footer {
    max-width: 1240px;
    margin: 34px auto 0;
    border-radius: 18px 18px 0 0;
    padding: 28px 22px;
    background: var(--home-olive);
    color: var(--home-cream);
}

.home-footer h3 {
    color: var(--home-gold-light);
    margin-bottom: 6px;
}

.home-footer p {
    color: rgba(245,241,232,0.72);
}

.home-footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 20px 0;
}

.home-footer-links a {
    color: rgba(245,241,232,0.78);
    background: rgba(245,241,232,0.06);
    border-radius: 100px;
    padding: 6px 10px;
    font-size: 13px;
}

.home-footer-bottom {
    border-top: 1px solid rgba(245,241,232,0.12);
    padding-top: 16px;
    color: rgba(245,241,232,0.62);
    font-size: 13px;
}

@media (max-width: 1080px) {
    .home-nav {
        align-items: flex-start;
        flex-direction: column;
    }

    .home-hero,
    .home-about-grid,
    .home-contact-grid {
        grid-template-columns: 1fr;
    }

    .home-grade-grid,
    .home-course-grid,
    .home-feature-grid,
    .home-honor-grid,
    .home-testimonial-grid,
    .home-banner-grid,
    .home-plan-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .home-steps {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 720px) {
    .home-nav-links,
    .home-nav-actions,
    .home-hero-actions {
        width: 100%;
    }

    .home-nav-links a,
    .home-nav-actions > *,
    .home-hero-actions > * {
        flex: 1 1 auto;
    }

    .home-hero {
        padding-top: 34px;
    }

    .home-hero-visual {
        min-height: 340px;
    }

    .home-teacher-photo {
        inset: 36px 28px 70px;
        font-size: 56px;
    }

    .home-grade-grid,
    .home-course-grid,
    .home-feature-grid,
    .home-honor-grid,
    .home-testimonial-grid,
    .home-banner-grid,
    .home-plan-grid,
    .home-faq-grid,
    .home-mini-stats,
    .home-steps {
        grid-template-columns: 1fr;
    }

    .home-parent-box {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .nav {
        align-items: flex-start;
        flex-direction: column;
    }

    .hero h1 { font-size: 2.5em; }
    .hero p { font-size: 1.1em; }
    .section-title { font-size: 2em; }

    .app-shell {
        grid-template-columns: 1fr;
    }

    .sidebar {
        position: static;
    }

    .sidebar-nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .topbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .content {
        padding: 18px;
    }
}

/* Student dashboard based on prototype/student-dashboard.html */
.claude-student-dashboard {
    --olive-deep: #1F3A2E;
    --olive: #2D5043;
    --olive-light: #4A7C6B;
    --cream: #F5F1E8;
    --cream-warm: #EFE7D2;
    --gold: #B8893A;
    --gold-light: #D4A95A;
    --ink: #1A1815;
    --ink-soft: #3A3833;
    --rust: #A0522D;
    --paper: #FAF6EC;
    --success: #2D7A4F;
    --warning: #C77B1A;
    --danger: #B22222;
    background: var(--paper);
    color: var(--ink);
    display: flex;
    min-height: 100vh;
    line-height: 1.6;
    font-family: 'Cairo', 'Tajawal', sans-serif;
}

.claude-student-dashboard * {
    box-sizing: border-box;
}

.claude-student-dashboard .student-sidebar {
    width: 280px;
    background: var(--olive-deep);
    color: var(--cream);
    padding: 28px 20px;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

.claude-student-dashboard .student-sidebar-logo {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 12px 28px;
    border-bottom: 1px solid rgba(184,137,58,0.2);
    margin-bottom: 24px;
}

.claude-student-dashboard .student-sidebar-logo .mark,
.claude-student-dashboard .student-avatar {
    background: var(--gold);
    color: var(--olive-deep);
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 900;
}

.claude-student-dashboard .student-sidebar-logo .mark {
    width: 42px;
    height: 42px;
    font-size: 18px;
}

.claude-student-dashboard .student-sidebar-logo .name {
    font-size: 20px;
    font-weight: 900;
}

.claude-student-dashboard .student-sidebar-logo .subtitle {
    font-size: 11px;
    color: rgba(245,241,232,0.65);
    margin-top: -2px;
}

.claude-student-dashboard .student-info {
    padding: 16px;
    background: rgba(184,137,58,0.08);
    border: 1px solid rgba(184,137,58,0.15);
    border-radius: 10px;
    margin-bottom: 24px;
}

.claude-student-dashboard .student-avatar {
    width: 56px;
    height: 56px;
    font-size: 18px;
    margin: 0 auto 12px;
}

.claude-student-dashboard .student-name {
    text-align: center;
    font-size: 17px;
    font-weight: 900;
}

.claude-student-dashboard .student-grade {
    text-align: center;
    font-size: 12px;
    color: var(--gold-light);
    margin-top: 2px;
}

.claude-student-dashboard .student-code {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed rgba(184,137,58,0.2);
    text-align: center;
    font-size: 11px;
    opacity: 0.8;
}

.claude-student-dashboard .student-code strong {
    color: var(--gold-light);
    display: block;
    font-size: 15px;
    letter-spacing: 0.08em;
    margin-top: 2px;
    word-break: break-word;
}

.claude-student-dashboard .student-nav-section {
    margin-bottom: 16px;
}

.claude-student-dashboard .student-nav-title {
    font-size: 11px;
    color: rgba(245,241,232,0.4);
    text-transform: uppercase;
    letter-spacing: 0.15em;
    padding: 0 12px;
    margin-bottom: 6px;
}

.claude-student-dashboard .student-nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 11px 14px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: rgba(245,241,232,0.75);
    text-decoration: none;
    text-align: right;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 2px;
    transition: all 0.2s;
    position: relative;
}

.claude-student-dashboard .student-nav-item:hover {
    background: rgba(184,137,58,0.1);
    color: var(--cream);
}

.claude-student-dashboard .student-nav-item.active {
    background: var(--gold);
    color: var(--olive-deep);
}

.claude-student-dashboard .student-nav-item.active::before {
    content: '';
    position: absolute;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 24px;
    background: var(--gold);
    border-radius: 4px 0 0 4px;
}

.claude-student-dashboard .student-nav-icon {
    width: 18px;
    text-align: center;
}

.claude-student-dashboard .student-nav-badge {
    margin-right: auto;
    background: var(--danger);
    color: white;
    padding: 1px 7px;
    border-radius: 100px;
    font-size: 10px;
    font-weight: 900;
}

.claude-student-dashboard .student-sidebar-footer {
    margin-top: auto;
    padding-top: 20px;
    border-top: 1px solid rgba(184,137,58,0.15);
}

.claude-student-dashboard .student-main {
    flex: 1;
    padding: 36px 44px;
    overflow-x: hidden;
    background: var(--paper);
}

.claude-student-dashboard .student-main-full {
    display: grid;
    place-items: center;
}

.claude-student-dashboard .student-topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    margin-bottom: 36px;
}

.claude-student-dashboard .student-greeting h1 {
    font-size: 36px;
    color: var(--olive-deep);
    line-height: 1.2;
    font-weight: 900;
}

.claude-student-dashboard .student-greeting h1 .accent {
    color: var(--gold);
    font-style: italic;
}

.claude-student-dashboard .student-greeting p {
    color: var(--ink-soft);
    margin-top: 6px;
    font-size: 14px;
}

.claude-student-dashboard .student-topbar-actions {
    display: flex;
    gap: 12px;
    align-items: center;
}

.claude-student-dashboard .student-icon-btn,
.claude-student-dashboard .student-qr-btn {
    text-decoration: none;
    transition: all 0.2s;
}

.claude-student-dashboard .student-icon-btn {
    width: 44px;
    height: 44px;
    background: white;
    border: 1px solid rgba(31,58,46,0.1);
    border-radius: 50%;
    display: grid;
    place-items: center;
    position: relative;
    color: var(--olive-deep);
    font-size: 18px;
}

.claude-student-dashboard .student-icon-btn:hover {
    background: var(--olive-deep);
    color: var(--cream);
}

.claude-student-dashboard .student-icon-btn .dot {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 8px;
    height: 8px;
    background: var(--danger);
    border-radius: 50%;
    border: 2px solid white;
}

.claude-student-dashboard .student-qr-btn {
    background: var(--olive-deep);
    color: var(--cream);
    padding: 10px 20px;
    border-radius: 100px;
    font-weight: 900;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.claude-student-dashboard .student-subscription-banner {
    background: linear-gradient(135deg, var(--olive-deep) 0%, var(--olive) 100%);
    color: var(--cream);
    padding: 24px 30px;
    border-radius: 12px;
    margin-bottom: 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    position: relative;
    overflow: hidden;
}

.claude-student-dashboard .student-subscription-banner::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -20%;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(184,137,58,0.15), transparent);
    pointer-events: none;
}

.claude-student-dashboard .sub-info,
.claude-student-dashboard .sub-countdown {
    position: relative;
    z-index: 1;
}

.claude-student-dashboard .sub-label {
    color: var(--gold-light);
    font-size: 12px;
    font-style: italic;
    letter-spacing: 0.1em;
    margin-bottom: 6px;
}

.claude-student-dashboard .sub-name {
    font-size: 22px;
    font-weight: 900;
    margin-bottom: 4px;
}

.claude-student-dashboard .sub-meta {
    font-size: 13px;
    opacity: 0.78;
}

.claude-student-dashboard .sub-countdown {
    text-align: center;
}

.claude-student-dashboard .sub-days {
    font-size: 48px;
    font-weight: 900;
    line-height: 1;
    color: var(--gold-light);
}

.claude-student-dashboard .sub-days-label {
    font-size: 11px;
    opacity: 0.72;
    margin-top: 4px;
}

.claude-student-dashboard .student-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-bottom: 32px;
}

.claude-student-dashboard .student-stat-card,
.claude-student-dashboard .student-card {
    background: white;
    border-radius: 10px;
    border: 1px solid rgba(31,58,46,0.08);
}

.claude-student-dashboard .student-stat-card {
    padding: 24px;
    position: relative;
    overflow: hidden;
}

.claude-student-dashboard .student-stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 80px;
    height: 80px;
    background: radial-gradient(circle at top right, var(--stat-color, var(--olive)), transparent 70%);
    opacity: 0.08;
}

.claude-student-dashboard .stat-card-header {
    display: flex;
    justify-content: space-between;
    align-items: start;
    margin-bottom: 16px;
}

.claude-student-dashboard .stat-card-icon {
    width: 38px;
    height: 38px;
    background: var(--stat-color);
    color: white;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 16px;
}

.claude-student-dashboard .stat-trend {
    font-size: 12px;
    color: var(--success);
    font-weight: 900;
}

.claude-student-dashboard .stat-value {
    font-size: 34px;
    font-weight: 900;
    color: var(--olive-deep);
    line-height: 1;
    overflow-wrap: anywhere;
}

.claude-student-dashboard .stat-label {
    font-size: 13px;
    color: var(--ink-soft);
    margin-top: 8px;
}

.claude-student-dashboard .stat-progress {
    margin-top: 12px;
    height: 4px;
    background: rgba(31,58,46,0.08);
    border-radius: 2px;
    overflow: hidden;
}

.claude-student-dashboard .stat-progress-bar {
    height: 100%;
    background: var(--stat-color);
    border-radius: 2px;
}

.claude-student-dashboard .student-content-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 24px;
}

.claude-student-dashboard .student-card {
    padding: 28px;
}

.claude-student-dashboard .student-course-progress {
    border: 1px solid rgba(31,58,46,0.12);
    border-radius: 12px;
    padding: 14px;
    margin-top: 12px;
    background: rgba(255,255,255,0.72);
    display: grid;
    gap: 10px;
}

.claude-student-dashboard .student-course-progress strong {
    display: block;
    color: var(--olive-deep);
    font-size: 1rem;
}

.claude-student-dashboard .student-course-progress span {
    color: var(--ink-soft);
    font-size: .88rem;
}

.claude-student-dashboard .student-course-bar {
    height: 7px;
    background: rgba(31,58,46,0.12);
    border-radius: 999px;
    overflow: hidden;
}

.claude-student-dashboard .student-course-bar i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--olive), var(--gold));
    border-radius: inherit;
}

.claude-student-dashboard .student-course-progress.attendance .student-course-bar i {
    background: linear-gradient(90deg, #1A4F8B, var(--success));
}

.claude-student-dashboard .student-card-spaced {
    margin-top: 24px;
}

.claude-student-dashboard .student-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 22px;
}

.claude-student-dashboard .student-card-title {
    font-size: 22px;
    color: var(--olive-deep);
    font-weight: 900;
}

.claude-student-dashboard .student-card-link {
    font-size: 13px;
    color: var(--gold);
    text-decoration: none;
    font-weight: 900;
    white-space: nowrap;
}

.claude-student-dashboard .student-lesson-row {
    display: flex;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid rgba(31,58,46,0.06);
    align-items: center;
}

.claude-student-dashboard .student-lesson-row:last-child {
    border-bottom: 0;
}

.claude-student-dashboard .student-lesson-thumb {
    width: 110px;
    height: 70px;
    border-radius: 6px;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
    display: grid;
    place-items: center;
}

.claude-student-dashboard .student-lesson-thumb::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    height: 3px;
    width: var(--progress, 0%);
    background: var(--gold);
}

.claude-student-dashboard .student-lesson-play {
    width: 32px;
    height: 32px;
    background: rgba(255,255,255,0.2);
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 12px;
    color: white;
}

.claude-student-dashboard .student-lesson-info {
    flex: 1;
    min-width: 0;
}

.claude-student-dashboard .student-lesson-subject {
    font-size: 11px;
    color: var(--gold);
    letter-spacing: 0.1em;
    margin-bottom: 3px;
    text-transform: uppercase;
}

.claude-student-dashboard .student-lesson-title {
    font-weight: 900;
    color: var(--olive-deep);
    margin-bottom: 4px;
    font-size: 15px;
}

.claude-student-dashboard .student-lesson-meta,
.claude-student-dashboard .student-att-note {
    font-size: 12px;
    color: var(--ink-soft);
}

.claude-student-dashboard .student-attendance-session-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 12px;
}

.claude-student-dashboard .student-attendance-session-card {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    align-items: start;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fffdf8;
    padding: 14px;
}

.claude-student-dashboard .student-attendance-session-card strong,
.claude-student-dashboard .student-attendance-session-card span,
.claude-student-dashboard .student-attendance-session-card time {
    display: block;
}

.claude-student-dashboard .student-attendance-session-card strong {
    color: var(--olive-deep);
    font-size: 15px;
}

.claude-student-dashboard .student-attendance-session-card span,
.claude-student-dashboard .student-attendance-session-card time {
    color: var(--ink-soft);
    font-size: 12px;
    margin-top: 5px;
}

.claude-student-dashboard .student-attendance-session-card b {
    grid-column: 1 / -1;
    justify-self: start;
    border-radius: 999px;
    background: #f4efe4;
    color: var(--gold);
    padding: 5px 10px;
    font-size: 12px;
}

.claude-student-dashboard .student-attendance-session-card.present b {
    background: #e8f4ed;
    color: var(--olive);
}

.claude-student-dashboard .student-lesson-progress-text {
    font-size: 11px;
    color: var(--olive);
    margin-top: 4px;
    font-weight: 900;
}

.claude-student-dashboard .student-exam-item {
    padding: 14px 16px;
    border: 1px solid rgba(31,58,46,0.08);
    border-radius: 8px;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all 0.2s;
}

.claude-student-dashboard .student-exam-item:hover {
    border-color: var(--gold);
    transform: translateX(-3px);
}

.claude-student-dashboard .student-exam-date {
    background: var(--olive-deep);
    color: var(--cream);
    padding: 10px 12px;
    border-radius: 6px;
    text-align: center;
    min-width: 50px;
}

.claude-student-dashboard .student-exam-day {
    font-size: 22px;
    font-weight: 900;
    color: var(--gold-light);
    line-height: 1;
}

.claude-student-dashboard .student-exam-month {
    font-size: 10px;
    margin-top: 2px;
    opacity: 0.75;
}

.claude-student-dashboard .student-exam-info {
    flex: 1;
    padding: 0 16px;
    min-width: 0;
}

.claude-student-dashboard .student-exam-info h4 {
    font-size: 15px;
    color: var(--olive-deep);
    margin-bottom: 3px;
}

.claude-student-dashboard .student-exam-info .meta {
    font-size: 12px;
    color: var(--ink-soft);
}

.claude-student-dashboard .student-exam-badge {
    background: var(--warning);
    color: white;
    padding: 4px 10px;
    border-radius: 100px;
    font-size: 11px;
    font-weight: 900;
}

.claude-student-dashboard .student-leaderboard-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(31,58,46,0.05);
}

.claude-student-dashboard .student-leaderboard-item:last-child {
    border-bottom: 0;
}

.claude-student-dashboard .student-leaderboard-item.me {
    background: rgba(184,137,58,0.08);
    margin: 4px -16px;
    padding: 10px 16px;
    border-radius: 6px;
    border-bottom: 0;
}

.claude-student-dashboard .student-lb-rank {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 900;
    font-size: 16px;
    background: rgba(31,58,46,0.05);
    color: var(--olive-deep);
    flex-shrink: 0;
}

.claude-student-dashboard .student-lb-name {
    flex: 1;
    font-size: 14px;
}

.claude-student-dashboard .student-lb-score {
    font-weight: 900;
    color: var(--olive-deep);
    font-size: 16px;
}

.claude-student-dashboard .student-attendance-chart {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    margin-top: 16px;
}

.claude-student-dashboard .student-att-day {
    aspect-ratio: 1;
    border-radius: 4px;
    background: rgba(31,58,46,0.05);
    display: grid;
    place-items: center;
    font-size: 11px;
    color: var(--ink-soft);
}

.claude-student-dashboard .student-att-day.present {
    background: var(--success);
    color: white;
}

.claude-student-dashboard .student-att-day.absent {
    background: rgba(178,34,34,0.15);
    color: var(--danger);
}

.claude-student-dashboard .student-att-day.future {
    background: transparent;
    border: 1px dashed rgba(31,58,46,0.15);
}

.claude-student-dashboard .student-att-legend {
    display: flex;
    gap: 16px;
    margin-top: 16px;
    font-size: 11px;
    color: var(--ink-soft);
    flex-wrap: wrap;
}

.claude-student-dashboard .student-att-legend-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 2px;
    margin-left: 4px;
    vertical-align: middle;
}

.claude-student-dashboard .student-att-legend-dot.present {
    background: var(--success);
}

.claude-student-dashboard .student-att-legend-dot.absent {
    background: rgba(178,34,34,0.15);
}

.claude-student-dashboard .student-att-legend-dot.future {
    border: 1px dashed rgba(31,58,46,0.3);
}

.claude-student-dashboard .student-empty {
    padding: 18px;
    border-radius: 8px;
    background: rgba(31,58,46,0.05);
    color: var(--ink-soft);
    text-align: center;
    font-size: 13px;
}

.claude-student-dashboard .student-qr-image,
.claude-student-dashboard .student-qr-box {
    width: 180px;
    height: 180px;
    margin: 0 auto;
}

.claude-student-dashboard .student-qr-image {
    display: block;
    object-fit: contain;
    border-radius: 12px;
    border: 1px solid rgba(31,58,46,0.08);
    background: white;
}

.claude-student-dashboard .student-qr-box {
    display: grid;
    place-items: center;
    border: 2px dashed rgba(31,58,46,0.18);
    border-radius: 12px;
    color: var(--olive-deep);
    background: rgba(31,58,46,0.04);
    text-align: center;
    padding: 12px;
    overflow-wrap: anywhere;
    font-weight: 900;
}

.claude-student-dashboard .fade-up {
    opacity: 0;
    transform: translateY(15px);
    animation: studentFadeUp 0.6s forwards;
}

.claude-student-dashboard .d1 { animation-delay: 0.05s; }
.claude-student-dashboard .d2 { animation-delay: 0.1s; }
.claude-student-dashboard .d3 { animation-delay: 0.15s; }
.claude-student-dashboard .d4 { animation-delay: 0.2s; }

@keyframes studentFadeUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 1100px) {
    .claude-student-dashboard .student-sidebar {
        width: 84px;
        padding: 20px 10px;
    }

    .claude-student-dashboard .student-sidebar-logo .name,
    .claude-student-dashboard .student-sidebar-logo .subtitle,
    .claude-student-dashboard .student-info,
    .claude-student-dashboard .student-nav-title,
    .claude-student-dashboard .student-nav-item span:not(.student-nav-icon),
    .claude-student-dashboard .student-nav-badge {
        display: none;
    }

    .claude-student-dashboard .student-nav-item {
        justify-content: center;
        padding: 12px;
    }

    .claude-student-dashboard .student-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .claude-student-dashboard .student-content-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .claude-student-dashboard {
        display: block;
    }

    .claude-student-dashboard .student-sidebar {
        position: static;
        width: 100%;
        height: auto;
    }

    .claude-student-dashboard .student-sidebar-logo .name,
    .claude-student-dashboard .student-sidebar-logo .subtitle,
    .claude-student-dashboard .student-info,
    .claude-student-dashboard .student-nav-title,
    .claude-student-dashboard .student-nav-item span:not(.student-nav-icon),
    .claude-student-dashboard .student-nav-badge {
        display: block;
    }

    .claude-student-dashboard .student-nav-section {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
    }

    .claude-student-dashboard .student-nav-title {
        grid-column: 1 / -1;
    }

    .claude-student-dashboard .student-nav-item {
        justify-content: flex-start;
    }

    .claude-student-dashboard .student-main {
        padding: 22px 16px;
    }

    .claude-student-dashboard .student-topbar,
    .claude-student-dashboard .student-subscription-banner {
        align-items: flex-start;
        flex-direction: column;
    }

    .claude-student-dashboard .student-greeting h1 {
        font-size: 30px;
    }

    .claude-student-dashboard .student-stats-grid {
        grid-template-columns: 1fr;
    }

    .claude-student-dashboard .student-card {
        padding: 20px;
    }

    .claude-student-dashboard .student-lesson-row,
    .claude-student-dashboard .student-exam-item {
        align-items: flex-start;
    }
}

/* QR scanner page based on prototype/qr-scanner.html */
.claude-qr-dashboard {
    --olive-deep: #1F3A2E;
    --olive: #2D5043;
    --olive-light: #4A7C6B;
    --cream: #F5F1E8;
    --gold: #B8893A;
    --gold-light: #D4A95A;
    --ink: #1A1815;
    --ink-soft: #3A3833;
    --paper: #FAF6EC;
    --success: #2D7A4F;
    --warning: #C77B1A;
    --danger: #B22222;
    background: var(--ink);
    color: var(--cream);
    min-height: 100vh;
    overflow-x: hidden;
    font-family: 'Cairo', 'Tajawal', sans-serif;
}

.claude-qr-dashboard * {
    box-sizing: border-box;
}

.claude-qr-dashboard .qr-phone-wrapper {
    max-width: 480px;
    margin: 0 auto;
    min-height: 100vh;
    background: var(--ink);
    position: relative;
    overflow: hidden;
}

.claude-qr-dashboard .qr-loading {
    display: grid;
    place-items: center;
    padding: 24px;
}

.claude-qr-dashboard .qr-status-bar {
    background: var(--olive-deep);
    padding: 16px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(184,137,58,0.2);
}

.claude-qr-dashboard .qr-supervisor-info {
    display: flex;
    align-items: center;
    gap: 10px;
}

.claude-qr-dashboard .qr-sup-avatar,
.claude-qr-dashboard .qr-scan-avatar,
.claude-qr-dashboard .qr-student-profile .avatar {
    background: var(--gold);
    color: var(--olive-deep);
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 900;
}

.claude-qr-dashboard .qr-sup-avatar {
    width: 38px;
    height: 38px;
    font-size: 15px;
}

.claude-qr-dashboard .qr-sup-meta {
    font-size: 13px;
}

.claude-qr-dashboard .qr-sup-meta .name {
    font-weight: 900;
    color: var(--cream);
}

.claude-qr-dashboard .qr-sup-meta .role {
    font-size: 11px;
    color: var(--gold-light);
    font-style: italic;
    letter-spacing: 0.05em;
}

.claude-qr-dashboard .qr-logout-btn {
    background: transparent;
    border: 1px solid rgba(245,241,232,0.2);
    color: var(--cream);
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: grid;
    place-items: center;
}

.claude-qr-dashboard .qr-session-context {
    background: rgba(184,137,58,0.08);
    padding: 18px 20px;
    border-bottom: 1px solid rgba(184,137,58,0.15);
}

.claude-qr-dashboard .qr-session-label {
    font-size: 10px;
    color: var(--gold-light);
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-style: italic;
    margin-bottom: 6px;
}

.claude-qr-dashboard .qr-session-title {
    font-size: 20px;
    color: var(--cream);
    margin-bottom: 4px;
    font-weight: 900;
}

.claude-qr-dashboard .qr-session-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    color: rgba(245,241,232,0.7);
}

.claude-qr-dashboard .qr-session-state {
    color: var(--gold-light);
    font-weight: 900;
}

.claude-qr-dashboard .qr-session-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed rgba(184,137,58,0.2);
}

.claude-qr-dashboard .qr-session-stat {
    min-width: 0;
    text-align: center;
}

.claude-qr-dashboard .qr-session-stat-value {
    font-size: 20px;
    color: var(--gold-light);
    font-weight: 900;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.claude-qr-dashboard .qr-session-stat-label {
    font-size: 10px;
    color: rgba(245,241,232,0.6);
    margin-top: 4px;
}

.claude-qr-dashboard .qr-student-section,
.claude-qr-dashboard .qr-camera-section {
    padding: 22px 20px 0;
    text-align: center;
}

.claude-qr-dashboard .qr-section-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    text-align: right;
}

.claude-qr-dashboard .qr-section-heading h2 {
    font-size: 18px;
    color: var(--cream);
}

.claude-qr-dashboard .qr-section-heading span {
    font-size: 11px;
    color: var(--gold-light);
}

.claude-qr-dashboard .qr-student-card,
.claude-qr-dashboard .qr-placeholder-card {
    background: rgba(245,241,232,0.05);
    border: 1px solid rgba(184,137,58,0.18);
    border-radius: 16px;
    padding: 18px;
}

.claude-qr-dashboard .qr-student-image,
.claude-qr-dashboard .qr-code-fallback {
    width: min(240px, 80vw);
    height: min(240px, 80vw);
    margin: 0 auto;
    border-radius: 14px;
    background: var(--paper);
}

.claude-qr-dashboard .qr-student-image {
    display: block;
    object-fit: contain;
    padding: 10px;
}

.claude-qr-dashboard .qr-code-fallback {
    display: grid;
    place-items: center;
    color: var(--olive-deep);
    border: 2px dashed rgba(31,58,46,0.2);
    padding: 16px;
    overflow-wrap: anywhere;
    font-weight: 900;
}

.claude-qr-dashboard .qr-student-code {
    color: var(--gold-light);
    font-weight: 900;
    font-size: 13px;
    letter-spacing: 0.08em;
    margin-top: 12px;
    overflow-wrap: anywhere;
}

.claude-qr-dashboard .qr-placeholder-card {
    color: rgba(245,241,232,0.68);
}

.claude-qr-dashboard .qr-placeholder-mark {
    width: 42px;
    height: 42px;
    margin: 0 auto 12px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--gold);
    color: var(--olive-deep);
    font-weight: 900;
}

.claude-qr-dashboard .qr-placeholder-card strong {
    display: block;
    color: var(--cream);
    margin-bottom: 4px;
}

.claude-qr-dashboard .qr-placeholder-card span {
    display: block;
    font-size: 12px;
}

.claude-qr-dashboard .qr-camera-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 1;
    max-width: 360px;
    margin: 0 auto;
    background: linear-gradient(135deg, #0a0a08 0%, #1a1a16 100%);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0,0,0,0.4), inset 0 0 60px rgba(184,137,58,0.05);
}

.claude-qr-dashboard .qr-camera-feed {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at center, rgba(45,80,67,0.3), transparent 70%), linear-gradient(180deg, #1a2d24 0%, #0d1a14 100%);
}

.claude-qr-dashboard .qr-camera-feed::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: linear-gradient(90deg, rgba(184,137,58,0.03) 1px, transparent 1px), linear-gradient(rgba(184,137,58,0.03) 1px, transparent 1px);
    background-size: 20px 20px;
}

.claude-qr-dashboard .qr-camera-feed::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 60px;
    height: 60px;
    transform: translate(-50%, -50%);
    background: rgba(255,255,255,0.05);
    border-radius: 50%;
    box-shadow: 0 0 100px rgba(184,137,58,0.1);
}

.claude-qr-dashboard .qr-scanner-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.claude-qr-dashboard .qr-scan-area {
    position: relative;
    width: 220px;
    height: 220px;
    border: 1px solid rgba(212,169,90,0.3);
    border-radius: 12px;
}

.claude-qr-dashboard .qr-scan-corner {
    position: absolute;
    width: 30px;
    height: 30px;
    border: 3px solid var(--gold);
}

.claude-qr-dashboard .corner-tl {
    top: -2px;
    left: -2px;
    border-right: 0;
    border-bottom: 0;
    border-radius: 8px 0 0 0;
}

.claude-qr-dashboard .corner-tr {
    top: -2px;
    right: -2px;
    border-left: 0;
    border-bottom: 0;
    border-radius: 0 8px 0 0;
}

.claude-qr-dashboard .corner-bl {
    bottom: -2px;
    left: -2px;
    border-right: 0;
    border-top: 0;
    border-radius: 0 0 0 8px;
}

.claude-qr-dashboard .corner-br {
    bottom: -2px;
    right: -2px;
    border-left: 0;
    border-top: 0;
    border-radius: 0 0 8px 0;
}

.claude-qr-dashboard .qr-scan-line {
    position: absolute;
    top: 0;
    right: 10%;
    width: 80%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--gold-light), transparent);
    box-shadow: 0 0 12px var(--gold-light);
    animation: qrScan 2.2s ease-in-out infinite;
}

@keyframes qrScan {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(216px);
    }
}

.claude-qr-dashboard .qr-scan-helper {
    margin-top: 18px;
    font-size: 14px;
    color: rgba(245,241,232,0.62);
}

.claude-qr-dashboard .qr-scan-helper strong {
    color: var(--gold-light);
}

.claude-qr-dashboard .qr-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    padding: 20px 20px 16px;
}

.claude-qr-dashboard .qr-action-btn {
    background: rgba(245,241,232,0.05);
    border: 1px solid rgba(184,137,58,0.15);
    color: var(--cream);
    padding: 14px;
    border-radius: 10px;
    font-weight: 900;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s;
}

.claude-qr-dashboard .qr-action-btn:active {
    transform: scale(0.97);
}

.claude-qr-dashboard .qr-action-btn.primary {
    background: var(--gold);
    color: var(--olive-deep);
    border-color: var(--gold);
}

.claude-qr-dashboard .qr-action-btn .icon {
    font-size: 16px;
}

.claude-qr-dashboard .qr-recent-section {
    background: var(--olive-deep);
    padding: 20px;
    border-top: 1px solid rgba(184,137,58,0.2);
}

.claude-qr-dashboard .qr-recent-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.claude-qr-dashboard .qr-recent-title {
    font-size: 17px;
    color: var(--cream);
    font-weight: 900;
}

.claude-qr-dashboard .qr-recent-count {
    font-size: 11px;
    color: var(--gold-light);
    background: rgba(184,137,58,0.15);
    padding: 3px 10px;
    border-radius: 100px;
    font-weight: 900;
}

.claude-qr-dashboard .qr-scan-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid rgba(245,241,232,0.06);
}

.claude-qr-dashboard .qr-scan-item:last-child {
    border-bottom: 0;
}

.claude-qr-dashboard .qr-scan-avatar {
    width: 36px;
    height: 36px;
    font-size: 14px;
    flex-shrink: 0;
}

.claude-qr-dashboard .qr-scan-info {
    flex: 1;
    min-width: 0;
}

.claude-qr-dashboard .qr-scan-name {
    font-size: 13px;
    font-weight: 900;
    color: var(--cream);
    margin-bottom: 2px;
}

.claude-qr-dashboard .qr-scan-time {
    font-size: 11px;
    color: rgba(245,241,232,0.5);
}

.claude-qr-dashboard .qr-scan-badge {
    background: rgba(45,122,79,0.2);
    color: var(--success);
    padding: 3px 10px;
    border-radius: 100px;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

.claude-qr-dashboard .qr-scan-badge.late {
    background: rgba(199,123,26,0.2);
    color: var(--warning);
}

.claude-qr-dashboard .qr-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.6);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 100;
    padding: 20px;
}

.claude-qr-dashboard .qr-modal-backdrop.show {
    display: flex;
}

.claude-qr-dashboard .qr-modal {
    background: var(--paper);
    color: var(--ink);
    max-width: 380px;
    width: 100%;
    border-radius: 18px;
    overflow: hidden;
}

.claude-qr-dashboard .qr-modal-success-header {
    background: linear-gradient(135deg, var(--success), #1F5C36);
    padding: 30px;
    text-align: center;
    color: white;
    position: relative;
    overflow: hidden;
}

.claude-qr-dashboard .qr-modal-success-header::before {
    content: '';
    position: absolute;
    top: -50px;
    right: -50px;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(255,255,255,0.1), transparent);
}

.claude-qr-dashboard .qr-check-circle {
    width: 80px;
    height: 80px;
    background: rgba(255,255,255,0.2);
    border-radius: 50%;
    margin: 0 auto 16px;
    display: grid;
    place-items: center;
    font-size: 40px;
    border: 3px solid rgba(255,255,255,0.4);
}

.claude-qr-dashboard .qr-modal-success-header h2 {
    font-size: 24px;
    margin-bottom: 4px;
}

.claude-qr-dashboard .qr-modal-success-header p {
    font-size: 13px;
    opacity: 0.9;
}

.claude-qr-dashboard .qr-modal-body {
    padding: 24px;
}

.claude-qr-dashboard .qr-student-profile {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px;
    background: white;
    border-radius: 10px;
    margin-bottom: 20px;
    border: 1px solid rgba(31,58,46,0.06);
}

.claude-qr-dashboard .qr-student-profile .avatar {
    width: 52px;
    height: 52px;
    background: var(--olive-deep);
    color: var(--gold);
    font-size: 18px;
    flex-shrink: 0;
}

.claude-qr-dashboard .qr-student-profile .info h3 {
    color: var(--olive-deep);
    font-size: 17px;
    margin-bottom: 2px;
}

.claude-qr-dashboard .qr-student-profile .info .code {
    color: var(--gold);
    font-size: 12px;
    letter-spacing: 0.1em;
}

.claude-qr-dashboard .qr-unlocked-section {
    background: rgba(184,137,58,0.08);
    border: 1px dashed rgba(184,137,58,0.3);
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 16px;
}

.claude-qr-dashboard .qr-unlocked-label {
    font-size: 11px;
    color: var(--gold);
    font-style: italic;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.claude-qr-dashboard .qr-unlocked-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    font-size: 13px;
    color: var(--olive-deep);
}

.claude-qr-dashboard .qr-unlocked-item .check {
    color: var(--success);
    font-weight: 900;
}

.claude-qr-dashboard .qr-modal-actions {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 10px;
}

.claude-qr-dashboard .qr-modal-btn {
    padding: 13px;
    border-radius: 100px;
    border: 0;
    font-weight: 900;
    font-size: 13px;
}

.claude-qr-dashboard .qr-modal-btn.secondary {
    background: white;
    border: 1px solid rgba(31,58,46,0.15);
    color: var(--olive-deep);
}

.claude-qr-dashboard .qr-modal-btn.primary {
    background: var(--olive-deep);
    color: var(--cream);
}

@media (min-width: 600px) {
    .claude-qr-dashboard .qr-phone-wrapper {
        margin: 30px auto;
        border-radius: 32px;
        box-shadow: 0 30px 80px rgba(0,0,0,0.5);
        min-height: calc(100vh - 60px);
        max-width: 420px;
    }
}

@media (max-width: 420px) {
    .claude-qr-dashboard .qr-session-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .claude-qr-dashboard .qr-actions {
        grid-template-columns: 1fr;
    }

    .claude-qr-dashboard .qr-scan-area {
        width: 190px;
        height: 190px;
    }

    @keyframes qrScan {
        0%, 100% {
            transform: translateY(0);
        }
        50% {
            transform: translateY(186px);
        }
    }
}

/* Attendance placeholder page */
.claude-attendance-page {
    --attendance-olive: #1F3A2E;
    --attendance-olive-soft: #2D5043;
    --attendance-gold: #B8893A;
    --attendance-paper: #FAF6EC;
    --attendance-ink: #1A1815;
    --attendance-muted: #5f665f;
    --attendance-line: rgba(31,58,46,0.1);
    color: var(--attendance-ink);
}

.claude-attendance-page .attendance-hero {
    background: linear-gradient(135deg, var(--attendance-olive), var(--attendance-olive-soft));
    color: #F5F1E8;
    border-radius: 14px;
    padding: 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    margin-bottom: 22px;
    position: relative;
    overflow: hidden;
}

.claude-attendance-page .attendance-hero::before {
    content: '';
    position: absolute;
    top: -80px;
    left: -80px;
    width: 260px;
    height: 260px;
    background: radial-gradient(circle, rgba(184,137,58,0.18), transparent 62%);
    pointer-events: none;
}

.claude-attendance-page .attendance-hero > * {
    position: relative;
    z-index: 1;
}

.claude-attendance-page .attendance-kicker {
    display: block;
    color: #D4A95A;
    font-size: 12px;
    letter-spacing: 0.12em;
    margin-bottom: 8px;
    text-transform: uppercase;
    font-weight: 900;
}

.claude-attendance-page .attendance-hero h2 {
    font-size: 32px;
    margin-bottom: 6px;
    font-weight: 900;
}

.claude-attendance-page .attendance-hero p {
    color: rgba(245,241,232,0.75);
    font-size: 14px;
}

.claude-attendance-page .attendance-qr-button,
.claude-attendance-page .attendance-secondary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    border-radius: 100px;
    text-decoration: none;
    font-weight: 900;
    white-space: nowrap;
}

.claude-attendance-page .attendance-qr-button {
    background: var(--attendance-gold);
    color: var(--attendance-olive);
    padding: 10px 18px;
}

.claude-attendance-page .attendance-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 22px;
}

.claude-attendance-page .attendance-stat-card,
.claude-attendance-page .attendance-card,
.claude-attendance-page .attendance-next-step {
    background: white;
    border: 1px solid var(--attendance-line);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(31,58,46,0.05);
}

.claude-attendance-page .attendance-stat-card {
    padding: 20px;
    position: relative;
    overflow: hidden;
}

.claude-attendance-page .attendance-stat-card::after {
    content: '';
    position: absolute;
    inset: auto 0 0 0;
    height: 3px;
    background: linear-gradient(90deg, var(--attendance-gold), var(--attendance-olive-soft));
    opacity: 0.55;
}

.claude-attendance-page .attendance-stat-card span {
    display: block;
    color: var(--attendance-muted);
    font-size: 12px;
    margin-bottom: 8px;
    font-weight: 900;
}

.claude-attendance-page .attendance-stat-card strong {
    display: block;
    color: var(--attendance-olive);
    font-size: 34px;
    line-height: 1;
    margin-bottom: 8px;
}

.claude-attendance-page .attendance-stat-card small {
    color: var(--attendance-muted);
    font-size: 12px;
    line-height: 1.6;
}

.claude-attendance-page .attendance-card {
    padding: 24px;
    margin-bottom: 22px;
}

.claude-attendance-page .attendance-card-header,
.claude-attendance-page .attendance-next-step {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
}

.claude-attendance-page .attendance-card-header {
    margin-bottom: 18px;
}

.claude-attendance-page .attendance-card-header h3,
.claude-attendance-page .attendance-next-step h3 {
    color: var(--attendance-olive);
    font-size: 20px;
    margin-bottom: 4px;
    font-weight: 900;
}

.claude-attendance-page .attendance-card-header p,
.claude-attendance-page .attendance-next-step p {
    color: var(--attendance-muted);
    font-size: 13px;
    line-height: 1.7;
}

.claude-attendance-page .attendance-status-pill {
    background: rgba(184,137,58,0.12);
    color: var(--attendance-gold);
    border: 1px solid rgba(184,137,58,0.22);
    padding: 5px 12px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 900;
}

.claude-attendance-page .attendance-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--attendance-line);
    border-radius: 10px;
}

.claude-attendance-page .attendance-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 720px;
}

.claude-attendance-page .attendance-table th,
.claude-attendance-page .attendance-table td {
    padding: 14px 16px;
    border-bottom: 1px solid rgba(31,58,46,0.06);
    text-align: right;
}

.claude-attendance-page .attendance-table th {
    background: rgba(31,58,46,0.04);
    color: var(--attendance-olive);
    font-size: 12px;
    font-weight: 900;
}

.claude-attendance-page .attendance-empty-row td {
    padding: 36px 16px;
}

.claude-attendance-page .attendance-empty-state {
    display: grid;
    justify-items: center;
    gap: 6px;
    color: var(--attendance-muted);
}

.claude-attendance-page .attendance-empty-mark {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--attendance-gold);
    color: var(--attendance-olive);
    font-weight: 900;
    margin-bottom: 4px;
}

.claude-attendance-page .attendance-empty-state strong {
    color: var(--attendance-olive);
    font-size: 15px;
}

.claude-attendance-page .attendance-empty-state span {
    font-size: 13px;
}

.claude-attendance-page .attendance-next-step {
    padding: 22px 24px;
}

.claude-attendance-page .attendance-secondary-button {
    background: var(--attendance-olive);
    color: #F5F1E8;
    padding: 10px 18px;
}

@media (max-width: 980px) {
    .claude-attendance-page .attendance-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 680px) {
    .claude-attendance-page .attendance-hero,
    .claude-attendance-page .attendance-card-header,
    .claude-attendance-page .attendance-next-step {
        align-items: flex-start;
        flex-direction: column;
    }

    .claude-attendance-page .attendance-stats-grid {
        grid-template-columns: 1fr;
    }

    .claude-attendance-page .attendance-hero h2 {
        font-size: 28px;
    }
}

/* Exams placeholder page */
.claude-exams-page {
    --exams-olive: #1F3A2E;
    --exams-olive-soft: #2D5043;
    --exams-gold: #B8893A;
    --exams-paper: #FAF6EC;
    --exams-ink: #1A1815;
    --exams-muted: #5f665f;
    --exams-line: rgba(31,58,46,0.1);
    color: var(--exams-ink);
}

.claude-exams-page .exams-hero {
    background: linear-gradient(135deg, var(--exams-olive), var(--exams-olive-soft));
    color: #F5F1E8;
    border-radius: 14px;
    padding: 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    margin-bottom: 22px;
    position: relative;
    overflow: hidden;
}

.claude-exams-page .exams-hero::before {
    content: '';
    position: absolute;
    top: -80px;
    left: -80px;
    width: 260px;
    height: 260px;
    background: radial-gradient(circle, rgba(184,137,58,0.18), transparent 62%);
    pointer-events: none;
}

.claude-exams-page .exams-hero > * {
    position: relative;
    z-index: 1;
}

.claude-exams-page .exams-kicker {
    display: block;
    color: #D4A95A;
    font-size: 12px;
    letter-spacing: 0.12em;
    margin-bottom: 8px;
    text-transform: uppercase;
    font-weight: 900;
}

.claude-exams-page .exams-hero h2 {
    font-size: 32px;
    margin-bottom: 6px;
    font-weight: 900;
}

.claude-exams-page .exams-hero p {
    color: rgba(245,241,232,0.75);
    font-size: 14px;
}

.claude-exams-page .exams-disabled-button,
.claude-exams-page .exams-secondary-button {
    min-height: 42px;
    border: 0;
    border-radius: 100px;
    padding: 10px 18px;
    font-weight: 900;
    white-space: nowrap;
}

.claude-exams-page .exams-disabled-button {
    background: var(--exams-gold);
    color: var(--exams-olive);
}

.claude-exams-page .exams-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 22px;
}

.claude-exams-page .exams-stat-card,
.claude-exams-page .exams-card,
.claude-exams-page .exams-next-step {
    background: white;
    border: 1px solid var(--exams-line);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(31,58,46,0.05);
}

.claude-exams-page .exams-stat-card {
    padding: 20px;
    position: relative;
    overflow: hidden;
}

.claude-exams-page .exams-stat-card::after {
    content: '';
    position: absolute;
    inset: auto 0 0 0;
    height: 3px;
    background: linear-gradient(90deg, var(--exams-gold), var(--exams-olive-soft));
    opacity: 0.55;
}

.claude-exams-page .exams-stat-card span {
    display: block;
    color: var(--exams-muted);
    font-size: 12px;
    margin-bottom: 8px;
    font-weight: 900;
}

.claude-exams-page .exams-stat-card strong {
    display: block;
    color: var(--exams-olive);
    font-size: 34px;
    line-height: 1;
    margin-bottom: 8px;
}

.claude-exams-page .exams-stat-card small {
    color: var(--exams-muted);
    font-size: 12px;
    line-height: 1.6;
}

.claude-exams-page .exams-content-grid {
    display: grid;
    grid-template-columns: 1.45fr 1fr;
    gap: 22px;
    margin-bottom: 22px;
}

.claude-exams-page .exams-card,
.claude-exams-page .exams-next-step {
    padding: 24px;
}

.claude-exams-page .exams-card-header,
.claude-exams-page .exams-next-step {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
}

.claude-exams-page .exams-card-header {
    margin-bottom: 18px;
}

.claude-exams-page .exams-card-header h3,
.claude-exams-page .exams-next-step h3 {
    color: var(--exams-olive);
    font-size: 20px;
    margin-bottom: 4px;
    font-weight: 900;
}

.claude-exams-page .exams-card-header p,
.claude-exams-page .exams-next-step p {
    color: var(--exams-muted);
    font-size: 13px;
    line-height: 1.7;
}

.claude-exams-page .exams-status-pill,
.claude-exams-page .exams-item-badge {
    background: rgba(184,137,58,0.12);
    color: var(--exams-gold);
    border: 1px solid rgba(184,137,58,0.22);
    padding: 5px 12px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.claude-exams-page .exams-list {
    display: grid;
    gap: 12px;
}

.claude-exams-page .exams-item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 14px;
    border: 1px solid var(--exams-line);
    border-radius: 10px;
    padding: 14px;
}

.claude-exams-page .exams-date-box {
    width: 58px;
    min-height: 58px;
    border-radius: 8px;
    background: var(--exams-olive);
    color: #F5F1E8;
    display: grid;
    place-items: center;
    text-align: center;
    padding: 8px;
}

.claude-exams-page .exams-date-box strong {
    color: #D4A95A;
    line-height: 1;
    font-size: 20px;
}

.claude-exams-page .exams-date-box span {
    font-size: 10px;
    opacity: 0.75;
}

.claude-exams-page .exams-item-info h4 {
    color: var(--exams-olive);
    margin-bottom: 3px;
    font-size: 15px;
    font-weight: 900;
}

.claude-exams-page .exams-item-info p {
    color: var(--exams-muted);
    font-size: 12px;
}

.claude-exams-page .exams-empty-state {
    min-height: 232px;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 8px;
    color: var(--exams-muted);
    text-align: center;
    border: 1px dashed rgba(31,58,46,0.14);
    border-radius: 10px;
    background: rgba(31,58,46,0.03);
    padding: 24px;
}

.claude-exams-page .exams-empty-mark {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--exams-gold);
    color: var(--exams-olive);
    font-weight: 900;
}

.claude-exams-page .exams-empty-state strong {
    color: var(--exams-olive);
    font-size: 15px;
}

.claude-exams-page .exams-empty-state span {
    font-size: 13px;
    line-height: 1.7;
}

.claude-exams-page .exams-secondary-button {
    background: var(--exams-olive);
    color: #F5F1E8;
}

@media (max-width: 980px) {
    .claude-exams-page .exams-stats-grid,
    .claude-exams-page .exams-content-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 720px) {
    .claude-exams-page .exams-hero,
    .claude-exams-page .exams-card-header,
    .claude-exams-page .exams-next-step {
        align-items: flex-start;
        flex-direction: column;
    }

    .claude-exams-page .exams-stats-grid,
    .claude-exams-page .exams-content-grid {
        grid-template-columns: 1fr;
    }

    .claude-exams-page .exams-hero h2 {
        font-size: 28px;
    }

    .claude-exams-page .exams-item {
        grid-template-columns: auto 1fr;
    }

    .claude-exams-page .exams-item-badge {
        grid-column: 1 / -1;
        justify-self: flex-start;
    }
}

/* Parent dashboard based on prototype/parent-dashboard.html */
.claude-parent-dashboard {
    --olive-deep: #1F3A2E;
    --olive: #2D5043;
    --olive-light: #4A7C6B;
    --cream: #F5F1E8;
    --cream-warm: #EFE7D2;
    --gold: #B8893A;
    --gold-light: #D4A95A;
    --ink: #1A1815;
    --ink-soft: #3A3833;
    --paper: #FAF6EC;
    --success: #2D7A4F;
    --warning: #C77B1A;
    --danger: #B22222;
    background: var(--paper);
    color: var(--ink);
    min-height: 100vh;
    line-height: 1.6;
    font-family: 'Cairo', 'Tajawal', sans-serif;
}

.claude-parent-dashboard * {
    box-sizing: border-box;
}

.claude-parent-dashboard .parent-topbar {
    background: var(--olive-deep);
    color: var(--cream);
    padding: 14px 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
}

.claude-parent-dashboard .parent-top-logo,
.claude-parent-dashboard .parent-top-user {
    display: flex;
    align-items: center;
    gap: 12px;
}

.claude-parent-dashboard .parent-home-link {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 8px 12px;
    border-radius: 10px;
    background: rgba(212, 175, 55, 0.16);
    color: var(--olive-deep);
    font-weight: 900;
    text-decoration: none;
}

.claude-parent-dashboard .parent-home-link:hover {
    background: rgba(212, 175, 55, 0.26);
}

.claude-parent-dashboard .parent-top-logo .mark,
.claude-parent-dashboard .parent-top-user .avatar,
.claude-parent-dashboard .parent-child-tab .avatar {
    background: var(--gold);
    color: var(--olive-deep);
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 900;
}

.claude-parent-dashboard .parent-top-logo .mark {
    width: 36px;
    height: 36px;
}

.claude-parent-dashboard .parent-top-logo .name {
    font-size: 20px;
    font-weight: 900;
}

.claude-parent-dashboard .parent-top-logo .role {
    font-size: 11px;
    color: var(--gold-light);
    font-style: italic;
    letter-spacing: 0.1em;
}

.claude-parent-dashboard .parent-top-user {
    font-size: 14px;
}

.claude-parent-dashboard .parent-top-user .avatar {
    width: 38px;
    height: 38px;
}

.claude-parent-dashboard .user-name {
    font-weight: 900;
}

.claude-parent-dashboard .user-role {
    font-size: 11px;
    opacity: 0.75;
}

.claude-parent-dashboard .parent-logout {
    background: rgba(255,255,255,0.08);
    color: var(--cream);
    border: 1px solid rgba(184,137,58,0.25);
    border-radius: 100px;
    padding: 8px 14px;
    font-weight: 900;
}

.claude-parent-dashboard .parent-page-header {
    background: linear-gradient(135deg, var(--olive-deep), var(--olive));
    color: var(--cream);
    padding: 40px 40px 80px;
    position: relative;
    overflow: hidden;
}

.claude-parent-dashboard .parent-page-header::before {
    content: '';
    position: absolute;
    top: -100px;
    left: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(184,137,58,0.15), transparent 60%);
    pointer-events: none;
}

.claude-parent-dashboard .parent-header-content {
    position: relative;
    z-index: 1;
    max-width: 1400px;
    margin: 0 auto;
}

.claude-parent-dashboard .parent-breadcrumb {
    font-size: 12px;
    color: var(--gold-light);
    font-style: italic;
    letter-spacing: 0.1em;
    margin-bottom: 12px;
}

.claude-parent-dashboard .parent-header-title {
    font-size: 38px;
    margin-bottom: 8px;
    font-weight: 900;
}

.claude-parent-dashboard .parent-header-subtitle {
    opacity: 0.78;
    font-size: 14px;
    margin-bottom: 28px;
}

.claude-parent-dashboard .parent-children-switcher {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    flex-wrap: wrap;
}

.claude-parent-dashboard .parent-child-tab {
    background: rgba(245,241,232,0.08);
    border: 1px solid rgba(184,137,58,0.25);
    color: var(--cream);
    padding: 14px 20px;
    border-radius: 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 14px;
    transition: all 0.3s;
    min-width: 240px;
    text-align: right;
}

.claude-parent-dashboard .parent-child-tab:hover {
    background: rgba(245,241,232,0.12);
    border-color: var(--gold);
}

.claude-parent-dashboard .parent-child-tab.active {
    background: var(--paper);
    color: var(--ink);
    border-color: var(--gold);
}

.claude-parent-dashboard .parent-child-tab.add {
    border: 1px dashed rgba(184,137,58,0.4);
    color: var(--gold-light);
    justify-content: center;
    min-width: 180px;
    font-size: 14px;
}

.claude-parent-dashboard .parent-child-tab .avatar {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
}

.claude-parent-dashboard .parent-child-tab .info {
    text-align: right;
    min-width: 0;
}

.claude-parent-dashboard .parent-child-tab .ch-name {
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 2px;
}

.claude-parent-dashboard .parent-child-tab .ch-grade {
    font-size: 11px;
    opacity: 0.72;
    overflow-wrap: anywhere;
}

.claude-parent-dashboard .parent-main {
    max-width: 1400px;
    margin: -60px auto 40px;
    padding: 0 40px;
    position: relative;
    z-index: 2;
}

.claude-parent-dashboard .parent-main-flat {
    margin: 0;
    min-height: 100vh;
    display: grid;
    place-items: center;
}

.claude-parent-dashboard .parent-alerts-strip,
.claude-parent-dashboard .parent-metrics-grid {
    display: grid;
    gap: 14px;
    margin-bottom: 28px;
}

.claude-parent-dashboard .parent-alerts-strip {
    grid-template-columns: repeat(3, 1fr);
}

.claude-parent-dashboard .parent-alert {
    background: white;
    padding: 18px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 14px;
    border-right: 4px solid var(--alert-color);
    box-shadow: 0 8px 24px rgba(31,58,46,0.06);
}

.claude-parent-dashboard .parent-alert.warning {
    --alert-color: var(--warning);
}

.claude-parent-dashboard .parent-alert.danger {
    --alert-color: var(--danger);
}

.claude-parent-dashboard .parent-alert.info {
    --alert-color: var(--olive);
}

.claude-parent-dashboard .parent-alert-icon {
    width: 40px;
    height: 40px;
    background: var(--alert-color);
    color: white;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 18px;
    flex-shrink: 0;
    font-weight: 900;
}

.claude-parent-dashboard .parent-alert-text {
    flex: 1;
    font-size: 13px;
    color: var(--ink-soft);
}

.claude-parent-dashboard .parent-alert-text strong {
    display: block;
    color: var(--olive-deep);
    font-size: 14px;
    margin-bottom: 2px;
}

.claude-parent-dashboard .parent-metrics-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

.claude-parent-dashboard .parent-metric,
.claude-parent-dashboard .parent-card,
.claude-parent-dashboard .parent-sub-card,
.claude-parent-dashboard .parent-empty {
    background: white;
    border-radius: 10px;
    border: 1px solid rgba(31,58,46,0.06);
}

.claude-parent-dashboard .parent-metric {
    padding: 22px;
}

.claude-parent-dashboard .parent-metric-label {
    font-size: 12px;
    color: var(--ink-soft);
    font-style: italic;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.claude-parent-dashboard .parent-metric-value {
    font-size: 36px;
    font-weight: 900;
    color: var(--olive-deep);
    line-height: 1;
    margin-bottom: 4px;
    overflow-wrap: anywhere;
}

.claude-parent-dashboard .parent-metric-value .unit {
    font-size: 18px;
    color: var(--ink-soft);
    margin-right: 4px;
}

.claude-parent-dashboard .parent-metric-meta {
    font-size: 12px;
    color: var(--ink-soft);
}

.claude-parent-dashboard .parent-content-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 24px;
}

.claude-parent-dashboard .parent-card,
.claude-parent-dashboard .parent-sub-card,
.claude-parent-dashboard .parent-empty {
    padding: 28px;
    margin-bottom: 24px;
}

.claude-parent-dashboard .parent-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 22px;
}

.claude-parent-dashboard .parent-card-title {
    font-size: 22px;
    color: var(--olive-deep);
    font-weight: 900;
}

.claude-parent-dashboard .parent-card-link {
    font-size: 13px;
    color: var(--gold);
    font-weight: 900;
    white-space: nowrap;
}

.claude-parent-dashboard .parent-filter-tabs {
    display: flex;
    gap: 4px;
    background: rgba(31,58,46,0.05);
    padding: 4px;
    border-radius: 100px;
}

.claude-parent-dashboard .parent-filter-tab {
    padding: 6px 14px;
    border-radius: 100px;
    font-size: 12px;
    cursor: pointer;
    border: 0;
    background: transparent;
    color: var(--ink-soft);
}

.claude-parent-dashboard .parent-filter-tab.active {
    background: var(--olive-deep);
    color: var(--cream);
    font-weight: 900;
}

.claude-parent-dashboard .parent-result-row {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid rgba(31,58,46,0.05);
    align-items: center;
}

.claude-parent-dashboard .parent-result-row:last-child {
    border-bottom: 0;
}

.claude-parent-dashboard .parent-result-info h4 {
    font-size: 15px;
    color: var(--olive-deep);
    margin-bottom: 3px;
}

.claude-parent-dashboard .parent-result-meta {
    font-size: 12px;
    color: var(--ink-soft);
}

.claude-parent-dashboard .parent-result-score {
    font-size: 28px;
    font-weight: 900;
    color: var(--olive-deep);
    text-align: center;
    min-width: 70px;
}

.claude-parent-dashboard .parent-result-score.high {
    color: var(--success);
}

.claude-parent-dashboard .parent-result-score.low {
    color: var(--danger);
}

.claude-parent-dashboard .parent-result-bar {
    width: 120px;
    height: 6px;
    background: rgba(31,58,46,0.08);
    border-radius: 3px;
    overflow: hidden;
}

.claude-parent-dashboard .parent-result-bar-fill {
    height: 100%;
    background: var(--bar-color, var(--olive));
    border-radius: 3px;
}

.claude-parent-dashboard .parent-info-row,
.claude-parent-dashboard .parent-hw-item {
    padding: 14px;
    border: 1px solid rgba(31,58,46,0.08);
    border-radius: 8px;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
}

.claude-parent-dashboard .parent-info-row span,
.claude-parent-dashboard .parent-hw-info .meta {
    font-size: 12px;
    color: var(--ink-soft);
}

.claude-parent-dashboard .parent-info-row strong,
.claude-parent-dashboard .parent-hw-info h4 {
    color: var(--olive-deep);
    font-size: 14px;
}

.claude-parent-dashboard .parent-hw-status {
    padding: 4px 12px;
    border-radius: 100px;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

.claude-parent-dashboard .parent-hw-status.done {
    background: rgba(45,122,79,0.15);
    color: var(--success);
}

.claude-parent-dashboard .parent-hw-status.pending {
    background: rgba(199,123,26,0.15);
    color: var(--warning);
}

.claude-parent-dashboard .parent-hw-status.missed {
    background: rgba(178,34,34,0.15);
    color: var(--danger);
}

.claude-parent-dashboard .parent-chart-container {
    height: 200px;
    display: flex;
    align-items: end;
    gap: 8px;
    padding: 16px 0 28px;
}

.claude-parent-dashboard .parent-chart-bar {
    flex: 1;
    background: linear-gradient(to top, var(--olive-deep), var(--olive));
    border-radius: 4px 4px 0 0;
    position: relative;
    min-height: 6px;
}

.claude-parent-dashboard .parent-chart-bar .value,
.claude-parent-dashboard .parent-chart-bar .label {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 10px;
    white-space: nowrap;
}

.claude-parent-dashboard .parent-chart-bar .value {
    top: -22px;
    color: var(--olive-deep);
    font-weight: 900;
}

.claude-parent-dashboard .parent-chart-bar .label {
    bottom: -22px;
    color: var(--ink-soft);
}

.claude-parent-dashboard .parent-contact-card {
    background: var(--olive-deep);
    color: var(--cream);
    padding: 24px;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
    margin-bottom: 24px;
}

.claude-parent-dashboard .parent-contact-card::before {
    content: '';
    position: absolute;
    top: -50px;
    right: -50px;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(184,137,58,0.15), transparent);
}

.claude-parent-dashboard .parent-contact-card h3 {
    font-size: 22px;
    margin-bottom: 8px;
    position: relative;
}

.claude-parent-dashboard .parent-contact-card p {
    opacity: 0.78;
    font-size: 13px;
    margin-bottom: 20px;
    position: relative;
}

.claude-parent-dashboard .parent-contact-btn {
    background: var(--gold);
    color: var(--olive-deep);
    padding: 10px 20px;
    border-radius: 100px;
    border: 0;
    font-weight: 900;
    font-size: 13px;
    position: relative;
}

.claude-parent-dashboard .parent-sub-status {
    display: inline-block;
    padding: 4px 12px;
    background: rgba(45,122,79,0.15);
    color: var(--success);
    border-radius: 100px;
    font-size: 11px;
    font-weight: 900;
    margin-bottom: 14px;
}

.claude-parent-dashboard .parent-sub-package-name {
    font-size: 20px;
    color: var(--olive-deep);
    margin-bottom: 8px;
    font-weight: 900;
}

.claude-parent-dashboard .parent-sub-desc {
    font-size: 12px;
    color: var(--ink-soft);
}

.claude-parent-dashboard .parent-sub-dates {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 14px 0;
    border-top: 1px dashed rgba(31,58,46,0.1);
    border-bottom: 1px dashed rgba(31,58,46,0.1);
    margin: 16px 0;
}

.claude-parent-dashboard .parent-sub-date-item {
    font-size: 12px;
    color: var(--ink-soft);
}

.claude-parent-dashboard .parent-sub-date-item strong {
    display: block;
    color: var(--olive-deep);
    font-size: 14px;
    margin-top: 4px;
}

.claude-parent-dashboard .parent-placeholder,
.claude-parent-dashboard .parent-empty {
    color: var(--ink-soft);
    background: rgba(31,58,46,0.04);
    text-align: center;
}

.claude-parent-dashboard .parent-placeholder {
    padding: 18px;
    border-radius: 8px;
    border: 1px dashed rgba(31,58,46,0.12);
    font-size: 13px;
}

.claude-parent-dashboard .parent-placeholder.compact {
    padding: 12px;
    margin-top: 12px;
}

.claude-parent-dashboard .parent-empty {
    max-width: 720px;
    margin: 0 auto 24px;
    padding: 36px;
    box-shadow: 0 8px 24px rgba(31,58,46,0.06);
}

.claude-parent-dashboard .parent-empty .empty-mark {
    width: 44px;
    height: 44px;
    margin: 0 auto 14px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--gold);
    color: var(--olive-deep);
    font-weight: 900;
}

.claude-parent-dashboard .parent-empty h2 {
    color: var(--olive-deep);
    margin-bottom: 8px;
    font-size: 20px;
}

.claude-parent-dashboard .parent-empty p,
.claude-parent-dashboard .parent-empty small {
    display: block;
    color: var(--ink-soft);
    font-size: 13px;
}

.claude-parent-dashboard .fade-up {
    opacity: 0;
    transform: translateY(15px);
    animation: parentFadeUp 0.6s forwards;
}

.claude-parent-dashboard .d1 { animation-delay: 0.05s; }
.claude-parent-dashboard .d2 { animation-delay: 0.1s; }
.claude-parent-dashboard .d3 { animation-delay: 0.15s; }
.claude-parent-dashboard .d4 { animation-delay: 0.2s; }

@keyframes parentFadeUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 1024px) {
    .claude-parent-dashboard .parent-alerts-strip,
    .claude-parent-dashboard .parent-metrics-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .claude-parent-dashboard .parent-content-grid {
        grid-template-columns: 1fr;
    }

    .claude-parent-dashboard .parent-main {
        padding: 0 20px;
    }
}

@media (max-width: 720px) {
    .claude-parent-dashboard .parent-topbar,
    .claude-parent-dashboard .parent-top-user,
    .claude-parent-dashboard .parent-page-header {
        padding-right: 18px;
        padding-left: 18px;
    }

    .claude-parent-dashboard .parent-topbar,
    .claude-parent-dashboard .parent-top-user {
        align-items: flex-start;
        flex-direction: column;
    }

    .claude-parent-dashboard .parent-header-title {
        font-size: 30px;
    }

    .claude-parent-dashboard .parent-child-tab {
        width: 100%;
        min-width: 0;
    }

    .claude-parent-dashboard .parent-alerts-strip,
    .claude-parent-dashboard .parent-metrics-grid {
        grid-template-columns: 1fr;
    }

    .claude-parent-dashboard .parent-card,
    .claude-parent-dashboard .parent-sub-card {
        padding: 20px;
    }

    .claude-parent-dashboard .parent-card-header,
    .claude-parent-dashboard .parent-result-row {
        align-items: flex-start;
        grid-template-columns: 1fr;
    }

    .claude-parent-dashboard .parent-card-header {
        flex-direction: column;
    }

    .claude-parent-dashboard .parent-result-bar {
        width: 100%;
    }
}

/* Homepage management admin view */
.claude-admin-dashboard .homepage-admin-page {
    color: var(--ink);
}

.claude-admin-dashboard .homepage-admin-note {
    background: rgba(184,137,58,0.12);
    color: var(--gold);
    border: 1px solid rgba(184,137,58,0.22);
    border-radius: 100px;
    padding: 8px 14px;
    font-size: 12px;
    font-weight: 900;
}

.claude-admin-dashboard .homepage-admin-hero {
    background: linear-gradient(135deg, var(--olive-deep), var(--olive));
    color: var(--cream);
    border-radius: 12px;
    padding: 28px;
    margin-bottom: 26px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    position: relative;
    overflow: hidden;
}

.claude-admin-dashboard .homepage-admin-hero::before {
    content: '';
    position: absolute;
    top: -90px;
    left: -80px;
    width: 280px;
    height: 280px;
    background: radial-gradient(circle, rgba(184,137,58,0.18), transparent 62%);
    pointer-events: none;
}

.claude-admin-dashboard .homepage-admin-hero > * {
    position: relative;
    z-index: 1;
}

.claude-admin-dashboard .homepage-admin-hero span,
.claude-admin-dashboard .homepage-editor-head span {
    color: var(--gold-light);
    font-size: 11px;
    font-style: italic;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.claude-admin-dashboard .homepage-admin-hero h2 {
    font-size: 28px;
    margin: 6px 0;
    font-weight: 900;
}

.claude-admin-dashboard .homepage-admin-hero p {
    color: rgba(245,241,232,0.76);
    max-width: 780px;
    font-size: 14px;
}

.claude-admin-dashboard .homepage-admin-hero a {
    background: var(--gold);
    color: var(--olive-deep);
    border-radius: 100px;
    padding: 10px 18px;
    text-decoration: none;
    white-space: nowrap;
    font-weight: 900;
}

.claude-admin-dashboard .homepage-admin-overview {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.claude-admin-dashboard .homepage-overview-card,
.claude-admin-dashboard .homepage-status-panel {
    background: white;
    border: 1px solid rgba(31,58,46,0.08);
    border-radius: 12px;
    box-shadow: 0 10px 28px rgba(31,58,46,0.05);
}

.claude-admin-dashboard .homepage-overview-card {
    padding: 16px 18px;
    display: grid;
    gap: 5px;
}

.claude-admin-dashboard .homepage-overview-card span {
    color: var(--ink-soft);
    font-size: 12px;
    font-weight: 800;
}

.claude-admin-dashboard .homepage-overview-card strong {
    color: var(--olive-deep);
    font-size: 18px;
    font-weight: 900;
}

.claude-admin-dashboard .homepage-overview-card small {
    color: var(--ink-soft);
    font-size: 12px;
}

.claude-admin-dashboard .homepage-status-panel {
    margin-bottom: 18px;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.claude-admin-dashboard .homepage-status-panel.error {
    border-color: rgba(178,34,34,0.18);
    background: rgba(178,34,34,0.05);
}

.claude-admin-dashboard .homepage-status-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--olive-deep);
    color: var(--gold-light);
    display: grid;
    place-items: center;
    font-weight: 900;
    flex: 0 0 auto;
}

.claude-admin-dashboard .homepage-status-panel h2 {
    color: var(--olive-deep);
    font-size: 20px;
    margin-bottom: 4px;
}

.claude-admin-dashboard .homepage-status-panel p {
    color: var(--ink-soft);
    margin: 0;
    font-size: 13px;
}

.claude-admin-dashboard .homepage-status-retry {
    margin-top: 10px;
    border: 0;
    border-radius: 100px;
    background: var(--olive-deep);
    color: var(--cream);
    padding: 9px 14px;
    font-weight: 900;
}

.claude-admin-dashboard .homepage-section-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.claude-admin-dashboard .homepage-section-card {
    background: white;
    border: 1px solid rgba(31,58,46,0.06);
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 10px 28px rgba(31,58,46,0.05);
    display: grid;
    gap: 12px;
}

.claude-admin-dashboard .homepage-section-card-head,
.claude-admin-dashboard .homepage-card-actions,
.claude-admin-dashboard .homepage-editor-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.claude-admin-dashboard .homepage-section-icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--olive-deep);
    color: var(--gold-light);
    display: grid;
    place-items: center;
    font-weight: 900;
}

.claude-admin-dashboard .homepage-status {
    border-radius: 100px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 900;
}

.claude-admin-dashboard .homepage-status.visible {
    background: rgba(45,122,79,0.12);
    color: var(--success);
}

.claude-admin-dashboard .homepage-status.hidden {
    background: rgba(178,34,34,0.1);
    color: var(--danger);
}

.claude-admin-dashboard .homepage-section-card h3 {
    color: var(--olive-deep);
    font-size: 18px;
    font-weight: 900;
}

.claude-admin-dashboard .homepage-section-card p {
    color: var(--ink-soft);
    font-size: 13px;
    line-height: 1.7;
    min-height: 44px;
}

.claude-admin-dashboard .homepage-section-preview {
    background: rgba(31,58,46,0.03);
    border: 1px solid rgba(31,58,46,0.08);
    border-radius: 10px;
    padding: 12px;
    min-height: 88px;
    display: grid;
    gap: 10px;
}

.claude-admin-dashboard .homepage-preview-empty {
    color: var(--ink-soft);
    font-size: 12px;
}

.claude-admin-dashboard .homepage-preview-stack {
    display: grid;
    gap: 6px;
}

.claude-admin-dashboard .homepage-preview-stack strong,
.claude-admin-dashboard .homepage-preview-line strong,
.claude-admin-dashboard .homepage-mini-card strong {
    color: var(--olive-deep);
    font-weight: 900;
}

.claude-admin-dashboard .homepage-preview-stack span,
.claude-admin-dashboard .homepage-preview-stack small,
.claude-admin-dashboard .homepage-preview-line span,
.claude-admin-dashboard .homepage-mini-card span,
.claude-admin-dashboard .homepage-mini-card small {
    color: var(--ink-soft);
    font-size: 12px;
    line-height: 1.6;
}

.claude-admin-dashboard .homepage-preview-list {
    margin: 0;
    padding-inline-start: 18px;
    color: var(--ink-soft);
    display: grid;
    gap: 4px;
    font-size: 12px;
}

.claude-admin-dashboard .homepage-preview-line {
    display: grid;
    gap: 4px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(31,58,46,0.08);
}

.claude-admin-dashboard .homepage-mini-grid {
    display: grid;
    gap: 8px;
}

.claude-admin-dashboard .homepage-mini-card {
    background: #F8F4E8;
    border: 1px solid rgba(31,58,46,0.08);
    border-radius: 10px;
    padding: 10px 12px;
    display: grid;
    gap: 4px;
}

.claude-admin-dashboard .homepage-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.claude-admin-dashboard .homepage-pill-row span {
    background: rgba(184,137,58,0.12);
    color: var(--gold);
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 11px;
    font-weight: 800;
}

.claude-admin-dashboard .homepage-card-actions button {
    border: 0;
    border-radius: 100px;
    padding: 8px 13px;
    font-weight: 900;
    font-size: 12px;
    background: var(--olive-deep);
    color: var(--cream);
}

.claude-admin-dashboard .homepage-card-actions button.ghost {
    background: rgba(184,137,58,0.12);
    color: var(--gold);
}

.homepage-editor-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 3000;
    padding: 20px;
}

.homepage-editor-backdrop.show {
    display: flex;
}

.homepage-editor-panel {
    width: min(620px, 100%);
    background: var(--paper, #FAF6EC);
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(31,58,46,0.1);
    box-shadow: 0 24px 80px rgba(0,0,0,0.28);
}

.homepage-editor-head {
    background: #1F3A2E;
    color: #F5F1E8;
    padding: 20px 22px;
}

.homepage-editor-head h2 {
    font-size: 22px;
    margin-top: 4px;
}

.homepage-editor-head button {
    width: 36px;
    height: 36px;
    border: 1px solid rgba(245,241,232,0.18);
    background: rgba(245,241,232,0.06);
    color: #F5F1E8;
    border-radius: 50%;
    font-size: 20px;
}

.homepage-editor-body {
    padding: 22px;
    display: grid;
    gap: 14px;
}

.homepage-editor-summary {
    background: rgba(31,58,46,0.04);
    border: 1px solid rgba(31,58,46,0.08);
    border-radius: 12px;
    padding: 14px 16px;
    display: grid;
    gap: 4px;
}

.homepage-editor-summary strong {
    color: #1F3A2E;
    font-size: 16px;
}

.homepage-editor-summary p {
    color: var(--ink-soft);
    font-size: 13px;
    line-height: 1.7;
}

.homepage-editor-toolbar {
    display: flex;
    justify-content: flex-end;
}

.homepage-editor-form {
    display: grid;
    gap: 14px;
}

.homepage-editor-form[hidden],
.homepage-editor-placeholder[hidden] {
    display: none !important;
}

.homepage-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.homepage-field-group {
    color: #1F3A2E;
    font-weight: 900;
    display: grid;
    gap: 7px;
}

.homepage-field-group small {
    color: var(--ink-soft);
    font-weight: 700;
}

.homepage-editor-form label {
    color: #1F3A2E;
    font-weight: 900;
    display: grid;
    gap: 7px;
}

.homepage-editor-form input,
.homepage-editor-form textarea {
    width: 100%;
    border: 1px solid rgba(31,58,46,0.12);
    border-radius: 10px;
    background: white;
    padding: 11px 13px;
    color: #1A1815;
}

.homepage-editor-form textarea {
    min-height: 110px;
    resize: vertical;
}

.homepage-editor-json {
    width: 100%;
    min-height: 380px;
    border: 1px solid rgba(31,58,46,0.12);
    border-radius: 12px;
    background: #fff;
    padding: 14px;
    color: #1A1815;
    font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Monaco, Consolas, monospace;
    font-size: 13px;
    line-height: 1.7;
    resize: vertical;
}

.homepage-editor-error {
    background: rgba(178,34,34,0.06);
    color: var(--danger);
    border: 1px solid rgba(178,34,34,0.12);
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 13px;
}

.homepage-toggle-row {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #1F3A2E;
    font-weight: 900;
}

.homepage-toggle-row input {
    width: 18px;
    height: 18px;
}

.homepage-editor-message {
    background: rgba(184,137,58,0.12);
    color: #7A5A24;
    border: 1px dashed rgba(184,137,58,0.3);
    border-radius: 10px;
    padding: 12px;
    font-size: 13px;
}

.homepage-editor-placeholder {
    border: 1px dashed rgba(31,58,46,0.16);
    border-radius: 12px;
    background: rgba(31,58,46,0.03);
    padding: 18px;
    display: grid;
    gap: 6px;
}

.homepage-editor-placeholder strong {
    color: var(--olive-deep);
}

.homepage-editor-placeholder p {
    color: var(--ink-soft);
    font-size: 13px;
}

.homepage-editor-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.homepage-editor-form button {
    border: 0;
    border-radius: 100px;
    padding: 12px 18px;
    background: #B8893A;
    color: #1F3A2E;
    font-weight: 900;
}

.homepage-editor-form button.ghost,
.homepage-editor-actions button.ghost {
    background: rgba(184,137,58,0.12);
    color: var(--gold);
}

@media (max-width: 1180px) {
    .claude-admin-dashboard .homepage-admin-overview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .claude-admin-dashboard .homepage-section-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 720px) {
    .claude-admin-dashboard .homepage-admin-overview,
    .claude-admin-dashboard .homepage-admin-hero,
    .claude-admin-dashboard .homepage-section-card-head,
    .claude-admin-dashboard .homepage-card-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .claude-admin-dashboard .homepage-admin-overview {
        grid-template-columns: 1fr;
    }

    .claude-admin-dashboard .homepage-section-grid {
        grid-template-columns: 1fr;
    }

    .homepage-field-grid {
        grid-template-columns: 1fr;
    }
}

/* Videos placeholder page */
.claude-videos-page {
    --videos-olive: #1F3A2E;
    --videos-olive-soft: #2D5043;
    --videos-gold: #B8893A;
    --videos-ink: #1A1815;
    --videos-muted: #5f665f;
    --videos-line: rgba(31,58,46,0.1);
    color: var(--videos-ink);
}

.claude-videos-page .videos-hero {
    background: linear-gradient(135deg, var(--videos-olive), var(--videos-olive-soft));
    color: #F5F1E8;
    border-radius: 14px;
    padding: 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    margin-bottom: 22px;
    position: relative;
    overflow: hidden;
}

.claude-videos-page .videos-hero::before {
    content: '';
    position: absolute;
    top: -80px;
    left: -80px;
    width: 260px;
    height: 260px;
    background: radial-gradient(circle, rgba(184,137,58,0.18), transparent 62%);
    pointer-events: none;
}

.claude-videos-page .videos-hero > * {
    position: relative;
    z-index: 1;
}

.claude-videos-page .videos-kicker {
    display: block;
    color: #D4A95A;
    font-size: 12px;
    letter-spacing: 0.12em;
    margin-bottom: 8px;
    text-transform: uppercase;
    font-weight: 900;
}

.claude-videos-page .videos-hero h2 {
    font-size: 32px;
    margin-bottom: 6px;
    font-weight: 900;
}

.claude-videos-page .videos-hero p {
    color: rgba(245,241,232,0.75);
    font-size: 14px;
}

.claude-videos-page .videos-disabled-button,
.claude-videos-page .videos-secondary-button {
    min-height: 42px;
    border: 0;
    border-radius: 100px;
    padding: 10px 18px;
    font-weight: 900;
    white-space: nowrap;
}

.claude-videos-page .videos-disabled-button {
    background: var(--videos-gold);
    color: var(--videos-olive);
}

.claude-videos-page .videos-subject-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 22px;
}

.claude-videos-page .videos-subject-card,
.claude-videos-page .videos-card,
.claude-videos-page .videos-next-step {
    background: white;
    border: 1px solid var(--videos-line);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(31,58,46,0.05);
}

.claude-videos-page .videos-subject-card {
    padding: 18px;
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.claude-videos-page .videos-subject-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--videos-olive);
    color: #D4A95A;
    display: grid;
    place-items: center;
    flex-shrink: 0;
}

.claude-videos-page .videos-subject-card h3 {
    color: var(--videos-olive);
    font-size: 15px;
    margin-bottom: 3px;
    font-weight: 900;
}

.claude-videos-page .videos-subject-card strong {
    display: block;
    color: var(--videos-gold);
    font-size: 20px;
    line-height: 1;
    margin-bottom: 5px;
}

.claude-videos-page .videos-subject-card p {
    color: var(--videos-muted);
    font-size: 12px;
    line-height: 1.5;
}

.claude-videos-page .videos-content-grid {
    display: grid;
    grid-template-columns: 1.45fr 1fr;
    gap: 22px;
    margin-bottom: 22px;
}

.claude-videos-page .videos-card,
.claude-videos-page .videos-next-step {
    padding: 24px;
}

.claude-videos-page .videos-card-header,
.claude-videos-page .videos-next-step {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
}

.claude-videos-page .videos-card-header {
    margin-bottom: 18px;
}

.claude-videos-page .videos-card-header h3,
.claude-videos-page .videos-next-step h3 {
    color: var(--videos-olive);
    font-size: 20px;
    margin-bottom: 4px;
    font-weight: 900;
}

.claude-videos-page .videos-card-header p,
.claude-videos-page .videos-next-step p {
    color: var(--videos-muted);
    font-size: 13px;
    line-height: 1.7;
}

.claude-videos-page .videos-status-pill,
.claude-videos-page .videos-item-badge {
    background: rgba(184,137,58,0.12);
    color: var(--videos-gold);
    border: 1px solid rgba(184,137,58,0.22);
    padding: 5px 12px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.claude-videos-page .videos-list {
    display: grid;
    gap: 12px;
}

.claude-videos-page .videos-item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 14px;
    border: 1px solid var(--videos-line);
    border-radius: 10px;
    padding: 14px;
}

.claude-videos-page .videos-thumb {
    width: 92px;
    height: 58px;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--videos-olive), var(--videos-olive-soft));
    color: #F5F1E8;
    display: grid;
    place-items: center;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.claude-videos-page .videos-thumb::after {
    content: '';
    position: absolute;
    right: 0;
    bottom: 0;
    width: var(--progress, 0%);
    height: 3px;
    background: var(--videos-gold);
}

.claude-videos-page .videos-thumb span {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,0.16);
    font-size: 12px;
}

.claude-videos-page .videos-item-info h4 {
    color: var(--videos-olive);
    margin-bottom: 3px;
    font-size: 15px;
    font-weight: 900;
}

.claude-videos-page .videos-item-info p {
    color: var(--videos-muted);
    font-size: 12px;
    margin-bottom: 8px;
}

.claude-videos-page .videos-progress {
    height: 4px;
    border-radius: 100px;
    background: rgba(31,58,46,0.08);
    overflow: hidden;
}

.claude-videos-page .videos-progress div {
    height: 100%;
    background: var(--videos-gold);
}

.claude-videos-page .videos-empty-player {
    min-height: 270px;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 8px;
    color: var(--videos-muted);
    text-align: center;
    border: 1px dashed rgba(31,58,46,0.14);
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(31,58,46,0.05), rgba(184,137,58,0.05));
    padding: 24px;
}

.claude-videos-page .videos-play-mark {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--videos-gold);
    color: var(--videos-olive);
    font-weight: 900;
    margin-bottom: 4px;
}

.claude-videos-page .videos-empty-player strong {
    color: var(--videos-olive);
    font-size: 15px;
}

.claude-videos-page .videos-empty-player span {
    font-size: 13px;
    line-height: 1.7;
}

.claude-videos-page .videos-secondary-button {
    background: var(--videos-olive);
    color: #F5F1E8;
}

@media (max-width: 1080px) {
    .claude-videos-page .videos-subject-grid,
    .claude-videos-page .videos-content-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 720px) {
    .claude-videos-page .videos-hero,
    .claude-videos-page .videos-card-header,
    .claude-videos-page .videos-next-step {
        align-items: flex-start;
        flex-direction: column;
    }

    .claude-videos-page .videos-subject-grid,
    .claude-videos-page .videos-content-grid {
        grid-template-columns: 1fr;
    }

    .claude-videos-page .videos-hero h2 {
        font-size: 28px;
    }

    .claude-videos-page .videos-item {
        grid-template-columns: auto 1fr;
    }

    .claude-videos-page .videos-item-badge {
        grid-column: 1 / -1;
        justify-self: flex-start;
    }
}

/* Admin dashboard based on prototype/admin-dashboard.html */
.claude-admin-dashboard {
    --olive-deep: #1F3A2E;
    --olive: #2D5043;
    --olive-light: #4A7C6B;
    --cream: #F5F1E8;
    --cream-warm: #EFE7D2;
    --gold: #B8893A;
    --gold-light: #D4A95A;
    --ink: #1A1815;
    --ink-soft: #3A3833;
    --paper: #FAF6EC;
    --success: #2D7A4F;
    --warning: #C77B1A;
    --danger: #B22222;
    --info: #1A4F8B;
    background: var(--paper);
    color: var(--ink);
    display: flex;
    min-height: 100vh;
    line-height: 1.6;
    font-family: 'Cairo', 'Tajawal', sans-serif;
}

.claude-admin-dashboard * {
    box-sizing: border-box;
}

.claude-admin-dashboard.fixed-layout,
.claude-student-dashboard.fixed-layout,
.claude-parent-dashboard.fixed-layout {
    display: block;
    min-height: auto;
    width: 100%;
}

.claude-admin-dashboard .admin-sidebar {
    width: 260px;
    background: var(--ink);
    color: var(--cream);
    padding: 24px 16px;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

.claude-admin-dashboard .admin-logo {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 12px 24px;
    border-bottom: 1px solid rgba(184,137,58,0.15);
    margin-bottom: 20px;
}

.claude-admin-dashboard .admin-logo .mark {
    width: 40px;
    height: 40px;
    background: var(--gold);
    color: var(--ink);
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 900;
    font-size: 16px;
}

.claude-admin-dashboard .admin-logo .name {
    font-size: 19px;
    font-weight: 900;
}

.claude-admin-dashboard .admin-logo .subtitle {
    font-size: 10px;
    color: var(--gold-light);
    text-transform: uppercase;
    letter-spacing: 0.15em;
    margin-top: 1px;
}

.claude-admin-dashboard .nav-section {
    margin-bottom: 18px;
}

.claude-admin-dashboard .nav-section-title {
    font-size: 10px;
    color: rgba(245,241,232,0.35);
    text-transform: uppercase;
    letter-spacing: 0.2em;
    padding: 0 14px;
    margin-bottom: 8px;
    font-style: italic;
}

.claude-admin-dashboard .nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 14px;
    border-radius: 6px;
    color: rgba(245,241,232,0.65);
    text-decoration: none;
    font-size: 13px;
    margin-bottom: 1px;
    transition: all 0.2s;
    position: relative;
}

.claude-admin-dashboard .nav-item:hover {
    background: rgba(184,137,58,0.08);
    color: var(--cream);
}

.claude-admin-dashboard .nav-item.active {
    background: rgba(184,137,58,0.15);
    color: var(--gold-light);
    font-weight: 700;
}

.claude-admin-dashboard .nav-item.active::before {
    content: '';
    position: absolute;
    right: -16px;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 18px;
    background: var(--gold);
    border-radius: 3px 0 0 3px;
}

.claude-admin-dashboard .nav-icon {
    width: 16px;
    text-align: center;
    font-size: 14px;
}

.claude-admin-dashboard .nav-badge {
    margin-right: auto;
    background: var(--danger);
    color: white;
    padding: 1px 6px;
    border-radius: 100px;
    font-size: 9px;
    font-weight: 900;
}

.claude-admin-dashboard .nav-badge.warning {
    background: var(--warning);
}

.claude-admin-dashboard .admin-user {
    margin-top: auto;
    padding: 12px;
    background: rgba(184,137,58,0.08);
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.claude-admin-dashboard .admin-user .avatar {
    width: 36px;
    height: 36px;
    background: var(--gold);
    color: var(--ink);
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 900;
    font-size: 13px;
}

.claude-admin-dashboard .admin-user .info {
    flex: 1;
    min-width: 0;
}

.claude-admin-dashboard .admin-user .name {
    font-size: 12px;
    font-weight: 700;
}

.claude-admin-dashboard .admin-user .role {
    font-size: 10px;
    color: var(--gold-light);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.claude-admin-dashboard .admin-main {
    flex: 1;
    padding: 32px 40px;
    overflow-x: hidden;
    background: var(--paper);
}

.claude-admin-dashboard .topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
    background: transparent;
    border: 0;
    padding: 0;
}

.claude-admin-dashboard .topbar-title h1 {
    font-size: 32px;
    color: var(--olive-deep);
    font-weight: 900;
    line-height: 1.2;
}

.claude-admin-dashboard .breadcrumb {
    font-size: 11px;
    color: var(--gold);
    font-style: italic;
    letter-spacing: 0.15em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.claude-admin-dashboard .topbar-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.claude-admin-dashboard .search-box {
    background: white;
    border: 1px solid rgba(31,58,46,0.1);
    padding: 10px 16px;
    border-radius: 100px;
    width: 280px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--ink-soft);
}

.claude-admin-dashboard .search-box input {
    border: none;
    background: transparent;
    outline: none;
    flex: 1;
    font-size: 13px;
}

.claude-admin-dashboard .icon-btn {
    width: 40px;
    height: 40px;
    background: white;
    border: 1px solid rgba(31,58,46,0.1);
    border-radius: 50%;
    display: grid;
    place-items: center;
    cursor: pointer;
    position: relative;
    color: var(--olive-deep);
}

.claude-admin-dashboard .icon-btn .dot {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 8px;
    height: 8px;
    background: var(--danger);
    border-radius: 50%;
    border: 2px solid white;
}

.claude-admin-dashboard .kpi-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 28px;
}

.claude-admin-dashboard .kpi {
    background: white;
    padding: 22px;
    border-radius: 10px;
    border: 1px solid rgba(31,58,46,0.06);
    position: relative;
    overflow: hidden;
}

.claude-admin-dashboard .kpi-label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    color: var(--ink-soft);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    margin-bottom: 12px;
    font-style: italic;
}

.claude-admin-dashboard .kpi-icon {
    width: 28px;
    height: 28px;
    background: var(--kpi-color);
    color: white;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 12px;
}

.claude-admin-dashboard .kpi-value {
    font-size: 38px;
    font-weight: 900;
    color: var(--olive-deep);
    line-height: 1;
    margin-bottom: 4px;
}

.claude-admin-dashboard .kpi-meta {
    font-size: 12px;
    color: var(--ink-soft);
    display: flex;
    align-items: center;
    gap: 6px;
}

.claude-admin-dashboard .kpi-trend {
    color: var(--success);
    font-weight: 900;
}

.claude-admin-dashboard .kpi-trend.down {
    color: var(--danger);
}

.claude-admin-dashboard .kpi-spark {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 40px;
    opacity: 0.1;
    background: linear-gradient(180deg, transparent, var(--kpi-color));
    clip-path: polygon(0 80%, 10% 60%, 20% 70%, 30% 40%, 40% 50%, 50% 30%, 60% 45%, 70% 25%, 80% 35%, 90% 15%, 100% 25%, 100% 100%, 0 100%);
}

.claude-admin-dashboard .admin-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 24px;
}

.claude-admin-dashboard .card {
    background: white;
    border-radius: 10px;
    padding: 26px;
    border: 1px solid rgba(31,58,46,0.06);
    margin-bottom: 20px;
}

.claude-admin-dashboard .card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 22px;
    gap: 16px;
}

.claude-admin-dashboard .card-title {
    font-size: 20px;
    color: var(--olive-deep);
    font-weight: 900;
}

.claude-admin-dashboard .card-action {
    background: transparent;
    border: 1px solid rgba(31,58,46,0.1);
    color: var(--olive-deep);
    padding: 7px 14px;
    border-radius: 100px;
    font-size: 12px;
    cursor: pointer;
    font-weight: 700;
}

.claude-admin-dashboard .users-list {
    display: grid;
    gap: 0;
}

.claude-admin-dashboard .payment-row {
    display: grid;
    grid-template-columns: auto 1fr auto auto auto;
    gap: 14px;
    padding: 14px 0;
    border-bottom: 1px solid rgba(31,58,46,0.05);
    align-items: center;
}

.claude-admin-dashboard .payment-row:last-child {
    border: none;
}

.claude-admin-dashboard .pay-avatar,
.claude-admin-dashboard .teacher-avatar {
    width: 38px;
    height: 38px;
    background: var(--olive-deep);
    color: var(--gold);
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 900;
    font-size: 14px;
}

.claude-admin-dashboard .pay-info h4 {
    font-size: 14px;
    color: var(--olive-deep);
    margin-bottom: 2px;
}

.claude-admin-dashboard .pay-meta {
    font-size: 11px;
    color: var(--ink-soft);
}

.claude-admin-dashboard .admin-user-details {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

.claude-admin-dashboard .admin-detail-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 8px;
    border-radius: 999px;
    background: #f6f8f6;
    border: 1px solid rgba(31,58,46,0.08);
    color: #4f5f56;
    font-size: 12px;
    font-weight: 700;
}

.claude-admin-dashboard .admin-detail-chip b {
    color: var(--olive-deep);
}

.claude-admin-dashboard .admin-detail-chip.ok {
    background: rgba(45,122,79,0.12);
    color: var(--success);
}

.claude-admin-dashboard .admin-detail-chip.warn {
    background: rgba(199,123,26,0.12);
    color: var(--warning);
}

.claude-admin-dashboard .role-pill,
.claude-admin-dashboard .status-pill {
    padding: 4px 10px;
    border-radius: 100px;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

.claude-admin-dashboard .role-pill {
    background: rgba(31,58,46,0.08);
    color: var(--olive-deep);
}

.claude-admin-dashboard .status-pill.ok {
    background: rgba(45,122,79,0.15);
    color: var(--success);
}

.claude-admin-dashboard .status-pill.warn {
    background: rgba(199,123,26,0.15);
    color: var(--warning);
}

.claude-admin-dashboard .pay-actions {
    display: flex;
    gap: 6px;
}

.claude-admin-dashboard .pay-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 900;
}

.claude-admin-dashboard .pay-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.claude-admin-dashboard .pay-btn.approve {
    background: var(--success);
    color: white;
}

.claude-admin-dashboard .pay-btn.reject {
    background: rgba(178,34,34,0.15);
    color: var(--danger);
}

.claude-admin-dashboard .pay-btn.view {
    background: rgba(31,58,46,0.08);
    color: var(--olive-deep);
}

.claude-admin-dashboard .revenue-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 20px;
}

.claude-admin-dashboard .rev-stat {
    padding: 14px;
    background: rgba(31,58,46,0.03);
    border-radius: 8px;
}

.claude-admin-dashboard .rev-stat .label {
    font-size: 11px;
    color: var(--ink-soft);
    margin-bottom: 4px;
}

.claude-admin-dashboard .rev-stat .value {
    font-size: 22px;
    font-weight: 900;
    color: var(--olive-deep);
}

.claude-admin-dashboard .rev-stat.featured {
    background: var(--olive-deep);
    color: var(--cream);
}

.claude-admin-dashboard .rev-stat.featured .label {
    color: var(--gold-light);
}

.claude-admin-dashboard .rev-stat.featured .value {
    color: var(--cream);
}

.claude-admin-dashboard .chart-area {
    height: 220px;
    display: flex;
    align-items: end;
    gap: 6px;
    padding-top: 20px;
    border-top: 1px dashed rgba(31,58,46,0.1);
    margin-top: 16px;
}

.claude-admin-dashboard .ch-month {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.claude-admin-dashboard .ch-bars {
    width: 100%;
    display: flex;
    gap: 2px;
    align-items: end;
    height: 180px;
}

.claude-admin-dashboard .ch-bar {
    flex: 1;
    background: var(--olive);
    border-radius: 3px 3px 0 0;
    min-height: 2px;
    transition: all 0.3s;
}

.claude-admin-dashboard .ch-bar.gold {
    background: var(--gold);
}

.claude-admin-dashboard .ch-label {
    font-size: 11px;
    color: var(--ink-soft);
}

.claude-admin-dashboard .admin-placeholder,
.claude-admin-dashboard .admin-empty {
    margin-top: 16px;
    padding: 16px;
    border: 1px dashed rgba(184,137,58,0.35);
    border-radius: 10px;
    background: rgba(184,137,58,0.06);
    color: var(--ink-soft);
    text-align: center;
    font-size: 13px;
}

.claude-admin-dashboard .admin-empty {
    display: grid;
    gap: 4px;
}

.claude-admin-dashboard .admin-empty strong {
    color: var(--olive-deep);
}

.claude-admin-dashboard .activity-item,
.claude-admin-dashboard .teacher-row {
    display: flex;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(31,58,46,0.04);
    align-items: flex-start;
}

.claude-admin-dashboard .activity-item:last-child,
.claude-admin-dashboard .teacher-row:last-child {
    border: none;
}

.claude-admin-dashboard .activity-icon {
    width: 28px;
    height: 28px;
    background: var(--act-color, var(--olive));
    color: white;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 11px;
    flex-shrink: 0;
}

.claude-admin-dashboard .activity-text {
    flex: 1;
    font-size: 12.5px;
    color: var(--ink-soft);
}

.claude-admin-dashboard .activity-text strong {
    color: var(--olive-deep);
    font-weight: 900;
}

.claude-admin-dashboard .activity-time {
    font-size: 10px;
    color: var(--ink-soft);
    opacity: 0.6;
    margin-top: 2px;
}

.claude-admin-dashboard .live-indicator {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--success);
}

.claude-admin-dashboard .live-indicator span {
    width: 8px;
    height: 8px;
    background: var(--success);
    border-radius: 50%;
    animation: adminPulse 2s infinite;
}

.claude-admin-dashboard .teacher-avatar {
    background: var(--olive);
    color: var(--gold-light);
    width: 40px;
    height: 40px;
}

.claude-admin-dashboard .teacher-info {
    flex: 1;
}

.claude-admin-dashboard .teacher-name {
    font-size: 13px;
    font-weight: 900;
    color: var(--olive-deep);
    margin-bottom: 2px;
}

.claude-admin-dashboard .teacher-subject {
    font-size: 11px;
    color: var(--gold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.claude-admin-dashboard .teacher-stat {
    text-align: left;
}

.claude-admin-dashboard .teacher-stat .value {
    font-size: 18px;
    font-weight: 900;
    color: var(--olive-deep);
}

.claude-admin-dashboard .teacher-stat .label {
    font-size: 10px;
    color: var(--ink-soft);
}

.claude-admin-dashboard .fade-up {
    opacity: 0;
    transform: translateY(10px);
    animation: adminFadeUp 0.5s forwards;
}

.claude-admin-dashboard .d1 { animation-delay: 0.05s; }
.claude-admin-dashboard .d2 { animation-delay: 0.1s; }
.claude-admin-dashboard .d3 { animation-delay: 0.15s; }
.claude-admin-dashboard .d4 { animation-delay: 0.2s; }

@keyframes adminFadeUp {
    to { opacity: 1; transform: translateY(0); }
}

@keyframes adminPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

@media (max-width: 1024px) {
    .claude-admin-dashboard .admin-sidebar {
        width: 80px;
    }

    .claude-admin-dashboard .admin-logo .name,
    .claude-admin-dashboard .admin-logo .subtitle,
    .claude-admin-dashboard .nav-section-title,
    .claude-admin-dashboard .nav-item span:not(.nav-icon),
    .claude-admin-dashboard .nav-badge,
    .claude-admin-dashboard .admin-user .info {
        display: none;
    }

    .claude-admin-dashboard .nav-item {
        justify-content: center;
        padding: 11px;
    }

    .claude-admin-dashboard .kpi-row {
        grid-template-columns: repeat(2, 1fr);
    }

    .claude-admin-dashboard .admin-grid {
        grid-template-columns: 1fr;
    }

    .claude-admin-dashboard .admin-main {
        padding: 20px;
    }

    .claude-admin-dashboard .search-box {
        width: 200px;
    }
}

@media (max-width: 760px) {
    .claude-admin-dashboard {
        display: block;
    }

    .claude-admin-dashboard .admin-sidebar {
        position: static;
        width: 100%;
        height: auto;
    }

    .claude-admin-dashboard .topbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .claude-admin-dashboard .topbar-actions {
        width: 100%;
        flex-wrap: wrap;
    }

    .claude-admin-dashboard .search-box {
        width: 100%;
    }

    .claude-admin-dashboard .kpi-row,
    .claude-admin-dashboard .revenue-stats {
        grid-template-columns: 1fr;
    }

    .claude-admin-dashboard .payment-row {
        grid-template-columns: auto 1fr;
    }

    .claude-admin-dashboard .role-pill,
    .claude-admin-dashboard .status-pill,
    .claude-admin-dashboard .pay-actions {
        grid-column: 2;
    }
}

.claude-admin-dashboard .crm-subtitle {
    margin: 4px 0 0;
    color: var(--ink-soft);
    font-size: 13px;
}

.sidebar-collapse,
.drawer-toggle {
    border: 1px solid rgba(245,241,232,0.16);
    background: rgba(245,241,232,0.08);
    color: #f5f1e8;
    border-radius: 10px;
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    cursor: pointer;
}

.drawer-toggle {
    display: none;
    background: #1f3a2e;
    color: #f5f1e8;
    margin-left: 10px;
}

.app-shell.sidebar-collapsed {
    grid-template-columns: 88px 1fr;
}

.app-shell.sidebar-collapsed .sidebar-brand strong,
.app-shell.sidebar-collapsed .sidebar-brand span,
.app-shell.sidebar-collapsed .sidebar-nav-title,
.app-shell.sidebar-collapsed .sidebar-nav a b,
.app-shell.sidebar-collapsed .sidebar-nav button {
    display: none;
}

.app-shell.sidebar-collapsed .sidebar-nav a {
    grid-template-columns: 1fr;
    justify-items: center;
    padding: 12px 8px;
}

.app-shell.sidebar-collapsed .sidebar-nav a small {
    position: absolute;
    top: 2px;
    left: 2px;
}

.claude-admin-dashboard .user-crm-filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    margin: 14px 0 16px;
    padding: 12px;
    border: 1px solid rgba(31,58,46,0.08);
    border-radius: 12px;
    background: #fbf7ef;
}

.claude-admin-dashboard .user-crm-filters input,
.claude-admin-dashboard .user-crm-filters select {
    width: 100%;
    min-height: 42px;
    border: 1px solid #d8d0c3;
    border-radius: 10px;
    background: #fff;
    padding: 9px 11px;
    color: var(--olive-deep);
    font: inherit;
    font-weight: 700;
}

.claude-admin-dashboard .user-row[hidden],
.claude-admin-dashboard #usersFilterEmpty[hidden] {
    display: none;
}

.claude-admin-dashboard .pay-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.claude-admin-dashboard .pay-actions a.pay-btn {
    text-decoration: none;
    display: inline-grid;
    place-items: center;
}

@media (max-width: 760px) {
    .drawer-toggle {
        display: inline-grid;
    }

    .app-shell .pro-sidebar {
        position: fixed;
        right: 0;
        top: 0;
        bottom: 0;
        transform: translateX(105%);
        z-index: 1200;
        transition: transform 0.25s ease;
        width: min(290px, 88vw);
    }

    .app-shell.sidebar-open .pro-sidebar {
        transform: translateX(0);
    }

    .app-shell.sidebar-collapsed {
        grid-template-columns: 1fr;
    }

    .app-shell.sidebar-collapsed .sidebar-brand strong,
    .app-shell.sidebar-collapsed .sidebar-brand span,
    .app-shell.sidebar-collapsed .sidebar-nav-title,
    .app-shell.sidebar-collapsed .sidebar-nav a b {
        display: initial;
    }

    .app-shell.sidebar-collapsed .sidebar-nav a {
        grid-template-columns: 22px 1fr auto;
        justify-items: stretch;
        padding: 12px 14px;
    }

    .claude-admin-dashboard .user-crm-filters {
        grid-template-columns: 1fr;
    }
}

/* Hero buttons responsive */
@media (max-width: 768px) {
    .home-hero-actions {
        grid-template-columns: 1fr 1fr !important;
        max-width: 100% !important;
        padding: 14px 16px !important;
    }
}

/* ===== FINAL FORCE MOBILE HEADER COMPACT START ===== */
/* ===== FINAL FORCE MOBILE HEADER COMPACT ===== */
@media (max-width: 900px) {
  body .home-page .home-header {
    padding: 4px 8px !important;
    margin: 0 !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 99999 !important;
    background: rgba(250,246,236,.98) !important;
    backdrop-filter: blur(10px) !important;
  }

  body .home-page .home-nav {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 3px 7px !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  body .home-page .home-brand {
    gap: 7px !important;
    padding: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
  }

  body .home-page .home-brand-mark {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    font-size: 16px !important;
  }

  body .home-page .home-brand strong {
    font-size: 15px !important;
    line-height: 1.05 !important;
    max-width: 230px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
  }

  body .home-page .home-brand small {
    font-size: 9.5px !important;
    line-height: 1.05 !important;
    max-width: 230px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
  }

  body .home-page .home-nav-links {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 4px !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 2px 0 0 !important;
  }

  body .home-page .home-nav-links a {
    min-width: 0 !important;
    height: 28px !important;
    padding: 0 2px !important;
    font-size: 9.5px !important;
    line-height: 1 !important;
    border-radius: 9px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    background: rgba(255,255,255,.55) !important;
    font-weight: 900 !important;
  }

  body .home-page .home-nav-actions {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 5px !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 2px 0 0 !important;
  }

  body .home-page .home-login-btn,
  body .home-page .home-signup-btn {
    width: 100% !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 4px 6px !important;
    font-size: 11.5px !important;
    line-height: 1 !important;
    border-radius: 999px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 390px) {
  body .home-page .home-brand strong {
    font-size: 14px !important;
    max-width: 200px !important;
  }

  body .home-page .home-brand small {
    font-size: 9px !important;
    max-width: 200px !important;
  }

  body .home-page .home-nav-links a {
    font-size: 8.8px !important;
    height: 26px !important;
  }

  body .home-page .home-login-btn,
  body .home-page .home-signup-btn {
    height: 30px !important;
    min-height: 30px !important;
    font-size: 10.8px !important;
  }
}

/* ===== FINAL FORCE MOBILE HEADER COMPACT END ===== */

/* ===== teacher section final polish ===== */

/* إخفاء كلمة عن المدرس على كل المقاسات */
.teacher-section .section-eyebrow,
.teacher-section .section-kicker,
.teacher-section .section-overline,
.home-page .teacher-section .section-eyebrow,
.home-page .teacher-section .section-kicker,
.home-page .teacher-section .section-overline {
  display: none !important;
}

/* تصغير عنوان النبذة على الموبايل فقط ليكون في سطر واحد */
@media (max-width: 768px) {
  .teacher-section h2,
  .teacher-section .section-title,
  .home-page .teacher-section h2,
  .home-page .teacher-copy h2,
  .home-page .teacher-content h2 {
    font-size: 2rem !important;
    line-height: 1.08 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    letter-spacing: -0.3px !important;
  }
}

@media (max-width: 420px) {
  .teacher-section h2,
  .teacher-section .section-title,
  .home-page .teacher-section h2,
  .home-page .teacher-copy h2,
  .home-page .teacher-content h2 {
    font-size: 1.75rem !important;
  }
}

/* ===== teacher section final polish ===== */

/* إخفاء كلمة عن المدرس على كل المقاسات */
.teacher-section .section-eyebrow,
.teacher-section .section-kicker,
.teacher-section .section-overline,
.home-page .teacher-section .section-eyebrow,
.home-page .teacher-section .section-kicker,
.home-page .teacher-section .section-overline {
  display: none !important;
}

/* تصغير عنوان النبذة على الموبايل فقط ليكون في سطر واحد */
@media (max-width: 768px) {
  .teacher-section h2,
  .teacher-section .section-title,
  .home-page .teacher-section h2,
  .home-page .teacher-copy h2,
  .home-page .teacher-content h2 {
    font-size: 1.6rem !important; 
    line-height: 1.08 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    letter-spacing: -0.3px !important;
  }
}

@media (max-width: 420px) {
  .teacher-section h2,
  .teacher-section .section-title,
  .home-page .teacher-section h2,
  .home-page .teacher-copy h2,
  .home-page .teacher-content h2 {
    font-size: 1.75rem !important;
  }
}

/* ===== smaller about title on mobile only ===== */
@media (max-width: 768px) {
  .home-about .home-section-heading span {
    display: none !important;
  }

  .home-about .home-section-heading h2 {
    font-size: 24px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
    text-align: center !important;
    margin-bottom: 18px !important;
    letter-spacing: -0.5px !important;
  }
}

@media (max-width: 420px) {
  .home-about .home-section-heading h2 {
    font-size: 21px !important;
  }
}

@media (max-width: 360px) {
  .home-about .home-section-heading h2 {
    font-size: 19px !important;
  }
}

/* =========================================================
   MODERN BUILDER UI
   Course Builder + Curriculum Builder + Quiz Builder
   ========================================================= */

body.builder-modern {
  --builder-green: #174b36;
  --builder-green-2: #1e5a42;
  --builder-gold: #d09a32;
  --builder-gold-2: #e0b156;
  --builder-bg: #f7f4ec;
  --builder-panel: #ffffff;
  --builder-border: #e7dcc8;
  --builder-muted: #7b7f7b;
  --builder-shadow: 0 14px 40px rgba(23, 41, 32, 0.08);
  --builder-radius: 18px;
}

/* خلفية عامة */
body.builder-modern main,
body.builder-modern .page-content,
body.builder-modern .admin-page-content {
  background: linear-gradient(180deg, #faf8f2 0%, #f5f1e7 100%) !important;
}

/* البلوكات الأساسية */
body.builder-modern .builder-panel-modern,
body.builder-modern .builder-sidebar-modern,
body.builder-modern .builder-block-modern,
body.builder-modern .builder-card-modern {
  background: rgba(255,255,255,.96) !important;
  border: 1px solid var(--builder-border) !important;
  border-radius: var(--builder-radius) !important;
  box-shadow: var(--builder-shadow) !important;
  backdrop-filter: blur(4px);
}

/* شريط الأزرار العلوي */
body.builder-modern .builder-actions-modern {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

body.builder-modern .builder-actions-modern button,
body.builder-modern .builder-actions-modern .button,
body.builder-modern .builder-actions-modern a {
  min-height: 46px;
  border-radius: 14px !important;
  padding-inline: 18px !important;
  font-weight: 900 !important;
  transition: .18s ease;
}

body.builder-modern .builder-actions-modern button:hover,
body.builder-modern .builder-actions-modern .button:hover,
body.builder-modern .builder-actions-modern a:hover {
  transform: translateY(-1px);
}

/* تبويبات الخطوات */
body.builder-modern .builder-stepper-modern {
  background: rgba(255,255,255,.8) !important;
  border: 1px solid var(--builder-border) !important;
  border-radius: 999px !important;
  padding: 6px !important;
  box-shadow: var(--builder-shadow) !important;
}

body.builder-modern .builder-stepper-modern > * {
  border-radius: 999px !important;
  transition: .2s ease;
}

/* حقول الإدخال */
body.builder-modern input,
body.builder-modern textarea,
body.builder-modern select {
  border-radius: 14px !important;
  border: 1px solid #d9d0be !important;
  background: #fff !important;
  color: #173d2d !important;
  font-weight: 700 !important;
  transition: .18s ease;
}

body.builder-modern input:focus,
body.builder-modern textarea:focus,
body.builder-modern select:focus {
  border-color: var(--builder-gold) !important;
  box-shadow: 0 0 0 4px rgba(208,154,50,.13) !important;
  outline: none !important;
}

/* عناوين الأقسام */
body.builder-modern .builder-section-title {
  font-size: 24px;
  font-weight: 1000;
  color: var(--builder-green);
  letter-spacing: -.2px;
}

body.builder-modern .builder-section-subtitle {
  font-size: 13px;
  color: var(--builder-muted);
  margin-top: 4px;
}

/* ملخص الكورس / الشريط الجانبي */
body.builder-modern .builder-sidebar-modern {
  position: sticky;
  top: 16px;
}

/* إحصائيات جانبية */
body.builder-modern .builder-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

body.builder-modern .builder-stat-box {
  background: #fbf9f3;
  border: 1px solid #eadfcf;
  border-radius: 14px;
  padding: 12px 10px;
  text-align: center;
}

body.builder-modern .builder-stat-box strong {
  display: block;
  font-size: 20px;
  font-weight: 1000;
  color: var(--builder-green);
}

body.builder-modern .builder-stat-box span {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: var(--builder-muted);
}

/* عناصر الوحدات والدروس */
body.builder-modern .lesson-row-modern,
body.builder-modern .unit-row-modern,
body.builder-modern .exam-row-modern {
  background: #fff;
  border: 1px solid #eadfce;
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(0,0,0,.04);
}

/* أزرار صغيرة */
body.builder-modern .mini-action-btn {
  border-radius: 12px !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  font-weight: 900 !important;
}

/* =========================
   Question correct answer UI
   ========================= */

body.builder-modern .answer-option-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid #e6dcc9;
  border-radius: 16px;
  background: #fff;
  transition: .18s ease;
  position: relative;
  margin-bottom: 10px;
}

body.builder-modern .answer-option-card:hover {
  border-color: #d8bf90;
  box-shadow: 0 8px 20px rgba(208,154,50,.08);
}

body.builder-modern .answer-option-card.is-correct-answer {
  border-color: #2d7a4f !important;
  background: linear-gradient(180deg, #f3fbf6 0%, #edf8f1 100%) !important;
  box-shadow: 0 10px 24px rgba(45,122,79,.12);
}

body.builder-modern .answer-option-card.is-correct-answer::after {
  content: "✓ الإجابة الصحيحة";
  position: absolute;
  top: -10px;
  left: 14px;
  background: #2d7a4f;
  color: #fff;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 900;
  box-shadow: 0 6px 14px rgba(45,122,79,.18);
}

body.builder-modern .answer-option-card .correct-answer-radio {
  width: 20px;
  height: 20px;
  accent-color: #2d7a4f;
  cursor: pointer;
}

body.builder-modern .answer-option-card .answer-order-badge {
  min-width: 34px;
  height: 34px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f4efe3;
  color: var(--builder-green);
  font-weight: 1000;
  border: 1px solid #eadfce;
}

body.builder-modern .answer-option-card.is-correct-answer .answer-order-badge {
  background: #2d7a4f;
  color: #fff;
  border-color: #2d7a4f;
}

/* إخفاء مستوى الصعوبة بصريًا */
body.builder-modern .difficulty-field-hidden {
  display: none !important;
}

/* مودالات */
body.builder-modern dialog,
body.builder-modern .modal,
body.builder-modern [role="dialog"] {
  border-radius: 20px !important;
}

/* موبايل */
@media (max-width: 900px) {
  body.builder-modern .builder-stat-grid {
    grid-template-columns: 1fr 1fr;
  }

  body.builder-modern .builder-actions-modern {
    gap: 8px;
  }

  body.builder-modern .builder-section-title {
    font-size: 20px;
  }

  body.builder-modern .answer-option-card {
    padding: 10px 12px;
  }
}


/* ==========================================================
   SAFE BUILDER MODERN UI - scoped only
   Works only when body has .safe-builder-modern
   ========================================================== */

body.safe-builder-modern {
  --sb-green: #173d2d;
  --sb-green-2: #23533f;
  --sb-gold: #c99634;
  --sb-cream: #f8f3e8;
  --sb-border: #eadfca;
  --sb-muted: #6f7671;
}

/* الصفحة العامة */
body.safe-builder-modern .page-content,
body.safe-builder-modern main,
body.safe-builder-modern .dashboard-content {
  background: linear-gradient(180deg, #fbf8f0 0%, #f6f1e6 100%) !important;
}

/* الهيدر العلوي */
body.safe-builder-modern .safe-builder-topbar {
  background: rgba(255,255,255,.95) !important;
  border-bottom: 1px solid var(--sb-border) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.035) !important;
}

/* أزرار الحفظ والنشر والمعاينة */
body.safe-builder-modern .safe-builder-actions button,
body.safe-builder-modern .safe-builder-actions a {
  border-radius: 14px !important;
  min-height: 44px !important;
  padding-inline: 18px !important;
  font-weight: 1000 !important;
  transition: transform .16s ease, box-shadow .16s ease !important;
}

body.safe-builder-modern .safe-builder-actions button:hover,
body.safe-builder-modern .safe-builder-actions a:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.07) !important;
}

/* شريط الخطوات */
body.safe-builder-modern .safe-builder-stepper {
  background: #fff !important;
  border: 1px solid var(--sb-border) !important;
  border-radius: 999px !important;
  padding: 8px !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.055) !important;
}

body.safe-builder-modern .safe-builder-stepper * {
  border-radius: 999px !important;
}

/* البانلات */
body.safe-builder-modern .safe-builder-panel {
  background: rgba(255,255,255,.96) !important;
  border: 1px solid var(--sb-border) !important;
  border-radius: 22px !important;
  box-shadow: 0 14px 36px rgba(0,0,0,.055) !important;
}

/* السايد بار */
body.safe-builder-modern .safe-builder-sidebar {
  background: #fff !important;
  border: 1px solid var(--sb-border) !important;
  border-radius: 20px !important;
  box-shadow: 0 14px 36px rgba(0,0,0,.055) !important;
}

/* الحقول */
body.safe-builder-modern input,
body.safe-builder-modern textarea,
body.safe-builder-modern select {
  border-radius: 13px !important;
  border: 1px solid #d8cfbd !important;
  background: #fff !important;
  font-family: Cairo, sans-serif !important;
  font-weight: 800 !important;
}

body.safe-builder-modern input:focus,
body.safe-builder-modern textarea:focus,
body.safe-builder-modern select:focus {
  border-color: var(--sb-gold) !important;
  box-shadow: 0 0 0 4px rgba(201,150,52,.14) !important;
  outline: none !important;
}

/* كروت الوحدات والدروس */
body.safe-builder-modern .safe-unit-card,
body.safe-builder-modern .safe-lesson-card,
body.safe-builder-modern .safe-exam-card {
  background: #fff !important;
  border: 1px solid var(--sb-border) !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.045) !important;
  overflow: hidden !important;
}

/* إخفاء مستوى الصعوبة */
body.safe-builder-modern .safe-hide-difficulty {
  display: none !important;
}

/* تحسين اختيار الإجابة الصحيحة */
body.safe-builder-modern .safe-answer-option {
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  gap: 10px !important;
  align-items: center !important;
  background: #fff !important;
  border: 1px solid #e5dac7 !important;
  border-radius: 16px !important;
  padding: 12px !important;
  margin-bottom: 10px !important;
  position: relative !important;
  transition: .16s ease !important;
}

body.safe-builder-modern .safe-answer-option:hover {
  border-color: #d6b875 !important;
  box-shadow: 0 10px 22px rgba(201,150,52,.08) !important;
}

body.safe-builder-modern .safe-answer-option.safe-correct {
  border-color: #2d7a4f !important;
  background: linear-gradient(180deg, #f2fbf6 0%, #eaf7f0 100%) !important;
  box-shadow: 0 12px 28px rgba(45,122,79,.13) !important;
}

body.safe-builder-modern .safe-answer-option.safe-correct::after {
  content: "✓ الإجابة الصحيحة";
  position: absolute;
  top: -11px;
  left: 14px;
  background: #2d7a4f;
  color: #fff;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 1000;
}

body.safe-builder-modern .safe-answer-badge {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: var(--sb-cream);
  color: var(--sb-green);
  border: 1px solid var(--sb-border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 1000;
}

body.safe-builder-modern .safe-answer-option.safe-correct .safe-answer-badge {
  background: #2d7a4f;
  color: #fff;
  border-color: #2d7a4f;
}

body.safe-builder-modern .safe-answer-option input[type="radio"] {
  width: 20px !important;
  height: 20px !important;
  accent-color: #2d7a4f !important;
}

/* ملخص المحتوى */
body.safe-builder-modern .safe-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
}

body.safe-builder-modern .safe-stat-box {
  background: #fbf8f0;
  border: 1px solid var(--sb-border);
  border-radius: 14px;
  padding: 12px;
  text-align: center;
}

body.safe-builder-modern .safe-stat-box strong {
  display: block;
  font-size: 20px;
  color: var(--sb-green);
  font-weight: 1000;
}

body.safe-builder-modern .safe-stat-box span {
  display: block;
  font-size: 12px;
  color: var(--sb-muted);
  margin-top: 4px;
}

@media (max-width: 768px) {
  body.safe-builder-modern .safe-builder-stepper {
    border-radius: 18px !important;
  }

  body.safe-builder-modern .safe-answer-option {
    grid-template-columns: auto 1fr !important;
  }
}


/* ===== SAFE BUILDERS VISUAL POLISH - CSS ONLY ===== */

/* صفحات بناء الكورس والامتحان فقط غالبًا فيها هذه العناوين/classes */
.course-builder,
.quiz-builder,
#courseBuilder,
#quizBuilder,
[data-builder-page] {
  background: linear-gradient(180deg, #fbf8f0 0%, #f6f1e6 100%) !important;
}

/* أزرار الحفظ والنشر والمعاينة */
button,
.lms-button {
  transition: transform .15s ease, box-shadow .15s ease;
}

.course-builder button,
.quiz-builder button,
#courseBuilder button,
#quizBuilder button {
  border-radius: 12px !important;
  font-weight: 900 !important;
}

.course-builder button:hover,
.quiz-builder button:hover,
#courseBuilder button:hover,
#quizBuilder button:hover {
  transform: translateY(-1px);
}

/* الحقول داخل البناء */
.course-builder input,
.course-builder textarea,
.course-builder select,
.quiz-builder input,
.quiz-builder textarea,
.quiz-builder select,
#courseBuilder input,
#courseBuilder textarea,
#courseBuilder select,
#quizBuilder input,
#quizBuilder textarea,
#quizBuilder select {
  border-radius: 13px !important;
  border: 1px solid #d8cfbd !important;
  font-family: Cairo, sans-serif !important;
}

/* منع أي بلوك مستوى الصعوبة لو لسه ظاهر */
label:has(select):has(option[value*="easy"]),
label:has(select):has(option[value*="medium"]),
label:has(select):has(option[value*="hard"]) {
  display: none !important;
}


/* ===== Revert bad quiz answer visual override ===== */
.quiz-answer-option-safe,
.quiz-answer-correct-safe {
  display: initial !important;
  grid-template-columns: initial !important;
  gap: initial !important;
  align-items: initial !important;
  position: initial !important;
  margin-bottom: initial !important;
  padding: initial !important;
  background: initial !important;
  border: initial !important;
  border-radius: initial !important;
  box-shadow: initial !important;
}

.quiz-answer-option-safe::after,
.quiz-answer-correct-safe::after,
.quiz-answer-letter-safe {
  display: none !important;
}


/* ===== Full Auth Pages ===== */
.auth-page {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 999999;
  background:
    radial-gradient(circle at top right, rgba(199,150,52,.16), transparent 34%),
    linear-gradient(135deg, #f8f3e8 0%, #fffaf0 100%);
  padding: 90px 18px 32px;
  overflow-y: auto;
}

.auth-page.active {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.auth-page-card {
  position: relative;
  background: #fff;
  border: 1px solid #eadfc8;
  box-shadow: 0 28px 70px rgba(0,0,0,.14);
}

.auth-page-open {
  overflow: hidden;
}

.auth-page .form-group label {
  font-weight: 900;
  color: #34433a;
  margin-bottom: 8px;
  display: block;
}

.auth-page .form-group input,
.auth-page .form-group select {
  min-height: 46px;
  background: #f8fafc;
}

.auth-page .modal-btn {
  min-height: 50px;
  border-radius: 12px;
  font-weight: 900;
}

@media (max-width: 768px) {
  .auth-page {
    padding: 72px 12px 24px;
  }

  .auth-page-card {
    width: 100% !important;
    padding: 22px 16px !important;
    border-radius: 20px !important;
  }

  .auth-page form [style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
}

/* ===== Homepage logged-in header actions ===== */
.home-dashboard-btn,
.home-logout-btn {
  border: none;
  cursor: pointer;
  text-decoration: none;
  border-radius: 999px;
  padding: 11px 18px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: Cairo, sans-serif;
  font-weight: 900;
  font-size: 15px;
  line-height: 1;
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
  transition: transform .2s ease, box-shadow .2s ease;
}

.home-dashboard-btn {
  background: linear-gradient(135deg, #d6a23a, #b87d1d);
  color: #fff;
}

.home-logout-btn {
  background: linear-gradient(135deg, #e53935, #b71c1c);
  color: #fff;
}

.home-dashboard-btn:hover,
.home-logout-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(0,0,0,.12);
}

@media (max-width: 768px) {
  .home-nav-actions:has(.home-dashboard-btn),
  .home-nav-actions:has(.home-logout-btn) {
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
  }

  .home-dashboard-btn,
  .home-logout-btn {
    width: 100% !important;
    min-height: 34px !important;
    height: 34px !important;
    padding: 6px 7px !important;
    font-size: 11.5px !important;
  }
}

/* ===== Final homepage/auth polish ===== */

/* زر إنشاء حساب/اشترك الآن في الهيدر يكون أبيض */
.home-header .home-signup-btn {
  background: #fff !important;
  color: #173d2d !important;
  border: 1px solid #e7decf !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.06) !important;
}

/* رابط: لديك حساب بالفعل؟ */
.auth-page #goLoginFromRegister {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg, #d6a23a, #b87d1d) !important;
  color: #fff !important;
  padding: 10px 18px !important;
  border-radius: 999px !important;
  margin-top: 8px !important;
  text-decoration: none !important;
  box-shadow: 0 10px 24px rgba(184,125,29,.22) !important;
}

/* الجملة كلها كأنها بطاقة ذهبية لطيفة */
.auth-page p:has(#goLoginFromRegister) {
  background: #fff7e6 !important;
  border: 1px solid #ead7aa !important;
  border-radius: 16px !important;
  padding: 14px !important;
  margin-bottom: 18px !important;
}

/* زر العودة لاختيار نوع الحساب شفاف وأصغر */
.auth-page #backToSelector {
  background: rgba(255,255,255,.55) !important;
  border: 1px solid #eadfc8 !important;
  border-radius: 999px !important;
  padding: 7px 13px !important;
  font-size: 12px !important;
  width: fit-content !important;
  color: #173d2d !important;
}

/* آراء الطلاب وأولياء الأمور: كروت أصغر بدون دوائر الحروف */
.compact-testimonials {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  max-width: 980px !important;
  margin: 0 auto !important;
}

.compact-testimonial-card {
  background: #fff !important;
  border: 1px solid #eadfc8 !important;
  border-radius: 18px !important;
  padding: 22px 24px !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.05) !important;
  min-height: 130px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.compact-testimonial-card p {
  margin: 0 0 14px !important;
  font-size: 18px !important;
  line-height: 1.7 !important;
  color: #173d2d !important;
  font-weight: 800 !important;
}

.compact-testimonial-meta {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  color: #666 !important;
}

.compact-testimonial-meta strong {
  color: #173d2d !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}

.compact-testimonial-meta span {
  background: #fbf3df !important;
  color: #b87d1d !important;
  border-radius: 999px !important;
  padding: 4px 10px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

@media (max-width: 768px) {
  .compact-testimonials {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 0 12px !important;
  }

  .compact-testimonial-card {
    padding: 18px !important;
    min-height: 110px !important;
  }

  .compact-testimonial-card p {
    font-size: 15px !important;
    margin-bottom: 10px !important;
  }
}

/* ===== Dynamic global header + CMS alerts on internal pages ===== */
.global-app-shell {
  min-height: 100vh;
  background: #f8f3e8;
}

.global-home-topbar {
  position: sticky;
  top: 0;
  z-index: 99999;
  background: #f8f3e8;
  box-shadow: 0 8px 26px rgba(0,0,0,.06);
}

.global-home-header {
  position: relative !important;
  top: auto !important;
}

.global-home-alert-bar {
  position: relative !important;
  top: auto !important;
  margin: 0 !important;
}

#globalRouteMount {
  min-height: calc(100vh - 120px);
}

@media (max-width: 768px) {
  .global-home-topbar .home-nav-links {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }

  .global-home-topbar .home-nav-actions {
    grid-template-columns: 1fr 1fr !important;
  }

  #globalRouteMount {
    min-height: calc(100vh - 150px);
  }
}

/* ===== Fix global topbar visual style ===== */
.global-home-topbar {
  direction: rtl !important;
  background: #f8f3e8 !important;
}

.global-home-topbar .home-header {
  width: 100% !important;
  box-sizing: border-box !important;
}

.global-home-topbar .home-nav {
  direction: rtl !important;
}

.global-home-topbar .home-brand,
.global-home-topbar .home-brand:visited,
.global-home-topbar .home-brand:hover {
  color: inherit !important;
  text-decoration: none !important;
}

.global-home-topbar .home-brand strong,
.global-home-topbar .home-brand small {
  text-decoration: none !important;
}

.global-home-topbar .home-nav-links a,
.global-home-topbar .home-nav-links a:visited {
  color: #37443d !important;
  text-decoration: none !important;
}

.global-home-topbar .home-dashboard-btn,
.global-home-topbar .home-dashboard-btn:visited {
  color: #fff !important;
  text-decoration: none !important;
}

.global-home-topbar .home-alert-bar {
  width: 100% !important;
  border-radius: 0 !important;
}

/* ===== Fix huge gap caused by global topbar inheriting home-page height ===== */
.global-home-topbar,
.global-home-topbar.home-page {
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
}

.global-home-topbar .home-header {
  min-height: 0 !important;
  margin: 0 !important;
}

.global-home-topbar .home-alert-bar {
  margin: 0 !important;
}

#globalTopbarMount {
  min-height: 0 !important;
  height: auto !important;
}

#globalRouteMount {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* ===== Dynamic alert news ticker ===== */
.alert-ticker-bar {
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  overflow: hidden !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.alert-ticker-inner {
  width: 100% !important;
  max-width: 100% !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  padding: 0 22px !important;
  box-sizing: border-box !important;
}

.alert-ticker-inner > strong {
  flex: 0 0 auto !important;
  color: #d6a23a !important;
  font-weight: 900 !important;
  font-size: 16px !important;
  position: relative !important;
  z-index: 2 !important;
}

.alert-ticker-window {
  flex: 1 1 auto !important;
  overflow: hidden !important;
  min-width: 0 !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
}

.alert-ticker-track {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  width: max-content !important;
  animation: alertTickerMove 24s linear infinite !important;
  will-change: transform !important;
}

.alert-ticker-track span {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 30px !important;
  padding: 6px 18px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  color: #fff !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

.alert-ticker-bar:hover .alert-ticker-track {
  animation-play-state: paused !important;
}

@keyframes alertTickerMove {
  from {
    transform: translateX(-50%);
  }
  to {
    transform: translateX(0);
  }
}

@media (max-width: 768px) {
  .alert-ticker-bar {
    height: 54px !important;
    min-height: 54px !important;
    max-height: 54px !important;
  }

  .alert-ticker-inner {
    height: 54px !important;
    gap: 10px !important;
    padding: 0 12px !important;
  }

  .alert-ticker-inner > strong {
    font-size: 14px !important;
  }

  .alert-ticker-track {
    gap: 10px !important;
    animation-duration: 20s !important;
  }

  .alert-ticker-track span {
    min-height: 30px !important;
    padding: 6px 14px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 390px) {
  .alert-ticker-inner > strong {
    font-size: 13px !important;
  }

  .alert-ticker-track span {
    font-size: 12px !important;
    padding: 6px 12px !important;
  }
}

/* ===== Mobile only: fix alerts ticker layout ===== */
@media (max-width: 768px) {
  .home-alert-bar.alert-ticker-bar,
  .global-home-alert-bar.alert-ticker-bar {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
  }

  .home-alert-inner.alert-ticker-inner,
  .global-home-alert-bar .alert-ticker-inner {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    padding: 0 10px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }

  .alert-ticker-inner > strong {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 13px !important;
    line-height: 1 !important;
    color: #d6a23a !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  .alert-ticker-window {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    height: 44px !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
  }

  .alert-ticker-track {
    height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: max-content !important;
    animation: alertTickerMove 18s linear infinite !important;
  }

  .alert-ticker-track span {
    min-height: 26px !important;
    height: 26px !important;
    padding: 4px 12px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 390px) {
  .alert-ticker-inner > strong {
    font-size: 12px !important;
  }

  .alert-ticker-track span {
    font-size: 11.5px !important;
    padding: 4px 10px !important;
  }
}

/* ===== HARD FIX: Mobile alert ticker one-line layout only ===== */
@media (max-width: 768px) {
  .home-alert-bar,
  .home-alert-bar.alert-ticker-bar,
  .global-home-alert-bar,
  .global-home-alert-bar.alert-ticker-bar {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    display: block !important;
    position: relative !important;
  }

  .home-alert-inner,
  .home-alert-inner.alert-ticker-inner,
  .global-home-alert-bar .home-alert-inner,
  .global-home-alert-bar .alert-ticker-inner {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    width: 100% !important;
    padding: 0 10px !important;
    margin: 0 !important;
    box-sizing: border-box !important;

    display: grid !important;
    grid-template-columns: 112px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 8px !important;

    overflow: hidden !important;
    white-space: nowrap !important;
    direction: rtl !important;
  }

  .home-alert-inner > strong,
  .alert-ticker-inner > strong {
    grid-column: 1 !important;
    grid-row: 1 !important;

    width: 112px !important;
    min-width: 112px !important;
    max-width: 112px !important;

    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    margin: 0 !important;
    padding: 0 !important;
    position: static !important;

    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    color: #d6a23a !important;
    white-space: nowrap !important;
  }

  .alert-ticker-window {
    grid-column: 2 !important;
    grid-row: 1 !important;

    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;

    width: 100% !important;
    min-width: 0 !important;

    display: flex !important;
    align-items: center !important;

    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    direction: ltr !important;
  }

  .alert-ticker-track {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    gap: 8px !important;
    width: max-content !important;

    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    top: auto !important;
    bottom: auto !important;

    transform: none;
    animation: alertTickerMove 18s linear infinite !important;
    will-change: transform !important;
  }

  .alert-ticker-track span {
    height: 26px !important;
    min-height: 26px !important;
    max-height: 26px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 4px 12px !important;
    margin: 0 !important;
    position: static !important;

    font-size: 12px !important;
    line-height: 1 !important;
    white-space: nowrap !important;

    border-radius: 999px !important;
    box-sizing: border-box !important;
  }

  /* منع أي span قديم مباشر من كود التنبيهات القديم يظهر خارج ticker */
  .home-alert-inner > span:not(.keep-alert-span) {
    display: none !important;
  }

  .alert-ticker-track span {
    display: inline-flex !important;
  }
}

@media (max-width: 390px) {
  .home-alert-inner,
  .home-alert-inner.alert-ticker-inner,
  .global-home-alert-bar .home-alert-inner,
  .global-home-alert-bar .alert-ticker-inner {
    grid-template-columns: 96px minmax(0, 1fr) !important;
    gap: 6px !important;
    padding: 0 8px !important;
  }

  .home-alert-inner > strong,
  .alert-ticker-inner > strong {
    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;
    font-size: 12px !important;
  }

  .alert-ticker-track span {
    font-size: 11px !important;
    padding: 4px 10px !important;
  }
}

/* ===== Make signup button visually distinct ===== */
.home-signup-btn,
.global-home-topbar .home-signup-btn {
  background: linear-gradient(135deg, #d6a23a, #b87d1d) !important;
  color: #fff !important;
  border: 1px solid rgba(184, 125, 29, .35) !important;
  box-shadow: 0 10px 24px rgba(184, 125, 29, .22) !important;
}

.home-signup-btn:hover,
.global-home-topbar .home-signup-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 14px 30px rgba(184, 125, 29, .28) !important;
}

/* الموبايل */
@media (max-width: 768px) {
  .home-signup-btn,
  .global-home-topbar .home-signup-btn {
    background: linear-gradient(135deg, #d6a23a, #b87d1d) !important;
    color: #fff !important;
  }
}

/* ===== FORCE signup button background, not only text ===== */
.home-nav-actions a.home-signup-btn,
.home-nav-actions #openSignup,
.global-home-topbar .home-nav-actions a.home-signup-btn,
.global-home-topbar .home-nav-actions #openSignup,
a.home-signup-btn[href="#register"],
a.home-signup-btn[href="#/register"] {
  background: linear-gradient(135deg, #d6a23a 0%, #b87d1d 100%) !important;
  background-color: #c9932e !important;
  color: #fff !important;
  border: 1px solid rgba(184, 125, 29, .45) !important;
  box-shadow: 0 10px 24px rgba(184, 125, 29, .25) !important;
}

.home-nav-actions a.home-signup-btn:hover,
.home-nav-actions #openSignup:hover,
.global-home-topbar .home-nav-actions a.home-signup-btn:hover,
.global-home-topbar .home-nav-actions #openSignup:hover {
  background: linear-gradient(135deg, #e0ad47 0%, #a96f16 100%) !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
}

@media (max-width: 768px) {
  .home-nav-actions a.home-signup-btn,
  .home-nav-actions #openSignup,
  .global-home-topbar .home-nav-actions a.home-signup-btn,
  .global-home-topbar .home-nav-actions #openSignup {
    background: linear-gradient(135deg, #d6a23a 0%, #b87d1d 100%) !important;
    background-color: #c9932e !important;
    color: #fff !important;
  }
}

/* ===== Sidebar user mini card + remove inner dashboard topbar gap ===== */
.main-panel.no-inner-topbar {
  padding-top: 0 !important;
}

.no-inner-topbar .pro-content,
.main-panel.no-inner-topbar .content {
  padding-top: 24px !important;
}

.sidebar-user-mini-card {
  margin: 14px 16px 18px !important;
  padding: 12px !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: #fff !important;
  box-shadow: 0 14px 32px rgba(0,0,0,.10) !important;
}

.sidebar-user-avatar {
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  border: 2px solid rgba(214,162,58,.85) !important;
  background: #f8f3e8 !important;
}

.sidebar-user-avatar-fallback {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg, #d6a23a, #b87d1d) !important;
  color: #173d2d !important;
  font-weight: 900 !important;
  font-size: 18px !important;
}

.sidebar-user-info {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  text-align: right !important;
}

.sidebar-user-info strong {
  display: block !important;
  max-width: 145px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  color: #fff !important;
  font-weight: 900 !important;
}

.sidebar-user-info span {
  display: inline-flex !important;
  width: fit-content !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  background: rgba(214,162,58,.16) !important;
  color: #d6a23a !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
}

.dashboard-drawer-float {
  display: none !important;
}

@media (max-width: 900px) {
  .no-inner-topbar .pro-content,
  .main-panel.no-inner-topbar .content {
    padding-top: 18px !important;
  }

  .dashboard-drawer-float {
    display: inline-flex !important;
    position: sticky !important;
    top: 12px !important;
    z-index: 50 !important;
    width: 48px !important;
    height: 48px !important;
    margin: 10px 12px 0 auto !important;
    border-radius: 14px !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    background: #173d2d !important;
    color: #fff !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 22px !important;
    cursor: pointer !important;
    box-shadow: 0 12px 24px rgba(0,0,0,.14) !important;
  }

  .sidebar-user-mini-card {
    margin: 12px 14px 16px !important;
  }
}

/* ===== Fix course thumbnails 16:9 after grid changes ===== */
.course-card img,
.subject-card img,
.video-course-card img,
.lms-course-card img,
.paid-course-card img,
.free-course-card img,
[class*="course"] img[src*="uploads"],
[class*="course"] img[src*="subjects"],
[class*="course"] img[src*="courses"] {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}

/* لو الصورة داخل wrapper */
.course-card figure,
.subject-card figure,
.video-course-card figure,
.lms-course-card figure,
.paid-course-card figure,
.free-course-card figure,
[class*="course-thumb"],
[class*="course-image"],
[class*="subject-thumb"],
[class*="subject-image"] {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  overflow: hidden !important;
  border-radius: 14px 14px 0 0 !important;
}

/* منع الكارت من كسر الصورة */
.course-card,
.subject-card,
.video-course-card,
.lms-course-card,
.paid-course-card,
.free-course-card {
  overflow: hidden !important;
}

/* تأكيد إن زر دخول الكورس قابل للضغط */
.course-card button,
.subject-card button,
.video-course-card button,
.lms-course-card button,
.paid-course-card button,
.free-course-card button,
.course-card a,
.subject-card a,
.video-course-card a,
.lms-course-card a,
.paid-course-card a,
.free-course-card a {
  position: relative !important;
  z-index: 5 !important;
  pointer-events: auto !important;
}

/* ===== Fix LMS course covers to true 16:9 ===== */
.lms-course-card .lms-course-cover,
.course-card-modern .lms-course-cover,
#studentCoursesGrid .lms-course-cover,
#coursesGrid .lms-course-cover {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  border-radius: 14px 14px 0 0 !important;
  overflow: hidden !important;
}

/* منع أي قواعد قديمة من ضغط الكارت أو تعطيل الزر */
.lms-course-card {
  overflow: hidden !important;
}

.lms-card-actions {
  position: relative !important;
  z-index: 5 !important;
}

.lms-card-actions .lms-button,
.lms-card-actions button {
  pointer-events: auto !important;
  cursor: pointer !important;
  position: relative !important;
  z-index: 6 !important;
}

/* Video Protection */
.lms-player video {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}
.lms-player {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}
video::-webkit-media-controls-enclosure {
    overflow: hidden;
}
video::-webkit-media-controls-panel {
    width: calc(100% + 30px);
}

/* ========= Course View - Modern Design ========= */
.lms-course-hero {
    display: grid;
    grid-template-columns: 280px 1fr 200px;
    gap: 24px;
    align-items: center;
    background: linear-gradient(135deg, #1f4a38 0%, #2d5016 50%, #1a3d2e 100%);
    border-radius: 20px;
    padding: 28px;
    margin-bottom: 24px;
    color: white;
    position: relative;
    overflow: hidden;
}
.lms-course-hero::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(199,146,52,0.15) 0%, transparent 70%);
    border-radius: 50%;
}
.lms-course-hero-cover {
    width: 280px;
    height: 180px;
    border-radius: 14px;
    background-size: cover;
    background-position: center;
    box-shadow: 0 8px 25px rgba(0,0,0,0.3);
    border: 2px solid rgba(255,255,255,0.15);
}
.lms-course-hero-info {
    position: relative;
    z-index: 1;
}
.lms-course-hero-info h1 {
    font-size: 28px;
    font-weight: 900;
    margin: 8px 0 10px;
    font-family: Cairo;
    color: white;
}
.lms-course-hero-info p {
    font-size: 14px;
    opacity: 0.85;
    line-height: 1.7;
    margin: 0 0 14px;
    max-width: 500px;
}
.lms-course-hero-meta {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 13px;
    opacity: 0.8;
    margin-bottom: 16px;
}
.lms-course-hero-meta span::before {
    content: '✦ ';
    color: #c79234;
}
.lms-course-hero-actions {
    display: flex;
    gap: 10px;
}
.lms-course-hero-actions .lms-button {
    background: #c79234;
    color: white;
    border: none;
    padding: 10px 24px;
    border-radius: 25px;
    font-weight: 700;
    font-family: Cairo;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s;
}
.lms-course-hero-actions .lms-button:hover {
    background: #b07e28;
    transform: translateY(-2px);
}
.lms-course-hero-actions .lms-button.ghost {
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.3);
}
.lms-course-hero-actions .lms-button.ghost:hover {
    background: rgba(255,255,255,0.25);
}
.lms-course-hero-progress {
    text-align: center;
    background: rgba(255,255,255,0.1);
    border-radius: 16px;
    padding: 20px;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.1);
    position: relative;
    z-index: 1;
}
.lms-course-hero-progress small {
    display: block;
    font-size: 12px;
    opacity: 0.7;
    margin-bottom: 6px;
}
.lms-course-hero-progress strong {
    font-size: 42px;
    font-weight: 900;
    display: block;
    color: #c79234;
}
.lms-course-hero-progress em {
    font-style: normal;
    font-size: 13px;
    color: #c79234;
    font-weight: 700;
}
.lms-progress-line {
    display: block;
    height: 6px;
    background: rgba(255,255,255,0.15);
    border-radius: 10px;
    margin: 8px 0;
    overflow: hidden;
}
.lms-progress-line i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #c79234, #e6b84d);
    border-radius: 10px;
    transition: width 0.5s ease;
}

/* Stats Sidebar */
.lms-study-stats {
    display: grid;
    gap: 16px;
    align-content: start;
}
.lms-side-box {
    background: #fffdf8;
    border: 1px solid #eee7dc;
    border-radius: 16px;
    padding: 18px;
}
.lms-side-box strong {
    display: block;
    color: #1f4a38;
    font-size: 15px;
    margin-bottom: 12px;
}
.lms-side-box div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}
.lms-side-box span {
    background: #f0faf0;
    border: 1px solid #d4edda;
    border-radius: 10px;
    padding: 10px;
    text-align: center;
    font-size: 13px;
    font-weight: 700;
    color: #1f4a38;
}
.lms-certificate-card {
    background: linear-gradient(135deg, #1f4a38, #2d5016);
    border-radius: 16px;
    padding: 20px;
    color: white;
    text-align: center;
}
.lms-certificate-card strong {
    display: block;
    font-size: 15px;
    margin-bottom: 8px;
    color: #c79234;
}
.lms-certificate-card p {
    font-size: 13px;
    opacity: 0.8;
    margin: 0 0 12px;
    line-height: 1.6;
}

/* Responsive */
@media (max-width: 900px) {
    .lms-course-hero {
        grid-template-columns: 1fr;
        text-align: center;
    }
    .lms-course-hero-cover {
        width: 100%;
        height: 200px;
        margin: 0 auto;
    }
    .lms-course-hero-meta {
        justify-content: center;
    }
    .lms-course-hero-actions {
        justify-content: center;
    }
    .lms-study-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ========= Mobile Course View Fix ========= */
@media (max-width: 768px) {
    .lms-study {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
    }
    .lms-study-nav {
        order: 3 !important;
        max-height: none !important;
    }
    .lms-study-main {
        order: 1 !important;
        padding: 12px !important;
    }
    .lms-study-stats {
        order: 2 !important;
        padding: 12px !important;
    }
    .lms-player {
        aspect-ratio: 16/9;
        border-radius: 10px !important;
        margin-bottom: 12px;
    }
    .lms-player video,
    .lms-player iframe {
        width: 100% !important;
        height: 100% !important;
    }
    .lms-study-tabs {
        overflow-x: auto;
        flex-wrap: nowrap !important;
        padding-bottom: 8px;
    }
    .lms-study-tabs button {
        white-space: nowrap;
        flex-shrink: 0;
    }
    .lms-lesson-section {
        padding: 12px !important;
        margin-bottom: 12px !important;
    }
    .lms-study-header {
        flex-direction: column;
        text-align: center;
    }
    .lms-lesson-study-head {
        grid-template-columns: 1fr !important;
        text-align: center;
    }
    .lms-lesson-study-head img {
        width: 100% !important;
        max-width: 280px;
        margin: 0 auto;
    }
    .lms-side-box div {
        grid-template-columns: 1fr 1fr !important;
    }
    .lms-study-item {
        flex-direction: column;
        text-align: center;
    }
    .lms-study-media img {
        width: 100% !important;
        max-width: 200px;
    }
    .lms-course-hero {
        padding: 16px !important;
        border-radius: 12px !important;
    }
    .lms-course-hero-info h1 {
        font-size: 20px !important;
    }
    .lms-course-hero-progress strong {
        font-size: 32px !important;
    }
    .lms-student-course-header {
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }
    .course-view-page .lms-study-grid {
        display: flex !important;
        flex-direction: column !important;
    }
}

/* ===== Modern course page sidebars and dynamic lesson states ===== */
.course-view-page {
  background: #f8f3e8 !important;
}

.course-view-page .lms-study-grid {
  grid-template-columns: 320px minmax(0, 1fr) 240px !important;
  gap: 18px !important;
  align-items: start !important;
}

.course-view-page .lms-study-nav,
.course-view-page .lms-study-stats {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.course-view-page .lms-study-nav {
  display: grid !important;
  gap: 12px !important;
}

.course-view-page .lms-study-nav > .lms-button {
  height: 48px !important;
  border-radius: 14px !important;
  background: #f2eadc !important;
  color: #173b2c !important;
  box-shadow: none !important;
}

.course-view-page .lms-study-nav-head,
.course-view-page .lms-study-unit,
.course-view-page .lms-final-exams,
.course-view-page .lms-side-box,
.course-view-page .lms-certificate-card {
  background: #fff !important;
  border: 1px solid #e8dfcf !important;
  border-radius: 18px !important;
  box-shadow: 0 14px 34px rgba(24,61,47,.055) !important;
}

.course-view-page .lms-study-nav-head {
  padding: 16px !important;
}

.course-view-page .lms-study-nav-head h3 {
  margin: 0 0 4px !important;
  color: #173b2c !important;
  font-size: 18px !important;
}

.course-view-page .lms-study-nav-head small {
  color: #667085 !important;
}

.course-view-page .lms-study-unit {
  padding: 10px !important;
  display: grid !important;
  gap: 8px !important;
}

.course-view-page .lms-study-unit > strong {
  display: block !important;
  font-size: 0 !important;
}

.course-view-page .lms-study-unit-toggle {
  width: 100% !important;
  border: 0 !important;
  background: #fbf7ef !important;
  color: #173b2c !important;
  border-radius: 14px !important;
  padding: 12px !important;
  font-weight: 900 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  cursor: pointer !important;
}

.course-view-page .lms-study-unit-toggle em {
  font-style: normal !important;
  color: #667085 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.course-view-page .lms-study-unit-lessons {
  display: grid !important;
  gap: 8px !important;
}

.course-view-page .lms-curriculum-lesson-group {
  display: grid !important;
  gap: 6px !important;
}

.course-view-page .lms-playlist-lesson {
  width: 100% !important;
  border: 1px solid #eee7dc !important;
  background: #fff !important;
  border-radius: 14px !important;
  padding: 10px !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  text-align: right !important;
  transition: .18s ease !important;
}

.course-view-page .lms-playlist-lesson:hover,
.course-view-page .lms-playlist-lesson.active {
  border-color: #c79234 !important;
  background: #fffaf0 !important;
  box-shadow: inset 3px 0 #c79234 !important;
}

.course-view-page .lms-lesson-state {
  width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  display: inline-grid !important;
  place-items: center !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  background: #f2eadc !important;
  color: #9b6b1d !important;
}

.course-view-page .lms-lesson-state.done {
  background: #e8f4ed !important;
  color: #1f7a4d !important;
}

.course-view-page .lms-lesson-state.current,
.course-view-page .lms-lesson-state.progress {
  background: #173b2c !important;
  color: #fff !important;
}

.course-view-page .lms-lesson-state.locked {
  background: #f1f3f5 !important;
  color: #98a2b3 !important;
}

.course-view-page .lms-playlist-lesson b {
  display: block !important;
  color: #173b2c !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.course-view-page .lms-playlist-lesson small {
  display: block !important;
  color: #667085 !important;
  font-size: 11px !important;
  line-height: 1.6 !important;
  margin-top: 2px !important;
}

.course-view-page .lms-sidebar-lesson-content {
  display: none !important;
}

.course-view-page .lms-study-stats {
  display: grid !important;
  gap: 12px !important;
}

.course-view-page .lms-side-box,
.course-view-page .lms-certificate-card {
  padding: 16px !important;
}

.course-view-page .lms-side-box > strong,
.course-view-page .lms-certificate-card > strong {
  color: #173b2c !important;
  font-size: 16px !important;
  margin-bottom: 10px !important;
}

.course-view-page .lms-side-box > div {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}

.course-view-page .lms-side-box span {
  background: #fbf7ef !important;
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  padding: 12px 8px !important;
  text-align: center !important;
  color: #173b2c !important;
  font-weight: 900 !important;
  font-size: 13px !important;
}

.course-view-page .lms-certificate-card p {
  color: #667085 !important;
  line-height: 1.8 !important;
  margin: 8px 0 12px !important;
}

.course-view-page .lms-course-hero-meta span {
  background: #f7f3ea !important;
  border: 1px solid #eee7dc !important;
  color: #173b2c !important;
}

.course-view-page .lms-lesson-facts span:has(b:empty) {
  display: none !important;
}

/* إزالة أي بلوك صعوبة متبقّي بصريًا */
.course-view-page .lms-lesson-facts span:first-child:has(+ span) {
  /* لا نحذف أول عنصر عشوائيًا، الحذف الأساسي تم من JS */
}

@media (max-width: 1100px) {
  .course-view-page .lms-study-grid {
    grid-template-columns: 1fr !important;
  }

  .course-view-page .lms-study-nav,
  .course-view-page .lms-study-stats {
    position: static !important;
  }

  .course-view-page .lms-study-stats {
    order: 3 !important;
  }

  .course-view-page .lms-study-main {
    order: 2 !important;
  }

  .course-view-page .lms-study-nav {
    order: 1 !important;
  }
}

/* ===== Force modern course page layout: right sidebar + main content ===== */
.course-view-page .lms-study-grid {
  display: grid !important;
  grid-template-columns: 310px minmax(0, 1fr) !important;
  grid-template-areas:
    "side main"
    "stats main" !important;
  gap: 16px !important;
  align-items: start !important;
  direction: rtl !important;
}

.course-view-page .lms-study-nav {
  grid-area: side !important;
  order: unset !important;
  position: sticky !important;
  top: 12px !important;
  max-height: calc(100vh - 120px) !important;
  overflow: auto !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.course-view-page .lms-study-main {
  grid-area: main !important;
  order: unset !important;
  min-width: 0 !important;
}

.course-view-page .lms-study-stats {
  grid-area: stats !important;
  order: unset !important;
  position: sticky !important;
  top: 420px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* كروت الجانب */
.course-view-page .lms-study-nav-head,
.course-view-page .lms-study-unit,
.course-view-page .lms-final-exams,
.course-view-page .lms-side-box,
.course-view-page .lms-certificate-card {
  background: #fff !important;
  border: 1px solid #e8dfcf !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 30px rgba(24,61,47,.055) !important;
}

/* إخفاء تفاصيل الفيديوهات الصغيرة تحت كل درس في القائمة الجانبية لتبقى بسيطة */
.course-view-page .lms-sidebar-lesson-content {
  display: none !important;
}

/* الدروس داخل محتوى الدورة */
.course-view-page .lms-study-unit {
  padding: 10px !important;
  display: grid !important;
  gap: 8px !important;
}

.course-view-page .lms-study-unit-toggle {
  background: #fbf7ef !important;
  border-radius: 14px !important;
  padding: 12px !important;
}

.course-view-page .lms-playlist-lesson {
  border-radius: 14px !important;
  padding: 10px !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
}

.course-view-page .lms-playlist-lesson.active,
.course-view-page .lms-playlist-lesson:hover {
  background: #fffaf0 !important;
  border-color: #c79234 !important;
  box-shadow: inset 3px 0 #c79234 !important;
}

/* إحصائيات الدورة */
.course-view-page .lms-side-box,
.course-view-page .lms-certificate-card {
  padding: 14px !important;
}

.course-view-page .lms-side-box > div {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}

.course-view-page .lms-side-box span {
  background: #fbf7ef !important;
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  padding: 12px 8px !important;
  text-align: center !important;
  font-weight: 900 !important;
  color: #173b2c !important;
}

/* حقائق الدرس: نوع الدرس + المدة فقط */
.course-view-page .lms-lesson-facts,
.course-view-page .clean-lesson-facts {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.course-view-page .lms-lesson-facts span {
  background: #fffdf8 !important;
  border: 1px solid #eee7dc !important;
  border-radius: 12px !important;
  padding: 10px !important;
  text-align: center !important;
}

.course-view-page .lms-lesson-facts small {
  display: block !important;
  color: #667085 !important;
  font-size: 12px !important;
  margin-bottom: 4px !important;
}

.course-view-page .lms-lesson-facts b {
  color: #173b2c !important;
  font-size: 14px !important;
}

/* أي عنصر صعوبة اتبقى من CSS/HTML قديم */
.course-view-page .lms-lesson-facts span:has(small):has(b) {
  visibility: visible;
}

@media (max-width: 1100px) {
  .course-view-page .lms-study-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "side"
      "main"
      "stats" !important;
  }

  .course-view-page .lms-study-nav,
  .course-view-page .lms-study-stats {
    position: static !important;
    max-height: none !important;
  }
}

/* ===== MOBILE ONLY: fix dashboard sidebar drawer + course page overflow ===== */
@media (max-width: 900px) {
  html,
  body,
  #app {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .global-app-shell,
  #globalRouteMount,
  .dashboard-layout,
  .app-shell,
  .dashboard-shell,
  .lms-page,
  .lms-study,
  .course-view-page {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* السايدبار يبقى Drawer فوق الصفحة وليس جزء من عرض الصفحة */
  .sidebar,
  .dashboard-sidebar,
  aside.sidebar,
  aside.dashboard-sidebar {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;

    width: min(82vw, 320px) !important;
    max-width: 320px !important;
    height: 100vh !important;

    z-index: 100000 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;

    transform: translateX(110%) !important;
    transition: transform .25s ease !important;

    box-shadow: -18px 0 40px rgba(0,0,0,.22) !important;
  }

  body.sidebar-open .sidebar,
  body.sidebar-open .dashboard-sidebar,
  body.sidebar-open aside.sidebar,
  body.sidebar-open aside.dashboard-sidebar,
  .sidebar.is-open,
  .dashboard-sidebar.is-open,
  aside.sidebar.is-open,
  aside.dashboard-sidebar.is-open {
    transform: translateX(0) !important;
  }

  /* طبقة إغلاق خفيفة */
  body.sidebar-open::after {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,.35) !important;
    z-index: 99990 !important;
  }

  body.sidebar-open .sidebar,
  body.sidebar-open .dashboard-sidebar,
  body.sidebar-open aside.sidebar,
  body.sidebar-open aside.dashboard-sidebar {
    z-index: 100000 !important;
  }

  /* المحتوى لا يتزق جنب السايدبار */
  .main-panel,
  .dashboard-main,
  .content,
  .pro-content {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-inline: 12px !important;
    overflow-x: hidden !important;
  }

  /* زر فتح السايدبار */
  .dashboard-drawer-float,
  #sidebarDrawerToggle {
    position: fixed !important;
    top: 142px !important;
    right: 12px !important;
    z-index: 99980 !important;

    width: 46px !important;
    height: 46px !important;
    border-radius: 14px !important;

    background: #173d2d !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    box-shadow: 0 12px 26px rgba(0,0,0,.18) !important;
  }

  /* صفحة الكورس نفسها: عمود واحد فقط */
  .course-view-page .lms-course-hero,
  .course-view-page .lms-study-grid,
  .course-view-page .lms-study,
  .course-view-page .lms-study-main,
  .course-view-page .lms-study-nav,
  .course-view-page .lms-study-stats {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .course-view-page .lms-course-hero {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 14px !important;
  }

  .course-view-page .lms-course-hero-cover {
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
    min-height: 0 !important;
    border-radius: 16px !important;
  }

  .course-view-page .lms-study-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
  }

  .course-view-page .lms-study-nav {
    order: 1 !important;
    position: static !important;
    max-height: none !important;
  }

  .course-view-page .lms-study-main {
    order: 2 !important;
  }

  .course-view-page .lms-study-stats {
    order: 3 !important;
    position: static !important;
  }

  .course-view-page .lesson-player-card,
  .course-view-page .lms-lesson-section,
  .course-view-page .lms-study-tabs,
  .course-view-page iframe,
  .course-view-page video,
  .course-view-page .youtube-player,
  .course-view-page .lms-video-frame {
    max-width: 100% !important;
  }

  .course-view-page iframe,
  .course-view-page video,
  .course-view-page .youtube-player,
  .course-view-page .lms-video-frame {
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
    border-radius: 14px !important;
  }

  /* منع أي Grid قديم يعمل أعمدة جانبية على الموبايل */
  .course-view-page [style*="grid-template-columns"] {
    max-width: 100% !important;
  }

  .course-view-page .lms-lesson-facts,
  .course-view-page .clean-lesson-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 430px) {
  .sidebar,
  .dashboard-sidebar,
  aside.sidebar,
  aside.dashboard-sidebar {
    width: 84vw !important;
  }

  .dashboard-drawer-float,
  #sidebarDrawerToggle {
    top: 132px !important;
    right: 10px !important;
    width: 44px !important;
    height: 44px !important;
  }

  .course-view-page .lms-study-tabs {
    overflow-x: auto !important;
    white-space: nowrap !important;
  }

  .course-view-page .lms-study-tabs button {
    min-width: max-content !important;
  }
}

/* ===== Force modern course page layout: right sidebar + main content ===== */
.course-view-page .lms-study-grid {
  display: grid !important;
  grid-template-columns: 310px minmax(0, 1fr) !important;
  grid-template-areas:
    "side main"
    "stats main" !important;
  gap: 16px !important;
  align-items: start !important;
  direction: rtl !important;
}

.course-view-page .lms-study-nav {
  grid-area: side !important;
  order: unset !important;
  position: sticky !important;
  top: 12px !important;
  max-height: calc(100vh - 120px) !important;
  overflow: auto !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.course-view-page .lms-study-main {
  grid-area: main !important;
  order: unset !important;
  min-width: 0 !important;
}

.course-view-page .lms-study-stats {
  grid-area: stats !important;
  order: unset !important;
  position: sticky !important;
  top: 420px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* كروت الجانب */
.course-view-page .lms-study-nav-head,
.course-view-page .lms-study-unit,
.course-view-page .lms-final-exams,
.course-view-page .lms-side-box,
.course-view-page .lms-certificate-card {
  background: #fff !important;
  border: 1px solid #e8dfcf !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 30px rgba(24,61,47,.055) !important;
}

/* إخفاء تفاصيل الفيديوهات الصغيرة تحت كل درس في القائمة الجانبية لتبقى بسيطة */
.course-view-page .lms-sidebar-lesson-content {
  display: none !important;
}

/* الدروس داخل محتوى الدورة */
.course-view-page .lms-study-unit {
  padding: 10px !important;
  display: grid !important;
  gap: 8px !important;
}

.course-view-page .lms-study-unit-toggle {
  background: #fbf7ef !important;
  border-radius: 14px !important;
  padding: 12px !important;
}

.course-view-page .lms-playlist-lesson {
  border-radius: 14px !important;
  padding: 10px !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
}

.course-view-page .lms-playlist-lesson.active,
.course-view-page .lms-playlist-lesson:hover {
  background: #fffaf0 !important;
  border-color: #c79234 !important;
  box-shadow: inset 3px 0 #c79234 !important;
}

/* إحصائيات الدورة */
.course-view-page .lms-side-box,
.course-view-page .lms-certificate-card {
  padding: 14px !important;
}

.course-view-page .lms-side-box > div {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}

.course-view-page .lms-side-box span {
  background: #fbf7ef !important;
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  padding: 12px 8px !important;
  text-align: center !important;
  font-weight: 900 !important;
  color: #173b2c !important;
}

/* حقائق الدرس: نوع الدرس + المدة فقط */
.course-view-page .lms-lesson-facts,
.course-view-page .clean-lesson-facts {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.course-view-page .lms-lesson-facts span {
  background: #fffdf8 !important;
  border: 1px solid #eee7dc !important;
  border-radius: 12px !important;
  padding: 10px !important;
  text-align: center !important;
}

.course-view-page .lms-lesson-facts small {
  display: block !important;
  color: #667085 !important;
  font-size: 12px !important;
  margin-bottom: 4px !important;
}

.course-view-page .lms-lesson-facts b {
  color: #173b2c !important;
  font-size: 14px !important;
}

/* أي عنصر صعوبة اتبقى من CSS/HTML قديم */
.course-view-page .lms-lesson-facts span:has(small):has(b) {
  visibility: visible;
}

@media (max-width: 1100px) {
  .course-view-page .lms-study-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "side"
      "main"
      "stats" !important;
  }

  .course-view-page .lms-study-nav,
  .course-view-page .lms-study-stats {
    position: static !important;
    max-height: none !important;
  }
}

/* ===== FINAL CLEAN: course page layout - main + right sidebar only ===== */
.course-view-page .lms-study-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 300px !important;
  grid-template-areas:
    "main side"
    "main stats" !important;
  gap: 16px !important;
  align-items: start !important;
  direction: ltr !important;
}

.course-view-page .lms-study-grid > * {
  direction: rtl !important;
}

.course-view-page .lms-study-main {
  grid-area: main !important;
  min-width: 0 !important;
  width: 100% !important;
  order: unset !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.course-view-page .lms-study-nav {
  grid-area: side !important;
  order: unset !important;
  width: 100% !important;
  max-height: none !important;
  position: sticky !important;
  top: 12px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.course-view-page .lms-study-stats {
  grid-area: stats !important;
  order: unset !important;
  width: 100% !important;
  position: sticky !important;
  top: 470px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* منع العمود الشمال القديم نهائيًا */
.course-view-page .lms-study-stats {
  margin: 0 !important;
}

/* تبسيط كروت السايدبار */
.course-view-page .lms-study-nav > .lms-button {
  width: 100% !important;
  height: 46px !important;
  border-radius: 14px !important;
  background: #f2eadc !important;
  color: #173b2c !important;
  box-shadow: none !important;
  margin-bottom: 10px !important;
}

.course-view-page .lms-study-nav-head,
.course-view-page .lms-study-unit,
.course-view-page .lms-final-exams,
.course-view-page .lms-side-box,
.course-view-page .lms-certificate-card {
  background: #fff !important;
  border: 1px solid #e8dfcf !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 30px rgba(24,61,47,.055) !important;
}

.course-view-page .lms-study-nav-head {
  padding: 14px !important;
  margin-bottom: 10px !important;
}

.course-view-page .lms-study-nav-head h3 {
  margin: 0 0 4px !important;
  font-size: 17px !important;
  color: #173b2c !important;
}

.course-view-page .lms-study-nav-head small {
  color: #667085 !important;
  font-size: 12px !important;
}

.course-view-page .lms-study-unit,
.course-view-page .lms-final-exams {
  padding: 10px !important;
  margin-bottom: 10px !important;
}

.course-view-page .lms-study-unit-toggle {
  width: 100% !important;
  background: #fbf7ef !important;
  border: 0 !important;
  border-radius: 14px !important;
  padding: 11px 12px !important;
  color: #173b2c !important;
  font-weight: 900 !important;
}

.course-view-page .lms-playlist-lesson {
  width: 100% !important;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  gap: 9px !important;
  padding: 9px !important;
  border-radius: 13px !important;
}

.course-view-page .lms-playlist-lesson b {
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.course-view-page .lms-playlist-lesson small {
  font-size: 10.5px !important;
  line-height: 1.5 !important;
}

/* إحصائيات الدورة تحت السايدبار بدل العمود الشمال */
.course-view-page .lms-side-box,
.course-view-page .lms-certificate-card {
  padding: 14px !important;
  margin-bottom: 10px !important;
}

.course-view-page .lms-side-box > div {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}

.course-view-page .lms-side-box span {
  background: #fbf7ef !important;
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  padding: 10px 8px !important;
  text-align: center !important;
  color: #173b2c !important;
  font-weight: 900 !important;
  font-size: 12px !important;
}

/* تصغير جزء معلومات الدرس */
.course-view-page .lms-current-lesson-info h2 {
  font-size: 28px !important;
}

.course-view-page .lms-lesson-facts,
.course-view-page .clean-lesson-facts {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

/* الموبايل */
@media (max-width: 1100px) {
  .course-view-page .lms-study-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "side"
      "main"
      "stats" !important;
    direction: rtl !important;
  }

  .course-view-page .lms-study-nav,
  .course-view-page .lms-study-stats {
    position: static !important;
    top: auto !important;
  }
}

/* ===== FINAL COURSE PAGE UI CLEANUP ===== */

/* إخفاء كارت التقدم المنفصل اللي كان ظاهر في أقصى الشمال فوق */
.course-view-page .lms-course-hero-progress {
  display: none !important;
}

/* الهيرو يبقى صورة + بيانات فقط بدون عمود ثالث */
.course-view-page .lms-course-hero {
  grid-template-columns: 330px minmax(0, 1fr) !important;
  gap: 22px !important;
  align-items: center !important;
}

.course-view-page .lms-course-hero-cover {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 38px rgba(24,61,47,.12) !important;
}

.course-view-page .lms-course-hero-info h1 {
  font-size: 34px !important;
  margin-bottom: 8px !important;
}

.course-view-page .lms-course-hero-info p {
  margin-bottom: 12px !important;
}

/* الصفحة عمودين فقط: المحتوى الرئيسي + سايدبار يمين */
.course-view-page .lms-study-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 300px !important;
  grid-template-areas:
    "main side"
    "main stats" !important;
  gap: 16px !important;
  align-items: start !important;
  direction: ltr !important;
}

.course-view-page .lms-study-grid > * {
  direction: rtl !important;
}

.course-view-page .lms-study-main {
  grid-area: main !important;
  width: 100% !important;
  min-width: 0 !important;
  order: unset !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.course-view-page .lms-study-nav {
  grid-area: side !important;
  width: 100% !important;
  order: unset !important;
  position: sticky !important;
  top: 12px !important;
  max-height: calc(100vh - 120px) !important;
  overflow: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.course-view-page .lms-study-stats {
  grid-area: stats !important;
  width: 100% !important;
  order: unset !important;
  position: sticky !important;
  top: 420px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* كروت السايدبار */
.course-view-page .lms-study-nav > .lms-button {
  width: 100% !important;
  height: 46px !important;
  margin-bottom: 10px !important;
  border-radius: 14px !important;
  background: #f2eadc !important;
  color: #173b2c !important;
  box-shadow: none !important;
}

.course-view-page .lms-study-nav-head,
.course-view-page .lms-study-unit,
.course-view-page .lms-final-exams,
.course-view-page .lms-side-box,
.course-view-page .lms-certificate-card {
  background: #fff !important;
  border: 1px solid #e8dfcf !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 30px rgba(24,61,47,.055) !important;
}

.course-view-page .lms-study-nav-head {
  padding: 14px !important;
  margin-bottom: 10px !important;
}

.course-view-page .lms-study-nav-head h3 {
  margin: 0 0 4px !important;
  font-size: 17px !important;
  color: #173b2c !important;
}

.course-view-page .lms-study-nav-head small {
  color: #667085 !important;
  font-size: 12px !important;
}

/* الوحدات والدروس في السايدبار */
.course-view-page .lms-study-unit,
.course-view-page .lms-final-exams {
  padding: 10px !important;
  margin-bottom: 10px !important;
}

.course-view-page .lms-study-unit-toggle {
  width: 100% !important;
  background: #fbf7ef !important;
  border: 0 !important;
  border-radius: 14px !important;
  padding: 11px 12px !important;
  color: #173b2c !important;
  font-weight: 900 !important;
}

.course-view-page .lms-playlist-lesson {
  width: 100% !important;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  gap: 9px !important;
  padding: 9px !important;
  border-radius: 13px !important;
}

.course-view-page .lms-playlist-lesson.active,
.course-view-page .lms-playlist-lesson:hover {
  background: #fffaf0 !important;
  border-color: #c79234 !important;
  box-shadow: inset 3px 0 #c79234 !important;
}

.course-view-page .lms-playlist-lesson b {
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.course-view-page .lms-playlist-lesson small {
  font-size: 10.5px !important;
  line-height: 1.5 !important;
}

/* نخفي تفاصيل الفيديوهات الصغيرة داخل السايدبار عشان يبقى بسيط */
.course-view-page .lms-sidebar-lesson-content {
  display: none !important;
}

/* إحصائيات الدورة تحت السايدبار */
.course-view-page .lms-side-box,
.course-view-page .lms-certificate-card {
  padding: 14px !important;
  margin-bottom: 10px !important;
}

.course-view-page .lms-side-box > div {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}

.course-view-page .lms-side-box span {
  background: #fbf7ef !important;
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  padding: 10px 8px !important;
  text-align: center !important;
  color: #173b2c !important;
  font-weight: 900 !important;
  font-size: 12px !important;
}

/* منطقة الدرس الحالية */
.course-view-page .lms-lesson-player-layout {
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr) !important;
  gap: 16px !important;
  align-items: start !important;
}

.course-view-page .lms-player {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}

.course-view-page .lms-current-lesson-info {
  gap: 10px !important;
}

.course-view-page .lms-current-lesson-info h2 {
  font-size: 28px !important;
  line-height: 1.25 !important;
}

.course-view-page .lms-current-lesson-info p {
  line-height: 1.7 !important;
}

/* حقائق الدرس: نوع + مدة فقط */
.course-view-page .lms-lesson-facts,
.course-view-page .clean-lesson-facts {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  padding: 10px !important;
  background: #fffdf8 !important;
}

.course-view-page .lms-lesson-facts span {
  background: #fff !important;
  border: 1px solid #eee7dc !important;
  border-radius: 12px !important;
  padding: 10px !important;
  text-align: center !important;
}

.course-view-page .lms-lesson-facts small {
  display: block !important;
  color: #667085 !important;
  font-size: 12px !important;
  margin-bottom: 4px !important;
}

.course-view-page .lms-lesson-facts b {
  color: #173b2c !important;
  font-size: 14px !important;
}

/* الموبايل */
@media (max-width: 1100px) {
  .course-view-page .lms-course-hero {
    grid-template-columns: 1fr !important;
  }

  .course-view-page .lms-study-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "side"
      "main"
      "stats" !important;
    direction: rtl !important;
  }

  .course-view-page .lms-study-nav,
  .course-view-page .lms-study-stats {
    position: static !important;
    max-height: none !important;
    top: auto !important;
  }

  .course-view-page .lms-lesson-player-layout {
    grid-template-columns: 1fr !important;
  }
}

/* ===== Course page final cleanup: progress back + cleaner hero/actions ===== */

/* رجّع تقدم الكورس بشكل أنيق */
.course-view-page .lms-course-hero-progress {
  display: grid !important;
  min-width: 120px !important;
  max-width: 140px !important;
  padding: 12px !important;
  border-radius: 18px !important;
  background: #fffdf8 !important;
  border: 1px solid #eee7dc !important;
  box-shadow: 0 12px 28px rgba(24,61,47,.06) !important;
  text-align: center !important;
  gap: 7px !important;
}

.course-view-page .lms-course-hero-progress strong {
  font-size: 26px !important;
  color: #173b2c !important;
  line-height: 1 !important;
}

.course-view-page .lms-course-hero-progress em {
  font-style: normal !important;
  color: #c79234 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

/* الهيرو: صورة + بيانات + تقدم */
.course-view-page .lms-course-hero {
  grid-template-columns: 320px minmax(0, 1fr) 130px !important;
  gap: 20px !important;
  align-items: center !important;
}

/* زر استكمال التعلم يكون واضح، والرموز الجانبية تختفي */
.course-view-page .lms-course-hero-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

.course-view-page .lms-course-hero-actions .lms-button,
.course-view-page .lms-course-hero-actions a.lms-button {
  min-width: 170px !important;
  height: 46px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}

/* إخفاء الرمزين اللي جنب استكمال التعلم لو ملهمش وظيفة واضحة */
.course-view-page .lms-course-hero-actions button:not(.lms-button),
.course-view-page .lms-course-hero-actions a:not(.lms-button) {
  display: none !important;
}

/* حذف أي meta فاضية أو صغيرة غريبة */
.course-view-page .lms-course-hero-meta span:empty {
  display: none !important;
}

/* حقائق الدرس: مدة فقط */
.course-view-page .lms-lesson-facts.single-lesson-fact,
.course-view-page .clean-lesson-facts.single-lesson-fact {
  display: grid !important;
  grid-template-columns: 1fr !important;
  max-width: 220px !important;
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  padding: 10px !important;
  background: #fffdf8 !important;
}

.course-view-page .lms-lesson-facts.single-lesson-fact span {
  background: #fff !important;
  border: 1px solid #eee7dc !important;
  border-radius: 12px !important;
  padding: 10px !important;
  text-align: center !important;
}

/* ترتيب الصفحة: سايدبار يمين + محتوى */
.course-view-page .lms-study-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 300px !important;
  grid-template-areas:
    "main side"
    "main stats" !important;
  gap: 16px !important;
  direction: ltr !important;
  align-items: start !important;
}

.course-view-page .lms-study-grid > * {
  direction: rtl !important;
}

.course-view-page .lms-study-main {
  grid-area: main !important;
}

.course-view-page .lms-study-nav {
  grid-area: side !important;
}

.course-view-page .lms-study-stats {
  grid-area: stats !important;
}

/* الموبايل */
@media (max-width: 1100px) {
  .course-view-page .lms-course-hero {
    grid-template-columns: 1fr !important;
  }

  .course-view-page .lms-course-hero-progress {
    max-width: none !important;
    width: 100% !important;
  }

  .course-view-page .lms-study-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "side"
      "main"
      "stats" !important;
    direction: rtl !important;
  }
}

/* ===== Course cleanup after YouTube tracking ===== */

/* رجوع تقدم الكورس في الهيرو */
.course-view-page .lms-course-hero-progress {
  display: grid !important;
  min-width: 118px !important;
  max-width: 138px !important;
  padding: 12px !important;
  border-radius: 18px !important;
  background: #fffdf8 !important;
  border: 1px solid #eee7dc !important;
  box-shadow: 0 12px 28px rgba(24,61,47,.06) !important;
  text-align: center !important;
  gap: 7px !important;
}

.course-view-page .lms-course-hero-progress strong {
  font-size: 26px !important;
  color: #173b2c !important;
  line-height: 1 !important;
}

.course-view-page .lms-course-hero-progress em {
  font-style: normal !important;
  color: #c79234 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

/* الهيرو: صورة + بيانات + تقدم */
.course-view-page .lms-course-hero {
  grid-template-columns: 320px minmax(0, 1fr) 130px !important;
  gap: 20px !important;
  align-items: center !important;
}

/* زر استكمال التعلم واضح، والرموز الصغيرة تتشال */
.course-view-page .lms-course-hero-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

.course-view-page .lms-course-hero-actions .lms-button,
.course-view-page .lms-course-hero-actions a.lms-button {
  min-width: 170px !important;
  height: 46px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}

/* إخفاء رموز القلب/المشاركة أو أي أزرار صغيرة جنب استكمال التعلم */
.course-view-page .lms-course-hero-actions button:not(.lms-button),
.course-view-page .lms-course-hero-actions a:not(.lms-button) {
  display: none !important;
}

/* مدة الحصة فقط */
.course-view-page .lms-lesson-facts.single-lesson-fact,
.course-view-page .clean-lesson-facts.single-lesson-fact {
  display: grid !important;
  grid-template-columns: 1fr !important;
  max-width: 220px !important;
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  padding: 10px !important;
  background: #fffdf8 !important;
}

.course-view-page .lms-lesson-facts.single-lesson-fact span {
  background: #fff !important;
  border: 1px solid #eee7dc !important;
  border-radius: 12px !important;
  padding: 10px !important;
  text-align: center !important;
}

/* عمودين فقط: محتوى + سايدبار */
.course-view-page .lms-study-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 300px !important;
  grid-template-areas:
    "main side"
    "main stats" !important;
  gap: 16px !important;
  direction: ltr !important;
  align-items: start !important;
}

.course-view-page .lms-study-grid > * {
  direction: rtl !important;
}

.course-view-page .lms-study-main {
  grid-area: main !important;
}

.course-view-page .lms-study-nav {
  grid-area: side !important;
}

.course-view-page .lms-study-stats {
  grid-area: stats !important;
}

/* الموبايل */
@media (max-width: 1100px) {
  .course-view-page .lms-course-hero {
    grid-template-columns: 1fr !important;
  }

  .course-view-page .lms-course-hero-progress {
    max-width: none !important;
    width: 100% !important;
  }

  .course-view-page .lms-study-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "side"
      "main"
      "stats" !important;
    direction: rtl !important;
  }
}

/* ===== Course hero: duration + continue learning cleanup ===== */

/* ترتيب بيانات الكورس وزر استكمال التعلم */
.course-view-page .lms-course-hero-info {
  display: grid !important;
  gap: 10px !important;
}

.course-view-page .lms-course-hero-meta {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin: 4px 0 0 !important;
}

.course-view-page .lms-course-hero-meta span,
.course-view-page .lms-course-hero-meta [data-course-total-duration] {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: 6px 12px !important;
  border-radius: 999px !important;
  background: #f7f0e4 !important;
  border: 1px solid #eadfce !important;
  color: #173b2c !important;
  font-weight: 900 !important;
  font-size: 12px !important;
}

/* زر استكمال التعلم جنب البيانات مش تحت لوحده */
.course-view-page .lms-course-hero-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  margin-top: 2px !important;
  flex-wrap: wrap !important;
}

.course-view-page .lms-course-hero-actions .lms-button,
.course-view-page .lms-course-hero-actions a.lms-button,
.course-view-page .lms-course-hero-actions button.lms-button {
  min-width: 170px !important;
  height: 42px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  background: #c9932e !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(201,147,46,.18) !important;
}

/* حذف الرموز الصغيرة اللي جنب استكمال التعلم */
.course-view-page .lms-course-hero-actions button:not(.lms-button),
.course-view-page .lms-course-hero-actions a:not(.lms-button),
.course-view-page .lms-course-hero-actions .lms-icon-button,
.course-view-page .lms-course-hero-actions .icon-button {
  display: none !important;
}

/* لو لسه فيه زرار أيقونة بدون كلاس واضح */
.course-view-page .lms-course-hero-actions > *:not(.lms-button):not(a.lms-button):not(button.lms-button) {
  display: none !important;
}

/* الهيرو متوازن */
.course-view-page .lms-course-hero {
  grid-template-columns: 320px minmax(0, 1fr) 130px !important;
  gap: 20px !important;
  align-items: center !important;
}

.course-view-page .lms-course-hero-progress {
  display: grid !important;
}

/* موبايل */
@media (max-width: 1100px) {
  .course-view-page .lms-course-hero {
    grid-template-columns: 1fr !important;
  }

  .course-view-page .lms-course-hero-actions .lms-button {
    width: 100% !important;
  }
}

/* ===== Emergency fix: hide broken hero icons and keep only continue button ===== */
.course-view-page .lms-course-hero-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

/* نخفي أي زر صغير أو أيقونة في الهيرو */
.course-view-page .lms-course-hero-actions .lms-icon-button,
.course-view-page .lms-course-hero-actions .icon-button,
.course-view-page .lms-course-hero-actions button[aria-label],
.course-view-page .lms-course-hero-actions a[aria-label],
.course-view-page .lms-course-hero-actions > button:not([data-continue-learning]),
.course-view-page .lms-course-hero-actions > a:not([data-continue-learning]) {
  display: none !important;
}

/* نُظهر زر استكمال التعلم فقط */
.course-view-page .lms-course-hero-actions .lms-button,
.course-view-page .lms-course-hero-actions button.lms-button,
.course-view-page .lms-course-hero-actions a.lms-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 170px !important;
  height: 42px !important;
  border-radius: 999px !important;
  background: #c9932e !important;
  color: #fff !important;
  font-weight: 900 !important;
}

/* لو الأيقونات واخدة نفس كلاس lms-button، نخفي الزرار اللي نصه قصير جدًا بصريًا */
.course-view-page .lms-course-hero-actions > .lms-button:not(:first-child) {
  display: none !important;
}

/* ===== Show lesson child items under each lesson in course sidebar ===== */
.course-view-page .lms-sidebar-lesson-content {
  display: grid !important;
  gap: 6px !important;
  margin: 6px 0 10px !important;
  padding-inline-start: 10px !important;
}

.course-view-page .lms-sidebar-content-row,
.course-view-page .lms-student-exam-action.lesson {
  display: grid !important;
  grid-template-columns: 26px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 10px !important;
  border-radius: 12px !important;
  background: #fffdf7 !important;
  border: 1px solid #eee3d1 !important;
}

.course-view-page .lms-sidebar-content-row b,
.course-view-page .lms-student-exam-action.lesson strong {
  font-size: 12px !important;
  color: #173b2c !important;
  line-height: 1.45 !important;
}

.course-view-page .lms-sidebar-content-row small,
.course-view-page .lms-student-exam-action.lesson small,
.course-view-page .lms-student-exam-action.lesson em {
  font-size: 10px !important;
  color: #667085 !important;
}

.course-view-page .lms-student-exam-action.lesson button {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  height: 34px !important;
  border-radius: 10px !important;
}

/* ===== Course progress and completed button fixes ===== */
.course-view-page .lms-course-hero-progress {
  display: grid !important;
}

.course-view-page [data-course-title-pill] {
  background: #eef8f2 !important;
  color: #173b2c !important;
  border-color: #d9efe3 !important;
}

.course-view-page [data-complete-video].is-completed,
.course-view-page [data-complete-video]:disabled {
  opacity: 1 !important;
  cursor: not-allowed !important;
  background: #173b2c !important;
  color: #fff !important;
  border-color: #173b2c !important;
}

.course-view-page [data-complete-video].is-completed::before {
  content: "✓ ";
}

/* ===== Better unit/final exam cards in course sidebar ===== */
.course-view-page .lms-student-exam-action.unit,
.course-view-page .lms-student-exam-action.final {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px !important;
  border-radius: 16px !important;
  background: #fffaf0 !important;
  border: 1px solid #ead7b6 !important;
  box-shadow: 0 8px 20px rgba(24,61,47,.045) !important;
  overflow: hidden !important;
}

.course-view-page .lms-student-exam-action.unit {
  background: linear-gradient(135deg, #fffaf0, #fffdf8) !important;
  border-color: #e5c98f !important;
}

.course-view-page .lms-student-exam-action.final {
  background: linear-gradient(135deg, #eef6ff, #fffdf8) !important;
  border-color: #cfe2ff !important;
}

.course-view-page .lms-student-exam-action.unit::before {
  content: "اختبار الوحدة" !important;
  grid-column: 1 / -1 !important;
  width: max-content !important;
  padding: 4px 9px !important;
  border-radius: 999px !important;
  background: #fff1cc !important;
  color: #9b6b1d !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}

.course-view-page .lms-student-exam-action.final::before {
  content: "اختبار نهائي" !important;
  grid-column: 1 / -1 !important;
  width: max-content !important;
  padding: 4px 9px !important;
  border-radius: 999px !important;
  background: #e8f1ff !important;
  color: #1d4f8f !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}

.course-view-page .lms-student-exam-action.unit strong,
.course-view-page .lms-student-exam-action.final strong {
  color: #173b2c !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  font-weight: 900 !important;
}

.course-view-page .lms-student-exam-action.unit small,
.course-view-page .lms-student-exam-action.unit em,
.course-view-page .lms-student-exam-action.final small,
.course-view-page .lms-student-exam-action.final em {
  color: #667085 !important;
  font-size: 10.5px !important;
  line-height: 1.5 !important;
}

.course-view-page .lms-student-exam-action.unit button,
.course-view-page .lms-student-exam-action.final button {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  height: 38px !important;
  border-radius: 12px !important;
  background: #173b2c !important;
  color: #fff !important;
  font-weight: 900 !important;
  border: 0 !important;
}

/* خلي اختبار الدرس أنضف وأصغر */
.course-view-page .lms-student-exam-action.lesson {
  background: #fffdf8 !important;
  border-color: #eee3d1 !important;
}

.course-view-page .lms-student-exam-action.lesson button {
  background: #173b2c !important;
  color: #fff !important;
  border: 0 !important;
}

/* ===== Fix course stats cards covering curriculum sidebar ===== */

/* خلي سايدبار المنهج هو اللي ياخد الأولوية */
.course-view-page .lms-study-nav {
  position: sticky !important;
  top: 12px !important;
  max-height: calc(100vh - 120px) !important;
  overflow-y: auto !important;
  padding-bottom: 12px !important;
}

/* إحصائيات الدورة لا تبقى sticky فوق المنهج */
.course-view-page .lms-study-stats {
  position: static !important;
  top: auto !important;
  margin-top: 12px !important;
  z-index: 1 !important;
}

/* تصغير كروت الإحصائيات حتى لا تزاحم السايدبار */
.course-view-page .lms-study-stats .lms-side-box,
.course-view-page .lms-study-stats .lms-certificate-card {
  padding: 12px !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 20px rgba(24,61,47,.045) !important;
}

.course-view-page .lms-study-stats .lms-side-box > strong,
.course-view-page .lms-study-stats .lms-certificate-card > strong {
  font-size: 14px !important;
}

.course-view-page .lms-study-stats .lms-side-box > div {
  grid-template-columns: 1fr 1fr !important;
  gap: 6px !important;
}

.course-view-page .lms-study-stats .lms-side-box span {
  padding: 8px 6px !important;
  font-size: 11px !important;
}

/* كارت الشهادة اختياري ومش ضروري يزاحم المنهج */
@media (max-height: 850px) and (min-width: 1101px) {
  .course-view-page .lms-study-stats .lms-certificate-card {
    display: none !important;
  }
}

/* على الموبايل يظهروا بعد المحتوى مش فوقه */
@media (max-width: 1100px) {
  .course-view-page .lms-study-stats {
    position: static !important;
    margin-top: 14px !important;
  }

  .course-view-page .lms-study-nav {
    position: static !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* ===== Course page: free right sidebar + smart left lesson panel ===== */

/* 1) إلغاء السك्रोल الداخلي للسايدبار اليمين نهائيًا */
.course-view-page .lms-study-nav {
  position: static !important;
  top: auto !important;
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  padding-bottom: 0 !important;
}

/* خلي شبكة الصفحة تتمدد طبيعي مع طول المنهج */
.course-view-page .lms-study-grid {
  align-items: start !important;
}

/* السايدبار اليمين يبقى عمود حر */
.course-view-page .lms-study-nav {
  display: grid !important;
  gap: 10px !important;
}

/* منع أي عنصر داخلي يعمل scroll في السايدبار */
.course-view-page .lms-study-nav *,
.course-view-page .lms-study-unit,
.course-view-page .lms-study-unit-lessons,
.course-view-page .lms-sidebar-lesson-content {
  max-height: none !important;
  overflow: visible !important;
}

/* 2) تنظيم الجزء الشمال جنب الفيديو */
.course-view-page .lms-current-lesson-info {
  display: grid !important;
  align-content: start !important;
  gap: 12px !important;
  padding: 0 !important;
}

/* كارت عنوان الدرس */
.course-view-page .lms-current-lesson-info > .lms-badge,
.course-view-page .lms-current-lesson-info > h2,
.course-view-page .lms-current-lesson-info > p {
  margin-inline: auto !important;
  text-align: center !important;
}

.course-view-page .lms-current-lesson-info h2 {
  font-size: 28px !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  color: #173b2c !important;
}

.course-view-page .lms-current-lesson-info p {
  margin: 0 !important;
  color: #667085 !important;
  font-size: 13px !important;
  line-height: 1.7 !important;
}

/* كارت تقدم الدرس */
.course-view-page .lms-lesson-progress-row {
  background: #fffdf8 !important;
  border: 1px solid #eadfce !important;
  border-radius: 16px !important;
  padding: 12px !important;
  display: grid !important;
  gap: 8px !important;
  box-shadow: 0 8px 20px rgba(24,61,47,.04) !important;
}

.course-view-page .lms-lesson-progress-row small {
  color: #667085 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.course-view-page .lms-lesson-progress-row b {
  color: #173b2c !important;
  font-size: 20px !important;
  font-weight: 900 !important;
}

.course-view-page .lms-lesson-progress-row .lms-progress-line {
  height: 8px !important;
  background: #eee7dc !important;
  border-radius: 999px !important;
  overflow: hidden !important;
}

/* كارت مدة الحصة */
.course-view-page .lms-lesson-facts.single-lesson-fact,
.course-view-page .clean-lesson-facts.single-lesson-fact {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.course-view-page .lms-lesson-facts.single-lesson-fact span {
  width: 100% !important;
  background: #fffdf8 !important;
  border: 1px solid #eadfce !important;
  border-radius: 16px !important;
  padding: 14px 12px !important;
  box-shadow: 0 8px 20px rgba(24,61,47,.04) !important;
}

.course-view-page .lms-lesson-facts.single-lesson-fact small {
  display: block !important;
  color: #667085 !important;
  font-size: 12px !important;
  margin-bottom: 5px !important;
}

.course-view-page .lms-lesson-facts.single-lesson-fact b {
  color: #173b2c !important;
  font-size: 15px !important;
  font-weight: 900 !important;
}

/* 3) تنظيم الإحصائيات والشهادة في الجزء الشمال */
.course-view-page .lms-current-lesson-info .lms-study-stats-inline {
  display: grid !important;
  gap: 10px !important;
  margin-top: 0 !important;
}

.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-side-box,
.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-certificate-card {
  width: 100% !important;
  margin: 0 !important;
  padding: 12px !important;
  border-radius: 16px !important;
  background: #fff !important;
  border: 1px solid #eadfce !important;
  box-shadow: 0 8px 20px rgba(24,61,47,.04) !important;
}

/* عنوان إحصائياتك في الدورة بدل الشكل الأزرق */
.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-side-box > strong {
  display: block !important;
  width: 100% !important;
  background: transparent !important;
  color: #173b2c !important;
  font-size: 14px !important;
  text-align: center !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
}

.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-side-box > div {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 7px !important;
}

.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-side-box span {
  min-height: 42px !important;
  display: grid !important;
  place-items: center !important;
  padding: 8px 6px !important;
  border-radius: 12px !important;
  background: #fbf7ef !important;
  border: 1px solid #eee3d1 !important;
  color: #173b2c !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  text-align: center !important;
}

/* كارت الشهادة أخف وأصغر */
.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-certificate-card > strong {
  display: block !important;
  text-align: center !important;
  font-size: 13px !important;
  color: #173b2c !important;
  margin-bottom: 8px !important;
}

.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-certificate-card p {
  text-align: center !important;
  font-size: 11px !important;
  line-height: 1.7 !important;
  margin: 0 0 10px !important;
  color: #667085 !important;
}

/* 4) تحسين توزيع الفيديو مع عمود المعلومات */
.course-view-page .lms-lesson-player-layout {
  grid-template-columns: minmax(0, 1fr) 300px !important;
  gap: 18px !important;
  align-items: start !important;
}

/* على الشاشات الأصغر يرجع كله تحت بعض */
@media (max-width: 1100px) {
  .course-view-page .lms-lesson-player-layout {
    grid-template-columns: 1fr !important;
  }

  .course-view-page .lms-study-nav {
    position: static !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* DRABOTALEB_USER_CARD_POLISH_V1
   تحسين شكل كارت المستخدم:
   - البيانات في عمود واضح
   - البطاقات الصغيرة تحتها
   - الأكشنز في صف مستقل
*/
.payment-row.user-row {
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) auto auto !important;
  grid-template-areas:
    "avatar info role status"
    "avatar info role status"
    "actions actions actions actions" !important;
  align-items: start !important;
  gap: 12px !important;
  padding: 18px !important;
  border-radius: 20px !important;
  background: #fff !important;
  border: 1px solid #eee4d7 !important;
  box-shadow: 0 12px 28px rgba(24, 61, 47, .05) !important;
}

.payment-row.user-row .pay-avatar {
  grid-area: avatar !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 16px !important;
  display: grid !important;
  place-items: center !important;
  font-weight: 900 !important;
  background: #173d2d !important;
  color: #d9b15f !important;
}

.payment-row.user-row .pay-info {
  grid-area: info !important;
  min-width: 0 !important;
}

.payment-row.user-row .pay-info h4 {
  font-size: 18px !important;
  color: #173d2d !important;
  line-height: 1.45 !important;
}

.payment-row.user-row .pay-meta {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  color: #667085 !important;
}

.payment-row.user-row .role-select {
  min-width: 150px !important;
}

.payment-row.user-row > div:has(.role-select) {
  grid-area: role !important;
  margin: 0 !important;
}

.payment-row.user-row > .status-pill {
  grid-area: status !important;
  margin: 0 !important;
  justify-self: start !important;
}

.payment-row.user-row .pay-actions {
  grid-area: actions !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  padding-top: 12px !important;
  margin-top: 4px !important;
  border-top: 1px dashed #eadfcd !important;
  width: 100% !important;
}

.payment-row.user-row .pay-btn {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  border-radius: 999px !important;
  display: inline-grid !important;
  place-items: center !important;
  text-decoration: none !important;
  font-size: 15px !important;
  font-weight: 900 !important;
}

.payment-row.user-row .pay-btn[title*="الاشتراكات"],
.payment-row.user-row .pay-btn[title*="الدفع"] {
  background: #fff7e6 !important;
  border-color: #ead29b !important;
  color: #8a5a0a !important;
}

.payment-row.user-row .pay-info > div:not(.pay-meta):not(:first-child) {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 10px !important;
}

.payment-row.user-row .pay-info span,
.payment-row.user-row .pay-info .detail-chip,
.payment-row.user-row .pay-info .user-detail-chip {
  max-width: 100% !important;
}

@media (max-width: 900px) {
  .payment-row.user-row {
    grid-template-columns: 48px minmax(0, 1fr) !important;
    grid-template-areas:
      "avatar info"
      "role role"
      "status status"
      "actions actions" !important;
  }

  .payment-row.user-row > div:has(.role-select),
  .payment-row.user-row > .status-pill {
    justify-self: stretch !important;
  }

  .payment-row.user-row .role-select {
    width: 100% !important;
  }
}


/* DRABOTALEB_USER_ACTION_GROUPS_V1 */
.payment-row.user-row .pay-actions.user-actions-split {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
}

.payment-row.user-row .user-action-group {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.payment-row.user-row .user-state-actions {
  justify-content: flex-start !important;
  justify-self: start !important;
}

.payment-row.user-row .user-quick-links {
  justify-content: flex-end !important;
  justify-self: end !important;
}

.payment-row.user-row .user-state-actions .pay-btn,
.payment-row.user-row .user-quick-links .pay-btn {
  margin: 0 !important;
}

@media (max-width: 900px) {
  .payment-row.user-row .pay-actions.user-actions-split {
    grid-template-columns: 1fr !important;
  }

  .payment-row.user-row .user-state-actions,
  .payment-row.user-row .user-quick-links {
    justify-content: center !important;
    justify-self: stretch !important;
  }
}


/* DRABOTALEB_USER_ACTION_GROUPS_V2 */
.payment-row.user-row .pay-actions.user-actions-split {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
}

.payment-row.user-row .user-action-group {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.payment-row.user-row .user-quick-links {
  justify-content: flex-start !important;
  justify-self: start !important;
}

.payment-row.user-row .user-state-actions {
  justify-content: flex-end !important;
  justify-self: end !important;
}

.payment-row.user-row .user-state-actions .pay-btn,
.payment-row.user-row .user-quick-links .pay-btn {
  margin: 0 !important;
}

@media (max-width: 900px) {
  .payment-row.user-row .pay-actions.user-actions-split {
    grid-template-columns: 1fr !important;
  }

  .payment-row.user-row .user-state-actions,
  .payment-row.user-row .user-quick-links {
    justify-content: center !important;
    justify-self: stretch !important;
  }
}

/* ===== Course sidebar child cards: wrapping + indentation + clickable exam cards ===== */

/* محتوى الدرس يبقى متزاح للداخل عشان واضح إنه تابع للدرس */
.course-view-page .lms-sidebar-lesson-content {
  display: grid !important;
  gap: 7px !important;
  margin: 7px 12px 12px 0 !important;
  padding-right: 12px !important;
  border-right: 2px solid #ead7b6 !important;
  overflow: visible !important;
  max-height: none !important;
}

/* أي كارت داخل محتوى الدرس لا يسمح بخروج النص */
.course-view-page .lms-sidebar-content-row,
.course-view-page .lms-student-exam-action.lesson,
.course-view-page .lms-student-exam-action.unit,
.course-view-page .lms-student-exam-action.final {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* بطاقة الفيديو في السايدبار */
.course-view-page .lms-sidebar-content-row {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 10px !important;
  border-radius: 13px !important;
  background: #fffdf8 !important;
  border: 1px solid #eee3d1 !important;
  text-align: right !important;
}

.course-view-page button.lms-sidebar-content-row {
  cursor: pointer !important;
  font: inherit !important;
}

.course-view-page button.lms-sidebar-content-row:hover {
  border-color: #c9932e !important;
  background: #fff8e8 !important;
}

.course-view-page .lms-sidebar-content-row span {
  width: 24px !important;
  height: 24px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: #173b2c !important;
  color: #fff !important;
  font-size: 10px !important;
}

.course-view-page .lms-sidebar-content-row b,
.course-view-page .lms-student-exam-action strong {
  min-width: 0 !important;
  max-width: 100% !important;
  display: block !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  line-height: 1.45 !important;
}

.course-view-page .lms-sidebar-content-row b {
  font-size: 12px !important;
  color: #173b2c !important;
}

.course-view-page .lms-sidebar-content-row small {
  grid-column: 2 !important;
  display: block !important;
  min-width: 0 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  color: #8a8f98 !important;
  font-size: 10px !important;
  line-height: 1.5 !important;
}

/* بطاقة اختبار الدرس: البطاقة كلها قابلة للضغط بدل زر كبير */
.course-view-page .lms-student-exam-action.lesson,
.course-view-page .lms-student-exam-action.unit,
.course-view-page .lms-student-exam-action.final {
  cursor: pointer !important;
  position: relative !important;
}

/* نخلي زر ابدأ صغير كعلامة فقط وليس زر كبير واخد الكارت */
.course-view-page .lms-student-exam-action.lesson button,
.course-view-page .lms-student-exam-action.unit button,
.course-view-page .lms-student-exam-action.final button {
  width: auto !important;
  min-width: 54px !important;
  height: 28px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  justify-self: start !important;
  grid-column: auto !important;
}

/* لو عايزين الزر يبان كـ CTA صغير فقط */
.course-view-page .lms-student-exam-action.lesson button::after,
.course-view-page .lms-student-exam-action.unit button::after,
.course-view-page .lms-student-exam-action.final button::after {
  content: "" !important;
}

/* منع أي title طويل من الخروج خارج كارت الاختبار */
.course-view-page .lms-student-exam-action.lesson *,
.course-view-page .lms-student-exam-action.unit *,
.course-view-page .lms-student-exam-action.final * {
  min-width: 0 !important;
  max-width: 100% !important;
}

/* تحسين المسافة بين الدرس ومحتواه */
.course-view-page .lms-curriculum-lesson-group {
  display: grid !important;
  gap: 4px !important;
}

/* سهم صغير يوحي إن ده محتوى تابع */
.course-view-page .lms-sidebar-lesson-content::before {
  content: "محتوى الدرس" !important;
  color: #9b6b1d !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  margin-bottom: 2px !important;
}

/* ===== Hide start buttons inside course sidebar exam cards only ===== */

/* نخفي زر ابدأ / ابدأ الوحدة من السايدبار فقط */
.course-view-page .lms-study-nav .lms-student-exam-action.lesson button,
.course-view-page .lms-study-nav .lms-student-exam-action.unit button,
.course-view-page .lms-study-nav .lms-student-exam-action.final button {
  display: none !important;
}

/* نخلي البطاقة كلها شكلها clickable وواضح */
.course-view-page .lms-study-nav .lms-student-exam-action.lesson,
.course-view-page .lms-study-nav .lms-student-exam-action.unit,
.course-view-page .lms-study-nav .lms-student-exam-action.final {
  cursor: pointer !important;
  padding: 12px !important;
}

/* نضيف سهم صغير بدل الزر */
.course-view-page .lms-study-nav .lms-student-exam-action.lesson::after,
.course-view-page .lms-study-nav .lms-student-exam-action.unit::after,
.course-view-page .lms-study-nav .lms-student-exam-action.final::after {
  content: "‹" !important;
  position: absolute !important;
  left: 12px !important;
  bottom: 12px !important;
  width: 24px !important;
  height: 24px !important;
  border-radius: 999px !important;
  display: grid !important;
  place-items: center !important;
  background: #173b2c !important;
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 900 !important;
}

/* منع أي مساحة فاضية كانت متروكة للزر */
.course-view-page .lms-study-nav .lms-student-exam-action.lesson,
.course-view-page .lms-study-nav .lms-student-exam-action.unit,
.course-view-page .lms-study-nav .lms-student-exam-action.final {
  grid-template-columns: minmax(0, 1fr) 32px !important;
  align-items: center !important;
}

.course-view-page .lms-study-nav .lms-student-exam-action.lesson strong,
.course-view-page .lms-study-nav .lms-student-exam-action.unit strong,
.course-view-page .lms-study-nav .lms-student-exam-action.final strong {
  padding-inline-end: 4px !important;
}

/* ===== FIX broken exam cards after hiding start buttons ===== */

/* بطاقة الامتحان في سايدبار الكورس ترجع طبيعية ومقروءة */
.course-view-page .lms-study-nav .lms-student-exam-action.lesson,
.course-view-page .lms-study-nav .lms-student-exam-action.unit,
.course-view-page .lms-study-nav .lms-student-exam-action.final {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 34px !important;
  grid-auto-rows: auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px !important;
  min-height: auto !important;
  height: auto !important;
  overflow: hidden !important;
  cursor: pointer !important;
  position: relative !important;
}

/* إلغاء السهم اللي اتضاف وسبب تكسير البطاقة */
.course-view-page .lms-study-nav .lms-student-exam-action.lesson::after,
.course-view-page .lms-study-nav .lms-student-exam-action.unit::after,
.course-view-page .lms-study-nav .lms-student-exam-action.final::after {
  content: none !important;
  display: none !important;
}

/* إخفاء زر ابدأ فقط بدون ترك أثر */
.course-view-page .lms-study-nav .lms-student-exam-action.lesson button,
.course-view-page .lms-study-nav .lms-student-exam-action.unit button,
.course-view-page .lms-study-nav .lms-student-exam-action.final button {
  display: none !important;
}

/* النصوص لا تخرج ولا تتكسر حرف حرف */
.course-view-page .lms-study-nav .lms-student-exam-action.lesson strong,
.course-view-page .lms-study-nav .lms-student-exam-action.unit strong,
.course-view-page .lms-study-nav .lms-student-exam-action.final strong,
.course-view-page .lms-study-nav .lms-student-exam-action.lesson b,
.course-view-page .lms-study-nav .lms-student-exam-action.unit b,
.course-view-page .lms-study-nav .lms-student-exam-action.final b {
  grid-column: 1 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  display: block !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  line-height: 1.55 !important;
  font-size: 12.5px !important;
  color: #173b2c !important;
  text-align: right !important;
}

/* التفاصيل تحت العنوان */
.course-view-page .lms-study-nav .lms-student-exam-action.lesson small,
.course-view-page .lms-study-nav .lms-student-exam-action.unit small,
.course-view-page .lms-study-nav .lms-student-exam-action.final small,
.course-view-page .lms-study-nav .lms-student-exam-action.lesson em,
.course-view-page .lms-study-nav .lms-student-exam-action.unit em,
.course-view-page .lms-study-nav .lms-student-exam-action.final em {
  grid-column: 1 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  display: block !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  line-height: 1.5 !important;
  font-size: 10.5px !important;
  color: #667085 !important;
  text-align: right !important;
}

/* الأيقونة/رمز الامتحان يبقى يمين/شمال البطاقة بشكل ثابت */
.course-view-page .lms-study-nav .lms-student-exam-action.lesson > span,
.course-view-page .lms-study-nav .lms-student-exam-action.unit > span,
.course-view-page .lms-study-nav .lms-student-exam-action.final > span,
.course-view-page .lms-study-nav .lms-student-exam-action.lesson > i,
.course-view-page .lms-study-nav .lms-student-exam-action.unit > i,
.course-view-page .lms-study-nav .lms-student-exam-action.final > i {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  justify-self: center !important;
  align-self: center !important;
}

/* بادج اختبار الدرس/الوحدة لا يكسر التصميم */
.course-view-page .lms-study-nav .lms-student-exam-action.lesson::before,
.course-view-page .lms-study-nav .lms-student-exam-action.unit::before,
.course-view-page .lms-study-nav .lms-student-exam-action.final::before {
  grid-column: 1 / -1 !important;
  width: max-content !important;
  max-width: 100% !important;
  margin-bottom: 3px !important;
  white-space: nowrap !important;
}

/* مساحة محتوى الدرس التابعة للدرس */
.course-view-page .lms-sidebar-lesson-content {
  margin: 7px 12px 12px 0 !important;
  padding-right: 12px !important;
  border-right: 2px solid #ead7b6 !important;
}


/* DRABOTALEB_USER_ACTION_BUTTONS_POLISH_V1 */
.payment-row.user-row .pay-actions.user-actions-split {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
  direction: ltr !important;
}

.payment-row.user-row .user-quick-links {
  justify-self: end !important;
  justify-content: flex-end !important;
  direction: rtl !important;
}

.payment-row.user-row .user-state-actions {
  justify-self: start !important;
  justify-content: flex-start !important;
  direction: rtl !important;
}

.payment-row.user-row .user-action-pill,
.payment-row.user-row .user-state-pill {
  width: auto !important;
  min-width: 0 !important;
  height: 38px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: .18s ease !important;
}

.payment-row.user-row .user-action-pill:hover,
.payment-row.user-row .user-state-pill:hover:not(:disabled) {
  transform: translateY(-1px) !important;
  box-shadow: 0 10px 22px rgba(24,61,47,.10) !important;
}

.payment-row.user-row .user-action-pill .action-icon,
.payment-row.user-row .user-state-pill .action-icon {
  display: inline-grid !important;
  place-items: center !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

.payment-row.user-row .user-action-pill.profile {
  background: #f3f0ff !important;
  border-color: #d9d0ff !important;
  color: #42307d !important;
}

.payment-row.user-row .user-action-pill.payments {
  background: #fff7e6 !important;
  border-color: #ead29b !important;
  color: #8a5a0a !important;
}

.payment-row.user-row .user-action-pill.attendance {
  background: #ecfdf3 !important;
  border-color: #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .user-action-pill.exams {
  background: #eff8ff !important;
  border-color: #b2ddff !important;
  color: #175cd3 !important;
}

.payment-row.user-row .user-action-pill.activity {
  background: #f2f4f7 !important;
  border-color: #d0d5dd !important;
  color: #344054 !important;
}

.payment-row.user-row .user-state-pill.activate {
  background: #ecfdf3 !important;
  border-color: #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .user-state-pill.suspend {
  background: #fff5f5 !important;
  border-color: #fecaca !important;
  color: #b42318 !important;
}

.payment-row.user-row .user-state-pill.delete {
  background: #fff1f3 !important;
  border-color: #fecdd3 !important;
  color: #be123c !important;
}

.payment-row.user-row .user-state-pill:disabled {
  opacity: .45 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
  transform: none !important;
}

@media (max-width: 900px) {
  .payment-row.user-row .pay-actions.user-actions-split {
    grid-template-columns: 1fr !important;
    direction: rtl !important;
  }

  .payment-row.user-row .user-quick-links,
  .payment-row.user-row .user-state-actions {
    justify-self: stretch !important;
    justify-content: center !important;
  }

  .payment-row.user-row .user-action-pill,
  .payment-row.user-row .user-state-pill {
    flex: 1 1 auto !important;
  }
}

@media (max-width: 520px) {
  .payment-row.user-row .user-action-pill .action-text,
  .payment-row.user-row .user-state-pill .action-text {
    display: none !important;
  }

  .payment-row.user-row .user-action-pill,
  .payment-row.user-row .user-state-pill {
    width: 38px !important;
    padding: 0 !important;
    flex: 0 0 38px !important;
  }
}


/* DRABOTALEB_USER_ACTIONS_FINAL_ALIGN_V2 */
.payment-row.user-row .pay-actions.user-actions-split {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  width: 100% !important;
  direction: rtl !important;
}

.payment-row.user-row .user-quick-links {
  order: 1 !important;
  margin-inline-start: auto !important;
  margin-inline-end: 0 !important;
  display: flex !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.payment-row.user-row .user-state-actions {
  order: 2 !important;
  margin-inline-start: 0 !important;
  margin-inline-end: auto !important;
  display: flex !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding-inline-start: 16px !important;
  border-inline-start: 1px dashed #eadfcd !important;
}

.payment-row.user-row .user-action-pill,
.payment-row.user-row .user-state-pill {
  min-width: 74px !important;
}

.payment-row.user-row .user-state-pill.delete {
  order: 3 !important;
}

.payment-row.user-row .user-state-pill.suspend {
  order: 2 !important;
}

.payment-row.user-row .user-state-pill.activate {
  order: 1 !important;
}

@media (max-width: 900px) {
  .payment-row.user-row .pay-actions.user-actions-split {
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: center !important;
  }

  .payment-row.user-row .user-quick-links,
  .payment-row.user-row .user-state-actions {
    width: 100% !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }
}


/* DRABOTALEB_USER_ACTIONS_EDGE_ALIGN_V3 */
.payment-row.user-row .pay-actions.user-actions-split {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-height: 46px !important;
  padding-top: 12px !important;
  margin-top: 8px !important;
  border-top: 1px dashed #eadfcd !important;
}

.payment-row.user-row .pay-actions.user-actions-split .user-quick-links {
  position: absolute !important;
  right: 0 !important;
  left: auto !important;
  top: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  direction: rtl !important;
}

.payment-row.user-row .pay-actions.user-actions-split .user-state-actions {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  direction: rtl !important;
}

.payment-row.user-row .pay-actions.user-actions-split::after {
  content: "" !important;
  position: absolute !important;
  top: 14px !important;
  bottom: 2px !important;
  left: 50% !important;
  border-left: 1px dashed #eadfcd !important;
  opacity: .8 !important;
}

.payment-row.user-row .user-action-pill,
.payment-row.user-row .user-state-pill {
  min-width: 74px !important;
}

/* لو عرض الكارت ضاق، نرجعهم صفين بدل ما يركبوا فوق بعض */
@media (max-width: 1050px) {
  .payment-row.user-row .pay-actions.user-actions-split {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    min-height: auto !important;
  }

  .payment-row.user-row .pay-actions.user-actions-split .user-quick-links,
  .payment-row.user-row .pay-actions.user-actions-split .user-state-actions {
    position: static !important;
    width: 100% !important;
    justify-content: center !important;
  }

  .payment-row.user-row .pay-actions.user-actions-split::after {
    display: none !important;
  }
}


/* ===== Smart lesson left panel ===== */

/* تنظيم عمود معلومات الدرس الحالي */
.course-view-page .lms-current-lesson-info {
  display: grid !important;
  gap: 12px !important;
  align-content: start !important;
  padding: 0 !important;
}

/* بطاقة معلومات الدرس */
.course-view-page .lms-current-lesson-info {
  background: transparent !important;
}

.course-view-page .smart-lesson-title-label {
  display: inline-flex !important;
  width: max-content !important;
  margin: 0 auto -4px !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  background: #eaf6ef !important;
  color: #17603f !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

.course-view-page .lms-current-lesson-info h2 {
  margin: 0 !important;
  text-align: center !important;
  color: #173b2c !important;
  font-size: 26px !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;
}

.course-view-page .lms-current-lesson-info > p {
  margin: 0 !important;
  text-align: center !important;
  color: #667085 !important;
  font-size: 13px !important;
  line-height: 1.7 !important;
}

/* كارت تقدم الدرس */
.course-view-page .lms-lesson-progress-row {
  background: #fffdf8 !important;
  border: 1px solid #eadfce !important;
  border-radius: 18px !important;
  padding: 14px !important;
  display: grid !important;
  gap: 8px !important;
  box-shadow: 0 10px 24px rgba(24,61,47,.045) !important;
}

.course-view-page .lms-lesson-progress-row small {
  color: #667085 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  text-align: center !important;
}

.course-view-page .lms-lesson-progress-row b {
  color: #173b2c !important;
  font-size: 24px !important;
  font-weight: 900 !important;
  text-align: center !important;
}

.course-view-page .lms-lesson-progress-row .lms-progress-line {
  height: 8px !important;
  border-radius: 999px !important;
  background: #eee7dc !important;
  overflow: hidden !important;
}

/* أزرار إجراءات الدرس داخل العمود الشمال */
.course-view-page .lesson-actions-inline,
.course-view-page .generated-lesson-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.course-view-page .lesson-actions-inline button,
.course-view-page .lesson-actions-inline a,
.course-view-page .generated-lesson-actions button,
.course-view-page .generated-lesson-actions a {
  width: 100% !important;
  min-height: 42px !important;
  border-radius: 14px !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.course-view-page .lesson-actions-inline [data-complete-video],
.course-view-page .generated-lesson-actions [data-complete-video] {
  background: #c9932e !important;
  color: #fff !important;
  border: 0 !important;
}

.course-view-page .lesson-actions-inline [data-complete-video].is-completed,
.course-view-page .lesson-actions-inline [data-complete-video]:disabled,
.course-view-page .generated-lesson-actions [data-complete-video].is-completed,
.course-view-page .generated-lesson-actions [data-complete-video]:disabled {
  background: #173b2c !important;
  color: #fff !important;
  cursor: not-allowed !important;
}

/* كارت مدة الحصة */
.course-view-page .lms-lesson-facts.single-lesson-fact,
.course-view-page .clean-lesson-facts.single-lesson-fact {
  width: 100% !important;
  max-width: none !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

.course-view-page .lms-lesson-facts.single-lesson-fact span {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  border-radius: 18px !important;
  padding: 14px !important;
  background: #fffdf8 !important;
  border: 1px solid #eadfce !important;
  box-shadow: 0 10px 24px rgba(24,61,47,.045) !important;
}

.course-view-page .lms-lesson-facts.single-lesson-fact small {
  color: #667085 !important;
  font-size: 12px !important;
  margin-bottom: 5px !important;
  font-weight: 800 !important;
}

.course-view-page .lms-lesson-facts.single-lesson-fact b {
  color: #173b2c !important;
  font-size: 16px !important;
  font-weight: 900 !important;
}

/* إحصائيات الدورة داخل العمود الشمال */
.course-view-page .lms-current-lesson-info .lms-study-stats-inline {
  display: grid !important;
  gap: 10px !important;
  margin: 0 !important;
}

.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-side-box,
.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-certificate-card {
  border-radius: 18px !important;
  padding: 12px !important;
  background: #fff !important;
  border: 1px solid #eadfce !important;
  box-shadow: 0 10px 24px rgba(24,61,47,.045) !important;
}

.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-side-box > strong,
.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-certificate-card > strong {
  display: block !important;
  text-align: center !important;
  color: #173b2c !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  margin: 0 0 10px !important;
}

.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-side-box > div {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 7px !important;
}

.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-side-box span {
  min-height: 42px !important;
  border-radius: 12px !important;
  padding: 8px 6px !important;
  display: grid !important;
  place-items: center !important;
  background: #fbf7ef !important;
  border: 1px solid #eee3d1 !important;
  color: #173b2c !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  text-align: center !important;
}

.course-view-page .lms-current-lesson-info .lms-study-stats-inline .lms-certificate-card p {
  text-align: center !important;
  color: #667085 !important;
  font-size: 11px !important;
  line-height: 1.7 !important;
  margin: 0 0 10px !important;
}

/* نخلي ترتيب عمود الدرس منطقي */
.course-view-page .lms-lesson-player-layout {
  grid-template-columns: minmax(0, 1fr) 300px !important;
  gap: 18px !important;
  align-items: start !important;
}

/* إخفاء أزرار الإجراءات من مكانها القديم لو فضلت نسخة تحت الفيديو */
.course-view-page .lms-study-main > .lms-study-actions:not(.lesson-actions-inline),
.course-view-page .lms-study-main .lms-study-media + .lms-study-actions:not(.lesson-actions-inline) {
  display: none !important;
}

/* موبايل */
@media (max-width: 1100px) {
  .course-view-page .lms-lesson-player-layout {
    grid-template-columns: 1fr !important;
  }

  .course-view-page .lesson-actions-inline,
  .course-view-page .generated-lesson-actions {
    grid-template-columns: 1fr !important;
  }
}

/* DRABOTALEB_REMOVE_USER_ATTENDANCE_BUTTON_V1 */
.payment-row.user-row .user-action-pill.attendance {
  display: none !important;
}

.payment-row.user-row .user-quick-links {
  gap: 9px !important;
}

/* DRABOTALEB_USERS_CRM_STABLE_CLEAN_V5 */
/* styles injected from admin-dashboard.js to override old accumulated patches safely */

/* DRABOTALEB_POLISH_USERS_ACTIONS_V6 */

/* إخفاء أي نسخة قديمة من أزرار الإجراءات السريعة */
.payment-row.user-row .user-crm-quick-actions-v1,
.payment-row.user-row .user-crm-quick-actions-v5,
.payment-row.user-row .user-crm-quick-actions-horizontal-v4 {
  display: none !important;
}

/* شريط الإجراءات السريعة الجديد */
.payment-row.user-row .user-crm-quick-actions-v6 {
  width: 100% !important;
  margin: 14px 0 0 !important;
  padding: 12px 0 0 !important;
  border-top: 1px dashed #eadfcd !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  direction: rtl !important;
  clear: both !important;
  position: static !important;
  inset: auto !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

.payment-row.user-row .crm-actions-title-v6 {
  color: #667085 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.payment-row.user-row .crm-actions-title-v6::before {
  content: "⚡" !important;
}

.payment-row.user-row .crm-actions-buttons-v6 {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  width: auto !important;
  min-width: 0 !important;
  position: static !important;
  inset: auto !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

/* الأزرار نفسها */
.payment-row.user-row .crm-action-v6 {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  rotate: 0deg !important;
  float: none !important;
  width: auto !important;
  min-width: 130px !important;
  height: 38px !important;
  padding: 0 13px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  cursor: pointer !important;
  border: 1px solid #d0d5dd !important;
  background: #f8fafc !important;
  color: #173d2d !important;
  box-shadow: none !important;
  transition: .18s ease !important;
}

.payment-row.user-row .crm-action-v6:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 10px 22px rgba(24, 61, 47, .10) !important;
}

.payment-row.user-row .crm-action-v6 span,
.payment-row.user-row .crm-action-v6 b {
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
  writing-mode: horizontal-tb !important;
}

.payment-row.user-row .crm-action-v6.notify {
  background: #ecfdf3 !important;
  border-color: #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .crm-action-v6.logout {
  background: #fff5f5 !important;
  border-color: #fecaca !important;
  color: #b42318 !important;
}

.payment-row.user-row .crm-action-v6.whatsapp {
  background: #f0fff7 !important;
  border-color: #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .crm-action-v6.parent {
  background: #f8fff0 !important;
  border-color: #c7ef9d !important;
  color: #3b7a16 !important;
}

/* تحسين كارت الطالب بعد إضافة الشريط */
.payment-row.user-row {
  overflow: visible !important;
}

@media (max-width: 900px) {
  .payment-row.user-row .user-crm-quick-actions-v6 {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .payment-row.user-row .crm-actions-buttons-v6 {
    width: 100% !important;
    justify-content: center !important;
  }

  .payment-row.user-row .crm-action-v6 {
    flex: 1 1 45% !important;
    min-width: 140px !important;
  }
}

@media (max-width: 520px) {
  .payment-row.user-row .crm-action-v6 {
    flex: 1 1 100% !important;
    width: 100% !important;
  }
}


/* ===== Fix attendance button text + custom YouTube controls ===== */

/* نص زر تسجيل الحضور مضبوط */
.course-view-page [data-complete-video] {
  font-size: 0 !important;
}

.course-view-page [data-complete-video]::before {
  content: "اضغط هنا لتسجيل حضور الدرس" !important;
  font-size: 16px !important;
  line-height: 1.4 !important;
  font-weight: 900 !important;
}

.course-view-page [data-complete-video].is-completed::before,
.course-view-page [data-complete-video]:disabled::before {
  content: "تم تسجيل حضور الدرس ✓" !important;
}

/* مشغل يوتيوب مع كنترول خاص */
.course-view-page .has-private-youtube-controls {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 16px !important;
}

.course-view-page .has-private-youtube-controls iframe {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  display: block !important;
  border: 0 !important;
}

/* شريط التحكم الخاص */
.course-view-page .course-custom-video-controls {
  position: absolute !important;
  left: 12px !important;
  right: 12px !important;
  bottom: 12px !important;
  z-index: 9 !important;
  display: grid !important;
  grid-template-columns: auto auto minmax(120px, 1fr) auto auto !important;
  gap: 8px !important;
  align-items: center !important;
  padding: 10px !important;
  border-radius: 16px !important;
  background: rgba(15, 35, 28, .82) !important;
  backdrop-filter: blur(10px) !important;
  opacity: 0 !important;
  transform: translateY(8px) !important;
  transition: .2s ease !important;
}

.course-view-page .has-private-youtube-controls:hover .course-custom-video-controls,
.course-view-page .course-custom-video-controls:focus-within {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

.course-view-page .course-custom-video-controls button,
.course-view-page .course-custom-video-controls select {
  height: 34px !important;
  border: 0 !important;
  border-radius: 10px !important;
  padding: 0 10px !important;
  background: #fff7e6 !important;
  color: #173b2c !important;
  font-weight: 900 !important;
  font-size: 12px !important;
  cursor: pointer !important;
}

.course-view-page .course-custom-video-controls [data-yt-play] {
  background: #c9932e !important;
  color: #fff !important;
}

.course-view-page .course-custom-video-controls input[type="range"] {
  width: 100% !important;
  accent-color: #c9932e !important;
}

/* موبايل */
@media (max-width: 700px) {
  .course-view-page .course-custom-video-controls {
    grid-template-columns: 1fr 1fr !important;
    position: static !important;
    opacity: 1 !important;
    transform: none !important;
    margin-top: 8px !important;
  }

  .course-view-page .course-custom-video-controls input[type="range"],
  .course-view-page .course-custom-video-controls select {
    grid-column: 1 / -1 !important;
  }
}

/* DRABOTALEB_SUPERVISOR_ASSIGNMENT_UI_V1 */
.payment-row.user-row.supervisor-filter-hidden-v1 {
  display: none !important;
}

.student-supervisor-box-v1 {
  width: 100% !important;
  margin: 10px 0 0 !important;
  padding: 10px 0 0 !important;
  border-top: 1px dashed #eadfcd !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  direction: rtl !important;
}

.student-supervisor-chip-v1 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  background: #f3f0ff !important;
  border: 1px solid #d9d0ff !important;
  color: #42307d !important;
  border-radius: 999px !important;
  padding: 7px 11px !important;
  font-weight: 900 !important;
  font-size: 13px !important;
}

.student-supervisor-control-v1 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.student-supervisor-control-v1 select {
  min-width: 170px !important;
  height: 38px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 12px !important;
  padding: 0 10px !important;
  background: #fff !important;
  font-weight: 900 !important;
}

.student-supervisor-control-v1 button {
  height: 38px !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 13px !important;
  background: #173d2d !important;
  color: #fff !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

#supervisorFilterV1 {
  min-width: 180px !important;
  height: 44px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 12px !important;
  padding: 0 12px !important;
  background: #fff !important;
  font-weight: 900 !important;
}

/* Supervisor assigned students panel */
.supervisor-assigned-panel-v1 {
  background: #fff !important;
  border: 1px solid #e6dfd2 !important;
  border-radius: 20px !important;
  padding: 18px !important;
  margin: 0 0 18px !important;
  box-shadow: 0 16px 42px rgba(24,61,47,.06) !important;
  direction: rtl !important;
}

.supervisor-assigned-panel-v1 header {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
  align-items: center !important;
  margin-bottom: 14px !important;
}

.supervisor-assigned-panel-v1 h2 {
  margin: 0 0 5px !important;
  color: #173d2d !important;
  font-size: 24px !important;
  font-weight: 900 !important;
}

.supervisor-assigned-panel-v1 p {
  margin: 0 !important;
  color: #667085 !important;
  font-weight: 800 !important;
}

.supervisor-assigned-panel-v1 header strong {
  background: #173d2d !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 9px 14px !important;
  font-weight: 900 !important;
}

.supervisor-assigned-list-v1 {
  display: grid !important;
  gap: 10px !important;
}

.supervisor-assigned-card-v1 {
  border: 1px solid #eee7dc !important;
  background: #fbfaf7 !important;
  border-radius: 16px !important;
  padding: 13px !important;
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
  align-items: center !important;
  flex-wrap: wrap !important;
}

.supervisor-assigned-card-v1 h3 {
  margin: 0 0 4px !important;
  color: #173d2d !important;
  font-weight: 900 !important;
}

.supervisor-assigned-card-v1 p,
.supervisor-assigned-card-v1 small {
  display: block !important;
  margin: 0 !important;
  color: #667085 !important;
  font-weight: 800 !important;
}

.supervisor-assigned-actions-v1 {
  display: flex !important;
  gap: 7px !important;
  flex-wrap: wrap !important;
}

.supervisor-assigned-actions-v1 a {
  text-decoration: none !important;
  background: #ecfdf3 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
  border-radius: 999px !important;
  padding: 8px 12px !important;
  font-weight: 900 !important;
}

.supervisor-assigned-empty-v1 {
  border: 1px dashed #d8d0c3 !important;
  border-radius: 16px !important;
  padding: 20px !important;
  color: #667085 !important;
  font-weight: 900 !important;
  text-align: center !important;
}


/* ===== EMERGENCY FINAL CLEANUP: wide video + no left panel + clean controls ===== */

/* 1) إلغاء العمود الشمال نهائيًا */
.course-view-page .lms-current-lesson-info,
.course-view-page .smart-lesson-title-label,
.course-view-page .lms-study-stats-inline,
.course-view-page .lesson-actions-inline,
.course-view-page .generated-lesson-actions {
  display: none !important;
}

/* لو layout فيه أطفال جنب الفيديو، نخفي أي طفل لا يحتوي iframe فيديو */
.course-view-page .lms-lesson-player-layout {
  display: block !important;
  width: 100% !important;
  direction: rtl !important;
}

.course-view-page .lms-lesson-player-layout > *:not(:has(iframe[src*="youtube"])) {
  display: none !important;
}

/* 2) الفيديو واسع ومنظم */
.course-view-page .lms-study-media,
.course-view-page .lms-player,
.course-view-page .youtube-private-frame,
.course-view-page .lms-lesson-player-layout > *:has(iframe[src*="youtube"]) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 16px !important;
}

.course-view-page iframe[src*="youtube"] {
  width: 100% !important;
  max-width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  display: block !important;
  border: 0 !important;
}

/* 3) زر تسجيل الحضور تحت الفيديو فقط */
.course-view-page .course-attendance-box {
  display: block !important;
  width: 100% !important;
  margin: 12px 0 0 !important;
}

.course-view-page .course-attendance-box [data-complete-video] {
  display: flex !important;
  width: 100% !important;
  min-height: 50px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #c9932e, #b98222) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 10px 22px rgba(201,147,46,.20) !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0 !important;
  font-weight: 900 !important;
}

.course-view-page .course-attendance-box [data-complete-video]::before {
  content: "اضغط هنا لتسجيل حضور الدرس" !important;
  font-size: 16px !important;
  line-height: 1.4 !important;
}

.course-view-page .course-attendance-box [data-complete-video]:disabled,
.course-view-page .course-attendance-box [data-complete-video].is-completed {
  background: #173b2c !important;
  color: #fff !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
}

.course-view-page .course-attendance-box [data-complete-video]:disabled::before,
.course-view-page .course-attendance-box [data-complete-video].is-completed::before {
  content: "تم تسجيل حضور الدرس ✓" !important;
}

/* أخفي أي زر حضور خارج المكان الصحيح */
.course-view-page [data-complete-video]:not(.course-attendance-box [data-complete-video]) {
  display: none !important;
}

/* 4) تنظيف كنترول الفيديو المخصص */
.course-view-page .course-custom-video-controls {
  direction: ltr !important;
  position: absolute !important;
  left: 10px !important;
  right: 10px !important;
  bottom: 10px !important;
  z-index: 20 !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  display: grid !important;
  grid-template-columns: 72px 76px minmax(160px, 1fr) 76px 70px 76px !important;
  gap: 6px !important;
  align-items: center !important;
  padding: 6px !important;
  border-radius: 14px !important;
  background: rgba(15, 35, 28, .86) !important;
  backdrop-filter: blur(10px) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(8px) !important;
  transition: .18s ease !important;
}

/* يظهر فقط عند المرور على الفيديو */
.course-view-page .youtube-private-frame:hover .course-custom-video-controls,
.course-view-page .lms-study-media:hover .course-custom-video-controls,
.course-view-page .lms-player:hover .course-custom-video-controls,
.course-view-page .course-custom-video-controls:focus-within {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}

.course-view-page .course-custom-video-controls button,
.course-view-page .course-custom-video-controls select {
  direction: rtl !important;
  height: 30px !important;
  min-height: 30px !important;
  border: 0 !important;
  border-radius: 9px !important;
  padding: 0 8px !important;
  background: #fff7e6 !important;
  color: #173b2c !important;
  font-weight: 900 !important;
  font-size: 11px !important;
  line-height: 1 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

.course-view-page .course-custom-video-controls [data-yt-play] {
  background: #c9932e !important;
  color: #fff !important;
}

.course-view-page .course-custom-video-controls input[type="range"] {
  width: 100% !important;
  height: 4px !important;
  accent-color: #c9932e !important;
}

/* 5) القناع العلوي لإخفاء اسم الفيديو والقناة */
.course-view-page .yt-title-mask {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 72px !important;
  z-index: 18 !important;
  pointer-events: none !important;
  background: linear-gradient(to bottom, rgba(0,0,0,.92), rgba(0,0,0,.70), rgba(0,0,0,0)) !important;
}

/* 6) الموبايل */
@media (max-width: 700px) {
  .course-view-page .course-custom-video-controls {
    position: static !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
    margin-top: 8px !important;
    height: auto !important;
    max-height: none !important;
    grid-template-columns: 1fr 1fr !important;
  }

  .course-view-page .course-custom-video-controls input[type="range"],
  .course-view-page .course-custom-video-controls select {
    grid-column: 1 / -1 !important;
  }

  .course-view-page .course-attendance-box [data-complete-video]::before {
    font-size: 14px !important;
  }
}


/* DRABOTALEB_SUPERVISOR_ASSIGNMENT_UI_CLEAN_V2 */
.payment-row.user-row.supervisor-hidden-clean-v2 {
  display: none !important;
}

.supervisor-filter-clean-v2 {
  min-width: 180px !important;
  height: 44px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 12px !important;
  padding: 0 12px !important;
  background: #fff !important;
  font-weight: 900 !important;
}

.student-supervisor-clean-v2 {
  width: 100% !important;
  margin: 12px 0 0 !important;
  padding: 12px 0 0 !important;
  border-top: 1px dashed #eadfcd !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  direction: rtl !important;
}

.student-supervisor-chip-clean-v2 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  background: #f3f0ff !important;
  border: 1px solid #d9d0ff !important;
  color: #42307d !important;
  border-radius: 999px !important;
  padding: 8px 12px !important;
  font-weight: 900 !important;
  font-size: 13px !important;
}

.student-supervisor-control-clean-v2 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.student-supervisor-control-clean-v2 select {
  min-width: 180px !important;
  height: 38px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 12px !important;
  padding: 0 10px !important;
  background: #fff !important;
  font-weight: 900 !important;
}

.student-supervisor-control-clean-v2 button {
  height: 38px !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 13px !important;
  background: #173d2d !important;
  color: #fff !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.student-supervisor-control-clean-v2 button:disabled {
  opacity: .6 !important;
  cursor: wait !important;
}

/* DRABOTALEB_SUPERVISOR_ASSIGNMENT_EXTERNAL_JS */
.payment-row.user-row.supervisor-filter-hidden-external {
  display: none !important;
}

.supervisor-filter-external {
  min-width: 180px !important;
  height: 44px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 12px !important;
  padding: 0 12px !important;
  background: #fff !important;
  font-weight: 900 !important;
}

.student-supervisor-external {
  width: 100% !important;
  margin: 12px 0 0 !important;
  padding: 12px 0 0 !important;
  border-top: 1px dashed #eadfcd !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  direction: rtl !important;
}

.student-supervisor-chip-external {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  background: #f3f0ff !important;
  border: 1px solid #d9d0ff !important;
  color: #42307d !important;
  border-radius: 999px !important;
  padding: 8px 12px !important;
  font-weight: 900 !important;
  font-size: 13px !important;
}

.student-supervisor-control-external {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.student-supervisor-control-external select {
  min-width: 180px !important;
  height: 38px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 12px !important;
  padding: 0 10px !important;
  background: #fff !important;
  font-weight: 900 !important;
}

.student-supervisor-control-external button {
  height: 38px !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 13px !important;
  background: #173d2d !important;
  color: #fff !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.student-supervisor-control-external button:disabled {
  opacity: .6 !important;
  cursor: wait !important;
}

/* DRABOTALEB_USERS_CARD_POLISH_V1 */

/* إخفاء أي أزرار قديمة مكررة */
.payment-row.user-row .user-crm-quick-actions-v1,
.payment-row.user-row .user-crm-quick-actions-v5,
.payment-row.user-row .user-crm-quick-actions-horizontal-v4 {
  display: none !important;
}

/* بانل إدارة الطالب */
.payment-row.user-row .student-management-panel-v1 {
  width: 100% !important;
  margin-top: 14px !important;
  padding: 12px 14px !important;
  border: 1px solid #eee1cf !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, #fffaf2, #ffffff) !important;
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  gap: 12px !important;
  align-items: center !important;
  direction: rtl !important;
  box-sizing: border-box !important;
}

.payment-row.user-row .student-management-title-v1 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #8a5a0a !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
  padding-inline-end: 12px !important;
  border-inline-end: 1px dashed #eadfcd !important;
}

.payment-row.user-row .student-management-content-v1 {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  min-width: 0 !important;
}

/* جزء المشرف يبقى مدمج لا ياخد صف كامل */
.payment-row.user-row .student-supervisor-external {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.payment-row.user-row .student-supervisor-chip-external {
  height: 36px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
}

.payment-row.user-row .student-supervisor-control-external {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}

.payment-row.user-row .student-supervisor-control-external select {
  height: 36px !important;
  min-width: 150px !important;
  max-width: 190px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
}

.payment-row.user-row .student-supervisor-control-external button {
  height: 36px !important;
  border-radius: 999px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
}

/* الإجراءات السريعة في نفس البانل */
.payment-row.user-row .user-crm-quick-actions-v6 {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.payment-row.user-row .user-crm-quick-actions-v6 .crm-actions-title-v6 {
  display: none !important;
}

.payment-row.user-row .user-crm-quick-actions-v6 .crm-actions-buttons-v6 {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  width: auto !important;
}

.payment-row.user-row .crm-action-v6 {
  min-width: auto !important;
  height: 36px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  border-radius: 999px !important;
}

/* تقليل فراغ الكارت */
.payment-row.user-row.user-card-polished-v1 {
  padding-bottom: 16px !important;
}

@media (max-width: 900px) {
  .payment-row.user-row .student-management-panel-v1 {
    grid-template-columns: 1fr !important;
  }

  .payment-row.user-row .student-management-title-v1 {
    border: 0 !important;
    padding: 0 !important;
    justify-content: center !important;
  }

  .payment-row.user-row .student-management-content-v1,
  .payment-row.user-row .student-supervisor-external,
  .payment-row.user-row .user-crm-quick-actions-v6,
  .payment-row.user-row .user-crm-quick-actions-v6 .crm-actions-buttons-v6 {
    justify-content: center !important;
  }
}


/* DRABOTALEB_STABLE_STUDENT_MANAGEMENT_PANEL_V2 */

/* إخفاء كل نسخ الإدارة القديمة */
.payment-row.user-row .user-crm-quick-actions-v1,
.payment-row.user-row .user-crm-quick-actions-v5,
.payment-row.user-row .user-crm-quick-actions-v6,
.payment-row.user-row .user-crm-quick-actions-horizontal-v4,
.payment-row.user-row .student-supervisor-external,
.payment-row.user-row .student-supervisor-clean-v2,
.payment-row.user-row .student-management-panel-v1 {
  display: none !important;
}

.payment-row.user-row.stable-supervisor-hidden {
  display: none !important;
}

.stable-supervisor-filter {
  min-width: 180px !important;
  height: 44px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 12px !important;
  padding: 0 12px !important;
  background: #fff !important;
  font-weight: 900 !important;
}

.payment-row.user-row .student-management-stable {
  width: 100% !important;
  margin: 14px 0 0 !important;
  padding: 12px 14px !important;
  border: 1px solid #eee1cf !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, #fffaf2, #ffffff) !important;
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  gap: 14px !important;
  align-items: center !important;
  direction: rtl !important;
  box-sizing: border-box !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

.payment-row.user-row .stable-management-head {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #8a5a0a !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
  padding-inline-end: 12px !important;
  border-inline-end: 1px dashed #eadfcd !important;
}

.payment-row.user-row .stable-management-body {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  min-width: 0 !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

.payment-row.user-row .stable-supervisor-area,
.payment-row.user-row .stable-quick-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

.payment-row.user-row .stable-supervisor-chip {
  height: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  background: #f3f0ff !important;
  border: 1px solid #d9d0ff !important;
  color: #42307d !important;
  font-weight: 900 !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

.payment-row.user-row [data-stable-supervisor-select] {
  height: 36px !important;
  min-width: 150px !important;
  max-width: 190px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 999px !important;
  padding: 0 10px !important;
  background: #fff !important;
  color: #173d2d !important;
  font-weight: 900 !important;
  font-size: 12px !important;
}

.payment-row.user-row .stable-save-supervisor,
.payment-row.user-row .stable-action {
  height: 36px !important;
  min-width: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  cursor: pointer !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  rotate: 0deg !important;
}

.payment-row.user-row .stable-save-supervisor {
  border: 0 !important;
  background: #173d2d !important;
  color: #fff !important;
}

.payment-row.user-row .stable-action.notify {
  background: #ecfdf3 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .stable-action.logout {
  background: #fff5f5 !important;
  border: 1px solid #fecaca !important;
  color: #b42318 !important;
}

.payment-row.user-row .stable-action.whatsapp {
  background: #f0fff7 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .stable-action.parent {
  background: #f8fff0 !important;
  border-color: #c7ef9d !important;
  color: #3b7a16 !important;
}

.payment-row.user-row .stable-save-supervisor:disabled {
  opacity: .65 !important;
  cursor: wait !important;
}

@media (max-width: 900px) {
  .payment-row.user-row .student-management-stable {
    grid-template-columns: 1fr !important;
  }

  .payment-row.user-row .stable-management-head {
    justify-content: center !important;
    border: 0 !important;
    padding: 0 !important;
  }

  .payment-row.user-row .stable-management-body,
  .payment-row.user-row .stable-supervisor-area,
  .payment-row.user-row .stable-quick-actions {
    justify-content: center !important;
  }
}

/* DRABOTALEB_FINAL_STUDENT_MANAGEMENT_LOOK_V3 */

/* اخفاء أي أزرار قديمة طالعة في يمين الكارت */
.payment-row.user-row > .user-crm-quick-actions-v1,
.payment-row.user-row > .user-crm-quick-actions-v5,
.payment-row.user-row > .user-crm-quick-actions-v6,
.payment-row.user-row > .user-crm-quick-actions-horizontal-v4,
.payment-row.user-row > .student-supervisor-external,
.payment-row.user-row > .student-supervisor-clean-v2,
.payment-row.user-row > .student-management-panel-v1 {
  display: none !important;
}

/* منع أي أزرار قديمة جوه الكارت تظهر برة بانل الإدارة */
.payment-row.user-row .user-crm-quick-actions-v1:not(.student-management-stable *),
.payment-row.user-row .user-crm-quick-actions-v5:not(.student-management-stable *),
.payment-row.user-row .user-crm-quick-actions-v6:not(.student-management-stable *),
.payment-row.user-row .user-crm-quick-actions-horizontal-v4:not(.student-management-stable *) {
  display: none !important;
}

/* صف أزرار ملف/دفع/درجات/نشاط + تفعيل/إيقاف/حذف يبقى ثابت ومريح */
.payment-row.user-row .pay-actions.user-actions-split {
  width: 100% !important;
  min-height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding-top: 14px !important;
  border-top: 1px dashed #eadfcd !important;
  position: relative !important;
  direction: rtl !important;
}

.payment-row.user-row .pay-actions.user-actions-split::after {
  content: "" !important;
  display: none !important;
}

.payment-row.user-row .user-quick-links {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
}

.payment-row.user-row .user-state-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
}

/* بانل إدارة الطالب النهائي */
.payment-row.user-row .student-management-stable {
  width: 100% !important;
  margin: 14px 0 0 !important;
  padding: 14px 16px !important;
  border: 1px solid #eadfcd !important;
  border-radius: 18px !important;
  background: #fffaf2 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.65), 0 10px 24px rgba(24,61,47,.04) !important;
  display: grid !important;
  grid-template-columns: 140px 1fr !important;
  gap: 14px !important;
  align-items: center !important;
  direction: rtl !important;
  box-sizing: border-box !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  clear: both !important;
}

/* عنوان إدارة الطالب */
.payment-row.user-row .stable-management-head {
  height: 100% !important;
  min-height: 76px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  color: #8a5a0a !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
  border-inline-start: 1px dashed #d9c7a8 !important;
  padding-inline-start: 14px !important;
  font-size: 15px !important;
}

/* محتوى البانل */
.payment-row.user-row .stable-management-body {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  min-width: 0 !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

/* صف المشرف */
.payment-row.user-row .stable-supervisor-area {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

/* صف الإجراءات */
.payment-row.user-row .stable-quick-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

/* شارة المشرف */
.payment-row.user-row .stable-supervisor-chip {
  height: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  background: #f3f0ff !important;
  border: 1px solid #d9d0ff !important;
  color: #42307d !important;
  font-weight: 900 !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

/* اختيار المشرف */
.payment-row.user-row [data-stable-supervisor-select] {
  height: 36px !important;
  min-width: 170px !important;
  max-width: 220px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 999px !important;
  padding: 0 12px !important;
  background: #fff !important;
  color: #173d2d !important;
  font-weight: 900 !important;
  font-size: 12px !important;
}

/* أزرار إدارة الطالب */
.payment-row.user-row .stable-save-supervisor,
.payment-row.user-row .stable-action {
  height: 36px !important;
  min-width: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  cursor: pointer !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  rotate: 0deg !important;
  box-shadow: none !important;
}

.payment-row.user-row .stable-save-supervisor {
  border: 0 !important;
  background: #173d2d !important;
  color: #fff !important;
}

.payment-row.user-row .stable-action.notify {
  background: #ecfdf3 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .stable-action.logout {
  background: #fff5f5 !important;
  border: 1px solid #fecaca !important;
  color: #b42318 !important;
}

.payment-row.user-row .stable-action.whatsapp {
  background: #f0fff7 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .stable-action.parent {
  background: #f8fff0 !important;
  border-color: #c7ef9d !important;
  color: #3b7a16 !important;
}

/* إخفاء الأزرار المكررة لو اتولدت برة البانل */
.payment-row.user-row > .stable-action,
.payment-row.user-row > .stable-quick-actions,
.payment-row.user-row > .stable-supervisor-area {
  display: none !important;
}

/* تقليل الفراغ داخل كارت الطالب */
.payment-row.user-row {
  padding-bottom: 18px !important;
  overflow: visible !important;
}

/* موبايل */
@media (max-width: 900px) {
  .payment-row.user-row .student-management-stable {
    grid-template-columns: 1fr !important;
  }

  .payment-row.user-row .stable-management-head {
    min-height: auto !important;
    border: 0 !important;
    padding: 0 !important;
    justify-content: center !important;
  }

  .payment-row.user-row .stable-supervisor-area,
  .payment-row.user-row .stable-quick-actions {
    justify-content: center !important;
  }

  .payment-row.user-row .pay-actions.user-actions-split {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .payment-row.user-row .user-quick-links,
  .payment-row.user-row .user-state-actions {
    justify-content: center !important;
  }
}


/* DRABOTALEB_EMERGENCY_HIDE_BAD_STUDENT_MANAGEMENT */
.payment-row.user-row .student-management-stable,
.payment-row.user-row .student-management-panel-v1,
.payment-row.user-row .student-supervisor-external,
.payment-row.user-row .student-supervisor-clean-v2,
.payment-row.user-row .user-crm-quick-actions-v1,
.payment-row.user-row .user-crm-quick-actions-v5,
.payment-row.user-row .user-crm-quick-actions-v6,
.payment-row.user-row .user-crm-quick-actions-horizontal-v4,
.payment-row.user-row .stable-supervisor-area,
.payment-row.user-row .stable-quick-actions,
.payment-row.user-row .stable-action,
.payment-row.user-row .stable-save-supervisor {
  display: none !important;
}

/* رجّع صف أزرار الطالب الأساسي فقط */
.payment-row.user-row .pay-actions.user-actions-split {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  gap: 18px !important;
  padding-top: 14px !important;
  border-top: 1px dashed #eadfcd !important;
  position: relative !important;
  direction: rtl !important;
}

.payment-row.user-row .user-quick-links,
.payment-row.user-row .user-state-actions {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  position: static !important;
  transform: none !important;
}

.payment-row.user-row .user-quick-links {
  justify-content: flex-end !important;
}

.payment-row.user-row .user-state-actions {
  justify-content: flex-start !important;
}


/* === Fullscreen & Quality Buttons === */
.course-custom-video-controls [data-yt-fullscreen] {
    background: rgba(255, 107, 53, 0.4) !important;
    border: 1px solid rgba(255, 107, 53, 0.6) !important;
    color: #fff !important;
    font-size: 20px !important;
    padding: 4px 12px !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    line-height: 1 !important;
}
.course-custom-video-controls [data-yt-fullscreen]:hover {
    background: rgba(255, 107, 53, 0.7) !important;
    transform: scale(1.1) !important;
}
.course-custom-video-controls [data-yt-quality] {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    color: #fff !important;
    font-size: 12px !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    font-family: 'Cairo', sans-serif !important;
}
.course-custom-video-controls [data-yt-quality]:hover {
    background: rgba(255, 255, 255, 0.3) !important;
}
/* Fullscreen mode adjustments */
.lms-study-media:fullscreen,
.lms-player:fullscreen {
    background: #000 !important;
    display: flex !important;
    flex-direction: column !important;
}
.lms-study-media:fullscreen iframe,
.lms-player:fullscreen iframe {
    flex: 1 !important;
    width: 100% !important;
    height: 100% !important;
}
.lms-study-media:fullscreen .course-custom-video-controls,
.lms-player:fullscreen .course-custom-video-controls {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    opacity: 0 !important;
    transition: opacity 0.3s !important;
    background: linear-gradient(to top, rgba(0,0,0,0.9), transparent) !important;
    padding: 40px 16px 16px 16px !important;
    z-index: 99999 !important;
}
.lms-study-media:fullscreen:hover .course-custom-video-controls,
.lms-player:fullscreen:hover .course-custom-video-controls {
    opacity: 1 !important;
}
.lms-study-media:fullscreen .protected-watermark-corner,
.lms-player:fullscreen .protected-watermark-corner,
.lms-study-media:fullscreen .protected-watermark-moving,
.lms-player:fullscreen .protected-watermark-moving {
    z-index: 99998 !important;
}

/* DRABOTALEB_STUDENT_TOOLS_SIMPLE_V1 */

/* اخفاء كل محاولات الإدارة القديمة */
.payment-row.user-row .student-management-stable,
.payment-row.user-row .student-management-panel-v1,
.payment-row.user-row .student-supervisor-external,
.payment-row.user-row .student-supervisor-clean-v2,
.payment-row.user-row .user-crm-quick-actions-v1,
.payment-row.user-row .user-crm-quick-actions-v5,
.payment-row.user-row .user-crm-quick-actions-v6,
.payment-row.user-row .user-crm-quick-actions-horizontal-v4,
.payment-row.user-row .stable-supervisor-area,
.payment-row.user-row .stable-quick-actions,
.payment-row.user-row .stable-action,
.payment-row.user-row .stable-save-supervisor {
  display: none !important;
}

/* البانل الجديد البسيط */
.payment-row.user-row .student-tools-simple {
  width: 100% !important;
  margin: 12px 0 0 !important;
  padding: 12px 14px !important;
  border: 1px solid #eadfcd !important;
  border-radius: 16px !important;
  background: #fffaf2 !important;
  display: grid !important;
  gap: 10px !important;
  direction: rtl !important;
  box-sizing: border-box !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

.payment-row.user-row .sts-row {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.payment-row.user-row .sts-label {
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  background: #f3f0ff !important;
  border: 1px solid #d9d0ff !important;
  color: #42307d !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}

.payment-row.user-row [data-sts-supervisor-select] {
  height: 34px !important;
  min-width: 160px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #173d2d !important;
  font-weight: 900 !important;
  font-size: 12px !important;
  padding: 0 12px !important;
}

.payment-row.user-row .sts-save,
.payment-row.user-row .sts-btn {
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  cursor: pointer !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

.payment-row.user-row .sts-save {
  border: 0 !important;
  background: #173d2d !important;
  color: #fff !important;
}

.payment-row.user-row .sts-notify {
  background: #ecfdf3 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .sts-logout {
  background: #fff5f5 !important;
  border: 1px solid #fecaca !important;
  color: #b42318 !important;
}

.payment-row.user-row .sts-whatsapp {
  background: #f0fff7 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .sts-parent {
  background: #f8fff0 !important;
  border-color: #c7ef9d !important;
  color: #3b7a16 !important;
}

.payment-row.user-row .sts-save:disabled {
  opacity: .65 !important;
  cursor: wait !important;
}

@media (max-width: 700px) {
  .payment-row.user-row .sts-row {
    justify-content: center !important;
  }

  .payment-row.user-row .sts-btn,
  .payment-row.user-row .sts-save,
  .payment-row.user-row [data-sts-supervisor-select],
  .payment-row.user-row .sts-label {
    flex: 1 1 45% !important;
    min-width: 140px !important;
  }
}

/* DRABOTALEB_FORCE_STUDENT_TOOLS_HORIZONTAL_V2 */

/* امسح أي أشكال قديمة */
.payment-row.user-row .student-management-stable,
.payment-row.user-row .student-management-panel-v1,
.payment-row.user-row .student-supervisor-external,
.payment-row.user-row .student-supervisor-clean-v2,
.payment-row.user-row .user-crm-quick-actions-v1,
.payment-row.user-row .user-crm-quick-actions-v5,
.payment-row.user-row .user-crm-quick-actions-v6,
.payment-row.user-row .user-crm-quick-actions-horizontal-v4 {
  display: none !important;
}

/* البانل النهائي: بعرض الكارت كله */
.payment-row.user-row > .student-tools-simple,
.payment-row.user-row > .student-tools-simple-horizontal-final {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 12px 0 0 !important;
  padding: 12px 14px !important;
  border: 1px solid #eadfcd !important;
  border-radius: 16px !important;
  background: #fffaf2 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  direction: rtl !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  clear: both !important;
  float: none !important;
}

/* الصفين أفقيين */
.payment-row.user-row > .student-tools-simple .sts-row,
.payment-row.user-row > .student-tools-simple .sts-row-horizontal-final {
  width: 100% !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

/* عناصر الصف */
.payment-row.user-row > .student-tools-simple .sts-label,
.payment-row.user-row > .student-tools-simple select,
.payment-row.user-row > .student-tools-simple button,
.payment-row.user-row > .student-tools-simple a {
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  rotate: 0deg !important;
  float: none !important;
}

.payment-row.user-row > .student-tools-simple .sts-label {
  padding: 0 12px !important;
  background: #f3f0ff !important;
  border: 1px solid #d9d0ff !important;
  color: #42307d !important;
}

.payment-row.user-row > .student-tools-simple select {
  min-width: 170px !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid #d8d0c3 !important;
  color: #173d2d !important;
}

.payment-row.user-row > .student-tools-simple .sts-save {
  padding: 0 14px !important;
  border: 0 !important;
  background: #173d2d !important;
  color: #fff !important;
}

.payment-row.user-row > .student-tools-simple .sts-btn {
  padding: 0 12px !important;
  text-decoration: none !important;
}

.payment-row.user-row > .student-tools-simple .sts-notify {
  background: #ecfdf3 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row > .student-tools-simple .sts-logout {
  background: #fff5f5 !important;
  border: 1px solid #fecaca !important;
  color: #b42318 !important;
}

.payment-row.user-row > .student-tools-simple .sts-whatsapp {
  background: #f0fff7 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row > .student-tools-simple .sts-parent {
  background: #f8fff0 !important;
  border-color: #c7ef9d !important;
  color: #3b7a16 !important;
}

/* امنع أي عمود يمين */
.payment-row.user-row > .student-tools-simple * {
  writing-mode: horizontal-tb !important;
}

@media (max-width: 700px) {
  .payment-row.user-row > .student-tools-simple .sts-row {
    justify-content: center !important;
  }
}


/* DRABOTALEB_STUDENT_TOOLS_SIMPLE_FINAL_CLEAN */

/* أخفي كل بقايا المحاولات القديمة */
.payment-row.user-row .student-management-stable,
.payment-row.user-row .student-management-panel-v1,
.payment-row.user-row .student-supervisor-external,
.payment-row.user-row .student-supervisor-clean-v2,
.payment-row.user-row .user-crm-quick-actions-v1,
.payment-row.user-row .user-crm-quick-actions-v5,
.payment-row.user-row .user-crm-quick-actions-v6,
.payment-row.user-row .user-crm-quick-actions-horizontal-v4,
.payment-row.user-row .stable-supervisor-area,
.payment-row.user-row .stable-quick-actions,
.payment-row.user-row .stable-action,
.payment-row.user-row .stable-save-supervisor {
  display: none !important;
}

/* خليه ابن مباشر للكارت وبعرض الكارت */
.payment-row.user-row > .student-tools-simple {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  grid-column: 1 / -1 !important;
  box-sizing: border-box !important;
  margin: 12px 0 0 !important;
  padding: 12px 14px !important;
  border: 1px solid #eadfcd !important;
  border-radius: 16px !important;
  background: #fffaf2 !important;
  display: grid !important;
  gap: 10px !important;
  direction: rtl !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  clear: both !important;
  float: none !important;
  justify-self: stretch !important;
  align-self: stretch !important;
}

/* الصفين */
.payment-row.user-row > .student-tools-simple .sts-row {
  width: 100% !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

/* العناصر */
.payment-row.user-row > .student-tools-simple .sts-label,
.payment-row.user-row > .student-tools-simple select,
.payment-row.user-row > .student-tools-simple button,
.payment-row.user-row > .student-tools-simple a {
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  rotate: 0deg !important;
  float: none !important;
}

.payment-row.user-row > .student-tools-simple .sts-label {
  padding: 0 12px !important;
  background: #f3f0ff !important;
  border: 1px solid #d9d0ff !important;
  color: #42307d !important;
}

.payment-row.user-row > .student-tools-simple select {
  min-width: 170px !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid #d8d0c3 !important;
  color: #173d2d !important;
}

.payment-row.user-row > .student-tools-simple .sts-save {
  padding: 0 14px !important;
  border: 0 !important;
  background: #173d2d !important;
  color: #fff !important;
}

.payment-row.user-row > .student-tools-simple .sts-btn {
  padding: 0 12px !important;
  text-decoration: none !important;
}

.payment-row.user-row > .student-tools-simple .sts-notify {
  background: #ecfdf3 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row > .student-tools-simple .sts-logout {
  background: #fff5f5 !important;
  border: 1px solid #fecaca !important;
  color: #b42318 !important;
}

.payment-row.user-row > .student-tools-simple .sts-whatsapp {
  background: #f0fff7 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row > .student-tools-simple .sts-parent {
  background: #f8fff0 !important;
  border-color: #c7ef9d !important;
  color: #3b7a16 !important;
}

@media (max-width: 700px) {
  .payment-row.user-row > .student-tools-simple .sts-row {
    justify-content: center !important;
  }
}


/* === COURSE PLAYER FINAL OVERRIDE START === */
.course-view-page .youtube-private-frame,
.course-view-page .lms-study-media,
.course-view-page .lms-player {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 18px !important;
}

.course-view-page .yt-title-mask {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 54px !important;
  z-index: 8 !important;
  pointer-events: none !important;
  background: linear-gradient(to bottom, rgba(0,0,0,.72), rgba(0,0,0,.34), rgba(0,0,0,0)) !important;
}

.course-view-page .course-custom-video-controls {
  direction: ltr !important;
  position: absolute !important;
  left: 14px !important;
  right: 14px !important;
  bottom: 14px !important;
  z-index: 12 !important;
  display: grid !important;
  grid-template-columns: auto auto minmax(220px, 1fr) auto auto auto auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 10px !important;
  border-radius: 16px !important;
  background: rgba(12, 31, 24, 0.88) !important;
  backdrop-filter: blur(10px) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.18) !important;
  min-height: 56px !important;
  max-height: 56px !important;
  overflow: hidden !important;
}

.course-view-page .course-custom-video-controls > * {
  margin: 0 !important;
}

.course-view-page .course-custom-video-controls button,
.course-view-page .course-custom-video-controls select {
  height: 38px !important;
  min-height: 38px !important;
  border: 0 !important;
  border-radius: 12px !important;
  padding: 0 12px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

.course-view-page .course-custom-video-controls button {
  background: #f6ecd9 !important;
  color: #153629 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

.course-view-page .course-custom-video-controls button:hover {
  filter: brightness(.98) !important;
}

.course-view-page .course-custom-video-controls [data-yt-play],
.course-view-page .course-custom-video-controls [data-player-play] {
  background: #c9922f !important;
  color: #fff !important;
}

.course-view-page .course-custom-video-controls [data-yt-fullscreen],
.course-view-page .course-custom-video-controls [data-player-fullscreen] {
  min-width: 44px !important;
  padding: 0 !important;
  font-size: 18px !important;
}

.course-view-page .course-custom-video-controls .player-progress-slot {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 220px !important;
}

.course-view-page .course-custom-video-controls .player-progress-slot input[type="range"] {
  width: 100% !important;
  accent-color: #c9922f !important;
  cursor: pointer !important;
}

.course-view-page .course-custom-video-controls .player-select-stack {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 4px !important;
  min-width: 86px !important;
}

.course-view-page .course-custom-video-controls .player-select-stack label {
  display: block !important;
  font-size: 10px !important;
  line-height: 1 !important;
  color: #f6ecd9 !important;
  opacity: .92 !important;
  text-align: center !important;
  font-weight: 700 !important;
}

.course-view-page .course-custom-video-controls select {
  background: #f6ecd9 !important;
  color: #153629 !important;
  cursor: pointer !important;
}

.course-view-page .course-custom-video-controls .player-progress-slot + * {
  margin-right: 0 !important;
}

@media (max-width: 900px) {
  .course-view-page .course-custom-video-controls {
    grid-template-columns: 1fr 1fr !important;
    min-height: auto !important;
    max-height: none !important;
    height: auto !important;
    padding: 10px !important;
  }

  .course-view-page .course-custom-video-controls .player-progress-slot,
  .course-view-page .course-custom-video-controls .player-select-stack {
    grid-column: 1 / -1 !important;
  }

  .course-view-page .course-custom-video-controls [data-yt-fullscreen],
  .course-view-page .course-custom-video-controls [data-player-fullscreen] {
    justify-self: stretch !important;
  }
}
/* === COURSE PLAYER FINAL OVERRIDE END === */

/* DRABOTALEB_FIX_STUDENT_TOOLS_DIRECTION_FINAL */

/* البانل نفسه RTL ومحاذاة يمين */
.payment-row.user-row > .student-tools-simple {
  direction: rtl !important;
  text-align: right !important;
}

/* الصفين يبدأوا من اليمين مش من الشمال */
.payment-row.user-row > .student-tools-simple .sts-row,
.payment-row.user-row > .student-tools-simple .sts-supervisor-row,
.payment-row.user-row > .student-tools-simple .sts-actions-row {
  direction: rtl !important;
  text-align: right !important;
  justify-content: flex-start !important;
  align-items: center !important;
  flex-direction: row !important;
  width: 100% !important;
}

/* ترتيب صف المشرف من اليمين:
   المشرف المسؤول ← اختيار مشرف ← حفظ */
.payment-row.user-row > .student-tools-simple .sts-supervisor-row {
  display: flex !important;
}

/* ترتيب صف الإجراءات من اليمين:
   إشعار خاص ← خروج الأجهزة ← واتساب الطالب ← واتساب ولي الأمر */
.payment-row.user-row > .student-tools-simple .sts-actions-row {
  display: flex !important;
}

/* منع أي عنصر ياخد اتجاه معاكس */
.payment-row.user-row > .student-tools-simple .sts-label,
.payment-row.user-row > .student-tools-simple select,
.payment-row.user-row > .student-tools-simple button,
.payment-row.user-row > .student-tools-simple a {
  direction: rtl !important;
  text-align: center !important;
  writing-mode: horizontal-tb !important;
}

/* خلي البانل أهدى شوية */
.payment-row.user-row > .student-tools-simple {
  padding: 12px 16px !important;
  gap: 9px !important;
}

/* موبايل */
@media (max-width: 700px) {
  .payment-row.user-row > .student-tools-simple .sts-row,
  .payment-row.user-row > .student-tools-simple .sts-supervisor-row,
  .payment-row.user-row > .student-tools-simple .sts-actions-row {
    justify-content: center !important;
  }
}


/* DRABOTALEB_USERS_PAGE_FINAL */

/* أخفي كل بقايا محاولات الإدارة القديمة */
.payment-row.user-row .student-tools-simple,
.payment-row.user-row .student-management-stable,
.payment-row.user-row .student-management-panel-v1,
.payment-row.user-row .student-supervisor-external,
.payment-row.user-row .student-supervisor-clean-v2,
.payment-row.user-row .user-crm-quick-actions-v1,
.payment-row.user-row .user-crm-quick-actions-v5,
.payment-row.user-row .user-crm-quick-actions-v6,
.payment-row.user-row .user-crm-quick-actions-horizontal-v4,
.payment-row.user-row .stable-supervisor-area,
.payment-row.user-row .stable-quick-actions,
.payment-row.user-row .stable-action,
.payment-row.user-row .stable-save-supervisor {
  display: none !important;
}

.payment-row.user-row.upf-supervisor-hidden {
  display: none !important;
}

.upf-supervisor-filter {
  min-width: 180px !important;
  height: 44px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 12px !important;
  padding: 0 12px !important;
  background: #fff !important;
  font-weight: 900 !important;
}

/* البانل النهائي */
.payment-row.user-row > .upf-student-tools {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 12px 0 0 !important;
  padding: 12px 16px !important;
  border: 1px solid #eadfcd !important;
  border-radius: 16px !important;
  background: #fffaf2 !important;
  display: grid !important;
  gap: 9px !important;
  direction: rtl !important;
  text-align: right !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  clear: both !important;
  float: none !important;
}

/* الصفين من اليمين */
.payment-row.user-row > .upf-student-tools .upf-row {
  width: 100% !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  direction: rtl !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
}

/* العناصر */
.payment-row.user-row > .upf-student-tools .upf-label,
.payment-row.user-row > .upf-student-tools select,
.payment-row.user-row > .upf-student-tools button,
.payment-row.user-row > .upf-student-tools a {
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  rotate: 0deg !important;
  float: none !important;
  direction: rtl !important;
}

.payment-row.user-row > .upf-student-tools .upf-label {
  padding: 0 12px !important;
  background: #f3f0ff !important;
  border: 1px solid #d9d0ff !important;
  color: #42307d !important;
}

.payment-row.user-row > .upf-student-tools select {
  min-width: 170px !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid #d8d0c3 !important;
  color: #173d2d !important;
}

.payment-row.user-row > .upf-student-tools .upf-save {
  padding: 0 14px !important;
  border: 0 !important;
  background: #173d2d !important;
  color: #fff !important;
}

.payment-row.user-row > .upf-student-tools .upf-btn {
  padding: 0 12px !important;
  cursor: pointer !important;
}

.payment-row.user-row > .upf-student-tools .upf-notify {
  background: #ecfdf3 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row > .upf-student-tools .upf-logout {
  background: #fff5f5 !important;
  border: 1px solid #fecaca !important;
  color: #b42318 !important;
}

.payment-row.user-row > .upf-student-tools .upf-wa {
  background: #f0fff7 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row > .upf-student-tools .upf-parent {
  background: #f8fff0 !important;
  border: 1px solid #c7ef9d !important;
  color: #3b7a16 !important;
}

@media (max-width: 700px) {
  .payment-row.user-row > .upf-student-tools .upf-row {
    justify-content: center !important;
  }
}


/* DRABOTALEB_RESTORE_USERS_LEFT_PANELS_ONLY */

.users-left-panels-restored {
  display: grid !important;
  gap: 16px !important;
  direction: rtl !important;
}

.users-left-panels-restored .ulp-card {
  background: #fff !important;
  border: 1px solid #e6dfd2 !important;
  border-radius: 18px !important;
  padding: 18px !important;
  box-shadow: 0 16px 42px rgba(24,61,47,.06) !important;
  direction: rtl !important;
}

.users-left-panels-restored .ulp-card h3 {
  margin: 0 0 8px !important;
  color: #173d2d !important;
  font-size: 20px !important;
  font-weight: 900 !important;
}

.users-left-panels-restored .ulp-card p {
  margin: 0 0 12px !important;
  color: #667085 !important;
  font-weight: 800 !important;
  line-height: 1.7 !important;
}

.users-left-panels-restored input,
.users-left-panels-restored textarea {
  width: 100% !important;
  box-sizing: border-box !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 12px !important;
  padding: 12px !important;
  background: #fff !important;
  font: inherit !important;
  margin-bottom: 9px !important;
}

.users-left-panels-restored textarea {
  min-height: 90px !important;
  resize: vertical !important;
}

.users-left-panels-restored button {
  width: 100% !important;
  border: 0 !important;
  background: #173d2d !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 10px 14px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.users-left-panels-restored .ulp-counter {
  text-align: left !important;
  color: #667085 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  margin: -2px 0 8px !important;
}

.users-left-panels-restored small {
  display: block !important;
  margin-top: 8px !important;
  font-weight: 900 !important;
}

.users-left-panels-restored .ulp-list {
  display: grid !important;
  gap: 10px !important;
}

.users-left-panels-restored .ulp-item {
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  padding: 11px !important;
  background: #fbfaf7 !important;
  cursor: pointer !important;
}

.users-left-panels-restored .ulp-item.danger {
  background: #fff5f5 !important;
  border-color: #fecaca !important;
}

.users-left-panels-restored .ulp-item.warn {
  background: #fffbeb !important;
  border-color: #fedf89 !important;
}

.users-left-panels-restored .ulp-item strong,
.users-left-panels-restored .ulp-live strong {
  display: block !important;
  color: #173d2d !important;
  font-weight: 900 !important;
  margin-bottom: 5px !important;
}

.users-left-panels-restored .ulp-item small,
.users-left-panels-restored .ulp-live small {
  display: block !important;
  color: #667085 !important;
  font-weight: 800 !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

.users-left-panels-restored .ulp-live {
  display: grid !important;
  grid-template-columns: 34px 1fr !important;
  gap: 10px !important;
  align-items: start !important;
  padding: 10px !important;
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  background: #fbfaf7 !important;
}

.users-left-panels-restored .ulp-live > span {
  width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  display: grid !important;
  place-items: center !important;
  background: #173d2d !important;
  color: #fff !important;
  font-weight: 900 !important;
}

.payment-row.user-row.ulp-focus-hidden {
  display: none !important;
}

.payment-row.user-row.ulp-focus-highlight {
  outline: 2px solid #d6a23a !important;
  box-shadow: 0 18px 45px rgba(214,162,58,.14) !important;
}


/* USERS_CARDS_GARBAGE_CLEANUP */
.payment-row.user-row {
  direction: rtl !important;
}

.payment-row.user-row * {
  box-sizing: border-box;
}

.payment-row.user-row .users-left-panels-restored,
.payment-row.user-row #usersLeftPanelsRestored {
  display: none !important;
}

/* متنساش: الشريط الجانبي الأيسر السليم خارج الكروت سيظل ظاهرًا */
.users-left-panels-restored {
  display: grid !important;
}


/* USERS_PAGE_ENHANCEMENTS_CLEAN_FINAL */

/* اخفاء كل بقايا التجارب القديمة فقط */
.payment-row.user-row .upf-student-tools,
.payment-row.user-row .student-tools-simple,
.payment-row.user-row .student-management-stable,
.payment-row.user-row .student-management-panel-v1,
.payment-row.user-row .student-supervisor-external,
.payment-row.user-row .student-supervisor-clean-v2,
.payment-row.user-row .user-crm-quick-actions-v1,
.payment-row.user-row .user-crm-quick-actions-v5,
.payment-row.user-row .user-crm-quick-actions-v6,
.payment-row.user-row .user-crm-quick-actions-horizontal-v4,
.payment-row.user-row .stable-supervisor-area,
.payment-row.user-row .stable-quick-actions,
.payment-row.user-row .stable-action,
.payment-row.user-row .stable-save-supervisor {
  display: none !important;
}

/* كارت الطالب يفضل طبيعي */
.payment-row.user-row {
  direction: rtl !important;
  writing-mode: horizontal-tb !important;
  overflow: visible !important;
}

.payment-row.user-row.uab-hidden-by-supervisor {
  display: none !important;
}

/* الصفين المطلوبين تحت الأزرار الأساسية */
.payment-row.user-row > .uab-tools {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 12px 0 0 !important;
  padding: 12px 16px !important;
  border: 1px solid #eadfcd !important;
  border-radius: 16px !important;
  background: #fffaf2 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 9px !important;
  direction: rtl !important;
  text-align: right !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  clear: both !important;
  float: none !important;
}

.payment-row.user-row > .uab-tools .uab-row {
  width: 100% !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  direction: rtl !important;
  writing-mode: horizontal-tb !important;
  position: static !important;
  transform: none !important;
}

.payment-row.user-row > .uab-tools .uab-label,
.payment-row.user-row > .uab-tools select,
.payment-row.user-row > .uab-tools button,
.payment-row.user-row > .uab-tools a {
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  cursor: pointer !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  direction: rtl !important;
  rotate: 0deg !important;
  float: none !important;
}

.payment-row.user-row > .uab-tools .uab-label {
  padding: 0 12px !important;
  background: #f3f0ff !important;
  border: 1px solid #d9d0ff !important;
  color: #42307d !important;
}

.payment-row.user-row > .uab-tools select {
  min-width: 170px !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid #d8d0c3 !important;
  color: #173d2d !important;
}

.payment-row.user-row > .uab-tools .uab-save {
  padding: 0 14px !important;
  border: 0 !important;
  background: #173d2d !important;
  color: #fff !important;
}

.payment-row.user-row > .uab-tools .uab-btn {
  padding: 0 12px !important;
}

.payment-row.user-row > .uab-tools .uab-notify {
  background: #ecfdf3 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row > .uab-tools .uab-logout {
  background: #fff5f5 !important;
  border: 1px solid #fecaca !important;
  color: #b42318 !important;
}

.payment-row.user-row > .uab-tools .uab-wa {
  background: #f0fff7 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row > .uab-tools .uab-parent {
  background: #f8fff0 !important;
  border: 1px solid #c7ef9d !important;
  color: #3b7a16 !important;
}

/* فلتر المشرف */
.uab-supervisor-filter {
  min-width: 180px !important;
  height: 44px !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 12px !important;
  padding: 0 12px !important;
  background: #fff !important;
  font-weight: 900 !important;
}

/* يسار الصفحة */
.uab-left-panels {
  display: grid !important;
  gap: 16px !important;
  direction: rtl !important;
}

.uab-left-card {
  background: #fff !important;
  border: 1px solid #e6dfd2 !important;
  border-radius: 18px !important;
  padding: 18px !important;
  box-shadow: 0 16px 42px rgba(24,61,47,.06) !important;
}

.uab-left-card h3 {
  margin: 0 0 8px !important;
  color: #173d2d !important;
  font-size: 20px !important;
  font-weight: 900 !important;
}

.uab-left-card p {
  margin: 0 0 12px !important;
  color: #667085 !important;
  font-weight: 800 !important;
  line-height: 1.7 !important;
}

.uab-left-card input,
.uab-left-card textarea {
  width: 100% !important;
  box-sizing: border-box !important;
  border: 1px solid #d8d0c3 !important;
  border-radius: 12px !important;
  padding: 12px !important;
  background: #fff !important;
  font: inherit !important;
  margin-bottom: 9px !important;
}

.uab-left-card textarea {
  min-height: 90px !important;
  resize: vertical !important;
}

.uab-left-card button {
  width: 100% !important;
  border: 0 !important;
  background: #173d2d !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 10px 14px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.uab-counter {
  text-align: left !important;
  color: #667085 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  margin: -2px 0 8px !important;
}

.uab-left-list {
  display: grid !important;
  gap: 10px !important;
}

.uab-left-item {
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  padding: 11px !important;
  background: #fbfaf7 !important;
  cursor: pointer !important;
}

.uab-left-item.warn {
  background: #fff5f5 !important;
  border-color: #fecaca !important;
}

.uab-left-item strong,
.uab-live-item strong {
  display: block !important;
  color: #173d2d !important;
  font-weight: 900 !important;
  margin-bottom: 5px !important;
}

.uab-left-item small,
.uab-live-item small {
  display: block !important;
  color: #667085 !important;
  font-weight: 800 !important;
  line-height: 1.6 !important;
}

.uab-live-item {
  display: grid !important;
  grid-template-columns: 34px 1fr !important;
  gap: 10px !important;
  align-items: start !important;
  padding: 10px !important;
  border: 1px solid #eee7dc !important;
  border-radius: 14px !important;
  background: #fbfaf7 !important;
}

.uab-live-item > span {
  width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  display: grid !important;
  place-items: center !important;
  background: #173d2d !important;
  color: #fff !important;
  font-weight: 900 !important;
}

.payment-row.user-row.uab-focus {
  outline: 2px solid #d6a23a !important;
  box-shadow: 0 18px 45px rgba(214,162,58,.16) !important;
}

@media (max-width: 700px) {
  .payment-row.user-row > .uab-tools .uab-row {
    justify-content: center !important;
  }
}


/* DRABOTALEB_UAB_TOOLS_INSIDE_ACTIONS_FINAL */

/* صف الأزرار الأساسي يسمح بصف ثالث تحته */
.payment-row.user-row .pay-actions.user-actions-split {
  width: 100% !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px 16px !important;
  direction: rtl !important;
  position: relative !important;
  overflow: visible !important;
}

/* مجموعة ملف/دفع/درجات/نشاط على اليمين */
.payment-row.user-row .pay-actions.user-actions-split .user-quick-links {
  order: 1 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

/* مجموعة تفعيل/إيقاف/حذف على الشمال */
.payment-row.user-row .pay-actions.user-actions-split .user-state-actions {
  order: 2 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-inline-start: auto !important;
}

/* البانل الجديد داخل صف الأزرار، تحت الأزرار الأساسية بعرض كامل */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools {
  order: 3 !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 10px 0 0 !important;
  padding: 12px 14px !important;
  border: 1px solid #eadfcd !important;
  border-radius: 16px !important;
  background: #fffaf2 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 9px !important;
  direction: rtl !important;
  text-align: right !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  clear: both !important;
  float: none !important;
}

/* الصفين من اليمين */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-row {
  width: 100% !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  direction: rtl !important;
  writing-mode: horizontal-tb !important;
  position: static !important;
  transform: none !important;
}

/* منع أي CSS قديم من تحويل العناصر لعمود */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools *,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-label,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools select,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools button,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools a {
  writing-mode: horizontal-tb !important;
  transform: none !important;
  position: static !important;
  float: none !important;
  rotate: 0deg !important;
}

/* شكل عناصر الصفين */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-label,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools select,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools button,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools a {
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-label {
  padding: 0 12px !important;
  background: #f3f0ff !important;
  border: 1px solid #d9d0ff !important;
  color: #42307d !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools select {
  min-width: 170px !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid #d8d0c3 !important;
  color: #173d2d !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-save {
  padding: 0 14px !important;
  border: 0 !important;
  background: #173d2d !important;
  color: #fff !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-btn {
  padding: 0 12px !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-notify {
  background: #ecfdf3 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-logout {
  background: #fff5f5 !important;
  border: 1px solid #fecaca !important;
  color: #b42318 !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-wa {
  background: #f0fff7 !important;
  border: 1px solid #abefc6 !important;
  color: #067647 !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-parent {
  background: #f8fff0 !important;
  border: 1px solid #c7ef9d !important;
  color: #3b7a16 !important;
}

/* اخفاء أي uab-tools قديمة لو كانت برا pay-actions */
.payment-row.user-row > .uab-tools {
  display: none !important;
}

/* لكن اللي جوه pay-actions يظهر */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools {
  display: grid !important;
}


/* DRABOTALEB_USERS_CARD_ACTIONS_FINAL_POLISH */

/* منع التداخل بين الأزرار الأساسية وصفوف الإدارة */
.payment-row.user-row .pay-actions.user-actions-split {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px 18px !important;
  align-items: center !important;
  direction: rtl !important;
  padding-top: 16px !important;
  margin-top: 8px !important;
  border-top: 1px dashed #eadfcd !important;
  overflow: visible !important;
}

/* أزرار ملف/دفع/درجات/نشاط */
.payment-row.user-row .pay-actions.user-actions-split .user-quick-links {
  grid-column: 1 / 2 !important;
  grid-row: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  position: static !important;
  transform: none !important;
  z-index: 2 !important;
}

/* أزرار تفعيل/إيقاف/حذف */
.payment-row.user-row .pay-actions.user-actions-split .user-state-actions {
  grid-column: 2 / 3 !important;
  grid-row: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  position: static !important;
  transform: none !important;
  z-index: 2 !important;
}

/* صفوف الإدارة تحت الأزرار الأساسية مباشرة */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 2px 0 0 !important;
  padding: 12px 14px !important;
  border: 1px solid #eadfcd !important;
  border-radius: 16px !important;
  background: #fffaf2 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 9px !important;
  box-sizing: border-box !important;
  direction: rtl !important;
  text-align: right !important;
  position: static !important;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  z-index: 1 !important;
}

/* الصفين من اليمين */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-row {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  direction: rtl !important;
}

/* الأزرار تبقى هادية وصغيرة */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-label,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools select,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools button,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools a {
  height: 32px !important;
  min-height: 32px !important;
  font-size: 12px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
  writing-mode: horizontal-tb !important;
  position: static !important;
  transform: none !important;
}

/* إزالة أي نسخة اتضافت برا صف الأزرار */
.payment-row.user-row > .uab-tools {
  display: none !important;
}

/* النسخة الصحيحة داخل pay-actions فقط */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools {
  display: grid !important;
}

/* موبايل */
@media (max-width: 900px) {
  .payment-row.user-row .pay-actions.user-actions-split {
    grid-template-columns: 1fr !important;
  }

  .payment-row.user-row .pay-actions.user-actions-split .user-quick-links,
  .payment-row.user-row .pay-actions.user-actions-split .user-state-actions,
  .payment-row.user-row .pay-actions.user-actions-split > .uab-tools {
    grid-column: 1 / -1 !important;
    justify-content: center !important;
  }
}


/* DRABOTALEB_UAB_TOOLS_VISUAL_POLISH_FINAL */

/* ظبط مساحة صفوف إدارة الطالب */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools {
  margin-top: 8px !important;
  padding: 10px 12px !important;
  min-height: unset !important;
  background: #fffaf4 !important;
  border: 1px solid #eadfcd !important;
  border-radius: 14px !important;
  gap: 7px !important;
}

/* الصفين يمين وبشكل واضح */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-row {
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 32px !important;
}

/* الصف الأول */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-supervisor-row {
  padding-bottom: 2px !important;
}

/* الصف الثاني */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-actions-row {
  padding-top: 2px !important;
}

/* حجم موحد وهادئ */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-label,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools select,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools button,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools a {
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 11px !important;
  font-size: 11.5px !important;
  line-height: 1 !important;
}

/* زر الحفظ أصغر شوية */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-save {
  min-width: 54px !important;
  padding-inline: 13px !important;
}

/* السليكت أهدى */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools select {
  min-width: 155px !important;
  max-width: 190px !important;
}

/* شارة المشرف لا تتمدد */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-label {
  max-width: 260px !important;
}

/* إزالة أي فراغ أو قشرة قديمة في الجانب الأيسر */
.uab-left-panels + section,
.uab-left-panels + article {
  display: none !important;
}

/* إخفاء كروت placeholder القديمة بالعنوان */
section:has(h3):has(*) h3,
article:has(h3):has(*) h3 {
  writing-mode: horizontal-tb !important;
}

/* حماية الكروت الجديدة */
#uabLeftPanels,
.uab-left-panels {
  display: grid !important;
}

@media (max-width: 900px) {
  .payment-row.user-row .pay-actions.user-actions-split > .uab-tools .uab-row {
    justify-content: center !important;
  }
}


/* ===== UAB SAFE USERS TOOLS ONLY ===== */

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 8px !important;
  margin: 6px 0 0 !important;
  gap: 7px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(217, 119, 6, 0.18) !important;
  background: rgba(255, 251, 235, 0.55) !important;
  box-sizing: border-box !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-label,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] select,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] button,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] a {
  height: 29px !important;
  min-height: 29px !important;
  max-height: 29px !important;
  padding: 0 10px !important;
  margin: 0 !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  line-height: 29px !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-label {
  display: inline-flex !important;
  align-items: center !important;
  background: #eef2ff !important;
  color: #3730a3 !important;
  font-weight: 800 !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] select {
  width: 160px !important;
  min-width: 145px !important;
  max-width: 190px !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  background: #fff !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] button,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  cursor: pointer !important;
  font-weight: 800 !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-save {
  background: #064e3b !important;
  color: #fff !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-notify {
  background: #dcfce7 !important;
  color: #166534 !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-logout {
  background: #ffe4e6 !important;
  color: #be123c !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-wa {
  background: #ecfdf5 !important;
  color: #047857 !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-parent {
  background: #fef3c7 !important;
  color: #92400e !important;
}

@media (max-width: 768px) {
  .payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] {
    padding: 7px !important;
  }

  .payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] select {
    flex: 1 1 140px !important;
  }

  .payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] button,
  .payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] a {
    flex: 1 1 auto !important;
  }
}

/* ===== USERS PAGE TWO ROWS FINAL LAYOUT ===== */

/* منطقة أزرار كارت الطالب كلها صفين فقط */
.payment-row.user-row .pay-actions.user-actions-split {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
}

/* أزرار ملف/دفع/درجات/نشاط على أقصى اليمين */
.payment-row.user-row .pay-actions.user-actions-split > .user-quick-links {
  order: 1 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 7px !important;
  width: auto !important;
  margin-inline-start: auto !important;
}

/* تفعيل/إيقاف/حذف تفضل في نفس الصف ناحية الشمال */
.payment-row.user-row .pay-actions.user-actions-split > .user-state-actions {
  order: 3 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 7px !important;
  width: auto !important;
  margin-inline-start: 0 !important;
}

/* نخلي صندوق uab مجرد حاوية غير مرئية عشان صفوفه تدخل مع أزرار الكارت */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] {
  display: contents !important;
}

/* إشعار خاص + خروج الأجهزة جنب ملف/دفع/درجات/نشاط في الصف الأول */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-actions-row {
  order: 2 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* الصف الثاني بعرض كامل */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-supervisor-row {
  order: 4 !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  margin: 2px 0 0 !important;
  padding: 8px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(217, 119, 6, 0.18) !important;
  background: rgba(255, 251, 235, 0.48) !important;
  box-sizing: border-box !important;
}

/* توحيد حجم كل أزرار الصفين */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] button,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] a,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] select,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-label {
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 10px !important;
  margin: 0 !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  line-height: 28px !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

/* اختيار المشرف */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] select {
  width: 155px !important;
  min-width: 145px !important;
  max-width: 180px !important;
}

/* زر حفظ */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-save {
  min-width: 52px !important;
}

/* موبايل: يفضلوا مضغوطين */
@media (max-width: 768px) {
  .payment-row.user-row .pay-actions.user-actions-split {
    gap: 6px !important;
  }

  .payment-row.user-row .pay-actions.user-actions-split > .user-quick-links,
  .payment-row.user-row .pay-actions.user-actions-split > .user-state-actions,
  .payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-actions-row {
    gap: 5px !important;
  }

  .payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-supervisor-row {
    padding: 7px !important;
    gap: 5px !important;
  }
}


/* ===== USERS PAGE FINAL ACTION ROW + PROFESSIONAL MODAL ===== */

/* الصف العام: يمين ويسار */
.payment-row.user-row .pay-actions.user-actions-split {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
  direction: rtl !important;
}

/* ملف/دفع/درجات/نشاط على أقصى اليمين */
.payment-row.user-row .pay-actions.user-actions-split > .user-quick-links {
  order: 1 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  width: auto !important;
  margin-inline-end: 0 !important;
  margin-inline-start: 0 !important;
}

/* uab container غير مرئي لتوزيع الصفوف */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] {
  display: contents !important;
}

/* إشعار خاص + خروج الأجهزة جنب أزرار ملف/دفع/درجات/نشاط */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-actions-row {
  order: 2 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  width: auto !important;
  margin-inline-end: 0 !important;
  margin-inline-start: auto !important;
  padding: 0 !important;
}

/* تفعيل/إيقاف/حذف على أقصى الشمال */
.payment-row.user-row .pay-actions.user-actions-split > .user-state-actions {
  order: 3 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 7px !important;
  width: auto !important;
  margin-inline-start: auto !important;
}

/* الصف الثاني */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-supervisor-row {
  order: 4 !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  margin: 2px 0 0 !important;
  padding: 8px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(217, 119, 6, 0.18) !important;
  background: rgba(255, 251, 235, 0.48) !important;
  box-sizing: border-box !important;
}

/* حجم أزرار الإضافة */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] button,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] a,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] select,
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-label {
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 10px !important;
  margin: 0 !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  line-height: 28px !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] select {
  width: 175px !important;
  min-width: 155px !important;
  max-width: 220px !important;
}

/* ===== Professional Modal ===== */

.uab-modal-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 18px !important;
  background: rgba(15, 23, 42, 0.52) !important;
  backdrop-filter: blur(6px) !important;
}

.uab-modal-backdrop.is-open {
  display: flex !important;
}

.uab-modal-card {
  width: min(560px, 96vw) !important;
  max-height: 90vh !important;
  overflow: auto !important;
  border-radius: 22px !important;
  background: #fffaf0 !important;
  border: 1px solid rgba(217, 119, 6, 0.22) !important;
  box-shadow: 0 24px 80px rgba(15, 23, 42, 0.28) !important;
  direction: rtl !important;
  animation: uabModalIn 0.18s ease-out !important;
}

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

.uab-modal-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 18px 20px 12px !important;
  border-bottom: 1px solid rgba(217, 119, 6, 0.14) !important;
}

.uab-modal-header h3 {
  margin: 0 !important;
  color: #0f3f2e !important;
  font-size: 20px !important;
  font-weight: 900 !important;
}

.uab-modal-header p {
  margin: 6px 0 0 !important;
  color: #64748b !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

.uab-modal-close {
  width: 34px !important;
  height: 34px !important;
  border-radius: 999px !important;
  border: 0 !important;
  background: #fee2e2 !important;
  color: #b91c1c !important;
  font-size: 22px !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.uab-modal-body {
  display: grid !important;
  gap: 14px !important;
  padding: 16px 20px !important;
}

.uab-modal-body label {
  display: grid !important;
  gap: 7px !important;
  color: #0f3f2e !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}

.uab-modal-body input,
.uab-modal-body textarea {
  width: 100% !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  border-radius: 14px !important;
  background: #fff !important;
  padding: 11px 12px !important;
  color: #102a1f !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  outline: none !important;
  box-sizing: border-box !important;
}

.uab-modal-body textarea {
  resize: vertical !important;
  min-height: 130px !important;
}

.uab-modal-body input:focus,
.uab-modal-body textarea:focus {
  border-color: #d97706 !important;
  box-shadow: 0 0 0 4px rgba(217, 119, 6, 0.12) !important;
}

.uab-modal-hint {
  padding: 10px 12px !important;
  border-radius: 14px !important;
  background: #ecfdf5 !important;
  color: #047857 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.uab-modal-actions {
  display: flex !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  padding: 0 20px 18px !important;
}

.uab-modal-actions button {
  height: 40px !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 18px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.uab-modal-cancel {
  background: #e5e7eb !important;
  color: #374151 !important;
}

.uab-modal-send {
  background: #0f3f2e !important;
  color: #fff !important;
}

@media (max-width: 768px) {
  .payment-row.user-row .pay-actions.user-actions-split > .user-quick-links,
  .payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-actions-row,
  .payment-row.user-row .pay-actions.user-actions-split > .user-state-actions {
    gap: 5px !important;
  }

  .uab-modal-card {
    border-radius: 18px !important;
  }
}

/* ===== USERS ACTIONS ALIGNMENT POLISH ===== */

/* الصف الأول: quick links + notification/logout يمين، status actions شمال */
.payment-row.user-row .pay-actions.user-actions-split {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  width: 100% !important;
  direction: rtl !important;
}

/* ملف / دفع / درجات / نشاط */
.payment-row.user-row .pay-actions.user-actions-split > .user-quick-links {
  order: 1 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  width: auto !important;
  margin: 0 !important;
}

/* إشعار خاص / خروج الأجهزة ملاصقين للأربع أزرار */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] {
  display: contents !important;
}

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-actions-row {
  order: 2 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* تفعيل / إيقاف / حذف على أقصى الشمال */
.payment-row.user-row .pay-actions.user-actions-split > .user-state-actions {
  order: 3 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 7px !important;
  width: auto !important;
  margin-inline-start: auto !important;
  margin-inline-end: 0 !important;
}

/* الصف الثاني كما هو */
.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-supervisor-row {
  order: 4 !important;
  flex: 0 0 100% !important;
  width: 100% !important;
}

/* إخفاء صندوق الملاحظة القديم إن وجد */
.uab-modal-hint {
  display: none !important;
}


/* ===== UAB USERS SMART FOLLOWUP PHASE 1 ===== */

.uab-smart-followup-panel {
  margin: 14px 0 !important;
  padding: 14px !important;
  border-radius: 22px !important;
  border: 1px solid rgba(217, 119, 6, 0.18) !important;
  background: rgba(255, 250, 240, 0.78) !important;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.06) !important;
  direction: rtl !important;
}

.uab-smart-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 12px !important;
}

.uab-smart-head h3 {
  margin: 0 !important;
  color: #0f3f2e !important;
  font-size: 20px !important;
  font-weight: 900 !important;
}

.uab-smart-head p {
  margin: 5px 0 0 !important;
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.uab-clear-filter {
  height: 34px !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #0f3f2e !important;
  color: #fff !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.uab-smart-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(110px, 1fr)) !important;
  gap: 9px !important;
  margin-bottom: 12px !important;
}

.uab-smart-card {
  min-height: 70px !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-radius: 18px !important;
  background: #fff !important;
  padding: 10px !important;
  text-align: right !important;
  cursor: pointer !important;
  transition: 0.18s ease !important;
}

.uab-smart-card:hover,
.uab-smart-card.is-active {
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.09) !important;
  border-color: rgba(15, 63, 46, 0.4) !important;
}

.uab-smart-card span {
  display: block !important;
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.uab-smart-card strong {
  display: block !important;
  margin-top: 5px !important;
  color: #0f3f2e !important;
  font-size: 24px !important;
  font-weight: 1000 !important;
}

.uab-smart-card.danger {
  background: #fff1f2 !important;
}

.uab-smart-card.warning {
  background: #fffbeb !important;
}

.uab-smart-card.info {
  background: #eff6ff !important;
}

.uab-smart-bottom {
  display: grid !important;
  grid-template-columns: minmax(260px, 0.9fr) minmax(280px, 1.1fr) !important;
  gap: 12px !important;
}

.uab-broadcast-box,
.uab-followup-box {
  border-radius: 18px !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  background: rgba(255, 255, 255, 0.82) !important;
  padding: 12px !important;
}

.uab-broadcast-box h4,
.uab-followup-box h4 {
  margin: 0 0 10px !important;
  color: #0f3f2e !important;
  font-size: 15px !important;
  font-weight: 900 !important;
}

.uab-broadcast-box input,
.uab-broadcast-box textarea {
  width: 100% !important;
  box-sizing: border-box !important;
  margin-bottom: 8px !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
  border-radius: 12px !important;
  padding: 9px 10px !important;
  background: #fff !important;
  font-weight: 700 !important;
  outline: none !important;
}

.uab-broadcast-box input:focus,
.uab-broadcast-box textarea:focus {
  border-color: #d97706 !important;
  box-shadow: 0 0 0 4px rgba(217, 119, 6, 0.1) !important;
}

.uab-broadcast-actions {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
}

.uab-broadcast-actions button {
  height: 34px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #0f3f2e !important;
  color: #fff !important;
  padding: 0 14px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.uab-broadcast-actions button:disabled {
  opacity: 0.7 !important;
  cursor: wait !important;
}

.uab-broadcast-actions small {
  font-size: 12px !important;
  font-weight: 800 !important;
}

.uab-broadcast-actions small.success {
  color: #15803d !important;
}

.uab-broadcast-actions small.error {
  color: #b91c1c !important;
}

.uab-followup-list {
  display: grid !important;
  gap: 7px !important;
}

.uab-followup-item {
  display: grid !important;
  grid-template-columns: 30px 1fr !important;
  align-items: center !important;
  gap: 8px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #fff7ed !important;
  padding: 8px !important;
  text-align: right !important;
}

.uab-followup-item b {
  width: 26px !important;
  height: 26px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: #0f3f2e !important;
  color: #fff !important;
  font-size: 12px !important;
}

.uab-followup-item strong {
  display: block !important;
  color: #0f3f2e !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

.uab-followup-item small {
  display: block !important;
  margin-top: 2px !important;
  color: #92400e !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

.uab-followup-empty {
  padding: 12px !important;
  border-radius: 14px !important;
  background: #ecfdf5 !important;
  color: #047857 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}

.payment-row.user-row.uab-smart-hidden {
  display: none !important;
}

.payment-row.user-row {
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}

.payment-row.user-row.uab-risk-danger {
  border-color: rgba(225, 29, 72, 0.35) !important;
  box-shadow: inset 4px 0 0 #e11d48 !important;
}

.payment-row.user-row.uab-risk-warning {
  border-color: rgba(217, 119, 6, 0.35) !important;
  box-shadow: inset 4px 0 0 #d97706 !important;
}

.payment-row.user-row.uab-risk-new {
  border-color: rgba(37, 99, 235, 0.28) !important;
  box-shadow: inset 4px 0 0 #2563eb !important;
}

.payment-row.user-row.uab-risk-active {
  border-color: rgba(22, 163, 74, 0.22) !important;
  box-shadow: inset 4px 0 0 #16a34a !important;
}

.uab-student-risk-badge {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  margin-top: 7px !important;
  padding: 5px 8px !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
}

.uab-student-risk-badge span {
  color: #0f3f2e !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

.uab-student-risk-badge small {
  color: #64748b !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}

@media (max-width: 1100px) {
  .uab-smart-grid {
    grid-template-columns: repeat(3, minmax(110px, 1fr)) !important;
  }

  .uab-smart-bottom {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 700px) {
  .uab-smart-grid {
    grid-template-columns: repeat(2, minmax(110px, 1fr)) !important;
  }

  .uab-smart-head {
    align-items: flex-start !important;
    flex-direction: column !important;
  }
}


/* ===== UAB USERS SMART LAYOUT PHASE 2 ===== */

.kpi-row.uab-kpi-replaced {
  display: block !important;
  margin-bottom: 20px !important;
}

.kpi-row.uab-kpi-replaced .uab-smart-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(120px, 1fr)) !important;
  gap: 12px !important;
  margin: 0 !important;
}

#uabSmartFollowupPanel {
  margin: 0 !important;
}

#uabSmartFollowupPanel[style*="display: none"] {
  display: none !important;
}

.uab-left-smart-tools {
  display: grid !important;
  gap: 14px !important;
  margin-bottom: 14px !important;
}

.uab-left-smart-tools .uab-broadcast-box,
.uab-left-smart-tools .uab-followup-box {
  width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 20px !important;
  border: 1px solid rgba(217, 119, 6, 0.16) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06) !important;
}

.uab-broadcast-audience {
  width: 100% !important;
  height: 38px !important;
  margin-bottom: 8px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
  background: #fff !important;
  padding: 0 10px !important;
  color: #0f3f2e !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  outline: none !important;
}

.uab-broadcast-audience:focus {
  border-color: #d97706 !important;
  box-shadow: 0 0 0 4px rgba(217, 119, 6, 0.1) !important;
}

.uab-left-smart-tools .uab-followup-list {
  max-height: 360px !important;
  overflow: auto !important;
  padding-inline-end: 3px !important;
}

@media (max-width: 1200px) {
  .kpi-row.uab-kpi-replaced .uab-smart-grid {
    grid-template-columns: repeat(3, minmax(120px, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  .kpi-row.uab-kpi-replaced .uab-smart-grid {
    grid-template-columns: repeat(2, minmax(120px, 1fr)) !important;
  }
}


/* ===== FIX DUPLICATE LEFT SMART WIDGETS STYLE ===== */

.uab-left-smart-tools {
  display: grid !important;
  gap: 14px !important;
}

.uab-left-smart-tools .uab-left-single-widget {
  margin: 0 !important;
}

.uab-left-smart-tools .uab-broadcast-box + .uab-broadcast-box,
.uab-left-smart-tools .uab-followup-box + .uab-followup-box {
  display: none !important;
}

.uab-left-smart-tools .uab-broadcast-actions button {
  min-width: 96px !important;
}


/* ===== STABLE LEFT SMART WIDGETS NO FLICKER ===== */

.uab-stable-left-widgets {
  display: grid !important;
  gap: 14px !important;
  margin-bottom: 14px !important;
}

.uab-stable-left-widgets .uab-broadcast-box,
.uab-stable-left-widgets .uab-followup-box {
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 20px !important;
  border: 1px solid rgba(217, 119, 6, 0.16) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06) !important;
}

.uab-stable-left-widgets #uabStableSendBroadcast {
  min-width: 120px !important;
}

.uab-stable-left-widgets .uab-followup-list {
  max-height: 360px !important;
  overflow: auto !important;
  padding-inline-end: 3px !important;
}


/* ===== UAB SINGLE STABLE SMART DASHBOARD FINAL ===== */

#uabSmartFollowupPanel,
.uab-smart-followup-panel {
  display: none !important;
}

.kpi-row.uab-kpi-stable-smart {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(120px, 1fr)) !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
}

.kpi-row.uab-kpi-stable-smart .uab-smart-card {
  min-height: 76px !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-radius: 18px !important;
  background: #fff !important;
  padding: 11px !important;
  text-align: right !important;
  cursor: pointer !important;
  transition: 0.18s ease !important;
}

.kpi-row.uab-kpi-stable-smart .uab-smart-card:hover,
.kpi-row.uab-kpi-stable-smart .uab-smart-card.is-active {
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.09) !important;
  border-color: rgba(15, 63, 46, 0.42) !important;
}

.kpi-row.uab-kpi-stable-smart .uab-smart-card span {
  display: block !important;
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.kpi-row.uab-kpi-stable-smart .uab-smart-card strong {
  display: block !important;
  margin-top: 5px !important;
  color: #0f3f2e !important;
  font-size: 25px !important;
  font-weight: 1000 !important;
}

.kpi-row.uab-kpi-stable-smart .uab-smart-card.danger {
  background: #fff1f2 !important;
}

.kpi-row.uab-kpi-stable-smart .uab-smart-card.warning {
  background: #fffbeb !important;
}

.kpi-row.uab-kpi-stable-smart .uab-smart-card.info {
  background: #eff6ff !important;
}

.uab-stable-left-widgets {
  display: grid !important;
  gap: 14px !important;
  margin-bottom: 14px !important;
}

.uab-stable-left-widgets .uab-broadcast-box,
.uab-stable-left-widgets .uab-followup-box {
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 20px !important;
  border: 1px solid rgba(217, 119, 6, 0.16) !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06) !important;
  padding: 12px !important;
}

.uab-stable-left-widgets h4 {
  margin: 0 0 10px !important;
  color: #0f3f2e !important;
  font-size: 15px !important;
  font-weight: 900 !important;
}

.uab-broadcast-audience,
.uab-stable-left-widgets input,
.uab-stable-left-widgets textarea {
  width: 100% !important;
  box-sizing: border-box !important;
  margin-bottom: 8px !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
  border-radius: 12px !important;
  background: #fff !important;
  padding: 9px 10px !important;
  color: #0f3f2e !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  outline: none !important;
}

.uab-broadcast-audience {
  height: 38px !important;
  padding: 0 10px !important;
}

.uab-broadcast-actions {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
}

.uab-broadcast-actions button {
  height: 34px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #0f3f2e !important;
  color: #fff !important;
  padding: 0 14px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.uab-broadcast-actions small.success {
  color: #15803d !important;
  font-weight: 800 !important;
}

.uab-broadcast-actions small.error {
  color: #b91c1c !important;
  font-weight: 800 !important;
}

.uab-followup-list {
  display: grid !important;
  gap: 7px !important;
  max-height: 360px !important;
  overflow: auto !important;
  padding-inline-end: 3px !important;
}

.uab-followup-item {
  display: grid !important;
  grid-template-columns: 30px 1fr !important;
  align-items: center !important;
  gap: 8px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #fff7ed !important;
  padding: 8px !important;
  text-align: right !important;
}

.uab-followup-item b {
  width: 26px !important;
  height: 26px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: #0f3f2e !important;
  color: #fff !important;
  font-size: 12px !important;
}

.uab-followup-item strong {
  display: block !important;
  color: #0f3f2e !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

.uab-followup-item small {
  display: block !important;
  margin-top: 2px !important;
  color: #92400e !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

.payment-row.user-row.uab-smart-hidden {
  display: none !important;
}

.payment-row.user-row.uab-risk-danger {
  border-color: rgba(225, 29, 72, 0.35) !important;
  box-shadow: inset 4px 0 0 #e11d48 !important;
}

.payment-row.user-row.uab-risk-warning {
  border-color: rgba(217, 119, 6, 0.35) !important;
  box-shadow: inset 4px 0 0 #d97706 !important;
}

.payment-row.user-row.uab-risk-new {
  border-color: rgba(37, 99, 235, 0.28) !important;
  box-shadow: inset 4px 0 0 #2563eb !important;
}

.payment-row.user-row.uab-risk-active {
  border-color: rgba(22, 163, 74, 0.22) !important;
  box-shadow: inset 4px 0 0 #16a34a !important;
}

.uab-student-risk-badge {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  margin-top: 7px !important;
  padding: 5px 8px !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
}

.uab-student-risk-badge span {
  color: #0f3f2e !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

.uab-student-risk-badge small {
  color: #64748b !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}

@media (max-width: 1200px) {
  .kpi-row.uab-kpi-stable-smart {
    grid-template-columns: repeat(3, minmax(120px, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  .kpi-row.uab-kpi-stable-smart {
    grid-template-columns: repeat(2, minmax(120px, 1fr)) !important;
  }
}


/* ===== UAB SUPERVISOR REAL SAVE + QUICK ADMIN NOTE ===== */

.payment-row.user-row .pay-actions.user-actions-split > .uab-tools[data-uab-safe-tools="1"] .uab-note {
  background: #eef2ff !important;
  color: #3730a3 !important;
}

.uab-admin-note-badge {
  display: block !important;
  margin-top: 7px !important;
  padding: 7px 10px !important;
  border-radius: 12px !important;
  background: #fffbeb !important;
  border: 1px solid rgba(217, 119, 6, 0.18) !important;
  color: #92400e !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.7 !important;
}

.uab-admin-note-badge strong {
  color: #0f3f2e !important;
  font-weight: 900 !important;
}


/* ===== UAB SUPERVISOR SAVE INLINE STATUS ===== */

.payment-row.user-row .uab-tool-status {
  display: inline-flex !important;
  align-items: center !important;
  height: 28px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}

.payment-row.user-row .uab-tool-status[hidden] {
  display: none !important;
}

.payment-row.user-row .uab-tool-status.success {
  background: #dcfce7 !important;
  color: #166534 !important;
}

.payment-row.user-row .uab-tool-status.error {
  background: #fee2e2 !important;
  color: #b91c1c !important;
}


/* ===== UAB ADMIN NOTE REMOVE BUTTON - SAFE SMALL FIX ===== */

.uab-admin-note-badge {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.uab-admin-note-badge .uab-note-remove {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #fee2e2 !important;
  color: #b91c1c !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.uab-admin-note-badge .uab-note-remove:disabled {
  opacity: 0.6 !important;
  cursor: wait !important;
}

.uab-admin-note-badge span {
  flex: 1 !important;
}


/* ===== UAB USERS NAME + SUPERVISOR FILTER ===== */

.uab-user-filterbar {
  margin: 12px 0 14px !important;
  padding: 13px !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(217, 119, 6, 0.15) !important;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.06) !important;
  direction: rtl !important;
}

.uab-user-filterbar-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 10px !important;
}

.uab-user-filterbar-head h4 {
  margin: 0 !important;
  color: #0f3f2e !important;
  font-size: 16px !important;
  font-weight: 900 !important;
}

.uab-user-filterbar-head p {
  margin: 4px 0 0 !important;
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.uab-user-filterbar-head span {
  display: inline-flex !important;
  align-items: center !important;
  height: 28px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  background: #ecfdf5 !important;
  color: #047857 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}

.uab-user-filterbar-controls {
  display: grid !important;
  grid-template-columns: minmax(240px, 1.5fr) minmax(210px, 1fr) auto !important;
  gap: 9px !important;
  align-items: center !important;
}

.uab-user-filterbar input,
.uab-user-filterbar select {
  width: 100% !important;
  height: 40px !important;
  box-sizing: border-box !important;
  border-radius: 13px !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
  background: #fff !important;
  color: #0f3f2e !important;
  padding: 0 11px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  outline: none !important;
}

.uab-user-filterbar input:focus,
.uab-user-filterbar select:focus {
  border-color: #d97706 !important;
  box-shadow: 0 0 0 4px rgba(217, 119, 6, 0.1) !important;
}

.uab-user-filterbar button {
  height: 40px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #0f3f2e !important;
  color: #fff !important;
  padding: 0 15px !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

.payment-row.user-row.uab-user-filter-hidden {
  display: none !important;
}

@media (max-width: 900px) {
  .uab-user-filterbar-controls {
    grid-template-columns: 1fr !important;
  }

  .uab-user-filterbar-head {
    flex-direction: column !important;
  }
}


/* ===== UAB USERS UNIFIED FILTERS FINAL ===== */

#uabUserNameSupervisorFilter {
  display: none !important;
}

.user-crm-filters.uab-unified-native-filters {
  display: grid !important;
  grid-template-columns: minmax(260px, 1.6fr) minmax(230px, 1.2fr) repeat(5, minmax(130px, 1fr)) auto !important;
  gap: 10px !important;
  align-items: center !important;
}

.user-crm-filters.uab-unified-native-filters .uab-filter-hidden-now {
  display: none !important;
}

.user-crm-filters.uab-unified-native-filters input,
.user-crm-filters.uab-unified-native-filters select {
  height: 42px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
  background: #fff !important;
  color: #0f3f2e !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  padding: 0 12px !important;
  outline: none !important;
}

.user-crm-filters.uab-unified-native-filters input:focus,
.user-crm-filters.uab-unified-native-filters select:focus {
  border-color: #d97706 !important;
  box-shadow: 0 0 0 4px rgba(217, 119, 6, 0.1) !important;
}

.uab-unified-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  background: #ecfdf5 !important;
  color: #047857 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}

.payment-row.user-row.uab-unified-filter-hidden {
  display: none !important;
}

@media (max-width: 1200px) {
  .user-crm-filters.uab-unified-native-filters {
    grid-template-columns: repeat(2, minmax(160px, 1fr)) !important;
  }

  .uab-unified-count {
    justify-self: start !important;
  }
}

@media (max-width: 700px) {
  .user-crm-filters.uab-unified-native-filters {
    grid-template-columns: 1fr !important;
  }
}


/* ===== UAB CLEAN OLD DUPLICATE FILTERS ===== */

.user-crm-filters.uab-unified-native-filters [data-user-filter="phone"],
.user-crm-filters.uab-unified-native-filters [data-user-filter="studentCode"],
.user-crm-filters.uab-unified-native-filters [data-user-filter="registeredFrom"],
.user-crm-filters.uab-unified-native-filters [data-user-filter="lastActivityFrom"],
.user-crm-filters.uab-unified-native-filters [data-user-filter="linked"] {
  display: none !important;
}

.user-crm-filters.uab-unified-native-filters {
  grid-template-columns: minmax(280px, 1.7fr) minmax(230px, 1.2fr) repeat(5, minmax(130px, 1fr)) auto !important;
}


/* ===== UAB SAFE DYNAMIC COURSE FILTER STYLE ===== */

.user-crm-filters [data-user-filter="phone"],
.user-crm-filters [data-user-filter="studentCode"],
#uabUserNameSupervisorFilter {
  display: none !important;
}

.user-crm-filters [data-user-filter="course"] {
  min-width: 230px !important;
}


/* ===== UAB USERS FILTERS SINGLE STABLE MODULE ===== */

#uabUserNameSupervisorFilter,
#uabUnifiedStudentSearch,
#uabUnifiedSupervisorFilter,
#uabUnifiedFiltersCount {
  display: none !important;
}

.user-crm-filters.uab-stable-filters {
  display: grid !important;
  grid-template-columns: minmax(260px, 1.6fr) minmax(220px, 1.2fr) repeat(5, minmax(120px, 1fr)) auto !important;
  gap: 10px !important;
  align-items: center !important;
}

.user-crm-filters.uab-stable-filters [data-user-filter="phone"],
.user-crm-filters.uab-stable-filters [data-user-filter="studentCode"],
.user-crm-filters.uab-stable-filters [data-user-filter="registeredFrom"],
.user-crm-filters.uab-stable-filters [data-user-filter="lastActivityFrom"],
.user-crm-filters.uab-stable-filters [data-user-filter="linked"] {
  display: none !important;
}

.user-crm-filters.uab-stable-filters input,
.user-crm-filters.uab-stable-filters select {
  height: 42px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
  background: #fff !important;
  color: #0f3f2e !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  padding: 0 12px !important;
  outline: none !important;
}

.uab-stable-filter-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  background: #ecfdf5 !important;
  color: #047857 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}

.payment-row.user-row.uab-stable-filter-hidden {
  display: none !important;
}

@media (max-width: 1200px) {
  .user-crm-filters.uab-stable-filters {
    grid-template-columns: repeat(2, minmax(160px, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  .user-crm-filters.uab-stable-filters {
    grid-template-columns: 1fr !important;
  }
}


/* ===== REAL LIVE ACTIVITY FROM STUDENT ACTIVITY API ===== */

.real-live-activity-panel {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  max-height: 360px !important;
  overflow-y: auto !important;
  padding-inline-end: 4px !important;
}

.real-live-activity-panel::-webkit-scrollbar {
  width: 5px !important;
}

.real-live-activity-panel::-webkit-scrollbar-thumb {
  background: rgba(15, 63, 46, 0.25) !important;
  border-radius: 999px !important;
}

.real-live-item {
  display: grid !important;
  grid-template-columns: 32px 1fr !important;
  gap: 9px !important;
  align-items: center !important;
  padding: 10px !important;
  border-radius: 15px !important;
  background: #fffaf1 !important;
  border: 1px solid rgba(217, 119, 6, 0.18) !important;
  direction: rtl !important;
}

.real-live-icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 999px !important;
  background: #0f3f2e !important;
  color: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}

.real-live-body {
  min-width: 0 !important;
  display: grid !important;
  gap: 2px !important;
}

.real-live-body strong {
  color: #0f3f2e !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.real-live-body span {
  color: #92400e !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
}

.real-live-body em {
  color: #64748b !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 700 !important;
}

.real-live-empty {
  padding: 16px 12px !important;
  border-radius: 15px !important;
  background: #f8fafc !important;
  color: #64748b !important;
  text-align: center !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.7 !important;
}


/* ===== MODERN HOMEWORK REVIEW PAGE ===== */

.modern-homework-review {
  display: grid !important;
  gap: 18px !important;
  direction: rtl !important;
}

.hw-review-hero {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 22px !important;
  border-radius: 22px !important;
  background: linear-gradient(135deg, #fffaf0, #ffffff) !important;
  border: 1px solid rgba(199, 146, 52, 0.22) !important;
  box-shadow: 0 18px 40px rgba(15, 63, 46, 0.07) !important;
}

.hw-review-hero span {
  color: #c79234 !important;
  font-weight: 900 !important;
  font-size: 12px !important;
}

.hw-review-hero h1 {
  margin: 6px 0 !important;
  color: #0f3f2e !important;
  font-size: 30px !important;
  font-weight: 900 !important;
}

.hw-review-hero p {
  margin: 0 !important;
  color: #64748b !important;
  font-weight: 700 !important;
}

.hw-review-hero button,
.hw-review-filters button {
  border: 0 !important;
  background: #0f3f2e !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 11px 18px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.hw-review-stats {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.hw-review-stats div {
  background: #fff !important;
  border: 1px solid rgba(15, 63, 46, 0.08) !important;
  border-radius: 18px !important;
  padding: 16px !important;
  box-shadow: 0 14px 30px rgba(15, 63, 46, 0.05) !important;
}

.hw-review-stats span {
  display: block !important;
  color: #0f3f2e !important;
  font-size: 26px !important;
  font-weight: 900 !important;
}

.hw-review-stats b {
  color: #64748b !important;
  font-size: 12px !important;
}

.hw-review-panel {
  background: #fff !important;
  border-radius: 22px !important;
  border: 1px solid rgba(15, 63, 46, 0.08) !important;
  box-shadow: 0 18px 40px rgba(15, 63, 46, 0.06) !important;
  padding: 18px !important;
}

.hw-review-toolbar {
  display: flex !important;
  align-items: start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 14px !important;
}

.hw-review-toolbar h2 {
  margin: 0 0 4px !important;
  color: #0f3f2e !important;
  font-size: 20px !important;
  font-weight: 900 !important;
}

.hw-review-toolbar p {
  margin: 0 !important;
  color: #64748b !important;
  font-weight: 700 !important;
}

#homeworkVisibleCounter {
  background: #ecfdf5 !important;
  color: #047857 !important;
  border-radius: 999px !important;
  padding: 7px 12px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

.hw-review-filters {
  display: grid !important;
  grid-template-columns: 1.4fr repeat(3, minmax(150px, 1fr)) auto !important;
  gap: 10px !important;
  background: #fbf7ef !important;
  border: 1px solid #eee2cf !important;
  border-radius: 18px !important;
  padding: 12px !important;
  margin-bottom: 14px !important;
}

.hw-review-filters input,
.hw-review-filters select {
  height: 44px !important;
  border: 1px solid #d9e0ea !important;
  background: #fff !important;
  border-radius: 13px !important;
  padding: 0 12px !important;
  font-weight: 800 !important;
  color: #0f3f2e !important;
  outline: none !important;
}

.hw-table-wrap {
  overflow-x: auto !important;
}

.hw-review-table {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 10px !important;
  min-width: 1120px !important;
}

.hw-review-table th {
  text-align: right !important;
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  padding: 0 10px 4px !important;
}

.hw-review-table td {
  background: #fffaf1 !important;
  border-top: 1px solid rgba(199, 146, 52, 0.18) !important;
  border-bottom: 1px solid rgba(199, 146, 52, 0.18) !important;
  padding: 12px 10px !important;
  vertical-align: middle !important;
}

.hw-review-table td:first-child {
  border-right: 1px solid rgba(199, 146, 52, 0.18) !important;
  border-radius: 14px 0 0 14px !important;
}

.hw-review-table td:last-child {
  border-left: 1px solid rgba(199, 146, 52, 0.18) !important;
  border-radius: 0 14px 14px 0 !important;
}

.hw-student-cell,
.hw-homework-cell {
  display: grid !important;
  gap: 3px !important;
}

.hw-student-cell strong,
.hw-homework-cell strong {
  color: #0f3f2e !important;
  font-weight: 900 !important;
  font-size: 13px !important;
}

.hw-student-cell span,
.hw-homework-cell span,
.hw-review-table small {
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

.hw-homework-cell em {
  color: #92400e !important;
  font-style: normal !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

.hw-files {
  display: flex !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}

.hw-file-link {
  background: #eef2ff !important;
  color: #3730a3 !important;
  border-radius: 999px !important;
  padding: 5px 9px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

.hw-status,
.hw-final,
.hw-supervisor,
.hw-reviewer {
  display: inline-flex !important;
  width: max-content !important;
  max-width: 180px !important;
  border-radius: 999px !important;
  padding: 6px 10px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}

.hw-status {
  background: #eff6ff !important;
  color: #1d4ed8 !important;
}

.hw-supervisor {
  background: #eef2ff !important;
  color: #3730a3 !important;
}

.hw-reviewer {
  background: #f1f5f9 !important;
  color: #334155 !important;
}

.hw-final.good {
  background: #ecfdf5 !important;
  color: #047857 !important;
}

.hw-final.partial {
  background: #fffbeb !important;
  color: #b45309 !important;
}

.hw-final.poor {
  background: #fff1f2 !important;
  color: #be123c !important;
}

.hw-final.pending {
  background: #f8fafc !important;
  color: #64748b !important;
}

.hw-grade-actions {
  display: flex !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}

.hw-grade-actions button {
  border: 0 !important;
  border-radius: 999px !important;
  padding: 7px 10px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
  color: #fff !important;
}

.hw-grade-actions button[data-evaluation="FULL"] {
  background: #047857 !important;
}

.hw-grade-actions button[data-evaluation="PARTIAL"] {
  background: #b45309 !important;
}

.hw-grade-actions button[data-evaluation="POOR"] {
  background: #be123c !important;
}

.hw-empty,
.homework-review-status {
  padding: 18px !important;
  text-align: center !important;
  color: #64748b !important;
  font-weight: 900 !important;
  background: #f8fafc !important;
  border-radius: 16px !important;
}

.hw-muted {
  color: #94a3b8 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

@media (max-width: 900px) {
  .hw-review-hero {
    display: grid !important;
  }

  .hw-review-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .hw-review-filters {
    grid-template-columns: 1fr !important;
  }
}


/* ===== HOMEWORK REVIEW TABLE POLISH FINAL ===== */

.modern-homework-review {
  max-width: 100% !important;
}

.hw-review-panel {
  overflow: hidden !important;
}

.hw-table-wrap {
  width: 100% !important;
  overflow-x: auto !important;
  padding-bottom: 8px !important;
}

.hw-review-table {
  min-width: 1250px !important;
  table-layout: fixed !important;
}

.hw-review-table th,
.hw-review-table td {
  text-align: right !important;
  vertical-align: middle !important;
}

.hw-review-table th:nth-child(1),
.hw-review-table td:nth-child(1) {
  width: 150px !important;
}

.hw-review-table th:nth-child(2),
.hw-review-table td:nth-child(2) {
  width: 250px !important;
}

.hw-review-table th:nth-child(3),
.hw-review-table td:nth-child(3) {
  width: 150px !important;
}

.hw-review-table th:nth-child(4),
.hw-review-table td:nth-child(4) {
  width: 110px !important;
  text-align: center !important;
}

.hw-review-table th:nth-child(5),
.hw-review-table td:nth-child(5) {
  width: 160px !important;
  text-align: center !important;
}

.hw-review-table th:nth-child(6),
.hw-review-table td:nth-child(6) {
  width: 180px !important;
  text-align: center !important;
}

.hw-review-table th:nth-child(7),
.hw-review-table td:nth-child(7) {
  width: 140px !important;
  text-align: center !important;
}

.hw-review-table th:nth-child(8),
.hw-review-table td:nth-child(8) {
  width: 135px !important;
  text-align: center !important;
}

.hw-review-table th:nth-child(9),
.hw-review-table td:nth-child(9) {
  width: 170px !important;
  text-align: center !important;
}

.hw-student-cell strong,
.hw-homework-cell strong {
  display: block !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.hw-homework-cell span,
.hw-homework-cell em {
  display: block !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.hw-grade-actions {
  justify-content: center !important;
  flex-wrap: nowrap !important;
}

.hw-grade-actions button {
  min-width: 48px !important;
  padding: 7px 9px !important;
}

.hw-status,
.hw-final,
.hw-supervisor,
.hw-reviewer,
.hw-file-link {
  margin-inline: auto !important;
  justify-content: center !important;
}

.hw-review-table small {
  display: block !important;
  margin-top: 5px !important;
  white-space: nowrap !important;
}

.hw-graded-at {
  display: inline-block !important;
  direction: rtl !important;
  white-space: nowrap !important;
  color: #334155 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

.hw-review-table tbody tr:hover td {
  background: #fff7e6 !important;
}


/* ===== HOMEWORK REVIEW PREMIUM TABLE FINAL OVERRIDE ===== */

.modern-homework-review {
  gap: 14px !important;
}

.hw-review-hero {
  min-height: 118px !important;
  padding: 24px 28px !important;
}

.hw-review-stats {
  gap: 10px !important;
}

.hw-review-stats div {
  min-height: 78px !important;
  display: grid !important;
  align-content: center !important;
}

.hw-review-panel {
  padding: 20px !important;
}

.hw-review-toolbar {
  padding-inline: 4px !important;
}

.hw-review-filters {
  grid-template-columns: minmax(260px, 1.4fr) repeat(3, minmax(165px, 0.8fr)) auto !important;
  align-items: center !important;
  margin-bottom: 18px !important;
}

.hw-table-wrap {
  overflow-x: visible !important;
}

.hw-review-table {
  min-width: 0 !important;
  width: 100% !important;
  table-layout: auto !important;
  border-spacing: 0 14px !important;
}

.hw-review-table thead th {
  background: transparent !important;
  color: #64748b !important;
  font-size: 12px !important;
  padding: 0 12px 2px !important;
}

.hw-review-table tbody tr {
  filter: drop-shadow(0 12px 24px rgba(15, 63, 46, 0.06)) !important;
}

.hw-review-table td {
  background: #fffdf8 !important;
  padding: 16px 13px !important;
  border-top: 1px solid rgba(199, 146, 52, 0.22) !important;
  border-bottom: 1px solid rgba(199, 146, 52, 0.22) !important;
}

.hw-review-table td:first-child {
  border-radius: 18px 0 0 18px !important;
  border-right: 1px solid rgba(199, 146, 52, 0.22) !important;
}

.hw-review-table td:last-child {
  border-radius: 0 18px 18px 0 !important;
  border-left: 1px solid rgba(199, 146, 52, 0.22) !important;
}

.hw-review-table th:nth-child(1),
.hw-review-table td:nth-child(1) {
  width: 145px !important;
}

.hw-review-table th:nth-child(2),
.hw-review-table td:nth-child(2) {
  width: 285px !important;
}

.hw-review-table th:nth-child(3),
.hw-review-table td:nth-child(3) {
  width: 155px !important;
}

.hw-review-table th:nth-child(4),
.hw-review-table td:nth-child(4) {
  width: 90px !important;
}

.hw-review-table th:nth-child(5),
.hw-review-table td:nth-child(5) {
  width: 135px !important;
}

.hw-review-table th:nth-child(6),
.hw-review-table td:nth-child(6) {
  width: 170px !important;
}

.hw-review-table th:nth-child(7),
.hw-review-table td:nth-child(7) {
  width: 120px !important;
}

.hw-review-table th:nth-child(8),
.hw-review-table td:nth-child(8) {
  width: 120px !important;
}

.hw-review-table th:nth-child(9),
.hw-review-table td:nth-child(9) {
  width: 145px !important;
}

.hw-student-cell {
  gap: 5px !important;
}

.hw-student-cell strong {
  font-size: 14px !important;
}

.hw-student-cell span {
  width: max-content !important;
  background: #eef2ff !important;
  color: #3730a3 !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  font-weight: 900 !important;
}

.hw-homework-cell strong {
  font-size: 14px !important;
  color: #0f3f2e !important;
}

.hw-homework-cell span {
  color: #92400e !important;
  font-weight: 900 !important;
  margin-top: 3px !important;
}

.hw-status,
.hw-final,
.hw-supervisor,
.hw-reviewer,
.hw-file-link {
  min-height: 28px !important;
  align-items: center !important;
  font-size: 11px !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.5) !important;
}

.hw-grade-actions {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 6px !important;
}

.hw-grade-actions button {
  min-width: 0 !important;
  height: 30px !important;
  padding: 0 9px !important;
  font-size: 11px !important;
}

.hw-review-table small {
  margin-top: 6px !important;
  font-size: 10px !important;
  color: #64748b !important;
}

.hw-graded-at {
  background: #fff7ed !important;
  color: #9a3412 !important;
  border-radius: 999px !important;
  padding: 6px 9px !important;
  font-weight: 900 !important;
}

/* تحسين ظهور الصف لما يكون عدد التسليمات قليل */
.hw-review-table tbody:has(tr:only-child) td {
  padding-block: 18px !important;
}

/* تصغير المساحة الفاضية بين الهيدر والإحصائيات */
.homework-review-status:empty {
  display: none !important;
}

@media (max-width: 1200px) {
  .hw-table-wrap {
    overflow-x: auto !important;
  }

  .hw-review-table {
    min-width: 1120px !important;
  }
}


/* ===== STUDENT HOMEWORKS PAGE SAFE ===== */

.student-homeworks-page .hw-review-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.student-homework-filters {
  grid-template-columns: 1.5fr minmax(160px, .7fr) minmax(160px, .7fr) auto !important;
}

.student-homework-table {
  min-width: 980px !important;
}

.student-hw-status {
  display: inline-flex !important;
  width: max-content !important;
  justify-content: center !important;
  align-items: center !important;
  min-height: 28px !important;
  border-radius: 999px !important;
  padding: 6px 10px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  margin-inline: auto !important;
}

.student-hw-status.graded {
  background: #ecfdf5 !important;
  color: #047857 !important;
}

.student-hw-status.pending {
  background: #fffbeb !important;
  color: #b45309 !important;
}

.student-hw-status.late {
  background: #fff1f2 !important;
  color: #be123c !important;
}

.student-hw-status.waiting {
  background: #f1f5f9 !important;
  color: #64748b !important;
}

@media (max-width: 900px) {
  .student-homeworks-page .hw-review-stats {
    grid-template-columns: 1fr !important;
  }

  .student-homework-filters {
    grid-template-columns: 1fr !important;
  }
}


/* ===== HIDE SIDEBAR COLLAPSE / DRAWER BUTTONS FOR ALL USERS ===== */

#sidebarCollapse,
#sidebarDrawerToggle,
#sidebarDrawerToggleMobile,
#sidebarDrawerToggleBtn,
.sidebar-collapse,
.sidebar-toggle,
.sidebar-drawer-toggle,
.dashboard-drawer-float,
button[title="طي القائمة"],
button[title="فتح القائمة"],
button[aria-label="طي القائمة"],
button[aria-label="فتح القائمة"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* امنع حالة الطي القديمة لو كانت محفوظة في localStorage */
.app-shell.sidebar-collapsed .sidebar,
.app-shell.sidebar-collapsed .pro-sidebar {
  width: var(--sidebar-width, 260px) !important;
  min-width: var(--sidebar-width, 260px) !important;
}

.app-shell.sidebar-collapsed .main-panel,
.app-shell.sidebar-collapsed .main-content {
  margin-inline-start: 0 !important;
}


/* ===== FORCE SIDEBAR OPEN AFTER REMOVING COLLAPSE BUTTON ===== */

#sidebarCollapse,
#sidebarDrawerToggle,
#sidebarDrawerToggleMobile,
#sidebarDrawerToggleBtn,
.dashboard-drawer-float,
.sidebar-collapse,
.sidebar-toggle,
.sidebar-drawer-toggle,
button[title="طي القائمة"],
button[title="فتح القائمة"],
button[aria-label="طي القائمة"],
button[aria-label="فتح القائمة"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.app-shell.sidebar-collapsed {
  grid-template-columns: var(--sidebar-width, 280px) 1fr !important;
}

.app-shell.sidebar-collapsed .sidebar,
.app-shell.sidebar-collapsed .pro-sidebar {
  width: var(--sidebar-width, 280px) !important;
  min-width: var(--sidebar-width, 280px) !important;
  max-width: var(--sidebar-width, 280px) !important;
  transform: none !important;
}

.app-shell.sidebar-collapsed .sidebar-nav a b,
.app-shell.sidebar-collapsed .sidebar-nav-title,
.app-shell.sidebar-collapsed .sidebar-soon-link b,
.app-shell.sidebar-collapsed .sidebar-soon-link small,
.app-shell.sidebar-collapsed .sidebar-profile,
.app-shell.sidebar-collapsed .teacher-sidebar-card {
  display: initial !important;
  opacity: 1 !important;
  visibility: visible !important;
}


/* ===== QUESTION FORUM FRONTEND ===== */

.question-forum-page {
  display: grid;
  gap: 18px;
}

.qf-loading {
  color: #92400e;
  font-weight: 900;
}

.qf-hero,
.qf-section-head,
.qf-add-box,
.qf-filters,
.qf-question-card,
.qf-stats-card {
  background: rgba(255, 253, 248, 0.96);
  border: 1px solid rgba(199, 146, 52, 0.22);
  border-radius: 24px;
  box-shadow: 0 18px 38px rgba(15, 63, 46, 0.08);
}

.qf-hero {
  padding: 24px;
}

.qf-hero span,
.qf-section-head span,
.qf-add-box span,
.qf-stats-card span {
  color: #b45309;
  font-weight: 950;
  font-size: 12px;
}

.qf-hero h1,
.qf-section-head h2,
.qf-add-box h3 {
  margin: 8px 0;
  color: #0f3f2e;
}

.qf-hero p,
.qf-section-head p,
.qf-add-box p {
  color: #64748b;
  margin: 0;
  font-weight: 700;
}

.qf-stats-card {
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 10%, rgba(250, 204, 21, .24), transparent 32%),
    linear-gradient(135deg, #0f3f2e, #14543d);
  color: #fff;
}

.qf-stats-card span,
.qf-stats-card p {
  color: rgba(255,255,255,.82);
}

.qf-stats-card strong {
  display: block;
  font-size: clamp(42px, 8vw, 82px);
  line-height: 1;
  margin: 12px 0;
  color: #facc15;
  letter-spacing: -2px;
}

.qf-stats-orbit {
  width: 128px;
  height: 128px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.18);
}

.qf-stats-orbit b {
  font-size: 62px;
  color: #facc15;
}

.qf-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.qf-choice-card,
.qf-section-row {
  border: 1px solid rgba(199, 146, 52, 0.22);
  background: #fffdf8;
  border-radius: 22px;
  padding: 22px;
  text-align: right;
  cursor: pointer;
  transition: .2s ease;
}

.qf-choice-card:hover,
.qf-section-row:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 34px rgba(15, 63, 46, .11);
  border-color: rgba(199, 146, 52, .45);
}

.qf-choice-card span {
  color: #b45309;
  font-weight: 900;
  font-size: 12px;
}

.qf-choice-card h3 {
  color: #0f3f2e;
  margin: 8px 0;
}

.qf-choice-card p {
  color: #64748b;
  font-weight: 700;
  min-height: 44px;
}

.qf-choice-card b,
.qf-section-row b {
  color: #0f3f2e;
}

.qf-section-head {
  padding: 18px 22px;
  display: flex;
  gap: 16px;
  align-items: center;
}

.qf-section-head button {
  border: 0;
  background: #0f3f2e;
  color: white;
  border-radius: 999px;
  padding: 10px 14px;
  cursor: pointer;
  font-weight: 900;
}

.qf-section-list {
  display: grid;
  gap: 12px;
}

.qf-section-row {
  display: grid;
  grid-template-columns: 54px 1fr auto;
  align-items: center;
  gap: 14px;
}

.qf-section-row i {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: #ecfdf5;
  font-style: normal;
  font-size: 28px;
}

.qf-section-row h3 {
  margin: 0 0 4px;
  color: #0f3f2e;
}

.qf-section-row p {
  margin: 0;
  color: #64748b;
  font-weight: 700;
}

.qf-add-box {
  padding: 20px;
  display: grid;
  gap: 14px;
}

#qfCreateQuestionForm,
.qf-reply-form {
  display: grid;
  gap: 10px;
}

#qfCreateQuestionForm input,
#qfCreateQuestionForm textarea,
.qf-reply-form textarea,
.qf-filters input,
.qf-filters select {
  border: 1px solid rgba(148, 163, 184, .35);
  border-radius: 16px;
  padding: 12px 14px;
  font-family: inherit;
  font-weight: 800;
  background: #fff;
}

.qf-form-row,
.qf-reply-form > div {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.qf-form-row button,
.qf-reply-form button,
.qf-filters button,
.qf-reply-actions button {
  border: 0;
  border-radius: 14px;
  background: #0f3f2e;
  color: white;
  padding: 11px 16px;
  font-weight: 950;
  cursor: pointer;
}

.qf-filters {
  padding: 16px;
  display: grid;
  grid-template-columns: 1.5fr .7fr .7fr auto;
  gap: 10px;
}

.qf-questions-list {
  display: grid;
  gap: 14px;
}

.qf-question-card {
  padding: 18px;
}

.qf-question-card header,
.qf-question-meta,
.qf-reply-meta {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.qf-question-card h3 {
  color: #0f3f2e;
  margin: 14px 0 8px;
}

.qf-question-card p,
.qf-reply p {
  color: #334155;
  font-weight: 800;
  line-height: 1.8;
  white-space: pre-wrap;
}

.qf-status,
.qf-pending-badge,
.qf-reply-meta em {
  display: inline-flex;
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 11px;
  font-weight: 950;
}

.qf-status.open {
  background: #fffbeb;
  color: #b45309;
}

.qf-status.answered {
  background: #ecfdf5;
  color: #047857;
}

.qf-status.closed {
  background: #f1f5f9;
  color: #475569;
}

.qf-pending-badge {
  background: #eef2ff;
  color: #3730a3;
}

.qf-question-meta {
  border-top: 1px dashed rgba(148, 163, 184, .35);
  padding-top: 12px;
  margin-top: 14px;
  color: #64748b;
  font-weight: 850;
}

.qf-replies {
  margin-top: 14px;
  display: grid;
  gap: 10px;
}

.qf-reply {
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 18px;
  padding: 14px;
}

.qf-reply.pending {
  background: #fff7ed;
  border-color: rgba(251, 146, 60, .35);
}

.qf-reply-meta strong {
  color: #0f3f2e;
}

.qf-reply-meta span,
.qf-reply-meta time {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.qf-images {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.qf-images img {
  width: 92px;
  height: 92px;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, .3);
}

.qf-question-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 12px;
}

.qf-question-actions button,
.qf-danger-link {
  border: 0;
  background: #f1f5f9;
  color: #334155;
  border-radius: 999px;
  padding: 8px 12px;
  font-weight: 900;
  cursor: pointer;
}

.qf-question-actions .danger,
.qf-danger-link {
  background: #fff1f2;
  color: #be123c;
}

.qf-empty,
.qf-empty-mini {
  padding: 20px;
  border-radius: 18px;
  background: #f8fafc;
  color: #64748b;
  font-weight: 900;
  text-align: center;
}

@media (max-width: 1000px) {
  .qf-card-grid,
  .qf-filters {
    grid-template-columns: 1fr;
  }

  .qf-stats-card,
  .qf-section-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .qf-section-row {
    grid-template-columns: 48px 1fr;
  }

  .qf-section-row b {
    grid-column: 1 / -1;
  }
}


/* ===== QUESTION FORUM CHAT/TABS REFINEMENT ===== */

.qf-branch-tabs {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  background: rgba(255, 253, 248, 0.96) !important;
  border: 1px solid rgba(199, 146, 52, 0.22) !important;
  border-radius: 22px !important;
  padding: 12px !important;
  box-shadow: 0 14px 30px rgba(15, 63, 46, 0.06) !important;
}

.qf-branch-tabs button {
  border: 1px solid rgba(148, 163, 184, .28) !important;
  background: #fff !important;
  color: #0f3f2e !important;
  border-radius: 16px !important;
  padding: 14px 10px !important;
  cursor: pointer !important;
  font-weight: 950 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 58px !important;
  transition: .18s ease !important;
}

.qf-branch-tabs button i {
  font-style: normal !important;
  font-size: 18px !important;
}

.qf-branch-tabs button.active,
.qf-branch-tabs button:hover {
  background: linear-gradient(135deg, #e6f6ef, #dff5eb) !important;
  border-color: rgba(15, 63, 46, .35) !important;
  box-shadow: inset 0 -3px 0 #0f3f2e, 0 12px 24px rgba(15, 63, 46, .08) !important;
  transform: translateY(-1px) !important;
}

.qf-section-head.compact {
  padding: 16px 20px !important;
}

.qf-section-list {
  display: none !important;
}

.qf-direct-question {
  background: linear-gradient(180deg, #fffdf8, #ffffff) !important;
}

.qf-direct-question textarea {
  min-height: 110px !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
}

.qf-thread-card {
  background: #fffdf8 !important;
  border: 1px solid rgba(199, 146, 52, 0.24) !important;
  border-radius: 24px !important;
  padding: 18px !important;
  box-shadow: 0 16px 34px rgba(15, 63, 46, 0.07) !important;
  display: grid !important;
  gap: 14px !important;
}

.qf-thread-top {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  border-bottom: 1px dashed rgba(148, 163, 184, .3) !important;
  padding-bottom: 10px !important;
}

.qf-thread-top time {
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

.qf-chat-row {
  display: flex !important;
  width: 100% !important;
}

.qf-question-row {
  justify-content: flex-start !important;
}

.qf-answer-row {
  justify-content: flex-end !important;
}

.qf-chat-bubble {
  max-width: min(780px, 88%) !important;
  border-radius: 22px !important;
  padding: 15px 17px !important;
  position: relative !important;
}

.qf-question-bubble {
  background: linear-gradient(135deg, #ecfdf5, #dff7eb) !important;
  border: 1px solid rgba(16, 185, 129, .24) !important;
  color: #0f3f2e !important;
  border-start-start-radius: 8px !important;
}

.qf-answer-bubble {
  background: linear-gradient(135deg, #eef2ff, #f5f3ff) !important;
  border: 1px solid rgba(99, 102, 241, .22) !important;
  color: #1e1b4b !important;
  border-start-end-radius: 8px !important;
}

.qf-answer-bubble.pending {
  background: linear-gradient(135deg, #fff7ed, #fffbeb) !important;
  border-color: rgba(251, 146, 60, .35) !important;
}

.qf-chat-meta {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-bottom: 8px !important;
}

.qf-chat-meta strong {
  color: #0f3f2e !important;
  font-weight: 950 !important;
}

.qf-chat-meta span,
.qf-chat-meta time {
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

.qf-chat-meta em {
  background: rgba(255,255,255,.78) !important;
  color: #92400e !important;
  border-radius: 999px !important;
  padding: 4px 8px !important;
  font-style: normal !important;
  font-size: 11px !important;
  font-weight: 950 !important;
}

.qf-chat-bubble p {
  margin: 0 !important;
  color: inherit !important;
  font-size: 15px !important;
  line-height: 1.9 !important;
  font-weight: 850 !important;
  white-space: pre-wrap !important;
}

.qf-chat-replies {
  display: grid !important;
  gap: 10px !important;
}

.qf-question-card {
  display: none !important;
}

.qf-reply {
  display: none !important;
}

.qf-reply-form {
  background: #f8fafc !important;
  border: 1px solid rgba(148, 163, 184, .2) !important;
  border-radius: 18px !important;
  padding: 12px !important;
}

.qf-reply-form textarea {
  background: #fff !important;
}

.qf-question-actions {
  margin-top: 0 !important;
}

@media (max-width: 900px) {
  .qf-branch-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .qf-chat-bubble {
    max-width: 96% !important;
  }
}

@media (max-width: 520px) {
  .qf-branch-tabs {
    grid-template-columns: 1fr !important;
  }
}


/* ===== QUESTION FORUM SEARCH ABOVE BRANCHES + NUMBERING ===== */

.qf-grade-search {
  display: grid !important;
  grid-template-columns: 1fr 2fr !important;
  gap: 14px !important;
  align-items: center !important;
  background: rgba(255, 253, 248, .96) !important;
  border: 1px solid rgba(199, 146, 52, .22) !important;
  border-radius: 22px !important;
  padding: 16px !important;
  box-shadow: 0 12px 28px rgba(15, 63, 46, .06) !important;
}

.qf-grade-search span {
  color: #b45309 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
}

.qf-grade-search h3 {
  color: #0f3f2e !important;
  margin: 5px 0 0 !important;
  font-size: 18px !important;
}

#qfGradeSearchForm {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  gap: 10px !important;
}

#qfGradeSearchForm input {
  border: 1px solid rgba(148, 163, 184, .35) !important;
  border-radius: 16px !important;
  padding: 13px 15px !important;
  font-family: inherit !important;
  font-weight: 850 !important;
  background: white !important;
  color: #0f3f2e !important;
}

#qfGradeSearchForm button {
  border: 0 !important;
  background: #0f3f2e !important;
  color: white !important;
  border-radius: 16px !important;
  padding: 12px 20px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

.qf-inline-filters {
  grid-template-columns: 1fr 1fr auto !important;
}

.qf-question-number {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  padding: 7px 12px !important;
  background: #0f3f2e !important;
  color: white !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  margin-inline-end: 6px !important;
}

@media (max-width: 900px) {
  .qf-grade-search,
  #qfGradeSearchForm,
  .qf-inline-filters {
    grid-template-columns: 1fr !important;
  }
}


/* ===== QUESTION FORUM UNIFIED TOP CONTROLS ===== */

.qf-grade-controls {
  grid-template-columns: 260px 1fr !important;
  align-items: end !important;
}

.qf-grade-controls-title h3 {
  font-size: 17px !important;
}

#qfGradeSearchForm {
  grid-template-columns: minmax(260px, 1.6fr) minmax(140px, .7fr) minmax(140px, .7fr) minmax(140px, .7fr) auto !important;
  align-items: center !important;
}

#qfGradeSearchForm select {
  border: 1px solid rgba(148, 163, 184, .35) !important;
  border-radius: 16px !important;
  padding: 13px 15px !important;
  font-family: inherit !important;
  font-weight: 850 !important;
  background: white !important;
  color: #0f3f2e !important;
  min-height: 48px !important;
}

.qf-filters,
.qf-inline-filters {
  display: none !important;
}

@media (max-width: 1150px) {
  .qf-grade-controls {
    grid-template-columns: 1fr !important;
  }

  #qfGradeSearchForm {
    grid-template-columns: 1fr 1fr !important;
  }

  #qfGradeSearchForm input {
    grid-column: 1 / -1 !important;
  }

  #qfGradeSearchForm button {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 620px) {
  #qfGradeSearchForm {
    grid-template-columns: 1fr !important;
  }
}


/* ===== Dynamic lesson builder cleanup 20260526 ===== */
#builderSummary .warn,
.lms-pills .warn {
    color: #b45309;
    background: #fff7ed;
    border: 1px solid #fed7aa;
}

.lesson-builder-parts .lms-content-row.empty {
    border-style: dashed;
    background: #f8fafc;
}

.lesson-builder-parts .lms-content-row.warning {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #92400e;
}

.lesson-builder-parts .primary-lesson-video {
    border-inline-start: 4px solid #d4a72c;
}

#videoDurationMinutes[readonly] {
    background: #f8fafc;
    color: #64748b;
    cursor: not-allowed;
}

/* ===== Clean dynamic builder layout v2 - 20260526 ===== */
#curriculumTree .safe-content-menu-v3,
#curriculumTree .inline-add-buttons-v6,
#curriculumTree .safe-unit-toggle-v3,
#curriculumTree .safe-lesson-toggle-v3 {
    display: none !important;
}

#curriculumTree .lms-unit {
    border: 1px solid #eadfcd;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(24, 61, 47, .06);
    overflow: hidden;
    margin-bottom: 14px;
}

#curriculumTree .lms-unit-head {
    display: grid;
    grid-template-columns: auto minmax(280px, 1fr) auto auto;
    gap: 12px;
    align-items: center;
    padding: 14px;
    background: linear-gradient(90deg, #eef8f1, #fff7e6);
    border-bottom: 1px solid #eadfcd;
}

#curriculumTree .lms-unit-title {
    display: flex;
    align-items: center;
    gap: 12px;
    text-align: right;
    background: transparent;
    border: 0;
    color: #174937;
    cursor: pointer;
}

#curriculumTree .lms-unit-title > span {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #e8f5ec;
    color: #174937;
    font-weight: 900;
}

#curriculumTree .lms-unit-title strong,
#curriculumTree .lms-lesson-main strong,
#curriculumTree .lms-content-main strong {
    color: #143b2d;
}

#curriculumTree .lms-unit-title small,
#curriculumTree .lms-lesson-main p,
#curriculumTree .lms-content-main small {
    color: #667085;
}

#curriculumTree .lms-unit-stats {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

#curriculumTree .lms-unit-stats span,
#curriculumTree .lms-pills span {
    border: 1px solid #e8ddca;
    background: #fbf7ef;
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 800;
    color: #174937;
}

#curriculumTree .lms-unit-actions,
#curriculumTree .lms-lesson-actions,
#curriculumTree .lms-content-actions {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
}

#curriculumTree .lms-lessons {
    display: grid;
    gap: 12px;
    padding: 14px;
    background: #fffdf8;
}

#curriculumTree .lms-lesson-compact-card {
    border: 1px solid #eadfcd;
    border-radius: 16px;
    background: #fff;
    padding: 12px;
    display: grid;
    gap: 12px;
}

#curriculumTree .lms-lesson-main {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: start;
}

#curriculumTree .lms-lesson-icon,
#curriculumTree .lms-content-icon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #eef8f1;
    color: #174937;
    font-weight: 900;
}

#curriculumTree .lms-pills {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 8px;
}

#curriculumTree .lesson-builder-parts {
    display: grid;
    gap: 8px;
    border-top: 1px dashed #eadfcd;
    padding-top: 10px;
}

#curriculumTree .lms-content-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 10px;
    align-items: center;
    border: 1px solid #eee2cf;
    border-radius: 14px;
    background: #fffefa;
    padding: 10px;
}

#curriculumTree .lms-content-row.primary-lesson-video {
    border-inline-start: 5px solid #c9902f;
    background: #fffaf0;
}

#curriculumTree .lms-content-row.material {
    border-inline-start: 5px solid #3b82f6;
}

#curriculumTree .lms-content-row.homework {
    border-inline-start: 5px solid #7c3aed;
}

#curriculumTree .lms-content-row.exam,
#curriculumTree .lms-content-row.unit-exam {
    border-inline-start: 5px solid #f59e0b;
}

#curriculumTree .lms-content-row.warning {
    border-color: #fed7aa;
    background: #fff7ed;
}

#curriculumTree .lms-drag-handle {
    width: 26px;
    height: 30px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f6efe3;
    color: #9b6b1d;
    font-size: 13px;
    overflow: hidden;
}

#curriculumTree button {
    min-height: 34px;
    border-radius: 10px;
    border: 1px solid #e2d5c3;
    background: #fff;
    color: #174937;
    font-weight: 800;
    cursor: pointer;
}

#curriculumTree button:hover {
    background: #eef8f1;
}

#curriculumTree button.danger,
#curriculumTree button[data-delete-unit],
#curriculumTree button[data-delete-lesson],
#curriculumTree button[data-delete-video],
#curriculumTree button[data-delete-material],
#curriculumTree button[data-delete-homework],
#curriculumTree button[data-delete-exam] {
    background: #fff8f6;
    border-color: #fecdca;
    color: #b42318;
}

#builderSummary {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

#builderSummary span {
    border: 1px solid #eadfcd;
    background: #fbf7ef;
    color: #174937;
    border-radius: 12px;
    padding: 9px 11px;
    font-weight: 900;
}

#builderSummary span.warn {
    color: #92400e;
    background: #fff7ed;
    border-color: #fed7aa;
}

@media (max-width: 900px) {
    #curriculumTree .lms-unit-head,
    #curriculumTree .lms-content-row {
        grid-template-columns: 1fr;
    }

    #curriculumTree .lms-unit-actions,
    #curriculumTree .lms-lesson-actions,
    #curriculumTree .lms-content-actions {
        justify-content: flex-start;
    }
}

/* ===== Builder compact lesson cards final override 20260526 ===== */
#curriculumTree .lms-lessons {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 14px !important;
}

#curriculumTree .lms-lesson-compact-card {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 16px !important;
    background: #fff !important;
    overflow: hidden !important;
}

#curriculumTree .lms-lesson-main {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 12px 14px !important;
    background: #fff !important;
}

#curriculumTree .lms-lesson-main > div {
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

#curriculumTree .lms-lesson-main strong {
    display: block !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    margin-bottom: 2px !important;
}

#curriculumTree .lms-lesson-main p {
    margin: 0 !important;
    font-size: 12.5px !important;
    line-height: 1.5 !important;
}

#curriculumTree .lms-lesson-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    padding: 10px 14px !important;
    border-top: 1px solid #f0e5d4 !important;
    background: #fffdf8 !important;
}

#curriculumTree .lms-lesson-actions button {
    min-height: 32px !important;
    padding: 7px 10px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
}

#curriculumTree .lesson-builder-parts {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    width: 100% !important;
    padding: 10px 14px 12px !important;
    border-top: 1px dashed #eadfcd !important;
    background: #fff !important;
}

#curriculumTree .lms-content-row {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto auto !important;
    gap: 10px !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 48px !important;
    padding: 9px 10px !important;
    margin: 0 !important;
}

#curriculumTree .lms-content-main {
    min-width: 0 !important;
}

#curriculumTree .lms-content-main strong,
#curriculumTree .lms-content-main small {
    display: block !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

#curriculumTree .lms-content-actions {
    display: flex !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
}

#curriculumTree .lms-content-actions button {
    min-height: 30px !important;
    padding: 6px 9px !important;
    font-size: 12px !important;
}

#curriculumTree .lms-pills {
    display: flex !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
    margin-top: 8px !important;
}

#curriculumTree .lms-pills span {
    padding: 5px 8px !important;
    font-size: 11.5px !important;
}

#curriculumTree .lms-drag-handle {
    flex: 0 0 auto !important;
}

@media (max-width: 900px) {
    #curriculumTree .lms-content-row {
        grid-template-columns: auto minmax(0, 1fr) !important;
    }

    #curriculumTree .lms-content-row > .lms-status-badge,
    #curriculumTree .lms-content-row > .lms-content-actions {
        grid-column: 1 / -1 !important;
    }
}

/* ===== Builder row polish final 20260526 ===== */
#curriculumTree .lms-lesson-compact-card {
    margin-bottom: 12px !important;
}

#curriculumTree .lms-lesson-main {
    align-items: center !important;
    border-bottom: 1px solid #f1e6d6 !important;
}

#curriculumTree .lms-lesson-main .lms-pills {
    margin-top: 6px !important;
}

#curriculumTree .lms-lesson-actions {
    padding: 8px 14px !important;
    background: #fffaf2 !important;
    justify-content: flex-end !important;
}

#curriculumTree .lms-lesson-actions button {
    min-height: 30px !important;
    padding: 6px 9px !important;
    font-size: 11.5px !important;
}

#curriculumTree button[data-move-lesson-up],
#curriculumTree button[data-move-lesson-down] {
    width: 30px !important;
    min-width: 30px !important;
    padding: 0 !important;
}

#curriculumTree .lesson-builder-parts {
    padding: 8px 14px 12px !important;
    gap: 7px !important;
    background: #fff !important;
}

#curriculumTree .lms-content-row {
    min-height: 44px !important;
    border-radius: 12px !important;
    padding: 8px 10px !important;
    box-shadow: none !important;
}

#curriculumTree .lms-content-row.primary-lesson-video {
    background: linear-gradient(90deg, #fff8e8, #ffffff) !important;
    border-color: #efd8aa !important;
    border-inline-start: 5px solid #c9902f !important;
}

#curriculumTree .lms-content-row.exam {
    background: linear-gradient(90deg, #fff7ed, #ffffff) !important;
    border-color: #fed7aa !important;
}

#curriculumTree .lms-content-icon {
    width: 30px !important;
    height: 30px !important;
    font-size: 13px !important;
}

#curriculumTree .lms-content-main strong {
    font-size: 13px !important;
    line-height: 1.45 !important;
}

#curriculumTree .lms-content-main small {
    font-size: 11.5px !important;
    line-height: 1.35 !important;
}

#curriculumTree .lms-status-badge {
    min-height: 26px !important;
    padding: 5px 8px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    white-space: nowrap !important;
}

#curriculumTree .lms-content-actions button {
    min-height: 28px !important;
    padding: 5px 8px !important;
    font-size: 11.5px !important;
}

#curriculumTree .lms-unit-exams {
    margin-top: 8px !important;
}

#curriculumTree .lms-section-label {
    display: block !important;
    margin: 8px 0 !important;
    color: #9b6b1d !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

/* إخفاء السهم/الدائرة الزائدة داخل صفوف المحتوى لو ظهرت من CSS قديم */
#curriculumTree .lms-content-row > .lms-drag-handle {
    display: none !important;
}

@media (min-width: 901px) {
    #curriculumTree .lms-lesson-compact-card {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    #curriculumTree .lms-lesson-actions {
        border-top: 0 !important;
    }
}

@media (max-width: 900px) {
    #curriculumTree .lms-lesson-actions {
        justify-content: flex-start !important;
    }
}

/* ===== Clean video modal fields 20260526 ===== */
#videoOrder,
label:has(#videoOrder),
.form-group:has(#videoOrder),
.lms-form-group:has(#videoOrder),
.field:has(#videoOrder) {
    display: none !important;
}

#videoDurationMinutes {
    background: #f8fafc !important;
    color: #64748b !important;
    cursor: not-allowed !important;
}

#videoModal h3::after {
    content: " — فيديو واحد فقط لكل درس";
    font-size: 12px;
    color: #9b6b1d;
    font-weight: 800;
}

/* ===== Builder lesson structure reset 20260526 ===== */
#curriculumTree .lms-lesson-compact-card {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 0 12px !important;
    border: 1px solid #eadfcd !important;
    border-radius: 16px !important;
    background: #fff !important;
    overflow: hidden !important;
}

#curriculumTree .lms-lesson-main {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: unset !important;
    height: auto !important;
    padding: 10px 14px !important;
    background: linear-gradient(90deg, #ffffff, #fffaf2) !important;
    border-bottom: 1px solid #f0e5d4 !important;
}

#curriculumTree .lms-lesson-main p {
    margin: 0 !important;
    max-width: 100% !important;
}

#curriculumTree .lms-lesson-actions {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
    padding: 8px 14px !important;
    background: #fffdf8 !important;
    border-bottom: 1px dashed #eadfcd !important;
}

#curriculumTree .lesson-builder-parts {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 7px !important;
    padding: 8px 14px 12px !important;
    background: #fff !important;
    border-top: 0 !important;
}

#curriculumTree .lms-content-row {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto auto !important;
    gap: 9px !important;
    align-items: center !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    border-radius: 12px !important;
}

#curriculumTree .lms-content-row.primary-lesson-video {
    background: #fff8e8 !important;
    border: 1px solid #efd8aa !important;
    border-inline-start: 5px solid #c9902f !important;
}

#curriculumTree .lms-content-row.exam,
#curriculumTree .lms-content-row.unit-exam {
    background: #fff7ed !important;
    border: 1px solid #fed7aa !important;
    border-inline-start: 5px solid #f59e0b !important;
}

#curriculumTree .lms-content-row.material {
    background: #f8fbff !important;
    border-inline-start: 5px solid #3b82f6 !important;
}

#curriculumTree .lms-content-row.homework {
    background: #fbf9ff !important;
    border-inline-start: 5px solid #7c3aed !important;
}

#curriculumTree .lms-content-row > .lms-drag-handle {
    display: none !important;
}

#curriculumTree .lms-lesson-actions button,
#curriculumTree .lms-content-actions button {
    min-height: 30px !important;
    padding: 6px 9px !important;
    font-size: 11.5px !important;
}

#curriculumTree button[data-add-exam] {
    background: #fff7ed !important;
    border-color: #fed7aa !important;
    color: #92400e !important;
}

#curriculumTree button[data-add-video],
#curriculumTree button[data-edit-video] {
    background: #fff8e8 !important;
    border-color: #efd8aa !important;
    color: #7a4b00 !important;
}

@media (max-width: 900px) {
    #curriculumTree .lms-content-row {
        grid-template-columns: auto minmax(0, 1fr) !important;
    }

    #curriculumTree .lms-content-row .lms-status-badge,
    #curriculumTree .lms-content-row .lms-content-actions {
        grid-column: 1 / -1 !important;
    }
}

/* ===== UAB isolated clean lesson cards 20260526 ===== */
#curriculumTree .uab-lesson-card,
#curriculumTree .uab-lesson-card * {
    box-sizing: border-box;
}

#curriculumTree .uab-lesson-card {
    border: 1px solid #eadfcd !important;
    border-radius: 18px !important;
    background: #fff !important;
    overflow: hidden !important;
    margin: 0 0 14px !important;
    box-shadow: 0 8px 22px rgba(24, 61, 47, .045) !important;
}

#curriculumTree .uab-lesson-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 12px !important;
    align-items: center !important;
    padding: 14px 16px !important;
    background: linear-gradient(90deg, #ffffff, #fffaf0) !important;
    border-bottom: 1px solid #f0e4d2 !important;
}

#curriculumTree .uab-lesson-title {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    min-width: 0 !important;
}

#curriculumTree .uab-lesson-play {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #e8f5ec !important;
    color: #174937 !important;
    flex: 0 0 auto !important;
    font-weight: 900 !important;
}

#curriculumTree .uab-lesson-title h4 {
    margin: 0 !important;
    color: #143b2d !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
}

#curriculumTree .uab-lesson-title p {
    margin: 2px 0 0 !important;
    color: #667085 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

#curriculumTree .uab-lesson-badges {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
}

#curriculumTree .uab-lesson-badges span {
    border: 1px solid #eadfcd !important;
    background: #fbf7ef !important;
    color: #174937 !important;
    border-radius: 999px !important;
    padding: 5px 8px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

#curriculumTree .uab-lesson-badges .ok {
    background: #e8f7ef !important;
    border-color: #c9ead6 !important;
}

#curriculumTree .uab-lesson-badges .warn {
    background: #fff7ed !important;
    border-color: #fed7aa !important;
    color: #92400e !important;
}

#curriculumTree .uab-lesson-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    flex-wrap: wrap !important;
    padding: 10px 16px !important;
    background: #fffdf8 !important;
    border-bottom: 1px dashed #eadfcd !important;
}

#curriculumTree .uab-lesson-actions button,
#curriculumTree .uab-part-actions button {
    min-height: 30px !important;
    border-radius: 10px !important;
    border: 1px solid #e2d5c3 !important;
    background: #fff !important;
    color: #174937 !important;
    padding: 6px 10px !important;
    font-size: 11.5px !important;
    font-weight: 900 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
}

#curriculumTree .uab-lesson-actions button:hover,
#curriculumTree .uab-part-actions button:hover {
    background: #eef8f1 !important;
}

#curriculumTree .uab-lesson-actions button.danger,
#curriculumTree .uab-part-actions button.danger {
    background: #fff8f6 !important;
    border-color: #fecdca !important;
    color: #b42318 !important;
}

#curriculumTree .uab-lesson-actions .uab-mini {
    width: 30px !important;
    min-width: 30px !important;
    padding: 0 !important;
}

#curriculumTree .uab-lesson-parts {
    display: grid !important;
    gap: 8px !important;
    padding: 10px 16px 14px !important;
    background: #fff !important;
}

#curriculumTree .uab-part {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto auto !important;
    gap: 10px !important;
    align-items: center !important;
    min-height: 46px !important;
    border: 1px solid #eee2cf !important;
    border-radius: 14px !important;
    padding: 9px 10px !important;
    background: #fffefa !important;
}

#curriculumTree .uab-video {
    background: #fff8e8 !important;
    border-color: #efd8aa !important;
    border-inline-start: 5px solid #c9902f !important;
}

#curriculumTree .uab-exam {
    background: #fff7ed !important;
    border-color: #fed7aa !important;
    border-inline-start: 5px solid #f59e0b !important;
}

#curriculumTree .uab-file {
    background: #f8fbff !important;
    border-inline-start: 5px solid #3b82f6 !important;
}

#curriculumTree .uab-homework {
    background: #fbf9ff !important;
    border-inline-start: 5px solid #7c3aed !important;
}

#curriculumTree .uab-warning {
    background: #fff7ed !important;
    border-color: #fed7aa !important;
}

#curriculumTree .uab-empty {
    border-style: dashed !important;
    background: #f8fafc !important;
}

#curriculumTree .uab-part-icon {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #eef8f1 !important;
    color: #174937 !important;
    font-weight: 900 !important;
}

#curriculumTree .uab-part-body {
    min-width: 0 !important;
}

#curriculumTree .uab-part-body strong {
    display: block !important;
    color: #143b2d !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

#curriculumTree .uab-part-body small {
    display: block !important;
    color: #667085 !important;
    font-size: 11.5px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

#curriculumTree .uab-status {
    border-radius: 999px !important;
    background: #e8f7ef !important;
    color: #174937 !important;
    padding: 5px 8px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

#curriculumTree .uab-part-actions {
    display: flex !important;
    gap: 6px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
}

@media (max-width: 900px) {
    #curriculumTree .uab-lesson-head,
    #curriculumTree .uab-part {
        grid-template-columns: 1fr !important;
    }

    #curriculumTree .uab-lesson-badges,
    #curriculumTree .uab-part-actions {
        justify-content: flex-start !important;
    }
}

/* ===== UAB full unit/lesson builder rebuild 20260526 ===== */
#curriculumTree .uab-unit-card,
#curriculumTree .uab-unit-card *,
#curriculumTree .uab-lesson-card,
#curriculumTree .uab-lesson-card * {
    box-sizing: border-box;
}

#curriculumTree .uab-unit-card {
    background: #fff;
    border: 1px solid #eadfcd;
    border-radius: 22px;
    overflow: hidden;
    margin-bottom: 16px;
    box-shadow: 0 12px 30px rgba(20, 59, 45, .06);
}

#curriculumTree .uab-unit-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 14px;
    align-items: center;
    padding: 16px;
    background: linear-gradient(90deg, #eef8f1, #fff7e6);
    border-bottom: 1px solid #eadfcd;
}

#curriculumTree .uab-unit-title {
    display: flex;
    align-items: center;
    gap: 12px;
    border: 0;
    background: transparent;
    text-align: right;
    padding: 0;
    cursor: pointer;
}

#curriculumTree .uab-unit-index {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #dff3e8;
    color: #174937;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    flex: 0 0 auto;
}

#curriculumTree .uab-unit-title h3 {
    margin: 0;
    color: #143b2d;
    font-size: 17px;
    line-height: 1.5;
}

#curriculumTree .uab-unit-title p {
    margin: 3px 0 0;
    color: #667085;
    font-size: 12.5px;
}

#curriculumTree .uab-unit-stats,
#curriculumTree .uab-unit-actions {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    align-items: center;
}

#curriculumTree .uab-unit-stats span {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: #fffaf0;
    border: 1px solid #eadfcd;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #174937;
    font-weight: 900;
    font-size: 13px;
}

#curriculumTree .uab-unit-stats small {
    font-size: 10px;
    color: #667085;
    margin-top: 2px;
}

#curriculumTree .uab-unit-actions button,
#curriculumTree .uab-unit-toolbar button,
#curriculumTree .uab-lesson-actions button,
#curriculumTree .uab-part-actions button {
    min-height: 32px;
    border-radius: 11px;
    border: 1px solid #e2d5c3;
    background: #fff;
    color: #174937;
    padding: 7px 11px;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
    white-space: nowrap;
}

#curriculumTree .uab-unit-actions button:hover,
#curriculumTree .uab-unit-toolbar button:hover,
#curriculumTree .uab-lesson-actions button:hover,
#curriculumTree .uab-part-actions button:hover {
    background: #eef8f1;
}

#curriculumTree .uab-unit-toolbar button.primary {
    background: #c9902f;
    border-color: #c9902f;
    color: #fff;
}

#curriculumTree .uab-unit-actions button.danger,
#curriculumTree .uab-lesson-actions button.danger,
#curriculumTree .uab-part-actions button.danger {
    background: #fff8f6;
    border-color: #fecdca;
    color: #b42318;
}

#curriculumTree .uab-unit-status,
#curriculumTree .uab-status {
    border-radius: 999px;
    padding: 6px 9px;
    font-size: 11px;
    font-weight: 900;
    background: #e8f7ef;
    color: #174937;
    white-space: nowrap;
}

#curriculumTree .uab-unit-status.draft {
    background: #fff7ed;
    color: #92400e;
}

#curriculumTree .uab-unit-body {
    padding: 14px 16px 18px;
    background: #fffdf8;
}

#curriculumTree .uab-unit-toolbar {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

#curriculumTree .uab-lessons-list {
    display: grid;
    gap: 12px;
}

#curriculumTree .uab-empty-state {
    border: 1px dashed #eadfcd;
    border-radius: 16px;
    background: #fff;
    color: #667085;
    padding: 18px;
    text-align: center;
    font-weight: 800;
}

#curriculumTree .uab-lesson-card {
    border: 1px solid #eadfcd;
    border-radius: 18px;
    background: #fff;
    overflow: hidden;
}

#curriculumTree .uab-lesson-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 13px 14px;
    background: #fff;
    border-bottom: 1px solid #f0e4d2;
}

#curriculumTree .uab-lesson-title {
    display: flex;
    gap: 10px;
    align-items: center;
    min-width: 0;
}

#curriculumTree .uab-lesson-play,
#curriculumTree .uab-part-icon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #e8f5ec;
    color: #174937;
    font-weight: 900;
    flex: 0 0 auto;
}

#curriculumTree .uab-lesson-title h4 {
    margin: 0;
    color: #143b2d;
    font-size: 15px;
    line-height: 1.45;
}

#curriculumTree .uab-lesson-title p {
    margin: 2px 0 0;
    color: #667085;
    font-size: 12px;
}

#curriculumTree .uab-lesson-badges {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
}

#curriculumTree .uab-lesson-badges span {
    border: 1px solid #eadfcd;
    background: #fbf7ef;
    color: #174937;
    border-radius: 999px;
    padding: 5px 8px;
    font-size: 11px;
    font-weight: 900;
}

#curriculumTree .uab-lesson-badges .ok {
    background: #e8f7ef;
    border-color: #c9ead6;
}

#curriculumTree .uab-lesson-badges .warn {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #92400e;
}

#curriculumTree .uab-lesson-actions {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    padding: 9px 14px;
    background: #fffaf2;
    border-bottom: 1px dashed #eadfcd;
}

#curriculumTree .uab-lesson-actions .uab-mini {
    width: 30px;
    min-width: 30px;
    padding: 0;
}

#curriculumTree .uab-lesson-parts {
    display: grid;
    gap: 8px;
    padding: 10px 14px 14px;
}

#curriculumTree .uab-part {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 10px;
    align-items: center;
    border: 1px solid #eee2cf;
    border-radius: 14px;
    padding: 9px 10px;
    background: #fffefa;
    min-height: 46px;
}

#curriculumTree .uab-video {
    background: #fff8e8;
    border-color: #efd8aa;
    border-inline-start: 5px solid #c9902f;
}

#curriculumTree .uab-exam {
    background: #fff7ed;
    border-color: #fed7aa;
    border-inline-start: 5px solid #f59e0b;
}

#curriculumTree .uab-file {
    background: #f8fbff;
    border-inline-start: 5px solid #3b82f6;
}

#curriculumTree .uab-homework {
    background: #fbf9ff;
    border-inline-start: 5px solid #7c3aed;
}

#curriculumTree .uab-warning {
    background: #fff7ed;
    border-color: #fed7aa;
}

#curriculumTree .uab-empty {
    border-style: dashed;
    background: #f8fafc;
}

#curriculumTree .uab-part-body {
    min-width: 0;
}

#curriculumTree .uab-part-body strong,
#curriculumTree .uab-part-body small {
    display: block;
    white-space: normal;
    overflow-wrap: anywhere;
}

#curriculumTree .uab-part-body strong {
    color: #143b2d;
    font-size: 13px;
    line-height: 1.45;
}

#curriculumTree .uab-part-body small {
    color: #667085;
    font-size: 11.5px;
    line-height: 1.35;
}

#curriculumTree .uab-part-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
}

#curriculumTree .uab-unit-exams {
    margin-top: 14px;
    border-top: 1px dashed #eadfcd;
    padding-top: 12px;
}

#curriculumTree .uab-unit-exams h4 {
    margin: 0 0 10px;
    color: #9b6b1d;
    font-size: 13px;
}

#curriculumTree .uab-unit-exams-list {
    display: grid;
    gap: 8px;
}

@media (max-width: 1000px) {
    #curriculumTree .uab-unit-head,
    #curriculumTree .uab-lesson-head,
    #curriculumTree .uab-part {
        grid-template-columns: 1fr;
    }

    #curriculumTree .uab-unit-stats,
    #curriculumTree .uab-unit-actions,
    #curriculumTree .uab-lesson-badges,
    #curriculumTree .uab-part-actions {
        justify-content: flex-start;
    }
}

/* ===== Unified lesson/video modal + simplified homework 20260526 ===== */
#lessonThumbnail,
#lessonThumbnailFile,
#lessonThumbnailPreview,
#chooseLessonThumbnail,
#lessonModal .lms-upload-box:has(#lessonThumbnail) {
    display: none !important;
}

.uab-form-hint {
    display: block;
    margin-top: 6px;
    color: #667085;
    font-size: 12px;
    line-height: 1.6;
}

.uab-hidden-homework-defaults {
    display: none !important;
}

#videoOrder,
label:has(#videoOrder),
#videoDurationMinutes,
label:has(#videoDurationMinutes) {
    display: none !important;
}

/* ===== Force unified lesson/video + simple homework 20260526 ===== */
.uab-form-hint {
    display: block;
    margin-top: 6px;
    color: #667085;
    font-size: 12px;
    line-height: 1.6;
}

#videoOrder,
label:has(#videoOrder),
#videoDurationMinutes,
label:has(#videoDurationMinutes),
#lessonThumbnail,
#lessonThumbnailFile,
#lessonThumbnailPreview,
#chooseLessonThumbnail,
#lessonModal .lms-upload-box:has(#lessonThumbnail) {
    display: none !important;
}

/* ===== Free exam curriculum order 20260526 ===== */
#curriculumTree .uab-free-exam-row {
    margin: 0 !important;
}

#curriculumTree .uab-free-exam-row .uab-mini,
#curriculumTree .uab-lesson-actions .uab-mini {
    width: 30px !important;
    min-width: 30px !important;
    padding: 0 !important;
}

/* ===== Lesson is the video; no inner video card 20260526 ===== */
#curriculumTree .uab-lesson-parts:empty {
    display: none !important;
}

#curriculumTree .uab-lesson-card {
    border-inline-start: 5px solid #c9902f !important;
}

#curriculumTree .uab-lesson-play {
    background: #fff3d8 !important;
    color: #7a4b00 !important;
}

#curriculumTree .uab-free-exam-row {
    border-inline-start: 5px solid #f59e0b !important;
}

/* ===== Curriculum free drag and drop 20260527 ===== */
#curriculumTree [data-curriculum-item="1"] {
    cursor: grab !important;
}

#curriculumTree [data-curriculum-item="1"]:active {
    cursor: grabbing !important;
}

#curriculumTree .uab-dragging {
    opacity: .55 !important;
    transform: scale(.995) !important;
    outline: 2px dashed #c9902f !important;
    outline-offset: 3px !important;
}

#curriculumTree .uab-lessons-list.uab-drag-over {
    background: #fff8e8 !important;
    border-radius: 16px !important;
    outline: 2px dashed #efd8aa !important;
    outline-offset: 4px !important;
}

#curriculumTree .uab-free-exam-row {
    cursor: grab !important;
}

/* ===== True free curriculum drag V2 - 20260527 ===== */
#curriculumTree [data-curriculum-item="1"] {
    cursor: grab !important;
    user-select: none !important;
}

#curriculumTree [data-curriculum-item="1"] button,
#curriculumTree [data-curriculum-item="1"] input,
#curriculumTree [data-curriculum-item="1"] textarea,
#curriculumTree [data-curriculum-item="1"] select {
    cursor: pointer !important;
}

#curriculumTree .uab-dragging {
    opacity: .45 !important;
    outline: 2px dashed #c9902f !important;
    outline-offset: 4px !important;
    box-shadow: 0 18px 40px rgba(20, 59, 45, .12) !important;
}

#curriculumTree .uab-lessons-list.uab-drag-over {
    background: #fff8e8 !important;
    border-radius: 18px !important;
    outline: 2px dashed #efd8aa !important;
    outline-offset: 5px !important;
    min-height: 70px !important;
}

#curriculumTree .uab-drop-before {
    border-top: 4px solid #c9902f !important;
}

#curriculumTree .uab-drop-after {
    border-bottom: 4px solid #c9902f !important;
}

/* ===== Fast arrows, no drag 20260527 ===== */
#curriculumTree [data-curriculum-item="1"] {
    cursor: default !important;
}

#curriculumTree [data-curriculum-item="1"][draggable="true"] {
    cursor: default !important;
}

#curriculumTree .uab-fast-moving {
    outline: 2px solid #c9902f !important;
    outline-offset: 3px !important;
    background: #fff8e8 !important;
    transition: transform .18s ease, background .18s ease !important;
}

#curriculumTree .uab-dragging,
#curriculumTree .uab-drag-over,
#curriculumTree .uab-drop-before,
#curriculumTree .uab-drop-after {
    outline: none !important;
    opacity: 1 !important;
    border-top-width: inherit !important;
    border-bottom-width: inherit !important;
}

#curriculumTree .uab-mini {
    cursor: pointer !important;
    font-weight: 900 !important;
}

/* ===== Super stable curriculum arrows V4 - 20260527 ===== */
#curriculumTree [data-order-row="1"] {
    cursor: default !important;
}

#curriculumTree .uab-fast-moving {
    outline: 2px solid #c9902f !important;
    outline-offset: 3px !important;
    background: #fff8e8 !important;
    transition: background .18s ease, outline .18s ease !important;
}

#curriculumTree .uab-mini {
    cursor: pointer !important;
    font-weight: 900 !important;
}

#curriculumTree .uab-dragging,
#curriculumTree .uab-drag-over,
#curriculumTree .uab-drop-before,
#curriculumTree .uab-drop-after {
    outline: none !important;
    opacity: 1 !important;
    border-top-width: inherit !important;
    border-bottom-width: inherit !important;
}

/* ===== Stable drag on V4 arrows 20260527 ===== */
#curriculumTree [data-order-row="1"] {
    cursor: grab !important;
    user-select: none !important;
}

#curriculumTree [data-order-row="1"]:active {
    cursor: grabbing !important;
}

#curriculumTree [data-order-row="1"] button,
#curriculumTree [data-order-row="1"] input,
#curriculumTree [data-order-row="1"] textarea,
#curriculumTree [data-order-row="1"] select {
    cursor: pointer !important;
}

#curriculumTree .uab-dragging {
    opacity: .55 !important;
    outline: 2px dashed #c9902f !important;
    outline-offset: 4px !important;
    background: #fff8e8 !important;
}

#curriculumTree .uab-lessons-list.uab-drag-over {
    background: #fff8e8 !important;
    border-radius: 16px !important;
    outline: 2px dashed #efd8aa !important;
    outline-offset: 4px !important;
}

/* ===== Pointer drag curriculum V6 - 20260527 ===== */
#curriculumTree [data-order-row="1"] {
    cursor: grab !important;
    touch-action: none !important;
    user-select: none !important;
}

#curriculumTree [data-order-row="1"] button,
#curriculumTree [data-order-row="1"] input,
#curriculumTree [data-order-row="1"] textarea,
#curriculumTree [data-order-row="1"] select {
    touch-action: auto !important;
    cursor: pointer !important;
}

#curriculumTree .uab-pointer-ready {
    outline: 1px dashed #efd8aa !important;
    outline-offset: 3px !important;
}

#curriculumTree .uab-pointer-dragging {
    cursor: grabbing !important;
    opacity: .62 !important;
    outline: 2px solid #c9902f !important;
    outline-offset: 4px !important;
    background: #fff8e8 !important;
    box-shadow: 0 18px 40px rgba(20, 59, 45, .14) !important;
    z-index: 20 !important;
}

body.uab-pointer-drag-active {
    cursor: grabbing !important;
    user-select: none !important;
}

#curriculumTree .uab-lessons-list.uab-drag-over {
    background: #fff8e8 !important;
    border-radius: 16px !important;
    outline: 2px dashed #efd8aa !important;
    outline-offset: 4px !important;
}

/* ===== Remove pointer drag behavior - arrows only 20260527 ===== */
#curriculumTree [data-order-row="1"],
#curriculumTree [data-curriculum-item="1"] {
    cursor: default !important;
    touch-action: auto !important;
    user-select: auto !important;
}

#curriculumTree .uab-pointer-ready,
#curriculumTree .uab-pointer-dragging,
#curriculumTree .uab-dragging,
#curriculumTree .uab-drag-over {
    outline: none !important;
    opacity: 1 !important;
    transform: none !important;
    box-shadow: inherit !important;
}

body.uab-pointer-drag-active {
    cursor: auto !important;
    user-select: auto !important;
}

#curriculumTree .uab-mini,
#curriculumTree [data-move-lesson-up],
#curriculumTree [data-move-lesson-down],
#curriculumTree [data-move-exam-up],
#curriculumTree [data-move-exam-down] {
    cursor: pointer !important;
    font-weight: 900 !important;
}

/* ===== Builder handle drag + ESC + sidebar safe 20260527 ===== */
#curriculumTree .uab-drag-handle {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    border-radius: 10px !important;
    border: 1px solid #eadfcd !important;
    background: #fff8e8 !important;
    color: #7a4b00 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: grab !important;
    font-weight: 900 !important;
    padding: 0 !important;
    line-height: 1 !important;
}

#curriculumTree .uab-drag-handle:active {
    cursor: grabbing !important;
}

#curriculumTree .uab-handle-dragging {
    opacity: .58 !important;
    outline: 2px solid #c9902f !important;
    outline-offset: 4px !important;
    background: #fff8e8 !important;
    box-shadow: 0 18px 40px rgba(20, 59, 45, .14) !important;
}

#curriculumTree .uab-lessons-list.uab-drag-over {
    background: #fff8e8 !important;
    border-radius: 16px !important;
    outline: 2px dashed #efd8aa !important;
    outline-offset: 4px !important;
}

body.uab-handle-drag-active {
    cursor: grabbing !important;
    user-select: none !important;
}

/* خلي Builder يسيب مساحة للسايدبار على الديسكتوب بدل ما يغطي الشاشة كلها */
@media (min-width: 901px) {
    .app-shell:not(.sidebar-collapsed) #builderModal.lms-modal.fullscreen.show {
        inset-inline-start: 280px !important;
        width: auto !important;
    }

    .app-shell.sidebar-collapsed #builderModal.lms-modal.fullscreen.show {
        inset-inline-start: 92px !important;
        width: auto !important;
    }

    #builderModal .lms-builder {
        height: 100vh !important;
    }
}

@media (max-width: 900px) {
    #builderModal.lms-modal.fullscreen.show {
        inset: 0 !important;
    }
}

/* ===== Final mouse handle drag for curriculum 20260527 ===== */
#curriculumTree .uab-drag-handle {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    border-radius: 12px !important;
    border: 1px solid #c9902f !important;
    background: #fff3d8 !important;
    color: #7a4b00 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: grab !important;
    font-weight: 900 !important;
    padding: 0 !important;
    line-height: 1 !important;
    user-select: none !important;
    touch-action: none !important;
}

#curriculumTree .uab-drag-handle:hover {
    background: #c9902f !important;
    color: #fff !important;
}

#curriculumTree .uab-drag-handle:active {
    cursor: grabbing !important;
}

#curriculumTree .uab-mouse-drag-ready {
    outline: 1px dashed #efd8aa !important;
    outline-offset: 3px !important;
}

#curriculumTree .uab-mouse-dragging {
    opacity: .58 !important;
    outline: 2px solid #c9902f !important;
    outline-offset: 4px !important;
    background: #fff8e8 !important;
    box-shadow: 0 18px 40px rgba(20, 59, 45, .14) !important;
}

#curriculumTree .uab-lessons-list.uab-drag-over {
    background: #fff8e8 !important;
    border-radius: 16px !important;
    outline: 2px dashed #efd8aa !important;
    outline-offset: 4px !important;
}

body.uab-mouse-drag-body {
    cursor: grabbing !important;
    user-select: none !important;
}

#curriculumTree .uab-free-exam-row {
    grid-template-columns: auto auto minmax(0, 1fr) auto auto !important;
}

/* ===== Direct document handle drag final 20260527 ===== */
#curriculumTree .uab-drag-handle {
    cursor: grab !important;
    user-select: none !important;
    touch-action: none !important;
}

#curriculumTree .uab-direct-drag-ready {
    outline: 1px dashed #efd8aa !important;
    outline-offset: 3px !important;
}

#curriculumTree .uab-direct-dragging {
    opacity: .55 !important;
    outline: 2px solid #c9902f !important;
    outline-offset: 4px !important;
    background: #fff8e8 !important;
    box-shadow: 0 18px 40px rgba(20, 59, 45, .14) !important;
}

#curriculumTree .uab-lessons-list.uab-drag-over {
    background: #fff8e8 !important;
    border-radius: 16px !important;
    outline: 2px dashed #efd8aa !important;
    outline-offset: 4px !important;
}

body.uab-direct-drag-body {
    cursor: grabbing !important;
    user-select: none !important;
}

/* ===== Final clean ghost drag 20260527 ===== */
#curriculumTree .uab-drag-handle {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    border-radius: 12px !important;
    border: 1px solid #c9902f !important;
    background: #fff3d8 !important;
    color: #7a4b00 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: grab !important;
    font-weight: 900 !important;
    padding: 0 !important;
    line-height: 1 !important;
    user-select: none !important;
}

#curriculumTree .uab-drag-handle:hover {
    background: #c9902f !important;
    color: #fff !important;
}

body.uab-ghost-drag-active {
    cursor: grabbing !important;
    user-select: none !important;
}

#curriculumTree .uab-row-hidden-during-drag {
    display: none !important;
}

.uab-drag-ghost {
    position: fixed !important;
    z-index: 999999 !important;
    pointer-events: none !important;
    opacity: .88 !important;
    transform: scale(.99) !important;
    box-shadow: 0 22px 55px rgba(20, 59, 45, .20) !important;
    background: #fff8e8 !important;
}

#curriculumTree .uab-drag-placeholder {
    border: 2px dashed #c9902f !important;
    border-radius: 16px !important;
    background: rgba(201, 144, 47, .10) !important;
    min-height: 48px !important;
}

#curriculumTree .uab-lessons-list.uab-drag-over {
    background: #fff8e8 !important;
    border-radius: 16px !important;
    outline: 2px dashed #efd8aa !important;
    outline-offset: 4px !important;
}

#curriculumTree .uab-free-exam-row {
    grid-template-columns: auto auto minmax(0, 1fr) auto auto !important;
}

/* ===== FINAL: force show curriculum drag handle 20260527 ===== */
#curriculumTree .uab-drag-handle,
#curriculumTree button.uab-drag-handle,
#curriculumTree [data-drag-handle] {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    border-radius: 12px !important;
    border: 1px solid #c9902f !important;
    background: #fff3d8 !important;
    color: #7a4b00 !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: grab !important;
    font-weight: 900 !important;
    font-size: 16px !important;
    padding: 0 !important;
    line-height: 1 !important;
    user-select: none !important;
    touch-action: none !important;
}

#curriculumTree .uab-drag-handle:hover,
#curriculumTree [data-drag-handle]:hover {
    background: #c9902f !important;
    color: #fff !important;
}

#curriculumTree .uab-drag-handle:active,
#curriculumTree [data-drag-handle]:active {
    cursor: grabbing !important;
}

/* لا تسمح لأي hide قديم يخفي زر السحب الجديد */
#curriculumTree [class*="drag"].uab-drag-handle,
#curriculumTree [class*="drag"][data-drag-handle] {
    display: inline-flex !important;
    visibility: visible !important;
}

/* ===== Builder copy + real hide controls 20260527 ===== */
.uab-hidden-preview-option {
    display: none !important;
}

#curriculumTree button.warning {
    border-color: #fed7aa !important;
    background: #fff7ed !important;
    color: #92400e !important;
}

#curriculumTree button.success {
    border-color: #bbf7d0 !important;
    background: #ecfdf3 !important;
    color: #166534 !important;
}

#curriculumTree [data-copy-unit],
#curriculumTree [data-copy-lesson],
#curriculumTree [data-toggle-unit-publish],
#curriculumTree [data-toggle-lesson-publish],
#curriculumTree [data-toggle-exam-publish] {
    font-weight: 900 !important;
}

/* ===== Remove lesson preview + professional delete + course buttons 20260527 ===== */

/* لا يوجد درس مجاني: المجاني على مستوى الكورس فقط */
#lessonModal #lessonFree,
#lessonModal label:has(#lessonFree),
#lessonModal .uab-hidden-preview-option {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* نافذة تأكيد احترافية بدل confirm المتصفح */
.uab-confirm-modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, .55);
    z-index: 9999999;
    padding: 18px;
}

.uab-confirm-modal.show {
    display: flex;
}

.uab-confirm-card {
    width: min(430px, 100%);
    background: #fffdf8;
    border: 1px solid #eadfcd;
    border-radius: 22px;
    padding: 24px;
    box-shadow: 0 28px 70px rgba(15, 23, 42, .22);
    position: relative;
    text-align: center;
}

.uab-confirm-x {
    position: absolute;
    top: 14px;
    left: 14px;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 10px;
    background: #f3f4f6;
    color: #173b2c;
    cursor: pointer;
    font-weight: 900;
}

.uab-confirm-icon {
    width: 52px;
    height: 52px;
    margin: 0 auto 12px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: #fff1f2;
    color: #dc2626;
    font-size: 28px;
    font-weight: 900;
}

.uab-confirm-card h3 {
    margin: 0 0 8px;
    color: #173b2c;
    font-size: 22px;
}

.uab-confirm-card p {
    margin: 0;
    color: #667085;
    line-height: 1.8;
}

.uab-confirm-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 20px;
}

.uab-confirm-actions button {
    border: 0;
    border-radius: 14px;
    padding: 12px 18px;
    font-weight: 900;
    cursor: pointer;
}

.uab-confirm-cancel {
    background: #f2eadc;
    color: #173b2c;
}

.uab-confirm-danger {
    background: #dc2626;
    color: #fff;
}

.uab-confirm-primary {
    background: #1f4a38;
    color: #fff;
}

/* تحسين أزرار كروت الكورسات */
.lms-course-card footer,
.lms-course-card .course-actions,
.lms-course-card .lms-course-actions {
    display: flex !important;
    gap: 8px !important;
    align-items: center !important;
    justify-content: stretch !important;
}

.lms-course-card footer button,
.lms-course-card footer a,
.lms-course-card .course-actions button,
.lms-course-card .course-actions a,
.lms-course-card .lms-course-actions button,
.lms-course-card .lms-course-actions a {
    flex: 1 1 0 !important;
    min-height: 44px !important;
    border-radius: 14px !important;
    border: 1px solid #eadfcd !important;
    padding: 10px 12px !important;
    font-weight: 900 !important;
    font-size: 13px !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    box-shadow: 0 8px 20px rgba(24, 61, 47, .06) !important;
}

.lms-course-card [data-build-course],
.lms-course-card [data-open-builder] {
    background: linear-gradient(135deg, #c9902f, #b57d22) !important;
    color: #fff !important;
    border-color: transparent !important;
}

.lms-course-card [data-edit-course] {
    background: #fff8e8 !important;
    color: #173b2c !important;
}

.lms-course-card [data-preview-course] {
    background: #f2eadc !important;
    color: #173b2c !important;
}


.lms-course-card .uab-course-btn-build {
    background: linear-gradient(135deg, #c9902f, #b57d22) !important;
    color: #fff !important;
    border-color: transparent !important;
}

.lms-course-card .uab-course-btn-edit {
    background: #fff8e8 !important;
    color: #173b2c !important;
}

.lms-course-card .uab-course-btn-preview {
    background: #f2eadc !important;
    color: #173b2c !important;
}

/* ===== Google Form style exam builder 20260527 ===== */

/* خلي Exam Builder يسيب مساحة للسايدبار الأساسي على الديسكتوب */
@media (min-width: 901px) {
    .app-shell:not(.sidebar-collapsed) #examModal.lms-modal.fullscreen.show {
        inset-inline-start: 280px !important;
        width: auto !important;
    }

    .app-shell.sidebar-collapsed #examModal.lms-modal.fullscreen.show {
        inset-inline-start: 92px !important;
        width: auto !important;
    }
}

/* تخطيط Google Forms: إعدادات يمين + الأسئلة في الوسط */
#examModal.uab-google-form-exam .lms-exam-layout,
#examModal .quiz-builder-page .lms-exam-layout {
    display: grid !important;
    grid-template-columns: 310px minmax(0, 1fr) !important;
    grid-template-areas: "settings questions" !important;
    gap: 0 !important;
    background: #fbf7ef !important;
    min-height: 0 !important;
}

/* إعدادات الامتحان يمين */
#examModal .lms-exam-settings-panel {
    grid-area: settings !important;
    order: 1 !important;
    border-left: 1px solid #e6dfd2 !important;
    border-right: 0 !important;
    background: #fffdf8 !important;
    padding: 18px !important;
    overflow: auto !important;
    position: sticky !important;
    top: 0 !important;
    height: calc(100vh - 88px) !important;
}

/* منطقة الأسئلة في المنتصف */
#examModal .lms-question-main {
    grid-area: questions !important;
    order: 2 !important;
    padding: 24px 34px !important;
    overflow: auto !important;
    background: #f7f3ea !important;
}

/* نخفي قائمة الأسئلة الجانبية مؤقتًا لأنها هتزحم التصميم */
#examModal .lms-question-list-panel {
    display: none !important;
}

/* Google Forms look */
#examModal .lms-question-main .lms-panel-head {
    max-width: 860px !important;
    margin: 0 auto 18px !important;
    background: #fff !important;
    border: 1px solid #eadfcd !important;
    border-top: 8px solid #1f4a38 !important;
    border-radius: 18px !important;
    padding: 18px 20px !important;
    box-shadow: 0 10px 28px rgba(24, 61, 47, .06) !important;
}

#examModal .lms-question-main .lms-panel-head h4 {
    font-size: 24px !important;
    margin: 0 !important;
    color: #173b2c !important;
}

#examModal .lms-question-main .lms-panel-head p {
    color: #667085 !important;
    line-height: 1.7 !important;
}

/* اعرض كل الأسئلة تحت بعض، لا تخفي غير active */
#examModal .quiz-builder-page .lms-question-draft:not(.active),
#examModal .lms-question-draft:not(.active) {
    display: grid !important;
}

#examModal .lms-question-list {
    max-width: 860px !important;
    margin: 0 auto !important;
    display: grid !important;
    gap: 18px !important;
}

#examModal .lms-question-draft {
    max-width: none !important;
    width: 100% !important;
    border-radius: 18px !important;
    background: #fff !important;
    border: 1px solid #eadfcd !important;
    border-inline-start: 6px solid transparent !important;
    box-shadow: 0 10px 28px rgba(24, 61, 47, .06) !important;
    padding: 18px !important;
}

#examModal .lms-question-draft.active {
    border-color: #d9cbb8 !important;
    border-inline-start-color: #1f4a38 !important;
}

/* هيدر السؤال */
#examModal .lms-question-draft header {
    position: static !important;
    background: #fffdf8 !important;
    border: 1px solid #f0e4d4 !important;
    border-radius: 14px !important;
    padding: 10px 12px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

#examModal .lms-question-draft header strong {
    font-size: 15px !important;
    color: #173b2c !important;
    margin-inline-end: auto !important;
}

#examModal .lms-drag-handle {
    width: 30px !important;
    height: 30px !important;
    border-radius: 10px !important;
    background: #f2eadc !important;
    display: inline-grid !important;
    place-items: center !important;
    color: #8a5a10 !important;
    cursor: grab !important;
}

/* الحقول */
#examModal .lms-question-draft input,
#examModal .lms-question-draft textarea,
#examModal .lms-question-draft select,
#examModal .lms-exam-settings-panel input,
#examModal .lms-exam-settings-panel textarea,
#examModal .lms-exam-settings-panel select {
    border-radius: 12px !important;
    border: 1px solid #d8d0c3 !important;
    padding: 12px !important;
    background: #fff !important;
}

#examModal .lms-question-draft .q-text {
    min-height: 120px !important;
    font-size: 17px !important;
    line-height: 1.9 !important;
}

/* الاختيارات */
#examModal .lms-option-toolbar {
    border: 1px dashed #eadfcd !important;
    background: #fffdf8 !important;
    border-radius: 14px !important;
}

#examModal .lms-option-row {
    border-radius: 14px !important;
    background: #fff !important;
    border: 1px solid #eadfcd !important;
    padding: 10px !important;
}

/* إعدادات الامتحان ككارت يمين */
#examModal .lms-exam-settings-panel h4 {
    font-size: 21px !important;
    color: #173b2c !important;
    margin: 0 0 6px !important;
}

#examModal .lms-exam-settings-panel label {
    background: #fff !important;
    border: 1px solid #eee7dc !important;
    border-radius: 14px !important;
    padding: 12px !important;
}

#examModal .lms-exam-settings-panel .lms-check {
    display: flex !important;
    justify-content: space-between !important;
    flex-direction: row-reverse !important;
}

#examModal .lms-linked-context {
    border-radius: 14px !important;
    background: #f7f3ea !important;
}

/* لا يوجد امتحان مجاني منفصل */
#examModal #examFree,
#examModal label:has(#examFree),
#examModal .uab-hidden-exam-free {
    display: none !important;
}

/* أزرار أعلى الصفحة */
#examModal .lms-builder-actions .lms-button {
    min-height: 42px !important;
    border-radius: 14px !important;
    font-weight: 900 !important;
}

#examModal #publishExamDraftButton {
    background: linear-gradient(135deg, #c9902f, #b57d22) !important;
    color: #fff !important;
}

/* موبايل */
@media (max-width: 900px) {
    #examModal.lms-modal.fullscreen.show {
        inset: 0 !important;
    }

    #examModal .lms-exam-layout {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "settings"
            "questions" !important;
    }

    #examModal .lms-exam-settings-panel {
        position: static !important;
        height: auto !important;
    }

    #examModal .lms-question-main {
        padding: 16px !important;
    }
}

/* ===== Exam builder header + free settings scroll fix 20260527 ===== */

/* خلي بناء الامتحان مايبقاش مزنوق تحت هيدر المنصة */
#examModal.lms-modal.fullscreen.show {
    align-items: stretch !important;
    justify-content: stretch !important;
    padding: 0 !important;
}

/* الهيدر الداخلي للامتحان يتحرك طبيعي ولا يستخبى تحت الهيدر العام */
#examModal .lms-builder-head,
#examModal .lms-builder-head-modern,
#examModal .quiz-builder-page .lms-builder-head-modern {
    position: static !important;
    top: auto !important;
    z-index: auto !important;
    min-height: 86px !important;
    flex-shrink: 0 !important;
}

/* خلي صفحة الامتحان كلها هي اللي تسكرول، مش إعدادات الامتحان وحدها */
#examModal .lms-exam-builder,
#examModal .quiz-builder-page {
    height: 100vh !important;
    overflow: auto !important;
}

/* امنع السكروول المنفصل من إعدادات الامتحان */
#examModal .lms-exam-settings-panel {
    position: static !important;
    top: auto !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    align-self: start !important;
}

/* امنع السكروول المنفصل من منطقة الأسئلة */
#examModal .lms-question-main {
    overflow: visible !important;
}

/* تخطيط الصفحة يفضل ثابت بصريًا لكن السكروول يبقى عام */
#examModal .lms-exam-layout {
    min-height: auto !important;
    align-items: start !important;
}

/* لو الهيدر العام ظاهر فوق المودال، انزل المودال تحته شوية */
@media (min-width: 901px) {
    #examModal.lms-modal.fullscreen.show {
        padding-top: 0 !important;
    }

    #examModal .lms-exam-builder {
        border-radius: 0 !important;
    }
}

/* موبايل */
@media (max-width: 900px) {
    #examModal .lms-exam-builder,
    #examModal .quiz-builder-page {
        height: 100vh !important;
        overflow: auto !important;
    }

    #examModal .lms-exam-settings-panel,
    #examModal .lms-question-main {
        overflow: visible !important;
    }
}

/* ===== Exam builder truly moving header + import modal 20260527 ===== */

/* اجعل المودال نفسه هو السكرول، والهيدر الداخلي جزء من المحتوى وليس ثابت */
#examModal.lms-modal.fullscreen.show {
    position: fixed !important;
    overflow: auto !important;
    align-items: flex-start !important;
    justify-content: stretch !important;
    padding: 0 !important;
}

#examModal .lms-exam-builder,
#examModal .quiz-builder-page {
    height: auto !important;
    min-height: 100vh !important;
    overflow: visible !important;
    display: block !important;
}

#examModal .lms-builder-head,
#examModal .lms-builder-head-modern,
#examModal .quiz-builder-page .lms-builder-head-modern {
    position: relative !important;
    top: auto !important;
    z-index: 1 !important;
}

/* ألغِ أي flex قديم يخلي الهيدر ثابت والمحتوى وحده يسكرول */
#examModal .lms-exam-layout {
    min-height: auto !important;
    height: auto !important;
    overflow: visible !important;
}

/* نافذة الاستيراد */
.uab-import-dialog {
    width: min(760px, 96vw) !important;
}

#examImportText {
    min-height: 260px !important;
    line-height: 1.9 !important;
    font-family: inherit !important;
}

#openExamImport {
    background: #fff8e8 !important;
    color: #173b2c !important;
    border: 1px solid #eadfcd !important;
}

/* ===== Reapply Google Form exam builder + import safe 20260527 ===== */

/* الهيدر الداخلي يتحرك مع الصفحة */
#examModal.lms-modal.fullscreen.show {
    position: fixed !important;
    overflow: auto !important;
    align-items: flex-start !important;
    justify-content: stretch !important;
    padding: 0 !important;
}

#examModal .lms-exam-builder,
#examModal .quiz-builder-page {
    height: auto !important;
    min-height: 100vh !important;
    overflow: visible !important;
    display: block !important;
}

#examModal .lms-builder-head,
#examModal .lms-builder-head-modern,
#examModal .quiz-builder-page .lms-builder-head-modern {
    position: relative !important;
    top: auto !important;
    z-index: 1 !important;
}

/* إعدادات يمين + أسئلة تحت بعض */
#examModal .lms-exam-layout {
    display: grid !important;
    grid-template-columns: 310px minmax(0, 1fr) !important;
    grid-template-areas: "settings questions" !important;
    height: auto !important;
    min-height: auto !important;
    overflow: visible !important;
    background: #fbf7ef !important;
}

#examModal .lms-exam-settings-panel {
    grid-area: settings !important;
    position: static !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    background: #fffdf8 !important;
    border-left: 1px solid #e6dfd2 !important;
    border-right: 0 !important;
    padding: 18px !important;
}

#examModal .lms-question-main {
    grid-area: questions !important;
    overflow: visible !important;
    background: #f7f3ea !important;
    padding: 24px 34px !important;
}

/* نخفي قائمة الأسئلة الجانبية */
#examModal .lms-question-list-panel {
    display: none !important;
}

/* عرض كل الأسئلة */
#examModal .lms-question-draft:not(.active) {
    display: grid !important;
}

#examModal .lms-question-list {
    max-width: 860px !important;
    margin: 0 auto !important;
    display: grid !important;
    gap: 18px !important;
}

#examModal .lms-question-main .lms-panel-head {
    max-width: 860px !important;
    margin: 0 auto 18px !important;
    background: #fff !important;
    border: 1px solid #eadfcd !important;
    border-top: 8px solid #1f4a38 !important;
    border-radius: 18px !important;
    padding: 18px 20px !important;
}

#examModal .lms-question-draft {
    max-width: none !important;
    width: 100% !important;
    border-radius: 18px !important;
    background: #fff !important;
    border: 1px solid #eadfcd !important;
    border-inline-start: 6px solid transparent !important;
    box-shadow: 0 10px 28px rgba(24, 61, 47, .06) !important;
    padding: 18px !important;
}

#examModal .lms-question-draft.active {
    border-inline-start-color: #1f4a38 !important;
}

#examModal .lms-question-draft header {
    position: static !important;
    background: #fffdf8 !important;
    border: 1px solid #f0e4d4 !important;
    border-radius: 14px !important;
}

#examModal .lms-question-draft input,
#examModal .lms-question-draft textarea,
#examModal .lms-question-draft select,
#examModal .lms-exam-settings-panel input,
#examModal .lms-exam-settings-panel textarea,
#examModal .lms-exam-settings-panel select {
    border-radius: 12px !important;
    border: 1px solid #d8d0c3 !important;
    padding: 12px !important;
}

#examModal #examFree,
#examModal label:has(#examFree),
#examModal .uab-hidden-exam-free {
    display: none !important;
}

/* زر ومودال الاستيراد */
#openExamImport {
    background: #fff8e8 !important;
    color: #173b2c !important;
    border: 1px solid #eadfcd !important;
}

.uab-import-dialog {
    width: min(760px, 96vw) !important;
}

#examImportText {
    min-height: 260px !important;
    line-height: 1.9 !important;
    font-family: inherit !important;
}

@media (max-width: 900px) {
    #examModal .lms-exam-layout {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "settings"
            "questions" !important;
    }

    #examModal .lms-question-main {
        padding: 16px !important;
    }
}

/* ===== Exam import type selector + unified page scroll 20260527 ===== */

#examImportModal .uab-import-type-section select {
    width: 100% !important;
    border-radius: 12px !important;
    border: 1px solid #d8d0c3 !important;
    padding: 12px !important;
    font-weight: 900 !important;
}

/* إصلاح السطر العلوي: لا يكون له سكرول مستقل */
#examModal.lms-modal.fullscreen.show {
    overflow: visible !important;
    position: absolute !important;
    inset: auto 0 auto 0 !important;
    min-height: 100vh !important;
    align-items: stretch !important;
    justify-content: stretch !important;
}

/* الصفحة كلها تتحرك مع سكرول المتصفح/الداشبورد */
#examModal .lms-exam-builder,
#examModal .quiz-builder-page {
    height: auto !important;
    min-height: 100vh !important;
    overflow: visible !important;
}

/* الهيدر الداخلي للامتحان يتحرك طبيعي */
#examModal .lms-builder-head,
#examModal .lms-builder-head-modern,
#examModal .quiz-builder-page .lms-builder-head-modern {
    position: static !important;
    top: auto !important;
    z-index: 1 !important;
}

/* لا تجعل الفورم هو الذي يملك scroll */
#examModal .lms-exam-layout,
#examModal .lms-question-main,
#examModal .lms-exam-settings-panel {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
}

/* في الديسكتوب مع السايدبار */
@media (min-width: 901px) {
    .app-shell:not(.sidebar-collapsed) #examModal.lms-modal.fullscreen.show {
        inset-inline-start: 280px !important;
        width: auto !important;
    }

    .app-shell.sidebar-collapsed #examModal.lms-modal.fullscreen.show {
        inset-inline-start: 92px !important;
        width: auto !important;
    }
}

/* ===== HARD FIX hidden modals not blocking builder clicks 20260527 ===== */

/* أي مودال مخفي لا يمسك كليك ولا يغطي الصفحة */
.lms-modal[aria-hidden="true"]:not(.show),
.lms-modal:not(.show):not(.uab-confirm-modal) {
    display: none !important;
    pointer-events: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* المودال المفتوح فقط هو الذي يمسك التفاعل */
.lms-modal.show,
.lms-modal[aria-hidden="false"],
#builderModal.show,
#examModal.show,
#examImportModal.show {
    pointer-events: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* أزرار الامتحان داخل بناء المنهج لازم تكون قابلة للضغط */
#curriculumTree [data-edit-exam],
#curriculumTree [data-copy-exam],
#curriculumTree [data-add-unit-exam],
#curriculumTree [data-add-exam],
#curriculumTree .uab-free-exam-row button {
    pointer-events: auto !important;
    position: relative !important;
    z-index: 30 !important;
}

/* ===== FIX modal display when opened by aria-hidden=false 20260527 ===== */

/* لو openModal بيفتح المودال عن طريق aria-hidden=false فقط، لازم يظهر */
.lms-modal[aria-hidden="false"],
.lms-modal.show,
#examModal[aria-hidden="false"],
#builderModal[aria-hidden="false"],
#lessonModal[aria-hidden="false"],
#videoModal[aria-hidden="false"],
#examImportModal[aria-hidden="false"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* المودالات العادية */
.lms-modal[aria-hidden="false"]:not(.fullscreen),
.lms-modal.show:not(.fullscreen) {
    align-items: center !important;
    justify-content: center !important;
}

/* المودالات fullscreen زي بناء الامتحان وبناء المنهج */
.lms-modal.fullscreen[aria-hidden="false"],
.lms-modal.fullscreen.show,
#examModal[aria-hidden="false"],
#builderModal[aria-hidden="false"] {
    align-items: stretch !important;
    justify-content: stretch !important;
}

/* المخفي فقط هو اللي يختفي */
.lms-modal[aria-hidden="true"]:not(.show) {
    display: none !important;
    pointer-events: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* ===== Normalize LMS modal state 20260527 ===== */
.lms-modal.show,
.lms-modal[aria-hidden="false"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

.lms-modal:not(.show)[aria-hidden="true"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.lms-modal.fullscreen.show,
.lms-modal.fullscreen[aria-hidden="false"] {
    align-items: stretch !important;
    justify-content: stretch !important;
}

/* ===== FORCE exam modal to front - 20260527 ===== */

/* مودال الامتحان لازم يظهر فوق Builder وفوق أي Layer */
#examModal.lms-modal.fullscreen.show,
#examModal.lms-modal.fullscreen[aria-hidden="false"],
body #examModal.show,
body #examModal[aria-hidden="false"] {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-height: 100vh !important;
    max-height: 100vh !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 2147483000 !important;
    background: #fbf7ef !important;
    overflow: auto !important;
}

/* جسم بناء الامتحان يملأ الشاشة */
#examModal.show .lms-exam-builder,
#examModal[aria-hidden="false"] .lms-exam-builder,
#examModal.show .quiz-builder-page,
#examModal[aria-hidden="false"] .quiz-builder-page {
    width: 100% !important;
    min-height: 100vh !important;
    height: auto !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: #fbf7ef !important;
    overflow: visible !important;
}

/* هيدر بناء الامتحان يظهر داخل الصفحة */
#examModal.show .lms-builder-head,
#examModal[aria-hidden="false"] .lms-builder-head,
#examModal.show .lms-builder-head-modern,
#examModal[aria-hidden="false"] .lms-builder-head-modern {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 2 !important;
    background: #fffdf8 !important;
}

/* لا تسمح للـ builderModal يغطي examModal */
#builderModal.show {
    z-index: 99900 !important;
}

#examModal.show {
    z-index: 2147483000 !important;
}

/* زر الإغلاق فوق */
#examModal .lms-close,
#examModal [data-close-modal="examModal"] {
    position: relative !important;
    z-index: 3 !important;
}

/* ===== Fix exam modal position under app header + import above it 20260527 ===== */

/*
  مودال الامتحان يفضل فوق المحتوى،
  لكن لا يغطي هيدر المنصة والتنبيهات.
*/
@media (min-width: 901px) {
    body #examModal.lms-modal.fullscreen.show,
    body #examModal.lms-modal.fullscreen[aria-hidden="false"] {
        position: fixed !important;

        /* انزل تحت الهيدر + شريط التنبيهات */
        top: 112px !important;
        bottom: 0 !important;

        /* سيب سايدبار الداشبورد ظاهر في اليمين */
        inset-inline-start: 280px !important;
        inset-inline-end: 0 !important;

        width: auto !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        z-index: 2147483000 !important;
        overflow: auto !important;
        background: #fbf7ef !important;
    }

    body .app-shell.sidebar-collapsed #examModal.lms-modal.fullscreen.show,
    body .app-shell.sidebar-collapsed #examModal.lms-modal.fullscreen[aria-hidden="false"] {
        inset-inline-start: 92px !important;
    }
}

/* على الموبايل خليه شاشة كاملة */
@media (max-width: 900px) {
    body #examModal.lms-modal.fullscreen.show,
    body #examModal.lms-modal.fullscreen[aria-hidden="false"] {
        position: fixed !important;
        inset: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        z-index: 2147483000 !important;
        overflow: auto !important;
    }
}

/* الهيدر الداخلي للامتحان يبقى جزء طبيعي من الصفحة، مش ثابت فوق */
#examModal.show .lms-builder-head,
#examModal[aria-hidden="false"] .lms-builder-head,
#examModal.show .lms-builder-head-modern,
#examModal[aria-hidden="false"] .lms-builder-head-modern {
    position: static !important;
    top: auto !important;
    z-index: 1 !important;
    flex-shrink: 0 !important;
}

/* نافذة استيراد الأسئلة لازم تظهر فوق مودال الامتحان */
body #examImportModal.show,
body #examImportModal[aria-hidden="false"] {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483600 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    background: rgba(15, 23, 42, .55) !important;
    padding: 18px !important;
}

body #examImportModal .uab-import-dialog,
body #examImportModal .lms-dialog {
    position: relative !important;
    z-index: 2147483601 !important;
    max-height: 88vh !important;
    overflow: auto !important;
}

/* زر الاستيراد يفضل قابل للضغط */
#openExamImport {
    pointer-events: auto !important;
    position: relative !important;
    z-index: 5 !important;
}

/* ===== Polish exam builder topbar 20260527 ===== */

/* هيدر بناء الامتحان الداخلي يكون شريط أدوات مضغوط */
#examModal.show .lms-builder-head,
#examModal[aria-hidden="false"] .lms-builder-head,
#examModal.show .lms-builder-head-modern,
#examModal[aria-hidden="false"] .lms-builder-head-modern {
    min-height: 78px !important;
    padding: 12px 22px !important;
    margin: 0 !important;
    border-bottom: 1px solid #eadfcd !important;
    background: #fffdf8 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    box-shadow: 0 8px 22px rgba(24, 61, 47, .05) !important;
}

/* عنوان الامتحان ناحية اليمين */
#examModal .lms-builder-title-stack {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: center !important;
    gap: 2px !important;
    margin: 0 !important;
    min-width: 210px !important;
}

#examModal .lms-builder-title-stack .lms-breadcrumb {
    font-size: 11px !important;
    color: #8a7b68 !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}

#examModal .lms-builder-title-stack .lms-kicker {
    font-size: 10px !important;
    color: #c9902f !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

#examModal .lms-builder-title-stack h3 {
    font-size: 22px !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    color: #173b2c !important;
    font-weight: 900 !important;
}

#examModal #examModalTitle {
    margin: 0 !important;
    font-size: 13px !important;
    color: #667085 !important;
    line-height: 1.3 !important;
}

/* أزرار الهيدر ناحية الشمال بشكل موحد */
#examModal .lms-builder-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
    margin: 0 !important;
}

#examModal .lms-builder-actions .lms-button,
#examModal .lms-builder-actions button {
    min-height: 42px !important;
    border-radius: 14px !important;
    padding: 10px 16px !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    box-shadow: 0 8px 18px rgba(24, 61, 47, .07) !important;
}

/* زر الإغلاق منفصل وهادئ */
#examModal .lms-builder-actions .lms-close,
#examModal [data-close-modal="examModal"] {
    width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
    border-radius: 12px !important;
    background: #f3f4f6 !important;
    color: #173b2c !important;
    box-shadow: none !important;
    order: -1 !important;
}

/* ألوان الأزرار */
#examModal #saveExamDraftButton {
    background: linear-gradient(135deg, #c9902f, #b57d22) !important;
    color: #fff !important;
    border-color: transparent !important;
}

#examModal #publishExamDraftButton {
    background: linear-gradient(135deg, #c9902f, #b57d22) !important;
    color: #fff !important;
    border-color: transparent !important;
}

#examModal #openExamImport,
#examModal #duplicateExamDraft,
#examModal #previewExamDraft {
    background: #fff8e8 !important;
    color: #173b2c !important;
    border: 1px solid #eadfcd !important;
}

/* تقليل المسافة بين الهيدر ومحتوى الأسئلة */
#examModal .lms-exam-layout {
    margin-top: 0 !important;
}

#examModal .lms-question-main {
    padding-top: 18px !important;
}

#examModal .lms-exam-settings-panel {
    padding-top: 18px !important;
}

/* على الشاشات المتوسطة: خلي الأزرار أصغر بدل ما تزق العنوان */
@media (max-width: 1200px) and (min-width: 901px) {
    #examModal.show .lms-builder-head,
    #examModal[aria-hidden="false"] .lms-builder-head,
    #examModal.show .lms-builder-head-modern,
    #examModal[aria-hidden="false"] .lms-builder-head-modern {
        align-items: flex-start !important;
    }

    #examModal .lms-builder-actions .lms-button,
    #examModal .lms-builder-actions button {
        min-height: 38px !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
    }

    #examModal .lms-builder-title-stack h3 {
        font-size: 19px !important;
    }
}

/* موبايل */
@media (max-width: 900px) {
    #examModal.show .lms-builder-head,
    #examModal[aria-hidden="false"] .lms-builder-head,
    #examModal.show .lms-builder-head-modern,
    #examModal[aria-hidden="false"] .lms-builder-head-modern {
        min-height: auto !important;
        padding: 12px !important;
        flex-direction: column-reverse !important;
        align-items: stretch !important;
    }

    #examModal .lms-builder-title-stack {
        align-items: flex-start !important;
    }

    #examModal .lms-builder-actions {
        justify-content: stretch !important;
    }

    #examModal .lms-builder-actions .lms-button {
        flex: 1 1 45% !important;
    }
}

/* ===== Exam builder route page 20260527 ===== */

/* صفحة الامتحان المستقلة داخل المنصة */
.uab-exam-route-page {
    direction: rtl;
    padding: 18px 22px 32px;
    background: #fbf7ef;
}

/* الامتحان ليس مودال في صفحة الراوت */
.uab-exam-route-page #examModal.uab-exam-route-modal,
#examModal.uab-exam-route-modal.show,
#examModal.uab-exam-route-modal[aria-hidden="false"] {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    background: transparent !important;
    z-index: auto !important;
    overflow: visible !important;
    padding: 0 !important;
}

/* جسم الامتحان كصفحة حقيقية */
.uab-exam-route-page #examModal .lms-exam-builder,
.uab-exam-route-page #examModal .quiz-builder-page {
    width: 100% !important;
    max-width: 1220px !important;
    margin: 0 auto !important;
    min-height: auto !important;
    height: auto !important;
    overflow: visible !important;
    display: block !important;
    background: #fbf7ef !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* هيدر الامتحان داخل الصفحة */
.uab-exam-route-page #examModal .lms-builder-head,
.uab-exam-route-page #examModal .lms-builder-head-modern {
    position: static !important;
    top: auto !important;
    z-index: 1 !important;
    min-height: 76px !important;
    padding: 14px 18px !important;
    margin: 0 0 16px !important;
    background: #fffdf8 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    box-shadow: 0 12px 30px rgba(24, 61, 47, .07) !important;
}

/* التخطيط: إعدادات يمين وأسئلة في المنتصف */
.uab-exam-route-page #examModal .lms-exam-layout {
    display: grid !important;
    grid-template-columns: 310px minmax(0, 1fr) !important;
    grid-template-areas: "settings questions" !important;
    gap: 18px !important;
    height: auto !important;
    min-height: auto !important;
    overflow: visible !important;
    background: transparent !important;
}

.uab-exam-route-page #examModal .lms-exam-settings-panel {
    grid-area: settings !important;
    position: static !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    background: #fffdf8 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 20px !important;
    padding: 18px !important;
}

.uab-exam-route-page #examModal .lms-question-main {
    grid-area: questions !important;
    overflow: visible !important;
    background: transparent !important;
    padding: 0 !important;
}

.uab-exam-route-page #examModal .lms-question-list-panel {
    display: none !important;
}

/* كروت الأسئلة */
.uab-exam-route-page #examModal .lms-question-main .lms-panel-head,
.uab-exam-route-page #examModal .lms-question-draft {
    max-width: 860px !important;
    margin-inline: auto !important;
}

/* زر الإغلاق يرجع للمنهج */
.uab-exam-route-page #examModal [data-close-modal="examModal"] {
    width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
    border-radius: 12px !important;
    background: #f3f4f6 !important;
    color: #173b2c !important;
}

/* نافذة الاستيراد فوق صفحة الامتحان */
body #examImportModal.show,
body #examImportModal[aria-hidden="false"] {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483600 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(15, 23, 42, .55) !important;
}

/* موبايل */
@media (max-width: 900px) {
    .uab-exam-route-page {
        padding: 12px;
    }

    .uab-exam-route-page #examModal .lms-builder-head,
    .uab-exam-route-page #examModal .lms-builder-head-modern {
        flex-direction: column-reverse !important;
        align-items: stretch !important;
    }

    .uab-exam-route-page #examModal .lms-exam-layout {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "settings"
            "questions" !important;
    }
}

/* ===== Fix exam builder route load/page mode 20260527 ===== */

/* في صفحة الراوت، الامتحان ليس مودال fullscreen */
.uab-exam-route-page #examModal,
.uab-exam-route-page #examModal.uab-exam-route-modal,
.uab-exam-route-page #examModal.show,
.uab-exam-route-page #examModal[aria-hidden="false"] {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    background: transparent !important;
    z-index: auto !important;
    overflow: visible !important;
    padding: 0 !important;
}

/* امنع أي قواعد قديمة بتزقه كـ fullscreen */
.uab-exam-route-page #examModal.lms-modal.fullscreen {
    position: static !important;
}

/* خلي الصفحة مرتبة تحت الهيدر والسايدبار العاديين */
.uab-exam-route-shell {
    padding: 18px 22px 36px !important;
    background: #fbf7ef !important;
    min-height: calc(100vh - 160px) !important;
}

/* ===== Polish exam question fields and option delete buttons 20260527 ===== */

/* كارت السؤال نفسه */
.uab-exam-route-page #examModal .lms-question-draft {
    padding: 18px 18px 20px !important;
}

/* ترتيب الحقول داخل السؤال بشكل أعرض */
.uab-exam-route-page #examModal .lms-question-draft > label {
    display: block !important;
    width: 100% !important;
}

/* نص السؤال: عريض وارتفاع طبيعي */
.uab-exam-route-page #examModal .lms-question-draft .q-text {
    width: 100% !important;
    min-height: 92px !important;
    max-height: 170px !important;
    resize: vertical !important;
    line-height: 1.8 !important;
    font-size: 15px !important;
    border-radius: 14px !important;
    background: #fff !important;
}

/* توضيح الإجابة: عريض ومش طويل زيادة */
.uab-exam-route-page #examModal .lms-question-draft .q-explanation {
    width: 100% !important;
    min-height: 74px !important;
    max-height: 140px !important;
    resize: vertical !important;
    line-height: 1.8 !important;
    font-size: 14px !important;
    border-radius: 14px !important;
    background: #fff !important;
}

/* الغِ أي ضغط قديم للحقول في عمودين داخل السؤال */
.uab-exam-route-page #examModal .lms-question-draft .lms-two:has(.q-explanation) {
    display: block !important;
}

.uab-exam-route-page #examModal .lms-question-draft .lms-two:has(.q-explanation) label {
    display: block !important;
    width: 100% !important;
}

/* صف الاختيار: النص يمتد والزر في أقصى الشمال */
.uab-exam-route-page #examModal .lms-option-row {
    display: grid !important;
    grid-template-columns: auto auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    direction: rtl !important;
    padding: 10px !important;
    border-radius: 14px !important;
    background: #fff !important;
    border: 1px solid #eadfcd !important;
}

/* حقل الاختيار ياخد العرض */
.uab-exam-route-page #examModal .lms-option-row .q-option,
.uab-exam-route-page #examModal .lms-option-row input[type="text"] {
    width: 100% !important;
    min-width: 0 !important;
}

/* زر حذف الاختيار: أحمر صغير في أقصى الشمال */
.uab-exam-route-page #examModal .lms-option-row .danger,
.uab-exam-route-page #examModal .lms-option-row button.danger {
    order: 99 !important;
    justify-self: end !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border-radius: 12px !important;
    background: #fff1f2 !important;
    border: 1px solid #fecdd3 !important;
    color: #dc2626 !important;
    font-weight: 900 !important;
    font-size: 0 !important;
    box-shadow: none !important;
}

.uab-exam-route-page #examModal .lms-option-row .danger::before,
.uab-exam-route-page #examModal .lms-option-row button.danger::before {
    content: "حذف";
    font-size: 12px;
}

.uab-exam-route-page #examModal .lms-option-row .danger:hover,
.uab-exam-route-page #examModal .lms-option-row button.danger:hover {
    background: #dc2626 !important;
    color: #fff !important;
    border-color: #dc2626 !important;
}

/* زر حذف السؤال نفسه يبقى أوضح لكن مش مزعج */
.uab-exam-route-page #examModal .lms-question-draft > header button.danger {
    background: #fff1f2 !important;
    color: #dc2626 !important;
    border: 1px solid #fecdd3 !important;
    border-radius: 12px !important;
    padding: 8px 12px !important;
    font-weight: 900 !important;
}

/* تحسين عنوان الحقول */
.uab-exam-route-page #examModal .lms-question-draft label {
    color: #173b2c !important;
    font-weight: 800 !important;
}

.uab-exam-route-page #examModal .lms-question-draft label > textarea,
.uab-exam-route-page #examModal .lms-question-draft label > input,
.uab-exam-route-page #examModal .lms-question-draft label > select {
    margin-top: 7px !important;
}

/* ===== Exam question status/collapse + restore option row + red top X 20260527 ===== */

/* 1) رجوع شكل الاختيارات زي ما كان: صف أفقي نظيف */
.uab-exam-route-page #examModal .lms-option-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    direction: rtl !important;
    padding: 10px !important;
    border-radius: 14px !important;
    background: #fff !important;
    border: 1px solid #eadfcd !important;
}

.uab-exam-route-page #examModal .lms-option-row .q-option,
.uab-exam-route-page #examModal .lms-option-row input[type="text"] {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
}

/* رجوع زر حذف الاختيار لطبيعي، مش تحت ومش ضخم */
.uab-exam-route-page #examModal .lms-option-row .danger,
.uab-exam-route-page #examModal .lms-option-row button.danger {
    order: initial !important;
    justify-self: auto !important;
    width: auto !important;
    min-width: auto !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 7px 11px !important;
    border-radius: 10px !important;
    background: #fff1f2 !important;
    border: 1px solid #fecdd3 !important;
    color: #dc2626 !important;
    font-weight: 900 !important;
    font-size: 12px !important;
}

.uab-exam-route-page #examModal .lms-option-row .danger::before,
.uab-exam-route-page #examModal .lms-option-row button.danger::before {
    content: none !important;
}

/* 2) الـ X اللي جنب حفظ المسودة: أحمر واضح وأقصى الشمال */
.uab-exam-route-page #examModal [data-close-modal="examModal"],
.uab-exam-route-page #examModal .lms-close {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 12px !important;
    background: #fff1f2 !important;
    border: 1px solid #fecdd3 !important;
    color: #dc2626 !important;
    font-weight: 900 !important;
    font-size: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    order: -999 !important;
    margin-inline-end: 0 !important;
    margin-inline-start: 8px !important;
}

.uab-exam-route-page #examModal [data-close-modal="examModal"]::before,
.uab-exam-route-page #examModal .lms-close::before {
    content: "×";
    font-size: 20px;
    line-height: 1;
}

.uab-exam-route-page #examModal [data-close-modal="examModal"]:hover,
.uab-exam-route-page #examModal .lms-close:hover {
    background: #dc2626 !important;
    color: #fff !important;
    border-color: #dc2626 !important;
}

/* 3) حالة السؤال */
.uab-question-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    margin-inline-start: 8px;
}

.uab-question-status.complete {
    background: #dcfce7;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.uab-question-status.incomplete {
    background: #fff7ed;
    color: #c2410c;
    border: 1px solid #fed7aa;
}

/* 4) زر طي / فتح السؤال */
.uab-collapse-question {
    border: 1px solid #eadfcd;
    background: #fff8e8;
    color: #173b2c;
    border-radius: 11px;
    min-height: 34px;
    padding: 7px 11px;
    font-weight: 900;
    cursor: pointer;
}

.uab-collapse-question:hover {
    background: #f2eadc;
}

/* 5) حالة الطي: اظهر الهيدر فقط */
.uab-exam-route-page #examModal .lms-question-draft.uab-question-collapsed > :not(header) {
    display: none !important;
}

.uab-exam-route-page #examModal .lms-question-draft.uab-question-collapsed {
    padding-bottom: 14px !important;
}

/* تحسين خفيف للهيدر بعد إضافة الحالة والطي */
.uab-exam-route-page #examModal .lms-question-draft > header {
    gap: 10px !important;
    flex-wrap: wrap !important;
}

.uab-exam-route-page #examModal .lms-question-draft > header strong {
    margin-inline-end: auto !important;
}

/* ===== Fix collapse preview + duplicate wording visual 20260527 ===== */

/* ملخص نص السؤال يظهر فقط عند الطي */
.uab-question-collapsed-preview {
    display: none;
    flex: 1 1 260px;
    min-width: 180px;
    color: #173b2c;
    font-weight: 800;
    font-size: 13px;
    background: #f8faf7;
    border: 1px solid #e2eadf;
    border-radius: 12px;
    padding: 8px 11px;
    line-height: 1.7;
    white-space: normal;
}

.uab-exam-route-page #examModal .lms-question-draft.uab-question-collapsed .uab-question-collapsed-preview {
    display: inline-flex !important;
}

/* عند الطي: الهيدر فقط + ملخص نص السؤال */
.uab-exam-route-page #examModal .lms-question-draft.uab-question-collapsed > :not(header) {
    display: none !important;
}

/* خلي زر تكرار أوضح من زر الحذف */
.uab-exam-route-page #examModal .q-duplicate {
    background: #f8fafc !important;
    color: #173b2c !important;
    border: 1px solid #dbe4df !important;
    border-radius: 11px !important;
    padding: 8px 12px !important;
    font-weight: 900 !important;
}

/* زر حذف السؤال في الهيدر يفضل أحمر واضح */
.uab-exam-route-page #examModal .lms-question-draft > header button.danger {
    background: #fff1f2 !important;
    color: #dc2626 !important;
    border: 1px solid #fecdd3 !important;
    border-radius: 12px !important;
    padding: 8px 12px !important;
    font-weight: 900 !important;
}

/* ترتيب الهيدر بعد إضافة الملخص */
.uab-exam-route-page #examModal .lms-question-draft > header {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}

.uab-exam-route-page #examModal .lms-question-draft > header strong {
    margin-inline-end: 0 !important;
}

/* خلي شكل الاختيارات مستقر زي قبل */
.uab-exam-route-page #examModal .lms-option-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
}

.uab-exam-route-page #examModal .lms-option-row .q-option,
.uab-exam-route-page #examModal .lms-option-row input[type="text"] {
    flex: 1 1 auto !important;
}

/* ===== Fix exam route add/collapse/linked visual 20260527 ===== */

/* أخفِ صندوق يرتبط بـ نهائيًا */
.uab-exam-route-page #examModal .lms-linked-context,
.uab-exam-route-page #examModal #examLinkedContext,
.uab-exam-route-page #examModal #examLinkedLesson,
.uab-exam-route-page #examModal #examLinkedCourse {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* عند طي السؤال: أظهر الهيدر فقط */
body .uab-exam-route-page #examModal .lms-question-draft.uab-question-collapsed > *:not(header) {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* منع ظهور توضيح الإجابة وقت الطي بأي Override قديم */
body .uab-exam-route-page #examModal .lms-question-draft.uab-question-collapsed .q-explanation,
body .uab-exam-route-page #examModal .lms-question-draft.uab-question-collapsed label:has(.q-explanation),
body .uab-exam-route-page #examModal .lms-question-draft.uab-question-collapsed .lms-two:has(.q-explanation) {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* ملخص السؤال والإجابة داخل الهيدر عند الطي */
.uab-question-collapsed-preview {
    display: none;
    flex: 1 1 340px;
    min-width: 220px;
    background: #f8faf7;
    border: 1px solid #dfe9df;
    color: #173b2c;
    border-radius: 13px;
    padding: 8px 12px;
    line-height: 1.6;
}

.uab-question-collapsed-preview b {
    display: block;
    font-size: 13px;
    font-weight: 900;
    color: #173b2c;
}

.uab-question-collapsed-preview small {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    font-weight: 800;
    color: #166534;
}

body .uab-exam-route-page #examModal .lms-question-draft.uab-question-collapsed .uab-question-collapsed-preview {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    max-height: none !important;
}

/* زر إضافة سؤال واضح وقابل للضغط */
.uab-exam-route-page #examModal #addQuestionDraft,
.uab-exam-route-page #examModal #addQuestionDraftSide {
    pointer-events: auto !important;
    cursor: pointer !important;
    position: relative !important;
    z-index: 10 !important;
}

/* ترتيب هيدر السؤال بعد الملخص */
.uab-exam-route-page #examModal .lms-question-draft > header {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}

.uab-exam-route-page #examModal .lms-question-draft > header strong {
    white-space: nowrap !important;
}

/* ===== Clear invalid question save message 20260527 ===== */

.uab-exam-route-page #examModal .lms-question-draft.uab-question-save-invalid {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 4px rgba(239, 68, 68, .10), 0 18px 42px rgba(24, 61, 47, .10) !important;
}

.uab-question-save-invalid-note {
    background: #fff1f2;
    color: #b91c1c;
    border: 1px solid #fecdd3;
    border-radius: 14px;
    padding: 11px 14px;
    margin-bottom: 12px;
    font-weight: 900;
    line-height: 1.7;
}

.uab-exam-route-page #examModal .lms-question-draft.uab-question-save-invalid > header {
    border-color: #fecdd3 !important;
    background: #fff7f7 !important;
}

/* ===== Compact question image area beside question text 20260527 ===== */

/* اجعل منطقة نص السؤال + الصورة Layout واحد */
.uab-exam-route-page #examModal .lms-question-draft {
    position: relative !important;
}

/* مربع نص السؤال يأخذ أغلب العرض، ويترك مساحة صغيرة للصورة */
.uab-exam-route-page #examModal .lms-question-draft label:has(.q-text) {
    display: block !important;
    width: calc(100% - 150px) !important;
    margin-inline-end: 150px !important;
}

/* تصغير صندوق إضافة الصورة وتحريكه شمال نص السؤال */
.uab-exam-route-page #examModal .lms-question-draft .lms-upload-box,
.uab-exam-route-page #examModal .lms-question-draft .lms-image-upload,
.uab-exam-route-page #examModal .lms-question-draft .question-image-uploader,
.uab-exam-route-page #examModal .lms-question-draft .q-image-upload,
.uab-exam-route-page #examModal .lms-question-draft [data-question-image-upload] {
    position: absolute !important;
    top: 166px !important;
    inset-inline-start: 18px !important;
    width: 126px !important;
    min-height: 92px !important;
    height: 92px !important;
    padding: 8px !important;
    margin: 0 !important;
    border-radius: 14px !important;
    background: #fffdf8 !important;
    border: 1px dashed #d8cbb7 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
    color: #7c6f5f !important;
}

/* نصوص صندوق الصورة تكون قصيرة */
.uab-exam-route-page #examModal .lms-question-draft .lms-upload-box h4,
.uab-exam-route-page #examModal .lms-question-draft .lms-image-upload h4,
.uab-exam-route-page #examModal .lms-question-draft .question-image-uploader h4,
.uab-exam-route-page #examModal .lms-question-draft .q-image-upload h4 {
    font-size: 12px !important;
    margin: 0 0 4px !important;
}

.uab-exam-route-page #examModal .lms-question-draft .lms-upload-box small,
.uab-exam-route-page #examModal .lms-question-draft .lms-image-upload small,
.uab-exam-route-page #examModal .lms-question-draft .question-image-uploader small,
.uab-exam-route-page #examModal .lms-question-draft .q-image-upload small {
    font-size: 10px !important;
    line-height: 1.4 !important;
}

/* نص السؤال ارتفاعه أقل شوية */
.uab-exam-route-page #examModal .lms-question-draft .q-text {
    min-height: 118px !important;
    max-height: 180px !important;
}

/* لو الشاشة ضيقة رجّع الصورة تحت النص */
@media (max-width: 900px) {
    .uab-exam-route-page #examModal .lms-question-draft label:has(.q-text) {
        width: 100% !important;
        margin-inline-end: 0 !important;
    }

    .uab-exam-route-page #examModal .lms-question-draft .lms-upload-box,
    .uab-exam-route-page #examModal .lms-question-draft .lms-image-upload,
    .uab-exam-route-page #examModal .lms-question-draft .question-image-uploader,
    .uab-exam-route-page #examModal .lms-question-draft .q-image-upload,
    .uab-exam-route-page #examModal .lms-question-draft [data-question-image-upload] {
        position: static !important;
        width: 100% !important;
        height: auto !important;
        min-height: 70px !important;
        margin: 10px 0 !important;
    }
}

/* ===== Place question image uploader beside question text 20260527 ===== */

/* خلي كارت السؤال يسمح بتموضع صندوق الصورة داخله */
.uab-exam-route-page #examModal .lms-question-draft {
    position: relative !important;
}

/* منطقة نص السؤال تسيب مساحة شمالها للصورة */
.uab-exam-route-page #examModal .lms-question-draft label:has(.q-text) {
    display: block !important;
    width: calc(100% - 170px) !important;
    margin-inline-start: 170px !important;
    margin-inline-end: 0 !important;
}

/* صندوق إضافة الصورة يدخل في المساحة الفاضية شمال نص السؤال */
.uab-exam-route-page #examModal .lms-question-draft .lms-upload-box,
.uab-exam-route-page #examModal .lms-question-draft .lms-image-upload,
.uab-exam-route-page #examModal .lms-question-draft .question-image-uploader,
.uab-exam-route-page #examModal .lms-question-draft .q-image-upload,
.uab-exam-route-page #examModal .lms-question-draft [data-question-image-upload] {
    position: absolute !important;

    /* مكانه بمحاذاة مربع نص السؤال */
    top: 158px !important;
    inset-inline-start: 18px !important;

    width: 145px !important;
    height: 132px !important;
    min-height: 132px !important;

    margin: 0 !important;
    padding: 10px !important;

    border-radius: 16px !important;
    border: 1px dashed #d8cbb7 !important;
    background: #fffdf8 !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    text-align: center !important;
    color: #756958 !important;
    line-height: 1.5 !important;
}

/* اختصار النصوص داخل صندوق الصورة */
.uab-exam-route-page #examModal .lms-question-draft .lms-upload-box h4,
.uab-exam-route-page #examModal .lms-question-draft .lms-image-upload h4,
.uab-exam-route-page #examModal .lms-question-draft .question-image-uploader h4,
.uab-exam-route-page #examModal .lms-question-draft .q-image-upload h4 {
    font-size: 13px !important;
    margin: 0 0 5px !important;
    color: #173b2c !important;
    font-weight: 900 !important;
}

.uab-exam-route-page #examModal .lms-question-draft .lms-upload-box small,
.uab-exam-route-page #examModal .lms-question-draft .lms-image-upload small,
.uab-exam-route-page #examModal .lms-question-draft .question-image-uploader small,
.uab-exam-route-page #examModal .lms-question-draft .q-image-upload small {
    font-size: 10px !important;
    line-height: 1.5 !important;
    color: #8a7b68 !important;
}

/* مربع نص السؤال يكون ارتفاعه متوازن مع صندوق الصورة */
.uab-exam-route-page #examModal .lms-question-draft .q-text {
    min-height: 132px !important;
    max-height: 190px !important;
}

/* امنع صندوق الصورة ياخد صف كامل تحت نص السؤال */
.uab-exam-route-page #examModal .lms-question-draft > .lms-upload-box,
.uab-exam-route-page #examModal .lms-question-draft > .lms-image-upload,
.uab-exam-route-page #examModal .lms-question-draft > .question-image-uploader,
.uab-exam-route-page #examModal .lms-question-draft > .q-image-upload,
.uab-exam-route-page #examModal .lms-question-draft > [data-question-image-upload] {
    clear: none !important;
}

/* في الموبايل يرجع تحت النص عشان المساحة */
@media (max-width: 900px) {
    .uab-exam-route-page #examModal .lms-question-draft label:has(.q-text) {
        width: 100% !important;
        margin-inline-start: 0 !important;
    }

    .uab-exam-route-page #examModal .lms-question-draft .lms-upload-box,
    .uab-exam-route-page #examModal .lms-question-draft .lms-image-upload,
    .uab-exam-route-page #examModal .lms-question-draft .question-image-uploader,
    .uab-exam-route-page #examModal .lms-question-draft .q-image-upload,
    .uab-exam-route-page #examModal .lms-question-draft [data-question-image-upload] {
        position: static !important;
        width: 100% !important;
        height: auto !important;
        min-height: 78px !important;
        margin: 10px 0 !important;
    }
}

/* ===== REAL question text + image row layout 20260527 ===== */

/* ألغِ كل محاولات الـ absolute القديمة لصندوق الصورة */
.uab-exam-route-page #examModal .lms-question-draft .lms-question-image-drop {
    position: static !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
}

/* الصف الحقيقي: نص السؤال + إضافة صورة */
.uab-exam-route-page #examModal .uab-question-text-image-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 160px !important;
    gap: 14px !important;
    align-items: stretch !important;
    margin: 12px 0 14px !important;
    direction: rtl !important;
}

/* نص السؤال يأخذ المساحة الأكبر */
.uab-exam-route-page #examModal .uab-question-text-image-row label:has(.q-text) {
    width: 100% !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}

/* مربع نص السؤال */
.uab-exam-route-page #examModal .uab-question-text-image-row .q-text {
    width: 100% !important;
    min-height: 126px !important;
    max-height: 190px !important;
    resize: vertical !important;
}

/* صندوق الصورة الصغير في نفس الصف */
.uab-exam-route-page #examModal .uab-question-text-image-row .lms-question-image-drop {
    width: 160px !important;
    min-width: 160px !important;
    height: auto !important;
    min-height: 126px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 10px !important;
    border-radius: 16px !important;
    border: 1px dashed #d8cbb7 !important;
    background: #fffdf8 !important;
    text-align: center !important;
    color: #756958 !important;
}

/* النص داخل صندوق الصورة */
.uab-exam-route-page #examModal .uab-question-text-image-row .lms-question-image-drop span {
    font-size: 13px !important;
    font-weight: 900 !important;
    color: #173b2c !important;
    margin-bottom: 5px !important;
}

.uab-exam-route-page #examModal .uab-question-text-image-row .lms-question-image-drop small {
    font-size: 10px !important;
    line-height: 1.5 !important;
    color: #8a7b68 !important;
}

/* في الموبايل: الصورة تحت النص */
@media (max-width: 900px) {
    .uab-exam-route-page #examModal .uab-question-text-image-row {
        grid-template-columns: 1fr !important;
    }

    .uab-exam-route-page #examModal .uab-question-text-image-row .lms-question-image-drop {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 76px !important;
    }
}

/* ===== Question image picker + exam preview modal 20260527 ===== */

.uab-exam-route-page #examModal .lms-question-image-drop {
    cursor: pointer !important;
    transition: .18s ease !important;
}

.uab-exam-route-page #examModal .lms-question-image-drop:hover,
.uab-exam-route-page #examModal .lms-question-image-drop.drag-over {
    border-color: #c9902f !important;
    background: #fff8e8 !important;
    transform: translateY(-1px);
}

.uab-exam-route-page #examModal .lms-question-image-drop.has-image {
    padding: 6px !important;
    gap: 6px !important;
}

.uab-exam-route-page #examModal .lms-question-image-drop.has-image img {
    width: 100% !important;
    max-height: 88px !important;
    object-fit: cover !important;
    border-radius: 12px !important;
    border: 1px solid #eadfcd !important;
}

.uab-remove-question-image {
    width: 100%;
    border: 1px solid #fecdd3;
    background: #fff1f2;
    color: #dc2626;
    border-radius: 10px;
    padding: 5px 8px;
    font-weight: 900;
    cursor: pointer;
}

/* Preview modal */
.uab-exam-preview-modal {
    position: fixed;
    inset: 0;
    z-index: 2147483600;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(15, 23, 42, .55);
}

.uab-exam-preview-modal.show {
    display: flex;
}

.uab-exam-preview-dialog {
    width: min(900px, 96vw);
    max-height: 92vh;
    overflow: auto;
    background: #fbf7ef;
    border-radius: 24px;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .25);
    border: 1px solid #eadfcd;
}

.uab-exam-preview-dialog > header {
    position: sticky;
    top: 0;
    background: #fffdf8;
    border-bottom: 1px solid #eadfcd;
    padding: 18px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    z-index: 2;
}

.uab-exam-preview-dialog > header span {
    color: #c9902f;
    font-weight: 900;
    font-size: 12px;
}

.uab-exam-preview-dialog > header h3 {
    margin: 3px 0;
    color: #173b2c;
    font-size: 24px;
}

.uab-exam-preview-dialog > header p {
    margin: 0;
    color: #667085;
}

.uab-close-preview {
    width: 38px;
    height: 38px;
    border: 1px solid #fecdd3;
    background: #fff1f2;
    color: #dc2626;
    border-radius: 12px;
    font-size: 22px;
    font-weight: 900;
    cursor: pointer;
}

.uab-exam-preview-body {
    padding: 22px;
    display: grid;
    gap: 16px;
}

.uab-preview-question {
    background: #fff;
    border: 1px solid #eadfcd;
    border-radius: 18px;
    padding: 18px;
    border-top: 5px solid #1f4a38;
}

.uab-preview-question-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.uab-preview-question-head strong {
    color: #173b2c;
    font-size: 16px;
}

.uab-preview-question-head span {
    background: #fff8e8;
    border: 1px solid #eadfcd;
    border-radius: 999px;
    padding: 5px 10px;
    font-weight: 900;
    color: #173b2c;
}

.uab-preview-question p {
    color: #173b2c;
    font-weight: 800;
    line-height: 1.8;
}

.uab-preview-question img {
    max-width: 100%;
    border-radius: 14px;
    border: 1px solid #eadfcd;
    margin: 8px 0 12px;
}

.uab-preview-options {
    display: grid;
    gap: 9px;
}

.uab-preview-options label {
    display: flex;
    align-items: center;
    gap: 9px;
    background: #fffdf8;
    border: 1px solid #eadfcd;
    border-radius: 13px;
    padding: 10px 12px;
}

.uab-preview-options label.is-correct {
    background: #ecfdf3;
    border-color: #bbf7d0;
    color: #166534;
    font-weight: 900;
}

.uab-preview-question textarea {
    width: 100%;
    min-height: 90px;
    border: 1px solid #d8d0c3;
    border-radius: 13px;
    padding: 12px;
    background: #f8fafc;
}

.uab-preview-question small {
    display: block;
    margin-top: 12px;
    color: #667085;
    line-height: 1.7;
}

/* ===== Builder basics thumbnail uploader/preview 20260527 ===== */

.uab-builder-basics-thumb-field {
    display: block !important;
}

.uab-builder-basics-thumb-field > input {
    margin-bottom: 10px !important;
}

.uab-builder-basics-thumb-uploader {
    display: grid;
    gap: 10px;
    background: #fffdf8;
    border: 1px solid #eadfcd;
    border-radius: 18px;
    padding: 12px;
    margin-top: 8px;
}

.uab-builder-basics-thumb-preview {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 16px;
    border: 1px dashed #d8cbb7;
    overflow: hidden;
    background: #f7f0e4;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.uab-builder-basics-thumb-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 16px;
}

.uab-builder-basics-thumb-empty {
    text-align: center;
    color: #756958;
    padding: 16px;
}

.uab-builder-basics-thumb-empty strong {
    display: block;
    color: #173b2c;
    font-weight: 900;
    margin-bottom: 5px;
}

.uab-builder-basics-thumb-empty span {
    display: block;
    font-size: 12px;
    line-height: 1.7;
}

.uab-builder-basics-thumb-actions {
    display: grid;
    gap: 7px;
}

.uab-builder-basics-thumb-actions .lms-button {
    width: 100%;
    justify-content: center;
    background: #173b2c !important;
    color: #fff !important;
    border-color: #173b2c !important;
}

.uab-builder-basics-thumb-actions small {
    color: #756958;
    font-size: 11px;
    line-height: 1.6;
    text-align: center;
}

.uab-builder-basics-thumb-actions small.success {
    color: #15803d;
    font-weight: 800;
}

.uab-builder-basics-thumb-actions small.error {
    color: #dc2626;
    font-weight: 800;
}

/* ===== Fix course builder top offset + remove inner summary scroll 20260527 ===== */

/* صفحة بناء الكورس تبدأ تحت هيدر المنصة والتنبيهات، لا تدخل تحتهم */
#builderModal.lms-modal.fullscreen.show,
#builderModal.lms-modal.fullscreen[aria-hidden="false"],
body #builderModal.show,
body #builderModal[aria-hidden="false"] {
    position: fixed !important;
    top: 112px !important;
    bottom: 0 !important;

    /* سيب سايدبار الداشبورد ظاهر في الديسكتوب */
    inset-inline-start: 280px !important;
    inset-inline-end: 0 !important;

    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    overflow: auto !important;
    background: #fbf7ef !important;
    z-index: 99900 !important;
}

/* لو السايدبار متقفل */
body .app-shell.sidebar-collapsed #builderModal.lms-modal.fullscreen.show,
body .app-shell.sidebar-collapsed #builderModal.lms-modal.fullscreen[aria-hidden="false"],
body .app-shell.sidebar-collapsed #builderModal.show,
body .app-shell.sidebar-collapsed #builderModal[aria-hidden="false"] {
    inset-inline-start: 92px !important;
}

/* جسم بناء الكورس لا يعمل سكرول داخلي */
#builderModal .lms-builder,
#builderModal .course-builder-page,
#builderModal .lms-builder-page,
#builderModal .lms-builder-main,
#builderModal .lms-builder-content,
#builderModal .lms-builder-layout,
#builderModal .lms-builder-body {
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* العمود/الكارت اليمين الخاص بملخص الكورس بلا سكرول داخلي */
#builderModal .lms-builder-sidebar,
#builderModal .lms-builder-aside,
#builderModal .lms-course-summary,
#builderModal .course-summary,
#builderModal .builder-summary,
#builderModal .lms-builder-side,
#builderModal aside {
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* أي كارت داخل ملخص الكورس لا يأخذ scroll مستقل */
#builderModal .lms-builder-sidebar *,
#builderModal .lms-builder-aside *,
#builderModal .lms-course-summary *,
#builderModal .course-summary *,
#builderModal .builder-summary * {
    max-height: none !important;
}

/* خلي عمود ملخص الكورس ثابت بصريًا لكن بدون سكرول داخلي */
@media (min-width: 901px) {
    #builderModal .lms-builder-sidebar,
    #builderModal .lms-builder-aside,
    #builderModal .lms-course-summary,
    #builderModal .course-summary,
    #builderModal .builder-summary,
    #builderModal .lms-builder-side {
        position: sticky !important;
        top: 16px !important;
        align-self: start !important;
    }
}

/* هيدر بناء الكورس الداخلي يبقى طبيعي تحت هيدر المنصة */
#builderModal .lms-builder-head,
#builderModal .lms-builder-head-modern {
    position: static !important;
    top: auto !important;
    z-index: 1 !important;
}

/* امنع أي top قديم يطلع الصفحة تحت الهيدر */
#builderModal .lms-modal-content,
#builderModal .lms-builder-wrapper {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* موبايل: خليها شاشة كاملة لأن السايدبار مختلف */
@media (max-width: 900px) {
    #builderModal.lms-modal.fullscreen.show,
    #builderModal.lms-modal.fullscreen[aria-hidden="false"],
    body #builderModal.show,
    body #builderModal[aria-hidden="false"] {
        inset: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        overflow: auto !important;
    }

    #builderModal .lms-builder-sidebar,
    #builderModal .lms-builder-aside,
    #builderModal .lms-course-summary,
    #builderModal .course-summary,
    #builderModal .builder-summary,
    #builderModal .lms-builder-side {
        position: static !important;
    }
}

/* ===== Course builder independent route page 20260527 ===== */

/* صفحة الراوت نفسها */
.uab-course-builder-route-page {
    direction: rtl;
    background: #fbf7ef;
    padding: 18px 22px 34px;
    min-height: calc(100vh - 150px);
}

/* في الراوت المستقل: builderModal ليس مودال ولا overlay */
.uab-course-builder-route-page #builderModal,
.uab-course-builder-route-page #builderModal.lms-modal,
.uab-course-builder-route-page #builderModal.fullscreen,
.uab-course-builder-route-page #builderModal.show,
.uab-course-builder-route-page #builderModal[aria-hidden="false"] {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;

    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;

    overflow: visible !important;
    background: transparent !important;
    z-index: auto !important;
    padding: 0 !important;
}

/* جسم الباني صفحة عادية */
.uab-course-builder-route-page #builderModal .lms-builder {
    width: min(1320px, 100%) !important;
    margin: 0 auto !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* هيدر بناء الكورس داخل الصفحة */
.uab-course-builder-route-page #builderModal .lms-builder-head,
.uab-course-builder-route-page #builderModal .lms-builder-head-modern {
    position: static !important;
    top: auto !important;
    z-index: 1 !important;
    margin: 0 0 16px !important;
    border-radius: 22px !important;
    background: #fffdf8 !important;
    border: 1px solid #eadfcd !important;
    box-shadow: 0 12px 32px rgba(24, 61, 47, .08) !important;
}

/* التخطيط الرئيسي */
.uab-course-builder-route-page #builderModal .lms-builder-layout {
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    align-items: start !important;
}

/* ملخص الكورس بلا سكرول داخلي */
.uab-course-builder-route-page #builderModal .lms-course-aside,
.uab-course-builder-route-page #builderModal .lms-builder-sidebar,
.uab-course-builder-route-page #builderModal .lms-builder-aside,
.uab-course-builder-route-page #builderModal .builder-summary,
.uab-course-builder-route-page #builderModal aside {
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* تثبيت ملخص الكورس بشكل لطيف أثناء سكرول الصفحة الأساسية */
@media (min-width: 901px) {
    .uab-course-builder-route-page #builderModal .lms-course-aside {
        position: sticky !important;
        top: 14px !important;
        align-self: start !important;
    }
}

/* المحتوى الرئيسي بلا سكرول داخلي */
.uab-course-builder-route-page #builderModal .lms-builder-main,
.uab-course-builder-route-page #builderModal .lms-builder-content,
.uab-course-builder-route-page #builderModal .lms-builder-body,
.uab-course-builder-route-page #builderModal .lms-builder-panel {
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* زر X في صفحة الراوت معناه رجوع للكورسات */
.uab-course-builder-route-page #builderModal [data-close-modal="builderModal"] {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    border-radius: 12px !important;
    background: #fff1f2 !important;
    border: 1px solid #fecdd3 !important;
    color: #dc2626 !important;
    font-size: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.uab-course-builder-route-page #builderModal [data-close-modal="builderModal"]::before {
    content: "×";
    font-size: 20px;
    font-weight: 900;
}

/* المودالات الفرعية تظل مودالات عادية فوق صفحة البناء */
.uab-course-builder-route-page > .lms-modal:not(#builderModal)[aria-hidden="false"],
.uab-course-builder-route-page > .lms-modal:not(#builderModal).show {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(15, 23, 42, .55) !important;
}

/* لا تسمح لأي قواعد قديمة تعمل سكرول شمال */
body.uab-course-builder-route-active #builderModal,
body.uab-course-builder-route-active #builderModal * {
    scrollbar-width: auto;
}

/* موبايل */
@media (max-width: 900px) {
    .uab-course-builder-route-page {
        padding: 12px;
    }

    .uab-course-builder-route-page #builderModal .lms-course-aside {
        position: static !important;
    }
}

/* ===== FIX course-builder route full width + kill inner left scrollbar 20260527 ===== */

/* الراوت المستقل لبناء الكورس يأخذ كامل مساحة المحتوى المتاحة */
body.uab-course-builder-route-active #globalRouteMount,
body.uab-course-builder-route-active .global-route-mount,
body.uab-course-builder-route-active main#globalRouteMount {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

/* صفحة بناء الكورس نفسها بلا تضييق */
body.uab-course-builder-route-active .uab-course-builder-route-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 18px 18px 34px !important;
    overflow: visible !important;
    background: #fbf7ef !important;
}

/* إلغاء أي سلوك مودال/فول سكرين قديم للباني */
body.uab-course-builder-route-active #builderModal,
body.uab-course-builder-route-active #builderModal.lms-modal,
body.uab-course-builder-route-active #builderModal.fullscreen,
body.uab-course-builder-route-active #builderModal.show,
body.uab-course-builder-route-active #builderModal[aria-hidden="false"] {
    position: static !important;
    inset: auto !important;

    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;

    display: block !important;
    overflow: visible !important;
    overflow-y: visible !important;
    overflow-x: visible !important;

    background: transparent !important;
    z-index: auto !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* جسم الباني يملأ العرض بدل min(1320px,100%) */
body.uab-course-builder-route-active #builderModal .lms-builder,
body.uab-course-builder-route-active #builderModal .course-builder-page {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    height: auto !important;
    min-height: auto !important;
    max-height: none !important;

    overflow: visible !important;
    overflow-y: visible !important;
    overflow-x: visible !important;

    background: transparent !important;
    box-shadow: none !important;
}

/* الهيدر الداخلي يملأ العرض */
body.uab-course-builder-route-active #builderModal .lms-builder-head,
body.uab-course-builder-route-active #builderModal .lms-builder-head-modern {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 16px !important;
}

/* تخطيط الباني: الملخص يمين، والمحتوى يأخذ باقي العرض */
body.uab-course-builder-route-active #builderModal .lms-builder-layout {
    width: 100% !important;
    max-width: none !important;

    display: grid !important;
    grid-template-columns: 260px minmax(0, 1fr) !important;
    gap: 18px !important;
    align-items: start !important;

    height: auto !important;
    min-height: auto !important;
    max-height: none !important;

    overflow: visible !important;
    overflow-y: visible !important;
    overflow-x: visible !important;
}

/* في RTL: aside يبقى في اليمين */
body.uab-course-builder-route-active #builderModal .lms-course-aside {
    grid-column: 1 !important;
    width: 260px !important;
    max-width: 260px !important;
    min-width: 0 !important;

    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

body.uab-course-builder-route-active #builderModal .lms-builder-main {
    grid-column: 2 !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;

    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* امنع أي عنصر داخلي يعمل scrollbar مستقل */
body.uab-course-builder-route-active #builderModal .lms-builder-layout,
body.uab-course-builder-route-active #builderModal .lms-builder-main,
body.uab-course-builder-route-active #builderModal .lms-builder-panel,
body.uab-course-builder-route-active #builderModal .lms-curriculum,
body.uab-course-builder-route-active #builderModal #curriculumTree,
body.uab-course-builder-route-active #builderModal .lms-course-aside,
body.uab-course-builder-route-active #builderModal .lms-side-box,
body.uab-course-builder-route-active #builderModal .lms-builder-progress {
    overflow: visible !important;
    overflow-y: visible !important;
    overflow-x: visible !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
}

/* لو في scrollbar داخل body بسبب modal قديم */
body.uab-course-builder-route-active {
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

/* منع الفراغات الكبيرة اللي بتخلي الصفحة شكلها مضغوط */
body.uab-course-builder-route-active #builderModal .lms-builder-panel {
    padding-inline: 0 !important;
}

/* موبايل */
@media (max-width: 900px) {
    body.uab-course-builder-route-active #builderModal .lms-builder-layout {
        grid-template-columns: 1fr !important;
    }

    body.uab-course-builder-route-active #builderModal .lms-course-aside,
    body.uab-course-builder-route-active #builderModal .lms-builder-main {
        grid-column: auto !important;
        width: 100% !important;
        max-width: none !important;
    }
}

/* ===== FINAL kill #builderModal inner scroll in course-builder route 20260527 ===== */

/* السبب الحقيقي للسكرول الداخلي هو #builderModal نفسه */
body.uab-course-builder-route-active #builderModal,
body.uab-course-builder-route-active #builderModal.lms-modal,
body.uab-course-builder-route-active #builderModal.lms-modal.fullscreen,
body.uab-course-builder-route-active #builderModal.fullscreen,
body.uab-course-builder-route-active #builderModal.show,
body.uab-course-builder-route-active #builderModal.uab-course-builder-route-modal {
    position: static !important;
    inset: auto !important;

    width: 100% !important;
    max-width: none !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    overflow: visible !important;
    overflow-y: visible !important;
    overflow-x: visible !important;

    display: block !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    z-index: auto !important;
}

/* لو فيه inline style جاي من JS عامل display/overflow */
body.uab-course-builder-route-active .uab-course-builder-route-page > #builderModal {
    overflow: visible !important;
    overflow-y: visible !important;
    height: auto !important;
    max-height: none !important;
}

/* خلّي السكرول يبقى للصفحة الأساسية فقط */
body.uab-course-builder-route-active,
html:has(body.uab-course-builder-route-active) {
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

/* منع عرض الباني المضغوط */
body.uab-course-builder-route-active .uab-course-builder-route-page,
body.uab-course-builder-route-active #builderModal .lms-builder,
body.uab-course-builder-route-active #builderModal .lms-builder-layout {
    width: 100% !important;
    max-width: none !important;
}

/* لو RTL بيحط سكرول المتصفح شمال، خلي الغلاف LTR والمحتوى RTL */
body.uab-course-builder-route-active .uab-course-builder-route-page {
    direction: ltr !important;
}

body.uab-course-builder-route-active .uab-course-builder-route-page #builderModal {
    direction: rtl !important;
}

/* ===== Lesson attendance button visual polish 20260527 ===== */
[data-complete-video].attendance-completed,
.attendance-completed [data-complete-video] {
    background: #15803d !important;
    border-color: #15803d !important;
    color: #fff !important;
    box-shadow: 0 10px 24px rgba(21, 128, 61, .22) !important;
}

[data-complete-video][disabled] {
    opacity: .85;
    cursor: not-allowed;
}

.lms-study-item.attendance-completed {
    border-color: #bbf7d0 !important;
    background: #f0fdf4 !important;
}

/* ===== Course sales page for unsubscribed students 20260527 ===== */

.uab-course-sales-page {
    padding: 18px 22px 34px;
    background:
        radial-gradient(circle at top right, rgba(201, 146, 47, .12), transparent 28%),
        #fbf7ef;
    min-height: calc(100vh - 130px);
}

.uab-course-sales-hero {
    width: min(1180px, 100%);
    margin: 0 auto 16px;
    background: #fffdf8;
    border: 1px solid #eadfcd;
    border-radius: 24px;
    padding: 18px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    box-shadow: 0 16px 40px rgba(24, 61, 47, .08);
}

.uab-sales-kicker {
    color: #c9902f;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.uab-course-sales-hero h1 {
    margin: 4px 0;
    color: #173b2c;
    font-size: clamp(25px, 3vw, 42px);
}

.uab-course-sales-hero p {
    margin: 0;
    color: #667085;
    font-weight: 800;
}

.uab-sales-back {
    text-decoration: none;
    background: #f2eadc;
    border: 1px solid #eadfcd;
    color: #173b2c;
    border-radius: 14px;
    padding: 11px 15px;
    font-weight: 900;
}

.uab-course-sales-grid {
    width: min(1180px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 18px;
    align-items: start;
}

.uab-course-sales-info,
.uab-pay-card {
    background: #fff;
    border: 1px solid #eadfcd;
    border-radius: 24px;
    box-shadow: 0 18px 48px rgba(24, 61, 47, .08);
}

.uab-course-sales-info {
    padding: 16px;
}

.uab-course-sales-cover {
    aspect-ratio: 16 / 9;
    border-radius: 20px;
    overflow: hidden;
    background: #f2eadc;
    border: 1px solid #eadfcd;
}

.uab-course-sales-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.uab-course-sales-meta {
    margin: 16px 0 12px;
    display: grid;
    gap: 5px;
}

.uab-course-sales-meta span {
    color: #c9902f;
    font-weight: 900;
}

.uab-course-sales-meta strong {
    color: #173b2c;
    font-size: 28px;
}

.uab-course-sales-desc {
    background: #fffdf8;
    border: 1px solid #eadfcd;
    border-radius: 18px;
    padding: 15px;
    margin-bottom: 14px;
}

.uab-course-sales-desc h3 {
    margin: 0 0 8px;
    color: #173b2c;
}

.uab-course-sales-desc p {
    margin: 0;
    color: #667085;
    line-height: 1.9;
    font-weight: 700;
    white-space: pre-line;
}

.uab-course-sales-video {
    aspect-ratio: 16 / 9;
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid #eadfcd;
    background: #111827;
}

.uab-course-sales-video iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

.uab-course-sales-pay {
    position: sticky;
    top: 18px;
}

.uab-pay-card {
    padding: 18px;
    display: grid;
    gap: 13px;
}

.uab-pay-label {
    color: #c9902f;
    font-weight: 900;
    font-size: 12px;
}

.uab-pay-card h2 {
    margin: 0;
    color: #173b2c;
    font-size: 25px;
}

.uab-pay-price {
    display: flex;
    align-items: baseline;
    gap: 10px;
    background: linear-gradient(135deg, #173b2c, #235c44);
    color: #fff;
    border-radius: 18px;
    padding: 16px;
}

.uab-pay-price strong {
    font-size: 34px;
}

.uab-pay-price del {
    color: rgba(255,255,255,.65);
    font-weight: 800;
}

.uab-pay-note {
    background: #f6f8ff;
    border: 1px solid #dbe4ff;
    border-radius: 14px;
    padding: 12px;
    display: grid;
    gap: 5px;
    color: #172033;
}

.uab-pay-actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.uab-mini-pay-btn,
.uab-main-pay-btn,
.uab-wallet-pay-btn,
.uab-coupon-box button {
    border: 0;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    font-weight: 900;
    border-radius: 13px;
    padding: 11px 12px;
}

.uab-mini-pay-btn {
    background: #f2eadc;
    color: #173b2c;
    border: 1px solid #eadfcd;
}

.uab-main-pay-btn,
.uab-coupon-box button {
    background: #c9902f;
    color: #fff;
}

.uab-wallet-pay-btn {
    background: #f2eadc;
    color: #173b2c;
}

.uab-coupon-box {
    display: grid;
    gap: 8px;
    border-top: 1px solid #eadfcd;
    padding-top: 12px;
}

.uab-coupon-box label {
    font-weight: 900;
    color: #173b2c;
}

.uab-coupon-box input {
    border: 1px solid #d8d0c3;
    border-radius: 13px;
    padding: 12px;
    font: inherit;
}

.uab-pay-card small {
    color: #667085;
    line-height: 1.7;
}

@media (max-width: 950px) {
    .uab-course-sales-grid {
        grid-template-columns: 1fr;
    }

    .uab-course-sales-pay {
        position: static;
    }

    .uab-course-sales-hero {
        align-items: flex-start;
        flex-direction: column-reverse;
    }
}

/* ===== Course sales payment note + wallet balance 20260527 ===== */

.uab-payment-review-note {
    margin-top: -4px;
    background: #fff8e8;
    border: 1px solid #eadfcd;
    color: #6b4f1d;
    border-radius: 13px;
    padding: 10px 12px;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.7;
    text-align: center;
}

.uab-wallet-balance-box {
    background: linear-gradient(135deg, #fffdf8, #f7f0e4);
    border: 1px solid #eadfcd;
    border-radius: 16px;
    padding: 12px;
    display: grid;
    gap: 5px;
    text-align: center;
}

.uab-wallet-balance-box span {
    color: #667085;
    font-size: 12px;
    font-weight: 900;
}

.uab-wallet-balance-box strong {
    color: #173b2c;
    font-size: 25px;
    font-weight: 1000;
}

.uab-wallet-balance-box small {
    color: #667085;
    font-size: 11px;
    line-height: 1.6;
}

.uab-wallet-balance-box.is-ok {
    background: #ecfdf3;
    border-color: #bbf7d0;
}

.uab-wallet-balance-box.is-ok strong {
    color: #15803d;
}

.uab-wallet-balance-box.is-low {
    background: #fff7ed;
    border-color: #fed7aa;
}

.uab-wallet-balance-box.is-low strong {
    color: #c2410c;
}

.uab-wallet-balance-box.is-unknown {
    background: #f8fafc;
    border-color: #e2e8f0;
}

#uabSalesWalletPay:disabled {
    opacity: .65;
    cursor: not-allowed;
    filter: grayscale(.2);
}

/* ===== Student course simple player UI 20260527 ===== */

.course-view-page .lms-study-grid {
    grid-template-columns: 310px minmax(0, 1fr) !important;
    gap: 18px !important;
    align-items: start !important;
}

.course-view-page .lms-study-stats {
    display: none !important;
}

.course-view-page .lms-study-nav {
    position: sticky !important;
    top: 16px !important;
    max-height: none !important;
    overflow: visible !important;
}

.course-view-page .uab-simple-study-items {
    display: grid !important;
    gap: 8px !important;
}

.course-view-page .uab-simple-lesson-row {
    grid-template-columns: 32px minmax(0, 1fr) !important;
    padding: 12px !important;
    border-radius: 16px !important;
}

.course-view-page .lms-sidebar-lesson-content {
    display: none !important;
}

.course-view-page .uab-simple-exam-row {
    cursor: pointer !important;
    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) !important;
    gap: 9px !important;
    align-items: center !important;
    padding: 12px !important;
    border-radius: 16px !important;
    background: #fffaf0 !important;
    border: 1px solid #eadfcd !important;
    margin-top: 8px !important;
}

.course-view-page .uab-simple-exam-row:hover,
.course-view-page .uab-simple-lesson-row:hover,
.course-view-page .uab-simple-lesson-row.active {
    border-color: #c9902f !important;
    background: #fff8e8 !important;
}

.course-view-page .uab-simple-exam-row button {
    display: none !important;
}

.course-view-page .uab-simple-lesson-player {
    padding: 18px !important;
    border-radius: 24px !important;
    background: #fff !important;
    border: 1px solid #eadfcd !important;
    box-shadow: 0 18px 45px rgba(24, 61, 47, .08) !important;
}

.course-view-page .uab-simple-lesson-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 150px !important;
    gap: 16px !important;
    align-items: start !important;
    margin-bottom: 14px !important;
}

.course-view-page .uab-simple-lesson-head h2 {
    margin: 8px 0 6px !important;
    color: #173b2c !important;
    font-size: clamp(24px, 3vw, 36px) !important;
}

.course-view-page .uab-simple-lesson-head p {
    margin: 0 !important;
    color: #667085 !important;
    line-height: 1.8 !important;
    font-weight: 700 !important;
}

.course-view-page .uab-simple-lesson-progress {
    background: #fffdf8 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 18px !important;
    padding: 12px !important;
    text-align: center !important;
}

.course-view-page .uab-simple-lesson-progress small,
.course-view-page .uab-simple-lesson-progress strong {
    display: block !important;
}

.course-view-page .uab-simple-lesson-progress strong {
    color: #173b2c !important;
    font-size: 26px !important;
    margin: 4px 0 !important;
}

.course-view-page .uab-simple-study-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    margin-bottom: 14px !important;
}

.course-view-page .uab-main-student-player {
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    background: #111827 !important;
    margin: 0 !important;
}

.course-view-page .uab-main-student-player iframe,
.course-view-page .uab-main-student-player video {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    border: 0 !important;
}

.course-view-page .uab-attendance-row {
    margin-top: 14px !important;
    display: grid !important;
    gap: 8px !important;
    text-align: center !important;
}

.course-view-page .uab-attendance-button {
    width: 100% !important;
    min-height: 54px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #c9902f, #d7a847) !important;
    color: #fff !important;
    font-size: 17px !important;
    font-weight: 1000 !important;
    box-shadow: 0 14px 28px rgba(201, 144, 47, .22) !important;
}

.course-view-page .uab-attendance-row small {
    color: #667085 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.course-view-page .uab-simple-panel-title {
    background: #fffdf8 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 18px !important;
    padding: 14px !important;
    margin-bottom: 10px !important;
}

.course-view-page .uab-simple-panel-title h3 {
    margin: 0 0 4px !important;
    color: #173b2c !important;
}

.course-view-page .uab-simple-panel-title p {
    margin: 0 !important;
    color: #667085 !important;
}

.course-view-page .uab-simple-resource-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 12px !important;
    align-items: center !important;
}

/* أخفِ بقايا كروت الفيديو القديمة وأسفل الدرس */
.course-view-page .lms-lesson-bottom-cards,
.course-view-page .lms-current-lesson-info,
.course-view-page .lms-study-block[data-study-panel="videos"] > h3,
.course-view-page .lms-study-block[data-study-panel="videos"] > .lms-study-item {
    display: none !important;
}

/* لكن لا تخفي نسخة الفيديو الجديدة */
.course-view-page .uab-simple-lesson-player .lms-study-block[data-study-panel="videos"] {
    display: block !important;
}

.course-view-page .uab-simple-lesson-player .lms-study-block[data-study-panel="videos"] > .uab-main-student-player,
.course-view-page .uab-simple-lesson-player .lms-study-block[data-study-panel="videos"] > .uab-attendance-row {
    display: grid !important;
}

@media (max-width: 1100px) {
    .course-view-page .lms-study-grid {
        grid-template-columns: 1fr !important;
    }

    .course-view-page .lms-study-nav {
        position: static !important;
    }

    .course-view-page .uab-simple-lesson-head {
        grid-template-columns: 1fr !important;
    }

    .course-view-page .uab-simple-resource-card {
        grid-template-columns: 1fr !important;
    }
}

/* ===== Fix student course order + panels + attendance 20260527 ===== */

/* السايدبار يعرض درس أو اختبار فقط */
.course-view-page .lms-sidebar-lesson-content {
    display: none !important;
}

.course-view-page .uab-simple-exam-row {
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
    cursor: pointer !important;
    background: #fffaf0 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 16px !important;
    padding: 12px !important;
    margin-top: 8px !important;
    text-align: right !important;
}

.course-view-page .uab-simple-exam-row:hover {
    border-color: #c9902f !important;
    background: #fff8e8 !important;
}

.course-view-page .uab-simple-exam-icon {
    width: 34px !important;
    height: 34px !important;
    border-radius: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #f7ead3 !important;
    color: #9a6519 !important;
}

.course-view-page .uab-simple-exam-row em,
.course-view-page .uab-simple-exam-row button {
    display: none !important;
}

.course-view-page .uab-simple-exam-row strong {
    display: block !important;
    color: #173b2c !important;
    font-weight: 1000 !important;
    line-height: 1.5 !important;
}

.course-view-page .uab-simple-exam-row small {
    display: block !important;
    color: #667085 !important;
    font-size: 11px !important;
    line-height: 1.6 !important;
}

/* التابات تعرض لوحة واحدة فقط */
.course-view-page .uab-simple-lesson-player .lms-study-block[hidden] {
    display: none !important;
}

.course-view-page .uab-simple-lesson-player .lms-study-block:not([hidden]) {
    display: block !important;
}

/* لا تخلي الفيديو يفضل ظاهر عند فتح المرفقات أو الواجب */
.course-view-page .uab-simple-lesson-player .lms-study-block[data-study-panel="videos"][hidden],
.course-view-page .uab-simple-lesson-player .lms-study-block[data-study-panel="materials"][hidden],
.course-view-page .uab-simple-lesson-player .lms-study-block[data-study-panel="homework"][hidden] {
    display: none !important;
}

/* زر الحضور واضح تحت الفيديو */
.course-view-page .uab-attendance-row {
    margin-top: 14px !important;
    display: grid !important;
    gap: 8px !important;
    text-align: center !important;
}

.course-view-page .uab-attendance-row .uab-attendance-button,
.course-view-page .uab-attendance-row [data-complete-video] {
    display: inline-flex !important;
    width: 100% !important;
    min-height: 56px !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #c9902f, #d8a843) !important;
    border: 0 !important;
    color: #fff !important;
    font-size: 17px !important;
    font-weight: 1000 !important;
    box-shadow: 0 14px 30px rgba(201, 144, 47, .25) !important;
}

.course-view-page .uab-attendance-row small {
    color: #667085 !important;
    font-weight: 800 !important;
    font-size: 12px !important;
}

/* المرفقات والواجب يظهروا مكان الفيديو بشكل واضح */
.course-view-page .uab-simple-panel-title,
.course-view-page .uab-simple-resource-card,
.course-view-page .uab-simple-lesson-player .lms-empty {
    margin-top: 0 !important;
}

/* شاشة الانترو بدون تابات قديمة */
.course-view-page .exam-start-intro-card ~ .lms-study-tabs,
.course-view-page #studyMain > .lms-study-tabs:has(+ .exam-start-intro-card),
.course-view-page .lms-study-tabs:has(~ .exam-start-intro-card) {
    display: none !important;
}

/* ===== Student course view clean final v2 20260527 ===== */

.course-view-page .lms-sidebar-lesson-content,
.course-view-page .lms-current-lesson-info,
.course-view-page .lms-lesson-bottom-cards,
.course-view-page .lms-study-block[data-study-panel="videos"] > h3,
.course-view-page .lms-study-block[data-study-panel="videos"] > .lms-study-item {
    display: none !important;
}

/* كارت الاختبار المختصر */
.course-view-page .uab-simple-exam-row {
    cursor: pointer !important;
    display: grid !important;
    grid-template-columns: 36px minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
    background: #fffaf0 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 16px !important;
    padding: 12px !important;
    margin-top: 8px !important;
    text-align: right !important;
}

.course-view-page .uab-simple-exam-row:hover {
    border-color: #c9902f !important;
    background: #fff8e8 !important;
}

.course-view-page .uab-simple-exam-row button,
.course-view-page .uab-simple-exam-row em {
    display: none !important;
}

.course-view-page .uab-simple-exam-icon {
    width: 36px !important;
    height: 36px !important;
    border-radius: 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #f7ead3 !important;
    color: #9a6519 !important;
    font-size: 17px !important;
}

.course-view-page .uab-simple-exam-row strong {
    display: block !important;
    color: #173b2c !important;
    font-weight: 1000 !important;
    line-height: 1.5 !important;
}

.course-view-page .uab-simple-exam-row small {
    display: block !important;
    color: #667085 !important;
    font-size: 11px !important;
    line-height: 1.6 !important;
}

/* الدرس الجديد */
.course-view-page .uab-simple-lesson-player {
    padding: 18px !important;
    border-radius: 24px !important;
    background: #fff !important;
    border: 1px solid #eadfcd !important;
    box-shadow: 0 18px 45px rgba(24, 61, 47, .08) !important;
}

.course-view-page .uab-simple-lesson-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 150px !important;
    gap: 16px !important;
    align-items: start !important;
    margin-bottom: 14px !important;
}

.course-view-page .uab-simple-lesson-head h2 {
    margin: 8px 0 6px !important;
    color: #173b2c !important;
    font-size: clamp(24px, 3vw, 36px) !important;
}

.course-view-page .uab-simple-lesson-head p {
    margin: 0 !important;
    color: #667085 !important;
    line-height: 1.8 !important;
    font-weight: 700 !important;
}

.course-view-page .uab-simple-lesson-progress {
    background: #fffdf8 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 18px !important;
    padding: 12px !important;
    text-align: center !important;
}

.course-view-page .uab-simple-lesson-progress small,
.course-view-page .uab-simple-lesson-progress strong {
    display: block !important;
}

.course-view-page .uab-simple-lesson-progress strong {
    color: #173b2c !important;
    font-size: 26px !important;
    margin: 4px 0 !important;
}

/* التابات: لوحة واحدة فقط تظهر */
.course-view-page .uab-simple-lesson-player .lms-study-block[hidden] {
    display: none !important;
}

.course-view-page .uab-simple-lesson-player .lms-study-block:not([hidden]) {
    display: block !important;
}

.course-view-page .uab-simple-study-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    margin-bottom: 14px !important;
}

/* الفيديو */
.course-view-page .uab-main-student-player {
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    background: #111827 !important;
    margin: 0 !important;
}

.course-view-page .uab-main-student-player iframe,
.course-view-page .uab-main-student-player video {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    border: 0 !important;
}

/* زر الحضور */
.course-view-page .uab-attendance-row {
    margin-top: 14px !important;
    display: grid !important;
    gap: 8px !important;
    text-align: center !important;
}

.course-view-page .uab-attendance-row .uab-attendance-button,
.course-view-page .uab-attendance-row [data-complete-video] {
    display: inline-flex !important;
    width: 100% !important;
    min-height: 56px !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #c9902f, #d8a843) !important;
    border: 0 !important;
    color: #fff !important;
    font-size: 17px !important;
    font-weight: 1000 !important;
    box-shadow: 0 14px 30px rgba(201, 144, 47, .25) !important;
}

.course-view-page .uab-attendance-row small {
    color: #667085 !important;
    font-weight: 800 !important;
    font-size: 12px !important;
}

/* المرفقات والواجب يظهروا مكان الفيديو */
.course-view-page .uab-simple-panel-title {
    background: #fffdf8 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 18px !important;
    padding: 14px !important;
    margin-bottom: 10px !important;
}

.course-view-page .uab-simple-panel-title h3 {
    margin: 0 0 4px !important;
    color: #173b2c !important;
}

.course-view-page .uab-simple-panel-title p {
    margin: 0 !important;
    color: #667085 !important;
}

.course-view-page .uab-simple-resource-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 12px !important;
    align-items: center !important;
}

/* انترو الامتحان العصري */
.course-view-page .uab-exam-intro-clean-v2 {
    max-width: 760px !important;
    margin: 20px auto !important;
    background:
        radial-gradient(circle at top right, rgba(201, 146, 47, .16), transparent 35%),
        #fff !important;
    border: 1px solid #eadfcd !important;
    border-radius: 28px !important;
    padding: 28px !important;
    box-shadow: 0 22px 60px rgba(24, 61, 47, .12) !important;
    text-align: center !important;
}

.course-view-page .uab-exam-intro-icon {
    width: 64px !important;
    height: 64px !important;
    border-radius: 22px !important;
    background: #fff3d6 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 30px !important;
    margin-bottom: 10px !important;
}

.course-view-page .uab-exam-intro-clean-v2 .exam-start-kicker {
    display: block !important;
    color: #c9902f !important;
    font-weight: 1000 !important;
    font-size: 12px !important;
    margin-bottom: 5px !important;
}

.course-view-page .uab-exam-intro-clean-v2 h2 {
    color: #173b2c !important;
    font-size: clamp(28px, 4vw, 44px) !important;
    margin: 0 0 6px !important;
}

.course-view-page .uab-exam-intro-clean-v2 .exam-start-subtitle {
    color: #667085 !important;
    margin: 0 0 18px !important;
    font-weight: 800 !important;
}

.course-view-page .uab-exam-intro-clean-v2 .exam-start-stats {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin: 18px 0 !important;
}

.course-view-page .uab-exam-intro-clean-v2 .exam-start-stats article {
    background: #fffdf8 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 18px !important;
    padding: 12px !important;
}

.course-view-page .uab-exam-intro-clean-v2 .exam-start-stats small {
    display: block !important;
    color: #667085 !important;
    font-weight: 800 !important;
    margin-bottom: 5px !important;
}

.course-view-page .uab-exam-intro-clean-v2 .exam-start-stats strong {
    color: #173b2c !important;
    font-weight: 1000 !important;
}

.course-view-page .uab-exam-intro-clean-v2 .exam-start-note {
    background: #f8fafc !important;
    border: 1px dashed #cbd5e1 !important;
    border-radius: 18px !important;
    padding: 13px !important;
    color: #475569 !important;
    font-weight: 800 !important;
    line-height: 1.8 !important;
    margin-bottom: 18px !important;
}

.course-view-page .uab-exam-intro-clean-v2 .exam-start-actions {
    display: flex !important;
    justify-content: center !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}

/* أخفي أي تابات قديمة لو ظهرت قبل انترو الامتحان */
.course-view-page #studyMain > .lms-study-tabs:has(+ .uab-exam-intro-clean-v2),
.course-view-page .lms-study-tabs:has(~ .uab-exam-intro-clean-v2) {
    display: none !important;
}

@media (max-width: 900px) {
    .course-view-page .uab-simple-lesson-head,
    .course-view-page .uab-simple-resource-card,
    .course-view-page .uab-exam-intro-clean-v2 .exam-start-stats {
        grid-template-columns: 1fr !important;
    }
}

/* ===== Force visible attendance button under student video 20260527 ===== */

.course-view-page .uab-attendance-row {
    margin-top: 14px !important;
    display: grid !important;
    gap: 0 !important;
    text-align: center !important;
    width: 100% !important;
}

.course-view-page .uab-attendance-row small,
.course-view-page .uab-attendance-hint {
    display: none !important;
}

.course-view-page .uab-attendance-row [data-complete-video],
.course-view-page .uab-attendance-button {
    display: inline-flex !important;
    width: 100% !important;
    min-height: 56px !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #c9902f, #d8a843) !important;
    border: 0 !important;
    color: #fff !important;
    font-size: 17px !important;
    font-weight: 1000 !important;
    box-shadow: 0 14px 30px rgba(201, 144, 47, .25) !important;
    cursor: pointer !important;
}

.course-view-page .uab-attendance-row [data-complete-video].attendance-completed,
.course-view-page .uab-attendance-button.attendance-completed {
    background: linear-gradient(135deg, #15803d, #16a34a) !important;
    box-shadow: 0 14px 30px rgba(21, 128, 61, .24) !important;
}

.course-view-page .uab-attendance-row [data-complete-video]:disabled,
.course-view-page .uab-attendance-button:disabled {
    opacity: .75 !important;
    cursor: not-allowed !important;
}

/* ===== Attendance button inside student study tabs 20260527 ===== */

.course-view-page .lms-study-tabs,
.course-view-page .uab-simple-study-tabs {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.course-view-page .uab-study-attendance-tab {
    border: 0 !important;
    border-radius: 14px !important;
    min-height: 48px !important;
    padding: 10px 14px !important;
    cursor: pointer !important;
    background: linear-gradient(135deg, #c9902f, #d8a843) !important;
    color: #fff !important;
    font-weight: 1000 !important;
    box-shadow: 0 12px 26px rgba(201, 144, 47, .24) !important;
    white-space: nowrap !important;
}

.course-view-page .uab-study-attendance-tab:hover {
    transform: translateY(-1px);
    filter: brightness(1.02);
}

.course-view-page .uab-study-attendance-tab.attendance-completed {
    background: linear-gradient(135deg, #15803d, #16a34a) !important;
    box-shadow: 0 12px 26px rgba(21, 128, 61, .22) !important;
}

.course-view-page .uab-study-attendance-tab:disabled {
    opacity: .65 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

/* إخفاء جملة الربط القديمة نهائيًا */
.course-view-page .uab-attendance-row small,
.course-view-page .uab-attendance-hint {
    display: none !important;
}

@media (max-width: 760px) {
    .course-view-page .lms-study-tabs,
    .course-view-page .uab-simple-study-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* ===== Attendance tab final label polish 20260527 ===== */

.course-view-page .uab-study-attendance-tab {
    background: linear-gradient(135deg, #c9902f, #d8a843) !important;
    color: #fff !important;
    font-weight: 1000 !important;
}

.course-view-page .uab-study-attendance-tab::before {
    content: "✓";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-inline-end: 6px;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: rgba(255,255,255,.22);
}

/* ===== Remove course/lesson progress from student course UI 20260527 ===== */

/* كارت تقدم الكورس في صفحة الطالب */
.course-view-page .lms-course-hero-progress,
.course-view-page .course-progress-card,
.course-view-page .uab-course-progress-card,
.course-view-page [data-course-progress],
.course-view-page .lms-study-progress,
.course-view-page .lms-progress-summary {
    display: none !important;
}

/* كارت تقدم الدرس */
.course-view-page .uab-simple-lesson-progress,
.course-view-page .lms-lesson-progress,
.course-view-page .lesson-progress-card,
.course-view-page [data-lesson-progress] {
    display: none !important;
}

/* أي بقايا progress line أو percentage داخل صفحة الكورس للطالب */
.course-view-page .lms-progress-line,
.course-view-page .progress-ring,
.course-view-page .progress-percent,
.course-view-page .course-progress-percent,
.course-view-page .lesson-progress-percent {
    display: none !important;
}

/* منع ظهور كارت 0% / 60% الجانبي */
.course-view-page aside article:has(.lms-progress-line),
.course-view-page aside div:has(.lms-progress-line),
.course-view-page .lms-study-side-card:has(.lms-progress-line),
.course-view-page .lms-course-side-card:has(.lms-progress-line) {
    display: none !important;
}

/* لو فيه عنوان نصي لتقدم الدرس أو الكورس */
.course-view-page *:has(> small):has(.lms-progress-line) {
    display: none !important;
}

/* الحفاظ على زر الحضور فقط */
.course-view-page .uab-study-attendance-tab {
    display: inline-flex !important;
}

/* ===== Clean student course hero/sidebar 20260527 ===== */

/* إخفاء شارة "الكورس" ومدة الكورس غير المفيدة */
.course-view-page .lms-course-meta span,
.course-view-page .course-hero-tags span,
.course-view-page .lms-hero-tags span,
.course-view-page .course-tags span,
.course-view-page .lms-chip,
.course-view-page .lms-meta-chip {
    white-space: nowrap;
}

.course-view-page .lms-course-meta span:has(+ span),
.course-view-page .course-hero-tags span:has(+ span) {
    max-width: max-content;
}

/* إخفاء أي شارة فيها مدة الكورس */
.course-view-page span:has(> small),
.course-view-page .course-duration-chip,
.course-view-page .duration-chip {
    display: none !important;
}

/* عنوان الوحدة في الجانب */
.course-view-page .uab-clean-unit-title,
.course-view-page .lms-study-unit-toggle.uab-clean-unit-title {
    width: 100% !important;
    justify-content: flex-start !important;
    text-align: right !important;
    background: #f5efe4 !important;
    color: #173b2c !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
    font-weight: 1000 !important;
    font-size: 14px !important;
    border: 0 !important;
}

/* شيل العدادات من هيدر الوحدة */
.course-view-page .lms-study-unit-toggle em,
.course-view-page .lms-study-unit-toggle small,
.course-view-page .uab-simple-study-unit > strong em,
.course-view-page .uab-simple-study-unit > strong small {
    display: none !important;
}

/* تحسين شكل زر استكمال التعلم */
.course-view-page button:has(span),
.course-view-page a:has(span) {
    max-width: max-content;
}

.course-view-page button,
.course-view-page a {
    scroll-margin-top: 120px;
}

/* ===== Student task flow: attendance, next, badges, exam intro 20260527 ===== */

/* شريط أزرار الدرس */
.course-view-page .lms-study-tabs,
.course-view-page .uab-simple-study-tabs {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

/* زر التالي */
.course-view-page .uab-next-task-button {
    border: 1px solid #d8c8a9 !important;
    border-radius: 14px !important;
    min-height: 48px !important;
    padding: 10px 14px !important;
    cursor: pointer !important;
    background: #fffaf0 !important;
    color: #173b2c !important;
    font-weight: 1000 !important;
    box-shadow: 0 10px 20px rgba(24, 61, 47, .08) !important;
    white-space: nowrap !important;
}

.course-view-page .uab-next-task-button:hover {
    border-color: #c9902f !important;
    background: #fff3d6 !important;
}

.course-view-page .uab-next-task-button:disabled {
    opacity: .6 !important;
    cursor: not-allowed !important;
}

/* زر الحضور */
.course-view-page .uab-study-attendance-tab {
    background: linear-gradient(135deg, #c9902f, #d8a843) !important;
    color: #fff !important;
    font-weight: 1000 !important;
    border: 0 !important;
}

.course-view-page .uab-study-attendance-tab.attendance-completed {
    background: linear-gradient(135deg, #15803d, #16a34a) !important;
    color: #fff !important;
}

/* Badge تم الحضور */
.course-view-page .uab-attended-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    margin-top: 6px !important;
    padding: 4px 8px !important;
    border-radius: 999px !important;
    background: #ecfdf3 !important;
    color: #15803d !important;
    font-size: 10px !important;
    font-weight: 1000 !important;
    border: 1px solid #bbf7d0 !important;
}

/* كارت الامتحان في السايدبار */
.course-view-page .uab-exam-card-clean,
.course-view-page .uab-simple-exam-row {
    display: grid !important;
    grid-template-columns: 36px minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
    background: #fffaf0 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 16px !important;
    padding: 12px !important;
    margin-top: 8px !important;
    cursor: pointer !important;
}

.course-view-page .uab-exam-card-clean:hover,
.course-view-page .uab-simple-exam-row:hover {
    background: #fff3d6 !important;
    border-color: #c9902f !important;
}

.course-view-page .uab-simple-exam-icon {
    width: 36px !important;
    height: 36px !important;
    border-radius: 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #f7ead3 !important;
    color: #9a6519 !important;
    font-size: 17px !important;
}

.course-view-page .uab-exam-card-clean strong,
.course-view-page .uab-simple-exam-row strong {
    color: #173b2c !important;
    font-weight: 1000 !important;
    line-height: 1.5 !important;
    display: block !important;
}

.course-view-page .uab-exam-card-clean small,
.course-view-page .uab-simple-exam-row small {
    color: #667085 !important;
    font-size: 11px !important;
    line-height: 1.6 !important;
    display: block !important;
}

.course-view-page .uab-exam-card-clean em,
.course-view-page .uab-exam-card-clean button[data-sidebar-start-exam],
.course-view-page .uab-simple-exam-row em,
.course-view-page .uab-simple-exam-row button[data-sidebar-start-exam] {
    display: none !important;
}

/* Intro الامتحان */
.course-view-page .uab-exam-intro-final {
    max-width: 820px !important;
    margin: 24px auto !important;
    background:
        radial-gradient(circle at top right, rgba(201, 146, 47, .16), transparent 34%),
        #fff !important;
    border: 1px solid #eadfcd !important;
    border-radius: 28px !important;
    padding: 30px !important;
    box-shadow: 0 22px 60px rgba(24, 61, 47, .12) !important;
    text-align: center !important;
}

.course-view-page .uab-exam-intro-final h2 {
    color: #173b2c !important;
    font-size: clamp(28px, 4vw, 44px) !important;
    margin-bottom: 8px !important;
}

.course-view-page .uab-exam-student-instructions {
    margin: 20px auto !important;
    text-align: right !important;
    background: #fffdf8 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 20px !important;
    padding: 18px 20px !important;
    color: #173b2c !important;
}

.course-view-page .uab-exam-student-instructions h3 {
    margin: 0 0 12px !important;
    font-size: 20px !important;
    color: #173b2c !important;
}

.course-view-page .uab-exam-student-instructions ol {
    margin: 0 !important;
    padding-inline-start: 22px !important;
    display: grid !important;
    gap: 10px !important;
}

.course-view-page .uab-exam-student-instructions li {
    line-height: 1.9 !important;
    font-weight: 800 !important;
    color: #334155 !important;
}

.course-view-page .uab-exam-student-instructions p {
    margin: 14px 0 0 !important;
    color: #173b2c !important;
    font-weight: 1000 !important;
    line-height: 1.8 !important;
}

.course-view-page .uab-start-exam-primary {
    background: linear-gradient(135deg, #c9902f, #d8a843) !important;
    color: #fff !important;
    border: 0 !important;
    min-height: 52px !important;
    border-radius: 16px !important;
    padding: 12px 22px !important;
    font-weight: 1000 !important;
}

.course-view-page .uab-return-exam-secondary {
    background: #f5efe4 !important;
    color: #173b2c !important;
    border: 1px solid #eadfcd !important;
    min-height: 44px !important;
    border-radius: 14px !important;
    padding: 10px 16px !important;
    font-weight: 900 !important;
}

/* الموبايل */
@media (max-width: 900px) {
    .course-view-page .lms-study-tabs,
    .course-view-page .uab-simple-study-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .course-view-page .uab-exam-intro-final {
        padding: 22px !important;
        border-radius: 22px !important;
    }
}

/* ===== Persistent attendance badge final 20260527 ===== */

.course-view-page .uab-attended-badge-final {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    margin-top: 6px !important;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    background: #ecfdf3 !important;
    color: #15803d !important;
    font-size: 10px !important;
    font-weight: 1000 !important;
    border: 1px solid #bbf7d0 !important;
    line-height: 1.4 !important;
}

.course-view-page .uab-study-attendance-tab.attendance-completed,
.course-view-page [data-register-lesson-attendance].attendance-completed {
    background: linear-gradient(135deg, #15803d, #16a34a) !important;
    color: #fff !important;
    box-shadow: 0 12px 26px rgba(21, 128, 61, .22) !important;
}

/* ===== HARD attendance badge final 20260527 ===== */

.course-view-page .uab-attended-badge-hard {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    margin-top: 7px !important;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    background: #ecfdf3 !important;
    color: #15803d !important;
    font-size: 10px !important;
    font-weight: 1000 !important;
    border: 1px solid #bbf7d0 !important;
    line-height: 1.4 !important;
}

.course-view-page [data-study-lesson] .uab-attended-badge-hard {
    grid-column: 1 / -1 !important;
}

.course-view-page [data-register-lesson-attendance].attendance-completed,
.course-view-page .uab-study-attendance-tab.attendance-completed {
    background: linear-gradient(135deg, #15803d, #16a34a) !important;
    color: #fff !important;
    box-shadow: 0 12px 26px rgba(21, 128, 61, .22) !important;
}

/* ===== Single attendance badge only 20260527 ===== */

/* أخفي أي بادجات قديمة لو سكريبت قديم حاول يرجعها */
.course-view-page .uab-attended-badge,
.course-view-page .uab-attended-badge-final,
.course-view-page .uab-attended-badge-hard {
    display: none !important;
}

/* البادج الوحيد المعتمد */
.course-view-page .uab-attended-badge-single {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    margin-top: 7px !important;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    background: #ecfdf3 !important;
    color: #15803d !important;
    font-size: 10px !important;
    font-weight: 1000 !important;
    border: 1px solid #bbf7d0 !important;
    line-height: 1.4 !important;
    grid-column: 1 / -1 !important;
}

/* ===== Single solved badge for exam cards 20260527 ===== */

.course-view-page .uab-exam-solved-badge-single {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    margin-top: 7px !important;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    background: #eef2ff !important;
    color: #3730a3 !important;
    font-size: 10px !important;
    font-weight: 1000 !important;
    border: 1px solid #c7d2fe !important;
    line-height: 1.4 !important;
    grid-column: 1 / -1 !important;
}

/* ===== Stable clean exam solved badge shape 20260527 ===== */

/* إخفاء كل البادجات القديمة التي كانت تسبب تكرار/وميض/تكسير */
.course-view-page .uab-exam-solved-badge-single,
.course-view-page .uab-exam-solved-badge-hard,
.course-view-page .uab-exam-solved-badge-clean {
    display: none !important;
}

/* كارت الامتحان يسمح ببادج ثابتة */
.course-view-page [data-exam-card] {
    position: relative !important;
}

/* البادج الوحيد المعتمد */
.course-view-page .uab-exam-solved-badge-stable {
    grid-column: 1 / -1 !important;
    justify-self: start !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    margin-top: 6px !important;
    padding: 4px 10px !important;
    border-radius: 999px !important;
    background: #eef2ff !important;
    color: #3730a3 !important;
    font-size: 10px !important;
    font-weight: 1000 !important;
    border: 1px solid #c7d2fe !important;
    line-height: 1.4 !important;
    box-shadow: none !important;
    animation: none !important;
    transform: none !important;
}

/* امنع أي وميض أو تغير عند الوقوف */
.course-view-page [data-exam-card]:hover .uab-exam-solved-badge-stable {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    animation: none !important;
}

/* ===== Exam total points field + intro display 20260527 ===== */

.uab-exam-total-points-field {
    display: grid !important;
    gap: 8px !important;
    background: #fffaf0 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 16px !important;
    padding: 12px !important;
    margin-top: 10px !important;
}

.uab-exam-total-points-field span {
    color: #173b2c !important;
    font-weight: 1000 !important;
    font-size: 13px !important;
}

.uab-exam-total-points-field input {
    width: 100% !important;
    min-height: 44px !important;
    border-radius: 12px !important;
    border: 1px solid #d8c8a9 !important;
    padding: 10px 12px !important;
    font-weight: 900 !important;
    color: #173b2c !important;
    background: #fff !important;
}

.uab-exam-total-points-field small {
    color: #667085 !important;
    font-size: 11px !important;
    line-height: 1.6 !important;
}

.course-view-page .uab-exam-intro-degree {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    margin: 8px auto !important;
    padding: 8px 13px !important;
    border-radius: 999px !important;
    background: #fffaf0 !important;
    color: #173b2c !important;
    border: 1px solid #eadfcd !important;
    font-weight: 1000 !important;
}


/* ===== Clean exam degree: keep original intro design 20260527 ===== */
.course-view-page .uab-exam-intro-meta-final,
.course-view-page .uab-exam-intro-stats-stable,
.course-view-page .uab-student-intro-total-points,
.course-view-page .uab-exam-intro-degree {
    display: none !important;
}

.uab-clean-exam-degree-field {
    display: grid !important;
    gap: 8px !important;
    background: #fffaf0 !important;
    border: 1px solid #eadfcd !important;
    border-radius: 16px !important;
    padding: 12px !important;
    margin-top: 10px !important;
}

.uab-clean-exam-degree-field span {
    color: #173b2c !important;
    font-weight: 1000 !important;
    font-size: 13px !important;
}

.uab-clean-exam-degree-field input {
    width: 100% !important;
    min-height: 44px !important;
    border-radius: 12px !important;
    border: 1px solid #d8c8a9 !important;
    padding: 10px 12px !important;
    font-weight: 900 !important;
    color: #173b2c !important;
    background: #fff !important;
}

.uab-clean-exam-degree-field small {
    color: #667085 !important;
    font-size: 11px !important;
    line-height: 1.6 !important;
}

/* ===== QUESTION FORUM SAME PAGE GRADE/BRANCH FLOW ===== */

.question-forum-page .qf-hero-compact {
  padding: 20px 22px !important;
}

.question-forum-page .qf-grade-cards-row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

.question-forum-page .qf-grade-card {
  border: 1px solid #e6dfd2 !important;
  background: #fff !important;
  border-radius: 20px !important;
  padding: 18px !important;
  text-align: right !important;
  cursor: pointer !important;
  box-shadow: 0 14px 36px rgba(24,61,47,.06) !important;
  display: grid !important;
  gap: 7px !important;
  color: #183d2f !important;
  transition: .18s ease !important;
  min-height: 150px !important;
}

.question-forum-page .qf-grade-card span {
  font-weight: 950 !important;
  font-size: 18px !important;
  color: #0f3f2e !important;
}

.question-forum-page .qf-grade-card strong {
  font-size: 32px !important;
  color: #c79234 !important;
  line-height: 1 !important;
}

.question-forum-page .qf-grade-card small,
.question-forum-page .qf-grade-card em {
  color: #667085 !important;
  font-style: normal !important;
  font-weight: 800 !important;
}

.question-forum-page .qf-grade-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 18px 46px rgba(199,146,52,.14) !important;
}

.question-forum-page .qf-grade-card.active {
  border-color: #c79234 !important;
  box-shadow: 0 18px 46px rgba(199,146,52,.16) !important;
  background: #fffaf0 !important;
}

.question-forum-page .qf-selected-grade-panel {
  background: #fffdf8 !important;
  border: 1px solid rgba(199, 146, 52, .25) !important;
  border-radius: 24px !important;
  padding: 18px !important;
  display: grid !important;
  gap: 14px !important;
  box-shadow: 0 16px 34px rgba(15,63,46,.06) !important;
}

.question-forum-page .qf-selected-grade-title {
  display: flex !important;
  justify-content: space-between !important;
  align-items: end !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

.question-forum-page .qf-selected-grade-title span {
  color: #b45309 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
}

.question-forum-page .qf-selected-grade-title h2 {
  margin: 0 !important;
  color: #0f3f2e !important;
  font-size: 24px !important;
}

.question-forum-page .qf-branch-tabs {
  margin-top: 0 !important;
}

.question-forum-page .qf-branch-tabs button.active {
  background: #0f3f2e !important;
  color: #fff !important;
  box-shadow: 0 12px 30px rgba(15,63,46,.18) !important;
}

.question-forum-page .qf-branch-tabs button.active span,
.question-forum-page .qf-branch-tabs button.active i {
  color: #fff !important;
}

@media(max-width: 900px) {
  .question-forum-page .qf-grade-cards-row {
    grid-template-columns: 1fr !important;
  }
}


/* UAB OPERATIONS DASHBOARD - SCOPED */
.ops-dashboard {
    display: flex;
    flex-direction: column;
    gap: 18px;
    color: #17382f;
}

.ops-dashboard * {
    box-sizing: border-box;
}

.ops-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 24px;
    border-radius: 28px;
    background:
        radial-gradient(circle at top left, rgba(218, 172, 86, .22), transparent 34%),
        linear-gradient(135deg, #0f3b31 0%, #155445 100%);
    color: #fff;
    box-shadow: 0 18px 42px rgba(15, 59, 49, .16);
}

.ops-hero h1 {
    margin: 8px 0;
    font-size: clamp(1.5rem, 2.5vw, 2.4rem);
}

.ops-hero p {
    margin: 0;
    color: rgba(255,255,255,.82);
    line-height: 1.8;
}

.ops-pill {
    display: inline-flex;
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.22);
    font-size: .82rem;
    font-weight: 800;
}

.ops-pill.danger {
    background: rgba(255, 89, 89, .18);
}

.ops-hero-actions,
.ops-card-actions,
.ops-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.ops-action-button,
.ops-card-actions a,
.ops-quick-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 14px;
    border-radius: 14px;
    border: 0;
    background: #d9ad5f;
    color: #10362d;
    font-weight: 900;
    text-decoration: none;
    cursor: pointer;
}

.ops-action-button.secondary {
    background: rgba(255,255,255,.14);
    color: #fff;
    border: 1px solid rgba(255,255,255,.2);
}

.ops-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.ops-summary-card,
.ops-card {
    background: #fffdf8;
    border: 1px solid rgba(18, 68, 56, .08);
    border-radius: 24px;
    box-shadow: 0 12px 32px rgba(20, 60, 50, .08);
}

.ops-summary-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 18px;
    color: #17382f;
    text-decoration: none;
}

.ops-summary-card span {
    color: #6a756f;
    font-weight: 800;
}

.ops-summary-card strong {
    font-size: 2rem;
    line-height: 1;
}

.ops-main-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.ops-card {
    padding: 18px;
}

.ops-card-wide {
    grid-column: 1 / -1;
}

.ops-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.ops-card-kicker {
    display: block;
    color: #b48335;
    font-size: .78rem;
    font-weight: 900;
    margin-bottom: 5px;
}

.ops-card h2 {
    margin: 0;
    font-size: 1.15rem;
    color: #10362d;
}

.ops-task-list,
.ops-metric-list,
.ops-activity-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ops-task-item,
.ops-metric-row,
.ops-activity-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px;
    border-radius: 16px;
    background: #f7f2e8;
    color: #17382f;
    text-decoration: none;
}

.ops-task-item strong,
.ops-activity-item strong {
    display: block;
}

.ops-task-item span,
.ops-activity-item small {
    display: block;
    margin-top: 4px;
    color: #718078;
    font-size: .86rem;
}

.ops-task-item b,
.ops-metric-row b {
    min-width: 36px;
    text-align: center;
    padding: 7px 10px;
    border-radius: 12px;
    background: #123f34;
    color: #fff;
}

.ops-task-item.high b {
    background: #8b2f2f;
}

.ops-task-item.medium b {
    background: #9a6a21;
}

.ops-card-actions {
    margin-top: 14px;
}

.ops-card-actions a,
.ops-quick-actions a {
    background: #123f34;
    color: #fff;
    font-size: .9rem;
}

.ops-empty-state {
    padding: 16px;
    border-radius: 18px;
    background: #f8f3e9;
    color: #6f7a73;
    font-weight: 800;
    text-align: center;
}

.ops-skeleton-card {
    min-height: 105px;
    background: linear-gradient(90deg, #f4eee3, #fffaf1, #f4eee3);
    background-size: 200% 100%;
    animation: opsPulse 1.4s ease-in-out infinite;
}

@keyframes opsPulse {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

@media (max-width: 900px) {
    .ops-hero {
        align-items: stretch;
        flex-direction: column;
        border-radius: 22px;
        padding: 18px;
    }

    .ops-hero-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .ops-summary-grid,
    .ops-main-grid {
        grid-template-columns: 1fr;
    }

    .ops-summary-card strong {
        font-size: 1.65rem;
    }

    .ops-task-item,
    .ops-metric-row,
    .ops-activity-item {
        align-items: flex-start;
    }
}

/* UAB OPERATIONS DASHBOARD POLISH V2 - SCOPED */
.ops-dashboard {
    gap: 14px;
}

.ops-hero {
    min-height: 118px;
    padding: 22px 26px;
}

.ops-hero h1 {
    letter-spacing: -0.5px;
}

.ops-summary-grid {
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 12px;
}

.ops-summary-card {
    min-height: 92px;
    padding: 16px 18px;
    justify-content: space-between;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.ops-summary-card:hover {
    transform: translateY(-2px);
    border-color: rgba(217, 173, 95, .42);
    box-shadow: 0 16px 34px rgba(20, 60, 50, .12);
}

.ops-summary-card span {
    font-size: .93rem;
    line-height: 1.5;
}

.ops-summary-card strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-width: 42px;
    height: 42px;
    padding: 0 12px;
    border-radius: 14px;
    background: #0f3b31;
    color: #fff;
    font-size: 1.45rem;
    font-family: Arial, Tahoma, sans-serif;
    direction: ltr;
}

.ops-main-grid {
    align-items: start;
}

.ops-card {
    padding: 16px;
}

.ops-card h2 {
    font-size: 1.08rem;
}

.ops-card-kicker {
    font-size: .73rem;
}

.ops-task-item,
.ops-metric-row,
.ops-activity-item {
    min-height: 48px;
    padding: 10px 12px;
}

.ops-task-item b,
.ops-metric-row b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    font-family: Arial, Tahoma, sans-serif;
    direction: ltr;
    line-height: 1;
}

.ops-metric-row span,
.ops-task-item strong,
.ops-activity-main strong {
    line-height: 1.55;
}

.ops-card-actions a,
.ops-quick-actions a {
    min-height: 38px;
    padding: 9px 12px;
    border-radius: 12px;
    transition: transform .18s ease, background .18s ease;
}

.ops-card-actions a:hover,
.ops-quick-actions a:hover {
    transform: translateY(-1px);
    background: #0b332a;
}

.ops-quick-actions {
    justify-content: flex-start;
}

.ops-activity-list {
    gap: 8px;
}

.ops-activity-item {
    align-items: center;
}

.ops-activity-main {
    min-width: 0;
}

.ops-activity-main strong,
.ops-activity-main small {
    overflow-wrap: anywhere;
}

.ops-activity-type {
    flex: 0 0 auto;
    max-width: 180px;
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(15, 59, 49, .09);
    color: #0f3b31;
    font-size: .75rem;
    font-weight: 900;
    direction: ltr;
    text-align: center;
    overflow-wrap: anywhere;
}

.ops-empty-state {
    padding: 14px;
}

@media (max-width: 1100px) {
    .ops-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .ops-dashboard {
        gap: 12px;
    }

    .ops-hero {
        min-height: auto;
        padding: 16px;
    }

    .ops-hero h1 {
        font-size: 1.35rem;
    }

    .ops-hero p {
        font-size: .92rem;
    }

    .ops-hero-actions {
        grid-template-columns: 1fr;
    }

    .ops-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .ops-summary-card {
        min-height: 86px;
        padding: 13px;
    }

    .ops-summary-card span {
        font-size: .84rem;
    }

    .ops-summary-card strong {
        min-width: 38px;
        height: 38px;
        font-size: 1.25rem;
        border-radius: 12px;
    }

    .ops-card {
        padding: 14px;
        border-radius: 20px;
    }

    .ops-task-item,
    .ops-metric-row,
    .ops-activity-item {
        gap: 10px;
    }

    .ops-activity-item {
        align-items: flex-start;
        flex-direction: column;
    }

    .ops-activity-type {
        max-width: 100%;
    }
}

@media (max-width: 520px) {
    .ops-summary-grid {
        grid-template-columns: 1fr;
    }
}

/* UAB OPERATIONS DASHBOARD DESKTOP POLISH V3 - SCOPED */
@media (min-width: 901px) {
    .ops-dashboard {
        max-width: 100%;
    }

    .ops-hero {
        margin-bottom: 6px;
    }

    .ops-summary-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ops-summary-card {
        flex-direction: row-reverse;
        align-items: center;
        min-height: 76px;
    }

    .ops-summary-card span {
        flex: 1;
        text-align: right;
    }

    .ops-summary-card strong {
        flex: 0 0 auto;
    }

    .ops-main-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .ops-card {
        min-height: 0;
    }

    .ops-metric-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .ops-metric-row {
        min-height: 58px;
        align-items: center;
        border: 1px solid rgba(15, 59, 49, .05);
    }

    .ops-metric-row span {
        font-size: .9rem;
        font-weight: 800;
        color: #344c43;
    }

    .ops-card-actions {
        justify-content: flex-start;
    }

    .ops-card-actions a {
        min-width: 120px;
    }

    .ops-card-priority .ops-task-list {
        gap: 10px;
    }

    .ops-task-item {
        min-height: 64px;
    }

    .ops-task-item div {
        min-width: 0;
    }

    .ops-task-item strong,
    .ops-task-item span {
        overflow-wrap: anywhere;
    }

    .ops-quick-actions {
        gap: 9px;
    }

    .ops-quick-actions a {
        min-width: 108px;
    }

    .ops-card-wide {
        padding: 18px;
    }

    .ops-card-wide .ops-activity-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .ops-activity-item {
        min-height: 72px;
        border: 1px solid rgba(15, 59, 49, .05);
    }
}

@media (min-width: 1300px) {
    .ops-main-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ops-card-wide .ops-activity-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}