.smart-andon-module-host {
    --text-main: var(--text-primary);
    --text-soft: var(--text-secondary);
    --accent-red: var(--brand-accent);
    --accent-cyan: var(--brand-accent-strong);
    --ok: var(--state-online);
    --warn: var(--state-warning);
    --danger: var(--state-critical);
    --chedraui-blue: #58585a;
    --chedraui-blue-soft: color-mix(in srgb, #58585a, transparent 86%);
    --scrollbar-thumb: var(--chedraui-blue);
    --scrollbar-track: transparent;
    --scrollbar-glow: color-mix(in srgb, var(--chedraui-blue), transparent 48%);
    width: 100%;
    min-width: 0;
    color: var(--text-primary);
    font-family: var(--font-family);
    font-size: 16px;
    line-height: 1.35;
}

.smart-andon-module-host,
.smart-andon-module-host * {
    scrollbar-color: var(--chedraui-blue) var(--scrollbar-track);
}

.smart-andon-module-host *::-webkit-scrollbar-thumb {
    background: var(--chedraui-blue);
    box-shadow: 0 0 10px var(--scrollbar-glow);
}

.smart-andon-module-host :is(input, select, textarea):focus,
.smart-andon-module-host :is(input, select, textarea):focus-visible {
    outline: 0;
    border-color: var(--chedraui-blue) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--chedraui-blue), transparent 72%) !important;
}

.smart-andon-module-host .pager-button.active {
    color: #fff;
    border-color: var(--chedraui-blue);
    background: var(--chedraui-blue);
    box-shadow: 0 5px 14px color-mix(in srgb, var(--chedraui-blue), transparent 65%);
}

.smart-andon-module-host .pager-button:hover:not(:disabled):not(.active) {
    color: var(--chedraui-blue);
    border-color: color-mix(in srgb, var(--chedraui-blue), transparent 38%);
    background: var(--chedraui-blue-soft);
}

html[data-theme="dark"] .smart-andon-module-host {
    --bg-0: #171718;
    --bg-1: #1d1d1f;
    --bg-2: #252527;
    --surface: #242426;
    --surface-soft: #2d2d2f;
    --line: #48484a;
    --line-strong: #5f5f62;
    --migrated-control-bg: #2d2d2f;
    --migrated-control-hover: #38383a;
    --migrated-control-disabled: #202022;
    --migrated-chart-bg: #1d1d1f;
    --migrated-chart-grid: #3f3f42;
}

html[data-theme="light"] .smart-andon-module-host {
    --bg-0: #f3f2f1;
    --bg-1: #f8f7f6;
    --bg-2: #e9e7e5;
    --surface: #ffffff;
    --surface-soft: #f2f1f0;
    --line: #d0cdca;
    --line-strong: #aaa6a2;
    --migrated-control-bg: #ffffff;
    --migrated-control-hover: #f2f1f0;
    --migrated-control-disabled: #e8e6e4;
    --migrated-chart-bg: #faf9f8;
    --migrated-chart-grid: #dedbd8;
}

.smart-andon-module-host .dashboard-page,
.smart-andon-module-host .profile-page,
.smart-andon-module-host .admin-shell,
.smart-andon-module-host .andon-page,
.smart-andon-module-host .operations-page {
    width: 100%;
    min-width: 0;
    color: var(--text-primary);
}

.smart-andon-module-host *,
.smart-andon-module-host *::before,
.smart-andon-module-host *::after {
    box-sizing: border-box;
}

.smart-andon-module-host :is(h1, h2, h3, h4, h5, h6, button, input, select, textarea, table) {
    font-family: var(--font-family);
}

.smart-andon-module-host :is(
    .board-shell,
    .kpi-card,
    .widget,
    .widget-card,
    .andon-panel,
    .summary-cards > div,
    .chain-card,
    .monitor-card,
    .machine-card,
    .profile-shell,
    .profile-card,
    .admin-card,
    .admin-users-card,
    .admin-profile-shell,
    .company-grid-card,
    .company-card,
    .ops-card,
    .cost-rate-strip > div,
    .andon-modal,
    .modal-content
) {
    background: var(--glass-surface);
    border-color: var(--glass-border);
    box-shadow: var(--shadow-md);
    color: var(--text-primary);
}

