/* Admin Panel Styles */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Billing foundation */
.billing-page {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.billing-tabs {
    background: rgba(15, 23, 42, 0.62);
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 12px;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 8px;
}

.billing-tab {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 9px;
    color: var(--admin-text-muted, #CBD5E1);
    cursor: pointer;
    font-size: 13px;
    font-weight: 800;
    padding: 9px 12px;
    white-space: nowrap;
}

.billing-tab:hover {
    background: var(--admin-accent-soft, rgba(56, 189, 248, 0.10));
    border-color: var(--admin-accent-ring, rgba(56, 189, 248, 0.18));
    color: var(--admin-text, #F8FAFC);
}

.billing-tab.is-active {
    background: linear-gradient(135deg, rgba(14, 165, 233, 0.24), rgba(139, 92, 246, 0.22));
    border-color: rgba(56, 189, 248, 0.36);
    color: #FFFFFF;
}

.billing-tab-panel {
    display: grid;
    gap: 16px;
}

.billing-hero,
.billing-section,
.billing-org-card,
.billing-plan-card,
.billing-loading,
.billing-alert,
.billing-note {
    background: rgba(15, 23, 42, 0.72);
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 12px;
    box-shadow: 0 16px 40px rgba(2, 6, 23, 0.18);
}

.billing-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px;
}

.billing-kicker,
.billing-section__header span,
.billing-metric-card span,
.billing-org-card__period span,
.billing-usage-grid span,
.billing-controls label span,
.billing-manual-form label span,
.billing-section-note {
    color: var(--admin-accent, #8B5CF6);
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.billing-hero h3,
.billing-section__header h3,
.billing-org-card h4 {
    color: var(--admin-text, #F8FAFC);
    font-weight: 800;
    letter-spacing: 0;
}

.billing-hero h3 {
    font-size: 22px;
    margin: 4px 0 6px;
}

.billing-hero p,
.billing-note,
.billing-plan-card small,
.billing-org-card__period strong,
.billing-upgrade-note span,
.billing-usage-grid small {
    color: var(--admin-text-muted, #94A3B8);
}

.billing-metrics,
.billing-plan-grid,
.billing-usage-grid {
    display: grid;
    gap: 12px;
}

.billing-metrics {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.billing-metric-card {
    background: rgba(30, 41, 59, 0.72);
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 10px;
    padding: 14px;
}

.billing-metric-card strong {
    color: #FFFFFF;
    display: block;
    font-size: 24px;
    line-height: 1.2;
    margin-top: 6px;
}

.billing-metric-card small {
    color: var(--admin-text-subtle, #64748B);
    display: block;
    font-size: 12px;
    margin-top: 4px;
}

.billing-note {
    align-items: flex-start;
    color: var(--admin-text-muted, #CBD5E1);
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    justify-content: space-between;
    padding: 12px 14px;
}

.billing-note strong {
    color: var(--admin-text, #E2E8F0);
    display: block;
    margin-bottom: 3px;
}

.billing-note small {
    color: var(--admin-text-muted, #94A3B8);
    display: block;
    line-height: 1.45;
}

.billing-note span {
    background: rgba(14, 165, 233, 0.12);
    border: 1px solid rgba(14, 165, 233, 0.26);
    border-radius: 999px;
    color: var(--admin-accent, #67E8F9);
    font-size: 12px;
    font-weight: 800;
    padding: 6px 9px;
    white-space: nowrap;
}

.billing-section {
    padding: 16px;
}

.billing-two-column {
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.billing-two-column > div {
    min-width: 0;
}

.billing-section__header {
    align-items: center;
    border-bottom: 1px solid rgba(148, 163, 184, 0.14);
    display: flex;
    justify-content: space-between;
    margin: -2px 0 14px;
    padding-bottom: 12px;
}

.billing-section__actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.billing-toolbar,
.billing-pagination {
    align-items: end;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 14px;
}

.billing-toolbar label {
    display: grid;
    gap: 6px;
}

.billing-toolbar label > span {
    color: var(--admin-info, #8B5CF6);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.billing-search {
    flex: 1 1 340px;
}

.billing-toolbar input,
.billing-toolbar select {
    background: rgba(15, 23, 42, 0.78);
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 9px;
    color: var(--admin-text, #F8FAFC);
    min-height: 40px;
    padding: 8px 10px;
}

.billing-toolbar__actions,
.billing-pagination > div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.billing-pagination {
    color: var(--admin-text-muted, #94A3B8);
    margin: 14px 0 0;
}

.billing-filter-bar {
    align-items: end;
    background: rgba(15, 23, 42, 0.42);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 10px;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(220px, 1.4fr) repeat(6, minmax(110px, 0.8fr)) auto;
    margin-bottom: 14px;
    padding: 12px;
}

.billing-filter-bar label {
    display: grid;
    gap: 6px;
}

.billing-filter-bar label > span {
    color: var(--admin-info, #8B5CF6);
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.billing-filter-bar input,
.billing-filter-bar select {
    background: rgba(15, 23, 42, 0.78);
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 8px;
    color: var(--admin-text, #F8FAFC);
    min-height: 38px;
    padding: 8px 10px;
    width: 100%;
}

.billing-filter-search {
    min-width: 0;
}

.billing-filter-reset {
    min-width: 78px;
}

.billing-button:disabled,
.billing-tab:disabled,
.billing-link-button:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.billing-section__header h3 {
    font-size: 17px;
    margin-top: 3px;
}

.billing-plan-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-auto-flow: row;
}

.billing-plan-card {
    padding: 14px;
}

.billing-plan-card__top,
.billing-org-card__header,
.billing-invoice-strip__title {
    align-items: flex-start;
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

.billing-org-card__header {
    border-radius: 10px;
    cursor: pointer;
    margin: -5px -5px 0;
    padding: 5px;
}

.billing-org-card__header:hover {
    background: rgba(56, 189, 248, 0.06);
}

.billing-plan-card__top strong {
    color: var(--admin-text, #F8FAFC);
    display: block;
    font-size: 16px;
}

.billing-price-row {
    align-items: baseline;
    display: flex;
    gap: 6px;
    margin: 12px 0;
}

.billing-price-row span {
    color: #FFFFFF;
    font-size: 26px;
    font-weight: 900;
}

.billing-price-row small {
    color: var(--admin-text-muted, #94A3B8);
}

.billing-plan-facts,
.billing-feature-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.billing-plan-facts span,
.billing-feature-list span {
    background: rgba(15, 23, 42, 0.64);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 7px;
    color: var(--admin-text-muted, #CBD5E1);
    font-size: 12px;
    padding: 6px 8px;
}

.billing-feature-list {
    margin-top: 10px;
}

.billing-plan-badge,
.billing-badge {
    border-radius: 999px;
    display: inline-flex;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    padding: 6px 8px;
    text-transform: capitalize;
    white-space: nowrap;
}

.billing-plan-badge {
    background: rgba(14, 165, 233, 0.15);
    border: 1px solid rgba(14, 165, 233, 0.35);
    color: var(--admin-accent, #67E8F9);
}

.billing-badge {
    background: rgba(100, 116, 139, 0.16);
    border: 1px solid rgba(148, 163, 184, 0.22);
    color: var(--admin-text-muted, #CBD5E1);
}

.billing-badge--active,
.billing-badge--paid {
    background: rgba(16, 185, 129, 0.16);
    border-color: rgba(16, 185, 129, 0.34);
    color: var(--admin-success, #6EE7B7);
}

.billing-badge--trialing {
    background: rgba(14, 165, 233, 0.16);
    border-color: rgba(14, 165, 233, 0.34);
    color: var(--admin-info, #7DD3FC);
}

.billing-badge--past_due,
.billing-badge--pending,
.billing-badge--sent,
.billing-badge--draft,
.billing-badge--custom_limits {
    background: rgba(245, 158, 11, 0.16);
    border-color: rgba(245, 158, 11, 0.36);
    color: var(--admin-warning, #FCD34D);
}

.billing-badge--cancelled,
.billing-badge--suspended,
.billing-badge--failed,
.billing-badge--overdue {
    background: rgba(239, 68, 68, 0.16);
    border-color: rgba(239, 68, 68, 0.34);
    color: var(--admin-danger, #FCA5A5);
}

.billing-org-list {
    display: grid;
    gap: 14px;
}

.billing-org-card {
    padding: 15px;
}

.billing-org-card.is-collapsed {
    background: rgba(15, 23, 42, 0.64);
}

.billing-org-card h4 {
    font-size: 18px;
}

.billing-org-card__meta {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 8px;
}

.billing-org-card__meta > span:not(.billing-badge):not(.billing-plan-badge) {
    color: var(--admin-text-muted, #94A3B8);
    font-size: 12px;
}

.billing-org-card__period {
    text-align: right;
}

.billing-org-card__period strong {
    display: block;
    font-size: 12px;
    margin-top: 4px;
}

.billing-org-card__actions {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.billing-org-card__chevron {
    border: solid #67E8F9;
    border-width: 0 2px 2px 0;
    display: inline-block;
    height: 9px;
    margin: 4px 5px 0 0;
    transform: rotate(45deg);
    transition: transform 0.18s ease;
    width: 9px;
}

.billing-org-card.is-expanded .billing-org-card__chevron {
    transform: rotate(-135deg);
}

.billing-org-card__summary {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 12px;
}

.billing-org-card__summary span {
    background: rgba(30, 41, 59, 0.48);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 8px;
    color: var(--admin-text-muted, #CBD5E1);
    font-size: 12px;
    font-weight: 700;
    padding: 8px 10px;
}

.billing-org-card__details {
    border-top: 1px solid rgba(148, 163, 184, 0.14);
    margin-top: 12px;
    padding-top: 12px;
}

.billing-usage-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-top: 14px;
}

.billing-usage-grid > div {
    background: rgba(30, 41, 59, 0.55);
    border: 1px solid rgba(148, 163, 184, 0.13);
    border-radius: 10px;
    padding: 12px;
}

.billing-usage-grid strong {
    color: var(--admin-text, #F8FAFC);
    display: block;
    font-size: 16px;
    margin: 5px 0 8px;
}

.billing-progress {
    background: rgba(15, 23, 42, 0.75);
    border-radius: 999px;
    height: 7px;
    overflow: hidden;
}

.billing-progress__fill {
    display: block;
    height: 100%;
}

.billing-progress__fill--ok { background: var(--admin-success, #10B981); }
.billing-progress__fill--warn { background: var(--admin-warning, #F59E0B); }
.billing-progress__fill--danger { background: var(--admin-danger, #EF4444); }

.billing-usage-warning {
    display: block;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.35;
    margin: 7px 0 2px;
}

.billing-usage-warning--soft {
    color: #FBBF24;
}

.billing-usage-warning--strong {
    color: #FDBA74;
}

.billing-usage-warning--block {
    color: var(--admin-danger, #FCA5A5);
}

.billing-controls,
.billing-manual-form {
    background: rgba(15, 23, 42, 0.46);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 10px;
    display: grid;
    gap: 10px;
    margin-top: 14px;
    padding: 12px;
}

.billing-controls {
    grid-template-columns: minmax(120px, 1fr) minmax(120px, 1fr) minmax(120px, 1fr) minmax(180px, 2fr) auto auto;
}

.billing-manual-form {
    grid-template-columns: minmax(180px, 1.2fr) minmax(220px, 2fr) minmax(70px, 0.6fr) minmax(120px, 1fr) minmax(130px, 1fr) auto;
}

.billing-manual-form--draft {
    align-items: end;
}

.billing-feature-override-form {
    align-items: end;
    grid-template-columns: minmax(170px, 1.2fr) minmax(170px, 1fr) minmax(180px, 1fr) minmax(150px, .8fr) minmax(150px, .8fr) minmax(150px, .8fr);
}

.billing-metrics--ai {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.billing-controls label,
.billing-manual-form label {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.billing-controls input,
.billing-controls select,
.billing-manual-form input,
.billing-manual-form select {
    background: rgba(15, 23, 42, 0.86);
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 8px;
    color: var(--admin-text, #F8FAFC);
    min-height: 38px;
    padding: 8px 10px;
    width: 100%;
}

.billing-button,
.billing-link-button {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-size: 13px;
    font-weight: 800;
    justify-content: center;
}

.billing-button {
    align-self: end;
    background: linear-gradient(135deg, #0EA5E9, #6366F1);
    border: 1px solid rgba(125, 211, 252, 0.38);
    color: #FFFFFF;
    min-height: 38px;
    padding: 9px 14px;
}

.billing-button--ghost {
    background: rgba(14, 165, 233, 0.12);
    border-color: rgba(14, 165, 233, 0.28);
    color: var(--admin-info, #7DD3FC);
}

/* W-2: solid, unmissable danger state for the AI Kill Switch control when
   it is currently ON — deliberately louder than .billing-action-button--danger
   (a subtle tint used for routine void/delete actions) since this is a
   platform-wide emergency stop, not a per-row action. */
.billing-button--danger-solid {
    background: linear-gradient(135deg, #ef4444, #b91c1c);
    border: 1px solid rgba(252, 165, 165, 0.5);
    color: #FFFFFF;
}

.billing-ai-kill-switch {
    align-items: center;
    background: var(--admin-surface, rgba(15, 23, 42, 0.4));
    border: 1px solid var(--admin-border);
    border-radius: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    padding: 12px 16px;
}

.billing-ai-kill-switch.is-on {
    background: rgba(239, 68, 68, 0.1);
    border-color: rgba(248, 113, 113, 0.4);
}

.billing-ai-kill-switch strong {
    color: var(--admin-text);
    display: block;
    font-size: 13px;
}

.billing-ai-kill-switch span {
    color: var(--admin-text-muted);
    font-size: 12px;
}

.billing-ai-kill-switch.is-on span {
    color: var(--admin-danger, #FCA5A5);
    font-weight: 600;
}

.billing-link-button {
    background: transparent;
    border: 0;
    color: var(--admin-accent, #67E8F9);
    cursor: pointer;
    padding: 3px 0;
}

.billing-link-button--danger {
    color: var(--admin-danger, #FCA5A5);
}

.billing-helper-text,
.billing-section-note {
    color: var(--admin-text-muted, #94A3B8);
    display: block;
    font-size: 12px;
}

.billing-helper-text {
    margin-top: 8px;
}

.billing-upgrade-note {
    background: rgba(14, 165, 233, 0.10);
    border: 1px solid rgba(14, 165, 233, 0.24);
    border-radius: 10px;
    color: var(--admin-text, #E0F2FE);
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 14px;
    padding: 12px;
}

.billing-invoice-strip {
    border-top: 1px solid rgba(148, 163, 184, 0.14);
    margin-top: 14px;
    padding-top: 12px;
}

.billing-invoice-strip__title strong {
    color: var(--admin-text, #F8FAFC);
}

.billing-invoice-strip__title span {
    color: var(--admin-text-muted, #94A3B8);
    font-size: 12px;
}

.billing-invoice-list {
    display: grid;
    gap: 8px;
    margin-top: 10px;
}

.billing-overview-invoices {
    display: grid;
    gap: 8px;
}

.billing-overview-invoice {
    align-items: center;
    background: rgba(15, 23, 42, 0.50);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 10px;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(170px, 1fr) minmax(150px, auto) minmax(180px, auto);
    padding: 10px 12px;
}

.billing-overview-invoice__main {
    min-width: 0;
}

.billing-overview-invoice__main strong {
    color: var(--admin-text, #F8FAFC);
    display: block;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.billing-overview-invoice__main span,
.billing-overview-invoice__meta small {
    color: var(--admin-text-muted, #94A3B8);
    display: block;
    font-size: 12px;
    margin-top: 4px;
}

.billing-overview-invoice__meta {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.billing-invoice-row {
    align-items: center;
    background: rgba(15, 23, 42, 0.50);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 8px;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(110px, 1fr) auto auto auto auto;
    padding: 8px 10px;
}

.billing-invoice-row--with-actions {
    grid-template-columns: minmax(110px, 1fr) auto auto auto minmax(170px, auto);
}

.billing-dual-badges,
.billing-action-cluster {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.billing-action-cluster {
    justify-content: flex-end;
}

.billing-action-cluster--compact {
    font-size: 12px;
}

.billing-action-button {
    align-items: center;
    border: 1px solid rgba(148, 163, 184, 0.20);
    border-radius: 7px;
    cursor: pointer;
    display: inline-flex;
    font-size: 12px;
    font-weight: 850;
    justify-content: center;
    line-height: 1;
    min-height: 30px;
    padding: 7px 10px;
    white-space: nowrap;
}

.billing-action-button--neutral {
    background: rgba(100, 116, 139, 0.14);
    color: var(--admin-text-muted, #CBD5E1);
}

.billing-action-button--primary {
    background: rgba(99, 102, 241, 0.18);
    border-color: rgba(129, 140, 248, 0.35);
    color: var(--admin-info, #C4B5FD);
}

.billing-action-button--success {
    background: rgba(16, 185, 129, 0.16);
    border-color: rgba(52, 211, 153, 0.34);
    color: #86EFAC;
}

.billing-action-button--danger {
    background: rgba(239, 68, 68, 0.14);
    border-color: rgba(248, 113, 113, 0.32);
    color: var(--admin-danger, #FCA5A5);
}

.billing-action-button:hover {
    filter: brightness(1.12);
}

.billing-invoice-row span,
.billing-invoice-row strong,
.billing-table td {
    color: var(--admin-text, #E2E8F0);
}

.billing-table--actions {
    min-width: 860px;
}

.billing-table--compact {
    min-width: 640px;
}

.billing-history-list {
    display: grid;
    gap: 8px;
}

.billing-history-row {
    background: rgba(15, 23, 42, 0.50);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 8px;
    padding: 10px 12px;
}

.billing-history-row summary {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    list-style: none;
}

.billing-history-row summary::-webkit-details-marker {
    display: none;
}

.billing-history-row strong {
    color: var(--admin-text, #E2E8F0);
    display: block;
}

.billing-history-row em {
    color: var(--admin-text-muted, #94A3B8);
    display: block;
    font-size: 12px;
    font-style: normal;
    margin-top: 3px;
}

.billing-history-row span,
.billing-history-row small {
    color: var(--admin-text-muted, #94A3B8);
    font-size: 12px;
}

.billing-history-changes {
    display: grid;
    gap: 7px;
    list-style: none;
    margin-top: 10px;
}

.billing-history-changes li {
    align-items: center;
    background: rgba(30, 41, 59, 0.50);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 7px;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(120px, 0.32fr) minmax(0, 1fr);
    padding: 8px 10px;
}

.billing-history-changes li strong {
    color: var(--admin-info, #C4B5FD);
    font-size: 12px;
}

.billing-history-technical {
    margin-top: 10px;
}

.billing-history-technical summary {
    color: var(--admin-accent, #67E8F9);
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
}

.billing-history-technical pre {
    background: rgba(2, 6, 23, 0.55);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 8px;
    color: var(--admin-text-muted, #CBD5E1);
    font-size: 11px;
    margin-top: 8px;
    max-height: 260px;
    overflow: auto;
    padding: 10px;
    white-space: pre-wrap;
}

.billing-history-muted {
    color: var(--admin-text-muted, #94A3B8);
    font-size: 12px;
    margin-top: 10px;
}

.billing-invoice-row small {
    color: var(--admin-text-muted, #94A3B8);
}

.billing-table-wrap {
    overflow-x: auto;
}

.billing-table {
    border-collapse: collapse;
    min-width: 720px;
    width: 100%;
}

.billing-table th {
    color: var(--admin-text-muted, #94A3B8);
    font-size: 11px;
    letter-spacing: 0.08em;
    padding: 10px;
    text-align: left;
    text-transform: uppercase;
}

.billing-table td {
    border-top: 1px solid rgba(148, 163, 184, 0.12);
    padding: 10px;
}

.billing-loading,
.billing-alert {
    align-items: center;
    color: var(--admin-text-muted, #CBD5E1);
    display: flex;
    gap: 10px;
    padding: 18px;
}

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

.billing-alert--error {
    background: rgba(127, 29, 29, 0.28);
    border-color: rgba(248, 113, 113, 0.30);
    color: var(--admin-danger, #FECACA);
}

.billing-alert--warning {
    background: rgba(146, 64, 14, 0.20);
    border-color: rgba(251, 191, 36, 0.34);
    color: var(--admin-warning, #FDE68A);
}

@media (max-width: 768px) {
    .management-report-controls,
    .management-report-columns,
    .management-report-preview-grid,
    .copilot-columns {
        grid-template-columns: 1fr !important;
    }

    .management-report-actions,
    .management-report-builder-main,
    .copilot-actions,
    .copilot-chat-header,
    .copilot-input-row,
    .billing-toolbar__actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .management-report-actions .billing-button,
    .management-report-output .billing-button,
    .copilot-actions .billing-button,
    .copilot-result .billing-button {
        flex: 1 1 100%;
    }

    .management-report-toggle {
        flex: 1 1 calc(50% - 8px);
        justify-content: center;
    }

    .copilot-ticket {
        grid-template-columns: 1fr;
    }

    .copilot-ticket small {
        grid-column: 1;
    }

    .copilot-bubble {
        max-width: 100%;
    }

    .copilot-thread {
        max-height: 460px;
    }

    .copilot-input-row button {
        min-height: 42px;
    }
}

.billing-alert--info {
    background: rgba(14, 165, 233, 0.10);
    border-color: rgba(14, 165, 233, 0.30);
    color: var(--admin-info, #BAE6FD);
}

.billing-alert strong {
    color: #FFFFFF;
}

.billing-alert code {
    color: var(--admin-warning, #FDE68A);
}

.billing-spinner {
    animation: spin 0.9s linear infinite;
    border: 2px solid rgba(148, 163, 184, 0.25);
    border-top-color: #38BDF8;
    border-radius: 50%;
    height: 18px;
    width: 18px;
}

.management-report-builder {
    display: grid;
    gap: 16px;
}

.management-report-controls {
    align-items: end;
}

.management-report-builder-card {
    background: rgba(15, 23, 42, 0.42);
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 12px;
    display: grid;
    gap: 14px;
    padding: 14px;
}

.management-report-builder-main {
    align-items: start;
    display: flex;
    gap: 14px;
    justify-content: space-between;
}

.management-report-builder-main > div:first-child > span,
.management-report-preview-label {
    color: var(--admin-accent, #22D3EE);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    margin: 0 0 6px;
    text-transform: uppercase;
}

.management-report-builder-main h3 {
    color: var(--admin-text, #F8FAFC);
    font-size: 18px;
    font-weight: 900;
    margin: 0 0 4px;
}

.management-report-type-row {
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(220px, 360px);
}

.management-report-type-row label {
    color: var(--admin-text-muted, #94A3B8);
    display: grid;
    font-size: 12px;
    font-weight: 800;
    gap: 6px;
}

.management-report-preview-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.management-report-credit {
    align-items: flex-start;
    background: rgba(14, 165, 233, 0.10);
    border: 1px solid rgba(14, 165, 233, 0.24);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-height: 54px;
    padding: 10px 12px;
}

.management-report-credit span,
.management-report-sections > p {
    color: var(--admin-text-muted, #94A3B8);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.management-report-credit strong {
    color: var(--admin-text, #E0F2FE);
    font-size: 18px;
}

.management-report-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.management-report-toggles {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.management-report-toggle {
    align-items: center;
    background: rgba(15, 23, 42, 0.62);
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 999px;
    color: var(--admin-text-muted, #CBD5E1);
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    gap: 6px;
    padding: 7px 10px;
}

.management-report-toggle input {
    accent-color: var(--admin-accent, #22D3EE);
}

.management-report-list,
.management-report-body ul {
    display: grid;
    gap: 8px;
    list-style: disc;
    margin: 0;
    padding-left: 18px;
}

.management-report-list li,
.management-report-body li {
    color: var(--admin-text-muted, #CBD5E1);
    font-size: 13px;
}

.management-report-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.management-report-body {
    color: var(--admin-text-muted, #CBD5E1);
    display: grid;
    gap: 16px;
    line-height: 1.6;
}

.management-report-body h4 {
    color: var(--admin-text, #F8FAFC);
    font-size: 14px;
    font-weight: 900;
    margin: 0 0 6px;
}

.management-report-body p {
    margin: 0;
}

.management-report-columns {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.management-report-section {
    background: rgba(15, 23, 42, 0.46);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 10px;
    padding: 14px;
}

.copilot-panel {
    display: grid;
    gap: 16px;
}

.copilot-builder {
    display: grid;
    gap: 14px;
}

.copilot-scope {
    background: rgba(15, 23, 42, 0.42);
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 10px;
    display: grid;
    gap: 3px;
    padding: 12px;
}

.copilot-scope span,
.copilot-question-field span,
.copilot-answer-card h4,
.copilot-columns h4 {
    color: var(--admin-accent, #22D3EE);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.copilot-scope strong {
    color: var(--admin-text, #F8FAFC);
    font-size: 15px;
}

.copilot-scope small,
.copilot-summary {
    color: var(--admin-text-muted, #94A3B8);
}

.copilot-quick-questions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.copilot-quick-questions button {
    background: rgba(15, 23, 42, 0.62);
    border: 1px solid rgba(148, 163, 184, 0.20);
    border-radius: 999px;
    color: var(--admin-text-muted, #CBD5E1);
    cursor: pointer;
    font-size: 12px;
    font-weight: 800;
    padding: 8px 11px;
    transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}

.copilot-quick-questions button:hover,
.copilot-quick-questions button.is-active {
    background: rgba(34, 211, 238, 0.14);
    border-color: rgba(34, 211, 238, 0.42);
    color: var(--admin-text, #E0F2FE);
}

.copilot-question-field {
    color: var(--admin-text-muted, #94A3B8);
    display: grid;
    gap: 6px;
}

.copilot-question-field textarea {
    background: rgba(15, 23, 42, 0.70);
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 10px;
    color: var(--admin-text, #F8FAFC);
    min-height: 86px;
    padding: 12px;
    resize: vertical;
    width: 100%;
}

.copilot-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.copilot-result {
    display: grid;
    gap: 14px;
}

.copilot-answer-card,
.copilot-columns > div,
.copilot-ticket {
    background: rgba(15, 23, 42, 0.44);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 10px;
    padding: 14px;
}

.copilot-answer-card p,
.copilot-columns p,
.copilot-columns li {
    color: var(--admin-text-muted, #CBD5E1);
    font-size: 13px;
    line-height: 1.6;
}

.copilot-columns {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.copilot-columns ul {
    display: grid;
    gap: 8px;
    list-style: disc;
    margin: 8px 0 0;
    padding-left: 18px;
}

.copilot-related {
    display: grid;
    gap: 10px;
}

.copilot-ticket {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(90px, 140px) minmax(0, 1fr);
}

.copilot-ticket strong {
    color: var(--admin-text, #E0F2FE);
}

.copilot-ticket span {
    color: var(--admin-text, #F8FAFC);
    font-weight: 800;
}

.copilot-ticket small {
    color: var(--admin-text-muted, #94A3B8);
    grid-column: 2;
}

.copilot-chat {
    gap: 12px;
}

.copilot-chat-header {
    align-items: flex-start;
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

.copilot-chat-header h3 {
    color: var(--admin-text, #F8FAFC);
    font-size: 18px;
    font-weight: 900;
    margin: 0 0 3px;
}

.copilot-credit-badge {
    background: rgba(14, 165, 233, 0.12);
    border: 1px solid rgba(14, 165, 233, 0.32);
    border-radius: 999px;
    color: var(--admin-info, #BAE6FD);
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 900;
    padding: 6px 10px;
}

.copilot-scope-line {
    color: var(--admin-text-muted, #94A3B8);
    font-size: 12px;
}

.copilot-blocked-message {
    background: rgba(146, 64, 14, 0.18);
    border: 1px solid rgba(251, 191, 36, 0.28);
    border-radius: 10px;
    color: var(--admin-warning, #FDE68A);
    font-size: 13px;
    padding: 10px 12px;
}

.copilot-chat-body,
.copilot-thread {
    display: grid;
    gap: 12px;
}

.copilot-thread {
    background: rgba(2, 6, 23, 0.24);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 12px;
    max-height: 520px;
    overflow-y: auto;
    padding: 12px;
}

.copilot-suggestions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.copilot-suggestions button {
    background: rgba(15, 23, 42, 0.62);
    border: 1px solid rgba(148, 163, 184, 0.20);
    border-radius: 999px;
    color: var(--admin-text-muted, #CBD5E1);
    cursor: pointer;
    font-size: 12px;
    font-weight: 800;
    padding: 7px 10px;
    transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}

.copilot-suggestions button:hover,
.copilot-suggestions button.is-active {
    background: rgba(34, 211, 238, 0.14);
    border-color: rgba(34, 211, 238, 0.42);
    color: var(--admin-text, #E0F2FE);
}

.copilot-message {
    display: flex;
}

.copilot-message-user {
    justify-content: flex-end;
}

.copilot-message-assistant {
    justify-content: flex-start;
}

.copilot-bubble {
    background: rgba(15, 23, 42, 0.70);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 16px;
    color: var(--admin-text-muted, #CBD5E1);
    font-size: 13px;
    line-height: 1.55;
    max-width: min(760px, 90%);
    padding: 12px;
}

.copilot-message-user .copilot-bubble {
    background: rgba(8, 145, 178, 0.18);
    border-color: rgba(34, 211, 238, 0.32);
    color: var(--admin-text, #ECFEFF);
}

.copilot-message-assistant .copilot-bubble {
    border-top-left-radius: 4px;
}

.copilot-message-user .copilot-bubble {
    border-top-right-radius: 4px;
}

.copilot-bubble p {
    margin: 0;
}

.copilot-bubble-loading {
    color: var(--admin-text-muted, #94A3B8);
}

.copilot-mini-section {
    margin-top: 10px;
}

.copilot-mini-section strong {
    color: var(--admin-accent, #22D3EE);
    display: block;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.copilot-mini-section ul {
    display: grid;
    gap: 5px;
    list-style: disc;
    margin: 0;
    padding-left: 18px;
}

.copilot-related-tickets {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.copilot-related-tickets span {
    background: rgba(2, 6, 23, 0.30);
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 999px;
    color: var(--admin-text-muted, #CBD5E1);
    display: inline-flex;
    gap: 6px;
    max-width: 100%;
    overflow: hidden;
    padding: 6px 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.copilot-related-tickets b {
    color: var(--admin-info, #BAE6FD);
}

.copilot-bubble-actions {
    align-items: center;
    border-top: 1px solid rgba(148, 163, 184, 0.14);
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: space-between;
    margin-top: 12px;
    padding-top: 10px;
}

.copilot-bubble-actions span {
    color: var(--admin-text-muted, #94A3B8);
    font-size: 11px;
    font-weight: 800;
}

.copilot-bubble-actions button,
.copilot-clear-button {
    background: rgba(15, 23, 42, 0.72);
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 8px;
    color: var(--admin-text, #E2E8F0);
    cursor: pointer;
    font-size: 12px;
    font-weight: 800;
    padding: 7px 10px;
}

.copilot-input-row {
    align-items: stretch;
    display: flex;
    gap: 8px;
}

.copilot-input-row textarea {
    background: rgba(15, 23, 42, 0.70);
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 10px;
    color: var(--admin-text, #F8FAFC);
    flex: 1 1 auto;
    min-height: 42px;
    padding: 10px 12px;
    resize: vertical;
}

.copilot-input-row button {
    background: linear-gradient(135deg, #0EA5E9, #6366F1);
    border: 0;
    border-radius: 10px;
    color: #FFFFFF;
    cursor: pointer;
    flex: 0 0 auto;
    font-size: 13px;
    font-weight: 900;
    padding: 0 18px;
}

.copilot-input-row button:disabled,
.copilot-clear-button:disabled {
    cursor: not-allowed;
    opacity: 0.58;
}

.copilot-clear-button {
    justify-self: start;
}

.billing-empty {
    color: var(--admin-text-muted, #94A3B8);
    padding: 12px;
}

.billing-plan-card--inactive {
    opacity: 0.72;
}

.billing-plan-tags {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
    max-width: 52%;
}

.billing-plan-tag {
    border-radius: 999px;
    display: inline-flex;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    padding: 5px 7px;
    text-transform: uppercase;
    white-space: nowrap;
}

.billing-plan-tag--current,
.billing-plan-tag--popular {
    background: rgba(14, 165, 233, 0.16);
    border: 1px solid rgba(14, 165, 233, 0.34);
    color: var(--admin-info, #7DD3FC);
}

.billing-plan-tag--best_value {
    background: rgba(16, 185, 129, 0.16);
    border: 1px solid rgba(16, 185, 129, 0.34);
    color: var(--admin-success, #6EE7B7);
}

.billing-plan-tag--custom,
.billing-plan-tag--internal,
.billing-plan-tag--trial {
    background: rgba(139, 92, 246, 0.16);
    border: 1px solid rgba(139, 92, 246, 0.34);
    color: var(--admin-info, #C4B5FD);
}

.billing-plan-tag--private,
.billing-plan-tag--locked {
    background: rgba(100, 116, 139, 0.18);
    border: 1px solid rgba(148, 163, 184, 0.26);
    color: var(--admin-text-muted, #CBD5E1);
}

.billing-plan-card__actions {
    border-top: 1px solid rgba(148, 163, 184, 0.12);
    margin-top: 12px;
    padding-top: 12px;
}

.billing-plan-card__actions .billing-button {
    width: 100%;
}

.billing-plan-editor-open {
    overflow: hidden;
}

.billing-plan-editor-backdrop {
    align-items: stretch;
    background: rgba(2, 6, 23, 0.66);
    display: flex;
    inset: 0;
    justify-content: flex-end;
    padding: 16px;
    position: fixed;
    z-index: 80;
}

.billing-plan-editor-backdrop[hidden] {
    display: none;
}

.billing-plan-editor {
    background: var(--admin-bg, #0F172A);
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 14px;
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.42);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    overflow: hidden;
    width: min(860px, calc(100vw - 32px));
}

.billing-plan-editor__header {
    align-items: flex-start;
    border-bottom: 1px solid rgba(148, 163, 184, 0.16);
    display: flex;
    gap: 16px;
    justify-content: space-between;
    padding: 16px;
}

.billing-plan-editor__header span,
.billing-plan-editor__grid label > span,
.billing-plan-features__header strong {
    color: var(--admin-info, #8B5CF6);
    display: block;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.billing-plan-editor__header h3 {
    color: var(--admin-text, #F8FAFC);
    font-size: 20px;
    font-weight: 900;
    margin: 4px 0 5px;
}

.billing-plan-editor__header p,
.billing-plan-editor__form small,
.billing-plan-switch small,
.billing-feature-toggle small,
.billing-plan-features__header span {
    color: var(--admin-text-muted, #94A3B8);
    font-size: 12px;
    line-height: 1.45;
}

.billing-plan-editor__close {
    align-items: center;
    background: rgba(15, 23, 42, 0.82);
    border: 1px solid rgba(148, 163, 184, 0.25);
    border-radius: 8px;
    color: var(--admin-text-muted, #CBD5E1);
    display: inline-flex;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.billing-plan-editor__close:hover {
    background: rgba(30, 41, 59, 0.92);
    color: #FFFFFF;
}

.billing-plan-editor__form {
    display: grid;
    gap: 14px;
    overflow-y: auto;
    padding: 16px;
}

.billing-plan-editor__grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.billing-plan-editor__grid label,
.billing-plan-editor__switches,
.billing-plan-features,
.billing-feature-toggle {
    background: rgba(15, 23, 42, 0.62);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 10px;
}

.billing-plan-editor__grid label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 10px;
}

.billing-plan-editor__wide {
    grid-column: 1 / -1;
}

.billing-plan-editor__grid input,
.billing-plan-editor__grid select,
.billing-plan-editor__grid textarea,
.billing-feature-toggle select {
    background: rgba(15, 23, 42, 0.86);
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 8px;
    color: var(--admin-text, #F8FAFC);
    min-height: 38px;
    padding: 8px 10px;
    width: 100%;
}

.billing-plan-editor__grid textarea {
    min-height: 84px;
    resize: vertical;
}

.billing-plan-editor__switches {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 10px;
}

.billing-plan-switch,
.billing-feature-toggle label {
    align-items: flex-start;
    display: flex;
    gap: 10px;
}

.billing-plan-switch input,
.billing-feature-toggle input {
    accent-color: var(--admin-info, #8B5CF6);
    flex: 0 0 auto;
    margin-top: 3px;
}

.billing-plan-switch strong,
.billing-feature-toggle strong {
    color: var(--admin-text, #F8FAFC);
    display: block;
    font-size: 13px;
    margin-bottom: 3px;
}

.billing-plan-features {
    display: grid;
    gap: 10px;
    padding: 12px;
}

.billing-plan-features__header {
    align-items: end;
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

.billing-feature-toggle {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(0, 1fr) 130px;
    padding: 10px;
}

.billing-feature-toggle select:disabled {
    cursor: not-allowed;
    opacity: 0.52;
}

.billing-plan-editor__actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    position: sticky;
    bottom: -16px;
    background: var(--admin-bg, #0F172A);
    border-top: 1px solid rgba(148, 163, 184, 0.16);
    margin: 0 -16px -16px;
    padding: 12px 16px;
}

html[data-theme="light"] .billing-hero,
html[data-theme="light"] .billing-section,
html[data-theme="light"] .billing-org-card,
html[data-theme="light"] .billing-plan-card,
html[data-theme="light"] .billing-loading,
html[data-theme="light"] .billing-alert,
html[data-theme="light"] .billing-note {
    background: #FFFFFF;
    border-color: var(--admin-text-muted, #CBD5E1);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08);
}

html[data-theme="light"] .billing-tabs {
    background: #F8FAFC;
    border-color: var(--admin-text, #DCE4EF);
}

html[data-theme="light"] .billing-tab {
    color: var(--admin-text-muted, #475569);
}

html[data-theme="light"] .billing-tab:hover {
    background: #E0F2FE;
    border-color: var(--admin-info, #BAE6FD);
    color: #075985;
}

html[data-theme="light"] .billing-tab.is-active {
    background: linear-gradient(135deg, #E0F2FE, #EEF2FF);
    border-color: var(--admin-info, #7DD3FC);
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .billing-filter-bar {
    background: #F8FAFC;
    border-color: var(--admin-text, #DCE4EF);
}

html[data-theme="light"] .billing-org-card__header:hover {
    background: #F0F9FF;
}

html[data-theme="light"] .billing-org-card__chevron {
    border-color: #0369A1;
}

html[data-theme="light"] .billing-hero h3,
html[data-theme="light"] .billing-section__header h3,
html[data-theme="light"] .billing-org-card h4,
html[data-theme="light"] .billing-plan-card__top strong,
html[data-theme="light"] .billing-price-row span,
html[data-theme="light"] .billing-metric-card strong,
html[data-theme="light"] .billing-usage-grid strong,
html[data-theme="light"] .billing-invoice-strip__title strong,
html[data-theme="light"] .billing-note strong,
html[data-theme="light"] .billing-alert strong {
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .billing-hero p,
html[data-theme="light"] .billing-note,
html[data-theme="light"] .billing-plan-card small,
html[data-theme="light"] .billing-org-card__period strong,
html[data-theme="light"] .billing-upgrade-note span,
html[data-theme="light"] .billing-usage-grid small,
html[data-theme="light"] .billing-invoice-row small,
html[data-theme="light"] .billing-empty {
    color: var(--admin-text-muted, #475569);
}

html[data-theme="light"] .billing-metric-card,
html[data-theme="light"] .billing-usage-grid > div,
html[data-theme="light"] .billing-controls,
html[data-theme="light"] .billing-manual-form,
html[data-theme="light"] .billing-invoice-row,
html[data-theme="light"] .billing-overview-invoice,
html[data-theme="light"] .billing-org-card__summary span,
html[data-theme="light"] .billing-history-changes li,
html[data-theme="light"] .billing-plan-facts span,
html[data-theme="light"] .billing-feature-list span {
    background: #F8FAFC;
    border-color: var(--admin-text, #DCE4EF);
}

html[data-theme="light"] .billing-controls input,
html[data-theme="light"] .billing-controls select,
html[data-theme="light"] .billing-manual-form input,
html[data-theme="light"] .billing-manual-form select,
html[data-theme="light"] .billing-toolbar input,
html[data-theme="light"] .billing-toolbar select,
html[data-theme="light"] .billing-filter-bar input,
html[data-theme="light"] .billing-filter-bar select {
    background: #FFFFFF;
    border-color: var(--admin-text-muted, #CBD5E1);
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .billing-plan-facts span,
html[data-theme="light"] .billing-feature-list span,
html[data-theme="light"] .billing-invoice-row span,
html[data-theme="light"] .billing-invoice-row strong,
html[data-theme="light"] .billing-overview-invoice__main strong,
html[data-theme="light"] .billing-org-card__summary span,
html[data-theme="light"] .billing-table td,
html[data-theme="light"] .billing-history-row strong {
    color: #334155;
}

html[data-theme="light"] .billing-helper-text,
html[data-theme="light"] .billing-section-note,
html[data-theme="light"] .billing-history-row span,
html[data-theme="light"] .billing-history-row small,
html[data-theme="light"] .billing-history-row em,
html[data-theme="light"] .billing-history-muted,
html[data-theme="light"] .billing-note small,
html[data-theme="light"] .billing-overview-invoice__main span,
html[data-theme="light"] .billing-overview-invoice__meta small,
html[data-theme="light"] .billing-pagination {
    color: var(--admin-text-muted, #475569);
}

html[data-theme="light"] .billing-usage-warning--soft {
    color: #B45309;
}

html[data-theme="light"] .billing-usage-warning--strong {
    color: #C2410C;
}

html[data-theme="light"] .billing-usage-warning--block {
    color: var(--admin-danger, #B91C1C);
}

html[data-theme="light"] .billing-history-row {
    background: #F8FAFC;
    border-color: var(--admin-text, #DCE4EF);
}

html[data-theme="light"] .billing-history-changes li strong {
    color: #6D28D9;
}

html[data-theme="light"] .billing-history-technical summary {
    color: #0369A1;
}

html[data-theme="light"] .billing-history-technical pre {
    background: #F8FAFC;
    border-color: var(--admin-text, #DCE4EF);
    color: #334155;
}

html[data-theme="light"] .billing-action-button--neutral {
    background: #F8FAFC;
    border-color: var(--admin-text-muted, #CBD5E1);
    color: #334155;
}

html[data-theme="light"] .billing-action-button--primary {
    background: #EEF2FF;
    border-color: var(--admin-info, #C4B5FD);
    color: #5B21B6;
}

html[data-theme="light"] .billing-action-button--success {
    background: #ECFDF5;
    border-color: #A7F3D0;
    color: #047857;
}

html[data-theme="light"] .billing-action-button--danger {
    background: #FEF2F2;
    border-color: var(--admin-danger, #FECACA);
    color: var(--admin-danger, #B91C1C);
}

html[data-theme="light"] .billing-progress {
    background: #E2E8F0;
}

html[data-theme="light"] .billing-alert--error {
    background: #FFF1F2;
    border-color: #FDA4AF;
    color: #9F1239;
}

html[data-theme="light"] .billing-alert--warning {
    background: #FFFBEB;
    border-color: var(--admin-warning, #FCD34D);
    color: var(--admin-warning, #92400E);
}

html[data-theme="light"] .billing-alert--info {
    background: #EFF6FF;
    border-color: var(--admin-info, #93C5FD);
    color: #1E3A8A;
}

html[data-theme="light"] .billing-alert code {
    color: var(--admin-warning, #92400E);
}

html[data-theme="light"] .management-report-credit {
    background: #EFF6FF;
    border-color: #BFDBFE;
}

html[data-theme="light"] .management-report-builder-card {
    background: rgba(248, 250, 252, 0.86);
    border-color: rgba(148, 163, 184, 0.28);
}

html[data-theme="light"] .management-report-builder-main h3 {
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .management-report-credit span,
html[data-theme="light"] .management-report-sections > p {
    color: var(--admin-text-subtle, #64748B);
}

html[data-theme="light"] .management-report-credit strong {
    color: #075985;
}

html[data-theme="light"] .management-report-toggle {
    background: #FFFFFF;
    border-color: var(--admin-text-muted, #CBD5E1);
    color: #334155;
}

html[data-theme="light"] .management-report-list li,
html[data-theme="light"] .management-report-body,
html[data-theme="light"] .management-report-body li {
    color: #334155;
}

html[data-theme="light"] .management-report-body h4 {
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .management-report-section {
    background: #F8FAFC;
    border-color: var(--admin-text, #E2E8F0);
}

html[data-theme="light"] .copilot-scope,
html[data-theme="light"] .copilot-answer-card,
html[data-theme="light"] .copilot-columns > div,
html[data-theme="light"] .copilot-ticket {
    background: #F8FAFC;
    border-color: var(--admin-text, #E2E8F0);
}

html[data-theme="light"] .copilot-chat-header h3 {
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .copilot-scope-line {
    color: var(--admin-text-subtle, #64748B);
}

html[data-theme="light"] .copilot-thread,
html[data-theme="light"] .copilot-bubble,
html[data-theme="light"] .copilot-related-tickets span,
html[data-theme="light"] .copilot-bubble-actions button,
html[data-theme="light"] .copilot-clear-button {
    background: #F8FAFC;
    border-color: var(--admin-text, #E2E8F0);
    color: #334155;
}

html[data-theme="light"] .copilot-message-user .copilot-bubble {
    background: #ECFEFF;
    border-color: var(--admin-accent, #67E8F9);
    color: var(--admin-accent, #155E75);
}

html[data-theme="light"] .copilot-input-row textarea {
    background: #FFFFFF;
    border-color: var(--admin-text-muted, #CBD5E1);
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .copilot-blocked-message {
    background: #FFFBEB;
    border-color: var(--admin-warning, #FCD34D);
    color: var(--admin-warning, #92400E);
}

html[data-theme="light"] .copilot-scope strong,
html[data-theme="light"] .copilot-ticket span {
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .copilot-question-field textarea {
    background: #FFFFFF;
    border-color: var(--admin-text-muted, #CBD5E1);
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .copilot-quick-questions button {
    background: #FFFFFF;
    border-color: var(--admin-text-muted, #CBD5E1);
    color: #334155;
}

html[data-theme="light"] .copilot-suggestions button {
    background: #FFFFFF;
    border-color: var(--admin-text-muted, #CBD5E1);
    color: #334155;
}

html[data-theme="light"] .copilot-quick-questions button:hover,
html[data-theme="light"] .copilot-quick-questions button.is-active {
    background: #ECFEFF;
    border-color: var(--admin-accent, #67E8F9);
    color: var(--admin-accent, #155E75);
}

html[data-theme="light"] .copilot-suggestions button:hover,
html[data-theme="light"] .copilot-suggestions button.is-active {
    background: #ECFEFF;
    border-color: var(--admin-accent, #67E8F9);
    color: var(--admin-accent, #155E75);
}

html[data-theme="light"] .copilot-answer-card p,
html[data-theme="light"] .copilot-columns p,
html[data-theme="light"] .copilot-columns li {
    color: #334155;
}

html[data-theme="light"] .copilot-ticket small,
html[data-theme="light"] .copilot-scope small,
html[data-theme="light"] .copilot-summary {
    color: var(--admin-text-subtle, #64748B);
}

html[data-theme="light"] .billing-plan-tag--private,
html[data-theme="light"] .billing-plan-tag--locked {
    background: #F1F5F9;
    border-color: var(--admin-text-muted, #CBD5E1);
    color: var(--admin-text-muted, #475569);
}

html[data-theme="light"] .billing-plan-editor {
    background: #FFFFFF;
    border-color: var(--admin-text-muted, #CBD5E1);
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.16);
}

html[data-theme="light"] .billing-plan-editor__header {
    border-color: var(--admin-text, #DCE4EF);
}

html[data-theme="light"] .billing-plan-editor__header h3,
html[data-theme="light"] .billing-plan-switch strong,
html[data-theme="light"] .billing-feature-toggle strong {
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .billing-plan-editor__header p,
html[data-theme="light"] .billing-plan-editor__form small,
html[data-theme="light"] .billing-plan-switch small,
html[data-theme="light"] .billing-feature-toggle small,
html[data-theme="light"] .billing-plan-features__header span {
    color: var(--admin-text-muted, #475569);
}

html[data-theme="light"] .billing-plan-editor__grid label,
html[data-theme="light"] .billing-plan-editor__switches,
html[data-theme="light"] .billing-plan-features,
html[data-theme="light"] .billing-feature-toggle {
    background: #F8FAFC;
    border-color: var(--admin-text, #DCE4EF);
}

html[data-theme="light"] .billing-plan-editor__grid input,
html[data-theme="light"] .billing-plan-editor__grid select,
html[data-theme="light"] .billing-plan-editor__grid textarea,
html[data-theme="light"] .billing-feature-toggle select {
    background: #FFFFFF;
    border-color: var(--admin-text-muted, #CBD5E1);
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .billing-plan-editor__close {
    background: #F8FAFC;
    border-color: var(--admin-text-muted, #CBD5E1);
    color: var(--admin-text-muted, #475569);
}

html[data-theme="light"] .billing-plan-editor__close:hover {
    background: #E2E8F0;
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .billing-plan-editor__actions {
    background: #FFFFFF;
    border-color: var(--admin-text, #DCE4EF);
}

/* AI Ops Brain MVP */
.ai-ops-brain {
    --ops-bg-card: rgba(15, 23, 42, 0.72);
    --ops-bg-subtle: rgba(30, 41, 59, 0.78);
    --ops-text: #F8FAFC;
    --ops-text-soft: #CBD5E1;
    --ops-text-muted: #94A3B8;
    --ops-border: rgba(148, 163, 184, 0.18);
    --ops-border-strong: rgba(148, 163, 184, 0.3);
    --ops-brand: #38BDF8;
    --ops-brand-hover: #0EA5E9;
    --ops-success-bg: rgba(16, 185, 129, 0.14);
    --ops-success-border: rgba(16, 185, 129, 0.35);
    --ops-warning-bg: rgba(245, 158, 11, 0.14);
    --ops-warning-border: rgba(245, 158, 11, 0.38);
    --ops-danger-bg: rgba(244, 63, 94, 0.14);
    --ops-danger-border: rgba(244, 63, 94, 0.38);
    --ops-info-bg: rgba(56, 189, 248, 0.12);
    --ops-info-border: rgba(56, 189, 248, 0.34);
    display: grid;
    gap: 16px;
    min-width: 0;
}

.ai-ops-hero,
.ai-ops-section,
.ai-ops-toolbar,
.ai-ops-empty,
.ai-ops-notes {
    background: var(--ops-bg-card);
    border: 1px solid var(--ops-border);
    border-radius: 8px;
    box-shadow: 0 16px 40px rgba(2, 6, 23, 0.18);
}

.ai-ops-hero {
    align-items: flex-start;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    padding: 18px;
}

.ai-ops-hero span,
.ai-ops-section-head span,
.ai-ops-summary-card span,
.ai-ops-toolbar label span {
    color: var(--ops-text-muted);
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.ai-ops-hero h3,
.ai-ops-section-head h3,
.ai-ops-empty h3,
.ai-ops-mini-card strong,
.ai-ops-risk-title strong,
.ai-ops-repeat-list strong,
.ai-ops-recommendations span,
.ai-ops-two-column h4 {
    color: var(--ops-text);
    letter-spacing: 0;
}

.ai-ops-hero h3 {
    font-size: 24px;
    font-weight: 850;
    margin: 4px 0 6px;
}

.ai-ops-hero p,
.ai-ops-empty p,
.ai-ops-risk-meta,
.ai-ops-risk-main p,
.ai-ops-mini-card span,
.ai-ops-section-head small,
.ai-ops-two-column p,
.ai-ops-repeat-list span,
.ai-ops-notes span {
    color: var(--ops-text-soft);
}

.ai-ops-hero-badges,
.ai-ops-risk-badges,
.ai-ops-reasons {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.ai-ops-toolbar {
    align-items: end;
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    padding: 12px;
}

.ai-ops-toolbar select {
    background: var(--ops-bg-subtle);
    border: 1px solid var(--ops-border-strong);
    border-radius: 8px;
    color: var(--ops-text);
    font-size: 13px;
    min-height: 38px;
    padding: 8px 10px;
    width: 100%;
}

.ai-ops-button {
    align-items: center;
    background: var(--ops-brand);
    border: 1px solid var(--ops-brand);
    border-radius: 8px;
    color: #06121F;
    cursor: pointer;
    display: inline-flex;
    font-size: 13px;
    font-weight: 800;
    justify-content: center;
    min-height: 38px;
    padding: 8px 12px;
}

.ai-ops-button:hover {
    background: var(--ops-brand-hover);
}

.ai-ops-button--secondary {
    background: var(--ops-bg-subtle);
    border-color: var(--ops-border-strong);
    color: var(--ops-text);
}

.ai-ops-ticket-unavailable {
    border: 1px solid var(--ops-border-strong);
    border-radius: 8px;
    color: var(--ops-muted);
    display: inline-flex;
    font-size: 11px;
    font-weight: 800;
    justify-content: center;
    line-height: 1.25;
    padding: 8px 10px;
    text-align: center;
}

.ai-ops-summary-grid,
.ai-ops-health-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.ai-ops-summary-card,
.ai-ops-risk-row,
.ai-ops-mini-card,
.ai-ops-repeat-list article,
.ai-ops-recommendations article,
.ai-ops-sublist div,
.ai-ops-two-column > div {
    background: var(--ops-bg-subtle);
    border: 1px solid var(--ops-border);
    border-radius: 8px;
}

.ai-ops-summary-card {
    padding: 14px;
}

.ai-ops-summary-card strong {
    color: var(--ops-text);
    display: block;
    font-size: 28px;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
    margin-top: 8px;
}

.ai-ops-summary-card small {
    color: var(--ops-text-soft);
    display: block;
    margin-top: 4px;
}

.ai-ops-summary-card--danger { border-color: var(--ops-danger-border); background: var(--ops-danger-bg); }
.ai-ops-summary-card--warning { border-color: var(--ops-warning-border); background: var(--ops-warning-bg); }
.ai-ops-summary-card--success { border-color: var(--ops-success-border); background: var(--ops-success-bg); }
.ai-ops-summary-card--info { border-color: var(--ops-info-border); background: var(--ops-info-bg); }

.ai-ops-section {
    padding: 14px;
}

.ai-ops-section-head {
    align-items: flex-start;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 12px;
}

.ai-ops-section-head-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.ai-ops-section-head h3 {
    font-size: 17px;
    font-weight: 850;
    margin-top: 2px;
}

.ai-ops-collapse-button {
    align-items: center;
    background: var(--ops-bg-subtle);
    border: 1px solid var(--ops-border-strong);
    border-radius: 999px;
    color: var(--ops-text);
    cursor: pointer;
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    gap: 6px;
    min-height: 32px;
    padding: 6px 10px;
}

.ai-ops-collapse-button:hover {
    border-color: var(--ops-info-border);
    color: var(--admin-info, #7DD3FC);
}

.ai-ops-risk-list,
.ai-ops-risk-extra,
.ai-ops-sublist,
.ai-ops-repeat-list,
.ai-ops-recommendations,
.ai-ops-workload-grid {
    display: grid;
    gap: 8px;
}

.ai-ops-risk-compact-note {
    background: var(--ops-bg-subtle);
    border: 1px dashed var(--ops-border-strong);
    border-radius: 8px;
    color: var(--ops-text-soft);
    font-size: 12px;
    padding: 10px 12px;
    text-align: center;
}

.ai-ops-risk-extra[hidden],
.ai-ops-risk-compact-note[hidden] {
    display: none;
}

.ai-ops-risk-row {
    align-items: flex-start;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 12px;
}

.ai-ops-risk-row--high { border-color: var(--ops-danger-border); }
.ai-ops-risk-row--medium { border-color: var(--ops-warning-border); }

.ai-ops-risk-title {
    align-items: flex-start;
    display: flex;
    gap: 10px;
    justify-content: space-between;
}

.ai-ops-risk-title strong,
.ai-ops-repeat-list strong,
.ai-ops-recommendations span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.ai-ops-risk-meta {
    display: flex;
    flex-wrap: wrap;
    font-size: 12px;
    gap: 10px;
    margin: 6px 0;
}

.ai-ops-risk-main p {
    font-size: 13px;
    margin-top: 7px;
}

.ai-ops-badge {
    align-items: center;
    border: 1px solid var(--ops-border-strong);
    border-radius: 999px;
    color: var(--ops-text);
    display: inline-flex;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
    padding: 4px 8px;
    white-space: normal;
}

.ai-ops-badge--danger { background: var(--ops-danger-bg); border-color: var(--ops-danger-border); color: #FDA4AF; }
.ai-ops-badge--warning { background: var(--ops-warning-bg); border-color: var(--ops-warning-border); color: var(--admin-warning, #FCD34D); }
.ai-ops-badge--success { background: var(--ops-success-bg); border-color: var(--ops-success-border); color: var(--admin-success, #6EE7B7); }
.ai-ops-badge--info,
.ai-ops-badge--email { background: var(--ops-info-bg); border-color: var(--ops-info-border); color: var(--admin-info, #7DD3FC); }

.ai-ops-grid-2,
.ai-ops-two-column {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ai-ops-mini-card {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 12px;
}

.ai-ops-mini-card.is-warning {
    border-color: var(--ops-warning-border);
}

.ai-ops-mini-metrics {
    display: grid;
    gap: 2px 8px;
    grid-template-columns: repeat(3, auto);
    text-align: right;
}

.ai-ops-mini-metrics b {
    color: var(--ops-text);
    font-variant-numeric: tabular-nums;
}

.ai-ops-mini-metrics small {
    color: var(--ops-text-muted);
    font-size: 10px;
    text-transform: uppercase;
}

.ai-ops-sublist div,
.ai-ops-repeat-list article,
.ai-ops-recommendations article {
    align-items: center;
    display: flex;
    gap: 10px;
    min-width: 0;
    padding: 10px;
}

.ai-ops-recommendations b {
    align-items: center;
    background: var(--ops-info-bg);
    border: 1px solid var(--ops-info-border);
    border-radius: 999px;
    color: var(--ops-text);
    display: inline-flex;
    flex: 0 0 28px;
    height: 28px;
    justify-content: center;
}

.ai-ops-two-column > div {
    padding: 12px;
}

.ai-ops-two-column h4 {
    font-size: 13px;
    font-weight: 850;
    margin-bottom: 8px;
}

.ai-ops-empty {
    padding: 18px;
    text-align: center;
}

.ai-ops-notes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 12px;
}

.ai-ops-notes span {
    font-size: 12px;
}

html[data-theme="light"] .ai-ops-brain {
    --ops-bg-card: #FFFFFF;
    --ops-bg-subtle: #F8FAFC;
    --ops-text: #0F172A;
    --ops-text-soft: #475569;
    --ops-text-muted: #64748B;
    --ops-border: #DCE4EF;
    --ops-border-strong: #CBD5E1;
    --ops-brand: #4F46E5;
    --ops-brand-hover: #4338CA;
    --ops-success-bg: #D1FAE5;
    --ops-success-border: #A7F3D0;
    --ops-warning-bg: #FEF3C7;
    --ops-warning-border: #FDE68A;
    --ops-danger-bg: #FFE4E6;
    --ops-danger-border: #FECDD3;
    --ops-info-bg: #ECFEFF;
    --ops-info-border: #A5F3FC;
}

html[data-theme="light"] .ai-ops-button {
    color: #FFFFFF;
}

html[data-theme="light"] .ai-ops-button--secondary {
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .ai-ops-collapse-button:hover {
    color: #4338CA;
}

html[data-theme="light"] .ai-ops-badge--danger { color: #881337; }
html[data-theme="light"] .ai-ops-badge--warning { color: var(--admin-warning, #92400E); }
html[data-theme="light"] .ai-ops-badge--success { color: #065F46; }
html[data-theme="light"] .ai-ops-badge--info,
html[data-theme="light"] .ai-ops-badge--email { color: var(--admin-accent, #155E75); }

@media (max-width: 900px) {
    .ai-ops-hero,
    .ai-ops-risk-title,
    .ai-ops-section-head,
    .ai-ops-section-head-actions,
    .ai-ops-mini-card {
        flex-direction: column;
    }

    .ai-ops-section-head-actions {
        align-items: stretch;
        width: 100%;
    }

    .ai-ops-toolbar,
    .ai-ops-grid-2,
    .ai-ops-two-column {
        grid-template-columns: 1fr;
    }

    .ai-ops-risk-row {
        grid-template-columns: 1fr;
    }

    .ai-ops-risk-action,
    .ai-ops-button {
        width: 100%;
    }
}

@media (max-width: 1180px) {
    .billing-metrics,
    .billing-plan-grid,
    .billing-usage-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .billing-filter-bar {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .billing-filter-search,
    .billing-filter-reset {
        grid-column: auto;
    }

    .billing-controls,
    .billing-manual-form,
    .billing-plan-editor__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .billing-controls .billing-button,
    .billing-manual-form .billing-button,
    .billing-manual-form__wide {
        grid-column: 1 / -1;
    }

    .billing-two-column,
    .billing-org-card__summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .billing-overview-invoice {
        align-items: flex-start;
        grid-template-columns: minmax(0, 1fr);
    }

    .billing-overview-invoice .billing-action-cluster {
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    .billing-hero,
    .billing-org-card__header,
    .billing-plan-card__top {
        flex-direction: column;
    }

    .billing-org-card__period {
        text-align: left;
    }

    .billing-metrics,
    .billing-plan-grid,
    .billing-usage-grid,
    .billing-two-column,
    .billing-org-card__summary,
    .billing-controls,
    .billing-manual-form {
        grid-template-columns: 1fr;
    }

    .billing-note span {
        white-space: normal;
    }

    .billing-tabs {
        margin: 0 -4px;
        padding: 6px;
    }

    .billing-tab {
        flex: 0 0 auto;
        padding: 8px 10px;
    }

    .billing-toolbar,
    .billing-pagination {
        align-items: stretch;
        flex-direction: column;
    }

    .billing-toolbar label,
    .billing-toolbar input,
    .billing-toolbar select,
    .billing-toolbar__actions,
    .billing-pagination > div {
        width: 100%;
    }

    .billing-filter-bar {
        grid-template-columns: 1fr;
    }

    .billing-filter-reset,
    .billing-filter-bar label {
        width: 100%;
    }

    .billing-section__header,
    .billing-section__actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .billing-toolbar__actions .billing-button,
    .billing-pagination .billing-button {
        flex: 1 1 120px;
    }

    .billing-org-card__actions {
        align-items: flex-start;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .billing-history-row summary {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .billing-history-changes li {
        grid-template-columns: 1fr;
    }

    .billing-invoice-row {
        align-items: flex-start;
        grid-template-columns: 1fr;
    }

    .billing-action-cluster {
        justify-content: flex-start;
    }

    .billing-button {
        width: 100%;
    }

    .billing-plan-tags {
        align-items: flex-start;
        justify-content: flex-start;
        max-width: none;
    }

    .billing-plan-editor-backdrop {
        padding: 8px;
    }

    .billing-plan-editor {
        max-height: calc(100vh - 16px);
        max-height: calc(100dvh - 16px);
        width: calc(100vw - 16px);
    }

    .billing-plan-editor__grid,
    .billing-plan-editor__switches,
    .billing-feature-toggle {
        grid-template-columns: 1fr;
    }

    .billing-plan-features__header,
    .billing-plan-editor__actions {
        align-items: stretch;
        flex-direction: column;
    }
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
    font-size: 14px;
}

/* Smooth transitions */
* {
    transition: background-color 0.2s, border-color 0.2s, color 0.2s;
}

/* Sidebar toggle for mobile */
#sidebar.show {
    transform: translateX(0) !important;
}

/* Nav link active state */
.nav-link.active {
    background-color: rgba(59, 130, 246, 0.1);
    color: var(--admin-info, #3B82F6);
    border-left: 3px solid #3B82F6;
}

.nav-link:hover {
    background-color: rgba(75, 85, 99, 0.5);
}

/* Admin density baseline */
#admin-container header > div {
    padding: 12px 20px !important;
}

#admin-container header h1 {
    font-size: 18px !important;
    line-height: 1.25;
}

#sidebar nav {
    padding: 12px !important;
}

.nav-link,
#sidebar a[href="../index.html"] {
    border-radius: 8px !important;
    font-size: 14px;
    gap: 10px !important;
    padding: 10px 12px !important;
}

.nav-link svg,
#sidebar a[href="../index.html"] svg {
    height: 18px !important;
    width: 18px !important;
}

main.flex-1 {
    padding: 20px !important;
}

.section-content > .mb-6 {
    margin-bottom: 16px !important;
}

.section-content h2.text-3xl {
    font-size: 24px !important;
    line-height: 1.2 !important;
    margin-bottom: 6px !important;
}

.section-content h2.text-3xl + p {
    font-size: 14px;
}

.section-content .gap-6 {
    gap: 16px !important;
}

.section-content .mb-6 {
    margin-bottom: 16px !important;
}

.section-content .mt-6 {
    margin-top: 16px !important;
}

.section-content .p-6 {
    padding: 16px !important;
}

.section-content .text-3xl {
    font-size: 24px !important;
    line-height: 1.15 !important;
}

.section-content .text-xl {
    font-size: 18px !important;
    line-height: 1.3 !important;
}

.section-content .text-lg {
    font-size: 16px !important;
    line-height: 1.35 !important;
}

.section-content .w-8.h-8 {
    height: 24px !important;
    width: 24px !important;
}

.section-content .p-3:has(> svg) {
    padding: 9px !important;
}

/* Section content */
.section-content {
    animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Scrollbar styling */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--admin-surface-raised, #1F2937);
}

::-webkit-scrollbar-thumb {
    background: #4B5563;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #6B7280;
}

/* Loading animation */
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.animate-spin {
    animation: spin 1s linear infinite;
}

/* Card hover effect */
.card-hover {
    transition: transform 0.2s, box-shadow 0.2s;
}

.card-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);
}

/* Button styles */
button {
    cursor: pointer;
    font-weight: 500;
}

button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.settings-tabs {
    display: inline-flex;
    gap: 4px;
    background: rgba(15, 23, 42, 0.52);
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 10px;
    padding: 4px;
}

.settings-tabs.hidden {
    display: none !important;
}

.settings-workspace-tabs {
    display: flex;
    width: fit-content;
}

#section-settings.settings-area-team-config #settings-feature-overrides,
#section-settings.settings-area-team-config #settings-chat-ai-limits {
    display: none !important;
}

#section-settings.settings-area-overrides .settings-team-config-content {
    display: none !important;
}

.settings-context-intro {
    border-bottom: 1px solid rgba(148, 163, 184, 0.16);
    flex: 1 0 100%;
    margin-bottom: 2px;
    padding-bottom: 12px;
}

.settings-context-intro p {
    color: #A78BFA;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    margin: 0 0 4px;
    text-transform: uppercase;
}

.settings-context-intro h3 {
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 800;
    margin: 0 0 2px;
}

.settings-context-intro span {
    color: var(--admin-text-muted, #94A3B8);
    display: block;
    font-size: 12px;
}

.settings-tab-button {
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--admin-text-muted, #CBD5E1);
    font-size: 13px;
    font-weight: 700;
    padding: 8px 14px;
    transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}

.settings-tab-button:hover,
.settings-tab-active {
    background: rgba(99, 102, 241, 0.18);
    border-color: rgba(129, 140, 248, 0.36);
    color: #FFFFFF;
}

.settings-load-button {
    align-items: center;
    display: inline-flex;
    gap: 8px;
    justify-content: center;
    min-width: 118px;
}

.settings-load-button.is-loading {
    pointer-events: none;
}

.settings-load-spinner {
    animation: spin 0.8s linear infinite;
    border: 2px solid rgba(255, 255, 255, 0.45);
    border-top-color: #FFFFFF;
    border-radius: 999px;
    display: inline-block;
    height: 14px;
    width: 14px;
}

.settings-load-spinner.hidden {
    display: none !important;
}

@media (max-width: 768px) {
    .settings-workspace-tabs,
    .settings-tabs {
        display: flex;
        overflow-x: auto;
        width: 100%;
    }

    .settings-tab-button {
        flex: 0 0 auto;
        white-space: nowrap;
    }
}

/* Email Inbox settings card */
.email-inbox-card {
    background: var(--admin-surface, #111827);
    border: 1px solid rgba(139, 92, 246, 0.35);
    border-radius: 10px;
    padding: 18px;
}

.email-inbox-card .text-white,
.email-inbox-card h3,
.email-inbox-card h4 {
    color: var(--admin-text, #F8FAFC);
}

.email-inbox-card .text-gray-300,
.email-inbox-card label {
    color: var(--admin-text-muted, #CBD5E1);
}

.email-inbox-card .text-gray-400,
.email-inbox-card .text-gray-500 {
    color: var(--admin-text-muted, #94A3B8);
}

.email-inbox-stack {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.email-inbox-section,
.email-inbox-subsection {
    background: rgba(15, 23, 42, 0.48);
    border: 1px solid rgba(148, 163, 184, 0.20);
    border-radius: 10px;
    padding: 14px;
}

.email-inbox-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.email-inbox-kicker {
    color: #A78BFA;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.email-inbox-section-title {
    color: var(--admin-text, #F8FAFC);
    font-size: 14px;
    font-weight: 750;
    line-height: 1.25;
}

.email-inbox-muted,
.email-inbox-help {
    color: var(--admin-text-muted, #94A3B8);
    font-size: 11px;
    line-height: 1.45;
}

.email-inbox-card input:not([type="checkbox"]),
.email-inbox-card select {
    background: rgba(30, 41, 59, 0.78) !important;
    border: 1px solid rgba(148, 163, 184, 0.28) !important;
    border-radius: 8px !important;
    color: var(--admin-text, #F8FAFC) !important;
    font-size: 13px !important;
    min-height: 38px;
    padding: 8px 10px !important;
}

.email-inbox-card input::placeholder {
    color: var(--admin-text-muted, #94A3B8) !important;
}

.email-inbox-card input:focus,
.email-inbox-card select:focus {
    border-color: var(--admin-info, #8B5CF6) !important;
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.22);
    outline: none !important;
}

.email-inbox-card button {
    min-height: 34px;
}

.email-inbox-card button[class*="bg-violet"],
.email-inbox-card button[class*="bg-sky"] {
    background: rgba(14, 165, 233, 0.16) !important;
    border-color: rgba(14, 165, 233, 0.45) !important;
    color: var(--admin-info, #BAE6FD) !important;
}

.email-inbox-card button[class*="bg-gray"] {
    background: rgba(51, 65, 85, 0.72) !important;
    border-color: rgba(148, 163, 184, 0.35) !important;
    color: var(--admin-text, #E2E8F0) !important;
}

.email-inbox-actions {
    order: 18;
    background: rgba(15, 23, 42, 0.28);
    border: 1px dashed rgba(148, 163, 184, 0.22);
    border-radius: 10px;
    padding: 12px;
}

/* Primary "Save Email Settings" — always reads as THE button of the card,
   regardless of surrounding surface styles. */
.email-inbox-save-primary {
    background: linear-gradient(135deg, #7c3aed, #6d28d9);
    border: 1px solid rgba(167, 139, 250, 0.55);
    box-shadow: 0 6px 18px rgba(124, 58, 237, 0.35);
}
.email-inbox-save-primary:hover {
    background: linear-gradient(135deg, #8b5cf6, #7c3aed);
    box-shadow: 0 8px 22px rgba(124, 58, 237, 0.45);
}

/* Unsaved changes: the owning save button flips amber and glows until saved. */
.email-inbox-card .email-inbox-action-dirty,
.email-inbox-save-primary.email-inbox-action-dirty {
    background: linear-gradient(135deg, #d97706, #b45309) !important;
    border-color: rgba(251, 191, 36, 0.85) !important;
    color: #fffbeb !important;
    box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.25), 0 0 18px rgba(251, 191, 36, 0.45);
    animation: email-inbox-dirty-pulse 1.6s ease-in-out infinite;
}
.email-inbox-save-primary.email-inbox-action-dirty::after {
    content: " — unsaved changes";
    font-weight: 600;
    opacity: 0.9;
}
@keyframes email-inbox-dirty-pulse {
    0%, 100% { box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.25), 0 0 18px rgba(251, 191, 36, 0.45); }
    50% { box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.12), 0 0 8px rgba(251, 191, 36, 0.25); }
}

.email-inbox-plan-lock {
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.12), rgba(14, 165, 233, 0.08));
    border-color: rgba(167, 139, 250, 0.34);
}

.email-inbox-lock-badge {
    background: rgba(124, 58, 237, 0.18);
    border: 1px solid rgba(167, 139, 250, 0.34);
    border-radius: 999px;
    color: #DDD6FE;
    font-size: 10px;
    font-weight: 800;
    padding: 4px 8px;
    text-transform: uppercase;
}

.email-inbox-summary-grid {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.email-inbox-summary-grid > div {
    background: rgba(15, 23, 42, 0.52);
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 8px;
    min-width: 0;
    padding: 9px 10px;
}

.email-inbox-summary-grid span {
    color: var(--admin-text-muted, #94A3B8);
    display: block;
    font-size: 10px;
    font-weight: 800;
    margin-bottom: 3px;
    text-transform: uppercase;
}

.email-inbox-summary-grid strong {
    color: var(--admin-text, #F8FAFC);
    display: block;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#email-inbox-banner { order: -10; }
#email-inbox-poll-status { order: 30; }

.email-inbox-alert,
.email-inbox-connected-card {
    border-radius: 10px;
    border: 1px solid;
    padding: 10px 12px;
}

.email-inbox-alert-title,
.email-inbox-connected-title {
    font-size: 13px;
    font-weight: 750;
}

.email-inbox-alert-body,
.email-inbox-connected-body {
    font-size: 12px;
    margin-top: 3px;
}

.email-inbox-alert-success,
.email-inbox-connected-card {
    background: rgba(16, 185, 129, 0.10);
    border-color: rgba(16, 185, 129, 0.38);
    color: #A7F3D0;
}

.email-inbox-alert-error {
    background: rgba(239, 68, 68, 0.12);
    border-color: rgba(239, 68, 68, 0.42);
    color: var(--admin-danger, #FECACA);
}

.email-inbox-alert-warn {
    background: rgba(245, 158, 11, 0.12);
    border-color: rgba(245, 158, 11, 0.42);
    color: var(--admin-warning, #FDE68A);
}

.email-inbox-alert-info {
    background: rgba(14, 165, 233, 0.12);
    border-color: rgba(14, 165, 233, 0.42);
    color: var(--admin-info, #BAE6FD);
}

.email-inbox-technical-details {
    background: rgba(2, 6, 23, 0.36);
    border-radius: 8px;
    color: inherit;
    font-size: 11px;
    margin-top: 6px;
    padding: 8px;
    white-space: pre-wrap;
    word-break: break-word;
}

.email-inbox-stat-grid {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.email-inbox-stat {
    background: rgba(30, 41, 59, 0.74);
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 8px;
    padding: 8px;
}

.email-inbox-stat-label {
    color: var(--admin-text-muted, #94A3B8);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0;
    text-transform: uppercase;
}

.email-inbox-stat-value {
    color: var(--admin-text, #F8FAFC);
    font-size: 16px;
    font-weight: 800;
}

.email-inbox-log-line {
    color: var(--admin-text-muted, #94A3B8);
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 11px;
    margin-top: 8px;
}

.email-inbox-log-warn {
    color: #FBBF24;
}

.email-inbox-log-error {
    color: var(--admin-danger, #FCA5A5);
    font-size: 11px;
    margin-top: 8px;
}

@media (max-width: 760px) {
    .email-inbox-stat-grid,
    .email-inbox-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

html[data-theme="light"] .email-inbox-card {
    background: #FFFFFF;
    border-color: var(--admin-info, #C4B5FD);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

html[data-theme="light"] .email-inbox-card .text-white,
html[data-theme="light"] .email-inbox-card h3,
html[data-theme="light"] .email-inbox-card h4,
html[data-theme="light"] .email-inbox-section-title {
    color: var(--admin-text, #0F172A) !important;
}

html[data-theme="light"] .email-inbox-card .text-gray-300,
html[data-theme="light"] .email-inbox-card label {
    color: #334155 !important;
}

html[data-theme="light"] .email-inbox-card .text-gray-400,
html[data-theme="light"] .email-inbox-card .text-gray-500,
html[data-theme="light"] .email-inbox-muted,
html[data-theme="light"] .email-inbox-help {
    color: var(--admin-text-muted, #475569) !important;
}

html[data-theme="light"] .email-inbox-section,
html[data-theme="light"] .email-inbox-subsection,
html[data-theme="light"] .email-inbox-actions {
    background: #F8FAFC;
    border-color: var(--admin-text-muted, #CBD5E1);
}

html[data-theme="light"] .email-inbox-plan-lock {
    background: linear-gradient(135deg, #F5F3FF, #ECFEFF);
    border-color: var(--admin-info, #C4B5FD);
}

html[data-theme="light"] .email-inbox-lock-badge {
    background: #EDE9FE;
    border-color: var(--admin-info, #C4B5FD);
    color: #5B21B6;
}

html[data-theme="light"] .email-inbox-summary-grid > div {
    background: #FFFFFF;
    border-color: var(--admin-text-muted, #CBD5E1);
}

html[data-theme="light"] .email-inbox-summary-grid span {
    color: var(--admin-text-subtle, #64748B);
}

html[data-theme="light"] .email-inbox-summary-grid strong {
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .email-inbox-kicker {
    color: #6D28D9;
}

html[data-theme="light"] .email-inbox-card input:not([type="checkbox"]),
html[data-theme="light"] .email-inbox-card select {
    background: #FFFFFF !important;
    border-color: var(--admin-text-muted, #CBD5E1) !important;
    color: var(--admin-text, #0F172A) !important;
}

html[data-theme="light"] .email-inbox-card input::placeholder {
    color: var(--admin-text-subtle, #64748B) !important;
}

html[data-theme="light"] .email-inbox-card button[class*="bg-violet"],
html[data-theme="light"] .email-inbox-card button[class*="bg-sky"] {
    background: #E0F2FE !important;
    border-color: #38BDF8 !important;
    color: #075985 !important;
}

html[data-theme="light"] .email-inbox-card button[class*="bg-gray"] {
    background: #EEF2F6 !important;
    border-color: var(--admin-text-muted, #CBD5E1) !important;
    color: var(--admin-text, #0F172A) !important;
}

html[data-theme="light"] .email-inbox-alert-success,
html[data-theme="light"] .email-inbox-connected-card {
    background: #ECFDF5;
    border-color: var(--admin-success, #6EE7B7);
    color: #065F46;
}

html[data-theme="light"] .email-inbox-alert-error {
    background: #FEF2F2;
    border-color: var(--admin-danger, #FCA5A5);
    color: #991B1B;
}

html[data-theme="light"] .email-inbox-alert-warn {
    background: #FFFBEB;
    border-color: var(--admin-warning, #FCD34D);
    color: var(--admin-warning, #92400E);
}

html[data-theme="light"] .email-inbox-alert-info {
    background: #EFF6FF;
    border-color: var(--admin-info, #93C5FD);
    color: #1E3A8A;
}

html[data-theme="light"] .email-inbox-stat {
    background: #FFFFFF;
    border-color: var(--admin-text-muted, #CBD5E1);
}

html[data-theme="light"] .email-inbox-stat-label,
html[data-theme="light"] .email-inbox-log-line {
    color: var(--admin-text-muted, #475569);
}

html[data-theme="light"] .email-inbox-stat-value {
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .email-inbox-log-warn {
    color: #B45309;
}

html[data-theme="light"] .email-inbox-log-error {
    color: var(--admin-danger, #B91C1C);
}

html[data-theme="light"] .settings-tabs {
    background: #F8FAFC;
    border-color: var(--admin-text-muted, #CBD5E1);
}

html[data-theme="light"] .settings-tab-button {
    color: var(--admin-text-muted, #475569);
}

html[data-theme="light"] .settings-tab-button:hover,
html[data-theme="light"] .settings-tab-active {
    background: #EEF2FF;
    border-color: #A5B4FC;
    color: #3730A3;
}

html[data-theme="light"] .settings-context-intro {
    border-bottom-color: var(--admin-text, #E2E8F0);
}

html[data-theme="light"] .settings-context-intro h3 {
    color: var(--admin-text, #0F172A);
}

html[data-theme="light"] .settings-context-intro span {
    color: var(--admin-text-subtle, #64748B);
}

html[data-theme="light"] #ticket-config-editor > .bg-gray-800,
html[data-theme="light"] #section-settings > .bg-gray-800 {
    background: #FFFFFF !important;
    border-color: var(--admin-text-muted, #CBD5E1) !important;
    color: var(--admin-text, #0F172A) !important;
}

html[data-theme="light"] #ticket-config-editor h3,
html[data-theme="light"] #section-settings h2 {
    color: var(--admin-text, #0F172A) !important;
}

html[data-theme="light"] #ticket-config-editor .text-gray-300,
html[data-theme="light"] #ticket-config-editor .text-white,
html[data-theme="light"] #section-settings label {
    color: #334155 !important;
}

html[data-theme="light"] #ticket-config-editor .text-gray-400,
html[data-theme="light"] #section-settings .text-gray-400 {
    color: var(--admin-text-subtle, #64748B) !important;
}

html[data-theme="light"] #ticket-config-editor input[type="text"],
html[data-theme="light"] #section-settings select {
    background: #FFFFFF !important;
    border-color: var(--admin-text-muted, #CBD5E1) !important;
    color: var(--admin-text, #0F172A) !important;
}

html[data-theme="light"] #cfg-fields-list > div,
html[data-theme="light"] #cfg-sources-list > div,
html[data-theme="light"] #cfg-tags-list > div {
    background: #F8FAFC !important;
    border: 1px solid var(--admin-border, #E2E8F0);
}

/* Table styles */
table {
    width: 100%;
    border-collapse: collapse;
}

th {
    text-align: left;
    font-weight: 600;
    font-size: 13px;
    padding: 9px 10px;
    background-color: var(--admin-text-muted, #374151);
    border-bottom: 2px solid #4B5563;
}

td {
    font-size: 13px;
    padding: 9px 10px;
    border-bottom: 1px solid var(--admin-border, #374151);
}

tr:hover {
    background-color: var(--admin-text-muted, #374151);
}

/* Badge styles */
.badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 9999px;
}

.badge-success {
    background-color: rgba(16, 185, 129, 0.1);
    color: #10B981;
}

.badge-danger {
    background-color: rgba(239, 68, 68, 0.1);
    color: #EF4444;
}

.badge-warning {
    background-color: rgba(245, 158, 11, 0.1);
    color: #F59E0B;
}

.badge-info {
    background-color: rgba(59, 130, 246, 0.1);
    color: var(--admin-info, #3B82F6);
}

/* Modal backdrop */
.modal-backdrop {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 50;
    animation: fadeIn 0.2s ease-in-out;
}

.modal-content {
    background-color: #1F2937;
    border-radius: 8px;
    max-width: 600px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    animation: slideUp 0.3s ease-in-out;
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Form styles */
input[type="text"],
input[type="email"],
input[type="password"],
textarea,
select {
    width: 100%;
    padding: 8px 10px;
    background-color: var(--admin-text-muted, #374151);
    border: 1px solid var(--admin-border, #4B5563);
    border-radius: 6px;
    color: var(--admin-text, #F9FAFB);
    font-size: 13px;
    min-height: 38px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
    outline: none;
    border-color: var(--admin-info, #3B82F6);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 5px;
    color: var(--admin-text-muted, #D1D5DB);
}

/* Empty state */
.empty-state {
    text-align: center;
    padding: 60px 20px;
    color: var(--admin-text-muted, #9CA3AF);
}

.empty-state svg {
    width: 80px;
    height: 80px;
    margin: 0 auto 20px;
    opacity: 0.3;
}

/* Admin user management */
.admin-users-page {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.admin-users-hero,
.admin-users-panel {
    background: var(--admin-surface, #111827);
    border: 1px solid var(--admin-border, #253244);
    border-radius: 8px;
}

.admin-users-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px;
}

.admin-users-kicker {
    color: #60A5FA;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0;
    margin-bottom: 6px;
    text-transform: uppercase;
}

.admin-users-hero h2 {
    color: var(--admin-text, #F9FAFB);
    font-size: 24px;
    font-weight: 750;
    line-height: 1.15;
    margin: 0 0 6px;
}

.admin-users-hero p:last-child {
    color: var(--admin-text-muted, #9CA3AF);
    font-size: 14px;
    margin: 0;
}

.admin-users-primary-action,
.admin-users-secondary-action,
.admin-users-side-action,
.admin-users-row-action {
    align-items: center;
    border-radius: 6px;
    display: inline-flex;
    justify-content: center;
    white-space: nowrap;
}

.admin-users-primary-action {
    background: #2563EB;
    color: #FFFFFF;
    gap: 8px;
    min-height: 38px;
    padding: 0 13px;
}

.admin-users-primary-action:hover {
    background: #1D4ED8;
}

.admin-users-stat-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.admin-users-stat {
    background: var(--admin-bg, #0F172A);
    border: 1px solid var(--admin-border, #253244);
    border-radius: 8px;
    padding: 13px;
}

.admin-users-stat span {
    color: var(--admin-text-muted, #9CA3AF);
    display: block;
    font-size: 12px;
    margin-bottom: 6px;
}

.admin-users-stat strong {
    color: var(--admin-text, #F9FAFB);
    display: block;
    font-size: 22px;
    line-height: 1;
}

.admin-users-layout {
    align-items: start;
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(0, 1fr) 320px;
}

.admin-users-layout.single {
    grid-template-columns: minmax(0, 1fr);
}

.admin-users-panel {
    overflow: hidden;
}

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

.admin-users-panel-header {
    align-items: flex-start;
    border-bottom: 1px solid var(--admin-border, #253244);
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 15px 16px;
}

.admin-users-panel-header.compact {
    display: block;
}

.admin-users-panel-header h3 {
    color: var(--admin-text, #F9FAFB);
    font-size: 17px;
    font-weight: 700;
    margin: 0 0 4px;
}

.admin-users-panel-header p,
.admin-users-count-line {
    color: var(--admin-text-muted, #9CA3AF);
    font-size: 13px;
    margin: 0;
}

.admin-users-count-line span {
    color: #FFFFFF;
    font-weight: 700;
}

.admin-users-toolbar {
    align-items: end;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(220px, 1.4fr) repeat(3, minmax(160px, 1fr)) auto;
    padding: 14px 16px;
}

.admin-users-toolbar label {
    margin: 0;
}

.admin-users-toolbar label span {
    color: var(--admin-text-muted, #9CA3AF);
    display: block;
    font-size: 12px;
    margin-bottom: 6px;
}

.admin-users-toolbar input,
.admin-users-toolbar select,
.admin-users-action-block input,
.admin-users-action-block select {
    background: #172033;
    border: 1px solid var(--admin-border, #334155);
    border-radius: 6px;
    color: var(--admin-text, #F9FAFB);
    min-height: 38px;
    width: 100%;
}

.admin-users-secondary-action {
    background: transparent;
    border: 1px solid var(--admin-border, #334155);
    color: var(--admin-text-muted, #D1D5DB);
    min-height: 38px;
    padding: 0 12px;
}

.admin-users-secondary-action:hover {
    background: var(--admin-surface-raised, #1F2937);
    color: #FFFFFF;
}

.admin-users-table-wrap {
    overflow-x: auto;
}

.admin-users-table {
    min-width: 820px;
}

.admin-users-table th {
    background: var(--admin-bg, #0F172A);
    border-bottom: 1px solid var(--admin-border, #253244);
    color: var(--admin-text-muted, #9CA3AF);
    font-size: 12px;
    padding: 10px 14px;
    text-transform: uppercase;
}

.admin-users-table td {
    border-bottom: 1px solid var(--admin-border, #253244);
    color: var(--admin-text-muted, #D1D5DB);
    padding: 11px 14px;
    vertical-align: middle;
}

.admin-users-table tr:hover {
    background: #172033;
}

.admin-users-person {
    align-items: center;
    display: flex;
    gap: 12px;
}

.admin-users-avatar {
    align-items: center;
    border-radius: 999px;
    color: #FFFFFF;
    display: flex;
    flex: 0 0 36px;
    font-size: 13px;
    font-weight: 800;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.admin-users-person p {
    color: #FFFFFF;
    font-weight: 700;
    margin: 0 0 2px;
}

.admin-users-person span,
.admin-users-person small {
    color: var(--admin-text-muted, #9CA3AF);
    display: block;
    font-size: 12px;
    line-height: 1.35;
}

.admin-users-role,
.admin-users-team,
.admin-users-status {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    padding: 6px 9px;
}

.admin-users-role.danger {
    background: rgba(239, 68, 68, 0.12);
    color: var(--admin-danger, #FCA5A5);
}

.admin-users-role.info {
    background: rgba(37, 99, 235, 0.16);
    color: var(--admin-info, #93C5FD);
}

.admin-users-role.warning {
    background: rgba(245, 158, 11, 0.14);
    color: var(--admin-warning, #FCD34D);
}

.admin-users-role.neutral,
.admin-users-team {
    background: rgba(148, 163, 184, 0.12);
    color: var(--admin-text-muted, #CBD5E1);
}

.admin-users-status {
    gap: 7px;
}

.admin-users-status span {
    border-radius: 999px;
    display: inline-block;
    height: 7px;
    width: 7px;
}

.admin-users-status.active {
    background: rgba(16, 185, 129, 0.12);
    color: var(--admin-success, #6EE7B7);
}

.admin-users-status.active span {
    background: #10B981;
}

.admin-users-status.blocked {
    background: rgba(245, 158, 11, 0.12);
    color: var(--admin-warning, #FCD34D);
}

.admin-users-status.blocked span {
    background: #F59E0B;
}

.admin-users-status.deleted {
    background: rgba(100, 116, 139, 0.18);
    color: var(--admin-text-muted, #94A3B8);
}

.admin-users-status.deleted span {
    background: #64748B;
}

/* W-5: live user activity (online / idle / offline) — mirrors the
   .admin-users-status dot-badge pattern above. */
.admin-users-activity {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    gap: 7px;
    line-height: 1;
    padding: 6px 9px;
    white-space: nowrap;
}

.admin-users-activity-dot {
    border-radius: 999px;
    display: inline-block;
    flex: none;
    height: 7px;
    width: 7px;
}

.admin-users-activity.online {
    background: rgba(16, 185, 129, 0.12);
    color: var(--admin-success, #6EE7B7);
}

.admin-users-activity.online .admin-users-activity-dot {
    background: #10B981;
}

.admin-users-activity.idle {
    background: rgba(245, 158, 11, 0.12);
    color: var(--admin-warning, #FCD34D);
}

.admin-users-activity.idle .admin-users-activity-dot {
    background: #F59E0B;
}

.admin-users-activity.offline {
    background: rgba(100, 116, 139, 0.14);
    color: var(--admin-text-muted, #94A3B8);
}

.admin-users-activity.offline .admin-users-activity-dot {
    background: #64748B;
}

.admin-users-actions {
    display: grid;
    grid-template-columns: 56px 84px 102px 86px 76px;
    gap: 6px;
    justify-content: flex-end;
}

.admin-users-row-action {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    display: inline-flex;
    gap: 6px;
    justify-content: flex-start;
    min-height: 32px;
    padding: 0 9px;
}

.admin-users-row-action.info {
    color: var(--admin-info, #93C5FD);
}

.admin-users-row-action.success {
    color: var(--admin-success, #6EE7B7);
}

.admin-users-row-action.warning {
    color: var(--admin-warning, #FCD34D);
}

.admin-users-row-action.purple {
    color: var(--admin-info, #C4B5FD);
}

.admin-users-row-action.neutral {
    color: var(--admin-text-muted, #CBD5E1);
}

.admin-users-row-action.danger {
    color: var(--admin-danger, #FCA5A5);
}

.admin-users-row-action:hover {
    background: var(--admin-surface-raised, #1F2937);
    border-color: var(--admin-border, #334155);
}

.admin-users-side-panel {
    padding-bottom: 16px;
}

.admin-users-action-block {
    border-bottom: 1px solid var(--admin-border, #253244);
    display: grid;
    gap: 10px;
    padding: 15px 16px;
}

.admin-users-action-block h4 {
    color: var(--admin-text, #F9FAFB);
    font-size: 15px;
    font-weight: 700;
    margin: 0;
}

.admin-users-action-block p {
    color: var(--admin-text-muted, #9CA3AF);
    font-size: 13px;
    margin: 0;
}

.admin-users-side-action {
    border: 0;
    color: #FFFFFF;
    min-height: 38px;
    padding: 0 12px;
    width: 100%;
}

.admin-users-side-action.purple {
    background: #7C3AED;
}

.admin-users-side-action.purple:hover {
    background: #6D28D9;
}

.admin-users-side-action.teal {
    background: #0F766E;
}

.admin-users-side-action.teal:hover {
    background: #0D9488;
}

.admin-users-safety-note {
    background: rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.25);
    border-radius: 8px;
    margin: 14px 16px 0;
    padding: 12px;
}

.admin-users-safety-note strong {
    color: var(--admin-warning, #FCD34D);
    display: block;
    font-size: 13px;
    margin-bottom: 5px;
}

.admin-users-safety-note p {
    color: var(--admin-text-muted, #D1D5DB);
    font-size: 12px;
    margin: 0;
}

.admin-users-empty {
    color: var(--admin-text-muted, #9CA3AF);
    padding: 40px 16px;
    text-align: center;
}

.admin-users-empty svg {
    color: var(--admin-text-muted, #4B5563);
}

.admin-users-empty p {
    color: var(--admin-text, #F9FAFB);
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 6px;
}

.admin-users-empty span {
    color: var(--admin-text-muted, #9CA3AF);
    font-size: 13px;
}

.admin-users-primary-action:focus-visible,
.admin-users-secondary-action:focus-visible,
.admin-users-side-action:focus-visible,
.admin-users-row-action:focus-visible,
.admin-users-modal-close:focus-visible,
.admin-users-modal-primary:focus-visible,
.admin-users-modal-secondary:focus-visible,
.admin-users-modal-danger:focus-visible,
.admin-users-toolbar input:focus-visible,
.admin-users-toolbar select:focus-visible,
.admin-users-action-block input:focus-visible,
.admin-users-action-block select:focus-visible,
.admin-users-field input:focus-visible,
.admin-users-field select:focus-visible,
.admin-users-field textarea:focus-visible {
    outline: 2px solid #60A5FA;
    outline-offset: 2px;
}

.admin-users-modal {
    background: var(--admin-surface, #111827);
    border: 1px solid var(--admin-border, #253244);
    border-radius: 8px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.45);
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    max-width: 560px;
    overflow-y: auto;
    width: min(560px, calc(100vw - 32px));
}

.admin-users-modal.danger {
    border-color: rgba(239, 68, 68, 0.45);
}

.admin-users-modal-header {
    align-items: flex-start;
    border-bottom: 1px solid var(--admin-border, #253244);
    display: flex;
    gap: 16px;
    justify-content: space-between;
    padding: 16px;
}

.admin-users-modal-header p {
    color: #60A5FA;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0 0 6px;
    text-transform: uppercase;
}

.admin-users-modal.danger .admin-users-modal-header p,
.admin-users-modal.danger .admin-users-modal-header h3 {
    color: var(--admin-danger, #FCA5A5);
}

.admin-users-modal-header h3 {
    color: var(--admin-text, #F9FAFB);
    font-size: 18px;
    font-weight: 750;
    line-height: 1.2;
    margin: 0 0 6px;
}

.admin-users-modal-header span {
    color: var(--admin-text-muted, #9CA3AF);
    display: block;
    font-size: 13px;
    line-height: 1.45;
}

.admin-users-modal-close {
    align-items: center;
    background: transparent;
    border: 1px solid var(--admin-border, #334155);
    border-radius: 6px;
    color: var(--admin-text-muted, #9CA3AF);
    display: inline-flex;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.admin-users-modal-close:hover {
    background: var(--admin-surface-raised, #1F2937);
    color: #FFFFFF;
}

.admin-users-modal-form {
    display: grid;
    gap: 14px;
    padding: 16px;
}

.admin-users-field label {
    color: var(--admin-text-muted, #D1D5DB);
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin: 0 0 7px;
}

.admin-users-field label span,
.admin-users-field label strong {
    color: var(--admin-danger, #FCA5A5);
}

.admin-users-field input,
.admin-users-field select,
.admin-users-field textarea {
    background: #172033;
    border: 1px solid var(--admin-border, #334155);
    border-radius: 6px;
    color: var(--admin-text, #F9FAFB);
    min-height: 38px;
    width: 100%;
}

.admin-users-field textarea {
    min-height: 108px;
    resize: vertical;
}

.admin-users-field input:disabled,
.admin-users-field select:disabled {
    background: #101827;
    color: #6B7280;
    cursor: not-allowed;
}

.admin-users-field p {
    color: var(--admin-text-muted, #9CA3AF);
    font-size: 12px;
    margin: 7px 0 0;
}

.admin-users-check {
    align-items: flex-start;
    background: var(--admin-bg, #0F172A);
    border: 1px solid var(--admin-border, #253244);
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    gap: 10px;
    margin: 0;
    padding: 10px;
}

.admin-users-check input {
    accent-color: #2563EB;
    margin-top: 2px;
}

.admin-users-check strong {
    color: var(--admin-text, #F9FAFB);
    display: block;
    font-size: 13px;
    margin-bottom: 3px;
}

.admin-users-check small {
    color: var(--admin-text-muted, #9CA3AF);
    display: block;
    font-size: 12px;
    line-height: 1.35;
}

.admin-users-modal-note,
.admin-users-danger-note {
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.45;
    padding: 10px;
}

.admin-users-modal-note {
    background: rgba(37, 99, 235, 0.10);
    border: 1px solid rgba(37, 99, 235, 0.25);
    color: #BFDBFE;
}

.admin-users-danger-note {
    background: rgba(239, 68, 68, 0.10);
    border: 1px solid rgba(239, 68, 68, 0.28);
    color: var(--admin-danger, #FECACA);
}

.admin-users-danger-note strong {
    color: #FFFFFF;
    display: block;
    font-size: 15px;
    margin-bottom: 5px;
}

.admin-users-danger-note p {
    margin: 0;
}

.admin-users-danger-note.strong {
    background: rgba(239, 68, 68, 0.14);
    border-color: rgba(239, 68, 68, 0.45);
}

.admin-users-history-heading {
    margin: 14px 2px 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--admin-text-muted, #94A3B8);
}
.admin-users-history-heading:first-of-type {
    margin-top: 4px;
}

.admin-users-history-list {
    display: grid;
    gap: 10px;
    max-height: 280px;
    overflow-y: auto;
    padding: 4px 2px;
}

.admin-users-history-item {
    background: var(--admin-bg, #0F172A);
    border: 1px solid var(--admin-border, #253244);
    border-radius: 8px;
    display: grid;
    gap: 8px;
    padding: 12px;
}

.admin-users-history-item div {
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

.admin-users-history-item strong {
    color: var(--admin-text, #F9FAFB);
    font-size: 13px;
}

.admin-users-history-item span,
.admin-users-history-item p,
.admin-users-history-empty {
    color: var(--admin-text-muted, #9CA3AF);
    font-size: 12px;
    margin: 0;
}

.admin-users-history-item p {
    background: var(--admin-surface, #111827);
    border-radius: 6px;
    overflow: hidden;
    padding: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-users-history-empty.error {
    color: var(--admin-danger, #FCA5A5);
}

.admin-users-color-row {
    align-items: center;
    display: flex;
    gap: 12px;
}

.admin-users-color-row input[type="color"] {
    border: 1px solid var(--admin-border, #334155);
    cursor: pointer;
    flex: 0 0 56px;
    height: 38px;
    min-height: 38px;
    padding: 4px;
    width: 56px;
}

.admin-users-color-row p {
    margin: 0;
}

.admin-users-color-row span {
    color: var(--admin-text, #F9FAFB);
    font-weight: 800;
}

.admin-users-password-options {
    display: grid;
    gap: 10px;
}

.admin-users-password-option {
    background: var(--admin-bg, #0F172A);
    border: 1px solid var(--admin-border, #253244);
    border-radius: 8px;
    display: block;
    padding: 12px;
    text-align: left;
    width: 100%;
}

.admin-users-password-option:hover {
    background: #172033;
    border-color: var(--admin-info, #3B82F6);
}

.admin-users-password-option:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.admin-users-password-option:disabled:hover {
    background: var(--admin-bg, #0F172A);
    border-color: var(--admin-border, #253244);
}

.admin-users-password-option strong {
    color: var(--admin-text, #F9FAFB);
    display: block;
    font-size: 14px;
    margin-bottom: 4px;
}

.admin-users-password-option span {
    color: var(--admin-text-muted, #9CA3AF);
    display: block;
    font-size: 12px;
    line-height: 1.45;
}

.admin-users-modal-actions {
    display: grid;
    gap: 10px;
    grid-template-columns: 1fr 1fr;
    padding-top: 4px;
}

.admin-users-modal-primary,
.admin-users-modal-secondary,
.admin-users-modal-danger {
    border: 0;
    border-radius: 6px;
    min-height: 38px;
    padding: 0 14px;
}

.admin-users-modal-primary {
    background: #2563EB;
    color: #FFFFFF;
}

.admin-users-modal-primary:hover {
    background: #1D4ED8;
}

.admin-users-modal-secondary {
    background: var(--admin-surface-raised, #1F2937);
    color: var(--admin-text-muted, #D1D5DB);
}

.admin-users-modal-secondary:hover {
    background: #374151;
    color: #FFFFFF;
}

.admin-users-modal-danger {
    background: #DC2626;
    color: #FFFFFF;
}

.admin-users-modal-danger:hover:not(:disabled) {
    background: #B91C1C;
}

.admin-users-modal-danger:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.admin-users-password-option:focus-visible {
    outline: 2px solid #60A5FA;
    outline-offset: 2px;
}

/* Responsive */
@media (max-width: 1024px) {
    #sidebar {
        transform: translateX(-100%);
    }

    #sidebar.show {
        transform: translateX(0);
    }

    .admin-users-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-users-layout {
        grid-template-columns: 1fr;
    }

    .admin-users-toolbar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .admin-users-hero,
    .admin-users-panel-header {
        display: block;
    }

    .admin-users-primary-action {
        margin-top: 16px;
        width: 100%;
    }

    .admin-users-stat-grid,
    .admin-users-toolbar {
        grid-template-columns: 1fr;
    }

    .admin-users-table {
        min-width: 0;
    }

    .admin-users-table thead {
        display: none;
    }

    .admin-users-table,
    .admin-users-table tbody,
    .admin-users-table tr,
    .admin-users-table td {
        display: block;
        width: 100%;
    }

    .admin-users-table tr {
        border-bottom: 1px solid var(--admin-border, #253244);
        padding: 12px 0;
    }

    .admin-users-table td {
        align-items: flex-start;
        border: 0;
        display: flex;
        justify-content: space-between;
        gap: 14px;
        padding: 9px 18px;
    }

    .admin-users-table td::before {
        color: var(--admin-text-muted, #9CA3AF);
        content: attr(data-label);
        flex: 0 0 88px;
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
    }

    .admin-users-person,
    .admin-users-actions {
        justify-content: flex-end;
    }

    .admin-users-actions {
        display: flex;
        flex-wrap: wrap;
    }

    .admin-users-row-action span {
        display: none;
    }

    .admin-users-modal-actions {
        grid-template-columns: 1fr;
    }
}

/* Toast notification animation */
@keyframes slide-in {
    from {
        opacity: 0;
        transform: translateX(100%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.animate-slide-in {
    animation: slide-in 0.3s ease-out;
    transition: opacity 0.3s, transform 0.3s;
}

/* ============================================================
   Phase 6.11 Slice 1 — Needs-attention queue
   First widget on the admin dashboard. Calm by default, amber
   when items are present, calm-green when empty.
   ============================================================ */
.needs-attention-card {
    background: rgba(31, 41, 55, 0.6);
    border: 1px solid rgba(75, 85, 99, 0.5);
    border-radius: 0.75rem;
    padding: 1.25rem 1.5rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
.needs-attention-card.has-items {
    border-color: rgba(245, 158, 11, 0.5);
    background: rgba(245, 158, 11, 0.06);
}
.needs-attention-card.is-clear {
    border-color: rgba(16, 185, 129, 0.4);
    background: rgba(16, 185, 129, 0.06);
}
.needs-attention-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}
.needs-attention-header h3 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.05rem;
    font-weight: 600;
    color: #f9fafb;
}
.needs-attention-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 999px;
    background: rgba(245, 158, 11, 0.18);
    color: #fbbf24;
    font-weight: 700;
    font-size: 0.85rem;
}
.needs-attention-card.is-clear .needs-attention-icon {
    background: rgba(16, 185, 129, 0.2);
    color: #34d399;
}
.needs-attention-count-badge {
    background: rgba(245, 158, 11, 0.18);
    color: #fbbf24;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.15rem 0.6rem;
    border-radius: 999px;
}
/* W-1: gear icon lives next to the count badge, super-admin only */
.needs-attention-header-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.needs-attention-configure-btn {
    color: #9ca3af;
}
.needs-attention-configure-btn:hover {
    color: #f3f4f6;
}
.needs-attention-body {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.needs-attention-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0.85rem;
    background: rgba(17, 24, 39, 0.65);
    border: 1px solid rgba(75, 85, 99, 0.4);
    border-radius: 0.5rem;
    color: #e5e7eb;
}
.needs-attention-row-main {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-width: 0;
    flex: 1 1 auto;
}
.needs-attention-row-emoji {
    flex: 0 0 auto;
    font-size: 1.1rem;
    line-height: 1;
}
.needs-attention-row-text {
    min-width: 0;
    flex: 1 1 auto;
}
.needs-attention-row-summary {
    font-size: 0.92rem;
    color: #f3f4f6;
    line-height: 1.3;
}
.needs-attention-row-age {
    font-size: 0.75rem;
    color: #9ca3af;
    margin-top: 0.15rem;
}
.needs-attention-row-action {
    flex: 0 0 auto;
    background: transparent;
    border: 1px solid rgba(99, 102, 241, 0.55);
    color: #c7d2fe;
    font-size: 0.8rem;
    font-weight: 500;
    padding: 0.35rem 0.75rem;
    border-radius: 0.4rem;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    white-space: nowrap;
}
.needs-attention-row-action:hover {
    background: rgba(99, 102, 241, 0.15);
    color: #ffffff;
    border-color: rgba(129, 140, 248, 0.8);
}
.needs-attention-empty {
    font-size: 0.92rem;
    color: #6ee7b7;
}
.needs-attention-toggle {
    align-self: flex-start;
    background: transparent;
    border: none;
    color: #c7d2fe;
    font-size: 0.82rem;
    font-weight: 500;
    padding: 0.25rem 0;
    cursor: pointer;
    transition: color 0.15s;
}
.needs-attention-toggle:hover {
    color: #ffffff;
    text-decoration: underline;
}
.needs-attention-error {
    font-size: 0.85rem;
    color: #fca5a5;
}
/* W-1 rules modal (#needs-attention-rules-list rows) */
.needs-attention-rule-row {
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--admin-border, rgba(75, 85, 99, 0.4));
}
.needs-attention-rule-row:last-child {
    border-bottom: 0;
}
.needs-attention-rule-toggle {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}
.needs-attention-rule-toggle strong {
    color: var(--admin-text, #f3f4f6);
    font-size: 0.9rem;
}
.needs-attention-rule-description {
    margin: 0.25rem 0 0 1.75rem;
    color: var(--admin-text-muted, #9ca3af);
    font-size: 0.78rem;
    line-height: 1.35;
}
.needs-attention-rule-threshold {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0.5rem 0 0 1.75rem;
}
.needs-attention-rule-threshold span {
    color: var(--admin-text-muted, #9ca3af);
    font-size: 0.78rem;
}
.needs-attention-rule-threshold input[type="number"] {
    width: 5.5rem;
    background: var(--admin-surface-raised, rgba(15, 23, 42, 0.4));
    border: 1px solid var(--admin-border, rgba(75, 85, 99, 0.4));
    border-radius: 0.4rem;
    color: var(--admin-text, #f3f4f6);
    padding: 0.3rem 0.5rem;
    font-size: 0.85rem;
}
.needs-attention-rule-threshold input[type="number"]:disabled {
    opacity: 0.5;
}
.needs-attention-skeleton {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.needs-attention-skeleton-row {
    height: 2.5rem;
    background: linear-gradient(90deg, rgba(75, 85, 99, 0.25) 0%, rgba(75, 85, 99, 0.45) 50%, rgba(75, 85, 99, 0.25) 100%);
    background-size: 200% 100%;
    border-radius: 0.5rem;
    animation: needs-attention-shimmer 1.2s ease-in-out infinite;
}
@keyframes needs-attention-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
@media (max-width: 640px) {
    .needs-attention-card {
        padding: 1rem;
    }
    .needs-attention-row {
        flex-direction: column;
        align-items: stretch;
        gap: 0.55rem;
    }
    .needs-attention-row-action {
        align-self: flex-end;
    }
}

/* Print styles */
@media print {
    #sidebar,
    header,
    button {
        display: none !important;
    }

    main {
        margin: 0 !important;
        padding: 0 !important;
    }
}

/* ── Phase 6.11 Slice 2 — Stat card trend deltas ───────────────────── */

.stat-delta {
    margin-top: 4px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.01em;
    line-height: 1.3;
}

.stat-delta--up {
    color: var(--admin-success, #4ade80);
}

.stat-delta--down {
    color: var(--admin-danger, #f87171);
}

.stat-delta--flat {
    color: var(--admin-text-muted, #6b7280);
}

/* ── Phase 6.11 Slice 3 — Comparison table ──────────────────────────── */

.cmp-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 6px;
    border: 1px solid rgba(75, 85, 99, 0.4);
}

.cmp-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    white-space: nowrap;
}

.cmp-th {
    padding: 7px 10px;
    text-align: center;
    color: #9ca3af;
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid rgba(75, 85, 99, 0.4);
    background: rgba(31, 41, 55, 0.6);
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.cmp-th:first-child,
.cmp-cell--name {
    text-align: left;
}

.cmp-th:hover {
    color: #e5e7eb;
}

.cmp-th--active {
    color: #a78bfa; /* purple-400 */
}

.cmp-row {
    cursor: pointer;
    transition: background 0.12s;
}

.cmp-row:hover {
    background: rgba(55, 65, 81, 0.5);
}

.cmp-row + .cmp-row {
    border-top: 1px solid rgba(55, 65, 81, 0.3);
}

.cmp-cell {
    padding: 7px 10px;
    color: #d1d5db;
    vertical-align: middle;
}

.cmp-cell--name {
    color: #f3f4f6;
    font-weight: 500;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cmp-cell--num {
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.cmp-cell--warn {
    color: #fbbf24; /* amber-400 */
    font-weight: 600;
}

.cmp-cell--muted {
    color: #93c5fd; /* blue-300 */
}

.cmp-cell--modules {
    color: #9ca3af;
    font-size: 11px;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cmp-cell--usage {
    min-width: 90px;
    text-align: center;
}

.cmp-limit {
    color: #6b7280;
    font-size: 10px;
}

.cmp-bar-track {
    height: 4px;
    background: rgba(55, 65, 81, 0.8);
    border-radius: 2px;
    overflow: hidden;
    margin-bottom: 2px;
}

.cmp-bar-fill {
    height: 4px;
    border-radius: 2px;
    transition: width 0.3s ease;
}

.cmp-bar--ok     { background: #8b5cf6; } /* purple-500 */
.cmp-bar--warn   { background: #f59e0b; } /* amber-500 */
.cmp-bar--danger { background: #ef4444; } /* red-500   */

.cmp-pct {
    font-size: 10px;
    color: #6b7280;
}

.cmp-empty {
    text-align: center;
    color: #6b7280;
    font-size: 13px;
    padding: 24px 0;
}

@media (max-width: 640px) {
    .cmp-table { font-size: 11px; }
    .cmp-th    { padding: 6px 8px; }
    .cmp-cell  { padding: 6px 8px; }
    .cmp-cell--modules { display: none; }
}

/* ── Phase 6.11 Slice 4 — Quick actions row ─────────────────────────── */

.quick-actions-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.quick-action-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 10px 14px;
    min-width: 72px;
    background: rgba(31, 41, 55, 0.7);
    border: 1px solid rgba(75, 85, 99, 0.5);
    border-radius: 8px;
    color: #d1d5db;
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
    flex: 1 1 auto;
    max-width: 120px;
}

.quick-action-btn:hover {
    background: rgba(55, 65, 81, 0.9);
    border-color: rgba(139, 92, 246, 0.5);
    color: #f3f4f6;
}

.quick-action-btn:active {
    background: rgba(109, 40, 217, 0.2);
}

.quick-action-icon {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #a78bfa; /* purple-400 */
}

.quick-action-icon svg {
    width: 18px;
    height: 18px;
}

.quick-action-label {
    line-height: 1;
    white-space: nowrap;
}

@media (max-width: 640px) {
    .quick-action-btn {
        padding: 8px 10px;
        min-width: 60px;
        font-size: 10px;
    }

    .quick-action-icon svg {
        width: 16px;
        height: 16px;
    }
}

/* ── Phase 6.11 Slice 5 — Admin mobile pass (360 / 414 px) ──────────
   Contract: no horizontal scroll, tap targets ≥ 44px, 8px gap between
   hit areas, all dashboard widgets stack cleanly.
   ──────────────────────────────────────────────────────────────────── */


@media (max-width: 640px) {

    /* ── Header ─────────────────────────────────────────────────── */
    #admin-container header > div {
        padding: 10px 12px !important;
    }

    #admin-container header h1 {
        font-size: 15px !important;
    }

    /* Hide welcome text on very small screens to save header space */
    #admin-container header .text-sm.text-gray-400 {
        display: none !important;
    }

    /* Logout + theme toggle: compact */
    #logout-btn {
        padding: 6px 10px !important;
        font-size: 12px !important;
        min-height: 44px;
    }

    #ds-theme-toggle {
        font-size: 12px !important;
        padding: 6px 8px !important;
        min-height: 44px;
        min-width: 44px;
    }

    /* ── Main content padding ────────────────────────────────────── */
    #admin-container main.flex-1 {
        padding: 12px !important;
    }

    /* ── Dashboard section headings ─────────────────────────────── */
    #dashboard-title {
        font-size: 22px !important;
    }

    /* ── Quick-stats grid: single column on phones ───────────────── */
    #admin-container .grid.grid-cols-1.md\\:grid-cols-2.lg\\:grid-cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    /* Stat cards: tighter padding */
    #stat-orgs-card,
    #admin-container .grid.grid-cols-1.md\\:grid-cols-2.lg\\:grid-cols-4 > div {
        padding: 14px !important;
    }

    /* Stat number: slightly smaller so it fits in half-width card */
    #stat-orgs,
    #stat-teams,
    #stat-users,
    #stat-tickets {
        font-size: 1.75rem !important;
    }

    /* ── Org info panel ──────────────────────────────────────────── */
    #dashboard-org-info .bg-gray-800 {
        padding: 14px !important;
    }

    #dashboard-org-info .grid.grid-cols-2 {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    /* ── Comparison table: thinner columns, modules hidden ────────── */
    .cmp-cell--name { max-width: 110px !important; }

    /* ── Quick actions: 3-per-row on 360px ──────────────────────── */
    .quick-actions-row {
        gap: 6px !important;
    }

    .quick-action-btn {
        flex: 1 1 calc(33% - 4px) !important;
        max-width: none !important;
    }

    /* ── Dashboard cards: tighter padding on phone ──────────────── */
    #section-dashboard .bg-gray-800.rounded-lg {
        padding: 14px !important;
    }

    /* ── Modal sizing: prevent overflow on small screens ─────────── */
    #create-org-modal > div,
    #edit-org-modal > div,
    #create-user-modal > div,
    #create-team-modal > div,
    #edit-team-modal > div,
    #view-members-modal > div {
        max-height: 90dvh !important;
        overflow-y: auto !important;
        margin: 8px auto !important;
        width: calc(100vw - 16px) !important;
        max-width: none !important;
    }

    /* ── Nav links in sidebar: ensure 44px tap height ────────────── */
    #sidebar .nav-link,
    #sidebar a {
        min-height: 44px !important;
        display: flex !important;
        align-items: center !important;
        padding: 10px 12px !important;
    }

    /* ── Admin user table (section): responsive labels already wired  */
    .admin-users-table td {
        padding: 8px 12px !important;
    }

    /* ── Section titles ──────────────────────────────────────────── */
    .section-content h2 {
        font-size: 20px !important;
    }

    /* ── Needs-attention queue: full-width rows ──────────────────── */
    .needs-attention-card {
        padding: 12px !important;
    }

}