/*
  SchoolSuite365 green enterprise system layer.
  This file deliberately loads after the legacy module styles so the ERP has one
  calm, data-first visual language without changing any PHP or business logic.
*/

@media screen {
  :root {
    --ss365-forest: #004b22;
    --ss365-deep: #006b31;
    --ss365-primary: #008b43;
    --ss365-accent: #28c75b;
    --ss365-soft: #edf9f0;
    --ss365-page: #f4faf5;
    --ss365-surface: #ffffff;
    --ss365-surface-alt: #f8fcf9;
    --ss365-text: #122b1a;
    --ss365-muted: #617366;
    --ss365-line: #d9e9dd;
    --ss365-focus: rgba(0, 139, 67, .26);
    --ss365-shadow: 0 8px 20px rgba(0, 75, 34, .08);
    --ss365-radius: 12px;
    --shell-sidebar: 270px;
  }

  html[data-theme="dark"] {
    --ss365-page: #062611;
    --ss365-surface: #0b3319;
    --ss365-surface-alt: #0e3d20;
    --ss365-text: #effbf1;
    --ss365-muted: #b5d3bd;
    --ss365-line: rgba(187, 239, 199, .20);
    --ss365-shadow: 0 10px 24px rgba(0, 0, 0, .24);
  }

  html,
  body.tailwind-erp {
    background: var(--ss365-page) !important;
  }

  body.tailwind-erp {
    color: var(--ss365-text) !important;
    font-family: Inter, Poppins, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  }

  body.tailwind-erp::before,
  body.ai-powered-erp .app-shell::after {
    background: none !important;
    content: none !important;
  }

  body.tailwind-erp :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--ss365-focus) !important;
    outline-offset: 2px !important;
  }

  /* Application shell */
  body.tailwind-erp .sidebar,
  body.tailwind-erp .tw-sidebar,
  body.tailwind-erp #sidebar {
    width: var(--shell-sidebar) !important;
    padding: 12px 10px 22px !important;
    color: #ffffff !important;
    background: #006b31 !important;
    border-right: 1px solid rgba(255, 255, 255, .16) !important;
    box-shadow: 10px 0 26px rgba(0, 58, 26, .13) !important;
    backdrop-filter: none !important;
  }

  body.tailwind-erp .brand,
  body.tailwind-erp .tw-brand-card {
    min-height: 58px;
    margin: 0 2px 10px !important;
    padding: 9px !important;
    border: 1px solid rgba(255, 255, 255, .16) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, .10) !important;
    box-shadow: none !important;
  }

  body.tailwind-erp .brand-mark {
    width: 38px !important;
    height: 38px !important;
    border: 1px solid rgba(255, 255, 255, .28) !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: none !important;
    color: var(--ss365-deep) !important;
  }

  body.tailwind-erp .brand-mark::after {
    display: none !important;
  }

  body.tailwind-erp .brand-copy strong,
  body.tailwind-erp .brand-copy small,
  body.tailwind-erp .sidebar-status strong,
  body.tailwind-erp .sidebar-status small {
    color: #ffffff !important;
  }

  body.tailwind-erp .brand-copy strong {
    font-size: .82rem !important;
    line-height: 1.2 !important;
  }

  body.tailwind-erp .brand-copy small,
  body.tailwind-erp .sidebar-status small {
    color: rgba(255, 255, 255, .76) !important;
    font-size: .62rem !important;
  }

  body.tailwind-erp .sidebar-status,
  body.tailwind-erp .tw-sidebar-status {
    margin: 0 2px 11px !important;
    padding: 8px !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 10px !important;
    background: rgba(0, 54, 23, .24) !important;
    box-shadow: none !important;
  }

  body.tailwind-erp .sidebar-status > .icon {
    width: 34px !important;
    height: 34px !important;
    padding: 7px !important;
    border-radius: 9px !important;
    background: rgba(255, 255, 255, .13) !important;
    color: #ffffff !important;
  }

  body.tailwind-erp .sidebar-nav {
    gap: 7px !important;
  }

  body.tailwind-erp .nav-section {
    padding: 4px !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    border-radius: 10px !important;
    background: rgba(0, 54, 23, .16) !important;
  }

  body.tailwind-erp .nav-section.open {
    border-color: rgba(255, 255, 255, .22) !important;
    background: rgba(0, 54, 23, .30) !important;
  }

  body.tailwind-erp .nav-section-title {
    min-height: 38px !important;
    padding: 7px 8px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: rgba(255, 255, 255, .82) !important;
    font-size: .66rem !important;
    letter-spacing: .025em !important;
    text-transform: uppercase;
  }

  body.tailwind-erp .nav-section-title:hover,
  body.tailwind-erp .nav-section.open .nav-section-title {
    background: rgba(255, 255, 255, .10) !important;
    color: #ffffff !important;
    box-shadow: none !important;
    transform: none !important;
  }

  body.tailwind-erp .nav-section-title .icon,
  body.tailwind-erp .nav-chevron,
  body.tailwind-erp .nav-section-title-main {
    color: inherit !important;
  }

  body.tailwind-erp .nav-section-meta {
    min-width: 19px !important;
    height: 19px !important;
    background: rgba(255, 255, 255, .13) !important;
    color: #ffffff !important;
    font-size: .61rem !important;
  }

  body.tailwind-erp .sidebar-nav a {
    min-height: 36px !important;
    padding: 5px 7px !important;
    border: 1px solid transparent !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: rgba(255, 255, 255, .86) !important;
    font-size: .73rem !important;
    font-weight: 720 !important;
  }

  body.tailwind-erp .sidebar-nav a:hover {
    border-color: rgba(255, 255, 255, .16) !important;
    background: rgba(255, 255, 255, .10) !important;
    color: #ffffff !important;
    box-shadow: none !important;
    transform: translateX(2px) !important;
  }

  body.tailwind-erp .sidebar-nav a.active {
    border-color: rgba(255, 255, 255, .25) !important;
    background: #ffffff !important;
    color: var(--ss365-forest) !important;
    box-shadow: 0 6px 16px rgba(0, 38, 16, .18) !important;
    transform: none !important;
  }

  body.tailwind-erp .nav-icon {
    width: 27px !important;
    height: 27px !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, .12) !important;
    color: #ffffff !important;
  }

  body.tailwind-erp .sidebar-nav a:hover .nav-icon {
    background: rgba(255, 255, 255, .18) !important;
    color: #ffffff !important;
  }

  body.tailwind-erp .sidebar-nav a.active .nav-icon {
    background: var(--ss365-soft) !important;
    color: var(--ss365-deep) !important;
  }

  body.tailwind-erp .nav-indicator {
    width: 6px !important;
    height: 6px !important;
    background: var(--ss365-primary) !important;
    box-shadow: 0 0 0 4px rgba(0, 139, 67, .12) !important;
  }

  body.tailwind-erp .topbar,
  body.tailwind-erp .tw-topbar,
  body.tailwind-erp .app-topbar {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px !important;
    min-height: 58px !important;
    margin-left: var(--shell-sidebar) !important;
    padding: 8px 14px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--ss365-line) !important;
    border-radius: 0 !important;
    background: var(--ss365-surface) !important;
    box-shadow: 0 1px 0 rgba(0, 75, 34, .03) !important;
    backdrop-filter: none !important;
    animation: none !important;
  }

  body.tailwind-erp .topbar-menu-button,
  body.tailwind-erp .menu-button {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    border: 1px solid var(--ss365-line) !important;
    border-radius: 9px !important;
    background: var(--ss365-surface-alt) !important;
    color: var(--ss365-deep) !important;
    box-shadow: none !important;
  }

  body.tailwind-erp .topbar-school,
  body.tailwind-erp .topbar-school.tw-school-brand {
    min-width: 0;
    padding: 3px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  body.tailwind-erp .topbar-school img,
  body.tailwind-erp .topbar-school-fallback {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    border: 1px solid var(--ss365-line);
    border-radius: 8px !important;
    background: #ffffff;
    object-fit: cover;
  }

  body.tailwind-erp .topbar-school-copy {
    min-width: 0;
  }

  body.tailwind-erp .topbar-school-name,
  body.tailwind-erp .topbar-school strong {
    display: block;
    max-width: min(48vw, 520px) !important;
    overflow: hidden;
    color: var(--ss365-text) !important;
    font-size: .82rem !important;
    font-weight: 820 !important;
    line-height: 1.2 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.tailwind-erp .topbar-school-context,
  body.tailwind-erp .topbar-school small {
    display: block;
    max-width: min(48vw, 520px) !important;
    overflow: hidden;
    color: var(--ss365-muted) !important;
    font-size: .64rem !important;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.tailwind-erp .tw-user-actions,
  body.tailwind-erp .topbar .tw-user-actions {
    display: flex !important;
    flex: 0 0 auto;
    flex-wrap: nowrap !important;
    align-items: center;
    gap: 5px !important;
    min-width: max-content;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.tailwind-erp .topbar .header-profile-action,
  body.tailwind-erp .topbar .header-logout-action,
  body.tailwind-erp .topbar .offline-sync-button.tw-action-pill {
    min-height: 34px !important;
    padding: 6px 9px !important;
    border: 1px solid var(--ss365-deep) !important;
    border-radius: 8px !important;
    background: var(--ss365-deep) !important;
    color: #ffffff !important;
    box-shadow: none !important;
    font-size: .7rem !important;
  }

  body.tailwind-erp .topbar .header-profile-action:hover,
  body.tailwind-erp .topbar .header-logout-action:hover,
  body.tailwind-erp .topbar .offline-sync-button.tw-action-pill:hover {
    border-color: var(--ss365-primary) !important;
    background: var(--ss365-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 5px 12px rgba(0, 107, 49, .18) !important;
    transform: translateY(-1px) !important;
  }

  body.tailwind-erp .topbar .offline-status {
    border: 1px solid #cce9d5 !important;
    border-radius: 999px !important;
    background: var(--ss365-soft) !important;
    color: var(--ss365-deep) !important;
    box-shadow: none !important;
    font-size: .66rem !important;
  }

  body.tailwind-erp :where(.content, .dashboard-content, .portal-dashboard, .results-page, .settings-page, .transport-page, .hostel-page, .cbt-page, .whatsapp-page, .admin-command-dashboard) {
    max-width: none !important;
    margin-left: var(--shell-sidebar) !important;
    padding: clamp(12px, 1.75vw, 22px) !important;
  }

  body.tailwind-erp .content > h1 {
    margin: 0 0 14px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--ss365-text) !important;
    font-size: clamp(1.18rem, 1.7vw, 1.55rem) !important;
    line-height: 1.25 !important;
  }

  body.tailwind-erp .content > h1::after {
    display: none !important;
  }

  /* Shared workspaces and summaries */
  body.tailwind-erp :where(.panel, .records-panel, .detail-panel, .chart-panel, .focus-panel, .profile-card, .dashboard-card, .stat-card, .kpi-card, .module-card, .feature-card, .portal-card, .settings-section-card, .analysis-card, .study-tool-card, .card, .table-toolbar, .table-pager):not(.pos-receipt):not(.result-sheet):not(.score-sheet-document):not(.broadsheet-document):not(.id-card-sheet):not(.certificate-sheet) {
    border: 1px solid var(--ss365-line) !important;
    border-radius: var(--ss365-radius) !important;
    background: var(--ss365-surface) !important;
    color: var(--ss365-text) !important;
    box-shadow: var(--ss365-shadow) !important;
    animation: none !important;
  }

  body.tailwind-erp :where(.panel, .records-panel, .detail-panel, .chart-panel, .focus-panel, .profile-card, .dashboard-card, .stat-card, .kpi-card, .module-card, .feature-card, .portal-card, .settings-section-card, .analysis-card, .study-tool-card, .card) :where(.panel, .records-panel, .detail-panel, .chart-panel, .focus-panel, .profile-card, .dashboard-card, .stat-card, .kpi-card, .module-card, .feature-card, .portal-card, .settings-section-card, .analysis-card, .study-tool-card, .card) {
    background: var(--ss365-surface-alt) !important;
    box-shadow: none !important;
  }

  body.tailwind-erp :where(.panel, .records-panel, .detail-panel, .chart-panel, .focus-panel, .profile-card, .dashboard-card, .stat-card, .kpi-card, .module-card, .feature-card, .portal-card, .settings-section-card, .analysis-card, .study-tool-card, .card) :where(h1, h2, h3, h4, h5, h6, strong, b, label, legend, dt, dd, .title, .panel-title, .card-title) {
    color: var(--ss365-text) !important;
  }

  body.tailwind-erp :where(.panel, .records-panel, .detail-panel, .chart-panel, .focus-panel, .profile-card, .dashboard-card, .stat-card, .kpi-card, .module-card, .feature-card, .portal-card, .settings-section-card, .analysis-card, .study-tool-card, .card) :where(p, small, .muted, .text-muted, .helper-text, .description) {
    color: var(--ss365-muted) !important;
  }

  body.tailwind-erp :where(.modern-dashboard-hero, .dashboard-hero, .page-hero, .compact-hero, .admin-command-dashboard .admin-hero, .whatsapp-hero) {
    border: 1px solid #007337 !important;
    border-radius: 14px !important;
    background: var(--ss365-deep) !important;
    box-shadow: 0 12px 26px rgba(0, 75, 34, .14) !important;
    color: #ffffff !important;
    animation: none !important;
  }

  body.tailwind-erp :where(.modern-dashboard-hero, .dashboard-hero, .page-hero, .compact-hero, .admin-command-dashboard .admin-hero, .whatsapp-hero)::after {
    display: none !important;
  }

  body.tailwind-erp :where(.modern-dashboard-hero, .dashboard-hero, .page-hero, .compact-hero, .admin-command-dashboard .admin-hero, .whatsapp-hero) :where(h1, h2, h3, p, small, strong, span, .muted, .text-muted) {
    color: #ffffff !important;
    text-shadow: none !important;
  }

  body.tailwind-erp :where(.dashboard-kpis article, .stats-grid article, .metric-grid article, .profile-summary-grid article, .kpi-grid article, .dashboard-feature-card, .settings-tiles a) {
    min-height: 0 !important;
    border: 1px solid var(--ss365-line) !important;
    border-radius: 11px !important;
    background: var(--ss365-surface) !important;
    box-shadow: 0 4px 12px rgba(0, 75, 34, .06) !important;
  }

  body.tailwind-erp :where(.dashboard-kpis article, .dashboard-feature-card, .profile-summary-grid article, .kpi-grid article, .settings-tiles a)::before {
    height: 3px !important;
    background: var(--ss365-primary) !important;
  }

  body.tailwind-erp :where(.kpi-icon, .feature-icon, .stats-grid .icon, .metric-grid .icon) {
    border-radius: 9px !important;
    background: var(--ss365-soft) !important;
    box-shadow: none !important;
    color: var(--ss365-deep) !important;
  }

  /* Executive dashboard: one semantic green system for operational summaries. */
  body.tailwind-erp :where(.executive-action-card, .admin-health-card) {
    min-height: 0 !important;
    border: 1px solid var(--ss365-line) !important;
    border-radius: 11px !important;
    background: var(--ss365-surface) !important;
    box-shadow: 0 4px 12px rgba(0, 75, 34, .06) !important;
    color: var(--ss365-text) !important;
  }

  body.tailwind-erp :where(.executive-action-card, .admin-health-card):hover {
    border-color: #badfc4 !important;
    box-shadow: 0 8px 18px rgba(0, 75, 34, .10) !important;
    transform: translateY(-1px) !important;
  }

  body.tailwind-erp :where(.executive-action-card, .admin-health-card) :where(.action-icon, .health-icon) {
    border: 1px solid #cce9d5 !important;
    border-radius: 9px !important;
    background: var(--ss365-soft) !important;
    color: var(--ss365-deep) !important;
    box-shadow: none !important;
  }

  body.tailwind-erp :where(.executive-action-card, .admin-health-card) :where(strong, small, em, span) {
    color: var(--ss365-text) !important;
  }

  body.tailwind-erp :where(.executive-action-card, .admin-health-card) :where(small, em) {
    color: var(--ss365-muted) !important;
  }

  body.tailwind-erp :where(.admin-health-card, .executive-action-card) :where(.health-meter, .health-meter b, .hero-meter, .hero-meter i, .bar-chart i, .channel-chart i > b) {
    background: var(--ss365-soft) !important;
  }

  body.tailwind-erp :where(.admin-health-card, .executive-action-card) :where(.health-meter b, .hero-meter i, .bar-chart i, .channel-chart i > b) {
    background: var(--ss365-primary) !important;
  }

  body.tailwind-erp :where(.proprietor-hero-chips span, .hero-balance, .hero-analytics-card, .hero-balance *, .hero-analytics-card *) {
    border-color: rgba(255, 255, 255, .30) !important;
    background: transparent !important;
    color: #ffffff !important;
    box-shadow: none !important;
  }

  body.tailwind-erp :where(.hero-balance, .hero-analytics-card) {
    background: rgba(255, 255, 255, .10) !important;
  }

  body.tailwind-erp :where(.bar-chart i, .channel-chart i > b) {
    background: var(--ss365-primary) !important;
  }

  /* Forms and commands */
  body.tailwind-erp :where(input, select, textarea) {
    border: 1px solid var(--ss365-line) !important;
    border-radius: 8px !important;
    background: var(--ss365-surface) !important;
    color: var(--ss365-text) !important;
    box-shadow: none !important;
  }

  body.tailwind-erp :where(input, select, textarea):focus {
    border-color: var(--ss365-primary) !important;
    box-shadow: 0 0 0 3px var(--ss365-focus) !important;
  }

  body.tailwind-erp label,
  body.tailwind-erp legend {
    color: var(--ss365-text) !important;
    font-size: .74rem !important;
    font-weight: 760 !important;
  }

  body.tailwind-erp :where(.button, .btn, .btn-primary, .primary-button, .action-button, .submit-button, button, input[type="submit"]):not(.ghost):not(.secondary):not(.danger):not(.danger-button):not(.action-delete):not(.nav-section-title):not(.icon-button):not(.menu-button):not(.topbar-menu-button) {
    border-color: var(--ss365-deep) !important;
    background: var(--ss365-deep) !important;
    color: #ffffff !important;
    box-shadow: none !important;
  }

  body.tailwind-erp :where(.button, .btn, .btn-primary, .primary-button, .action-button, .submit-button, button, input[type="submit"]):not(.ghost):not(.secondary):not(.danger):not(.danger-button):not(.action-delete):not(.nav-section-title):not(.icon-button):not(.menu-button):not(.topbar-menu-button):hover {
    border-color: var(--ss365-primary) !important;
    background: var(--ss365-primary) !important;
    box-shadow: 0 5px 12px rgba(0, 107, 49, .17) !important;
  }

  body.tailwind-erp :where(.button.ghost, .button.secondary, .btn-secondary, button.ghost, .icon-button, .offline-sync-button) {
    border: 1px solid var(--ss365-line) !important;
    background: var(--ss365-surface-alt) !important;
    color: var(--ss365-deep) !important;
    box-shadow: none !important;
  }

  body.tailwind-erp :where(.badge, .pill, .status-badge, .subscription-badge) {
    border: 1px solid #cce9d5 !important;
    border-radius: 999px !important;
    background: var(--ss365-soft) !important;
    color: var(--ss365-deep) !important;
    font-size: .67rem !important;
    font-weight: 800 !important;
  }

  body.tailwind-erp :where(.status-pending, .badge.warning, .pill.warning) {
    background: #fff7e6 !important;
    border-color: #f5d18a !important;
    color: #985d00 !important;
  }

  body.tailwind-erp :where(.status-failed, .badge.danger, .pill.danger) {
    background: #fff1f1 !important;
    border-color: #f1c1c1 !important;
    color: #af2323 !important;
  }

  /* Tables remain tables on phones: compact, readable, and horizontally scrollable. */
  body.tailwind-erp :where(.table-shell, .table-responsive, .table-scroll, .profile-table-scroll, .report-table-scroll, .data-table-wrap, .managed-table-wrap, .whatsapp-table-wrap, .records-table-wrap) {
    border: 1px solid var(--ss365-line) !important;
    border-radius: 10px !important;
    background: var(--ss365-surface) !important;
    box-shadow: none !important;
  }

  body.tailwind-erp :where(.content, .dashboard-content, .portal-dashboard, .results-page, .settings-page, .transport-page, .hostel-page, .cbt-page, .whatsapp-page, .admin-command-dashboard) table:not(.result-score-table):not(.results-broadsheet-table):not(.score-sheet-table):not(.pos-receipt-table):not(.id-card-table) thead th {
    border-color: #007337 !important;
    background: var(--ss365-deep) !important;
    color: #ffffff !important;
    font-size: .67rem !important;
    letter-spacing: .02em !important;
  }

  body.tailwind-erp :where(.content, .dashboard-content, .portal-dashboard, .results-page, .settings-page, .transport-page, .hostel-page, .cbt-page, .whatsapp-page, .admin-command-dashboard) table:not(.result-score-table):not(.results-broadsheet-table):not(.score-sheet-table):not(.pos-receipt-table):not(.id-card-table) td {
    border-color: var(--ss365-line) !important;
    background: var(--ss365-surface) !important;
    color: var(--ss365-text) !important;
  }

  body.tailwind-erp :where(.content, .dashboard-content, .portal-dashboard, .results-page, .settings-page, .transport-page, .hostel-page, .cbt-page, .whatsapp-page, .admin-command-dashboard) table:not(.result-score-table):not(.results-broadsheet-table):not(.score-sheet-table):not(.pos-receipt-table):not(.id-card-table) tbody tr:nth-child(even) td {
    background: #f7fbf8 !important;
  }

  body.tailwind-erp :where(.content, .dashboard-content, .portal-dashboard, .results-page, .settings-page, .transport-page, .hostel-page, .cbt-page, .whatsapp-page, .admin-command-dashboard) table:not(.result-score-table):not(.results-broadsheet-table):not(.score-sheet-table):not(.pos-receipt-table):not(.id-card-table) tbody tr:hover td {
    background: var(--ss365-soft) !important;
  }

  body.tailwind-erp .table-toolbar,
  body.tailwind-erp .table-pager {
    padding: 9px !important;
    border-radius: 10px !important;
    background: var(--ss365-surface-alt) !important;
    box-shadow: none !important;
  }

  body.tailwind-erp .erp-form-table-shell {
    border-color: var(--ss365-line) !important;
    border-radius: 10px !important;
    background: var(--ss365-surface) !important;
  }

  body.tailwind-erp .erp-form-section-row th {
    border: 0 !important;
    background: var(--ss365-soft) !important;
    color: var(--ss365-deep) !important;
  }

  body.tailwind-erp .erp-form-section-row th > span::before {
    background: var(--ss365-primary) !important;
    box-shadow: 0 0 0 4px rgba(0, 139, 67, .13) !important;
  }

  body.tailwind-erp .erp-form-actions-row td {
    background: var(--ss365-surface-alt) !important;
  }

  /* Feedback surfaces */
  body.tailwind-erp :where(.swal-lite, .modal, dialog, .ai-assistant-panel) {
    border: 1px solid var(--ss365-line) !important;
    border-radius: 14px !important;
    background: var(--ss365-surface) !important;
    color: var(--ss365-text) !important;
    box-shadow: 0 18px 42px rgba(0, 55, 25, .18) !important;
    backdrop-filter: none !important;
    animation: none !important;
  }

  body.tailwind-erp .ai-assistant-toggle {
    border: 2px solid #ffffff !important;
    background: var(--ss365-deep) !important;
    box-shadow: 0 8px 18px rgba(0, 75, 34, .24) !important;
    animation: none !important;
  }
}

@media screen and (max-width: 940px) {
  body.tailwind-erp .sidebar,
  body.tailwind-erp .tw-sidebar,
  body.tailwind-erp #sidebar {
    width: min(84vw, 302px) !important;
    transform: translateX(-106%) !important;
    transition: transform .2s ease !important;
  }

  body.tailwind-erp.sidebar-open .sidebar,
  body.tailwind-erp.sidebar-open .tw-sidebar,
  body.tailwind-erp.sidebar-open #sidebar {
    transform: translateX(0) !important;
  }

  body.tailwind-erp :where(.topbar, .tw-topbar, .app-topbar, .content, .dashboard-content, .portal-dashboard, .results-page, .settings-page, .transport-page, .hostel-page, .cbt-page, .whatsapp-page, .admin-command-dashboard) {
    margin-left: 0 !important;
  }
}

@media screen and (max-width: 640px) {
  body.tailwind-erp {
    padding-bottom: calc(70px + env(safe-area-inset-bottom));
  }

  body.tailwind-erp .topbar,
  body.tailwind-erp .tw-topbar,
  body.tailwind-erp .app-topbar {
    grid-template-columns: 38px minmax(0, 1fr) auto !important;
    gap: 7px !important;
    min-height: 54px !important;
    padding: 7px 8px !important;
  }

  body.tailwind-erp .topbar-school img,
  body.tailwind-erp .topbar-school-fallback {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    border-radius: 7px !important;
  }

  body.tailwind-erp .topbar-school-name,
  body.tailwind-erp .topbar-school strong {
    max-width: 42vw !important;
    font-size: .72rem !important;
  }

  body.tailwind-erp .topbar-school-context,
  body.tailwind-erp .topbar-school small,
  body.tailwind-erp .topbar .offline-sync-button,
  body.tailwind-erp .topbar .header-profile-action {
    display: none !important;
  }

  body.tailwind-erp .topbar .header-logout-action {
    width: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
    border-radius: 9px !important;
  }

  body.tailwind-erp .topbar .header-logout-action span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }

  body.tailwind-erp :where(.content, .dashboard-content, .portal-dashboard, .results-page, .settings-page, .transport-page, .hostel-page, .cbt-page, .whatsapp-page, .admin-command-dashboard) {
    padding: 10px !important;
  }

  body.tailwind-erp :where(.panel, .records-panel, .detail-panel, .chart-panel, .focus-panel, .profile-card, .dashboard-card, .stat-card, .kpi-card, .module-card, .feature-card, .portal-card, .settings-section-card, .analysis-card, .study-tool-card, .card) {
    border-radius: 10px !important;
  }

  body.tailwind-erp :where(.dashboard-grid, .dashboard-feature-grid, .kpi-grid, .stats-grid, .settings-tiles, .module-grid, .feature-grid, .profile-summary-grid, .results-summary-grid, .portal-actions, .quick-actions) {
    gap: 8px !important;
  }

  body.tailwind-erp :where(.dashboard-kpis article, .stats-grid article, .metric-grid article, .profile-summary-grid article, .kpi-grid article, .dashboard-feature-card, .settings-tiles a) {
    min-height: 0 !important;
    padding: 10px !important;
  }

  body.tailwind-erp :where(.table-shell, .table-responsive, .table-scroll, .profile-table-scroll, .report-table-scroll, .data-table-wrap, .managed-table-wrap, .whatsapp-table-wrap, .records-table-wrap) {
    border-radius: 8px !important;
  }

  body.tailwind-erp table th,
  body.tailwind-erp table td {
    padding: 5px 6px !important;
    font-size: .62rem !important;
  }
}