.smart-andon-module-host .kpi-card::before {
    border-color: color-mix(in srgb, var(--brand-accent-strong), transparent 76%);
}

.smart-andon-module-host .kpi-card::after {
    background: radial-gradient(circle, color-mix(in srgb, var(--brand-accent-strong), transparent 82%), transparent 62%);
}

.smart-andon-module-host input,
.smart-andon-module-host select,
.smart-andon-module-host textarea {
    color: var(--text-primary);
    background-color: var(--migrated-control-bg);
    border-color: var(--control-border);
    font-family: inherit;
    color-scheme: inherit;
}

.smart-andon-module-host select {
    min-height: 42px;
    padding: 0.55rem 2.15rem 0.55rem 0.75rem;
    border: 1px solid var(--control-border);
    border-radius: 8px;
    color: var(--text-primary);
    background-color: var(--migrated-control-bg);
    cursor: pointer;
}

.smart-andon-module-host select:disabled {
    cursor: not-allowed;
}

.smart-andon-module-host input[type="checkbox"] {
    accent-color: var(--brand-accent);
}

.smart-andon-module-host select option,
.smart-andon-module-host select optgroup {
    color: var(--text-primary);
    background-color: var(--migrated-control-bg);
}

.smart-andon-module-host :is(input, select, textarea)::placeholder {
    color: var(--text-tertiary);
    opacity: 1;
}

.smart-andon-module-host :is(input, select, textarea):hover:not(:disabled):not([readonly]) {
    background-color: var(--migrated-control-hover);
}

.smart-andon-module-host :is(input, select, textarea):focus {
    color: var(--text-primary);
    background-color: var(--migrated-control-bg);
    border-color: var(--brand-accent-strong);
    outline: none;
    box-shadow: 0 0 0 2px var(--focus-ring);
}

.smart-andon-module-host :is(input, select, textarea):disabled,
.smart-andon-module-host :is(input, textarea)[readonly],
.smart-andon-module-host select option:disabled {
    color: var(--text-tertiary);
    background-color: var(--migrated-control-disabled);
    opacity: 1;
    cursor: not-allowed;
}

.smart-andon-module-host button,
.smart-andon-module-host input,
.smart-andon-module-host select,
.smart-andon-module-host textarea {
    font: inherit;
}

.smart-andon-module-host img {
    max-width: 100%;
}

.smart-andon-module-host .profile-page,
.smart-andon-module-host .admin-page,
.smart-andon-module-host .companies-page,
.smart-andon-module-host .users-page,
.smart-andon-module-host .roles-page {
    font-size: 1rem;
}

/* Alchemist already owns the Administration navigation. The migrated inner
   menu is retained in the legacy component but hidden only inside this host. */
.smart-andon-module-host .admin-module-shell {
    grid-template-columns: minmax(0, 1fr);
}

.smart-andon-module-host .admin-module-nav {
    display: none;
}

.smart-andon-module-host .board-shell {
    border-color: var(--glass-border);
}

.smart-andon-module-host .widget,
.smart-andon-module-host .andon-panel {
    background: var(--glass-surface);
    border-color: var(--glass-border);
}

.smart-andon-module-host .form-control,
.smart-andon-module-host .form-select {
    min-height: 40px;
    color: var(--text-main);
    background-color: var(--migrated-control-bg);
    border-color: var(--line);
}

.smart-andon-module-host .form-control:focus,
.smart-andon-module-host .form-select:focus {
    color: var(--text-main);
    background-color: var(--migrated-control-bg);
    border-color: var(--accent-cyan);
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--accent-cyan), transparent 78%);
}

.smart-andon-module-host .table {
    --bs-table-color: var(--text-main);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--line);
    --bs-table-hover-color: var(--text-main);
    --bs-table-hover-bg: color-mix(in srgb, var(--accent-cyan), transparent 92%);
    color: var(--text-main);
}

.smart-andon-module-host .modal-content,
.smart-andon-module-host .dropdown-menu {
    color: var(--text-main);
    background: var(--surface);
    border-color: var(--line);
}

.smart-andon-module-host .text-muted {
    color: var(--text-soft) !important;
}

.smart-andon-module-host :is(.board-footer p, .trend-values, .month-labels, .legend span) {
    color: var(--text-secondary);
}

