/**
 * EAP Frontend Scoped Bundle v1.6.19
 * Generated from the portal design system. Every selector is contained under
 * .eap-plugin-scope so WordPress theme headers, footers, forms and third-party
 * widgets are not restyled by EAP frontend assets.
 */

/* ===== SOURCE: eap-perfect-theme.css ===== */
/**
 * eap-perfect-theme.css
 * Perfect Aptitude Portal — Unified Design System
 * Mirrors theme.css exactly so portal feels like "homepage expanded into a dashboard".
 */

/* ─── 1. Design Tokens (mirrors theme.css :root) ─────────────────────── */
.eap-plugin-scope{
    /* ── Core palette (identical to website theme.css) ── */
    --pa-bg:            #f8fbff;
    --pa-surface:       #ffffff;
    --pa-surface-soft:  #f1f5f9;
    --pa-surface-2:     #f8fbff;
    --pa-surface-3:     #f1f5f9;
    --pa-primary:       #3b82f6;
    --pa-primary-dark:  #1d4ed8;
    --pa-primary-light: #eff6ff;
    --pa-secondary:     #10b981;
    --pa-accent:        #f97316;
    --pa-success:       #10b981;
    --pa-success-dark:  #047857;
    --pa-warning:       #f59e0b;
    --pa-warning-dark:  #b45309;
    --pa-danger:        #dc2626;
    --pa-danger-dark:   #991b1b;
    --pa-text:          #0f172a;
    --pa-muted:         #64748b;
    --pa-border:        #e2e8f0;
    --pa-border-solid:  #e2e8f0;
    --pa-border-focus:  #3b82f6;

    /* ── Radius scale ── */
    --pa-radius:        12px;
    --pa-radius-sm:     8px;
    --pa-radius-md:     12px;
    --pa-radius-lg:     16px;
    --pa-radius-full:   9999px;

    /* ── Shadows ── */
    --pa-shadow-xs:     0 1px 2px rgba(15, 23, 42, 0.04);
    --pa-shadow:        0 4px 6px -1px rgba(0,0,0,0.05), 0 2px 4px -1px rgba(0,0,0,0.03);
    --pa-shadow-sm:     0 4px 6px -1px rgba(0,0,0,0.05), 0 2px 4px -1px rgba(0,0,0,0.03);
    --pa-shadow-md:     0 8px 16px -2px rgba(0,0,0,0.08);
    --pa-shadow-lg:     0 20px 25px -5px rgba(15,23,42,0.10), 0 10px 10px -5px rgba(15,23,42,0.04);

    /* ── Motion ── */
    --pa-ease:          240ms cubic-bezier(0.4, 0, 0.2, 1);
    --pa-transition:    all 0.2s cubic-bezier(0.4,0,0.2,1);

    /* ── Sidebar (blue active, matches website primary) ── */
    --pa-sidebar-bg:              #ffffff;
    --pa-sidebar-text:            #64748b;
    --pa-sidebar-text-active:     #3b82f6;
    --pa-sidebar-item-hover:      #f1f5f9;
    --pa-sidebar-item-active:     rgba(59, 130, 246, 0.08);
    --pa-sidebar-divider:         #e2e8f0;
    --pa-sidebar-width:           260px;

    /* ── eap- → pa- forward-compat aliases ── */
    --eap-bg:               var(--pa-bg);
    --eap-surface:          var(--pa-surface);
    --eap-surface-2:        var(--pa-surface-soft);
    --eap-surface-3:        var(--pa-surface-soft);
    --eap-border:           var(--pa-border);
    --eap-border-solid:     var(--pa-border-solid);
    --eap-text-primary:     var(--pa-text);
    --eap-text-secondary:   var(--pa-muted);
    --eap-text-muted:       var(--pa-muted);
    --eap-primary:          var(--pa-primary);
    --eap-primary-dark:     var(--pa-primary-dark);
    --eap-primary-hover:    var(--pa-primary-dark);
    --eap-font:             "Inter", system-ui, sans-serif;

    /* ── Legacy shorthand aliases (used by eap-admin-shim.css & eap-global-admin.css) ── */
    --r-sm:       var(--pa-radius-sm);
    --r-md:       var(--pa-radius-md);
    --r-lg:       var(--pa-radius-lg);
    --ease:       var(--pa-ease);
    --shadow-xs:  var(--pa-shadow-xs);
    --shadow-sm:  var(--pa-shadow-sm);
    --shadow-md:  var(--pa-shadow-md);

    /* ── Named colour aliases (legacy) ── */
    --eap-emerald:  var(--pa-success);
    --eap-amber:    var(--pa-warning);
    --eap-coral:    var(--pa-danger);
    --eap-mint:     var(--pa-success);
    --eap-yellow:   var(--pa-warning);
    --eap-blue:     var(--pa-primary);
    --eap-blue-dark: var(--pa-primary-dark);
}

/* ─── 2. Base Reset ───────────────────────────────────────────────────── */
.eap-plugin-scope .eap-viewport-shell,
.eap-plugin-scope .eap-portal-shell{
    font-family: "Inter", system-ui, sans-serif;
    background: var(--pa-bg);
    color: var(--pa-text);
    -webkit-font-smoothing: antialiased;
    line-height: 1.5;
}

/* ─── 3. Layout Shell ────────────────────────────────────────────────── */
.eap-plugin-scope .eap-portal-shell{
    display: flex;
    min-height: 100vh;
    width: 100%;
}

.eap-plugin-scope .eap-shell-inner,
.eap-plugin-scope .eap-dashboard-app-wrap{
    display: flex;
    flex-direction: row;
    flex: 1;
    width: 100%;
    min-height: 100vh;
    box-sizing: border-box;
}

.eap-plugin-scope .eap-main{
    flex: 1;
    background: var(--pa-bg);
    padding: 32px;
    overflow-y: auto;
    box-sizing: border-box;
    min-width: 0;
}

/* ─── 4. Sidebar — clean white, matches homepage nav ─────────────────── */
.eap-plugin-scope .eap-sidebar,
.eap-plugin-scope .eap-portal-shell .eap-sidebar{
    width: 240px;
    min-width: 240px;
    background: var(--pa-surface) !important;
    border-right: 1px solid var(--pa-border) !important;
    box-shadow: none !important;
    display: flex;
    flex-direction: column;
    padding: 0;
    flex-shrink: 0;
    box-sizing: border-box;
}

/* Override all role-specific sidebar colors */
.eap-plugin-scope .pa-role-institution .eap-sidebar,
.eap-plugin-scope .pa-role-teacher .eap-sidebar,
.eap-plugin-scope .pa-role-student .eap-sidebar,
.eap-plugin-scope .pa-role-admin .eap-sidebar{
    background: var(--pa-surface) !important;
    border-right: 1px solid var(--pa-border) !important;
    box-shadow: 2px 0 8px rgba(0,0,0,0.04) !important;
}

.eap-plugin-scope .eap-sidebar-top,
.eap-plugin-scope .eap-portal-shell .eap-sidebar-top{
    padding: 20px 16px 16px;
    border-bottom: 1px solid var(--pa-border);
}

.eap-plugin-scope .eap-sidebar-logo,
.eap-plugin-scope .eap-logo-name{
    font-size: 16px;
    font-weight: 800;
    color: var(--pa-text) !important;
    letter-spacing: -0.02em;
}

.eap-plugin-scope .eap-logo-sub{
    font-size: 11px;
    color: var(--pa-muted) !important;
    font-weight: 500;
}

/* Nav Links */
.eap-plugin-scope .eap-sidebar-nav{
    padding: 12px 8px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
}

.eap-plugin-scope .eap-nav-link,
.eap-plugin-scope .eap-portal-shell .eap-nav-link{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: var(--pa-radius-sm);
    font-size: 13px;
    font-weight: 500;
    color: var(--pa-muted) !important;
    text-decoration: none !important;
    transition: var(--pa-transition);
    background: transparent;
    border: none;
    width: 100%;
    cursor: pointer;
    box-sizing: border-box;
}

.eap-plugin-scope .eap-nav-link:hover,
.eap-plugin-scope .eap-portal-shell .eap-nav-link:hover{
    background: var(--pa-surface-soft) !important;
    color: var(--pa-text) !important;
}

.eap-plugin-scope .eap-nav-link.active,
.eap-plugin-scope .eap-nav-link[aria-current="page"],
.eap-plugin-scope .eap-portal-shell .eap-nav-link.active{
    background: rgba(59, 130, 246, 0.08) !important;
    color: var(--pa-primary) !important;
    font-weight: 600;
}

/* Override role-specific nav active colors */
.eap-plugin-scope .pa-role-institution .eap-nav-link.active,
.eap-plugin-scope .pa-role-teacher .eap-nav-link.active,
.eap-plugin-scope .pa-role-student .eap-nav-link.active{
    background: rgba(59, 130, 246, 0.08) !important;
    color: var(--pa-primary) !important;
}

.eap-plugin-scope .eap-sidebar-footer,
.eap-plugin-scope .eap-portal-shell .eap-sidebar-footer{
    padding: 12px 8px 16px;
    border-top: 1px solid var(--pa-border);
}

.eap-plugin-scope .eap-sidebar-user{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-radius: var(--pa-radius-sm);
    color: var(--pa-text) !important;
}

.eap-plugin-scope .eap-sidebar-user-name{
    font-size: 13px;
    font-weight: 600;
    color: var(--pa-text) !important;
}

.eap-plugin-scope .eap-sidebar-user-role{
    font-size: 11px;
    color: var(--pa-muted) !important;
}

.eap-plugin-scope .eap-sidebar-logout,
.eap-plugin-scope .eap-portal-shell .eap-sidebar-logout{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: var(--pa-radius-sm);
    font-size: 12px;
    font-weight: 600;
    color: var(--pa-muted) !important;
    text-decoration: none !important;
    transition: var(--pa-transition);
}

.eap-plugin-scope .eap-sidebar-logout:hover{
    background: rgba(220,38,38,0.06) !important;
    color: var(--pa-danger) !important;
}

/* ─── 5. Topbar ─────────────────────────────────────────────────────── */
.eap-plugin-scope .eap-topbar,
.eap-plugin-scope .eap-portal-shell .eap-topbar{
    background: var(--pa-surface) !important;
    border-bottom: 1px solid var(--pa-border) !important;
    box-shadow: none !important;
    height: auto !important;
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 24px;
    box-sizing: border-box;
    gap: 16px;
}

/* User chip styling */
.eap-plugin-scope .eap-user-chip{
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--pa-surface) !important;
    color: var(--pa-text) !important;
    border: 1px solid var(--pa-border) !important;
    border-radius: 9999px !important;
    padding: 6px 14px 6px 10px !important;
    box-shadow: var(--pa-shadow) !important;
    transition: var(--pa-transition) !important;
}
.eap-plugin-scope .eap-user-chip:hover{
    border-color: var(--pa-primary) !important;
    box-shadow: var(--pa-shadow-md) !important;
}
.eap-plugin-scope .eap-user-chip-avatar{ line-height: 0; }
.eap-plugin-scope .eap-avatar-img,
.eap-plugin-scope .eap-user-chip-avatar img{
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    display: block;
    border: 1px solid var(--pa-border);
}
.eap-plugin-scope .eap-user-chip-info{ display: flex; flex-direction: column; }
.eap-plugin-scope .eap-user-chip-name{
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--pa-text) !important;
    white-space: nowrap;
    line-height: 1.2;
}
.eap-plugin-scope .eap-user-chip-role{
    font-size: 10px !important;
    font-weight: 700 !important;
    color: var(--pa-primary) !important;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1.2;
}

/* Kicker & Badges styling */
.eap-plugin-scope .eap-shell-kicker{
    display: inline-flex;
    align-items: center;
    background: rgba(59, 130, 246, 0.1);
    color: var(--pa-primary);
    font-size: 11px;
    font-weight: 800;
    padding: 4px 10px;
    border-radius: 9999px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-right: 8px;
    vertical-align: middle;
}
.eap-plugin-scope .eap-role-badge{
    display: inline-flex;
    align-items: center;
    background: var(--pa-surface-soft);
    color: var(--pa-muted);
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 9999px;
    border: 1px solid var(--pa-border);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    vertical-align: middle;
}

/* Override role topbar gradients */
.eap-plugin-scope .pa-role-institution .eap-topbar,
.eap-plugin-scope .pa-role-teacher .eap-topbar,
.eap-plugin-scope .pa-role-student .eap-topbar{
    background: var(--pa-surface) !important;
    border-bottom: 1px solid var(--pa-border) !important;
    border-bottom-width: 1px !important;
}

.eap-plugin-scope .eap-page-title,
.eap-plugin-scope .eap-topbar h1{
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--pa-text) !important;
    -webkit-text-fill-color: var(--pa-text) !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    letter-spacing: -0.01em;
    margin: 0;
}

/* ─── 6. Cards — matches pa-card exactly ──────────────────────────── */
.eap-plugin-scope .eap-card,
.eap-plugin-scope .pa-card,
.eap-plugin-scope .eap-widget,
.eap-plugin-scope .eap-portal-shell .eap-card{
    background: var(--pa-surface) !important;
    border: 1px solid var(--pa-border) !important;
    border-left: 1px solid var(--pa-border) !important;
    border-left-width: 1px !important;
    border-radius: var(--pa-radius) !important;
    padding: 20px !important;
    box-shadow: var(--pa-shadow) !important;
    transition: var(--pa-transition);
    box-sizing: border-box;
}

.eap-plugin-scope .eap-card:hover,
.eap-plugin-scope .eap-widget:hover{
    transform: translateY(-1px);
    box-shadow: var(--pa-shadow-md) !important;
}

/* Card Title */
.eap-plugin-scope .eap-card-title,
.eap-plugin-scope .eap-widget-title{
    font-size: 14px !important;
    font-weight: 700 !important;
    color: var(--pa-text) !important;
    margin: 0 0 2px 0;
    padding-bottom: 0 !important;
    border-bottom: none !important;
}

/* Role card overrides — remove colored left borders */
.eap-plugin-scope .pa-role-institution .eap-card,
.eap-plugin-scope .pa-role-teacher .eap-card,
.eap-plugin-scope .pa-role-student .eap-card,
.eap-plugin-scope .pa-role-institution .pa-card,
.eap-plugin-scope .pa-role-teacher .pa-card,
.eap-plugin-scope .pa-role-student .pa-card{
    border-left: 1px solid var(--pa-border) !important;
    border-left-width: 1px !important;
    background: var(--pa-surface) !important;
    box-shadow: var(--pa-shadow) !important;
}

.eap-plugin-scope .pa-role-institution .eap-card:hover,
.eap-plugin-scope .pa-role-teacher .eap-card:hover,
.eap-plugin-scope .pa-role-student .eap-card:hover{
    border-left-color: var(--pa-border) !important;
    box-shadow: var(--pa-shadow-md) !important;
}

/* ─── 7. Stat / KPI Cards ────────────────────────────────────────── */
.eap-plugin-scope .eap-kpi-card,
.eap-plugin-scope .eap-stat-card{
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-radius);
    padding: 20px;
    box-shadow: var(--pa-shadow);
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: var(--pa-transition);
    box-sizing: border-box;
}

.eap-plugin-scope .eap-kpi-card:hover,
.eap-plugin-scope .eap-stat-card:hover{
    transform: translateY(-1px);
    box-shadow: var(--pa-shadow-md);
}

.eap-plugin-scope .eap-metric-value{
    font-size: 28px !important;
    font-weight: 800 !important;
    color: var(--pa-text) !important;
    line-height: 1;
}

.eap-plugin-scope .eap-metric-label{
    font-size: 12px !important;
    color: var(--pa-muted) !important;
    font-weight: 500;
    margin-top: 4px;
}

/* ─── 8. Grid System ─────────────────────────────────────────────── */
.eap-plugin-scope .eap-dashboard-grid,
.eap-plugin-scope .eap-grid{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 20px;
}

.eap-plugin-scope .eap-col-12{ grid-column: span 12; }
.eap-plugin-scope .eap-col-8{ grid-column: span 8; }
.eap-plugin-scope .eap-col-6{ grid-column: span 6; }
.eap-plugin-scope .eap-col-4{ grid-column: span 4; }
.eap-plugin-scope .eap-col-3{ grid-column: span 3; }

@media (max-width: 1024px) {
    .eap-plugin-scope .eap-col-4{ grid-column: span 6; }
    .eap-plugin-scope .eap-col-3{ grid-column: span 6; }
}
@media (max-width: 768px) {
    .eap-plugin-scope .eap-dashboard-grid{ gap: 14px; }
    .eap-plugin-scope .eap-main{ padding: 16px; }
    .eap-plugin-scope .eap-col-3,
.eap-plugin-scope .eap-col-4,
.eap-plugin-scope .eap-col-6,
.eap-plugin-scope .eap-col-8{ grid-column: span 12; }
}

/* ─── 9. Buttons — matches pa-button exactly ─────────────────────── */
.eap-plugin-scope .eap-btn,
.eap-plugin-scope .pa-button{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    font-size: 13px;
    font-weight: 600;
    border-radius: var(--pa-radius-sm);
    border: none;
    cursor: pointer;
    transition: var(--pa-transition);
    text-decoration: none !important;
    text-align: center;
    box-sizing: border-box;
    line-height: 1.4;
    gap: 6px;
    white-space: nowrap;
}

.eap-plugin-scope .eap-btn--primary,
.eap-plugin-scope .pa-button-primary{
    background: var(--pa-primary) !important;
    color: #fff !important;
    box-shadow: 0 2px 4px rgba(59,130,246,0.25) !important;
}
.eap-plugin-scope .eap-btn--primary:hover,
.eap-plugin-scope .pa-button-primary:hover{
    background: var(--pa-primary-dark) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(59,130,246,0.35) !important;
}

.eap-plugin-scope .eap-btn--secondary,
.eap-plugin-scope .pa-button-secondary{
    background: var(--pa-surface-soft) !important;
    color: var(--pa-text) !important;
    border: 1px solid var(--pa-border) !important;
    box-shadow: none !important;
}
.eap-plugin-scope .eap-btn--secondary:hover,
.eap-plugin-scope .pa-button-secondary:hover{
    background: var(--pa-border) !important;
}

.eap-plugin-scope .eap-btn--success,
.eap-plugin-scope .pa-button-success{
    background: var(--pa-success) !important;
    color: #fff !important;
    box-shadow: 0 2px 4px rgba(16,185,129,0.25) !important;
}
.eap-plugin-scope .eap-btn--success:hover,
.eap-plugin-scope .pa-button-success:hover{
    filter: brightness(0.92);
    transform: translateY(-1px);
}

.eap-plugin-scope .eap-btn--danger,
.eap-plugin-scope .pa-button-danger{
    background: var(--pa-danger) !important;
    color: #fff !important;
}

.eap-plugin-scope .eap-btn--sm{ padding: 6px 12px; font-size: 12px; }
.eap-plugin-scope .eap-btn--lg{ padding: 12px 28px; font-size: 15px; }

/* ─── 10. Badges ─────────────────────────────────────────────────── */
.eap-plugin-scope .eap-badge,
.eap-plugin-scope .pa-badge{
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 600;
    border-radius: 9999px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.eap-plugin-scope .eap-badge--primary,
.eap-plugin-scope .pa-badge-primary{ background: rgba(59,130,246,0.1);  color: var(--pa-primary); }
.eap-plugin-scope .eap-badge--success,
.eap-plugin-scope .pa-badge-success{ background: rgba(16,185,129,0.1);  color: var(--pa-success); }
.eap-plugin-scope .eap-badge--warning,
.eap-plugin-scope .pa-badge-warning{ background: rgba(245,158,11,0.1);  color: var(--pa-warning); }
.eap-plugin-scope .eap-badge--danger,
.eap-plugin-scope .pa-badge-danger{ background: rgba(220,38,38,0.1);   color: var(--pa-danger); }
.eap-plugin-scope .eap-badge--muted{ background: var(--pa-surface-soft); color: var(--pa-muted);   border: 1px solid var(--pa-border); }

/* ─── 11. Tables ─────────────────────────────────────────────────── */
.eap-plugin-scope .eap-table,
.eap-plugin-scope .pa-table{
    width: 100%;
    border-collapse: collapse;
}
.eap-plugin-scope .eap-table th,
.eap-plugin-scope .pa-table th{
    padding: 10px 14px;
    text-align: left;
    font-size: 11px;
    font-weight: 700;
    color: var(--pa-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-bottom: 2px solid var(--pa-border);
    background: var(--pa-surface-soft);
}
.eap-plugin-scope .eap-table td,
.eap-plugin-scope .pa-table td{
    padding: 12px 14px;
    font-size: 13px;
    color: var(--pa-text) !important;
    border-bottom: 1px solid var(--pa-border);
    vertical-align: middle;
}
.eap-plugin-scope .eap-table tr:last-child td,
.eap-plugin-scope .pa-table tr:last-child td{ border-bottom: none; }
.eap-plugin-scope .eap-table tr:hover td{ background: var(--pa-surface-soft); }

/* ─── 12. Forms ──────────────────────────────────────────────────── */
.eap-plugin-scope .eap-portal-shell input[type=text],
.eap-plugin-scope .eap-portal-shell input[type=email],
.eap-plugin-scope .eap-portal-shell input[type=tel],
.eap-plugin-scope .eap-portal-shell input[type=url],
.eap-plugin-scope .eap-portal-shell input[type=password],
.eap-plugin-scope .eap-portal-shell input[type=number],
.eap-plugin-scope .eap-portal-shell select,
.eap-plugin-scope .eap-portal-shell textarea,
.eap-plugin-scope .pa-input,
.eap-plugin-scope .pa-select{
    width: 100%;
    padding: 9px 13px;
    font-size: 13px;
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-radius-sm);
    background: var(--pa-surface);
    color: var(--pa-text);
    transition: var(--pa-transition);
    box-sizing: border-box;
    font-family: inherit;
}
.eap-plugin-scope .eap-portal-shell input:focus,
.eap-plugin-scope .eap-portal-shell select:focus,
.eap-plugin-scope .eap-portal-shell textarea:focus{
    outline: none;
    border-color: var(--pa-primary);
    box-shadow: 0 0 0 3px rgba(59,130,246,0.12);
}
.eap-plugin-scope .eap-portal-shell label{
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--pa-text);
    margin-bottom: 5px;
}
.eap-plugin-scope .eap-portal-shell small{
    font-size: 11px;
    color: var(--pa-muted);
    display: block;
    margin-top: 3px;
}

/* ─── 13. Tabs — matches pa-tabs ─────────────────────────────────── */
.eap-plugin-scope .eap-tabs,
.eap-plugin-scope .pa-tabs{
    display: flex;
    gap: 4px;
    border-bottom: 1px solid var(--pa-border);
    margin-bottom: 20px;
}
.eap-plugin-scope .eap-tab,
.eap-plugin-scope .pa-tab{
    padding: 10px 18px;
    font-size: 13px;
    font-weight: 600;
    color: var(--pa-muted);
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: var(--pa-transition);
    background: none;
    border-top: none;
    border-left: none;
    border-right: none;
    margin-bottom: -1px;
}
.eap-plugin-scope .eap-tab.active,
.eap-plugin-scope .pa-tab.active,
.eap-plugin-scope .eap-tab-btn.active{
    color: var(--pa-primary) !important;
    border-bottom-color: var(--pa-primary) !important;
}

/* ─── 14. Empty States ───────────────────────────────────────────── */
.eap-plugin-scope .eap-empty-state,
.eap-plugin-scope .pa-empty-state{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
    text-align: center;
    color: var(--pa-muted);
}
.eap-plugin-scope .eap-empty-state .dashicons,
.eap-plugin-scope .pa-empty-state .dashicons{
    font-size: 40px;
    width: 40px;
    height: 40px;
    color: var(--pa-border);
    margin-bottom: 12px;
}
.eap-plugin-scope .eap-empty-state p,
.eap-plugin-scope .pa-empty-state p{
    font-size: 13px;
    color: var(--pa-muted);
    margin: 0;
    max-width: 360px;
}