@media screen {
  /* Standalone entry points deliberately use the same brand and component rules. */
  body.login-page,
  body.developer-login-page {
    min-height: 100vh;
    color: var(--ss365-text) !important;
    background: var(--ss365-page) !important;
  }

  body.login-page::before,
  body.developer-login-page::before {
    display: none !important;
  }

  body.login-page :where(.login-hero, .developer-login-brand-panel),
  body.developer-login-page :where(.login-hero, .developer-login-brand-panel) {
    border: 1px solid #007337 !important;
    background: var(--ss365-deep) !important;
    box-shadow: 0 12px 28px rgba(0, 75, 34, .14) !important;
  }

  body.login-page :where(.login-hero, .developer-login-brand-panel)::before,
  body.login-page :where(.login-hero, .developer-login-brand-panel)::after,
  body.developer-login-page :where(.login-hero, .developer-login-brand-panel)::before,
  body.developer-login-page :where(.login-hero, .developer-login-brand-panel)::after {
    display: none !important;
  }

  body.login-page :where(.login-hero, .developer-login-brand-panel) :where(h1, h2, h3, p, strong, small, span, li),
  body.developer-login-page :where(.login-hero, .developer-login-brand-panel) :where(h1, h2, h3, p, strong, small, span, li) {
    color: #ffffff !important;
  }

  body.login-page :where(.login-card, .login-feature-map article),
  body.developer-login-page .developer-login-card {
    border: 1px solid var(--ss365-line) !important;
    border-radius: 14px !important;
    background: var(--ss365-surface) !important;
    box-shadow: var(--ss365-shadow) !important;
  }

  body.login-page :where(.login-card, .login-feature-map article) :where(h1, h2, h3, p, strong, small, label),
  body.developer-login-page .developer-login-card :where(h1, h2, h3, p, strong, small, label) {
    color: var(--ss365-text) !important;
  }

  body.login-page :where(.login-card, .login-feature-map article) :where(p, small),
  body.developer-login-page .developer-login-card :where(p, small) {
    color: var(--ss365-muted) !important;
  }

  body.login-page :where(.login-submit, .login-app-download),
  body.developer-login-page .developer-login-form > button {
    border-color: var(--ss365-deep) !important;
    background: var(--ss365-deep) !important;
    color: #ffffff !important;
    box-shadow: none !important;
  }

  body.login-page :where(.login-submit, .login-app-download):hover,
  body.developer-login-page .developer-login-form > button:hover {
    border-color: var(--ss365-primary) !important;
    background: var(--ss365-primary) !important;
  }

  body.login-page :where(.app-footer, .login-footer),
  body.developer-login-page .developer-login-footer {
    border-color: rgba(0, 107, 49, .15) !important;
    background: #ffffff !important;
    color: var(--ss365-muted) !important;
  }

  body.login-page :where(.app-footer, .login-footer) a,
  body.developer-login-page .developer-login-footer a {
    color: var(--ss365-deep) !important;
  }

  /* The developer console is a private workspace, but follows the same system. */
  body.developer-console-page,
  body.subscription-block-page {
    background: var(--ss365-page) !important;
    color: var(--ss365-text) !important;
  }

  body.developer-console-page .developer-app-shell {
    grid-template-columns: 252px minmax(0, 1fr) !important;
  }

  body.developer-console-page .developer-sidebar {
    padding: 14px !important;
    background: var(--ss365-deep) !important;
    box-shadow: 8px 0 20px rgba(0, 75, 34, .10) !important;
  }

  body.developer-console-page .developer-brand > span,
  body.developer-console-page .developer-topbar-logo {
    border: 1px solid rgba(255, 255, 255, .25) !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: none !important;
  }

  body.developer-console-page :where(.developer-brand-orbit::before, .developer-brand-orbit::after) {
    display: none !important;
  }

  body.developer-console-page .developer-sidebar nav a {
    min-height: 38px !important;
    border-color: transparent !important;
    border-radius: 8px !important;
    color: rgba(255, 255, 255, .88) !important;
  }

  body.developer-console-page .developer-sidebar nav a .icon {
    color: #ffffff !important;
  }

  body.developer-console-page .developer-sidebar nav a:hover {
    border-color: rgba(255, 255, 255, .16) !important;
    background: rgba(255, 255, 255, .10) !important;
  }

  body.developer-console-page .developer-sidebar nav a.active {
    border-color: rgba(255, 255, 255, .24) !important;
    background: #ffffff !important;
    box-shadow: none !important;
    color: var(--ss365-forest) !important;
  }

  body.developer-console-page .developer-sidebar nav a.active .icon {
    color: var(--ss365-deep) !important;
  }

  body.developer-console-page .developer-sidebar-card {
    border: 1px solid rgba(255, 255, 255, .16) !important;
    border-radius: 10px !important;
    background: rgba(0, 54, 23, .24) !important;
  }

  body.developer-console-page .developer-sidebar-card :where(span, strong, small) {
    color: #ffffff !important;
  }

  body.developer-console-page .developer-console {
    max-width: none !important;
    padding: clamp(12px, 2vw, 22px) !important;
  }

  body.developer-console-page :where(.developer-mobile-topbar, .developer-panel, .developer-console-hero, .developer-stat-card, .developer-card, .developer-footer, .subscription-block-card) {
    border: 1px solid var(--ss365-line) !important;
    border-radius: 12px !important;
    background: var(--ss365-surface) !important;
    color: var(--ss365-text) !important;
    box-shadow: var(--ss365-shadow) !important;
  }

  body.developer-console-page .developer-console-hero {
    border-color: #007337 !important;
    background: var(--ss365-deep) !important;
    color: #ffffff !important;
  }

  body.developer-console-page .developer-console-hero::after {
    display: none !important;
  }

  body.developer-console-page .developer-console-hero :where(h1, h2, h3, p, small, strong, span) {
    color: #ffffff !important;
  }

  body.subscription-block-page .subscription-block-card {
    border: 1px solid var(--ss365-line) !important;
    border-radius: 14px !important;
    background: var(--ss365-surface) !important;
    box-shadow: var(--ss365-shadow) !important;
  }
}

@media screen and (max-width: 840px) {
  body.developer-console-page .developer-app-shell {
    grid-template-columns: 1fr !important;
  }

  body.developer-console-page .developer-sidebar {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.tailwind-erp *,
  body.tailwind-erp *::before,
  body.tailwind-erp *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}