.smart-andon-module-host .board-footer { border-color: var(--glass-border); }

.smart-andon-module-host .trend-line {
    color: var(--text-primary);
    border-color: var(--glass-border);
    background: repeating-linear-gradient(180deg,
        var(--migrated-chart-bg) 0,
        var(--migrated-chart-bg) 29px,
        var(--migrated-chart-grid) 29px,
        var(--migrated-chart-grid) 30px);
}

.smart-andon-module-host :is(.heatmap-tooltip, .tooltip, [role="tooltip"]) {
    color: var(--text-primary);
    background: var(--surface);
    border-color: var(--glass-border);
}

.smart-andon-module-host :is(.dropdown-menu, .menu-action, .pager-button, .icon-button) {
    color: var(--text-primary);
    background-color: var(--migrated-control-bg);
    border-color: var(--control-border);
}

.smart-andon-module-host :is(.dropdown-menu, .menu-action) :is(a, button):hover {
    color: var(--text-primary);
    background-color: var(--migrated-control-hover);
}

.smart-andon-module-host :is(.status-table, .bitacora-compact-table, .cost-table) {
    color: var(--text-primary);
    background: transparent;
}

.smart-andon-module-host :is(.status-table, .bitacora-compact-table, .cost-table) th {
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--surface-soft), transparent 18%);
    border-color: var(--glass-border);
}

.smart-andon-module-host :is(.status-table, .bitacora-compact-table, .cost-table) td {
    color: var(--text-primary);
    background: transparent;
    border-color: var(--glass-border);
}

.smart-andon-module-host :is(.status-table, .bitacora-compact-table, .cost-table) tbody tr:hover {
    background: color-mix(in srgb, var(--brand-accent), transparent 92%);
}

.smart-andon-module-host :is(.ghost-button, .filter-button, .pager-button, .icon-action, .bitacora-view-button, .edit-icon-button) {
    color: var(--text-primary);
    background: var(--surface-soft);
    border-color: var(--control-border);
}

.smart-andon-module-host :is(.action, .admin-users-primary, .profile-primary, .ops-button.primary, .btn-primary) {
    color: var(--on-accent);
    background: var(--brand-accent);
    background-image: none;
    border: 1px solid color-mix(in srgb, var(--brand-accent), var(--text-primary) 18%);
    box-shadow: 0 8px 18px color-mix(in srgb, var(--brand-accent), transparent 76%);
}

.smart-andon-module-host :is(.action, .admin-users-primary, .profile-primary, .ops-button.primary, .btn-primary):hover:not(:disabled) {
    color: var(--on-accent);
    background: color-mix(in srgb, var(--brand-accent), var(--text-primary) 12%);
    background-image: none;
    border-color: var(--brand-accent);
}

.smart-andon-module-host :is(.admin-users-secondary, .ops-button, .admin-profile-back, .modal-danger-action) {
    color: var(--text-primary);
    background: var(--surface-soft);
    border: 1px solid var(--control-border);
    box-shadow: none;
}

.smart-andon-module-host :is(.admin-users-secondary, .ops-button, .admin-profile-back, .modal-danger-action):hover:not(:disabled) {
    color: var(--brand-accent);
    background: var(--surface);
    border-color: var(--brand-accent);
}

.smart-andon-module-host :is(.danger-button, .company-remove-logo, .admin-profile-delete-photo) {
    color: var(--state-critical);
    background: color-mix(in srgb, var(--state-critical), transparent 90%);
    border-color: color-mix(in srgb, var(--state-critical), transparent 55%);
}

.smart-andon-module-host :is(.dashboard-scope-bar, .andon-filters, .cost-filters, .profile-nav, .company-tabs) {
    color: var(--text-primary);
    background: color-mix(in srgb, var(--surface), transparent 10%);
    border-color: var(--glass-border);
}

.smart-andon-module-host :is(.admin-users-count, .count-chip, .mini-group) {
    color: var(--text-secondary);
    background: var(--surface-soft);
    border-color: var(--control-border);
}

html[data-theme="light"] .smart-andon-module-host :is(
    .board-shell,
    .kpi-card,
    .widget,
    .widget-card,
    .andon-panel,
    .profile-shell,
    .profile-card,
    .admin-users-card,
    .admin-profile-shell,
    .company-grid-card,
    .company-card,
    .ops-card,
    .cost-rate-strip > div
) {
    box-shadow: 0 12px 28px rgba(30, 55, 78, 0.1);
}