/* ─── 15. Alerts ─────────────────────────────────────────────────── */
.eap-plugin-scope .eap-alert,
.eap-plugin-scope .pa-alert{
    padding: 12px 16px;
    border-radius: var(--pa-radius-sm);
    font-size: 13px;
    font-weight: 500;
    border: 1px solid transparent;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    box-sizing: border-box;
}
.eap-plugin-scope .eap-alert--success,
.eap-plugin-scope .pa-alert-success{ background: rgba(16,185,129,0.05); border-color: rgba(16,185,129,0.2); color: #047857; }
.eap-plugin-scope .eap-alert--warning,
.eap-plugin-scope .pa-alert-warning{ background: rgba(245,158,11,0.05); border-color: rgba(245,158,11,0.2); color: #92400e; }
.eap-plugin-scope .eap-alert--danger,
.eap-plugin-scope .pa-alert-danger{ background: rgba(220,38,38,0.05);  border-color: rgba(220,38,38,0.2);  color: #991b1b; }
.eap-plugin-scope .eap-alert--info{ background: rgba(59,130,246,0.05); border-color: rgba(59,130,246,0.2); color: #1e40af; }

/* ─── 16. Status Pills ───────────────────────────────────────────── */
.eap-plugin-scope .eap-status-pill,
.eap-plugin-scope .pa-status{
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 9999px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1;
}
.eap-plugin-scope .eap-status-pill.emerald,
.eap-plugin-scope .pa-status--success{ background: rgba(16,185,129,0.1); color: #059669; }
.eap-plugin-scope .eap-status-pill.blue,
.eap-plugin-scope .pa-status--info{ background: rgba(59,130,246,0.1); color: #2563eb; }
.eap-plugin-scope .eap-status-pill.amber,
.eap-plugin-scope .pa-status--warning{ background: rgba(245,158,11,0.1); color: #d97706; }
.eap-plugin-scope .eap-status-pill.red,
.eap-plugin-scope .pa-status--danger{ background: rgba(220,38,38,0.1);  color: #dc2626; }

/* ─── 17. Section Headers (page-level) ───────────────────────────── */
.eap-plugin-scope .eap-section-header{
    margin-bottom: 20px;
}
.eap-plugin-scope .eap-section-title{
    font-size: 20px;
    font-weight: 800;
    color: var(--pa-text);
    margin: 0 0 4px;
    letter-spacing: -0.02em;
}
.eap-plugin-scope .eap-section-subtitle{
    font-size: 13px;
    color: var(--pa-muted);
    margin: 0;
}

/* ─── 18. Role colour accents (subtle, not the whole sidebar) ─────── */
.eap-plugin-scope .eap-role-accent-bar{
    height: 3px;
    border-radius: 0 0 3px 3px;
    background: var(--pa-primary);
    width: 100%;
}
.eap-plugin-scope .pa-role-teacher .eap-role-accent-bar{ background: var(--pa-secondary); }
.eap-plugin-scope .pa-role-student .eap-role-accent-bar{ background: var(--pa-accent); }
.eap-plugin-scope .pa-role-institution .eap-role-accent-bar{ background: var(--pa-primary); }

/* ─── 19. Utility helpers ─────────────────────────────────────────── */
.eap-plugin-scope .u-text-muted{ color: var(--pa-muted) !important; }
.eap-plugin-scope .u-text-primary{ color: var(--pa-text) !important; }
.eap-plugin-scope .u-text-accent{ color: var(--pa-primary) !important; }
.eap-plugin-scope .u-mt-sm{ margin-top: 8px; }
.eap-plugin-scope .u-mt-xs{ margin-top: 4px; }
.eap-plugin-scope .u-mt-md{ margin-top: 16px; }
.eap-plugin-scope .u-mt-lg{ margin-top: 24px; }
.eap-plugin-scope .u-m-0{ margin: 0 !important; }
.eap-plugin-scope .u-mb-sm{ margin-bottom: 8px; }
.eap-plugin-scope .u-mb-xs{ margin-bottom: 4px; }
.eap-plugin-scope .u-mb-md{ margin-bottom: 16px; }
.eap-plugin-scope .u-mb-lg{ margin-bottom: 24px; }
.eap-plugin-scope .u-mr-xs{ margin-right: 4px; }
.eap-plugin-scope .u-p-sm{ padding: 8px; }
.eap-plugin-scope .u-p-md{ padding: 16px; }
.eap-plugin-scope .u-pl-md{ padding-left: 16px; }
.eap-plugin-scope .u-flex{ display: flex; align-items: center; }
.eap-plugin-scope .u-flex-gap{ gap: 12px; }
.eap-plugin-scope .u-flex-gap-sm{ gap: 8px; }
.eap-plugin-scope .u-flex-gap-md{ gap: 16px; }
.eap-plugin-scope .u-wrap{ flex-wrap: wrap; }
.eap-plugin-scope .u-between{ justify-content: space-between; }
.eap-plugin-scope .u-hidden{ display: none !important; }
.eap-plugin-scope .u-font-semibold{ font-weight: 600; }
.eap-plugin-scope .u-text-xs{ font-size: 12px; }
.eap-plugin-scope .u-text-sm{ font-size: 14px; }
.eap-plugin-scope .u-block{ display: block; }
.eap-plugin-scope .u-border{ border: 1px solid var(--pa-border); }
.eap-plugin-scope .u-rounded-md{ border-radius: 8px; }
.eap-plugin-scope .u-bg-primary{ background: var(--pa-surface-soft); }
.eap-plugin-scope .u-line-tight{ line-height: 1; }
.eap-plugin-scope .u-maxw-220{ max-width: 220px; }
.eap-plugin-scope .u-maxw-full{ max-width: 100%; }

.eap-plugin-scope .eap-dashboard-filter-bar{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: end;
}

.eap-plugin-scope .eap-dashboard-control-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}

.eap-plugin-scope .eap-dashboard-control-stack{
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.eap-plugin-scope .eap-dashboard-subtext{
    color: var(--eap-subtext);
    font-size: 12px;
}

.eap-plugin-scope .eap-dashboard-section--spaced{
    margin-top: 20px;
}

.eap-plugin-scope .eap-dashboard-stack{
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.eap-plugin-scope .eap-dashboard-divider{
    margin: 18px 0;
    border-color: rgba(255, 255, 255, 0.12);
}

.eap-plugin-scope .eap-dashboard-diagnostic{
    margin-top: 16px;
}

.eap-plugin-scope .eap-conv-telemetry-panel{
    padding: 15px;
    background: var(--eap-surface-2);
    border: 1px solid var(--eap-border);
    border-radius: 12px;
    margin-bottom: 12px;
}

.eap-plugin-scope .eap-conv-action-row{
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.eap-plugin-scope .eap-conv-table-shell{
    background: var(--eap-surface-2);
    border: 1px solid var(--eap-border);
    border-radius: 12px;
    overflow: hidden;
}

.eap-plugin-scope .eap-conv-inline-note{
    margin: 0;
    font-size: 11px;
    color: var(--eap-text-muted);
}

.eap-plugin-scope .eap-conv-status-note{
    margin: 0;
    font-size: 12px;
    color: var(--eap-text-muted);
}

.eap-plugin-scope .eap-debug-panel{
    margin-top: 24px;
    padding: 16px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    background: #f8fafc;
}

.eap-plugin-scope .eap-debug-row{
    margin: 4px 0;
}

.eap-plugin-scope .eap-debug-list{
    margin: 8px 0 0;
}

.eap-plugin-scope .eap-widget-stack{
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
}

.eap-plugin-scope .eap-widget-note{
    font-size: 11px;
    color: var(--eap-text-muted);
    margin: 0;
}

.eap-plugin-scope .eap-widget-history{
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.eap-plugin-scope .eap-widget-history-item{
    border: 1px solid var(--eap-border);
    border-radius: 6px;
    padding: 10px 12px;
}

.eap-plugin-scope .eap-widget-history-head{
    justify-content: space-between;
    margin-bottom: 4px;
}

.eap-plugin-scope .eap-widget-status-label{
    text-transform: uppercase;
}

.eap-plugin-scope .eap-widget-status-label--new{
    color: #f59e0b;
}

.eap-plugin-scope .eap-widget-status-label--acknowledged{
    color: #3b82f6;
}

.eap-plugin-scope .eap-widget-status-label--answered{
    color: #22c55e;
}

.eap-plugin-scope .eap-widget-status-label--closed{
    color: #9ca3af;
}

.eap-plugin-scope .eap-widget-scorecard{
    margin-bottom: 12px;
    padding: 10px 12px;
    border-radius: 6px;
}

.eap-plugin-scope .eap-widget-scorecard--success{
    background: var(--eap-surface-alt, #f0fdf4);
    border-left: 3px solid #22c55e;
}

.eap-plugin-scope .eap-widget-scorecard--info{
    background: var(--eap-surface-alt, #eff6ff);
    border-left: 3px solid #3b82f6;
}

.eap-plugin-scope .eap-widget-readable{
    line-height: 1.6;
}

.eap-plugin-scope .eap-empty-state--spaced{
    margin-bottom: 12px;
}

.eap-plugin-scope .eap-widget-feedback{
    display: none;
    margin-top: 6px;
}

.eap-plugin-scope .eap-widget-feedback--explanation{
    margin-top: 4px;
}

.eap-plugin-scope .eap-widget-quiz-item{
    border: 1px solid var(--eap-border);
    border-radius: 6px;
    padding: 10px 12px;
    margin-bottom: 8px;
}

.eap-plugin-scope .eap-widget-quiz-options label{
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
    cursor: pointer;
    font-size: 13px;
}

.eap-plugin-scope .eap-livehub-meta-grid{
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 24px;
    padding: 15px;
    background: #fbfdff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}

.eap-plugin-scope .eap-livehub-meta-item{
    flex: 1;
    min-width: 150px;
}

.eap-plugin-scope .eap-livehub-meta-item--wide{
    min-width: 180px;
}

.eap-plugin-scope .eap-livehub-action-row{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.eap-plugin-scope .eap-livehub-empty-state{
    text-align: center;
    max-width: 500px;
    padding: 40px;
}

.eap-plugin-scope .eap-livehub-alert{
    margin: 0 0 18px;
    padding: 12px 14px;
    border: 1px solid #dbe5f0;
    border-radius: 10px;
    background: #f8fafc;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

/* ─── 20. Progress bar ───────────────────────────────────────────── */
.eap-plugin-scope .eap-progress,
.eap-plugin-scope .pa-progress{
    width: 100%;
    height: 6px;
    background: var(--pa-surface-soft);
    border-radius: 9999px;
    overflow: hidden;
}
.eap-plugin-scope .eap-progress-bar,
.eap-plugin-scope .pa-progress-bar{
    height: 100%;
    background: var(--pa-primary);
    border-radius: 9999px;
    transition: width 0.3s ease;
}

/* ─── 21. Page hero (dashboard top area) ─────────────────────────── */
.eap-plugin-scope .eap-page-hero{
    background: radial-gradient(circle at top right, rgba(59,130,246,0.06), transparent);
    border-bottom: 1px solid var(--pa-border);
    padding: 20px 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    box-sizing: border-box;
}
.eap-plugin-scope .eap-page-hero h1{
    font-size: 22px;
    font-weight: 800;
    color: var(--pa-text);
    margin: 0;
    letter-spacing: -0.02em;
}
.eap-plugin-scope .eap-page-hero p{
    font-size: 13px;
    color: var(--pa-muted);
    margin: 4px 0 0;
}

/* Shared portal shell/layout primitives moved from runtime inline injection */
.eap-plugin-scope .eap-viewport-shell{
    position: relative;
    width: 100%;
    max-width: 100%;
    height: auto;
    overflow-x: hidden;
    box-sizing: border-box;
    margin: 0 !important;
    padding: 0;
    background: #f8fbff;
    color: #0f172a;
    font-family: "Inter", system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
}

.eap-plugin-scope .wp-admin .eap-viewport-shell{
    position: relative;
    height: auto;
    min-height: calc(100vh - 32px);
    overflow: visible;
}

.eap-plugin-scope .eap-join-status{
    margin-bottom: 16px;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #0f172a;
}

.eap-plugin-scope .eap-join-status--pending{
    border-left: 4px solid #f59e0b;
}

.eap-plugin-scope .eap-join-status--rejected{
    border-left: 4px solid #dc2626;
}

.eap-plugin-scope .eap-join-status p{
    margin: 8px 0 0;
    color: #64748b;
}

.eap-plugin-scope .eap-join-status strong{
    color: #0f172a;
    font-weight: 700;
}

/* Portal template fallback states */
.eap-plugin-scope .eap-portal-fallback{
    max-width: 780px;
    margin: 40px auto;
    padding: 24px;
    border-radius: 12px;
    font: 14px/1.5 system-ui, sans-serif;
}

.eap-plugin-scope .eap-portal-fallback__title{
    display: block;
    margin-bottom: 8px;
}

.eap-plugin-scope .eap-portal-fallback__message{
    margin: 0;
}

.eap-plugin-scope .eap-portal-fallback--error{
    border: 1px solid #fecaca;
    background: #fff1f2;
    color: #7f1d1d;
}

.eap-plugin-scope .eap-portal-fallback--neutral{
    border: 1px solid #cbd5e1;
    background: #f8fafc;
    color: #334155;
}

.eap-plugin-scope .eap-layout-fullbleed:not(.eap-layout-fullbleed){
    background: #f8fbff;
}

.eap-plugin-scope .eap-layout-fullbleed:not(.eap-layout-fullbleed) #page{
    width: 100%;
    max-width: 100%;
}

.eap-plugin-scope .eap-layout-fullbleed:not(.eap-layout-fullbleed) .eap-viewport-shell{
    position: relative;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

/* ─── 22. Unified Premium Shell Layout & Glassmorphism overrides ───────────────── */
.eap-plugin-scope .eap-portal-shell .eap-shell-inner{
    display: flex;
    flex-direction: row;
    flex: 1;
    width: 100%;
    min-height: 100vh;
    box-sizing: border-box;
    gap: 20px;
    padding: 20px;
    background: var(--pa-bg);
}

.eap-plugin-scope .eap-portal-shell .eap-sidebar{
    border-radius: 16px !important;
    border: 1px solid var(--pa-border) !important;
    box-shadow: var(--pa-shadow) !important;
    background: var(--pa-surface) !important;
    overflow: hidden;
}

.eap-plugin-scope .eap-portal-shell .eap-main{
    flex: 1;
    background: transparent !important;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
}

.eap-plugin-scope .eap-portal-shell .eap-topbar{
    border: 1px solid var(--pa-border) !important;
    border-radius: 16px !important;
    box-shadow: var(--pa-shadow) !important;
    background: var(--pa-surface) !important;
    padding: 18px 24px !important;
    height: auto !important;
    min-height: 60px;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px;
}

.eap-plugin-scope .eap-portal-shell .eap-content{
    border-radius: 16px !important;
    border: 1px solid var(--pa-border) !important;
    background: var(--pa-surface) !important;
    box-shadow: var(--pa-shadow) !important;
    padding: 24px !important;
    box-sizing: border-box;
    width: 100%;
}

/* ─── 23. Operational & scoped Institution Admin Dashboard Styles ───────────── */
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"]{
    --eap-inst-bg: var(--pa-bg);
    --eap-inst-surface: var(--pa-surface);
    --eap-inst-surface-soft: var(--pa-surface-soft);
    --eap-inst-sidebar: var(--pa-surface);
    --eap-inst-sidebar-dark: var(--pa-surface-soft);
    --eap-inst-text: var(--pa-text);
    --eap-inst-subtext: var(--pa-muted);
    --eap-inst-border: var(--pa-border);
    --eap-inst-primary: var(--pa-primary);
    --eap-inst-success: var(--pa-success);
    --eap-inst-warning: var(--pa-warning);
    --eap-inst-danger: var(--pa-danger);
    --eap-inst-radius: var(--pa-radius);
    --eap-inst-shadow-sm: var(--pa-shadow);
    --eap-inst-shadow-md: var(--pa-shadow-md);
    --eap-inst-space-1: 8px;
    --eap-inst-space-2: 12px;
    --eap-inst-space-3: 16px;
    --eap-inst-space-4: 20px;
    --eap-inst-space-5: 24px;
    --eap-inst-fs-1: 12px;
    --eap-inst-fs-2: 13px;
    --eap-inst-fs-3: 14px;
    --eap-inst-fs-4: 16px;
    --eap-inst-fs-5: 20px;
}

/* Override institution admin specific colors for unified theme */
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-nav-link{
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 42px;
    padding: 10px 14px !important;
    color: var(--pa-muted) !important;
    border-radius: var(--pa-radius-sm) !important;
    font-weight: 500 !important;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-nav-link:hover{
    background: var(--pa-surface-soft) !important;
    color: var(--pa-text) !important;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-nav-link.active{
    background: rgba(59, 130, 246, 0.08) !important;
    color: var(--pa-primary) !important;
    font-weight: 700 !important;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-sidebar-user{
    background: var(--pa-surface-soft) !important;
    border: 1px solid var(--pa-border) !important;
    color: var(--pa-text) !important;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-sidebar-logout{
    color: var(--pa-muted) !important;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-sidebar-logout:hover{
    color: var(--pa-danger) !important;
    background: rgba(220, 38, 38, 0.06) !important;
}

/* Operational grid & card styles */
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid{
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
    gap: 20px !important;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-card{
    grid-column: auto !important;
    min-width: 0;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-col-12,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-inst-module-card{
    grid-column: 1 / -1 !important;
}

/* Embedded admin panels inside dashboard cards */
.eap-plugin-scope .eap-portal-shell .eap-inst-module-frame{
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 700px;
    flex: 1;
}

.eap-plugin-scope .eap-portal-shell .eap-inst-iframe{
    width: 100%;
    height: 100%;
    min-height: 700px;
    border: none;
    flex: 1;
    display: block;
    background: var(--pa-surface);
}

.eap-plugin-scope .eap-portal-shell .eap-inst-module-card .eap-card-body{
    padding: 0;
    overflow: hidden;
}

@media (max-width: 768px) {
    .eap-plugin-scope .eap-portal-shell .eap-inst-module-frame,
.eap-plugin-scope .eap-portal-shell .eap-inst-iframe{
        min-height: 560px;
    }
}

/* Table styling inside dashboard modules */
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-table-scroll,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-table-wrap,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-table-wrap,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-table-wrap{
    border: 1px solid var(--pa-border) !important;
    border-radius: 12px !important;
    background: var(--pa-surface) !important;
    overflow-x: auto;
    box-shadow: var(--pa-shadow) !important;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-table,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-table,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-table,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-table{
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 !important;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-table thead th,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-table thead th,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-table thead th,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-table thead th{
    background: var(--pa-surface-soft) !important;
    color: var(--pa-muted) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    padding: 12px 16px !important;
    border-bottom: 2px solid var(--pa-border) !important;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-table td,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-table td,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-table td,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-table td{
    padding: 14px 16px !important;
    border-bottom: 1px solid var(--pa-border) !important;
    background: var(--pa-surface) !important;
    color: var(--pa-text) !important;
    font-size: 13px !important;
    vertical-align: middle !important;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-table tbody tr:hover td,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-table tbody tr:hover td,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-table tbody tr:hover td{
    background: var(--pa-surface-soft) !important;
}

/* Sub-headings, kickers and titles */
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-module__header,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-module__header,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-module__header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--pa-border);
    border-radius: 12px;
    background: linear-gradient(180deg, var(--pa-surface) 0%, var(--pa-surface-soft) 100%);
    margin-bottom: 16px;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-module__title,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-module__title,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-module__title{
    margin: 0;
    font-size: 15px;
    font-weight: 800;
    color: var(--pa-text);
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-module__subtitle,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-module__subtitle,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-module__subtitle{
    margin: 4px 0 0;
    font-size: 12px;
    color: var(--pa-muted);
    line-height: 1.4;
}

/* KPI count badges */
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-kpi,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-kpi,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-kpi{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    padding: 8px 12px;
    border: 1px solid var(--pa-border);
    border-radius: 8px;
    background: var(--pa-surface);
    min-width: 100px;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-kpi span,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-kpi span,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-kpi span{
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--pa-muted);
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-kpi strong,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-kpi strong,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-kpi strong{
    font-size: 20px;
    font-weight: 800;
    color: var(--pa-text);
    line-height: 1.1;
}

/* operational forms */
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-actions,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-perm-actions{
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 14px;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-inline-form{
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* empty operational states */
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-empty,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-empty,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-empty{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px 16px !important;
    background: var(--pa-surface-soft) !important;
    border-radius: 12px;
    text-align: center;
    color: var(--pa-muted);
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-empty .dashicons,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-empty .dashicons,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-empty .dashicons{
    font-size: 32px;
    width: 32px;
    height: 32px;
    margin-bottom: 12px;
    color: var(--pa-border);
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-empty strong,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-empty strong,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-empty strong{
    font-size: 14px;
    color: var(--pa-text);
    margin-bottom: 4px;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-staff-empty p,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-students-empty p,
.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"] .eap-inst-join-empty p{
    font-size: 12px;
    color: var(--pa-muted);
    max-width: 320px;
    margin: 0;
}

/* auth and onboarding surfaces */
.eap-plugin-scope .eap-join-shell{
    background: linear-gradient(135deg, #f8fbff 0%, #edf4fe 100%);
    min-height: 100vh;
    padding: 60px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.eap-plugin-scope .eap-join-status-card{
    width: 100%;
    max-width: 500px;
    background: #fff;
    padding: 2.5rem;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}

.eap-plugin-scope .eap-join-status-card--left{ text-align: left; }
.eap-plugin-scope .eap-join-status-card--center{ text-align: center; }

.eap-plugin-scope .eap-join-status-title{
    font-size: 22px;
    font-weight: 800;
    color: #0f172a;
    margin-top: 0;
    margin-bottom: 12px;
}

.eap-plugin-scope .eap-join-status-text{
    font-size: 14px;
    color: #64748b;
    margin-bottom: 0;
    line-height: 1.5;
}

.eap-plugin-scope .eap-admin-diagnostic-card{
    background: #fff;
    padding: 24px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    max-width: 600px;
    margin: 40px auto;
    color: #333;
    font-family: sans-serif;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

.eap-plugin-scope .eap-admin-diagnostic-title{
    color: #e11d48;
    margin-top: 0;
}

.eap-plugin-scope .eap-admin-diagnostic-list{
    background: #f8fafc;
    padding: 16px 32px;
    border-radius: 8px;
}

.eap-plugin-scope .eap-login-root.eap-auth-shell{
    width: min(1180px, calc(100vw - 40px));
    margin: 28px auto 52px !important;
    padding: 0 !important;
    background:
        radial-gradient(circle at 18% 12%, rgba(77, 124, 254, 0.12), transparent 30%),
        linear-gradient(180deg, #f7fbff 0%, #ffffff 72%) !important;
    border: 1px solid #e3ebf7 !important;
    border-radius: 8px !important;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.08) !important;
    overflow: hidden;
}

.eap-plugin-scope .eap-login-root .eap-auth-inner{
    max-width: none !important;
    margin: 0 !important;
    padding: 34px;
    display: flex;
    flex-direction: column;
    gap: 26px;
}

.eap-plugin-scope .eap-login-root .eap-auth-grid{
    display: grid !important;
    grid-template-columns: minmax(0, 1.06fr) minmax(360px, 0.94fr) !important;
    gap: 28px !important;
    align-items: stretch !important;
    text-align: left !important;
}

.eap-plugin-scope .eap-login-root .eap-auth-hero{
    min-height: 486px;
    padding: 44px;
    border-radius: 8px;
    background:
        radial-gradient(circle at 78% 18%, rgba(96, 165, 250, 0.38), transparent 28%),
        radial-gradient(circle at 18% 82%, rgba(45, 212, 191, 0.24), transparent 34%),
        linear-gradient(145deg, #0f172a, #1e40af 58%, #1d4ed8);
    background-size: cover;
    background-position: center;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.eap-plugin-scope .eap-login-root .eap-auth-kicker{
    width: fit-content;
    margin: 0 0 18px;
    padding: 7px 11px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.13);
    color: #dbeafe;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.eap-plugin-scope .eap-login-root .eap-auth-hero-title{
    max-width: 610px;
    margin: 0 0 16px !important;
    color: #fff !important;
    font-size: 44px;
    line-height: 1.08;
    font-weight: 900;
}

.eap-plugin-scope .eap-login-root .eap-auth-hero-copy{
    max-width: 560px;
    margin: 0 0 24px !important;
    color: #e5edf9 !important;
    font-size: 16px;
    line-height: 1.65;
}

.eap-plugin-scope .eap-login-root .eap-auth-hero-points{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 26px;
}

.eap-plugin-scope .eap-login-root .eap-auth-hero-points span{
    padding: 8px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
}

.eap-plugin-scope .eap-login-root .eap-auth-hero-actions{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.eap-plugin-scope .eap-login-root .eap-auth-hero-btn{
    min-height: 42px;
    padding: 11px 18px !important;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none !important;
}

.eap-plugin-scope .eap-login-root .eap-auth-card{
    padding: 34px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    border: 1px solid #dce7f4 !important;
    border-radius: 8px !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.10) !important;
}

.eap-plugin-scope .eap-auth-card--signup{ max-width: 480px; margin: auto; }
.eap-plugin-scope .eap-login-root .eap-auth-card--login{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.eap-plugin-scope .eap-auth-head,
.eap-plugin-scope .eap-login-root .eap-auth-login-head{ margin-bottom: 22px; text-align: left; }
.eap-plugin-scope .eap-login-root .eap-auth-title{ font-size: 28px; font-weight: 900; color: #0f172a; margin: 0 0 8px; }
.eap-plugin-scope .eap-login-root .eap-auth-subtitle{ font-size: 14px; color: #64748b; margin: 0; }

.eap-plugin-scope .eap-login-root .eap-auth-form{ display: grid; gap: 15px; }
.eap-plugin-scope .eap-login-root .eap-auth-login-form{ width: 100%; }
.eap-plugin-scope .eap-login-root .eap-auth-label{ font-size: 13px; font-weight: 800; color: #1e293b; margin-bottom: 7px; display: block; }
.eap-plugin-scope .eap-login-root .eap-auth-input{
    width: 100%;
    min-height: 46px;
    padding: 12px 13px;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: #0f172a;
    font-size: 15px;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.eap-plugin-scope .eap-login-root .eap-auth-input:focus{
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.14) !important;
    outline: none;
}

.eap-plugin-scope .eap-login-root .eap-auth-row{ display: flex; justify-content: space-between; align-items: center; gap: 14px; font-size: 13px; }
.eap-plugin-scope .eap-login-root .eap-auth-checkbox{ display: flex; align-items: center; gap: 7px; color: #475569; font-weight: 700; white-space: nowrap; }
.eap-plugin-scope .eap-login-root .eap-auth-link{ color: #2563eb; text-decoration: none; font-weight: 800; }
.eap-plugin-scope .eap-login-root .eap-auth-link:hover{ text-decoration: underline; }
.eap-plugin-scope .eap-auth-link--strong{ font-weight: 800; }
.eap-plugin-scope .eap-auth-link--success{ color: #059669; font-weight: 800; }
.eap-plugin-scope .eap-auth-link--spaced{ margin: 0 8px; }

.eap-plugin-scope .eap-login-root .eap-auth-submit{
    width: 100%;
    min-height: 48px;
    margin-top: 4px;
    padding: 13px !important;
    font-size: 14px;
    font-weight: 900;
    border-radius: 8px !important;
}
.eap-plugin-scope .eap-login-root .eap-auth-secondary-link{
    min-height: 44px;
    padding: 12px !important;
    font-size: 13px;
    font-weight: 800;
    text-align: center;
    border-radius: 8px !important;
    text-decoration: none !important;
}
.eap-plugin-scope .eap-auth-footer-note{ margin-top: 20px; }

.eap-plugin-scope .eap-auth-alert{
    background-color: #fef2f2;
    border: 1px solid #fee2e2;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
}

.eap-plugin-scope .eap-auth-alert-icon{ color: #ef4444; font-size: 18px; font-weight: 700; }
.eap-plugin-scope .eap-auth-alert-text{ color: #991b1b; font-size: 13px; font-weight: 500; line-height: 1.4; }

.eap-plugin-scope .eap-login-root .eap-auth-need-access{
    margin-top: 24px;
    text-align: left;
    border-top: 1px solid #e2e8f0;
    padding-top: 16px;
    font-size: 13px;
    color: #64748b;
}

.eap-plugin-scope .eap-login-root .eap-auth-role-section{
    text-align: left;
    margin-top: 4px;
    padding: 24px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
}
.eap-plugin-scope .eap-login-root .eap-auth-role-title{ font-size: 22px; font-weight: 900; color: #0f172a; margin: 0 0 8px; }
.eap-plugin-scope .eap-login-root .eap-auth-role-subtitle{ font-size: 14px; color: #64748b; margin: 0 0 20px; max-width: none; }
.eap-plugin-scope .eap-login-root .eap-auth-role-grid{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }

.eap-plugin-scope .eap-login-root .eap-auth-role-card{
    min-height: 188px;
    padding: 18px !important;
    background: #f8fbff !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid #dce7f4 !important;
    text-align: left;
}

.eap-plugin-scope .eap-login-root .eap-auth-role-icon{
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    margin-bottom: 13px;
    border-radius: 8px;
    color: #fff;
    font-size: 14px;
    font-weight: 900;
}
.eap-plugin-scope .eap-auth-role-icon--student{ background: #3b82f6; }
.eap-plugin-scope .eap-auth-role-icon--teacher{ background: #10b981; }
.eap-plugin-scope .eap-auth-role-icon--institute{ background: #4f46e5; }
.eap-plugin-scope .eap-login-root .eap-auth-role-card-title{ font-size: 16px; font-weight: 900; color: #0f172a; margin: 0 0 8px; }
.eap-plugin-scope .eap-login-root .eap-auth-role-card-copy{ font-size: 13px; color: #475569; line-height: 1.5; margin: 0 0 16px; }
.eap-plugin-scope .eap-login-root .eap-auth-role-cta{ width: 100%; padding: 10px 14px !important; font-size: 13px; font-weight: 800; border-radius: 8px !important; text-decoration: none !important; }
.eap-plugin-scope .eap-auth-role-cta--institute{ background-color: #4f46e5 !important; }

.eap-plugin-scope .eap-login-root .eap-auth-trust{
    text-align: left;
    margin-top: 0;
    border-top: 0;
    padding: 22px 24px;
    border-radius: 8px;
    background: #f8fbff;
    border: 1px solid #e2e8f0;
}
.eap-plugin-scope .eap-login-root .eap-auth-trust-title{ font-size: 13px; font-weight: 900; color: #334155; text-transform: uppercase; margin: 0 0 16px; }
.eap-plugin-scope .eap-login-root .eap-auth-trust-grid{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 18px; }
.eap-plugin-scope .eap-login-root .eap-auth-trust-item{ display: flex; align-items: center; gap: 8px; min-width: 0; }
.eap-plugin-scope .eap-login-root .eap-auth-trust-check{ font-size: 16px; font-weight: 900; }
.eap-plugin-scope .eap-auth-trust-check--blue{ color: #3b82f6; }
.eap-plugin-scope .eap-auth-trust-check--green{ color: #10b981; }
.eap-plugin-scope .eap-auth-trust-check--orange{ color: #f97316; }
.eap-plugin-scope .eap-login-root .eap-auth-trust-label{ font-size: 13px; font-weight: 800; color: #0f172a; }

.eap-plugin-scope .eap-login-root .eap-auth-badge-row{ display: flex; justify-content: flex-start; gap: 8px; flex-wrap: wrap; }
.eap-plugin-scope .eap-login-root .eap-auth-badge{ padding: 6px 10px; font-size: 11px; border-radius: 999px; }

.eap-plugin-scope .eap-login-root .eap-auth-support{ text-align: center; margin-top: 2px; font-size: 13px; color: #64748b; }

.eap-plugin-scope .eap-join-already-text{
    color: var(--eap-text-secondary, #475569);
}

.eap-plugin-scope .eap-join-already-inst{
    color: var(--eap-text-primary, #0f172a);
}

.eap-plugin-scope .eap-join-already-text--spaced{
    margin-top: 8px;
}

.eap-plugin-scope .eap-join-search-form{
    display: flex;
    gap: 12px;
    align-items: flex-end;
}

.eap-plugin-scope .eap-join-search-group{
    flex: 1;
}

.eap-plugin-scope .eap-join-search-submit{
    align-self: flex-end;
}

.eap-plugin-scope .eap-join-search-empty{
    color: var(--eap-text-secondary, #475569);
    margin-top: 16px;
}

.eap-plugin-scope .eap-join-search-results{
    margin-top: 20px;
}

.eap-plugin-scope .eap-join-request-form{
    display: inline;
}

.eap-plugin-scope .eap-join-how-list{
    color: var(--eap-text-secondary);
    line-height: 2;
    margin: 0;
    padding-left: 20px;
}

.eap-plugin-scope .eap-inst-link-note{
    color: var(--eap-text-secondary, #475569);
    margin: 0 0 16px;
}

.eap-plugin-scope .eap-join-status--flush{
    margin: 0;
}

.eap-plugin-scope .eap-join-status--spaced{
    margin: 0 0 16px;
}

.eap-plugin-scope .eap-live-room-wrap{
    padding: 20px;
}

.eap-plugin-scope .eap-live-room-head{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.eap-plugin-scope .eap-live-room-title{
    margin: 0;
    color: #fff;
}

.eap-plugin-scope .eap-live-room-code{
    margin: 5px 0 0;
    color: #94a3b8;
    font-size: 14px;
}

.eap-plugin-scope .eap-live-transcript{
    height: 450px;
    overflow-y: auto;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    padding: 25px;
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.eap-plugin-scope .eap-live-transcript-empty{
    color: #64748b;
    text-align: center;
    padding-top: 150px;
}

.eap-plugin-scope .eap-live-panel{
    margin-bottom: 14px;
    padding: 14px;
    border-radius: 12px;
}

.eap-plugin-scope .eap-live-panel--status{
    border: 1px solid rgba(56, 189, 248, 0.25);
    background: rgba(14, 116, 144, 0.18);
}

.eap-plugin-scope .eap-live-panel--health{
    border: 1px solid rgba(148, 163, 184, 0.25);
    background: rgba(15, 23, 42, 0.35);
}

.eap-plugin-scope .eap-live-panel-kicker{
    font-size: 11px;
    letter-spacing: 0.06em;
    color: #94a3b8;
    margin-bottom: 8px;
}

.eap-plugin-scope .eap-live-panel-row{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.eap-plugin-scope .eap-live-launch-badge{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    min-height: 22px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 10px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    font-weight: 700;
    border: 1px solid rgba(148, 163, 184, 0.4);
    color: #e2e8f0;
    background: rgba(51, 65, 85, 0.45);
}

.eap-plugin-scope .eap-live-launch-state{
    font-size: 13px;
    color: #e2e8f0;
    font-weight: 600;
}

.eap-plugin-scope .eap-live-panel-detail{
    font-size: 12px;
    color: #94a3b8;
    margin-top: 4px;
}

.eap-plugin-scope .eap-live-health-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 8px;
    font-size: 12px;
    color: #e2e8f0;
}

.eap-plugin-scope .eap-live-controls{
    padding: 20px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    gap: 12px;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.eap-plugin-scope .eap-live-control-row{
    display: flex;
    gap: 10px;
    align-items: center;
}

.eap-plugin-scope .eap-recording-indicator{
    display: none;
    align-items: center;
    gap: 6px;
    color: #ef4444;
    font-weight: 700;
    font-size: 12px;
}

.eap-plugin-scope .eap-recording-indicator-dot{
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ef4444;
}

.eap-plugin-scope .eap-live-recording-state{
    display: flex;
    flex-direction: column;
    min-width: 220px;
}

.eap-plugin-scope .eap-live-recording-kicker{
    font-size: 11px;
    color: #94a3b8;
    letter-spacing: 0.05em;
}

.eap-plugin-scope .eap-live-recording-text{
    font-size: 13px;
    color: #e2e8f0;
}

.eap-plugin-scope .eap-live-teacher-fallback{
    display: none;
    width: 100%;
}

.eap-plugin-scope .eap-live-form-row{
    display: flex;
    gap: 8px;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 100%;
}

.eap-plugin-scope .eap-live-input{
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.5);
    padding: 10px;
    background: rgba(15, 23, 42, 0.55);
    color: #fff;
}

.eap-plugin-scope .eap-live-input--single{
    min-height: 36px;
    padding: 0 10px;
}

.eap-plugin-scope .eap-live-input--id{
    width: 120px;
    min-height: 36px;
    padding: 0 10px;
}

.eap-plugin-scope .eap-live-input--textarea{
    flex: 1;
    min-width: 260px;
}

.eap-plugin-scope .eap-live-teacher-reply-wrap{
    width: 100%;
    border-top: 1px solid rgba(148, 163, 184, 0.2);
    padding-top: 10px;
}

.eap-plugin-scope .eap-live-subtle-status{
    width: 100%;
    font-size: 12px;
    color: #94a3b8;
}

.eap-plugin-scope .eap-live-student-wrap{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.eap-plugin-scope .eap-live-student-hint{
    color: #94a3b8;
    font-size: 13px;
}

.eap-plugin-scope .eap-live-microphone-icon{
    font-size: 16px;
    width: 16px;
    height: 16px;
    margin-right: 5px;
}

.eap-plugin-scope .eap-live-language-form{
    align-items: center;
}

.eap-plugin-scope .eap-live-language-label{
    font-size: 12px;
    color: #cbd5e1;
    letter-spacing: 0.03em;
}

.eap-plugin-scope .eap-live-hint{
    font-size: 11px;
    color: #94a3b8;
}

.eap-plugin-scope .eap-live-exit-link{
    color: #fff;
    border-color: rgba(255, 255, 255, 0.2);
}

.eap-plugin-scope .eap-peer-chat-panel{
    margin-top: 14px;
    padding: 16px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 12px;
    border: 1px solid rgba(148, 163, 184, 0.25);
}

.eap-plugin-scope .eap-peer-chat-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.eap-plugin-scope .eap-peer-chat-title{
    margin: 0;
    color: #e2e8f0;
    font-size: 15px;
}

.eap-plugin-scope .eap-peer-chat-unread{
    display: none;
    background: #ef4444;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    border-radius: 999px;
    padding: 1px 7px;
    margin-left: 6px;
    vertical-align: middle;
}

.eap-plugin-scope .eap-peer-chat-status{
    color: #94a3b8;
}

.eap-plugin-scope .eap-peer-chat-messages{
    max-height: 240px;
    overflow-y: auto;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid rgba(148, 163, 184, 0.2);
    background: rgba(15, 23, 42, 0.35);
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 10px;
}

.eap-plugin-scope .eap-peer-chat-empty{
    color: #94a3b8;
    font-size: 12px;
    text-align: center;
}

.eap-plugin-scope .eap-peer-chat-form{
    display: flex;
    gap: 8px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.eap-plugin-scope .eap-peer-chat-input{
    flex: 1;
    min-width: 260px;
}

.eap-plugin-scope .eap-teacher-question-list{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.eap-plugin-scope .eap-teacher-question-empty{
    color: #94a3b8;
    font-size: 13px;
}

.eap-plugin-scope .eap-teacher-question-item{
    padding: 8px;
    border: 1px solid rgba(148, 163, 184, 0.25);
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.25);
}

.eap-plugin-scope .eap-teacher-question-pick{
    all: unset;
    cursor: pointer;
    display: block;
    width: 100%;
    color: #e2e8f0;
    font-size: 13px;
}

.eap-plugin-scope .eap-teacher-question-id{
    color: #93c5fd;
}

.eap-plugin-scope .eap-live-analytics-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 14px;
    margin-top: 14px;
}

.eap-plugin-scope .eap-live-analytics-card{
    padding: 16px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 12px;
    border: 1px solid rgba(148, 163, 184, 0.25);
}

.eap-plugin-scope .eap-live-analytics-title{
    margin: 0 0 10px;
    color: #e2e8f0;
    font-size: 15px;
}

.eap-plugin-scope .eap-inst-home-kpi-grid{
    grid-template-columns: repeat(4, 1fr) !important;
}

.eap-plugin-scope .eap-pb-lg{
    padding-bottom: 24px;
}

.eap-plugin-scope .eap-license-activate-form{
    display: flex;
    gap: 8px;
    margin-top: 12px;
}

.eap-plugin-scope .eap-license-activate-input{
    width: 100%;
    max-width: 320px;
    padding: 8px 12px;
    border: 1px solid var(--eap-border);
    border-radius: var(--r-sm);
}

.eap-plugin-scope .eap-teacher-session-action-row{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.eap-plugin-scope .eap-teacher-no-action{
    color: #64748b;
    font-size: 12px;
}

.eap-plugin-scope .eap-teacher-performance--summary{
    background-color: rgba(59, 130, 246, 0.06);
}

.eap-plugin-scope .eap-teacher-performance--mcq{
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid var(--eap-border, #e5e7eb);
    border-radius: 8px;
    background: rgba(34, 197, 94, 0.06);
}

.eap-plugin-scope .eap-teacher-performance-title{
    display: block;
    margin-bottom: 4px;
}

.eap-plugin-scope .eap-teacher-performance-copy{
    margin: 0;
    font-size: 13px;
}

.eap-plugin-scope .eap-teacher-item-status{
    max-width: 160px;
}

.eap-plugin-scope .eap-teacher-student-ids{
    max-width: 220px;
}

.eap-plugin-scope .eap-alert-spaced{
    margin: 20px;
}

.eap-plugin-scope .eap-student-answer-state--answered{
    color: var(--eap-emerald);
    font-weight: 600;
}

.eap-plugin-scope .eap-student-answer-state--pending{
    color: var(--eap-amber);
}

.eap-plugin-scope .eap-student-mcq-option--stacked{
    display: block;
    margin-bottom: 6px;
}

.eap-plugin-scope .eap-student-mcq-radio{
    margin-right: 8px;
}

.eap-plugin-scope .eap-layout-diag-title{
    font-weight: 700;
    margin-bottom: 8px;
    color: #93c5fd;
}

.eap-plugin-scope .eap-layout-diag-divider{
    border: none;
    border-top: 1px solid rgba(148, 163, 184, 0.3);
    margin: 10px 0;
}

.eap-plugin-scope .eap-layout-diag-subtitle{
    font-weight: 700;
    margin-bottom: 6px;
}

.eap-plugin-scope .eap-layout-diag-line{
    white-space: normal;
}

.eap-plugin-scope .eap-inst-profile-cover{
    overflow: hidden;
}

.eap-plugin-scope .eap-inst-profile-cover-media{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.eap-plugin-scope .eap-teacher-status-badge--live,
.eap-plugin-scope .eap-teacher-status-badge--active,
.eap-plugin-scope .eap-teacher-status-badge--in-progress{
    background-color: #ef4444;
}

.eap-plugin-scope .eap-teacher-status-badge--scheduled,
.eap-plugin-scope .eap-teacher-status-badge--upcoming{
    background-color: #1d4ed8;
}

.eap-plugin-scope .eap-teacher-status-badge--completed,
.eap-plugin-scope .eap-teacher-status-badge--ended,
.eap-plugin-scope .eap-teacher-status-badge--done{
    background-color: #166534;
}

.eap-plugin-scope .eap-teacher-status-badge--cancelled,
.eap-plugin-scope .eap-teacher-status-badge--canceled{
    background-color: #475569;
}

.eap-plugin-scope .eap-teacher-status-tag--pending_approval{
    --eap-teacher-status: #7c3aed;
}

.eap-plugin-scope .eap-teacher-status-tag--new{
    --eap-teacher-status: #b45309;
}

.eap-plugin-scope .eap-teacher-status-tag--acknowledged{
    --eap-teacher-status: #1d4ed8;
}

.eap-plugin-scope .eap-teacher-status-tag--answered,
.eap-plugin-scope .eap-teacher-status-tag--completed,
.eap-plugin-scope .eap-teacher-status-tag--published{
    --eap-teacher-status: #166534;
}

.eap-plugin-scope .eap-teacher-status-tag--closed,
.eap-plugin-scope .eap-teacher-status-tag--draft,
.eap-plugin-scope .eap-teacher-status-tag--pending,
.eap-plugin-scope .eap-teacher-status-tag--uploaded,
.eap-plugin-scope .eap-teacher-status-tag--queued{
    --eap-teacher-status: #475569;
}

.eap-plugin-scope .eap-teacher-status-tag--review,
.eap-plugin-scope .eap-teacher-status-tag--processing,
.eap-plugin-scope .eap-teacher-status-tag--retrying{
    --eap-teacher-status: #b45309;
}

.eap-plugin-scope .eap-teacher-status-tag--failed,
.eap-plugin-scope .eap-teacher-status-tag--blocked,
.eap-plugin-scope .eap-teacher-status-tag--cancelled{
    --eap-teacher-status: #ef4444;
}

/* media responsive behavior */
@media (max-width: 960px) {
    .eap-plugin-scope .eap-auth-grid{ grid-template-columns: 1fr; }
    .eap-plugin-scope .eap-auth-card{ padding: 28px 20px; }
    .eap-plugin-scope .eap-auth-trust-grid{ gap: 16px; }

    .eap-plugin-scope .eap-login-root.eap-auth-shell{
        width: min(100%, calc(100vw - 24px));
        margin: 18px auto 34px !important;
    }

    .eap-plugin-scope .eap-login-root .eap-auth-inner{
        padding: 18px;
        gap: 18px;
    }

    .eap-plugin-scope .eap-login-root .eap-auth-grid{
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    .eap-plugin-scope .eap-login-root .eap-auth-hero{
        min-height: 360px;
        padding: 30px;
    }

    .eap-plugin-scope .eap-login-root .eap-auth-hero-title{
        font-size: 34px;
    }

    .eap-plugin-scope .eap-login-root .eap-auth-role-grid,
.eap-plugin-scope .eap-login-root .eap-auth-trust-grid{
        grid-template-columns: 1fr !important;
    }

    .eap-plugin-scope .eap-login-root .eap-auth-role-card{
        min-height: 0;
    }

    .eap-plugin-scope .eap-portal-shell .eap-shell-inner{
        flex-direction: column !important;
        padding: 12px !important;
        gap: 12px !important;
    }

    .eap-plugin-scope .eap-portal-shell .eap-sidebar{
        width: 100% !important;
        min-width: 0 !important;
    }

    .eap-plugin-scope .eap-portal-shell .eap-topbar{
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 16px !important;
    }

    .eap-plugin-scope .eap-portal-shell .eap-topbar-right{
        margin-left: 0 !important;
        display: flex;
        justify-content: flex-end;
    }
}

/* ===== SOURCE: pa-unified-design-system.css ===== */
/**
 * ╔══════════════════════════════════════════════════════════════════════════╗
 * ║                                                                          ║
 * ║   PERFECT APTITUDE — UNIFIED DESIGN SYSTEM  v8.0  (PRODUCTION)          ║
 * ║   ═════════════════════════════════════════════════════════════════════  ║
 * ║                                                                          ║
 * ║   Single source of truth for all dashboards, portals, and interfaces.   ║
 * ║   Consolidates 7+ competing CSS files into one coherent system.         ║
 * ║                                                                          ║
 * ║   DEPRECATES:                                                           ║
 * ║     ✗ eap-design-system.css          (v6.0, 8,278 lines)               ║
 * ║     ✗ eap-unified-design-system.css  (v7.0, incomplete)                ║
 * ║     ✗ eap-portal-shell-recovery.css  (emergency shim)                  ║
 * ║     ✗ perfect-aptitude-learning-theme.css (subsumed)                   ║
 * ║     ✗ dashboard-professional.css     (shim)                            ║
 * ║     ✗ dashboard-premium.css          (shim)                            ║
 * ║     ✗ eap-role-themes.css            (integrated)                      ║
 * ║                                                                          ║
 * ║   KEEPS (ADMIN-ONLY):                                                   ║
 * ║     • eap-admin-shim.css             (WordPress admin form overrides)   ║
 * ║                                                                          ║
 * ║   LOADING ORDER:                                                        ║
 * ║     1. Inter Font (Google Fonts)                                        ║
 * ║     2. THIS FILE (pa-unified-design-system.css)                         ║
 * ║     3. eap-admin-shim.css  (admin pages only, optional)                 ║
 * ║                                                                          ║
 * ║   SCOPING PRINCIPLES:                                                   ║
 * ║     • Frontend: body.eap-portal-template, .eap-viewport-shell           ║
 * ║     • Admin:    .eap-admin-wrap, .eap-dashboard-wrap                    ║
 * ║     • All:      Use .pa-* class namespace                               ║
 * ║     • NO:       Global :root pollution (scoped to plugin containers)    ║
 * ║                                                                          ║
 * ║   CONTRAST GUARANTEED:                                                  ║
 * ║     ✓ Text on light: WCAG AA minimum 4.5:1 ratio                        ║
 * ║     ✓ Text on dark:  WCAG AA minimum 4.5:1 ratio                        ║
 * ║     ✓ Interactive:   Minimum 3:1 ratio                                  ║
 * ║                                                                          ║
 * ╚══════════════════════════════════════════════════════════════════════════╝
 */

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 1: DESIGN TOKENS — Light Mode (Default)
   ════════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope,
.eap-plugin-scope .eap-viewport-shell,
.eap-plugin-scope .eap-admin-wrap,
.eap-plugin-scope .eap-dashboard-wrap,
.eap-plugin-scope .plugin-ui{

    /* ── Typography ─────────────────────────────────────────────────────── */
    --pa-font-primary:   "Inter", "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --pa-font-mono:      "Monaco", "Menlo", "Ubuntu Mono", monospace;
    --pa-letter-spacing: -0.3px;

    /* ── Core Color Palette (Light Mode) ─────────────────────────────── */
    /* All colors WCAG AA verified for accessibility */

    /* Neutrals */
    --pa-white:         #ffffff;
    --pa-gray-50:       #f9fafb;
    --pa-gray-100:      #f3f4f6;
    --pa-gray-150:      #f0f1f3;
    --pa-gray-200:      #e5e7eb;
    --pa-gray-300:      #d1d5db;
    --pa-gray-400:      #9ca3af;
    --pa-gray-500:      #6b7280;
    --pa-gray-600:      #4b5563;
    --pa-gray-700:      #374151;
    --pa-gray-800:      #1f2937;
    --pa-gray-900:      #111827;

    /* Primary: Blue (Brand Color) */
    --pa-blue-50:       #eff6ff;
    --pa-blue-100:      #dbeafe;
    --pa-blue-200:      #bfdbfe;
    --pa-blue-300:      #93c5fd;
    --pa-blue-400:      #60a5fa;
    --pa-blue-500:      #3b82f6;
    --pa-blue-600:      #2563eb;
    --pa-blue-700:      #1d4ed8;
    --pa-blue-800:      #1e40af;
    --pa-blue-900:      #1e3a8a;

    /* Success: Emerald */
    --pa-emerald-50:    #f0fdf4;
    --pa-emerald-100:   #dcfce7;
    --pa-emerald-200:   #bbf7d0;
    --pa-emerald-300:   #86efac;
    --pa-emerald-400:   #4ade80;
    --pa-emerald-500:   #10b981;
    --pa-emerald-600:   #059669;
    --pa-emerald-700:   #047857;
    --pa-emerald-800:   #065f46;

    /* Warning: Amber */
    --pa-amber-50:      #fffbeb;
    --pa-amber-100:     #fef3c7;
    --pa-amber-200:     #fde68a;
    --pa-amber-300:     #fcd34d;
    --pa-amber-400:     #fbbf24;
    --pa-amber-500:     #f59e0b;
    --pa-amber-600:     #d97706;
    --pa-amber-700:     #b45309;
    --pa-amber-800:     #92400e;

    /* Danger: Red/Coral */
    --pa-red-50:        #fef2f2;
    --pa-red-100:       #fee2e2;
    --pa-red-200:       #fecaca;
    --pa-red-300:       #fca5a5;
    --pa-red-400:       #f87171;
    --pa-red-500:       #ef4444;
    --pa-red-600:       #dc2626;
    --pa-red-700:       #b91c1c;
    --pa-red-800:       #991b1b;

    /* Accent: Orange */
    --pa-orange-50:     #fff7ed;
    --pa-orange-100:    #ffedd5;
    --pa-orange-200:    #fed7aa;
    --pa-orange-300:    #fdba74;
    --pa-orange-400:    #fb923c;
    --pa-orange-500:    #f97316;
    --pa-orange-600:    #ea580c;
    --pa-orange-700:    #c2410c;

    /* Semantic Aliases (Light Mode) ────────────────────────────────── */
    --pa-primary:       var(--pa-blue-500);
    --pa-primary-dark:  var(--pa-blue-700);
    --pa-primary-light: var(--pa-blue-50);
    --pa-success:       var(--pa-emerald-500);
    --pa-success-dark:  var(--pa-emerald-700);
    --pa-success-light: var(--pa-emerald-50);
    --pa-warning:       var(--pa-amber-500);
    --pa-warning-dark:  var(--pa-amber-700);
    --pa-warning-light: var(--pa-amber-50);
    --pa-danger:        var(--pa-red-500);
    --pa-danger-dark:   var(--pa-red-700);
    --pa-danger-light:  var(--pa-red-50);
    --pa-accent:        var(--pa-orange-500);
    --pa-accent-dark:   var(--pa-orange-700);

    /* Surfaces (Light Mode) ────────────────────────────────────────── */
    --pa-bg:            #f8fafc;
    --pa-bg-secondary:  #f1f5f9;
    --pa-surface:       #ffffff;
    --pa-surface-soft:  #f8fafc;
    --pa-surface-2:     #f8fafc;
    --pa-surface-3:     #f1f5f9;
    --pa-surface-hover: #f1f5f9;
    --pa-overlay:       rgba(15, 23, 42, 0.5);
    --pa-overlay-light: rgba(15, 23, 42, 0.1);

    /* Text Colors (Light Mode — WCAG AA Verified) ──────────────────── */
    --pa-text-primary:    #0f172a;    /* 15.3:1 on white     */
    --pa-text-secondary:  #475569;    /* 6.5:1 on white      */
    --pa-text-tertiary:   #64748b;    /* 4.7:1 on white      */
    --pa-text-muted:      #94a3b8;    /* 4.5:1 on white (AA) */
    --pa-text-disabled:   #cbd5e1;    /* accessible grayed   */
    --pa-text-inverse:    #ffffff;    /* for dark surfaces   */
    --pa-text-on-primary: #ffffff;    /* for colored buttons */
    --pa-text-on-success: #ffffff;
    --pa-text-on-warning: #ffffff;
    --pa-text-on-danger:  #ffffff;

    /* Borders ──────────────────────────────────────────────────────── */
    --pa-border:        rgba(226, 232, 240, 0.8);
    --pa-border-solid:  #e2e8f0;
    --pa-border-hover:  #bfdbfe;
    --pa-border-focus:  #3b82f6;
    --pa-border-error:  #dc2626;
    --pa-border-success:#10b981;

    /* Sidebar ──────────────────────────────────────────────────────── */
    --pa-sidebar-bg:              #ffffff;
    --pa-sidebar-text:            #475569;
    --pa-sidebar-text-active:     #3b82f6;   /* blue — matches website --pa-primary */
    --pa-sidebar-item-hover:      #f1f5f9;
    --pa-sidebar-item-active:     rgba(59, 130, 246, 0.08);  /* blue tint */
    --pa-sidebar-divider:         #e2e8f0;
    --pa-sidebar-width:           280px;
    --pa-sidebar-width-collapsed: 80px;

    /* Topbar ───────────────────────────────────────────────────────── */
    --pa-topbar-bg:     #ffffff;
    --pa-topbar-border: var(--pa-border-solid);
    --pa-topbar-height: 70px;

    /* Admin Bar ────────────────────────────────────────────────────── */
    --pa-adminbar-height: 0px;

    /* Cards & Containers ──────────────────────────────────────────── */
    --pa-card-bg:       var(--pa-surface);
    --pa-card-border:   #e2e8f0;
    --pa-card-radius:   16px;

    /* Border Radius Scale ──────────────────────────────────────────── */
    --pa-radius-xs:   4px;
    --pa-radius-sm:   8px;
    --pa-radius-md:   12px;
    --pa-radius-lg:   16px;
    --pa-radius-xl:   20px;
    --pa-radius-2xl:  32px;
    --pa-radius-full: 9999px;

    /* Spacing Scale (8px base) ──────────────────────────────────────── */
    --pa-space-xs:   4px;
    --pa-space-sm:   8px;
    --pa-space-md:   12px;
    --pa-space-lg:   16px;
    --pa-space-xl:   20px;
    --pa-space-2xl:  32px;
    --pa-space-3xl:  48px;
    --pa-space-4xl:  64px;

    /* Gaps (for flex/grid) ──────────────────────────────────────────── */
    --pa-gap-xs:   4px;
    --pa-gap-sm:   8px;
    --pa-gap-md:   12px;
    --pa-gap-lg:   16px;
    --pa-gap-xl:   20px;
    --pa-gap-2xl:  32px;

    /* Shadows ──────────────────────────────────────────────────────── */
    --pa-shadow-xs:      0 1px 2px rgba(15, 23, 42, 0.05);
    --pa-shadow-sm:      0 4px 6px -1px rgba(15, 23, 42, 0.05), 0 2px 4px -1px rgba(15, 23, 42, 0.03);
    --pa-shadow-md:      0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -2px rgba(15, 23, 42, 0.04);
    --pa-shadow-lg:      0 20px 25px -5px rgba(15, 23, 42, 0.1), 0 10px 10px -5px rgba(15, 23, 42, 0.04);
    --pa-shadow-xl:      0 25px 50px -12px rgba(15, 23, 42, 0.15);
    --pa-shadow-2xl:     0 40px 80px rgba(15, 23, 42, 0.2);
    --pa-shadow-inset:   inset 0 2px 4px rgba(15, 23, 42, 0.06);

    /* Glow Shadows (for highlights) ────────────────────────────────── */
    --pa-glow-blue:    0 0 20px rgba(59, 130, 246, 0.25);
    --pa-glow-emerald: 0 0 20px rgba(16, 185, 129, 0.25);
    --pa-glow-amber:   0 0 20px rgba(245, 158, 11, 0.25);
    --pa-glow-red:     0 0 20px rgba(239, 68, 68, 0.25);

    /* Gradients ────────────────────────────────────────────────────── */
    --pa-grad-primary:  linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    --pa-grad-success:  linear-gradient(135deg, #10b981 0%, #059669 100%);
    --pa-grad-warning:  linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    --pa-grad-danger:   linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    --pa-grad-accent:   linear-gradient(135deg, #f97316 0%, #ea580c 100%);
    --pa-grad-glass:    rgba(255, 255, 255, 0.7);

    /* Motion & Animation ──────────────────────────────────────────── */
    --pa-ease:          240ms cubic-bezier(0.4, 0, 0.2, 1);
    --pa-ease-bounce:   320ms cubic-bezier(0.34, 1.56, 0.64, 1);
    --pa-ease-in:       200ms cubic-bezier(0.4, 0, 1, 1);
    --pa-ease-out:      200ms cubic-bezier(0, 0, 0.2, 1);

    /* ── Role Theme Defaults (overridden by body.pa-role-*) ───────── */
    --role-primary:     var(--pa-primary);
    --role-primary-dk:  var(--pa-primary-dark);
    --role-accent:      var(--pa-accent);
    --role-bg:          var(--pa-bg);
    --role-radius:      var(--pa-radius-md);

    /* ── Backward Compatibility Aliases ────────────────────────────── */
    --eap-primary:      var(--pa-primary);
    --eap-primary-dark: var(--pa-primary-dark);
    --eap-success:      var(--pa-success);
    --eap-warning:      var(--pa-warning);
    --eap-danger:       var(--pa-danger);
    --eap-accent:       var(--pa-accent);
    --eap-bg:           var(--pa-bg);
    --eap-surface:      var(--pa-surface);
    --eap-text-primary: var(--pa-text-primary);
    --eap-border:       var(--pa-border);
    --eap-radius:       var(--pa-radius-md);
    --eap-font:         var(--pa-font-primary);
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 2: DESIGN TOKENS — Dark Mode
   ════════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope[data-pa-theme="dark"],
.eap-plugin-scope[data-eap-theme="dark"],
.eap-plugin-scope [data-pa-theme="dark"] .eap-viewport-shell,
.eap-plugin-scope [data-eap-theme="dark"] .eap-viewport-shell,
.eap-plugin-scope .dark .eap-viewport-shell{

    /* Neutrals (Dark Mode) */
    --pa-gray-50:       #0f172a;
    --pa-gray-100:      #1e293b;
    --pa-gray-150:      #293548;
    --pa-gray-200:      #334155;
    --pa-gray-300:      #475569;
    --pa-gray-400:      #64748b;
    --pa-gray-500:      #94a3b8;
    --pa-gray-600:      #cbd5e1;
    --pa-gray-700:      #e2e8f0;
    --pa-gray-800:      #f1f5f9;
    --pa-gray-900:      #f9fafb;

    /* Semantic Colors (Dark Mode — WCAG AA Verified) */
    --pa-primary:       #60a5fa;    /* Lighter blue for dark bg */
    --pa-primary-dark:  #93c5fd;
    --pa-primary-light: #1e3a8a;
    --pa-success:       #34d399;    /* Lighter emerald */
    --pa-success-dark:  #6ee7b7;
    --pa-success-light: #047857;
    --pa-warning:       #fbbf24;    /* Lighter amber */
    --pa-warning-dark:  #fcd34d;
    --pa-warning-light: #92400e;
    --pa-danger:        #f87171;    /* Lighter red */
    --pa-danger-dark:   #fca5a5;
    --pa-danger-light:  #7f1d1d;
    --pa-accent:        #fb923c;    /* Lighter orange */
    --pa-accent-dark:   #fed7aa;

    /* Surfaces (Dark Mode) */
    --pa-bg:            #0b0f1a;
    --pa-bg-secondary:  #1a1f2e;
    --pa-surface:       #161e2e;
    --pa-surface-soft:  #1f2937;
    --pa-surface-2:     #1f2937;
    --pa-surface-3:     #374151;
    --pa-surface-hover: #1f2937;
    --pa-overlay:       rgba(0, 0, 0, 0.7);
    --pa-overlay-light: rgba(0, 0, 0, 0.3);

    /* Text Colors (Dark Mode — WCAG AA Verified) */
    --pa-text-primary:    #f9fafb;    /* 15.3:1 on #161e2e  */
    --pa-text-secondary:  #d1d5db;    /* 10.5:1 on #161e2e  */
    --pa-text-tertiary:   #9ca3af;    /* 7.5:1 on #161e2e   */
    --pa-text-muted:      #6b7280;    /* 4.5:1 on #161e2e   */
    --pa-text-disabled:   #4b5563;
    --pa-text-inverse:    #0f172a;
    --pa-text-on-primary: #1e3a8a;
    --pa-text-on-success: #047857;
    --pa-text-on-warning: #92400e;
    --pa-text-on-danger:  #7f1d1d;

    /* Borders (Dark Mode) */
    --pa-border:        rgba(75, 85, 99, 0.5);
    --pa-border-solid:  #334155;
    --pa-border-hover:  #4b5563;
    --pa-border-focus:  #60a5fa;
    --pa-border-error:  #f87171;
    --pa-border-success:#34d399;

    /* Sidebar (Dark Mode) */
    --pa-sidebar-bg:       linear-gradient(180deg, #0f4cb8 0%, #0c3e96 100%);
    --pa-sidebar-item-hover: rgba(255, 255, 255, 0.15);
    --pa-sidebar-item-active: rgba(255, 255, 255, 0.25);

    /* Topbar (Dark Mode) */
    --pa-topbar-bg:     #1f2937;
    --pa-topbar-border: var(--pa-border-solid);

    /* Cards (Dark Mode) */
    --pa-card-bg:       var(--pa-surface);
    --pa-card-border:   var(--pa-border-solid);

    /* Surfaces remain same */
    --pa-surface:       #161e2e;
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 3: GLOBAL RESET & BASE STYLES
   ════════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope,
.eap-plugin-scope .eap-admin-template,
.eap-plugin-scope .eap-viewport-shell,
.eap-plugin-scope .eap-admin-wrap,
.eap-plugin-scope .eap-dashboard-wrap{
    margin: 0 !important;
    padding: 0 !important;
    font-family: var(--pa-font-primary) !important;
    background-color: var(--pa-bg) !important;
    color: var(--pa-text-primary) !important;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    box-sizing: border-box;
}

.eap-plugin-scope,
.eap-plugin-scope *,
.eap-plugin-scope::before,
.eap-plugin-scope *::before,
.eap-plugin-scope::after,
.eap-plugin-scope *::after{
    box-sizing: border-box;
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 4: MAIN DASHBOARD SHELL
   ════════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope .eap-viewport-shell{
    position: fixed !important;
    top: var(--pa-adminbar-height, 0px) !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: calc(100vh - var(--pa-adminbar-height, 0px)) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    background: var(--pa-bg) !important;
    color: var(--pa-text-primary) !important;
    z-index: 9990;
}

.eap-plugin-scope .eap-shell-inner,
.eap-plugin-scope .eap-dashboard-app-wrap{
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

/* ── Sidebar ───────────────────────────────────────────────────── */
.eap-plugin-scope .eap-sidebar{
    flex-shrink: 0;
    width: var(--pa-sidebar-width) !important;
    min-width: var(--pa-sidebar-width) !important;
    max-width: var(--pa-sidebar-width) !important;
    height: 100% !important;
    background: var(--pa-sidebar-bg) !important;
    padding: 24px 16px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
    border-right: 1px solid var(--pa-border-solid);
    overflow-y: auto;
    color: var(--pa-sidebar-text);
}

.eap-plugin-scope .eap-sidebar-collapsed{
    width: var(--pa-sidebar-width-collapsed) !important;
    min-width: var(--pa-sidebar-width-collapsed) !important;
    max-width: var(--pa-sidebar-width-collapsed) !important;
    padding: 16px 8px !important;
}

.eap-plugin-scope .eap-sidebar-logo{
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 8px;
    margin-bottom: 8px;
}

.eap-plugin-scope .eap-logo-mark{
    width: 40px;
    height: 40px;
    background: var(--pa-grad-primary);
    border-radius: var(--pa-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 16px rgba(59, 130, 246, 0.3);
    flex-shrink: 0;
}

.eap-plugin-scope .eap-logo-name{
    display: block;
    font-size: 18px;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: var(--pa-letter-spacing);
}

.eap-plugin-scope .eap-logo-sub{
    display: block;
    font-size: 9px;
    font-weight: 600;
    color: var(--pa-sidebar-text);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-top: 2px;
}

.eap-plugin-scope .eap-sidebar-nav{
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.eap-plugin-scope .eap-nav-item{
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: var(--pa-radius-sm);
    color: var(--pa-sidebar-text);
    text-decoration: none;
    transition: all var(--pa-ease);
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
}

.eap-plugin-scope .eap-nav-item:hover{
    background: var(--pa-sidebar-item-hover);
    color: var(--pa-sidebar-text-active);
}

.eap-plugin-scope .eap-nav-item.active,
.eap-plugin-scope .eap-nav-item[aria-current="page"]{
    background: var(--pa-sidebar-item-active);
    color: var(--pa-sidebar-text-active);
    font-weight: 600;
}

.eap-plugin-scope .eap-sidebar-collapsed .eap-logo-name,
.eap-plugin-scope .eap-sidebar-collapsed .eap-logo-sub{
    display: none;
}

/* ── Topbar ────────────────────────────────────────────────────── */
.eap-plugin-scope .eap-topbar{
    flex-shrink: 0;
    height: var(--pa-topbar-height) !important;
    background: var(--pa-topbar-bg) !important;
    border-bottom: 1px solid var(--pa-topbar-border) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 var(--pa-space-xl) !important;
    gap: var(--pa-gap-lg);
    box-shadow: var(--pa-shadow-sm);
}

.eap-plugin-scope .eap-topbar h1,
.eap-plugin-scope .eap-page-title{
    color: var(--pa-text-primary);
    font-size: 22px;
    font-weight: 700;
    margin: 0;
    letter-spacing: var(--pa-letter-spacing);
}

/* ── Main Content Area ─────────────────────────────────────────── */
.eap-plugin-scope .eap-main{
    flex: 1;
    background: var(--pa-bg) !important;
    padding: var(--pa-space-2xl) !important;
    overflow-y: auto !important;
    min-width: 0 !important;
}

.eap-plugin-scope .eap-main > div{
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 5: CARDS & CONTAINERS
   ════════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope .eap-card,
.eap-plugin-scope .pa-card{
    background: var(--pa-card-bg) !important;
    border: 1px solid var(--pa-card-border) !important;
    border-radius: var(--pa-card-radius) !important;
    padding: var(--pa-space-xl) !important;
    box-shadow: var(--pa-shadow-sm) !important;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all var(--pa-ease);
    color: var(--pa-text-primary);
}

.eap-plugin-scope .eap-card:hover,
.eap-plugin-scope .pa-card:hover{
    border-color: var(--pa-border-hover);
    box-shadow: var(--pa-shadow-md);
    transform: translateY(-2px);
}

.eap-plugin-scope .eap-card-header,
.eap-plugin-scope .pa-card-header{
    margin-bottom: var(--pa-space-lg);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--pa-gap-md);
}

.eap-plugin-scope .eap-card-title,
.eap-plugin-scope .pa-card-title{
    color: var(--pa-text-primary);
    font-size: 16px;
    font-weight: 700;
    margin: 0;
    letter-spacing: var(--pa-letter-spacing);
}

.eap-plugin-scope .eap-card-desc,
.eap-plugin-scope .pa-card-desc{
    color: var(--pa-text-secondary);
    font-size: 13px;
    line-height: 1.6;
    margin: 8px 0 0 0;
}

.eap-plugin-scope .eap-card-body,
.eap-plugin-scope .pa-card-body{
    flex: 1;
}

.eap-plugin-scope .eap-card-footer,
.eap-plugin-scope .pa-card-footer{
    margin-top: var(--pa-space-lg);
    display: flex;
    gap: var(--pa-gap-md);
}

/* ── Grid System ──────────────────────────────────────────────── */
.eap-plugin-scope .eap-dashboard-grid,
.eap-plugin-scope .pa-grid{
    display: grid !important;
    grid-template-columns: repeat(12, 1fr) !important;
    gap: var(--pa-gap-lg) !important;
    align-items: stretch !important;
}

.eap-plugin-scope .eap-card-col-1{ grid-column: span 1; }
.eap-plugin-scope .eap-card-col-2{ grid-column: span 2; }
.eap-plugin-scope .eap-card-col-3{ grid-column: span 3; }
.eap-plugin-scope .eap-card-col-4{ grid-column: span 4; }
.eap-plugin-scope .eap-card-col-6{ grid-column: span 6; }
.eap-plugin-scope .eap-card-col-12{ grid-column: span 12; }

@media (max-width: 1400px) {
    .eap-plugin-scope .eap-card-col-4{ grid-column: span 6; }
    .eap-plugin-scope .eap-card-col-3{ grid-column: span 6; }
}

@media (max-width: 768px) {
    .eap-plugin-scope .eap-card-col-4,
.eap-plugin-scope .eap-card-col-6,
.eap-plugin-scope .eap-card-col-3,
.eap-plugin-scope .eap-card-col-2{ grid-column: span 12; }

    .eap-plugin-scope .eap-sidebar{
        width: var(--pa-sidebar-width-collapsed) !important;
        min-width: var(--pa-sidebar-width-collapsed) !important;
        max-width: var(--pa-sidebar-width-collapsed) !important;
    }

    .eap-plugin-scope .eap-main{
        padding: var(--pa-space-lg) !important;
    }
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 6: BUTTONS & FORM ELEMENTS
   ════════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope .eap-btn,
.eap-plugin-scope .pa-button{
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    border-radius: var(--pa-radius-md);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all var(--pa-ease);
    font-family: var(--pa-font-primary);
    line-height: 1;
}

.eap-plugin-scope .eap-btn--primary,
.eap-plugin-scope .pa-button-primary{
    background: var(--pa-primary);
    color: var(--pa-text-on-primary);
    border-color: var(--pa-primary);
    box-shadow: 0 4px 6px -1px rgba(79, 70, 229, 0.1), 0 2px 4px -1px rgba(79, 70, 229, 0.06);
}

.eap-plugin-scope .eap-btn--primary:hover,
.eap-plugin-scope .pa-button-primary:hover{
    background: var(--pa-primary-dark);
    border-color: var(--pa-primary-dark);
    box-shadow: 0 10px 15px -3px rgba(79, 70, 229, 0.15), 0 4px 6px -2px rgba(79, 70, 229, 0.05);
    transform: translateY(-2px);
}

.eap-plugin-scope .eap-btn--secondary,
.eap-plugin-scope .pa-button-secondary{
    background: transparent;
    color: var(--pa-text-primary);
    border-color: var(--pa-border);
}

.eap-plugin-scope .eap-btn--secondary:hover,
.eap-plugin-scope .pa-button-secondary:hover{
    background: var(--pa-surface-hover);
    border-color: var(--pa-border-hover);
}

.eap-plugin-scope .eap-btn--danger{
    background: var(--pa-danger);
    color: var(--pa-text-on-danger);
    border-color: var(--pa-danger);
}

.eap-plugin-scope .eap-btn--danger:hover{
    background: var(--pa-danger-dark);
}

.eap-plugin-scope .eap-btn--success{
    background: var(--pa-success);
    color: var(--pa-text-on-success);
    border-color: var(--pa-success);
}

.eap-plugin-scope .eap-btn--success:hover{
    background: var(--pa-success-dark);
}

.eap-plugin-scope .eap-btn:disabled,
.eap-plugin-scope .pa-button:disabled{
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
    box-shadow: none !important;
    filter: grayscale(100%);
}

.eap-plugin-scope .eap-btn--loading{
    pointer-events: none;
    opacity: 0.8;
    position: relative;
    color: transparent !important;
}
.eap-plugin-scope .eap-btn--loading::after{
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: #ffffff;
    animation: eap-spin 1s ease-in-out infinite;
}
@keyframes eap-spin { to{ transform: rotate(360deg); } }

/* Form Elements */
.eap-plugin-scope input[type="text"],
.eap-plugin-scope input[type="email"],
.eap-plugin-scope input[type="password"],
.eap-plugin-scope input[type="number"],
.eap-plugin-scope input[type="url"],
.eap-plugin-scope select,
.eap-plugin-scope textarea{
    appearance: none;
    -webkit-appearance: none;
    padding: 12px 16px;
    border-radius: var(--pa-radius-sm);
    border: 1px solid var(--pa-border-solid);
    background: var(--pa-surface);
    color: var(--pa-text-primary);
    font-family: var(--pa-font-primary);
    font-size: 15px;
    font-weight: 500;
    transition: all var(--pa-ease);
    width: 100%;
}

.eap-plugin-scope input[type="text"]:focus,
.eap-plugin-scope input[type="email"]:focus,
.eap-plugin-scope input[type="password"]:focus,
.eap-plugin-scope input[type="number"]:focus,
.eap-plugin-scope input[type="url"]:focus,
.eap-plugin-scope select:focus,
.eap-plugin-scope textarea:focus{
    border-color: var(--pa-primary);
    outline: none;
    box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.15);
    background: var(--pa-surface);
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 7: TABLES & DATA DISPLAYS
   ════════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope table{
    width: 100%;
    border-collapse: collapse;
    color: var(--pa-text-primary);
}

.eap-plugin-scope thead{
    background: var(--pa-surface-3);
    border-bottom: 2px solid var(--pa-border);
}

.eap-plugin-scope th{
    padding: 12px 16px;
    text-align: left;
    font-weight: 700;
    font-size: 13px;
    color: var(--pa-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.eap-plugin-scope td{
    padding: 12px 16px;
    border-bottom: 1px solid var(--pa-border);
    color: var(--pa-text-secondary);
    font-size: 13px;
}

.eap-plugin-scope tbody tr:hover{
    background: var(--pa-surface-hover);
}

.eap-plugin-scope tbody tr.alternate,
.eap-plugin-scope tbody tr:nth-child(even){
    background: var(--pa-surface-soft);
}

.eap-plugin-scope tbody tr.alternate:hover,
.eap-plugin-scope tbody tr:nth-child(even):hover{
    background: var(--pa-surface-hover);
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 8: ALERTS & NOTIFICATIONS
   ════════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope .eap-alert,
.eap-plugin-scope .pa-alert{
    padding: var(--pa-space-lg);
    border-radius: var(--pa-radius-md);
    border: 1px solid;
    display: flex;
    align-items: flex-start;
    gap: var(--pa-gap-md);
    font-size: 14px;
    line-height: 1.5;
}

.eap-plugin-scope .eap-alert-success,
.eap-plugin-scope .pa-alert-success{
    background: var(--pa-success-light);
    border-color: var(--pa-success);
    color: var(--pa-success-dark);
}

.eap-plugin-scope .eap-alert-warning,
.eap-plugin-scope .pa-alert-warning{
    background: var(--pa-warning-light);
    border-color: var(--pa-warning);
    color: var(--pa-warning-dark);
}

.eap-plugin-scope .eap-alert-danger,
.eap-plugin-scope .pa-alert-danger{
    background: var(--pa-danger-light);
    border-color: var(--pa-danger);
    color: var(--pa-danger-dark);
}

.eap-plugin-scope .eap-alert-info,
.eap-plugin-scope .pa-alert-info{
    background: var(--pa-primary-light);
    border-color: var(--pa-primary);
    color: var(--pa-primary-dark);
}

.eap-plugin-scope .eap-alert-icon{
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 9: KPI & METRICS
   ════════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope .eap-metric-label,
.eap-plugin-scope .pa-metric-label{
    display: block;
    color: var(--pa-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 8px;
}

.eap-plugin-scope .eap-metric-value,
.eap-plugin-scope .pa-metric-value{
    color: var(--pa-text-primary);
    font-size: 32px;
    font-weight: 900;
    line-height: 1.1;
    font-family: var(--pa-font-primary);
    letter-spacing: -1px;
}

.eap-plugin-scope .eap-metric-change{
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    font-weight: 600;
    margin-top: 8px;
}

.eap-plugin-scope .eap-metric-change.positive{
    color: var(--pa-success);
}

.eap-plugin-scope .eap-metric-change.negative{
    color: var(--pa-danger);
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 10: ROLE-SPECIFIC THEMES
   DISTINCT VISUAL IDENTITY FOR INSTITUTION | TEACHER | STUDENT
   ════════════════════════════════════════════════════════════════════════════ */

/*
 * Each role has a unique visual identity:
 * - Sidebar gradient (deep professional colors)
 * - Topbar accent stripe (role personality)
 * - Button colors (primary actions reflect role)
 * - Card accent borders (quick visual scanning)
 * - Icon tone (consistent personality)
 * - Empty states (contextual to role)
 *
 * Design Principles:
 * ✓ Professional (Institution) → Command center feel
 * ✓ Nurturing (Teacher) → Supportive, organized
 * ✓ Engaging (Student) → Vibrant, motivating
 * ✓ All roles maintain accessibility (4.5:1 contrast)
 * ✓ No dark/childish styling (enterprise-appropriate)
 */

/* ═══════════════════════════════════════════════════════════════════════════
   INSTITUTION THEME — Professional Command Center
/* ════════════════════════════════════════════════════════════════════════════
   SECTION 13: UTILITY CLASSES
   Semantic classes to replace 530+ inline styles in PHP templates
   ════════════════════════════════════════════════════════════════════════════ */

/* SPACING: Margin Utilities */
.eap-plugin-scope .u-mt-xs{ margin-top: var(--eap-spacing-xs) !important; }
.eap-plugin-scope .u-mt-sm{ margin-top: var(--eap-spacing-sm) !important; }
.eap-plugin-scope .u-mt-md{ margin-top: var(--eap-spacing-md) !important; }
.eap-plugin-scope .u-mt-lg{ margin-top: var(--eap-spacing-lg) !important; }
.eap-plugin-scope .u-mt-xl{ margin-top: var(--eap-spacing-xl) !important; }

.eap-plugin-scope .u-mb-xs{ margin-bottom: var(--eap-spacing-xs) !important; }
.eap-plugin-scope .u-mb-sm{ margin-bottom: var(--eap-spacing-sm) !important; }
.eap-plugin-scope .u-mb-md{ margin-bottom: var(--eap-spacing-md) !important; }
.eap-plugin-scope .u-mb-lg{ margin-bottom: var(--eap-spacing-lg) !important; }
.eap-plugin-scope .u-mb-xl{ margin-bottom: var(--eap-spacing-xl) !important; }

.eap-plugin-scope .u-mx-auto{ margin-left: auto !important; margin-right: auto !important; }
.eap-plugin-scope .u-m-0{ margin: 0 !important; }

/* SPACING: Padding Utilities */
.eap-plugin-scope .u-p-xs{ padding: var(--eap-spacing-xs) !important; }
.eap-plugin-scope .u-p-sm{ padding: var(--eap-spacing-sm) !important; }
.eap-plugin-scope .u-p-md{ padding: var(--eap-spacing-md) !important; }
.eap-plugin-scope .u-p-lg{ padding: var(--eap-spacing-lg) !important; }
.eap-plugin-scope .u-p-xl{ padding: var(--eap-spacing-xl) !important; }

.eap-plugin-scope .u-px-xs{ padding-left: var(--eap-spacing-xs) !important; padding-right: var(--eap-spacing-xs) !important; }
.eap-plugin-scope .u-px-sm{ padding-left: var(--eap-spacing-sm) !important; padding-right: var(--eap-spacing-sm) !important; }
.eap-plugin-scope .u-px-md{ padding-left: var(--eap-spacing-md) !important; padding-right: var(--eap-spacing-md) !important; }
.eap-plugin-scope .u-px-lg{ padding-left: var(--eap-spacing-lg) !important; padding-right: var(--eap-spacing-lg) !important; }

.eap-plugin-scope .u-py-xs{ padding-top: var(--eap-spacing-xs) !important; padding-bottom: var(--eap-spacing-xs) !important; }
.eap-plugin-scope .u-py-sm{ padding-top: var(--eap-spacing-sm) !important; padding-bottom: var(--eap-spacing-sm) !important; }
.eap-plugin-scope .u-py-md{ padding-top: var(--eap-spacing-md) !important; padding-bottom: var(--eap-spacing-md) !important; }
.eap-plugin-scope .u-py-lg{ padding-top: var(--eap-spacing-lg) !important; padding-bottom: var(--eap-spacing-lg) !important; }

/* COLOR: Text Color Utilities */
.eap-plugin-scope .u-text-primary{ color: var(--eap-primary) !important; }
.eap-plugin-scope .u-text-secondary{ color: var(--eap-secondary) !important; }
.eap-plugin-scope .u-text-danger{ color: var(--eap-danger) !important; }
.eap-plugin-scope .u-text-success{ color: var(--eap-success) !important; }
.eap-plugin-scope .u-text-warning{ color: var(--eap-warning) !important; }
.eap-plugin-scope .u-text-info{ color: var(--eap-info) !important; }
.eap-plugin-scope .u-text-muted{ color: var(--eap-text-muted) !important; }
.eap-plugin-scope .u-text-muted-2{ color: var(--eap-text-muted-2) !important; }
.eap-plugin-scope .u-text-subtext{ color: var(--eap-subtext) !important; }
.eap-plugin-scope .u-text-disabled{ color: var(--eap-text-disabled) !important; }
.eap-plugin-scope .u-text-white{ color: #ffffff !important; }
.eap-plugin-scope .u-text-dark{ color: var(--eap-text-dark) !important; }

/* COLOR: Background Color Utilities */
.eap-plugin-scope .u-bg-primary{ background-color: var(--eap-primary) !important; }
.eap-plugin-scope .u-bg-secondary{ background-color: var(--eap-secondary) !important; }
.eap-plugin-scope .u-bg-danger{ background-color: var(--eap-danger) !important; }
.eap-plugin-scope .u-bg-success{ background-color: var(--eap-success) !important; }
.eap-plugin-scope .u-bg-warning{ background-color: var(--eap-warning) !important; }
.eap-plugin-scope .u-bg-info{ background-color: var(--eap-info) !important; }
.eap-plugin-scope .u-bg-light{ background-color: var(--eap-bg-light) !important; }
.eap-plugin-scope .u-bg-lighter{ background-color: var(--eap-bg-lighter) !important; }
.eap-plugin-scope .u-bg-white{ background-color: #ffffff !important; }
.eap-plugin-scope .u-bg-gray-100{ background-color: var(--eap-gray-100) !important; }
.eap-plugin-scope .u-bg-gray-200{ background-color: var(--eap-gray-200) !important; }

/* DISPLAY: Layout Utilities */
.eap-plugin-scope .u-flex{ display: flex !important; }
.eap-plugin-scope .u-flex-col{ display: flex !important; flex-direction: column !important; }
.eap-plugin-scope .u-flex-row{ display: flex !important; flex-direction: row !important; }
.eap-plugin-scope .u-flex-center{ display: flex !important; align-items: center !important; justify-content: center !important; }
.eap-plugin-scope .u-flex-between{ display: flex !important; justify-content: space-between !important; align-items: center !important; }
.eap-plugin-scope .u-flex-start{ display: flex !important; justify-content: flex-start !important; align-items: center !important; }
.eap-plugin-scope .u-flex-end{ display: flex !important; justify-content: flex-end !important; align-items: center !important; }
.eap-plugin-scope .u-flex-1{ flex: 1 !important; }
.eap-plugin-scope .u-flex-wrap{ flex-wrap: wrap !important; }
.eap-plugin-scope .u-flex-gap-xs{ gap: var(--eap-spacing-xs) !important; }
.eap-plugin-scope .u-flex-gap-sm{ gap: var(--eap-spacing-sm) !important; }
.eap-plugin-scope .u-flex-gap-md{ gap: var(--eap-spacing-md) !important; }
.eap-plugin-scope .u-flex-gap-lg{ gap: var(--eap-spacing-lg) !important; }

.eap-plugin-scope .u-grid{ display: grid !important; }
.eap-plugin-scope .u-grid-2{ display: grid !important; grid-template-columns: repeat(2, 1fr) !important; }
.eap-plugin-scope .u-grid-3{ display: grid !important; grid-template-columns: repeat(3, 1fr) !important; }
.eap-plugin-scope .u-grid-4{ display: grid !important; grid-template-columns: repeat(4, 1fr) !important; }

.eap-plugin-scope .u-block{ display: block !important; }
.eap-plugin-scope .u-inline-block{ display: inline-block !important; }
.eap-plugin-scope .u-inline{ display: inline !important; }
.eap-plugin-scope .u-hidden{ display: none !important; }
.eap-plugin-scope .u-visible{ display: visible !important; }

/* LAYOUT: Width & Height */
.eap-plugin-scope .u-w-full{ width: 100% !important; }
.eap-plugin-scope .u-w-auto{ width: auto !important; }
.eap-plugin-scope .u-min-w-0{ min-width: 0 !important; }
.eap-plugin-scope .u-min-w-150{ min-width: 150px !important; }
.eap-plugin-scope .u-min-w-200{ min-width: 200px !important; }

.eap-plugin-scope .u-h-full{ height: 100% !important; }
.eap-plugin-scope .u-h-auto{ height: auto !important; }

/* ALIGNMENT: Text Alignment */
.eap-plugin-scope .u-text-left{ text-align: left !important; }
.eap-plugin-scope .u-text-center{ text-align: center !important; }
.eap-plugin-scope .u-text-right{ text-align: right !important; }
.eap-plugin-scope .u-text-justify{ text-align: justify !important; }

/* ALIGNMENT: Vertical Alignment */
.eap-plugin-scope .u-align-top{ vertical-align: top !important; }
.eap-plugin-scope .u-align-middle{ vertical-align: middle !important; }
.eap-plugin-scope .u-align-bottom{ vertical-align: bottom !important; }

/* TYPOGRAPHY: Font Weight */
.eap-plugin-scope .u-font-normal{ font-weight: 400 !important; }
.eap-plugin-scope .u-font-medium{ font-weight: 500 !important; }
.eap-plugin-scope .u-font-semibold{ font-weight: 600 !important; }
.eap-plugin-scope .u-font-bold{ font-weight: 700 !important; }

/* TYPOGRAPHY: Font Size */
.eap-plugin-scope .u-text-xs{ font-size: 12px !important; line-height: 1.4 !important; }
.eap-plugin-scope .u-text-sm{ font-size: 14px !important; line-height: 1.4 !important; }
.eap-plugin-scope .u-text-base{ font-size: 16px !important; line-height: 1.5 !important; }
.eap-plugin-scope .u-text-lg{ font-size: 18px !important; line-height: 1.5 !important; }
.eap-plugin-scope .u-text-xl{ font-size: 20px !important; line-height: 1.5 !important; }

/* TYPOGRAPHY: Line Height */
.eap-plugin-scope .u-leading-tight{ line-height: 1.2 !important; }
.eap-plugin-scope .u-leading-normal{ line-height: 1.5 !important; }
.eap-plugin-scope .u-leading-relaxed{ line-height: 1.75 !important; }
.eap-plugin-scope .u-leading-loose{ line-height: 2 !important; }

/* TYPOGRAPHY: Decoration */
.eap-plugin-scope .u-underline{ text-decoration: underline !important; }
.eap-plugin-scope .u-no-underline{ text-decoration: none !important; }
.eap-plugin-scope .u-line-through{ text-decoration: line-through !important; }

/* BORDER: Border Utilities */
.eap-plugin-scope .u-border{ border: 1px solid var(--eap-border-color) !important; }
.eap-plugin-scope .u-border-top{ border-top: 1px solid var(--eap-border-color) !important; }
.eap-plugin-scope .u-border-bottom{ border-bottom: 1px solid var(--eap-border-color) !important; }
.eap-plugin-scope .u-border-left{ border-left: 1px solid var(--eap-border-color) !important; }
.eap-plugin-scope .u-border-right{ border-right: 1px solid var(--eap-border-color) !important; }

.eap-plugin-scope .u-border-light{ border: 1px solid var(--eap-border-light) !important; }
.eap-plugin-scope .u-border-top-light{ border-top: 1px solid var(--eap-border-light) !important; }
.eap-plugin-scope .u-border-bottom-light{ border-bottom: 1px solid var(--eap-border-light) !important; }

.eap-plugin-scope .u-border-primary{ border: 1px solid var(--eap-primary) !important; }
.eap-plugin-scope .u-border-danger{ border: 1px solid var(--eap-danger) !important; }
.eap-plugin-scope .u-border-success{ border: 1px solid var(--eap-success) !important; }

/* BORDER: Border Radius */
.eap-plugin-scope .u-rounded-none{ border-radius: 0 !important; }
.eap-plugin-scope .u-rounded-xs{ border-radius: var(--eap-radius-xs) !important; }
.eap-plugin-scope .u-rounded-sm{ border-radius: var(--eap-radius-sm) !important; }
.eap-plugin-scope .u-rounded-md{ border-radius: var(--eap-radius-md) !important; }
.eap-plugin-scope .u-rounded-lg{ border-radius: var(--eap-radius-lg) !important; }
.eap-plugin-scope .u-rounded-full{ border-radius: 9999px !important; }

/* SHADOW: Shadow Utilities */
.eap-plugin-scope .u-shadow-none{ box-shadow: none !important; }
.eap-plugin-scope .u-shadow-sm{ box-shadow: var(--eap-shadow-sm) !important; }
.eap-plugin-scope .u-shadow-md{ box-shadow: var(--eap-shadow-md) !important; }
.eap-plugin-scope .u-shadow-lg{ box-shadow: var(--eap-shadow-lg) !important; }
.eap-plugin-scope .u-shadow-xl{ box-shadow: var(--eap-shadow-xl) !important; }

/* OPACITY: Opacity Utilities */
.eap-plugin-scope .u-opacity-0{ opacity: 0 !important; }
.eap-plugin-scope .u-opacity-50{ opacity: 0.5 !important; }
.eap-plugin-scope .u-opacity-75{ opacity: 0.75 !important; }
.eap-plugin-scope .u-opacity-100{ opacity: 1 !important; }

/* POINTER: Cursor Utilities */
.eap-plugin-scope .u-cursor-auto{ cursor: auto !important; }
.eap-plugin-scope .u-cursor-pointer{ cursor: pointer !important; }
.eap-plugin-scope .u-cursor-default{ cursor: default !important; }
.eap-plugin-scope .u-cursor-not-allowed{ cursor: not-allowed !important; }

/* POSITION: Position Utilities */
.eap-plugin-scope .u-relative{ position: relative !important; }
.eap-plugin-scope .u-absolute{ position: absolute !important; }
.eap-plugin-scope .u-fixed{ position: fixed !important; }
.eap-plugin-scope .u-static{ position: static !important; }

/* OVERFLOW: Overflow Utilities */
.eap-plugin-scope .u-overflow-hidden{ overflow: hidden !important; }
.eap-plugin-scope .u-overflow-auto{ overflow: auto !important; }
.eap-plugin-scope .u-overflow-visible{ overflow: visible !important; }
.eap-plugin-scope .u-truncate{ overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }

/* COMMON PATTERNS: Card & Container Utilities */
.eap-plugin-scope .u-card-container{
    background-color: var(--eap-bg-white);
    border-radius: var(--eap-radius-md);
    padding: var(--eap-spacing-lg);
    box-shadow: var(--eap-shadow-md);
}

.eap-plugin-scope .u-card-header{
    padding-bottom: var(--eap-spacing-md);
    border-bottom: 1px solid var(--eap-border-light);
    margin-bottom: var(--eap-spacing-md);
}

.eap-plugin-scope .u-card-title{
    font-size: 18px;
    font-weight: 700;
    color: var(--eap-text-dark);
    margin: 0;
    padding: 0;
}

.eap-plugin-scope .u-card-subtitle{
    font-size: 14px;
    color: var(--eap-text-muted);
    margin-top: var(--eap-spacing-xs);
}

.eap-plugin-scope .u-card-body{
    padding: var(--eap-spacing-lg) 0;
}

.eap-plugin-scope .u-card-footer{
    padding-top: var(--eap-spacing-md);
    border-top: 1px solid var(--eap-border-light);
    margin-top: var(--eap-spacing-md);
}

/* COMMON PATTERNS: Row & Column Utilities */
.eap-plugin-scope .u-row{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--eap-spacing-md);
}

.eap-plugin-scope .u-col{
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 150px;
}

.eap-plugin-scope .u-col-auto{ flex: none; }
.eap-plugin-scope .u-col-full{ flex: 0 0 100%; }
.eap-plugin-scope .u-col-half{ flex: 0 0 50%; }
.eap-plugin-scope .u-col-third{ flex: 0 0 calc(33.333% - 10px); }
.eap-plugin-scope .u-col-quarter{ flex: 0 0 calc(25% - 10px); }

/* COMMON PATTERNS: Table Utilities */
.eap-plugin-scope .u-table-container{
    overflow-x: auto;
    border-radius: var(--eap-radius-md);
    box-shadow: var(--eap-shadow-sm);
}

.eap-plugin-scope .u-table{
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.eap-plugin-scope .u-table-header{
    background-color: var(--eap-bg-light);
    font-weight: 600;
    padding: var(--eap-spacing-md);
}

.eap-plugin-scope .u-table-row{
    border-bottom: 1px solid var(--eap-border-light);
    transition: background-color 0.2s ease;
}

.eap-plugin-scope .u-table-row:hover{
    background-color: var(--eap-bg-lighter);
}

.eap-plugin-scope .u-table-cell{
    padding: var(--eap-spacing-md);
}

/* COMMON PATTERNS: Badge & Label Utilities */
.eap-plugin-scope .u-badge{
    display: inline-block;
    padding: 2px 8px;
    border-radius: var(--eap-radius-full);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
}

.eap-plugin-scope .u-badge-primary{
    background-color: rgba(59, 130, 246, 0.1);
    color: var(--eap-primary);
}

.eap-plugin-scope .u-badge-success{
    background-color: rgba(16, 185, 129, 0.1);
    color: var(--eap-success);
}

.eap-plugin-scope .u-badge-danger{
    background-color: rgba(239, 68, 68, 0.1);
    color: var(--eap-danger);
}

.eap-plugin-scope .u-badge-warning{
    background-color: rgba(245, 158, 11, 0.1);
    color: var(--eap-warning);
}

.eap-plugin-scope .u-empty-state{
    text-align: center;
    padding: 64px 32px;
    color: var(--pa-text-secondary);
    background: var(--pa-surface-soft);
    border: 2px dashed var(--pa-border-solid);
    border-radius: var(--pa-radius-lg);
    margin: var(--pa-space-lg) 0;
}

.eap-plugin-scope .u-empty-state-icon{
    font-size: 56px;
    margin-bottom: var(--pa-space-md);
    opacity: 1;
    color: var(--pa-primary-light);
}

.eap-plugin-scope .u-empty-state-title{
    font-size: 20px;
    font-weight: 700;
    color: var(--pa-text-primary);
    margin-bottom: var(--pa-space-sm);
}

.eap-plugin-scope .u-empty-state-text{
    font-size: 15px;
    color: var(--pa-text-secondary);
    line-height: 1.6;
    max-width: 400px;
    margin: 0 auto;
}

/* COMMON PATTERNS: Button Containers */
.eap-plugin-scope .u-button-group{
    display: flex;
    gap: var(--eap-spacing-sm);
    flex-wrap: wrap;
}

.eap-plugin-scope .u-button-group-block{
    display: flex;
    flex-direction: column;
    gap: var(--eap-spacing-sm);
}

.eap-plugin-scope .u-button-group-center{
    display: flex;
    gap: var(--eap-spacing-sm);
    justify-content: center;
    flex-wrap: wrap;
}

/* FORM UTILITIES */
.eap-plugin-scope .u-fieldset{
    margin-top: var(--eap-spacing-md);
    padding: var(--eap-spacing-md);
    border: 1px solid var(--eap-border-light);
    border-radius: var(--eap-radius-lg);
    background-color: var(--eap-bg-lighter);
}

.eap-plugin-scope .u-fieldset-legend{
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--eap-text-subtext);
    padding: 0 6px;
}

.eap-plugin-scope .u-form-group-sm{ margin-top: var(--eap-spacing-sm); }
.eap-plugin-scope .u-form-group-md{ margin-top: var(--eap-spacing-md); }

.eap-plugin-scope .u-label-inline{
    display: inline;
    font-size: 13px;
    font-weight: 500;
    margin-left: var(--eap-spacing-xs);
}

.eap-plugin-scope .u-label-help{
    font-size: 12px;
    color: var(--eap-text-muted);
    margin: var(--eap-spacing-xs) 0 0 24px;
    line-height: 1.4;
}

.eap-plugin-scope .u-radio-group{ margin-bottom: var(--eap-spacing-sm); }

/* UTILITY: Flex end alignment for admin header */
.eap-plugin-scope .u-flex-end-col{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: var(--eap-spacing-xs);
}
/* RESPONSIVE: Mobile-First Utilities */
@media (max-width: 768px) {
    .eap-plugin-scope .u-col-half{ flex: 0 0 100%; }
    .eap-plugin-scope .u-col-third{ flex: 0 0 100%; }
    .eap-plugin-scope .u-col-quarter{ flex: 0 0 100%; }

    .eap-plugin-scope .u-grid-2{ grid-template-columns: 1fr !important; }
    .eap-plugin-scope .u-grid-3{ grid-template-columns: 1fr !important; }
    .eap-plugin-scope .u-grid-4{ grid-template-columns: 1fr !important; }

    .eap-plugin-scope .u-hide-mobile{ display: none !important; }
}

@media (max-width: 480px) {
    .eap-plugin-scope .u-flex-col-sm{ flex-direction: column !important; }
}

/* ════════════════════════════════════════════════════════════════════════════
   END SECTION 13
   ════════════════════════════════════════════════════════════════════════════ */

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 14: INSTITUTION ROLE THEME — Indigo • Navy • Gold
   Goal: Convey authority, data-driven decision making, institutional control
   ════════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope .pa-role-institution{
    --role-primary:        #4338ca;    /* Indigo 700 (brand) */
    --role-primary-dk:     #312e81;    /* Indigo 900 (darker) */
    --role-primary-light:  #e0e7ff;    /* Indigo 100 (light bg) */
    --role-accent:         #fbbf24;    /* Amber 400 (gold highlight) */
    --role-secondary:      #0ea5e9;    /* Cyan 500 (data accent) */
    --role-text-on-color:  #ffffff;    /* White text on colored backgrounds */
}

/* Sidebar: Deep indigo gradient (authority) */
.eap-plugin-scope .pa-role-institution .eap-sidebar{
    background: linear-gradient(180deg, #2c1e51 0%, #1e1b4b 100%) !important;
    box-shadow: inset -4px 0 12px rgba(0, 0, 0, 0.4);
}

/* Topbar: Professional indigo gradient with gold accent stripe */
.eap-plugin-scope .pa-role-institution .eap-topbar{
    background: linear-gradient(90deg, #312e81 0%, #2c1e51 50%, #1e1b4b 100%) !important;
    border-bottom: 4px solid #fbbf24 !important;
    box-shadow: 0 4px 12px rgba(67, 56, 202, 0.15);
}

.eap-plugin-scope .pa-role-institution .eap-topbar h1,
.eap-plugin-scope .pa-role-institution .eap-page-title{
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 800;
}

/* Primary buttons: Indigo gradient (command) */
.eap-plugin-scope .pa-role-institution .eap-btn--primary,
.eap-plugin-scope .pa-role-institution .pa-button-primary{
    background: linear-gradient(135deg, #4338ca, #3730a3) !important;
    color: var(--role-text-on-color) !important;
    border-color: #4338ca !important;
    box-shadow: 0 8px 24px rgba(67, 56, 202, 0.35) !important;
    font-weight: 600;
}

.eap-plugin-scope .pa-role-institution .eap-btn--primary:hover,
.eap-plugin-scope .pa-role-institution .pa-button-primary:hover{
    filter: brightness(1.15) !important;
    box-shadow: 0 12px 32px rgba(67, 56, 202, 0.45) !important;
    transform: translateY(-2px);
}

/* Cards: Indigo left-border accent (visual scanning) */
.eap-plugin-scope .pa-role-institution .eap-card,
.eap-plugin-scope .pa-role-institution .pa-card{
    border-left: 5px solid #4338ca !important;
    border-left-width: 5px !important;
    box-shadow: 0 2px 8px rgba(67, 56, 202, 0.08) !important;
}

.eap-plugin-scope .pa-role-institution .eap-card:hover,
.eap-plugin-scope .pa-role-institution .pa-card:hover{
    border-left-color: #fbbf24 !important;
    box-shadow: 0 8px 24px rgba(67, 56, 202, 0.12) !important;
}

/* Card headers: Bold titles with gold accent underline */
.eap-plugin-scope .pa-role-institution .eap-card-title{
    color: #312e81 !important;
    font-weight: 800 !important;
    border-bottom: 2px solid #fbbf24;
    padding-bottom: 8px;
}

/* KPI values: Indigo text (commanding presence) */
.eap-plugin-scope .pa-role-institution .eap-metric-value{
    color: #312e81 !important;
}

/* Icons: Gold tone (authority badges) */
.eap-plugin-scope .pa-role-institution .eap-card svg,
.eap-plugin-scope .pa-role-institution .eap-icon{
    color: #fbbf24;
    opacity: 0.9;
}

/* Empty states: Subdued indigo (professional absence messaging) */
.eap-plugin-scope .pa-role-institution .eap-empty-state{
    padding: 40px 20px;
    text-align: center;
    color: #64748b;
}

.eap-plugin-scope .pa-role-institution .eap-empty-state svg{
    color: #c7d2fe;
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    opacity: 0.7;
}

/* ─────────────────────────────────────────────────────────────────────── */

/* ═══════════════════════════════════════════════════════════════════════════
   TEACHER THEME — Classroom Control Center
   Emerald • Teal • Blue
   Goal: Convey support, organization, learning management, nurturing
   ═══════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope .pa-role-teacher{
    --role-primary:        #059669;    /* Emerald 700 (growth) */
    --role-primary-dk:     #065f46;    /* Emerald 800 (deeper) */
    --role-primary-light:  #d1fae5;    /* Emerald 100 (light) */
    --role-accent:         #f59e0b;    /* Amber 500 (warmth/engagement) */
    --role-secondary:      #06b6d4;    /* Cyan 500 (clarity) */
    --role-text-on-color:  #ffffff;    /* White text on colored backgrounds */
}

/* Sidebar: Warm emerald gradient (nurturing) */
.eap-plugin-scope .pa-role-teacher .eap-sidebar{
    background: linear-gradient(180deg, #1b4e3d 0%, #065f46 100%) !important;
    box-shadow: inset -4px 0 12px rgba(0, 0, 0, 0.3);
}

/* Topbar: Emerald gradient with warm amber accent (welcoming) */
.eap-plugin-scope .pa-role-teacher .eap-topbar{
    background: linear-gradient(90deg, #065f46 0%, #1b4e3d 50%, #047857 100%) !important;
    border-bottom: 4px solid #f59e0b !important;
    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.15);
}

.eap-plugin-scope .pa-role-teacher .eap-topbar h1,
.eap-plugin-scope .pa-role-teacher .eap-page-title{
    background: linear-gradient(135deg, #f59e0b 0%, #f97316 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 800;
}

/* Primary buttons: Emerald gradient (growth/progress) */
.eap-plugin-scope .pa-role-teacher .eap-btn--primary,
.eap-plugin-scope .pa-role-teacher .pa-button-primary{
    background: linear-gradient(135deg, #059669, #047857) !important;
    color: var(--role-text-on-color) !important;
    border-color: #059669 !important;
    box-shadow: 0 8px 24px rgba(5, 150, 105, 0.35) !important;
    font-weight: 600;
}

.eap-plugin-scope .pa-role-teacher .eap-btn--primary:hover,
.eap-plugin-scope .pa-role-teacher .pa-button-primary:hover{
    filter: brightness(1.15) !important;
    box-shadow: 0 12px 32px rgba(5, 150, 105, 0.45) !important;
    transform: translateY(-2px);
}

/* Cards: Emerald left-border accent (connected, supportive) */
.eap-plugin-scope .pa-role-teacher .eap-card,
.eap-plugin-scope .pa-role-teacher .pa-card{
    border-left: 5px solid #059669 !important;
    border-left-width: 5px !important;
    box-shadow: 0 2px 8px rgba(5, 150, 105, 0.08) !important;
    background: linear-gradient(135deg, rgba(255, 255, 255, 1) 0%, rgba(209, 250, 229, 0.08) 100%);
}

.eap-plugin-scope .pa-role-teacher .eap-card:hover,
.eap-plugin-scope .pa-role-teacher .pa-card:hover{
    border-left-color: #f59e0b !important;
    box-shadow: 0 8px 24px rgba(5, 150, 105, 0.12) !important;
}

/* Card headers: Warm titles with emerald accent */
.eap-plugin-scope .pa-role-teacher .eap-card-title{
    color: #065f46 !important;
    font-weight: 700 !important;
    border-bottom: 2px solid #f59e0b;
    padding-bottom: 8px;
}

/* KPI values: Emerald text (progress indicators) */
.eap-plugin-scope .pa-role-teacher .eap-metric-value{
    color: #059669 !important;
}

/* Icons: Warm orange/amber (encouraging) */
.eap-plugin-scope .pa-role-teacher .eap-card svg,
.eap-plugin-scope .pa-role-teacher .eap-icon{
    color: #f59e0b;
    opacity: 0.9;
}

/* Empty states: Soft emerald (encouraging absence messaging) */
.eap-plugin-scope .pa-role-teacher .eap-empty-state{
    padding: 40px 20px;
    text-align: center;
    color: #64748b;
}

.eap-plugin-scope .pa-role-teacher .eap-empty-state svg{
    color: #a7f3d0;
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    opacity: 0.7;
}

/* ─────────────────────────────────────────────────────────────────────── */

/* ═══════════════════════════════════════════════════════════════════════════
   STUDENT THEME — Learning Dashboard
   Bright Blue • Purple • Orange
   Goal: Convey engagement, motivation, achievement, bright future
   ═══════════════════════════════════════════════════════════════════════════ */

.eap-plugin-scope .pa-role-student{
    --role-primary:        #2563eb;    /* Blue 600 (trust, learning) */
    --role-primary-dk:     #1d4ed8;    /* Blue 700 (deeper) */
    --role-primary-light:  #dbeafe;    /* Blue 100 (light) */
    --role-accent:         #f97316;    /* Orange 500 (energy/achievement) */
    --role-secondary:      #8b5cf6;    /* Violet 500 (inspiration) */
    --role-text-on-color:  #ffffff;    /* White text on colored backgrounds */
}

/* Sidebar: Bright blue gradient (inspiring) */
.eap-plugin-scope .pa-role-student .eap-sidebar{
    background: linear-gradient(180deg, #1e3a8a 0%, #1e40af 50%, #172554 100%) !important;
    box-shadow: inset -4px 0 12px rgba(0, 0, 0, 0.3);
}

/* Topbar: Blue gradient with bright orange accent (motivating) */
.eap-plugin-scope .pa-role-student .eap-topbar{
    background: linear-gradient(90deg, #1e40af 0%, #1e3a8a 50%, #172554 100%) !important;
    border-bottom: 4px solid #f97316 !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.15);
}

.eap-plugin-scope .pa-role-student .eap-topbar h1,
.eap-plugin-scope .pa-role-student .eap-page-title{
    background: linear-gradient(135deg, #f97316 0%, #fb923c 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 800;
    letter-spacing: -0.5px;
}

/* Primary buttons: Blue to purple gradient (achievement) */
.eap-plugin-scope .pa-role-student .eap-btn--primary,
.eap-plugin-scope .pa-role-student .pa-button-primary{
    background: linear-gradient(135deg, #2563eb, #7c3aed) !important;
    color: var(--role-text-on-color) !important;
    border-color: #2563eb !important;
    box-shadow: 0 8px 24px rgba(37, 99, 235, 0.35) !important;
    font-weight: 600;
}

.eap-plugin-scope .pa-role-student .eap-btn--primary:hover,
.eap-plugin-scope .pa-role-student .pa-button-primary:hover{
    filter: brightness(1.15) !important;
    box-shadow: 0 12px 32px rgba(124, 58, 237, 0.45) !important;
    transform: translateY(-2px);
}

/* Cards: Blue-to-orange gradient accent (energetic) */
.eap-plugin-scope .pa-role-student .eap-card,
.eap-plugin-scope .pa-role-student .pa-card{
    border-left: 5px solid #2563eb !important;
    border-left-width: 5px !important;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.08) !important;
    background: linear-gradient(135deg, rgba(255, 255, 255, 1) 0%, rgba(219, 234, 254, 0.08) 100%);
}

.eap-plugin-scope .pa-role-student .eap-card:hover,
.eap-plugin-scope .pa-role-student .pa-card:hover{
    border-left-color: #f97316 !important;
    box-shadow: 0 8px 24px rgba(37, 99, 235, 0.12) !important;
}

/* Card headers: Vibrant blue titles with orange accent */
.eap-plugin-scope .pa-role-student .eap-card-title{
    color: #1d4ed8 !important;
    font-weight: 700 !important;
    border-bottom: 2px solid #f97316;
    padding-bottom: 8px;
}

/* KPI values: Bright blue (achievement emphasis) */
.eap-plugin-scope .pa-role-student .eap-metric-value{
    color: #2563eb !important;
    font-weight: 900;
}

/* Icons: Vibrant orange (achievement badges) */
.eap-plugin-scope .pa-role-student .eap-card svg,
.eap-plugin-scope .pa-role-student .eap-icon{
    color: #f97316;
    opacity: 0.95;
}

/* Empty states: Bright blue gradient (motivating absence messaging) */
.eap-plugin-scope .pa-role-student .eap-empty-state{
    padding: 40px 20px;
    text-align: center;
    color: #64748b;
}

.eap-plugin-scope .pa-role-student .eap-empty-state svg{
    color: #93c5fd;
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    opacity: 0.8;
}

/* ─────────────────────────────────────────────────────────────────────── */

/* === DARK MODE SUPPORT FOR ALL ROLES === */

/* Institution (Dark) */
.eap-plugin-scope [data-pa-theme="dark"].pa-role-institution .eap-topbar,
.eap-plugin-scope [data-eap-theme="dark"].pa-role-institution .eap-topbar,
.eap-plugin-scope .dark.pa-role-institution .eap-topbar{
    background: linear-gradient(90deg, #3730a3 0%, #3d28a5 50%, #312e81 100%) !important;
}

.eap-plugin-scope [data-pa-theme="dark"].pa-role-institution .eap-card,
.eap-plugin-scope [data-eap-theme="dark"].pa-role-institution .eap-card,
.eap-plugin-scope .dark.pa-role-institution .eap-card{
    background: linear-gradient(135deg, #1f2937 0%, rgba(67, 56, 202, 0.05) 100%);
    border-left-color: #818cf8 !important;
}

/* Teacher (Dark) */
.eap-plugin-scope [data-pa-theme="dark"].pa-role-teacher .eap-topbar,
.eap-plugin-scope [data-eap-theme="dark"].pa-role-teacher .eap-topbar,
.eap-plugin-scope .dark.pa-role-teacher .eap-topbar{
    background: linear-gradient(90deg, #047857 0%, #0d9488 50%, #1b4e3d 100%) !important;
}

.eap-plugin-scope [data-pa-theme="dark"].pa-role-teacher .eap-card,
.eap-plugin-scope [data-eap-theme="dark"].pa-role-teacher .eap-card,
.eap-plugin-scope .dark.pa-role-teacher .eap-card{
    background: linear-gradient(135deg, #1f2937 0%, rgba(5, 150, 105, 0.05) 100%);
    border-left-color: #6ee7b7 !important;
}

/* Student (Dark) */
.eap-plugin-scope [data-pa-theme="dark"].pa-role-student .eap-topbar,
.eap-plugin-scope [data-eap-theme="dark"].pa-role-student .eap-topbar,
.eap-plugin-scope .dark.pa-role-student .eap-topbar{
    background: linear-gradient(90deg, #1e40af 0%, #2563eb 50%, #1d4ed8 100%) !important;
}

.eap-plugin-scope [data-pa-theme="dark"].pa-role-student .eap-card,
.eap-plugin-scope [data-eap-theme="dark"].pa-role-student .eap-card,
.eap-plugin-scope .dark.pa-role-student .eap-card{
    background: linear-gradient(135deg, #1f2937 0%, rgba(37, 99, 235, 0.05) 100%);
    border-left-color: #60a5fa !important;
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 11: UTILITY CLASSES
   ════════════════════════════════════════════════════════════════════════════ */

/* Text Colors */
.eap-plugin-scope .text-primary{ color: var(--pa-text-primary) !important; }
.eap-plugin-scope .text-secondary{ color: var(--pa-text-secondary) !important; }
.eap-plugin-scope .text-tertiary{ color: var(--pa-text-tertiary) !important; }
.eap-plugin-scope .text-muted{ color: var(--pa-text-muted) !important; }
.eap-plugin-scope .text-danger{ color: var(--pa-danger) !important; }
.eap-plugin-scope .text-success{ color: var(--pa-success) !important; }
.eap-plugin-scope .text-warning{ color: var(--pa-warning) !important; }

/* Background Colors */
.eap-plugin-scope .bg-primary{ background-color: var(--pa-primary) !important; }
.eap-plugin-scope .bg-success{ background-color: var(--pa-success) !important; }
.eap-plugin-scope .bg-warning{ background-color: var(--pa-warning) !important; }
.eap-plugin-scope .bg-danger{ background-color: var(--pa-danger) !important; }
.eap-plugin-scope .bg-surface{ background-color: var(--pa-surface) !important; }

/* Spacing */
.eap-plugin-scope .mt-sm{ margin-top: var(--pa-space-sm) !important; }
.eap-plugin-scope .mt-md{ margin-top: var(--pa-space-md) !important; }
.eap-plugin-scope .mt-lg{ margin-top: var(--pa-space-lg) !important; }
.eap-plugin-scope .mt-xl{ margin-top: var(--pa-space-xl) !important; }

.eap-plugin-scope .mb-sm{ margin-bottom: var(--pa-space-sm) !important; }
.eap-plugin-scope .mb-md{ margin-bottom: var(--pa-space-md) !important; }
.eap-plugin-scope .mb-lg{ margin-bottom: var(--pa-space-lg) !important; }
.eap-plugin-scope .mb-xl{ margin-bottom: var(--pa-space-xl) !important; }

.eap-plugin-scope .p-md{ padding: var(--pa-space-md) !important; }
.eap-plugin-scope .p-lg{ padding: var(--pa-space-lg) !important; }
.eap-plugin-scope .p-xl{ padding: var(--pa-space-xl) !important; }

/* Sizing */
.eap-plugin-scope .w-full{ width: 100% !important; }
.eap-plugin-scope .h-full{ height: 100% !important; }

/* Display */
.eap-plugin-scope .flex{ display: flex !important; }
.eap-plugin-scope .flex-col{ flex-direction: column !important; }
.eap-plugin-scope .flex-row{ flex-direction: row !important; }
.eap-plugin-scope .gap-md{ gap: var(--pa-gap-md) !important; }
.eap-plugin-scope .gap-lg{ gap: var(--pa-gap-lg) !important; }

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 12: RESPONSIVE DESIGN
   ════════════════════════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
    .eap-plugin-scope .eap-main{
        padding: var(--pa-space-xl) !important;
    }

    .eap-plugin-scope .eap-dashboard-grid{
        gap: var(--pa-gap-md) !important;
    }
}

@media (max-width: 768px) {
    .eap-plugin-scope .eap-topbar{
        padding: 0 var(--pa-space-md) !important;
    }

    .eap-plugin-scope .eap-topbar h1{
        font-size: 18px;
    }

    .eap-plugin-scope .eap-main{
        padding: var(--pa-space-lg) !important;
    }

    .eap-plugin-scope .eap-card{
        padding: var(--pa-space-lg) !important;
    }

    .eap-plugin-scope .eap-sidebar{
        position: absolute;
        left: 0;
        top: var(--pa-topbar-height);
        height: calc(100% - var(--pa-topbar-height));
        z-index: 999;
        width: 260px;
        transform: translateX(-100%);
        transition: transform var(--pa-ease);
    }

    .eap-plugin-scope .eap-sidebar.open{
        transform: translateX(0);
    }

    .eap-plugin-scope .eap-main{
        width: 100%;
    }

    .eap-plugin-scope .eap-metric-value{
        font-size: 24px;
    }
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 13: COMPATIBILITY SHIMS & LEGACY SUPPORT
   ════════════════════════════════════════════════════════════════════════════ */

/* Legacy perfect-aptitude-learning-theme.css */
.eap-plugin-scope .pa-shell{ min-height: 100vh; background: var(--pa-bg); font-family: var(--pa-font-primary); }
.eap-plugin-scope .pa-container{ width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.eap-plugin-scope .pa-dashboard-layout{ display: flex; min-height: 100vh; width: 100%; }

/* Legacy eap-dashboard overrides */
.eap-plugin-scope .eap-premium-shell{ /* empty — already handled */ }
.eap-plugin-scope .eap-premium-theme{ /* empty — already handled */ }

/* CSS Variable Aliases for backward compat */
.eap-plugin-scope{
    /* From eap-design-system.css v6.0 */
    --eap-yellow: var(--pa-amber-500);
    --eap-coral: var(--pa-red-500);
    --eap-mint: var(--pa-emerald-500);
    --eap-blue: var(--pa-blue-500);
    --eap-muted: var(--pa-text-muted);
    --eap-text: var(--pa-text-primary);
    --eap-shadow: var(--pa-shadow-md);
    --eap-radius: var(--pa-radius-md);
    --eap-subtext: var(--pa-text-secondary);
    --eap-surface-soft: var(--pa-surface-soft);
    --eap-surface-2: var(--pa-surface-2);
    --eap-surface-3: var(--pa-surface-3);
    --eap-text-secondary: var(--pa-text-secondary);
    --eap-text-muted: var(--pa-text-muted);
    --eap-text-inverse: var(--pa-text-inverse);
    --eap-border-solid: var(--pa-border-solid);

    /* From dashboard-premium.css */
    --eap-emerald: var(--pa-emerald-500);
    --eap-amber: var(--pa-amber-500);
    --eap-rose: var(--pa-red-500);
    --eap-crimson: var(--pa-red-700);
    --eap-sidebar-width: var(--pa-sidebar-width);
    --eap-sidebar-width-collapsed: var(--pa-sidebar-width-collapsed);

    /* From eap-portal-shell-recovery.css */
    --r-sm: var(--pa-radius-sm);
    --r-md: var(--pa-radius-md);
    --r-lg: var(--pa-radius-lg);
    --r-full: var(--pa-radius-full);
    --gap-sm: var(--pa-gap-sm);
    --gap-md: var(--pa-gap-md);
    --gap-lg: var(--pa-gap-lg);
    --shadow-sm: var(--pa-shadow-sm);
    --shadow-md: var(--pa-shadow-md);
    --shadow-xs: var(--pa-shadow-xs);
    --ease: var(--pa-ease);
}

/* ════════════════════════════════════════════════════════════════════════════
   SECTION 14: PRINT STYLES
   ════════════════════════════════════════════════════════════════════════════ */

@media print {
    .eap-plugin-scope .eap-sidebar,
.eap-plugin-scope .eap-topbar{
        display: none !important;
    }

    .eap-plugin-scope .eap-viewport-shell{
        position: static !important;
        width: 100% !important;
        height: auto !important;
    }

    .eap-plugin-scope .eap-main{
        padding: 0 !important;
    }
}

/* ════════════════════════════════════════════════════════════════════════════
   END OF pa-unified-design-system.css
   ════════════════════════════════════════════════════════════════════════════ */

/* ===== SOURCE: eap-portal-premium-theme.css ===== */
/* ==========================================================================
   PERFECT APTITUDE PREMIUM PORTAL THEME
   ========================================================================== */

/* ── Role Colors ── */
.eap-plugin-scope .eap-portal-shell.pa-role-institution,
.eap-plugin-scope .eap-portal-shell.pa-role-admin{
    --role-primary: #2563EB;
    --role-secondary: #0F172A;
    --role-accent: #F59E0B;
}

.eap-plugin-scope .eap-portal-shell.pa-role-teacher{
    --role-primary: #10B981;
    --role-secondary: #0F172A;
    --role-accent: #2563EB;
}

.eap-plugin-scope .eap-portal-shell.pa-role-student{
    --role-primary: #4361EE;
    --role-secondary: #0F172A;
    --role-accent: #F59E0B;
}

.eap-plugin-scope .eap-portal-shell{
    --bg-page: #F8FAFC;
    --bg-card: #FFFFFF;
    --border-soft: #E5EAF3;
    --text-dark: #0F172A;
    --text-muted: #64748B;
    --shadow-soft: 0 4px 6px -1px rgba(15, 23, 42, 0.05), 0 2px 4px -1px rgba(15, 23, 42, 0.03);

    display: flex;
    min-height: 100vh;
    width: 100%;
    background: var(--bg-page);
    color: var(--text-dark);
    font-family: "Inter", system-ui, sans-serif;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.eap-plugin-scope .eap-portal-shell *{
    box-sizing: border-box;
}

/* ── Shell Layout ── */
.eap-plugin-scope .eap-portal-shell .eap-dashboard-app-wrap{
    display: flex;
    width: 100%;
    min-height: 100vh;
}

/* ── Sidebar ── */
.eap-plugin-scope .eap-portal-shell .eap-sidebar{
    width: 240px;
    min-width: 240px;
    background: var(--bg-card);
    color: var(--text-dark);
    display: flex;
    flex-direction: column;
    padding: 16px 12px;
    border-right: 1px solid var(--border-soft);
}

.eap-plugin-scope .eap-portal-shell .eap-logo-name{
    font-size: 18px;
    font-weight: 800;
    color: var(--text-dark);
    margin-bottom: 24px;
    padding: 0 8px;
    display: flex;
    flex-direction: column;
}

.eap-plugin-scope .eap-portal-shell .eap-logo-name small{
    font-size: 11px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 4px;
}

.eap-plugin-scope .eap-portal-shell .eap-nav-link{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    margin-bottom: 2px;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
    font-size: 13px;
    transition: all 0.2s ease;
}

.eap-plugin-scope .eap-portal-shell .eap-nav-link:hover{
    background: rgba(15, 23, 42, 0.04);
    color: var(--text-dark);
}

.eap-plugin-scope .eap-portal-shell .eap-nav-link.active{
    background: rgba(37, 99, 235, 0.06);
    color: var(--role-primary, #2563EB);
    border-left: 3px solid var(--role-primary, #2563EB);
    border-radius: 4px 8px 8px 4px;
}

.eap-plugin-scope .eap-portal-shell .eap-nav-link .dashicons{
    color: inherit;
    font-size: 16px;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.eap-plugin-scope .eap-portal-shell .eap-nav-link.active .dashicons{
    color: var(--role-primary, #2563EB);
}

/* ── Main Area & Topbar ── */
.eap-plugin-scope .eap-portal-shell .eap-main{
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: var(--bg-page);
}

.eap-plugin-scope .eap-portal-shell .eap-topbar{
    background: var(--bg-card);
    height: 64px;
    padding: 0 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--border-soft);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.02);
}

.eap-plugin-scope .eap-portal-shell .eap-page-title{
    font-size: 20px;
    font-weight: 700;
    color: var(--role-secondary);
    margin: 0;
}

.eap-plugin-scope .eap-portal-shell .eap-user-controls{
    display: flex;
    align-items: center;
    gap: 16px;
}

.eap-plugin-scope .eap-portal-shell .eap-role-badge{
    background: rgba(37, 99, 235, 0.1);
    color: var(--role-primary);
    padding: 4px 12px;
    border-radius: 9999px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

/* ── Content Container ── */
.eap-plugin-scope .eap-portal-shell .eap-main > div{
    max-width: 1440px;
    margin: 0 auto;
    width: 100%;
    padding: 32px;
}

/* ── Grid Layouts ── */
.eap-plugin-scope .eap-portal-shell .eap-dashboard-grid{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 20px;
}

.eap-plugin-scope .eap-portal-shell .eap-dashboard-grid > *{
    grid-column: span 4; /* Default to 3 columns per row */
}

.eap-plugin-scope .eap-portal-shell .eap-col-12{ grid-column: span 12 !important; }
.eap-plugin-scope .eap-portal-shell .eap-col-8{ grid-column: span 8 !important; }
.eap-plugin-scope .eap-portal-shell .eap-col-6{ grid-column: span 6 !important; }
.eap-plugin-scope .eap-portal-shell .eap-col-4{ grid-column: span 4 !important; }
.eap-plugin-scope .eap-portal-shell .eap-col-3{ grid-column: span 3 !important; }

.eap-plugin-scope .eap-portal-shell .eap-dashboard-grid-stats,
.eap-plugin-scope .eap-portal-shell .eap-kpi-grid,
.eap-plugin-scope .eap-portal-shell .eap-grid-auto{
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    grid-column: span 12;
    width: 100%;
}

.eap-plugin-scope .eap-portal-shell .eap-dashboard-grid-main{
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 24px;
    grid-column: span 12;
}

.eap-plugin-scope .eap-portal-shell .eap-dashboard-grid-features{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    grid-column: span 12;
}

/* ── Cards ── */
.eap-plugin-scope .eap-portal-shell .eap-card,
.eap-plugin-scope .eap-portal-shell .pa-card,
.eap-plugin-scope .eap-portal-shell .eap-stat-card,
.eap-plugin-scope .eap-portal-shell .eap-widget,
.eap-plugin-scope .eap-portal-shell .eap-kpi-card,
.eap-plugin-scope .eap-portal-shell .eap-teacher-home-summary-card,
.eap-plugin-scope .eap-portal-shell .eap-student-home-summary-card{
    background: var(--bg-card);
    border-radius: 16px;
    border: 1px solid var(--border-soft);
    box-shadow: var(--shadow-soft);
    padding: 16px;
    position: relative;
    overflow: hidden;
}

/* Accent Line */
.eap-plugin-scope .eap-portal-shell .eap-card::before,
.eap-plugin-scope .eap-portal-shell .eap-stat-card::before,
.eap-plugin-scope .eap-portal-shell .eap-widget::before,
.eap-plugin-scope .eap-portal-shell .eap-kpi-card::before,
.eap-plugin-scope .eap-portal-shell .eap-teacher-home-summary-card::before,
.eap-plugin-scope .eap-portal-shell .eap-student-home-summary-card::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--role-primary, #2563EB);
    opacity: 0.8;
}

.eap-plugin-scope .eap-portal-shell .eap-card-title,
.eap-plugin-scope .eap-portal-shell .eap-stat-title{
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 700;
    color: var(--text-dark);
    margin: 0 0 12px 0;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-soft);
}

.eap-plugin-scope .eap-portal-shell .eap-stat-title,
.eap-plugin-scope .eap-portal-shell .eap-kpi-label,
.eap-plugin-scope .eap-portal-shell .eap-teacher-home-summary-label,
.eap-plugin-scope .eap-portal-shell .eap-student-home-summary-label{
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
    border-bottom: none;
    margin-bottom: 4px;
    padding-bottom: 0;
    font-weight: 700;
}

.eap-plugin-scope .eap-portal-shell .eap-stat-value,
.eap-plugin-scope .eap-portal-shell .eap-kpi-value,
.eap-plugin-scope .eap-portal-shell .eap-teacher-home-summary-value,
.eap-plugin-scope .eap-portal-shell .eap-student-home-summary-value{
    display: block;
    font-size: clamp(20px, 2.2vw, 24px);
    font-weight: 800;
    color: var(--role-secondary);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.eap-plugin-scope .eap-portal-shell .eap-kpi-subtext,
.eap-plugin-scope .eap-portal-shell .eap-teacher-home-summary-meta,
.eap-plugin-scope .eap-portal-shell .eap-student-home-summary-meta{
    font-size: 12px;
    color: var(--text-muted);
    margin: 8px 0 0 0;
}

/* ── Buttons ── */
.eap-plugin-scope .eap-portal-shell .eap-btn,
.eap-plugin-scope .eap-portal-shell .pa-button,
.eap-plugin-scope .eap-portal-shell .button{
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 20px;
    border-radius: 9999px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    border: none;
    transition: all 0.2s ease;
}

.eap-plugin-scope .eap-portal-shell .eap-btn--primary,
.eap-plugin-scope .eap-portal-shell .pa-button-primary,
.eap-plugin-scope .eap-portal-shell .eap-btn-primary{
    background: var(--role-primary);
    color: #FFFFFF;
}

.eap-plugin-scope .eap-portal-shell .eap-btn--primary:hover,
.eap-plugin-scope .eap-portal-shell .pa-button-primary:hover,
.eap-plugin-scope .eap-portal-shell .eap-btn-primary:hover{
    background: var(--role-secondary);
    transform: translateY(-1px);
    color: #FFFFFF;
}

.eap-plugin-scope .eap-portal-shell .eap-btn--secondary,
.eap-plugin-scope .eap-portal-shell .eap-btn-secondary{
    background: var(--bg-page);
    color: var(--text-dark);
    border: 1px solid var(--border-soft);
}

.eap-plugin-scope .eap-portal-shell .eap-btn-success{
    background: #10B981;
    color: #FFFFFF;
}

.eap-plugin-scope .eap-portal-shell .eap-btn-danger{
    background: #EF4444;
    color: #FFFFFF;
}

.eap-plugin-scope .eap-portal-shell .eap-btn-action{
    background: var(--role-accent);
    color: #FFFFFF;
}

/* ── Forms ── */
.eap-plugin-scope .eap-portal-shell .eap-form-group{
    margin-bottom: 20px;
}

.eap-plugin-scope .eap-portal-shell label{
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-dark);
    margin-bottom: 8px;
}

.eap-plugin-scope .eap-portal-shell input[type="text"],
.eap-plugin-scope .eap-portal-shell input[type="email"],
.eap-plugin-scope .eap-portal-shell input[type="password"],
.eap-plugin-scope .eap-portal-shell select,
.eap-plugin-scope .eap-portal-shell textarea{
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    padding: 12px 16px;
    border-radius: 8px;
    border: 1px solid var(--border-soft);
    background: var(--bg-card);
    font-size: 15px;
    color: var(--text-dark);
    transition: all 0.2s;
}

.eap-plugin-scope .eap-portal-shell input:focus,
.eap-plugin-scope .eap-portal-shell select:focus,
.eap-plugin-scope .eap-portal-shell textarea:focus{
    outline: none;
    border-color: var(--role-primary);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

/* ── Tables ── */
.eap-plugin-scope .eap-portal-shell .eap-table{
    width: 100%;
    border-collapse: collapse;
}

.eap-plugin-scope .eap-portal-shell .eap-table th{
    background: var(--bg-page);
    color: var(--text-muted);
    font-size: 12px;
    text-transform: uppercase;
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    border-bottom: 2px solid var(--border-soft);
}

.eap-plugin-scope .eap-portal-shell .eap-table td{
    padding: 16px;
    border-bottom: 1px solid var(--border-soft);
    font-size: 14px;
}

/* ── Empty States ── */
.eap-plugin-scope .eap-portal-shell .eap-empty-state,
.eap-plugin-scope .eap-portal-shell .u-empty-state,
.eap-plugin-scope .eap-portal-shell .eap-teacher-empty,
.eap-plugin-scope .eap-portal-shell .eap-inst-home-empty{
    text-align: center;
    padding: 48px 24px;
    background: var(--bg-page);
    border: 1px dashed #cbd5e1;
    border-radius: 12px;
    width: 100%;
    color: var(--text-muted);
    font-size: 14px;
}

.eap-plugin-scope .eap-portal-shell .eap-empty-state-icon{
    font-size: 48px;
    color: #94A3B8;
    margin-bottom: 16px;
}

.eap-plugin-scope .eap-portal-shell .eap-empty-state h3{
    font-size: 18px;
    font-weight: 700;
    color: var(--text-dark);
    margin-bottom: 8px;
}

.eap-plugin-scope .eap-portal-shell .eap-empty-state p{
    color: var(--text-muted);
    font-size: 14px;
    margin-bottom: 24px;
}

/* ── Specific Overrides for Scattered Pages ── */
/* ── Specific Overrides for Scattered Pages ── */
/* Force full width on layout components */
.eap-plugin-scope .eap-portal-shell .eap-table-container,
.eap-plugin-scope .eap-portal-shell .eap-dashboard-list,
.eap-plugin-scope .eap-portal-shell .eap-record-container{
    width: 100%;
}

/* Overview Rows & Facts (Institution, Teacher & Student) */
.eap-plugin-scope .eap-portal-shell .eap-inst-home-overview-row,
.eap-plugin-scope .eap-portal-shell .eap-inst-home-ops-row,
.eap-plugin-scope .eap-portal-shell .eap-teacher-home-fact,
.eap-plugin-scope .eap-portal-shell .eap-student-meta{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border-soft);
    margin: 0;
}

.eap-plugin-scope .eap-portal-shell .eap-inst-home-overview-row:last-child,
.eap-plugin-scope .eap-portal-shell .eap-inst-home-ops-row:last-child,
.eap-plugin-scope .eap-portal-shell .eap-teacher-home-fact:last-child,
.eap-plugin-scope .eap-portal-shell .eap-student-meta:last-child{
    border-bottom: none;
}

.eap-plugin-scope .eap-portal-shell .eap-inst-home-overview-label,
.eap-plugin-scope .eap-portal-shell .eap-inst-home-ops-label,
.eap-plugin-scope .eap-portal-shell .eap-teacher-home-fact span{
    font-size: 14px;
    color: var(--text-muted);
    font-weight: 500;
}

.eap-plugin-scope .eap-portal-shell .eap-inst-home-overview-value,
.eap-plugin-scope .eap-portal-shell .eap-inst-home-ops-row strong,
.eap-plugin-scope .eap-portal-shell .eap-teacher-home-fact strong{
    font-size: 14px;
    color: var(--text-dark);
    font-weight: 600;
}

.eap-plugin-scope .eap-portal-shell .eap-teacher-home-panel-title,
.eap-plugin-scope .eap-portal-shell .eap-student-home-panel-title{
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
    margin-bottom: 16px;
    font-weight: 600;
}

/* Internal Layout Grids (Student/Teacher Dashboards) */
.eap-plugin-scope .eap-portal-shell .eap-teacher-home-summary-grid,
.eap-plugin-scope .eap-portal-shell .eap-student-home-summary-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

.eap-plugin-scope .eap-portal-shell .eap-teacher-home-overview-grid,
.eap-plugin-scope .eap-portal-shell .eap-student-home-overview-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 24px;
}

.eap-plugin-scope .eap-portal-shell .eap-teacher-home-kpi-grid{
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 24px;
}

.eap-plugin-scope .eap-portal-shell .eap-home-live-label{
    color: #ef4444;
}

.eap-plugin-scope .eap-portal-shell .eap-teacher-session-live-badge{
    color: #ef4444;
}

.eap-plugin-scope .eap-portal-shell .eap-home-kpi-meta{
    font-size: 12px;
    opacity: 0.75;
}

.eap-plugin-scope .eap-portal-shell .eap-home-kpi-value--status{
    font-size: 24px;
}

.eap-plugin-scope .eap-portal-shell .eap-home-panel{
    background: var(--bg-page);
    padding: 20px;
    border-radius: 12px;
}

.eap-plugin-scope .eap-portal-shell .eap-home-panel--center{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.eap-plugin-scope .eap-portal-shell .eap-home-fact-list{
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 13.5px;
    color: var(--text-muted);
    line-height: 2;
}

.eap-plugin-scope .eap-portal-shell .eap-home-fact-label{
    color: var(--text-dark);
    display: inline-block;
    width: 140px;
}

.eap-plugin-scope .eap-portal-shell .eap-student-home-summary-value--institution{
    font-size: 16px;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.eap-plugin-scope .eap-portal-shell .eap-student-home-summary-value--language{
    font-size: 22px;
    line-height: 1.2;
}

.eap-plugin-scope .eap-portal-shell .eap-student-home-summary-value--metric{
    font-size: 30px;
    line-height: 1;
}

.eap-plugin-scope .eap-portal-shell .eap-student-feature-grid{
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 13px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.eap-plugin-scope .eap-portal-shell .eap-student-feature-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    border: 1px solid var(--border-soft);
    border-radius: 10px;
    background: var(--bg-page);
}

.eap-plugin-scope .eap-portal-shell .eap-student-feature-pill{
    font-size: 11px;
    font-weight: 700;
    padding: 4px 8px;
    border-radius: 999px;
}

.eap-plugin-scope .eap-portal-shell .eap-student-feature-pill.is-on{
    background: rgba(16, 185, 129, 0.15);
    color: #065f46;
}

.eap-plugin-scope .eap-portal-shell .eap-student-feature-pill.is-off{
    background: rgba(239, 68, 68, 0.15);
    color: #991b1b;
}

.eap-plugin-scope .eap-portal-shell .eap-session-action-btn{
    padding: 4px 10px;
}

.eap-plugin-scope .eap-portal-shell .eap-livehub-code--compact{
    font-weight: 700;
}

/* Quick Actions Container */
.eap-plugin-scope .eap-portal-shell .eap-inst-actions,
.eap-plugin-scope .eap-portal-shell .eap-teacher-home-actions,
.eap-plugin-scope .eap-portal-shell .eap-student-home-actions{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.eap-plugin-scope .eap-portal-shell .eap-student-home-action-card{
    background: var(--bg-card);
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    padding: 20px;
    flex: 1;
    min-width: 250px;
}

.eap-plugin-scope .eap-portal-shell .eap-student-home-action-card h4{
    margin: 0 0 8px 0;
    color: var(--text-dark);
}

.eap-plugin-scope .eap-portal-shell .eap-student-home-action-card p{
    font-size: 13px;
    color: var(--text-muted);
    margin: 0 0 16px 0;
}

/* Usage Bars */
.eap-plugin-scope .eap-portal-shell .eap-usage-bar-wrap{
    margin-top: 16px;
}

.eap-plugin-scope .eap-portal-shell .eap-usage-bar-labels{
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
    font-size: 13px;
    color: var(--text-dark);
}

.eap-plugin-scope .eap-portal-shell .eap-progress-bar{
    width: 100%;
    height: 8px;
    background: var(--bg-page);
    border-radius: 9999px;
    overflow: hidden;
}

.eap-plugin-scope .eap-portal-shell .eap-progress-fill{
    height: 100%;
    border-radius: 9999px;
    background: var(--role-primary);
}

.eap-plugin-scope .eap-portal-shell .eap-progress-fill--success{ background: #10B981; }
.eap-plugin-scope .eap-portal-shell .eap-progress-fill--warning{ background: #F59E0B; }
.eap-plugin-scope .eap-portal-shell .eap-progress-fill--danger{ background: #EF4444; }

/* Item Lists */
.eap-plugin-scope .eap-portal-shell .eap-item-list{
    list-style: none;
    padding: 0;
    margin: 0;
}

.eap-plugin-scope .eap-portal-shell .eap-item-list__row{
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border-soft);
    gap: 12px;
}

.eap-plugin-scope .eap-portal-shell .eap-item-list__row:last-child{
    border-bottom: none;
}

.eap-plugin-scope .eap-portal-shell .eap-item-list__dot{
    width: 8px;
    height: 8px;
    background: var(--role-primary);
    border-radius: 50%;
}

.eap-plugin-scope .eap-portal-shell .eap-item-list__label{
    flex: 1;
    font-size: 14px;
    color: var(--text-dark);
    font-weight: 500;
}

/* ── Embedded Iframes ── */
.eap-plugin-scope .eap-portal-shell .eap-inst-module-frame{
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 700px;
    flex: 1;
}

.eap-plugin-scope .eap-portal-shell .eap-inst-iframe{
    width: 100%;
    height: 100%;
    min-height: 700px;
    border: none;
    flex: 1;
    display: block;
}

.eap-plugin-scope .eap-portal-shell .eap-inst-module-card .eap-card-body{
    padding: 0;
    overflow: hidden;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
    .eap-plugin-scope .eap-portal-shell .eap-dashboard-grid-main{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .eap-plugin-scope .eap-portal-shell .eap-dashboard-grid-stats,
.eap-plugin-scope .eap-portal-shell .eap-kpi-grid,
.eap-plugin-scope .eap-portal-shell .eap-dashboard-grid-features{
        grid-template-columns: 1fr;
    }

    .eap-plugin-scope .eap-portal-shell .eap-dashboard-grid > *,
.eap-plugin-scope .eap-portal-shell .eap-col-12,
.eap-plugin-scope .eap-portal-shell .eap-col-8,
.eap-plugin-scope .eap-portal-shell .eap-col-6,
.eap-plugin-scope .eap-portal-shell .eap-col-4,
.eap-plugin-scope .eap-portal-shell .eap-col-3{
        grid-column: span 12 !important;
    }

    .eap-plugin-scope .eap-portal-shell .eap-sidebar{
        position: fixed;
        transform: translateX(-100%);
        z-index: 100;
    }

    .eap-plugin-scope .eap-portal-shell .eap-sidebar.mobile-open,
.eap-plugin-scope .eap-portal-shell.sidebar-open .eap-sidebar{
        transform: translateX(0);
    }

    .eap-plugin-scope .eap-portal-shell .eap-main > div{
        padding: 16px;
    }

    .eap-plugin-scope .eap-portal-shell .eap-teacher-home-kpi-grid,
.eap-plugin-scope .eap-portal-shell .eap-student-home-summary-grid{
        grid-template-columns: 1fr;
    }

    .eap-plugin-scope .eap-portal-shell .eap-student-feature-grid{
        grid-template-columns: 1fr;
    }

    .eap-plugin-scope .eap-portal-shell .eap-home-fact-label{
        width: 120px;
    }
}

/* ===== SOURCE: eap-portal-experience.css ===== */
/**
 * Premium portal experience layer.
 * Scoped to the plugin-owned post-login shell only.
 */

.eap-plugin-scope .eap-viewport-shell{
    --portal-bg: #f7fafc;
    --portal-surface: #ffffff;
    --portal-surface-soft: #f8fafc;
    --portal-border: #dbe4ee;
    --portal-text: #0f172a;
    --portal-muted: #64748b;
    --portal-blue: #2563eb;
    --portal-green: #059669;
    --portal-coral: #e11d48;
    --portal-amber: #b45309;
    --portal-shadow: 0 16px 40px rgba(15, 23, 42, 0.08);
    background:
        linear-gradient(180deg, rgba(37, 99, 235, 0.06), rgba(5, 150, 105, 0.04) 42%, rgba(248, 250, 252, 1) 100%),
        var(--portal-bg);
    color: var(--portal-text);
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="teacher"]{
    --portal-blue: #047857;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="student"]{
    --portal-blue: #0e7490;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"]{
    --portal-blue: #4f46e5;
}

.eap-plugin-scope .eap-shell-inner{
    background: transparent;
}

.eap-plugin-scope .eap-sidebar{
    background: #0f172a;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 12px 0 32px rgba(15, 23, 42, 0.18);
}

.eap-plugin-scope .eap-sidebar-logo{
    min-height: 72px;
    padding: 18px 16px;
}

.eap-plugin-scope .eap-logo-mark{
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 14px;
}

.eap-plugin-scope .eap-logo-name,
.eap-plugin-scope .eap-sidebar-user-name{
    letter-spacing: 0;
}

.eap-plugin-scope .eap-sidebar-nav{
    padding: 10px 10px 18px;
    gap: 4px;
}

.eap-plugin-scope .eap-nav-link{
    min-height: 42px;
    border-radius: 10px;
    color: rgba(255, 255, 255, 0.74);
    transition: background 160ms ease, color 160ms ease, transform 160ms ease;
}

.eap-plugin-scope .eap-nav-link:hover{
    background: rgba(255, 255, 255, 0.09);
    color: #ffffff;
    transform: translateX(2px);
}

.eap-plugin-scope .eap-nav-link.active{
    background: #ffffff;
    color: #0f172a;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

.eap-plugin-scope .eap-main{
    background: transparent;
}

.eap-plugin-scope .eap-topbar{
    position: sticky;
    top: 0;
    z-index: 20;
    margin: 0;
    padding: 22px 28px 18px;
    background: rgba(247, 250, 252, 0.88);
    border-bottom: 1px solid rgba(219, 228, 238, 0.72);
    backdrop-filter: blur(18px);
}

.eap-plugin-scope .eap-shell-kicker{
    color: var(--portal-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

.eap-plugin-scope .eap-role-badge,
.eap-plugin-scope .eap-status-pill{
    border-radius: 999px;
    border: 1px solid rgba(37, 99, 235, 0.18);
    background: rgba(37, 99, 235, 0.08);
    color: var(--portal-blue);
    font-weight: 800;
}

.eap-plugin-scope .eap-page-title{
    margin-top: 6px;
    color: var(--portal-text);
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1.12;
    letter-spacing: 0;
}

.eap-plugin-scope .eap-page-subtitle{
    max-width: 760px;
    color: var(--portal-muted);
    font-size: 14px;
}

.eap-plugin-scope .eap-user-chip,
.eap-plugin-scope .eap-sidebar-user{
    border: 1px solid var(--portal-border);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.eap-plugin-scope .eap-sidebar-user{
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: none;
}

.eap-plugin-scope .eap-command-strip{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 24px 28px 0;
    padding: 18px;
    border: 1px solid var(--portal-border);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.94)),
        var(--portal-surface);
    box-shadow: var(--portal-shadow);
}

.eap-plugin-scope .eap-command-strip__copy{
    display: grid;
    gap: 4px;
}

.eap-plugin-scope .eap-command-strip__eyebrow{
    color: var(--portal-blue);
    font-size: 12px;
    font-weight: 800;
}

.eap-plugin-scope .eap-command-strip__copy strong{
    color: var(--portal-text);
    font-size: 15px;
    line-height: 1.35;
}

.eap-plugin-scope .eap-command-strip__actions{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.eap-plugin-scope .eap-command-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 14px;
    border: 1px solid var(--portal-border);
    border-radius: 10px;
    background: var(--portal-surface);
    color: var(--portal-text);
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.eap-plugin-scope .eap-command-btn:hover{
    transform: translateY(-1px);
    border-color: rgba(37, 99, 235, 0.32);
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.10);
}

.eap-plugin-scope .eap-command-btn--primary{
    border-color: transparent;
    background: var(--portal-blue);
    color: #ffffff;
}

.eap-plugin-scope .eap-content{
    padding: 24px 28px 32px;
}

.eap-plugin-scope .eap-dashboard-grid{
    gap: 18px;
}

.eap-plugin-scope .eap-card,
.eap-plugin-scope .eap-kpi-card,
.eap-plugin-scope .eap-widget,
.eap-plugin-scope .eap-list-item{
    border: 1px solid var(--portal-border);
    border-radius: 14px;
    background: var(--portal-surface);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.eap-plugin-scope .eap-card-title{
    color: var(--portal-text);
    letter-spacing: 0;
}

.eap-plugin-scope .eap-table{
    border-collapse: separate;
    border-spacing: 0;
}

.eap-plugin-scope .eap-table th{
    background: var(--portal-surface-soft);
    color: #334155;
    font-size: 12px;
    letter-spacing: 0;
}

.eap-plugin-scope .eap-table td,
.eap-plugin-scope .eap-table th{
    border-bottom: 1px solid var(--portal-border);
}

.eap-plugin-scope .eap-btn,
.eap-plugin-scope .eap-btn-action,
.eap-plugin-scope .eap-dashboard-shell button,
.eap-plugin-scope .eap-dashboard-shell input[type="submit"]{
    border-radius: 10px;
    font-weight: 800;
    letter-spacing: 0;
}

.eap-plugin-scope .eap-dashboard-shell input,
.eap-plugin-scope .eap-dashboard-shell select,
.eap-plugin-scope .eap-dashboard-shell textarea{
    border: 1px solid var(--portal-border);
    border-radius: 10px;
    background: #ffffff;
    color: var(--portal-text);
}

.eap-plugin-scope .eap-dashboard-shell input:focus,
.eap-plugin-scope .eap-dashboard-shell select:focus,
.eap-plugin-scope .eap-dashboard-shell textarea:focus{
    border-color: var(--portal-blue);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
    outline: none;
}

@media (max-width: 900px) {
    .eap-plugin-scope .eap-topbar{
        padding: 18px 18px 14px;
    }

    .eap-plugin-scope .eap-command-strip{
        align-items: stretch;
        flex-direction: column;
        margin: 18px 18px 0;
    }

    .eap-plugin-scope .eap-command-strip__actions{
        justify-content: stretch;
    }

    .eap-plugin-scope .eap-command-btn{
        flex: 1 1 160px;
    }

    .eap-plugin-scope .eap-content{
        padding: 18px;
    }
}

/* Premium post-login polish overrides legacy role colors. */
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell{
    --portal-sidebar-start: #16306f;
    --portal-sidebar-mid: #1f3f91;
    --portal-sidebar-end: #14214d;
    --portal-accent: #0e7490;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"]{
    --portal-sidebar-start: #0f513c;
    --portal-sidebar-mid: #13795b;
    --portal-sidebar-end: #123524;
    --portal-accent: #047857;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"],
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="super_admin"]{
    --portal-sidebar-start: #263172;
    --portal-sidebar-mid: #3949ab;
    --portal-sidebar-end: #1f244f;
    --portal-accent: #4f46e5;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-shell-inner{
    gap: 18px;
    padding: 18px 22px 22px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar{
    background: linear-gradient(180deg, var(--portal-sidebar-start), var(--portal-sidebar-mid) 46%, var(--portal-sidebar-end)) !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.18) !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar{
    position: sticky !important;
    top: 18px !important;
    height: calc(100vh - 40px) !important;
    min-height: 0 !important;
    max-height: calc(100vh - 40px) !important;
    padding: 20px 16px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    overflow: hidden !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-top{
    min-height: 0 !important;
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-logo{
    flex: 0 0 auto !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-nav{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 2px 4px 8px 0 !important;
    margin-right: -4px !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.42) rgba(255, 255, 255, 0.08);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-nav::-webkit-scrollbar{
    width: 7px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-nav::-webkit-scrollbar-track{
    background: rgba(255, 255, 255, 0.08);
    border-radius: 999px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-nav::-webkit-scrollbar-thumb{
    background: rgba(255, 255, 255, 0.38);
    border-radius: 999px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-footer{
    flex: 0 0 auto !important;
    margin-top: 0 !important;
    padding-top: 12px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-user{
    min-height: 58px !important;
    padding: 10px !important;
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-user-info{
    min-width: 0 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-user-name,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-user-role{
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-logout{
    min-height: 38px !important;
    margin-top: 8px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

@media (max-width: 960px) {
    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar{
        position: relative !important;
        top: auto !important;
        height: auto !important;
        max-height: none !important;
        width: 100% !important;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-nav{
        max-height: 68vh !important;
    }
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-logo-name,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-user-name{
    color: #ffffff !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-logo-sub,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-user-role,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-logout{
    color: rgba(255, 255, 255, 0.72) !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-nav-link{
    color: rgba(255, 255, 255, 0.78) !important;
    border-left: 0 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-nav-link:hover,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-nav-link.active{
    background: rgba(255, 255, 255, 0.14) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-nav-link.active{
    box-shadow: inset 3px 0 0 rgba(255, 255, 255, 0.82) !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-user{
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-mobile-menu-toggle{
    display: none !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-sidebar-toggle{
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.10) !important;
    color: #ffffff !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-topbar{
    position: static !important;
    min-height: 118px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 22px 26px !important;
    background: linear-gradient(135deg, #ffffff 0%, #f7fbff 100%) !important;
    border: 1px solid var(--portal-border) !important;
    border-radius: 14px !important;
    border-bottom: 1px solid var(--portal-border) !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.07) !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-topbar h1,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-page-title{
    background: none !important;
    color: #0f172a !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: clamp(24px, 2.8vw, 32px) !important;
    letter-spacing: 0 !important;
    margin: 8px 0 6px !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-page-subtitle{
    color: #64748b !important;
    margin: 0 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-shell-kicker,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-role-badge{
    color: var(--portal-accent) !important;
    -webkit-text-fill-color: currentColor !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-user-chip{
    background: #ffffff !important;
    border-color: var(--portal-border) !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-topbar-right{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-portal-tools{
    display: flex;
    align-items: center;
    gap: 8px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-tool-button{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 12px;
    border: 1px solid var(--portal-border);
    border-radius: 10px;
    background: #ffffff;
    color: #0f172a;
    font-size: 13px;
    font-weight: 900;
    cursor: pointer;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-tool-button--notifications{
    width: 40px;
    padding: 0;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-count{
    position: absolute;
    top: -7px;
    right: -7px;
    display: inline-grid;
    min-width: 20px;
    height: 20px;
    place-items: center;
    padding: 0 5px;
    border: 2px solid #ffffff;
    border-radius: 999px;
    background: #e11d48;
    color: #ffffff;
    font-size: 11px;
    font-weight: 900;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-drawer{
    position: fixed;
    top: calc(var(--eap-adminbar-h, 0px) + 92px);
    right: 28px;
    z-index: 120;
    width: min(380px, calc(100vw - 32px));
    max-height: calc(100vh - 132px);
    overflow: auto;
    padding: 14px;
    border: 1px solid var(--portal-border);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-8px);
    transition: opacity 160ms ease, transform 160ms ease;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-drawer.is-open{
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-drawer__head{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 4px 4px 12px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-drawer__head span{
    display: block;
    color: var(--portal-accent);
    font-size: 12px;
    font-weight: 900;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-drawer__head strong{
    display: block;
    margin-top: 4px;
    color: #0f172a;
    font-size: 16px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-close,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-panel__bar button{
    display: inline-grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border: 1px solid #dbe4ee;
    border-radius: 10px;
    background: #ffffff;
    color: #334155;
    cursor: pointer;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-list{
    display: grid;
    gap: 10px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-item{
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 12px;
    padding: 12px;
    border: 1px solid #e5edf6;
    border-radius: 12px;
    background: #f8fafc;
    color: #0f172a;
    text-decoration: none;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-item > .dashicons{
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 12px;
    background: rgba(14, 116, 144, 0.10);
    color: var(--portal-accent);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-item.is-attention > .dashicons{
    background: rgba(180, 83, 9, 0.12);
    color: #b45309;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-item strong,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-item small{
    display: block;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-item small{
    margin-top: 4px;
    color: #64748b;
    line-height: 1.4;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-overlay{
    position: fixed;
    inset: 0;
    z-index: 140;
    display: grid;
    align-items: start;
    justify-items: center;
    padding: calc(var(--eap-adminbar-h, 0px) + 76px) 18px 18px;
    background: rgba(15, 23, 42, 0.28);
    opacity: 0;
    pointer-events: none;
    transition: opacity 160ms ease;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-overlay.is-open{
    opacity: 1;
    pointer-events: auto;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-panel{
    width: min(720px, 100%);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.48);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 30px 80px rgba(15, 23, 42, 0.28);
    transform: translateY(-8px);
    transition: transform 160ms ease;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-overlay.is-open .eap-search-panel{
    transform: translateY(0);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-panel__bar{
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) 38px;
    gap: 10px;
    align-items: center;
    padding: 14px;
    border-bottom: 1px solid #e5edf6;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-panel__bar > .dashicons{
    color: var(--portal-accent);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-panel__bar input{
    min-height: 44px;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #0f172a;
    font-size: 16px;
    font-weight: 700;
    outline: 0 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-results{
    display: grid;
    max-height: min(520px, 58vh);
    overflow: auto;
    padding: 10px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-result{
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 12px;
    border-radius: 12px;
    color: #0f172a;
    text-decoration: none;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-result:hover{
    background: #f1f5f9;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-result > .dashicons{
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 12px;
    background: rgba(14, 116, 144, 0.10);
    color: var(--portal-accent);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-result strong,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-result small{
    display: block;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-result small,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-empty{
    color: #64748b;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-search-empty{
    margin: 0;
    padding: 18px;
    text-align: center;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-portal-toast{
    position: relative;
    margin: 0 0 14px !important;
    padding: 12px 14px !important;
    border: 1px solid #dbe4ee !important;
    border-left: 4px solid var(--portal-accent) !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08) !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-command-strip{
    margin: 18px 0 0;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-content{
    margin: 0 !important;
    padding: 22px 0 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-main > .eap-topbar,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-main > .eap-command-strip,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-main > .eap-content{
    max-width: none !important;
    width: 100% !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid{
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 18px !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid{
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 18px !important;
    align-items: stretch !important;
    width: 100% !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-card,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-card,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-card{
    grid-column: span 4 !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-col-12,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-col-12,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-col-12,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-col-12,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-inst-module-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-inst-module-card,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-inst-module-card,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-inst-module-card{
    grid-column: 1 / -1 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-col-8,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-col-8,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-col-8,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-col-8{
    grid-column: span 8 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-col-6,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-col-6,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-col-6,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-col-6{
    grid-column: span 6 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-col-4,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-col-4,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-col-4,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-col-4{
    grid-column: span 4 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-card-body,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-widget-header,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-card-body,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-widget-header,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-card-body,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-widget-header,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-card-body,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-widget-header{
    min-width: 0 !important;
    max-width: 100% !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-col-5{
    grid-column: span 5 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-col-7{
    grid-column: span 7 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-inst-link-card{
    grid-column: 1 / -1 !important;
    max-width: 100% !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-link-card .eap-card-body{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-width: 0;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-link-note,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-link-card .eap-join-status{
    margin: 0;
    min-width: 0;
    max-width: 760px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-link-card .eap-btn{
    flex: 0 0 auto;
    max-width: 100%;
    white-space: normal;
    text-align: center;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-page{
    min-width: 0 !important;
    max-width: 100% !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card{
    padding: 16px !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card .eap-widget-header,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-card .eap-widget-header{
    margin-bottom: 10px !important;
    padding-bottom: 10px !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card .eap-card-title,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-card .eap-card-title{
    font-size: 18px !important;
    line-height: 1.2 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card .eap-card-body,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-card .eap-card-body{
    padding: 0 !important;
    overflow: hidden !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card .eap-inst-module-frame,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card .eap-inst-module-frame--has-fallback{
    min-height: clamp(520px, 68vh, 760px) !important;
    height: clamp(520px, 68vh, 760px) !important;
    padding: 0 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card .eap-inst-iframe{
    min-height: clamp(520px, 68vh, 760px) !important;
    height: clamp(520px, 68vh, 760px) !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module{
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: auto;
    color: #111827;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module .eap-admin-wrap,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module .eap-dashboard-stack,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module .wrap{
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module .eap-dashboard-stack{
    display: grid !important;
    gap: 14px !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module .eap-dashboard-grid{
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module .eap-widget{
    max-width: 100% !important;
    min-width: 0 !important;
    border: 1px solid #e5edf6 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module .eap-widget-header{
    margin-bottom: 10px !important;
    padding-bottom: 10px !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module .eap-card-title,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module h2{
    font-size: 17px !important;
    line-height: 1.25 !important;
    letter-spacing: .02em !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--language .eap-lang-page-header,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--language .eap-lang-page-kpis,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--language .eap-lang-info-grid,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--book .eap-conv-header{
    display: none !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--language .eap-lang-inst-page{
    margin: 0 !important;
    padding: 0 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--language .eap-table-scroll,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--book .eap-table-scroll{
    max-height: clamp(360px, 48vh, 620px);
    overflow: auto !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--language table,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--book table{
    min-width: 720px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--book .eap-conv-diagnostics-card{
    display: none !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--book .eap-conv-upload-card .eap-admin-form{
    gap: 12px !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--book .eap-conv-form-grid{
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 16px !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--book .eap-conv-flow-note,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--book .eap-conv-rights-box{
    margin: 0 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--book .eap-conv-cta-row{
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-live-hub-panel{
    overflow: hidden;
    padding: 16px !important;
    border: 1px solid var(--portal-border);
    border-radius: 14px;
    background: #ffffff;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-live-hub-panel .wrap,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-live-hub-panel .eap-admin-wrap,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-live-hub-panel .eap-page,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-live-hub-panel .eap-dashboard-grid{
    max-width: 100% !important;
    margin: 0 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-live-hub-panel h1,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-live-hub-panel h2,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-live-hub-panel h3{
    margin-top: 0 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--live .notice,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--live .updated,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--live .error{
    margin: 0 0 12px !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--live form,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--live fieldset{
    max-width: 100% !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--live input,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--live select,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-native-module--live textarea{
    max-width: 100% !important;
    box-sizing: border-box;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-requests-card{
    padding: 18px !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-module{
    display: grid;
    gap: 14px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-module__header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-module__title{
    margin: 0 0 4px !important;
    font-size: 18px !important;
    line-height: 1.25 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-module__subtitle{
    margin: 0 !important;
    color: #64748b;
    font-size: 14px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-kpis{
    display: grid;
    grid-template-columns: repeat(3, minmax(110px, 1fr));
    gap: 10px;
    min-width: min(460px, 100%);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-kpi{
    padding: 10px 12px !important;
    border: 1px solid #e5edf6;
    border-radius: 12px;
    background: #f8fafc;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-kpi span{
    display: block;
    color: #64748b;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-kpi strong{
    display: block;
    margin-top: 4px;
    color: #0f172a;
    font-size: 24px;
    line-height: 1;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-table-wrap{
    max-height: 58vh;
    border: 1px solid #e5edf6;
    border-radius: 12px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-table{
    margin: 0 !important;
    min-width: 780px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-table th,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-table td{
    padding: 10px 12px !important;
    font-size: 13px !important;
    vertical-align: middle;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-table th{
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f8fafc;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-col-actions{
    min-width: 170px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-widget,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .pa-card{
    border: 1px solid var(--portal-border) !important;
    border-left: 1px solid var(--portal-border) !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.06) !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-card-title{
    border-bottom: 1px solid #e5edf6 !important;
    color: #2563eb !important;
    letter-spacing: 0.04em !important;
    padding-bottom: 10px !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-hero{
    display: grid;
    gap: 18px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-hero__main{
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-avatar{
    display: grid;
    flex: 0 0 72px;
    width: 72px;
    height: 72px;
    place-items: center;
    overflow: hidden;
    border-radius: 16px;
    background: #e0f2fe;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-avatar img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-kicker,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-summary-card span,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-overview-card span{
    display: block;
    color: #2563eb;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-identity h3{
    margin: 8px 0 8px;
    color: #0f172a;
    font-size: 22px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-identity p,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-panel__head p,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-summary-card p,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-overview-card p,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-note{
    color: #475569;
    line-height: 1.55;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-meta{
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-meta-chip{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px 12px;
    border: 1px solid #e5edf6;
    border-radius: 10px;
    background: #f8fafc;
    color: #64748b;
    line-height: 1.35;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-meta-chip strong{
    color: #0f172a;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-summary-grid,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-overview-grid{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-overview-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-summary-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-overview-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-language-strip,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-security-note{
    padding: 14px;
    border: 1px solid #e5edf6;
    border-radius: 12px;
    background: #f8fafc;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-summary-card strong,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-overview-card strong{
    display: block;
    margin-top: 8px;
    color: #0f172a;
    font-size: 18px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-panel{
    display: grid;
    gap: 18px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-panel__head h4{
    margin: 0 0 8px;
    color: #0f172a;
    font-size: 18px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-form-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-form-grid__full,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-actions{
    grid-column: 1 / -1;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-form .eap-form-group{
    margin: 0;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-form label{
    display: block;
    margin-bottom: 8px;
    color: #1e293b;
    font-weight: 800;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-language-pills{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-language-pill{
    padding: 7px 10px;
    border: 1px solid #dbe4ee;
    border-radius: 999px;
    background: #ffffff;
    color: #475569;
    font-size: 12px;
    font-weight: 800;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-language-pill.is-active{
    border-color: rgba(14, 116, 144, 0.22);
    background: rgba(14, 116, 144, 0.10);
    color: #0e7490;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-save{
    background: var(--portal-accent) !important;
    border-color: var(--portal-accent) !important;
    color: #ffffff !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-card{
    overflow: hidden;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-card .eap-card-body{
    padding-top: 4px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-focus-panel{
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.9fr);
    gap: 20px;
    align-items: stretch;
    padding: 22px;
    border: 1px solid rgba(14, 116, 144, 0.14);
    border-radius: 16px;
    background:
        radial-gradient(circle at top right, rgba(14, 116, 144, 0.14), transparent 34%),
        linear-gradient(135deg, #f8fafc 0%, #ffffff 64%);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-eyebrow{
    display: inline-flex;
    width: fit-content;
    margin-bottom: 10px;
    padding: 6px 10px;
    border: 1px solid rgba(14, 116, 144, 0.16);
    border-radius: 999px;
    background: rgba(14, 116, 144, 0.08);
    color: var(--portal-accent);
    font-size: 12px;
    font-weight: 900;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-focus-panel h3{
    margin: 0 0 10px;
    color: #0f172a;
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1.08;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-focus-panel p{
    max-width: 760px;
    margin: 0;
    color: #475569;
    line-height: 1.6;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-primary-action,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-secondary-action{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    margin-top: 18px;
    padding: 0 16px;
    border-radius: 10px;
    font-weight: 900;
    text-decoration: none;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-primary-action{
    background: var(--portal-accent);
    color: #ffffff;
    box-shadow: 0 14px 26px rgba(14, 116, 144, 0.22);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-secondary-action{
    border: 1px solid #dbe4ee;
    background: #ffffff;
    color: #0f172a;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-focus-panel__metrics{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    align-content: center;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-focus-panel__metrics article{
    min-height: 112px;
    padding: 16px;
    border: 1px solid #e5edf6;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-focus-panel__metrics span,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__score span{
    display: block;
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-focus-panel__metrics strong{
    display: block;
    margin-top: 8px;
    color: #0f172a;
    font-size: clamp(22px, 3vw, 32px);
    line-height: 1;
    overflow-wrap: anywhere;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-focus-panel__metrics small{
    display: block;
    margin-top: 8px;
    color: #64748b;
    font-weight: 700;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-timeline{
    display: grid;
    gap: 14px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-timeline__item{
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 12px;
    padding: 14px;
    border: 1px solid #e5edf6;
    border-radius: 12px;
    background: #f8fafc;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-timeline__dot{
    width: 12px;
    height: 12px;
    margin-top: 4px;
    border-radius: 999px;
    background: #94a3b8;
    box-shadow: 0 0 0 5px rgba(148, 163, 184, 0.12);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-timeline__item.is-live .eap-premium-timeline__dot{
    background: #059669;
    box-shadow: 0 0 0 5px rgba(5, 150, 105, 0.14);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-timeline__item.is-attention .eap-premium-timeline__dot{
    background: #b45309;
    box-shadow: 0 0 0 5px rgba(180, 83, 9, 0.14);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-timeline__item.is-done .eap-premium-timeline__dot{
    background: #2563eb;
    box-shadow: 0 0 0 5px rgba(37, 99, 235, 0.12);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-timeline__item strong,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-timeline__item a{
    color: #0f172a;
    font-weight: 900;
    text-decoration: none;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-timeline__item p{
    margin: 5px 0 0;
    color: #64748b;
    line-height: 1.45;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health{
    display: grid;
    gap: 14px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__score{
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__score strong{
    color: #0f172a;
    font-size: 34px;
    line-height: 1;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__bar{
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: #e5edf6;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__bar span{
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--portal-accent), #22c55e);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__items{
    display: grid;
    gap: 10px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__items article{
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    gap: 10px;
    padding: 12px;
    border: 1px solid #e5edf6;
    border-radius: 12px;
    background: #f8fafc;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__items .dashicons{
    color: var(--portal-accent);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__items article.is-open .dashicons{
    color: #b45309;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__items strong{
    color: #0f172a;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__items p{
    margin: 4px 0 0;
    color: #64748b;
    line-height: 1.4;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-empty-state{
    display: grid;
    justify-items: start;
    gap: 8px;
    padding: 18px;
    border: 1px dashed #cbd5e1;
    border-radius: 14px;
    background: #f8fafc;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-empty-state .dashicons{
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 12px;
    background: rgba(14, 116, 144, 0.10);
    color: var(--portal-accent);
    font-size: 20px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-empty-state strong{
    color: #0f172a;
    font-size: 16px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-empty-state p{
    margin: 0;
    color: #64748b;
    line-height: 1.5;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-progress-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-progress-grid article{
    min-height: 132px;
    padding: 16px;
    border: 1px solid #e5edf6;
    border-radius: 14px;
    background: #f8fafc;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-progress-grid span{
    display: block;
    color: var(--portal-accent);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-progress-grid strong{
    display: block;
    margin-top: 8px;
    color: #0f172a;
    font-size: 24px;
    line-height: 1.1;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-progress-grid p{
    margin: 8px 0 0;
    color: #64748b;
    line-height: 1.45;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-widget,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-command-btn,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-primary-action,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-secondary-action,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-timeline__item,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__items article,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-progress-grid article,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-tool-button,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-item{
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-widget:hover,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-timeline__item:hover,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-health__items article:hover,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-progress-grid article:hover,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-tool-button:hover,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-notification-item:hover{
    transform: translateY(-1px);
    border-color: rgba(14, 116, 144, 0.22) !important;
    box-shadow: 0 16px 32px rgba(15, 23, 42, 0.08) !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-wide-state .eap-empty-state,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-guided-empty{
    min-height: 180px;
    align-content: center;
    justify-items: center;
    text-align: center;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-guided-empty .eap-btn{
    margin-top: 8px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-sessions-kpi-grid{
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-sessions-kpi{
    min-height: 136px;
    padding: 18px;
    border: 1px solid #e5edf6;
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-sessions-kpi-label{
    margin: 0;
    color: #64748b;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-sessions-kpi-value{
    margin: 10px 0 4px;
    color: #0f172a;
    font-size: 32px;
    font-weight: 900;
    line-height: 1;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-sessions-kpi-meta{
    margin: 0;
    color: #64748b;
    line-height: 1.45;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-sessions-start-panel{
    padding: 20px;
    border: 1px solid #e5edf6;
    border-radius: 14px;
    background: #ffffff;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-sessions-start-title{
    margin: 0 0 6px;
    color: #0f172a;
    font-size: 18px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-sessions-start-subtitle{
    margin: 0 0 18px;
    color: #64748b;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-session-start-form{
    display: grid;
    gap: 16px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-session-action-row{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-session-start-btn{
    min-height: 42px;
    border-radius: 999px !important;
    padding: 0 20px !important;
    font-weight: 800 !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-session-start-btn--primary{
    background: var(--portal-accent) !important;
    border-color: var(--portal-accent) !important;
    color: #ffffff !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-session-start-btn--secondary{
    background: #f1f5f9 !important;
    border-color: #e2e8f0 !important;
    color: #0f172a !important;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-session-bucket .eap-card-body{
    min-height: 190px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-session-bucket .eap-teacher-empty{
    display: grid;
    min-height: 142px;
    place-items: center;
    margin: 0;
    padding: 18px;
    border: 1px dashed #d8e2ec;
    border-radius: 14px;
    background: #f8fafc;
    color: #64748b;
    text-align: center;
    line-height: 1.45;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-summary{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 16px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-pill{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid #e5edf6;
    border-radius: 999px;
    background: #f8fafc;
    color: #334155;
    font-size: 13px;
    font-weight: 800;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-pill strong{
    color: #0f172a;
    font-size: 16px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-pill.is-completed{
    border-color: rgba(22, 163, 74, 0.22);
    background: #f0fdf4;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-pill.is-failed{
    border-color: rgba(220, 38, 38, 0.22);
    background: #fef2f2;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-pill.is-pending{
    border-color: rgba(217, 119, 6, 0.22);
    background: #fffbeb;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-table-wrap{
    overflow-x: auto;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-table{
    min-width: 980px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-table th,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-table td{
    padding: 14px 16px;
    vertical-align: top;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-table .eap-teacher-table-primary{
    min-width: 220px;
    font-weight: 800;
    line-height: 1.35;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-actions{
    min-width: 260px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-inline-form{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-student-ids{
    min-width: 190px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-status-tag{
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 4px 9px;
    border-radius: 999px;
    background: #eef2f7;
    color: #334155;
    font-size: 12px;
    font-weight: 900;
    text-transform: capitalize;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-status-tag--completed,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-status-tag--active,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-status-tag--published{
    background: #dcfce7;
    color: #166534;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-status-tag--failed,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-status-tag--blocked,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-status-tag--cancelled{
    background: #fee2e2;
    color: #991b1b;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-status-tag--draft,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-status-tag--pending,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-status-tag--processing{
    background: #fef3c7;
    color: #92400e;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-generation-steps{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 14px 0 4px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-generation-steps span{
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 11px;
    border: 1px solid #dbeafe;
    border-radius: 999px;
    background: #eff6ff;
    color: #1e3a8a;
    font-size: 12px;
    font-weight: 850;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-guided-empty > .dashicons{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin-bottom: 8px;
    border-radius: 50%;
    background: #e8f7ef;
    color: #2f7d58;
    font-size: 18px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-blocked-action{
    max-width: 520px;
    padding: 16px;
    border: 1px dashed #fecaca;
    border-radius: 8px;
    background: #fff7f7;
    color: #7f1d1d;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-blocked-action strong{
    display: block;
    margin-bottom: 6px;
    color: #991b1b;
    font-size: 13px;
    font-weight: 900;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-blocked-action p{
    margin: 0;
    color: #7f1d1d;
    font-size: 13px;
    line-height: 1.45;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-action-links{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-library-blocked-action .eap-teacher-library-action-links{
    margin-top: 12px;
    margin-bottom: 0;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-profile-summary-meta{
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-profile-summary-meta span{
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: normal;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-profile-snapshot-card{
    align-self: start;
    position: sticky;
    top: 18px;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-profile-snapshot{
    display: grid;
    gap: 12px;
    margin: 0;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-profile-snapshot div{
    display: grid;
    grid-template-columns: minmax(92px, 0.42fr) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding-bottom: 12px;
    border-bottom: 1px solid #e5edf6;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-profile-snapshot div:last-child{
    padding-bottom: 0;
    border-bottom: 0;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-profile-snapshot dt{
    color: #64748b;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-profile-snapshot dd{
    min-width: 0;
    margin: 0;
    color: #0f172a;
    font-weight: 800;
    overflow-wrap: anywhere;
}

@media (max-width: 1100px) {
    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-sessions-kpi-grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-profile-snapshot-card{
        position: static;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-card,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-card,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-card{
        grid-column: span 6 !important;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-col-12,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-col-12,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-col-12,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-col-12,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-inst-module-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-inst-module-card,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-inst-module-card,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-inst-module-card{
        grid-column: 1 / -1 !important;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-col-5,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-col-7{
        grid-column: span 12 !important;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-link-card .eap-card-body{
        align-items: flex-start;
        flex-direction: column;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-link-card .eap-btn{
        width: 100%;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-module__header{
        align-items: flex-start;
        flex-direction: column;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-kpis{
        grid-template-columns: repeat(3, minmax(0, 1fr));
        min-width: 0;
        width: 100%;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-focus-panel{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-sessions-kpi-grid{
        grid-template-columns: 1fr;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-session-action-row,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-session-action-row .button,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-inline-form,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-inline-form .button,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-inline-form input{
        width: 100%;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="teacher"] .eap-teacher-profile-snapshot div{
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-shell-inner{
        padding: 12px;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-mobile-menu-toggle{
        display: inline-flex !important;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-hero__main,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-topbar{
        align-items: flex-start !important;
        flex-direction: column;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution_admin"] .eap-dashboard-grid > .eap-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell[data-eap-role="institution"] .eap-dashboard-grid > .eap-card,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .pa-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-card,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-widget,
.eap-plugin-scope .eap-role-institution .eap-portal-shell.eap-viewport-shell .eap-dashboard-grid > .eap-card{
        grid-column: 1 / -1 !important;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-card,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-live-hub-panel{
        padding: 12px !important;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card .eap-inst-module-frame,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card .eap-inst-module-frame--has-fallback,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-compact-module-card .eap-inst-iframe{
        min-height: 560px !important;
        height: 560px !important;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-inst-join-kpis{
        grid-template-columns: 1fr;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-topbar-right,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-portal-tools{
        width: 100%;
        justify-content: space-between;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-tool-button--search{
        flex: 1;
    }

    .eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-summary-grid,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-overview-grid,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-student-profile-form-grid,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-focus-panel__metrics,
.eap-plugin-scope .eap-portal-shell.eap-viewport-shell .eap-premium-progress-grid{
        grid-template-columns: 1fr;
    }
}
.eap-plugin-scope .eap-role-preview-notice{
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 14px 24px 0;
    padding: 12px 14px;
    border: 1px solid #f59e0b;
    border-radius: 10px;
    background: #fffbeb;
    color: #78350f;
    line-height: 1.45;
}

.eap-plugin-scope .eap-role-preview-notice .dashicons{
    flex: 0 0 auto;
    color: #d97706;
    margin-top: 2px;
}

.eap-plugin-scope .eap-role-preview-notice strong{
    display: block;
}

.eap-plugin-scope [data-eap-theme="dark"] .eap-role-preview-notice{
    background: #422006;
    color: #fef3c7;
    border-color: #d97706;
}

/* ===== SOURCE: eap-dashboard-freeze.css ===== */
/**
 * EAP Dashboard Freeze
 * Final shared UI layer for all plugin-owned frontend dashboards and menus.
 */

.eap-plugin-scope .eap-viewport-shell,
.eap-plugin-scope .eap-viewport-shell *{
    box-sizing: border-box;
    letter-spacing: 0 !important;
}

.eap-plugin-scope .eap-viewport-shell{
    --eap-freeze-bg: #f5f8fb;
    --eap-freeze-surface: #ffffff;
    --eap-freeze-surface-soft: #f8fafc;
    --eap-freeze-border: #dbe4ee;
    --eap-freeze-border-strong: #c9d6e4;
    --eap-freeze-text: #0f172a;
    --eap-freeze-muted: #64748b;
    --eap-freeze-green: #2f855a;
    --eap-freeze-blue: #2563eb;
    --eap-freeze-cyan: #0e7490;
    --eap-freeze-amber: #b45309;
    --eap-freeze-red: #b91c1c;
    --eap-freeze-violet: #6d28d9;
    --eap-freeze-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
    --eap-freeze-shadow-strong: 0 20px 48px rgba(15, 23, 42, 0.14);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    color: var(--eap-freeze-text) !important;
    background: linear-gradient(180deg, #f8fbff 0%, var(--eap-freeze-bg) 100%) !important;
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="teacher"]{
    --eap-role-accent: var(--eap-freeze-green);
    --eap-role-accent-soft: #ecfdf5;
    --eap-role-sidebar: linear-gradient(180deg, #215b43 0%, #2f7659 48%, #143827 100%);
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="student"]{
    --eap-role-accent: var(--eap-freeze-cyan);
    --eap-role-accent-soft: #ecfeff;
    --eap-role-sidebar: linear-gradient(180deg, #164e63 0%, #0e7490 52%, #123846 100%);
}

.eap-plugin-scope .eap-viewport-shell[data-eap-role="institution_admin"],
.eap-plugin-scope .eap-viewport-shell[data-eap-role="super_admin"]{
    --eap-role-accent: var(--eap-freeze-blue);
    --eap-role-accent-soft: #eff6ff;
    --eap-role-sidebar: linear-gradient(180deg, #1e3a8a 0%, #3651b8 50%, #172554 100%);
}

.eap-plugin-scope .eap-shell-inner,
.eap-plugin-scope .eap-dashboard-app-wrap{
    background: transparent !important;
}

.eap-plugin-scope .eap-sidebar{
    width: 286px !important;
    min-width: 286px !important;
    max-width: 286px !important;
    margin: 18px 0 18px 24px !important;
    height: calc(100% - 36px) !important;
    padding: 22px 18px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 14px !important;
    background: var(--eap-role-sidebar) !important;
    box-shadow: 18px 0 42px rgba(15, 23, 42, 0.18) !important;
    color: rgba(255, 255, 255, 0.84) !important;
}

.eap-plugin-scope .eap-sidebar-top{
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    gap: 18px !important;
}

.eap-plugin-scope .eap-sidebar-logo{
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: auto !important;
    margin: 0 !important;
    padding: 10px 10px 18px !important;
}

.eap-plugin-scope .eap-logo-mark{
    width: 46px !important;
    height: 46px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    background: rgba(255, 255, 255, 0.12) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

.eap-plugin-scope .eap-logo-name{
    color: #ffffff !important;
    font-size: 20px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-logo-sub{
    margin-top: 6px !important;
    color: rgba(255, 255, 255, 0.66) !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
}

.eap-plugin-scope .eap-sidebar-toggle,
.eap-plugin-scope .eap-mobile-menu-toggle{
    width: 38px !important;
    height: 38px !important;
    display: grid !important;
    place-items: center !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.10) !important;
    color: #ffffff !important;
    padding: 0 !important;
}

.eap-plugin-scope .eap-sidebar-nav{
    display: grid !important;
    gap: 7px !important;
    padding: 0 4px !important;
}

.eap-plugin-scope .eap-nav-link{
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 14px !important;
    border: 1px solid transparent !important;
    border-radius: 10px !important;
    color: rgba(255, 255, 255, 0.76) !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    transition: background 160ms ease, color 160ms ease, border-color 160ms ease, transform 160ms ease !important;
}

.eap-plugin-scope .eap-nav-link:hover,
.eap-plugin-scope .eap-nav-link:focus-visible{
    outline: none !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    background: rgba(255, 255, 255, 0.10) !important;
    color: #ffffff !important;
    transform: translateX(2px) !important;
}

.eap-plugin-scope .eap-nav-link.active,
.eap-plugin-scope .eap-nav-link[aria-current="page"]{
    border-color: rgba(255, 255, 255, 0.20) !important;
    background: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
    box-shadow: inset 4px 0 0 rgba(255, 255, 255, 0.72), 0 10px 22px rgba(0, 0, 0, 0.14) !important;
}

.eap-plugin-scope .eap-nav-icon{
    width: 20px !important;
    height: 20px !important;
    display: inline-grid !important;
    place-items: center !important;
    color: currentColor !important;
    opacity: 0.9 !important;
}

.eap-plugin-scope .eap-nav-label{
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.eap-plugin-scope .eap-sidebar-footer{
    margin-top: auto !important;
    padding-top: 18px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.20) !important;
}

.eap-plugin-scope .eap-sidebar-user{
    min-height: 58px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 10px !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.10) !important;
    box-shadow: none !important;
}

.eap-plugin-scope .eap-sidebar-avatar-img,
.eap-plugin-scope .eap-avatar-img{
    border-radius: 12px !important;
    object-fit: cover !important;
}

.eap-plugin-scope .eap-sidebar-user-name,
.eap-plugin-scope .eap-sidebar-user-role{
    display: block !important;
    max-width: 172px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.eap-plugin-scope .eap-sidebar-user-name{
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-sidebar-user-role{
    margin-top: 3px !important;
    color: rgba(255, 255, 255, 0.68) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
}

.eap-plugin-scope .eap-sidebar-logout{
    min-height: 40px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: 10px !important;
    padding: 8px 12px !important;
    border-radius: 10px !important;
    color: rgba(255, 255, 255, 0.78) !important;
    text-decoration: none !important;
    font-weight: 800 !important;
}

.eap-plugin-scope .eap-sidebar-logout:hover{
    background: rgba(255, 255, 255, 0.10) !important;
    color: #ffffff !important;
}

.eap-plugin-scope .eap-main{
    min-width: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

.eap-plugin-scope .eap-topbar{
    position: sticky !important;
    top: 0 !important;
    z-index: 30 !important;
    min-height: 132px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 22px 28px !important;
    border-bottom: 1px solid rgba(219, 228, 238, 0.78) !important;
    background: rgba(245, 248, 251, 0.90) !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.05) !important;
    backdrop-filter: blur(18px) !important;
}

.eap-plugin-scope .eap-topbar-left{
    display: grid !important;
    gap: 6px !important;
    min-width: 0 !important;
}

.eap-plugin-scope .eap-shell-kicker,
.eap-plugin-scope .eap-role-badge{
    display: inline-flex !important;
    width: max-content !important;
    align-items: center !important;
    min-height: 28px !important;
    padding: 6px 11px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-shell-kicker{
    border: 1px solid #d8eee4 !important;
    background: var(--eap-role-accent-soft) !important;
    color: var(--eap-role-accent) !important;
}

.eap-plugin-scope .eap-role-badge{
    border: 1px solid #dbeafe !important;
    background: #eff6ff !important;
    color: #1d4ed8 !important;
}

.eap-plugin-scope .eap-page-title{
    margin: 4px 0 0 !important;
    color: var(--eap-freeze-text) !important;
    font-size: clamp(26px, 3vw, 38px) !important;
    line-height: 1.08 !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-page-subtitle{
    max-width: 880px !important;
    margin: 0 !important;
    color: var(--eap-freeze-muted) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.55 !important;
}

.eap-plugin-scope .eap-topbar-right,
.eap-plugin-scope .eap-portal-tools{
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.eap-plugin-scope .eap-tool-button,
.eap-plugin-scope .eap-user-chip,
.eap-plugin-scope .eap-command-btn,
.eap-plugin-scope .eap-notification-close,
.eap-plugin-scope .eap-search-panel__bar button{
    border: 1px solid var(--eap-freeze-border) !important;
    border-radius: 12px !important;
    background: var(--eap-freeze-surface) !important;
    color: var(--eap-freeze-text) !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06) !important;
}

.eap-plugin-scope .eap-tool-button{
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 0 14px !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    cursor: pointer !important;
}

.eap-plugin-scope .eap-tool-button--notifications{
    position: relative !important;
    width: 46px !important;
    padding: 0 !important;
}

.eap-plugin-scope .eap-notification-count{
    position: absolute !important;
    top: -8px !important;
    right: -6px !important;
    min-width: 21px !important;
    height: 21px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 999px !important;
    background: #e11d48 !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-user-chip{
    min-height: 54px !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 14px 8px 8px !important;
}

.eap-plugin-scope .eap-user-chip-name,
.eap-plugin-scope .eap-user-chip-role{
    display: block !important;
    max-width: 150px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.eap-plugin-scope .eap-user-chip-name{
    color: var(--eap-freeze-text) !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-user-chip-role{
    margin-top: 2px !important;
    color: var(--eap-role-accent) !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

.eap-plugin-scope .eap-command-strip{
    margin: 22px 28px 0 !important;
    padding: 18px !important;
    border: 1px solid var(--eap-freeze-border) !important;
    border-radius: 14px !important;
    background: var(--eap-freeze-surface) !important;
    box-shadow: var(--eap-freeze-shadow) !important;
}

.eap-plugin-scope .eap-command-strip__eyebrow{
    color: var(--eap-role-accent) !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-command-strip__copy strong{
    color: var(--eap-freeze-text) !important;
    font-size: 16px !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-command-btn{
    min-height: 42px !important;
    padding: 0 15px !important;
    text-decoration: none !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-command-btn--primary{
    border-color: transparent !important;
    background: var(--eap-role-accent) !important;
    color: #ffffff !important;
}

.eap-plugin-scope .eap-content{
    padding: 24px 28px 34px !important;
}

.eap-plugin-scope .eap-dashboard-grid{
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 18px !important;
    align-items: start !important;
}

.eap-plugin-scope .eap-col-12,
.eap-plugin-scope .eap-card-col-12{
    grid-column: span 12 !important;
}

.eap-plugin-scope .eap-col-8,
.eap-plugin-scope .eap-card-col-8{
    grid-column: span 8 !important;
}

.eap-plugin-scope .eap-col-6,
.eap-plugin-scope .eap-card-col-6{
    grid-column: span 6 !important;
}

.eap-plugin-scope .eap-col-4,
.eap-plugin-scope .eap-card-col-4{
    grid-column: span 4 !important;
}

.eap-plugin-scope .eap-col-3,
.eap-plugin-scope .eap-card-col-3{
    grid-column: span 3 !important;
}

.eap-plugin-scope .eap-widget,
.eap-plugin-scope .eap-card,
.eap-plugin-scope .eap-kpi-card,
.eap-plugin-scope .eap-list-item,
.eap-plugin-scope .eap-panel,
.eap-plugin-scope .eap-empty-state,
.eap-plugin-scope .eap-table-responsive{
    border: 1px solid var(--eap-freeze-border) !important;
    border-radius: 14px !important;
    background: var(--eap-freeze-surface) !important;
    box-shadow: var(--eap-freeze-shadow) !important;
    color: var(--eap-freeze-text) !important;
}

.eap-plugin-scope .eap-widget{
    overflow: hidden !important;
}

.eap-plugin-scope .eap-widget-header{
    min-height: 58px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 18px 22px 14px !important;
    border-top: 5px solid var(--eap-role-accent) !important;
    border-bottom: 1px solid #edf2f7 !important;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
}

.eap-plugin-scope .eap-card-title,
.eap-plugin-scope .eap-widget h2,
.eap-plugin-scope .eap-widget h3{
    margin: 0 !important;
    color: var(--eap-freeze-text) !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-card-body{
    padding: 20px 22px 22px !important;
    color: var(--eap-freeze-text) !important;
}

.eap-plugin-scope .eap-card-body p,
.eap-plugin-scope .eap-widget p{
    color: var(--eap-freeze-muted);
    line-height: 1.6;
}

.eap-plugin-scope .eap-widget:hover,
.eap-plugin-scope .eap-card:hover{
    box-shadow: var(--eap-freeze-shadow-strong) !important;
}

.eap-plugin-scope .eap-btn,
.eap-plugin-scope .eap-btn-action,
.eap-plugin-scope .eap-command-btn,
.eap-plugin-scope .eap-dashboard-shell button,
.eap-plugin-scope .eap-dashboard-shell input[type="submit"],
.eap-plugin-scope .eap-dashboard-shell .button{
    appearance: none !important;
    min-height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border-radius: 999px !important;
    border: 1px solid var(--eap-freeze-border) !important;
    background: #eef2f7 !important;
    color: var(--eap-freeze-text) !important;
    padding: 10px 18px !important;
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

.eap-plugin-scope .eap-btn--primary,
.eap-plugin-scope .eap-dashboard-shell .button-primary,
.eap-plugin-scope .eap-dashboard-shell input[type="submit"].primary,
.eap-plugin-scope .eap-dashboard-shell input[type="submit"].eap-btn--primary{
    border-color: transparent !important;
    background: var(--eap-role-accent) !important;
    color: #ffffff !important;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.14) !important;
}

.eap-plugin-scope .eap-btn:hover,
.eap-plugin-scope .eap-dashboard-shell button:hover,
.eap-plugin-scope .eap-dashboard-shell input[type="submit"]:hover,
.eap-plugin-scope .eap-dashboard-shell .button:hover{
    transform: translateY(-1px) !important;
}

.eap-plugin-scope .eap-dashboard-shell button:disabled,
.eap-plugin-scope .eap-dashboard-shell input:disabled,
.eap-plugin-scope .eap-dashboard-shell select:disabled,
.eap-plugin-scope .eap-dashboard-shell textarea:disabled{
    opacity: 0.58 !important;
    cursor: not-allowed !important;
}

.eap-plugin-scope .eap-dashboard-shell input[type="text"],
.eap-plugin-scope .eap-dashboard-shell input[type="email"],
.eap-plugin-scope .eap-dashboard-shell input[type="password"],
.eap-plugin-scope .eap-dashboard-shell input[type="url"],
.eap-plugin-scope .eap-dashboard-shell input[type="tel"],
.eap-plugin-scope .eap-dashboard-shell input[type="number"],
.eap-plugin-scope .eap-dashboard-shell input[type="datetime-local"],
.eap-plugin-scope .eap-dashboard-shell input[type="search"],
.eap-plugin-scope .eap-dashboard-shell input[type="file"],
.eap-plugin-scope .eap-dashboard-shell select,
.eap-plugin-scope .eap-dashboard-shell textarea{
    width: 100% !important;
    min-height: 46px !important;
    border: 1px solid var(--eap-freeze-border) !important;
    border-radius: 11px !important;
    background: #fbfdff !important;
    color: var(--eap-freeze-text) !important;
    padding: 11px 13px !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    box-shadow: inset 0 1px 0 rgba(15, 23, 42, 0.02) !important;
}

.eap-plugin-scope .eap-dashboard-shell textarea{
    min-height: 104px !important;
    resize: vertical !important;
}

.eap-plugin-scope .eap-dashboard-shell input:focus,
.eap-plugin-scope .eap-dashboard-shell select:focus,
.eap-plugin-scope .eap-dashboard-shell textarea:focus{
    outline: none !important;
    border-color: var(--eap-role-accent) !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(47, 133, 90, 0.14) !important;
}

.eap-plugin-scope .eap-dashboard-shell input[type="checkbox"],
.eap-plugin-scope .eap-dashboard-shell input[type="radio"]{
    width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    padding: 0 !important;
    accent-color: var(--eap-role-accent) !important;
}

.eap-plugin-scope .eap-form-group,
.eap-plugin-scope .eap-field,
.eap-plugin-scope .eap-filter-group{
    display: grid !important;
    gap: 8px !important;
}

.eap-plugin-scope .eap-dashboard-shell label{
    color: #172033 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-form-help,
.eap-plugin-scope .eap-help-text,
.eap-plugin-scope .eap-muted,
.eap-plugin-scope .eap-subtext,
.eap-plugin-scope .eap-card-desc,
.eap-plugin-scope .eap-page-help,
.eap-plugin-scope .eap-dashboard-shell small{
    color: var(--eap-freeze-muted) !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
}

.eap-plugin-scope .eap-table-responsive{
    overflow: auto !important;
}

.eap-plugin-scope .eap-table{
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    margin: 0 !important;
    background: #ffffff !important;
}

.eap-plugin-scope .eap-table thead th,
.eap-plugin-scope .eap-dashboard-shell table thead th{
    background: var(--eap-freeze-surface-soft) !important;
    color: var(--eap-freeze-muted) !important;
    padding: 14px 16px !important;
    border-bottom: 1px solid var(--eap-freeze-border) !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    text-align: left !important;
    text-transform: uppercase !important;
}

.eap-plugin-scope .eap-table tbody td,
.eap-plugin-scope .eap-dashboard-shell table tbody td{
    padding: 15px 16px !important;
    border-bottom: 1px solid #edf2f7 !important;
    color: #172033 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    vertical-align: top !important;
}

.eap-plugin-scope .eap-table tbody tr:nth-child(even) td{
    background: #fbfdff !important;
}

.eap-plugin-scope .eap-table tbody tr:last-child td{
    border-bottom: 0 !important;
}

.eap-plugin-scope .eap-badge,
.eap-plugin-scope .eap-status-pill,
.eap-plugin-scope .eap-status-tag,
.eap-plugin-scope .eap-teacher-status-tag,
.eap-plugin-scope .eap-teacher-status-badge,
.eap-plugin-scope .eap-pill{
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-height: 28px !important;
    padding: 6px 10px !important;
    border-radius: 999px !important;
    border: 1px solid #dbeafe !important;
    background: #eff6ff !important;
    color: #1d4ed8 !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

.eap-plugin-scope .is-completed,
.eap-plugin-scope .is-success,
.eap-plugin-scope .eap-status-success,
.eap-plugin-scope .eap-teacher-status-tag--completed,
.eap-plugin-scope .eap-teacher-status-badge--completed,
.eap-plugin-scope .eap-teacher-status-badge--ended{
    border-color: #bbf7d0 !important;
    background: #f0fdf4 !important;
    color: #166534 !important;
}

.eap-plugin-scope .is-pending,
.eap-plugin-scope .is-warning,
.eap-plugin-scope .eap-status-warning,
.eap-plugin-scope .eap-teacher-status-tag--pending,
.eap-plugin-scope .eap-teacher-status-tag--draft,
.eap-plugin-scope .eap-teacher-status-badge--scheduled,
.eap-plugin-scope .eap-teacher-status-badge--draft{
    border-color: #fde68a !important;
    background: #fffbeb !important;
    color: #92400e !important;
}

.eap-plugin-scope .eap-teacher-status-badge--live,
.eap-plugin-scope .eap-teacher-status-badge--active{
    border-color: #bbf7d0 !important;
    background: #dcfce7 !important;
    color: #15803d !important;
}

.eap-plugin-scope .is-failed,
.eap-plugin-scope .is-error,
.eap-plugin-scope .eap-status-error,
.eap-plugin-scope .eap-teacher-status-tag--failed,
.eap-plugin-scope .eap-teacher-status-tag--blocked,
.eap-plugin-scope .eap-teacher-status-badge--cancelled,
.eap-plugin-scope .eap-teacher-status-badge--failed{
    border-color: #fecaca !important;
    background: #fef2f2 !important;
    color: #991b1b !important;
}

.eap-plugin-scope .eap-empty-state,
.eap-plugin-scope .eap-teacher-empty,
.eap-plugin-scope .eap-student-empty{
    display: grid !important;
    place-items: center !important;
    min-height: 190px !important;
    padding: 28px !important;
    border: 1px dashed var(--eap-freeze-border-strong) !important;
    border-radius: 14px !important;
    background: var(--eap-freeze-surface-soft) !important;
    box-shadow: none !important;
    text-align: center !important;
}

.eap-plugin-scope .eap-empty-state strong,
.eap-plugin-scope .eap-teacher-empty strong,
.eap-plugin-scope .eap-student-empty strong{
    color: var(--eap-freeze-text) !important;
    font-size: 15px !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-alert,
.eap-plugin-scope .eap-notice,
.eap-plugin-scope .settings-error,
.eap-plugin-scope .notice{
    border-radius: 12px !important;
    border: 1px solid var(--eap-freeze-border) !important;
    background: #ffffff !important;
    box-shadow: var(--eap-freeze-shadow) !important;
    padding: 12px 14px !important;
}

.eap-plugin-scope .eap-notification-drawer,
.eap-plugin-scope .eap-search-panel{
    border: 1px solid var(--eap-freeze-border) !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    box-shadow: 0 28px 70px rgba(15, 23, 42, 0.22) !important;
}

.eap-plugin-scope .eap-notification-item,
.eap-plugin-scope .eap-search-result{
    border: 1px solid var(--eap-freeze-border) !important;
    border-radius: 12px !important;
    background: var(--eap-freeze-surface-soft) !important;
    text-decoration: none !important;
}

.eap-plugin-scope .eap-search-panel__bar input{
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

.eap-plugin-scope .eap-live-room-wrap{
    display: grid !important;
    gap: 18px !important;
}

.eap-plugin-scope .eap-live-panel,
.eap-plugin-scope .eap-peer-chat-panel,
.eap-plugin-scope .eap-live-controls,
.eap-plugin-scope .eap-live-transcript{
    border: 1px solid var(--eap-freeze-border) !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    box-shadow: var(--eap-freeze-shadow) !important;
}

.eap-plugin-scope .eap-live-room-head{
    display: flex !important;
    justify-content: space-between !important;
    gap: 16px !important;
    align-items: center !important;
    padding: 18px 20px !important;
    border: 1px solid var(--eap-freeze-border) !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
    box-shadow: var(--eap-freeze-shadow) !important;
}

.eap-plugin-scope .eap-live-room-head-actions{
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}

.eap-plugin-scope .eap-live-teacher-actionbar{
    position: sticky !important;
    top: 12px !important;
    z-index: 50 !important;
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px 16px !important;
    border: 1px solid #fecaca !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, .97) !important;
    color: #7f1d1d !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .14) !important;
    backdrop-filter: blur(10px) !important;
}

.eap-plugin-scope .eap-live-teacher-actionbar span{
    color: #64748b !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

.eap-plugin-scope .eap-live-room-title{
    margin: 0 !important;
    color: var(--eap-freeze-text) !important;
    font-size: 24px !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-live-room-code{
    margin: 6px 0 0 !important;
    color: var(--eap-freeze-muted) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

.eap-plugin-scope .eap-live-room-code strong{
    color: var(--eap-freeze-text) !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important;
}

.eap-plugin-scope .eap-live-panel{
    padding: 18px !important;
}

.eap-plugin-scope .eap-live-panel-kicker{
    margin-bottom: 10px !important;
    color: var(--eap-role-accent, #2f855a) !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

.eap-plugin-scope .eap-live-panel-detail,
.eap-plugin-scope .eap-live-subtle-status{
    color: var(--eap-freeze-muted) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
}

.eap-plugin-scope .eap-live-launch-state,
.eap-plugin-scope .eap-live-health-grid,
.eap-plugin-scope .eap-live-recording-text,
.eap-plugin-scope .eap-peer-chat-title,
.eap-plugin-scope .eap-peer-chat-row,
.eap-plugin-scope .eap-live-student-hint,
.eap-plugin-scope .eap-live-language-label{
    color: var(--eap-freeze-text) !important;
}

.eap-plugin-scope .eap-live-input,
.eap-plugin-scope .eap-live-room-wrap select,
.eap-plugin-scope .eap-live-room-wrap textarea,
.eap-plugin-scope .eap-live-room-wrap input{
    border: 1px solid #cbd5e1 !important;
    background: #ffffff !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, .04) !important;
}

.eap-plugin-scope .eap-live-input::placeholder,
.eap-plugin-scope .eap-live-room-wrap textarea::placeholder,
.eap-plugin-scope .eap-live-room-wrap input::placeholder{
    color: #64748b !important;
    opacity: 1 !important;
}

.eap-plugin-scope .eap-peer-chat-messages{
    min-height: 110px !important;
    background: #f8fafc !important;
}

.eap-plugin-scope .eap-peer-chat-row{
    background: #ffffff !important;
    border-color: #dbe5f0 !important;
}

.eap-plugin-scope .eap-peer-chat-row > div:last-child,
.eap-plugin-scope .eap-peer-chat-empty{
    color: #334155 !important;
}

.eap-plugin-scope .eap-live-transcript{
    min-height: 240px !important;
    height: min(40vh, 380px) !important;
    color: #0f172a !important;
}

.eap-plugin-scope .eap-live-diagnostics-summary{
    cursor: pointer !important;
    color: #475569 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    list-style-position: inside !important;
}

.eap-plugin-scope .eap-live-panel--health[open] .eap-live-health-grid{
    margin-top: 14px !important;
    padding-top: 14px !important;
    border-top: 1px solid #e2e8f0 !important;
}

.eap-plugin-scope .eap-live-transcript-empty,
.eap-plugin-scope .eap-transcript-placeholder{
    color: #64748b !important;
}

@media (max-width: 760px) {
    .eap-plugin-scope .eap-live-room-wrap{ padding: 10px !important; }
    .eap-plugin-scope .eap-live-room-head{ align-items: flex-start !important; flex-direction: column !important; }
    .eap-plugin-scope .eap-live-room-head-actions{ width: 100% !important; justify-content: space-between !important; }
    .eap-plugin-scope .eap-live-teacher-actionbar{ grid-template-columns: 1fr auto !important; }
    .eap-plugin-scope .eap-live-teacher-actionbar span{ display: none !important; }
    .eap-plugin-scope .eap-live-form-row,
.eap-plugin-scope .eap-peer-chat-form{ flex-direction: column !important; }
    .eap-plugin-scope .eap-live-input,
.eap-plugin-scope .eap-live-form-row .eap-btn,
.eap-plugin-scope .eap-peer-chat-form .eap-btn{ width: 100% !important; min-width: 0 !important; }
}

.eap-plugin-scope .eap-live-panel--material,
.eap-plugin-scope .eap-live-panel--material-viewer{
    border-color: #d8eee4 !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fffb 100%) !important;
}

.eap-plugin-scope .eap-live-panel--material{
    display: grid !important;
    gap: 12px !important;
}

.eap-plugin-scope .eap-live-material-share-row{
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) auto auto !important;
    gap: 10px !important;
    align-items: center !important;
}

.eap-plugin-scope .eap-live-material-viewer{
    display: grid !important;
    gap: 12px !important;
}

.eap-plugin-scope .eap-live-material-shell{
    padding-top: 4px !important;
}

.eap-plugin-scope .eap-live-material-head{
    padding: 14px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
}

.eap-plugin-scope .eap-live-material-title{
    color: var(--eap-freeze-text) !important;
    font-weight: 900 !important;
}

.eap-plugin-scope .eap-live-material-meta{
    font-weight: 800 !important;
}

.eap-plugin-scope .eap-live-material-frame,
.eap-plugin-scope .eap-live-material-text,
.eap-plugin-scope .eap-live-material-viewer iframe,
.eap-plugin-scope .eap-live-material-viewer img,
.eap-plugin-scope .eap-live-material-viewer audio{
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08) !important;
}

.eap-plugin-scope .eap-live-material-formula-note,
.eap-plugin-scope .eap-live-material-hint{
    border: 1px solid currentColor !important;
    border-color: color-mix(in srgb, currentColor 22%, transparent) !important;
    font-weight: 800 !important;
}

.eap-plugin-scope .eap-live-controls{
    display: grid !important;
    gap: 14px !important;
    padding: 18px !important;
}

.eap-plugin-scope .eap-live-form-row{
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    align-items: center !important;
}

@media (max-width: 1180px) {
    .eap-plugin-scope .eap-sidebar{
        width: 248px !important;
        min-width: 248px !important;
        max-width: 248px !important;
        margin-left: 14px !important;
    }

    .eap-plugin-scope .eap-col-8,
.eap-plugin-scope .eap-col-6,
.eap-plugin-scope .eap-col-4,
.eap-plugin-scope .eap-col-3,
.eap-plugin-scope .eap-card-col-8,
.eap-plugin-scope .eap-card-col-6,
.eap-plugin-scope .eap-card-col-4,
.eap-plugin-scope .eap-card-col-3{
        grid-column: span 12 !important;
    }
}

@media (max-width: 860px) {
    .eap-plugin-scope .eap-shell-inner,
.eap-plugin-scope .eap-dashboard-app-wrap{
        flex-direction: column !important;
    }

    .eap-plugin-scope .eap-sidebar{
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        height: auto !important;
        max-height: 42vh !important;
        margin: 10px !important;
        padding: 14px !important;
    }

    .eap-plugin-scope .eap-sidebar-logo{
        padding: 4px !important;
    }

    .eap-plugin-scope .eap-sidebar-nav{
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        overflow: auto !important;
    }

    .eap-plugin-scope .eap-sidebar-footer{
        display: none !important;
    }

    .eap-plugin-scope .eap-live-material-share-row{
        grid-template-columns: 1fr !important;
    }

    .eap-plugin-scope .eap-main{
        overflow: auto !important;
    }

    .eap-plugin-scope .eap-topbar{
        position: relative !important;
        min-height: auto !important;
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 18px !important;
    }

    .eap-plugin-scope .eap-topbar-right{
        justify-content: space-between !important;
    }

    .eap-plugin-scope .eap-command-strip,
.eap-plugin-scope .eap-content{
        margin-left: 14px !important;
        margin-right: 14px !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .eap-plugin-scope .eap-content{
        margin: 0 !important;
        padding: 16px 14px 24px !important;
    }
}

@media (max-width: 560px) {
    .eap-plugin-scope .eap-dashboard-grid{
        grid-template-columns: 1fr !important;
    }

    .eap-plugin-scope .eap-col-12,
.eap-plugin-scope .eap-col-8,
.eap-plugin-scope .eap-col-6,
.eap-plugin-scope .eap-col-4,
.eap-plugin-scope .eap-col-3,
.eap-plugin-scope .eap-card-col-12,
.eap-plugin-scope .eap-card-col-8,
.eap-plugin-scope .eap-card-col-6,
.eap-plugin-scope .eap-card-col-4,
.eap-plugin-scope .eap-card-col-3{
        grid-column: 1 / -1 !important;
    }

    .eap-plugin-scope .eap-sidebar-nav{
        grid-template-columns: 1fr !important;
    }

    .eap-plugin-scope .eap-page-title{
        font-size: 26px !important;
    }

    .eap-plugin-scope .eap-user-chip{
        width: 100% !important;
    }

    .eap-plugin-scope .eap-tool-button--search span:last-child,
.eap-plugin-scope .eap-user-chip-info{
        display: none !important;
    }

    .eap-plugin-scope .eap-card-body,
.eap-plugin-scope .eap-widget-header{
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

/* ==========================================================================
   FRONTEND CONTAINMENT OVERRIDES — v1.6.19

   Full-viewport dashboards are allowed only on pages dedicated to an EAP
   portal shortcode. When an EAP shortcode is embedded in an ordinary theme
   page, it stays in document flow and cannot cover the site header/footer.
   ========================================================================== */
.eap-plugin-scope.eap-plugin-scope--embedded {
    position: relative;
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    isolation: isolate;
}

.eap-plugin-scope.eap-plugin-scope--embedded .eap-viewport-shell {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 720px !important;
    overflow: visible !important;
    z-index: auto !important;
}

.eap-plugin-scope.eap-plugin-scope--embedded .eap-shell-inner,
.eap-plugin-scope.eap-plugin-scope--embedded .eap-dashboard-app-wrap {
    height: auto !important;
    min-height: 720px !important;
}

.eap-plugin-scope.eap-plugin-scope--embedded .eap-main {
    min-height: 720px;
    overflow: visible !important;
}

@media (max-width: 782px) {
    .eap-plugin-scope.eap-plugin-scope--embedded .eap-viewport-shell,
    .eap-plugin-scope.eap-plugin-scope--embedded .eap-shell-inner,
    .eap-plugin-scope.eap-plugin-scope--embedded .eap-dashboard-app-wrap,
    .eap-plugin-scope.eap-plugin-scope--embedded .eap-main {
        min-height: 600px !important;
    }

    .eap-plugin-scope.eap-plugin-scope--embedded .eap-sidebar {
        position: absolute !important;
    }
}

/* ─── 100. Frontend Polish & Accessibility Overrides ─────────────────────── */
/* 1. Strictly hide skip-to-content accessibility links when not focused to prevent heading overlap */
.skip-link:not(:focus),
.screen-reader-text:not(:focus),
a.skip-link:not(:focus),
a[href="#content"]:not(:focus),
a[href="#main"]:not(:focus),
a[href="#primary"]:not(:focus) {
    position: absolute !important;
    top: -9999px !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
    padding: 0 !important;
    margin: -1px !important;
}

.skip-link:focus,
.screen-reader-text:focus,
a.skip-link:focus,
a[href="#content"]:focus,
a[href="#main"]:focus,
a[href="#primary"]:focus {
    position: fixed !important;
    top: 16px !important;
    left: 16px !important;
    z-index: 999999 !important;
    width: auto !important;
    height: auto !important;
    clip: auto !important;
    clip-path: none !important;
    background: #ffffff !important;
    color: #0f172a !important;
    padding: 10px 18px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    border-radius: 8px !important;
    border: 2px solid #3b82f6 !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.15) !important;
    text-decoration: none !important;
}

/* 2. Universal solid styling for primary buttons across all signup and login forms */
.eap-plugin-scope .pa-button-primary,
.eap-plugin-scope button[type="submit"].pa-button-primary,
.eap-plugin-scope input[type="submit"].pa-button-primary,
.eap-plugin-scope .eap-btn--primary,
.eap-plugin-scope button[type="submit"].eap-btn--primary,
.eap-plugin-scope input[type="submit"].eap-btn--primary,
.eap-signup-root .pa-button-primary,
.eap-signup-root .eap-btn--primary,
.eap-signup-root button[type="submit"] {
    background: #3b82f6 !important;
    color: #ffffff !important;
    border: none !important;
    font-weight: 800 !important;
    border-radius: 8px !important;
    padding: 13px 20px !important;
    box-shadow: 0 2px 4px rgba(59,130,246,0.25) !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.eap-plugin-scope .pa-button-primary:hover,
.eap-plugin-scope button[type="submit"].pa-button-primary:hover,
.eap-plugin-scope .eap-btn--primary:hover,
.eap-plugin-scope button[type="submit"].eap-btn--primary:hover,
.eap-signup-root .pa-button-primary:hover,
.eap-signup-root .eap-btn--primary:hover,
.eap-signup-root button[type="submit"]:hover {
    background: #1d4ed8 !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(59,130,246,0.35) !important;
}

/* 3. Clean layout for signup forms and footer notes */
.eap-signup-root .eap-auth-footer-note {
    margin-top: 24px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #64748b !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-align: center !important;
}

/* ==========================================================================
   4. CONNECTED ACADEMIC ECOSYSTEM SHELL (HEADER, FOOTER & LEGAL STYLES)
   ========================================================================== */
/* Hide duplicate WordPress theme header and footer whenever eap-connected-shell is rendered */
body:has(.eap-connected-shell) #masthead,
body:has(.eap-connected-shell) .site-header,
body:has(.eap-connected-shell) header[class*="ast-"],
body:has(.eap-connected-shell) .ast-main-header-wrap,
body:has(.eap-connected-shell) .ast-desktop-header,
body:has(.eap-connected-shell) .ast-mobile-header-wrap,
body:has(.eap-connected-shell) .site-footer,
body:has(.eap-connected-shell) #colophon,
body:has(.eap-connected-shell) footer[class*="ast-"] {
    display: none !important;
}

/* Universal document scrolling overrides when portal connected shell or legal pages render */
html {
    scroll-behavior: smooth !important;
}

html:has(.eap-connected-shell) {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    height: auto !important;
}

body:has(.eap-connected-shell),
body.eap-portal-template:has(.eap-connected-shell) {
    overflow: visible !important;
    overflow-y: visible !important;
    overflow-x: hidden !important;
    height: auto !important;
    min-height: 100vh !important;
}

.eap-legal-section {
    scroll-margin-top: 110px !important;
}

body.eap-portal-template .eap-connected-shell,
body.eap-portal-template .eap-legal-root,
body.eap-portal-template .eap-signup-root,
body.eap-portal-template .eap-login-root,
body.eap-portal-template .eap-auth-shell,
.eap-connected-shell .eap-viewport-shell,
.eap-legal-root,
.eap-signup-root,
.eap-login-root,
.eap-auth-shell {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

.eap-connected-shell {
    min-height: 100vh !important;
    display: flex !important;
    flex-direction: column !important;
    background: #0f172a !important;
    color: #f8fafc !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    isolation: isolate;
    overflow: visible !important;
}

.eap-auth-grid .eap-auth-card--signup {
    width: 100% !important;
    margin: 0 !important;
}

.eap-portal-site-header {
    position: relative !important;
    top: auto !important;
    z-index: 100000 !important;
    width: 100% !important;
    background: #0f172a !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
    flex-shrink: 0 !important;
}

.eap-portal-site-header__inner {
    max-width: 1440px !important;
    margin: 0 auto !important;
    padding: 16px 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 24px !important;
}

.eap-portal-brand {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    text-decoration: none !important;
    color: #ffffff !important;
}

.eap-portal-brand__logo {
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, #1e293b, #0f172a) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
}

.eap-portal-brand__text {
    display: flex !important;
    flex-direction: column !important;
}

.eap-portal-brand__title {
    font-size: 18px !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    color: #f8fafc !important;
    line-height: 1.2 !important;
}

.eap-portal-brand__subtitle {
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: #38bdf8 !important;
}

.eap-portal-nav {
    display: flex !important;
    align-items: center !important;
}

.eap-portal-nav__list {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.eap-portal-nav__link {
    padding: 8px 16px !important;
    border-radius: 9999px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #94a3b8 !important;
    text-decoration: none !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    border: 1px solid transparent !important;
    display: inline-block !important;
}

.eap-portal-nav__link:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    transform: translateY(-1px) !important;
}

.eap-portal-nav__link.is-active {
    color: #ffffff !important;
    background: rgba(14, 165, 233, 0.15) !important;
    border-color: rgba(14, 165, 233, 0.4) !important;
    box-shadow: 0 0 16px rgba(14, 165, 233, 0.2) !important;
}

.eap-portal-nav__link--highlight {
    background: linear-gradient(135deg, #0ea5e9, #2563eb) !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 14px rgba(14, 165, 233, 0.3) !important;
}

.eap-portal-nav__link--highlight:hover {
    background: linear-gradient(135deg, #0284c7, #1d4ed8) !important;
    box-shadow: 0 6px 20px rgba(14, 165, 233, 0.45) !important;
    transform: translateY(-1px) !important;
}

.eap-connected-content {
    flex: 1 0 auto !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    padding: 32px 20px 64px 20px !important;
    width: 100% !important;
    max-width: 100% !important;
}

.eap-portal-site-footer {
    width: 100% !important;
    background: #0b1120 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
    padding: 36px 32px !important;
    margin-top: auto !important;
    flex-shrink: 0 !important;
}

.eap-portal-site-footer__inner {
    max-width: 1440px !important;
    margin: 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
}

.eap-portal-footer-copyright {
    font-size: 14px !important;
    color: #cbd5e1 !important;
    margin: 0 0 6px 0 !important;
}

.eap-portal-footer-tagline {
    font-size: 13px !important;
    color: #64748b !important;
    margin: 0 !important;
    max-width: 650px !important;
    line-height: 1.5 !important;
}

.eap-portal-footer-links {
    display: flex !important;
    align-items: center !important;
    gap: 24px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.eap-portal-footer-link {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #94a3b8 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.eap-portal-footer-link:hover,
.eap-portal-footer-link.is-active {
    color: #38bdf8 !important;
    text-decoration: underline !important;
}

/* Legal & Terms Rich High-Contrast Document Layout */
.eap-legal-root {
    width: 100% !important;
    max-width: 1320px !important;
    margin: 0 auto !important;
}

body.eap-portal-template .eap-legal-card,
.eap-connected-shell .eap-legal-card,
.eap-legal-card {
    background: #ffffff !important;
    color: #0f172a !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.2) !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    padding: 0 !important;
    width: 100% !important;
    margin: 0 auto !important;
}

body.eap-portal-template .eap-legal-head,
.eap-connected-shell .eap-legal-head,
.eap-legal-head {
    padding: 44px 52px !important;
    background: linear-gradient(135deg, #0f172a, #1e293b) !important;
    border-bottom: 1px solid #334155 !important;
    color: #ffffff !important;
}

body.eap-portal-template .eap-legal-head *,
.eap-connected-shell .eap-legal-head *,
.eap-legal-head * {
    color: #ffffff !important;
}

body.eap-portal-template .eap-legal-head .eap-legal-subtitle,
.eap-connected-shell .eap-legal-head .eap-legal-subtitle,
.eap-legal-head .eap-legal-subtitle {
    color: #94a3b8 !important;
    font-size: 15px !important;
}

body.eap-portal-template .eap-legal-title,
.eap-connected-shell .eap-legal-title,
.eap-legal-title {
    font-size: 38px !important;
    font-weight: 900 !important;
    color: #ffffff !important;
    margin: 14px 0 8px 0 !important;
    letter-spacing: -0.03em !important;
}

.eap-legal-grid {
    display: grid !important;
    grid-template-columns: 320px 1fr !important;
    gap: 0 !important;
}

body.eap-portal-template .eap-legal-sidebar,
.eap-connected-shell .eap-legal-sidebar,
.eap-legal-sidebar {
    padding: 44px 32px !important;
    background: #f8fafc !important;
    border-right: 1px solid #e2e8f0 !important;
    color: #0f172a !important;
    position: sticky !important;
    top: 20px !important;
    max-height: calc(100vh - 40px) !important;
    overflow-y: auto !important;
    align-self: start !important;
}

body.eap-portal-template .eap-legal-toc-title,
.eap-connected-shell .eap-legal-toc-title,
.eap-legal-toc-title {
    font-size: 12px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    color: #475569 !important;
    margin-bottom: 16px !important;
}

.eap-legal-toc-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

body.eap-portal-template .eap-legal-toc-list a,
.eap-connected-shell .eap-legal-toc-list a,
.eap-legal-toc-list a {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    text-decoration: none !important;
    display: block !important;
    padding: 8px 14px !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
}

body.eap-portal-template .eap-legal-toc-list a:hover,
.eap-connected-shell .eap-legal-toc-list a:hover,
.eap-legal-toc-list a:hover,
body.eap-portal-template .eap-legal-toc-list a.is-active,
.eap-connected-shell .eap-legal-toc-list a.is-active,
.eap-legal-toc-list a.is-active {
    color: #0ea5e9 !important;
    background: #e0f2fe !important;
    font-weight: 700 !important;
}

body.eap-portal-template .eap-legal-content,
.eap-connected-shell .eap-legal-content,
.eap-legal-content {
    padding: 44px 52px !important;
    background: #ffffff !important;
    color: #1e293b !important;
    font-size: 16px !important;
    line-height: 1.8 !important;
}

body.eap-portal-template .eap-legal-section,
.eap-connected-shell .eap-legal-section,
.eap-legal-section {
    margin-bottom: 44px !important;
    padding-bottom: 44px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

body.eap-portal-template .eap-legal-section:last-child,
.eap-connected-shell .eap-legal-section:last-child,
.eap-legal-section:last-child {
    border-bottom: none !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

body.eap-portal-template .eap-legal-section h2,
.eap-connected-shell .eap-legal-section h2,
.eap-legal-section h2 {
    font-size: 24px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 0 16px 0 !important;
    letter-spacing: -0.01em !important;
}

body.eap-portal-template .eap-legal-section p,
.eap-connected-shell .eap-legal-section p,
.eap-legal-section p,
body.eap-portal-template .eap-legal-section li,
.eap-connected-shell .eap-legal-section li,
.eap-legal-section li {
    color: #334155 !important;
    margin-bottom: 16px !important;
    line-height: 1.75 !important;
    font-size: 15.5px !important;
}

body.eap-portal-template .eap-legal-section ul,
.eap-connected-shell .eap-legal-section ul,
.eap-legal-section ul {
    margin: 0 0 16px 24px !important;
    padding: 0 !important;
}

body.eap-portal-template .eap-legal-section code,
.eap-connected-shell .eap-legal-section code,
.eap-legal-section code {
    background: #f1f5f9 !important;
    color: #0284c7 !important;
    padding: 3px 8px !important;
    border-radius: 6px !important;
    font-size: 13.5px !important;
    font-family: monospace !important;
    border: 1px solid #cbd5e1 !important;
}

@media (max-width: 960px) {
    .eap-portal-site-header__inner {
        flex-direction: column !important;
        gap: 16px !important;
        padding: 16px 20px !important;
    }
    .eap-portal-nav__list {
        flex-wrap: wrap !important;
        justify-content: center !important;
    }
    .eap-portal-site-footer__inner {
        flex-direction: column !important;
        text-align: center !important;
    }
    .eap-portal-footer-links {
        justify-content: center !important;
    }
    .eap-legal-grid {
        grid-template-columns: 1fr !important;
    }
    body.eap-portal-template .eap-legal-sidebar,
    .eap-connected-shell .eap-legal-sidebar,
    .eap-legal-sidebar {
        border-right: none !important;
        border-bottom: 1px solid #e2e8f0 !important;
        padding: 28px 24px !important;
    }
    body.eap-portal-template .eap-legal-head,
    .eap-connected-shell .eap-legal-head,
    .eap-legal-head,
    body.eap-portal-template .eap-legal-content,
    .eap-connected-shell .eap-legal-content,
    .eap-legal-content {
        padding: 28px 24px !important;
    }
}

/* ═══════════════════════════════════════════════════════════
   ENHANCEMENTS 1, 2, & 3 UI COMPONENTS
═══════════════════════════════════════════════════════════ */

/* 1. Real-Time Connection Heartbeat Pill */
.eap-connection-heartbeat {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 6px 12px !important;
    border-radius: 9999px !important;
    background: rgba(15, 23, 42, 0.65) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #e2e8f0 !important;
    letter-spacing: 0.02em !important;
    box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.08) !important;
}

.eap-heartbeat-dot {
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    display: inline-block !important;
    position: relative !important;
}

.eap-heartbeat-dot.is-online {
    background: #22c55e !important;
    box-shadow: 0 0 8px #22c55e !important;
}

.eap-heartbeat-dot.is-online::after {
    content: "" !important;
    position: absolute !important;
    inset: -3px !important;
    border-radius: 50% !important;
    border: 2px solid rgba(34, 197, 94, 0.5) !important;
    animation: eap-pulse-ring 2s cubic-bezier(0, 0, 0.2, 1) infinite !important;
}

.eap-heartbeat-dot.is-offline {
    background: #ef4444 !important;
    box-shadow: 0 0 8px #ef4444 !important;
}

@keyframes eap-pulse-ring {
    0% { transform: scale(0.95); opacity: 0.8; }
    70% { transform: scale(1.8); opacity: 0; }
    100% { transform: scale(0.95); opacity: 0; }
}

/* 2. Topbar Buttons */
.eap-tool-button--tour,
.eap-tool-button--export {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 6px 12px !important;
    border-radius: 8px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.eap-tool-button--tour {
    background: linear-gradient(135deg, rgba(14, 165, 233, 0.15), rgba(37, 99, 235, 0.15)) !important;
    border: 1px solid rgba(14, 165, 233, 0.35) !important;
    color: #38bdf8 !important;
}

.eap-tool-button--tour:hover {
    background: linear-gradient(135deg, #0ea5e9, #2563eb) !important;
    color: #ffffff !important;
    border-color: transparent !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(14, 165, 233, 0.3) !important;
}

.eap-tool-button--export {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    color: #e2e8f0 !important;
}

.eap-tool-button--export:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}

/* 3. Interactive Guided Onboarding Tour Modal */
.eap-onboarding-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 999999 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
}

.eap-onboarding-modal.is-open {
    display: flex !important;
}

.eap-onboarding-modal .eap-modal-backdrop {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(15, 23, 42, 0.78) !important;
    backdrop-filter: blur(8px) !important;
}

.eap-onboarding-modal .eap-modal-card {
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    max-width: 620px !important;
    background: #ffffff !important;
    color: #0f172a !important;
    border-radius: 20px !important;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.45) !important;
    border: 1px solid #cbd5e1 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
}

.eap-onboarding-modal .eap-modal-header {
    padding: 24px 32px 18px 32px !important;
    background: linear-gradient(135deg, #0f172a, #1e293b) !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    border-bottom: 1px solid #334155 !important;
}

.eap-onboarding-modal .eap-modal-header h2 {
    margin: 0 !important;
    font-size: 22px !important;
    font-weight: 900 !important;
    color: #ffffff !important;
}

.eap-onboarding-modal .eap-modal-close {
    background: transparent !important;
    border: none !important;
    color: #94a3b8 !important;
    cursor: pointer !important;
    font-size: 20px !important;
    transition: color 0.2s ease !important;
}

.eap-onboarding-modal .eap-modal-close:hover {
    color: #ffffff !important;
}

.eap-onboarding-modal .eap-modal-body {
    padding: 32px !important;
    min-height: 260px !important;
}

.eap-tour-slide {
    display: none !important;
}

.eap-tour-slide.is-active {
    display: block !important;
    animation: eap-fade-in 0.3s ease !important;
}

@keyframes eap-fade-in {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

.eap-tour-slide h3 {
    margin: 0 0 14px 0 !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
}

.eap-tour-slide p {
    margin: 0 0 16px 0 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    color: #475569 !important;
}

.eap-tour-graphic {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 18px !important;
    background: #f1f5f9 !important;
    border-radius: 12px !important;
    border: 1px solid #cbd5e1 !important;
    font-weight: 700 !important;
    color: #0369a1 !important;
    margin-top: 20px !important;
}

.eap-tour-list {
    margin: 0 0 0 20px !important;
    padding: 0 !important;
    color: #334155 !important;
    line-height: 1.7 !important;
}

.eap-tour-list li {
    margin-bottom: 10px !important;
}

.eap-tour-buttons {
    margin-top: 24px !important;
}

.eap-onboarding-modal .eap-tour-footer {
    padding: 18px 32px !important;
    background: #f8fafc !important;
    border-top: 1px solid #e2e8f0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.eap-tour-dots {
    display: flex !important;
    gap: 8px !important;
}

.eap-tour-dot {
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    background: #cbd5e1 !important;
    border: none !important;
    cursor: pointer !important;
    padding: 0 !important;
    transition: all 0.2s ease !important;
}

.eap-tour-dot.is-active {
    background: #0ea5e9 !important;
    transform: scale(1.3) !important;
}

.eap-tour-nav-btns {
    display: flex !important;
    gap: 10px !important;
}