.smart-andon-module-host :is(.ghost-button, .filter-button, .pager-button, .icon-action, .bitacora-view-button, .edit-icon-button):hover:not(:disabled) {
    color: var(--brand-accent);
    background: var(--surface);
    border-color: var(--brand-accent);
}

.smart-andon-module-host :is(.folio-link, a.folio-link) {
    color: var(--brand-accent-strong);
}

.smart-andon-module-host .cost-message-content {
    color: var(--text-primary);
    background: var(--surface-soft);
    border-color: var(--glass-border);
}

html[data-theme="light"] .smart-andon-module-host :is(input, select, textarea) {
    color-scheme: light;
}

html[data-theme="dark"] .smart-andon-module-host :is(input, select, textarea) {
    color-scheme: dark;
}

html[data-theme="light"] .smart-andon-module-host :is(.status-table, .bitacora-compact-table, .cost-table) tbody tr {
    background-color: color-mix(in srgb, var(--surface), transparent 12%);
}

html[data-theme="light"] .smart-andon-module-host :is(.status-table, .bitacora-compact-table, .cost-table) tbody tr:hover {
    background-color: color-mix(in srgb, var(--brand-accent), transparent 92%);
}

html[data-theme="light"] .smart-andon-module-host :is(.widget, .andon-panel, .profile-card, .company-card) {
    color: var(--text-primary);
}

html[data-theme="light"] .smart-andon-module-host .andon-modal.technician-report-mobile {
    color: var(--text-primary);
    background: var(--surface-soft);
    border-color: var(--glass-border);
    box-shadow: 0 24px 70px rgba(30, 43, 68, 0.28);
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile :is(
    .technician-report-header,
    .mobile-report-summary,
    .mobile-report-section,
    footer
) {
    background: var(--surface);
    border-color: var(--glass-border) !important;
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile .andon-modal-body {
    background: var(--surface-soft);
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile :is(
    .technician-report-heading h3,
    .technician-report-section-title,
    .mobile-report-section-title strong,
    .mobile-report-equipment,
    .mobile-report-compact-meta strong
) {
    color: var(--text-primary);
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile :is(
    .technician-report-heading p,
    .mobile-report-section-title small,
    .mobile-report-compact-meta span,
    .technician-report-counter,
    .technician-report-hint
) {
    color: var(--text-secondary);
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile .technician-report-textarea {
    color: var(--text-primary);
    background: var(--migrated-control-bg);
    border-color: var(--control-border);
    box-shadow: inset 0 1px 0 rgba(30, 43, 68, 0.03);
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile .technician-report-textarea::placeholder {
    color: var(--text-tertiary);
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile .report-readonly-field {
    color: #1a2634;
    background: #f7fbff;
    border-color: var(--control-border);
    box-shadow: inset 0 1px 0 rgba(30, 43, 68, 0.03);
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile :is(
    .mobile-report-equipment,
    .mobile-report-compact-meta strong,
    .mobile-report-meta-grid strong
) {
    color: #1a2634 !important;
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile :is(
    .mobile-report-compact-meta span,
    .mobile-report-meta-grid span,
    .mobile-report-toggle
) {
    color: #3f5266 !important;
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile .mobile-report-toggle {
    border-top-color: var(--glass-border);
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile .evidence-empty-state {
    color: var(--text-primary);
    background: var(--migrated-control-bg);
    border-color: var(--control-border);
}

html[data-theme="light"] .smart-andon-module-host .technician-report-mobile .evidence-empty-state small {
    color: var(--text-secondary);
}

html[data-theme="light"] .smart-andon-module-host .status-action-resolved:not(:disabled) {
    color: #087a44;
    background: #e8f7ee;
    border-color: rgba(8, 122, 68, 0.32);
}

html[data-theme="light"] .smart-andon-module-host .status-action-way:not(:disabled) {
    color: #1f63b5;
    background: #e8f1ff;
    border-color: rgba(31, 99, 181, 0.32);
}

html[data-theme="light"] .smart-andon-module-host .status-action-site:not(:disabled) {
    color: #087f8f;
    background: #e4f7f9;
    border-color: rgba(8, 127, 143, 0.32);
}

html[data-theme="light"] .smart-andon-module-host .status-action-escalate:not(:disabled) {
    color: #8b6505;
    background: #fff7df;
    border-color: rgba(170, 122, 5, 0.32);
}

html[data-theme="light"] .smart-andon-module-host .pill {
    border: 1px solid currentColor;
}

html[data-theme="light"] .smart-andon-module-host :is(.cyan-pill, .info-pill) {
    color: #087f8f;
    background: #e4f7f9;
}

html[data-theme="light"] .smart-andon-module-host .blue-pill {
    color: #1769aa;
    background: #e8f3fc;
}

html[data-theme="light"] .smart-andon-module-host .danger-pill {
    color: #b4233d;
    background: #fdecef;
}

html[data-theme="light"] .smart-andon-module-host .warn-pill {
    color: #8b6505;
    background: #fff7df;
}

html[data-theme="light"] .smart-andon-module-host .ok-pill {
    color: #087a44;
    background: #e8f7ee;
}

/* Rassini treatment for the Smart Andon resolution and escalation reports. */
html[data-theme] .smart-andon-module-host .andon-modal.technician-report-mobile {
    color: var(--text-primary);
    border-color: var(--glass-border);
    background: var(--surface);
    box-shadow: var(--shadow-lg);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile :is(
    .technician-report-header,
    footer
) {
    border-color: var(--glass-border) !important;
    background: var(--surface-soft);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile .andon-modal-body {
    background: var(--surface);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile :is(
    .mobile-report-summary,
    .mobile-report-section
) {
    border-color: var(--glass-border);
    background: var(--surface-soft);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile :is(
    .technician-report-heading h3,
    .technician-report-section-title,
    .mobile-report-section-title strong,
    .mobile-report-equipment,
    .mobile-report-compact-meta strong,
    .evidence-file-list > strong
) {
    color: var(--text-primary);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile :is(
    .technician-report-heading p,
    .mobile-report-section-title small,
    .mobile-report-compact-meta span,
    .technician-report-counter,
    .technician-report-hint
) {
    color: var(--text-secondary);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile :is(
    .technician-report-titlemark,
    .report-step
) {
    color: #fff;
    border-color: color-mix(in srgb, var(--brand-accent-strong), var(--glass-border) 35%);
    background: var(--brand-accent-strong);
    box-shadow: none;
}

html[data-theme] .smart-andon-module-host .technician-report-mobile.escalation :is(
    .technician-report-titlemark,
    .report-step
) {
    color: #fff;
    border-color: color-mix(in srgb, var(--state-critical), var(--glass-border) 35%);
    background: var(--state-critical);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile .technician-report-textarea,
html[data-theme] .smart-andon-module-host .technician-report-mobile .evidence-description-input {
    color: var(--text-primary);
    border-color: var(--control-border);
    background: var(--control-bg);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile :is(
    .technician-report-textarea,
    .evidence-description-input
)::placeholder {
    color: var(--text-tertiary);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile .evidence-empty-state {
    color: var(--text-primary);
    border-color: var(--control-border);
    background: var(--control-bg);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile .evidence-empty-state :is(i, small) {
    color: var(--text-secondary);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile .evidence-add-button {
    color: #fff;
    border-color: var(--brand-accent);
    background: var(--brand-accent);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile .evidence-add-button:hover:not(:disabled) {
    border-color: var(--brand-accent-strong);
    background: var(--brand-accent-strong);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile.resolution footer .action {
    color: #fff;
    border-color: var(--brand-accent-strong);
    background: var(--brand-accent-strong);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile.resolution footer .action:hover:not(:disabled) {
    filter: brightness(1.08);
}

html[data-theme] .smart-andon-module-host .technician-report-mobile footer .modal-danger-action {
    color: var(--state-critical);
    border-color: color-mix(in srgb, var(--state-critical), transparent 35%);
    background: transparent;
}

html[data-theme] .smart-andon-module-host .technician-report-mobile footer .modal-danger-action:hover:not(:disabled) {
    color: #fff;
    background: var(--state-critical);
}

@media (max-width: 767px) {
    .smart-andon-module-host {
        font-size: 15px;
    }
}
