/* Filament 5 native by default: component overrides require a matching data-ww-custom-* flag. */
/* WidgetWeb configurable design system: tokens → foundation → components → layout → themes.
 * Native Filament remains responsible for navigation, actions, form state and modal focus.
 * Product styles never suppress horizontal overflow on the page.
 */
:root {
 --ww-primary:var(--primary-600,#d97706); --ww-focus:#d97706; --ww-app-background:#fffacc;--ww-login-background:#fffacc;--ww-topbar-background:#ffffff;
 --ww-surface:#ffffff;--ww-surface-muted:#f8fafc;--ww-surface-raised:#ffffff;
 --ww-border:#e4e4e7;--ww-text:#18181b;--ww-text-muted:#71717a;
 --ww-success:#16a34a;--ww-warning:#d97706;--ww-danger:#dc2626;--ww-info:#2563eb;
 --ww-space:1rem;--ww-gap:.75rem;--ww-radius:.75rem;--ww-card-radius:var(--ww-radius);
 --ww-input-radius:var(--ww-radius);--ww-button-radius:var(--ww-radius);--ww-modal-radius:var(--ww-radius);--ww-bubble-radius:1.25rem;
 --ww-card-border-width:1px;--ww-card-border-color:var(--ww-border);--ww-shadow:none;
 --ww-field:var(--ww-surface);--ww-field-text:var(--ww-text);--ww-field-border:var(--ww-border);
 --ww-incoming:var(--ww-surface);--ww-incoming-text:var(--ww-text);--ww-outgoing:#f4f4f5;--ww-outgoing-text:#0f172a;
 --ww-control-height:2.75rem;--ww-font-size:.9375rem;--ww-line-height:1.55;
 --ww-reading-width:68ch;--ww-font:ui-sans-serif,system-ui,sans-serif;
 --ww-selected:color-mix(in srgb,var(--ww-primary) 12%,var(--ww-surface));
 --ww-orange:var(--ww-warning);--ww-blue:var(--ww-info);--ww-green:var(--ww-success);--ww-red:var(--ww-danger);
 --ww-on-color:#ffffff;--ww-light-surface-muted:var(--ww-surface-muted);--ww-generic-button:var(--ww-surface);--ww-generic-button-text:var(--ww-text);--ww-generic-button-border:var(--ww-border);--ww-chat-header:var(--ww-surface);--ww-chat-tools:var(--ww-surface-muted);--ww-filter-button:var(--ww-surface);--ww-filter-button-text:var(--ww-text);--ww-filter-button-border:var(--ww-border);--ww-filter-panel:var(--ww-surface);--ww-classification:var(--ww-surface);--ww-take-control:var(--ww-danger);--ww-take-control-text:#fff;--ww-return-ai:var(--ww-success);--ww-return-ai-text:#fff;--ww-send-button:var(--ww-success);--ww-send-button-text:#fff;
}
.dark {--ww-primary:var(--primary-400,#fbbf24);--ww-surface:#18181b;--ww-surface-muted:#27272a;--ww-surface-raised:#18181b;--ww-border:#3f3f46;--ww-text:#fafafa;--ww-text-muted:#a1a1aa;--ww-success:#4ade80;--ww-warning:#fbbf24;--ww-danger:#f87171;--ww-info:#60a5fa;--ww-on-color:#111827;}
html[data-ww-font="serif"] {--ww-font:Georgia,serif;} html[data-ww-font="mono"] {--ww-font:ui-monospace,monospace;}
/* Foundation: natural document scrolling, readable labels and content-based wrapping. */
html[data-ww-custom-app] body.fi-body {background:var(--ww-app-background);color:var(--ww-text);font-family:var(--ww-font);}
.fi-main,.fi-page,.fi-page-header-main-ctn,.fi-page-content,.fi-sc,.fi-sc-component {min-width:0;}
html[data-ww-custom-topbar] .fi-topbar{background:var(--ww-topbar-background);}
html[data-ww-custom-login] .fi-simple-layout{background:var(--ww-login-background);}
html[data-ww-custom-buttons] .fi-btn:not(.fi-color-primary):not(.fi-color-danger):not(.fi-color-success):not(.fi-color-info):not(.fi-color-warning){background:var(--ww-generic-button)!important;color:var(--ww-generic-button-text)!important;border-color:var(--ww-generic-button-border)!important;}
html[data-ww-custom-layout] .fi-page{gap:var(--ww-space);}
html[data-ww-custom-layout] .fi-main{padding-block:var(--ww-space);}
.fi-header {display:flex;flex-direction:row;flex-wrap:wrap;align-items:flex-start;gap:var(--ww-space);}
.fi-header > div:first-child:not(.fi-header-actions-ctn) {flex:1 1 26rem;min-width:0;}
html[data-ww-custom-semantics] .fi-header-heading{font-size:clamp(1.35rem,1.1rem + .7vw,1.875rem);line-height:1.25;overflow-wrap:anywhere;}
.fi-header-subheading {max-width:var(--ww-reading-width);line-height:var(--ww-line-height);overflow-wrap:anywhere;}
html[data-ww-custom-semantics] .fi-header-subheading{color:var(--ww-text-muted);}
.fi-header-actions-ctn {flex:0 1 auto;min-width:0;max-width:100%;padding-block-start:0;}
.fi-header-actions-ctn .fi-ac {display:flex;flex-wrap:wrap;justify-content:flex-start;gap:var(--ww-gap);}
.fi-btn,.fi-btn-label,.fi-fo-field-wrp-label {white-space:normal;overflow-wrap:anywhere;}
html[data-ww-custom-buttons] .fi-btn{min-height:var(--ww-control-height);max-width:100%;border-radius:var(--ww-button-radius);}
.fi-fo-field-wrp,.fi-fo-field-wrp-content-ctn,.fi-input-wrp {min-width:0;max-width:100%;}
html[data-ww-custom-fields] .fi-input-wrp{border-radius:var(--ww-input-radius);background:var(--ww-field)!important;color:var(--ww-field-text);}
html[data-ww-custom-fields] .fi-input, html[data-ww-custom-fields] .fi-select-input, html[data-ww-custom-fields] .fi-fo-textarea{min-width:0;color:var(--ww-field-text);}
.fi-fo-field-wrp-label,.fi-fo-field-wrp-helper-text,.fi-fo-field-wrp-error-message {overflow-wrap:anywhere;}
html[data-ww-custom-focus] :where(button,a,input,select,textarea,[tabindex]):focus-visible {box-shadow:inset 0 0 0 2px var(--ww-focus);outline:var(--ww-focus-outer-width,0px) solid var(--ww-focus);outline-offset:var(--ww-focus-outer-offset,2px);}
:where(input,select,textarea) {max-width:100%;}
:where(h1,h2,h3,h4,p,dt,dd) {overflow-wrap:break-word;}
/* One dominant container per semantic surface. Nested sections keep headings and dividers. */
html[data-ww-custom-section] .fi-section, html[data-ww-custom-tables] .fi-ta, .ww-card, .dc-panel{border:var(--ww-card-width,var(--ww-card-border-width)) solid var(--ww-card-border,var(--ww-card-border-color));border-radius:var(--ww-card-radius);background:var(--ww-card-background,var(--ww-surface));box-shadow:var(--ww-card-shadow,var(--ww-shadow));color:var(--ww-text);}
html[data-ww-custom-section] .fi-page-content, .ww-preview-panel{border:var(--ww-panel-width,0) solid var(--ww-panel-border,var(--ww-border));border-radius:var(--ww-panel-radius,0);background:var(--ww-panel-background,transparent);box-shadow:var(--ww-panel-shadow,none);}
.lc-console {border:var(--ww-card-border-width) solid var(--ww-card-border-color);border-radius:var(--ww-card-radius);background:var(--ww-surface);box-shadow:var(--ww-shadow);color:var(--ww-text);}
html[data-ww-custom-section] .fi-section-header, html[data-ww-custom-section] .fi-section-content{padding:var(--ww-space);}
html[data-ww-custom-section] .fi-section .fi-section, html[data-ww-custom-tables] .fi-section .fi-ta, .ww-card .ww-card, .ww-subsection{border:var(--ww-inner-width,0) solid var(--ww-inner-border,var(--ww-border));border-radius:var(--ww-inner-radius,0);background:var(--ww-inner-background,transparent);box-shadow:var(--ww-inner-shadow,none);}
html[data-ww-custom-section] .fi-section .fi-section+.fi-section, .ww-subsection{border-top:1px solid var(--ww-border);padding-block-start:var(--ww-space);margin-block-start:var(--ww-space);}
html[data-ww-custom-section] .fi-section .fi-section .fi-section-content{padding-inline:0;}
html[data-ww-custom-fields][data-ww-input-style="underline"] .fi-input-wrp:not(.ww-preview-canvas *) {border-radius:0;box-shadow:none;border:0;border-bottom:2px solid var(--ww-field-border);background:transparent;}
html[data-ww-custom-fields][data-ww-input-style="filled"] .fi-input-wrp:not(.ww-preview-canvas *) {box-shadow:none;border:1px solid transparent;background:var(--ww-field);}
html[data-ww-custom-fields][data-ww-input-style="outline"] .fi-input-wrp:not(.ww-preview-canvas *) {box-shadow:none;border:1px solid var(--ww-field-border);}
.fi-modal-window {max-width:calc(100vw - 1rem);max-height:calc(100dvh - 1rem);}
.fi-modal-content {min-width:0;overflow-y:auto;overscroll-behavior:contain;}
.fi-modal-footer .fi-ac {flex-wrap:wrap;}
.fi-ta-content {max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;}
.fi-ta-text-item-label,.ww-history td,.ww-history th {overflow-wrap:anywhere;}
.ww-record-summary {display:grid;gap:.25rem;min-width:0;overflow-wrap:anywhere;}
.ww-record-title {font-weight:700;font-size:1rem;overflow-wrap:anywhere;}
.ww-record-value {overflow-wrap:anywhere;min-width:0;}
.ww-tone-success {color:var(--ww-success);font-weight:600;}.ww-tone-warning {color:var(--ww-warning);font-weight:600;}.ww-tone-danger {color:var(--ww-danger);font-weight:600;}.ww-tone-info {color:var(--ww-info);font-weight:600;}.ww-tone-muted {color:var(--ww-text-muted);}.ww-tone-neutral {color:var(--ww-text);}
.ww-help {font-size:.875rem;line-height:var(--ww-line-height);color:var(--ww-text-muted);margin-block:.5rem;overflow-wrap:anywhere;}
.ww-setup-card {display:flex;flex-direction:column;gap:.75rem;padding-block:.75rem;border-top:1px solid var(--ww-border);}
.ww-setup-card .ww-help {flex:1;}
.ww-setup-card .fi-btn {align-self:flex-start;}
.ww-setup-section .fi-sc {grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));}
.ww-setup-section .fi-sc-component:has([id*="setup_instructions"]) {grid-column:1/-1;}
.ww-store,.ww-card-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,24rem),1fr));gap:var(--ww-space);min-width:0;}
.ww-store > *,.ww-card-grid > * {min-width:0;}
.ww-actions,.ww-appearance-scope {display:flex;flex-wrap:wrap;gap:var(--ww-gap);align-items:center;margin-block:var(--ww-space);min-width:0;}
.ww-actions > * {max-width:100%;min-width:0;}
.ww-actions .fi-input-wrp {flex:1 1 16rem;}
.ww-facts {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:.5rem;margin-block:var(--ww-space);}
.ww-facts dt {font-weight:600;}.ww-facts dd {overflow-wrap:anywhere;color:var(--ww-text-muted);}
.ww-metadata {white-space:pre-wrap;overflow-wrap:anywhere;font-size:.8125rem;max-height:22rem;overflow:auto;}
.ww-table-scroll {max-width:100%;overflow:auto;overscroll-behavior:contain;}.ww-history {width:100%;text-align:left;}.ww-history td,.ww-history th {padding:.75rem;border-bottom:1px solid var(--ww-border);vertical-align:top;}
/* Appearance: live previews are content, not another stack of boxed sections. */
.ww-appearance-preview h2 {font-size:1.25rem;font-weight:700;}
.ww-choice-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));gap:.75rem;border:0;padding:0;}
.ww-visual-choice {display:grid;grid-template-columns:auto minmax(0,1fr);gap:.5rem;align-items:center;padding:.625rem;border-radius:.375rem;cursor:pointer;}
.ww-visual-choice:has(input:checked) {outline:2px solid var(--ww-focus);outline-offset:2px;}
.ww-visual-choice input {width:1.25rem;height:1.25rem;}.ww-visual-choice > strong {grid-column:2;}
.ww-mini-card {display:grid;grid-column:2;gap:.25rem;min-height:5rem;padding:.75rem;font-size:.8125rem;background:var(--ww-surface);}
.ww-mini-none {border:0;border-radius:0;}.ww-mini-subtle {border:1px solid color-mix(in srgb,var(--ww-border) 55%,transparent);border-radius:.375rem;}.ww-mini-outline {border:2px solid var(--ww-border);border-radius:.375rem;}.ww-mini-raised {border-radius:.75rem;box-shadow:0 4px 10px rgb(0 0 0 / .15);}.ww-mini-filled {border-radius:.75rem;background:var(--ww-surface-muted);}
.ww-mini-input {grid-column:2;min-height:2.75rem;padding:.75rem;}.ww-mini-input-outline {border:1px solid var(--ww-field-border);border-radius:.375rem;}.ww-mini-input-underline {border-bottom:2px solid var(--ww-field-border);}.ww-mini-input-filled {background:var(--ww-field);border-radius:.75rem;color:var(--ww-field-text);}
.ww-preview-canvas {padding:var(--ww-space);background:var(--ww-surface-muted);color:var(--ww-text);}
.ww-container-preview {padding:var(--ww-space);}
.ww-container-preview :is(h3,h4) {font-weight:700;}.ww-container-preview h3 {font-size:1.125rem;}
.ww-preview-label {display:grid;gap:.5rem;}.ww-preview-input {width:100%;min-height:2.75rem;padding:.625rem;border:1px solid var(--ww-field-border);border-radius:var(--ww-input-radius);background:var(--ww-field);color:var(--ww-field-text);}
.ww-preview-control {min-height:2.75rem;border:1px solid var(--ww-border);border-radius:var(--ww-button-radius);background:var(--ww-surface);padding:.5rem .75rem;color:var(--ww-text);font-weight:600;}
.ww-preview-incoming,.ww-preview-outgoing {padding:.75rem;margin-block:.75rem;border-radius:var(--ww-bubble-radius);overflow-wrap:anywhere;}
.ww-preview-chat {margin-block-start:.75rem;padding:.75rem;background:var(--ww-chat-canvas);border:1px solid var(--ww-border);border-radius:var(--ww-card-radius);}
.ww-preview-composer {margin-block-start:.75rem;padding:.65rem .75rem;background:var(--ww-chat-composer);border:1px solid var(--ww-field-border);border-radius:var(--ww-input-radius);color:var(--ww-text-muted);}
.ww-preview-incoming {background:var(--ww-incoming);color:var(--ww-incoming-text);}.ww-preview-outgoing {background:var(--ww-outgoing);color:var(--ww-outgoing-text);}
/* Breakpoints describe useful composition; all grids retain content-based minimums. */
@media(max-width:640px) {html[data-ww-custom-layout] .fi-main{padding-inline:.625rem;}.fi-header-actions-ctn {flex-basis:100%;}html[data-ww-custom-section] .fi-section-content, html[data-ww-custom-section] .fi-section-header{padding:.75rem;}.ww-facts {grid-template-columns:1fr;}.ww-preview-canvas {padding:.5rem;}.ww-container-preview {padding:.75rem;}html[data-ww-custom-buttons] .fi-btn{min-height:2.75rem;}.ww-actions {align-items:stretch;}.ww-table-scroll:focus-visible {outline:3px solid var(--ww-focus);}}
@media(prefers-reduced-motion:reduce) {*,*::before,*::after {scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important;}}



html[data-ww-input-style="underline"] .ww-preview-input:not(.ww-preview-canvas *) {border:0;border-bottom:2px solid var(--ww-field-border);border-radius:0;background:transparent;}
html[data-ww-input-style="filled"] .ww-preview-input:not(.ww-preview-canvas *) {border-color:transparent;background:var(--ww-field);}

.fi-simple-main,.fi-simple-main-ctn,.fi-simple-main .fi-sc-component {min-width:0;}
.fi-simple-main .fi-fo-field-wrp-label-content {overflow-wrap:anywhere;}

/* Appearance exhaustive contract: visual finish only; responsive geometry remains in Screen Customization. */
html[data-ww-custom-topbar] .fi-topbar{background:var(--ww-topbar-background)!important;border-bottom:1px solid var(--ww-topbar-border)!important;box-shadow:var(--ww-topbar-shadow)!important;}
html[data-ww-custom-sidebar] .fi-sidebar{background:var(--ww-sidebar-background)!important;border-color:var(--ww-sidebar-border)!important;border-radius:var(--ww-sidebar-radius);box-shadow:var(--ww-sidebar-shadow)!important;}
html[data-ww-custom-login] .fi-simple-main{background:var(--ww-login-card)!important;border:1px solid var(--ww-login-card-border)!important;border-radius:var(--ww-login-card-radius)!important;box-shadow:var(--ww-login-card-shadow)!important;}
html[data-ww-custom-fields] .fi-input-wrp{box-shadow:var(--ww-field-shadow)!important;}html[data-ww-custom-fields] .fi-input-wrp:focus-within{border-color:var(--ww-field-focus)!important;box-shadow:inset 0 0 0 2px var(--ww-field-focus)!important;outline:var(--ww-focus-outer-width,0px) solid var(--ww-focus);outline-offset:var(--ww-focus-outer-offset,2px);}
html[data-ww-custom-fields] .fi-input-wrp :is(input,select,textarea):focus-visible{outline:0;box-shadow:none;}
html[data-ww-custom-buttons] .fi-btn:not(.fi-color-primary):not(.lc-button) {border-radius:var(--ww-generic-button-radius);box-shadow:var(--ww-generic-button-shadow);}
.lc-console {border-width:var(--ww-live-console-border-width)!important;border-color:var(--ww-border)!important;border-radius:var(--ww-live-console-radius)!important;box-shadow:var(--ww-live-console-shadow)!important;}
.lc-inbox-heading,.lc-chat-heading {border-color:var(--ww-chat-header-border)!important;}.lc-inbox-tools {border-color:var(--ww-chat-tools-border)!important;}.lc-inbox,.lc-conversation-list,.lc-conversation-content {border-color:var(--ww-chat-list-border)!important;}.lc-history,.lc-messages {border-color:var(--ww-chat-canvas-border)!important;}.lc-composer {border-color:var(--ww-chat-composer-border)!important;}
.lc-filter-dialog,.lc-filter-menu {border-color:var(--ww-filter-panel-border)!important;border-radius:var(--ww-filter-panel-radius)!important;box-shadow:var(--ww-filter-panel-shadow)!important;}.lc-context,.lc-context-summary,.lc-context-modal-trigger-shell {border-color:var(--ww-classification-border)!important;border-radius:var(--ww-classification-radius)!important;box-shadow:var(--ww-classification-shadow)!important;}
.lc-conversation-content {border-radius:var(--ww-conversation-row-radius)!important;}.lc-conversation-content[aria-current="true"],.lc-conversation-content.is-active {background:var(--ww-conversation-selected)!important;}
html .lc-message:not(.lc-message-out) .lc-bubble:not(.lc-bubble-audio-only) {border:1px solid var(--ww-incoming-border)!important;border-radius:var(--ww-incoming-radius)!important;box-shadow:var(--ww-incoming-shadow)!important;}html .lc-message-out .lc-bubble:not(.lc-bubble-audio-only) {border:1px solid var(--ww-outgoing-border)!important;border-radius:var(--ww-outgoing-radius)!important;box-shadow:var(--ww-outgoing-shadow)!important;}
.lc-filter-trigger {border-radius:var(--ww-filter-button-radius)!important;box-shadow:var(--ww-filter-button-shadow)!important;}.lc-take-control {border-radius:var(--ww-take-control-radius)!important;box-shadow:var(--ww-take-control-shadow)!important;}.lc-return-ai {border-radius:var(--ww-return-ai-radius)!important;box-shadow:var(--ww-return-ai-shadow)!important;}.lc-send {border-radius:var(--ww-send-button-radius)!important;box-shadow:var(--ww-send-button-shadow)!important;}
/* Semantic foregrounds belong to native Filament component variables.
 * A primary link has a transparent background; it must never inherit the
 * foreground of a filled primary button. */


/* Appearance contract: shared Filament surfaces across every administration page. */
html[data-ww-custom-tables] .fi-ta-ctn { background:var(--ww-table-row)!important; border-color:var(--ww-table-border)!important; border-radius:var(--ww-table-radius)!important; box-shadow:var(--ww-table-shadow)!important; overflow:hidden; }
html[data-ww-custom-tables] .fi-ta-header-cell{ background:var(--ww-table-header)!important; }
html[data-ww-custom-tables] .fi-ta-row{ background:var(--ww-table-row)!important; }
html[data-ww-custom-tables] .fi-ta-row:hover{ background:var(--ww-table-hover)!important; }
html[data-ww-custom-tables] .fi-ta-row > *{ border-color:var(--ww-table-border)!important; }
html[data-ww-custom-navigation] .fi-sidebar-item > a{ border-radius:var(--ww-nav-item-radius)!important; }
html[data-ww-custom-navigation] .fi-sidebar-item.fi-active > a{ background:var(--ww-nav-active)!important; }
html[data-ww-custom-navigation] .fi-sidebar-item:not(.fi-active) > a:hover{ background:var(--ww-nav-hover)!important; }
html[data-ww-custom-modals] .fi-modal-window{ background:var(--ww-modal-background)!important; border:1px solid var(--ww-modal-border)!important; border-radius:var(--ww-modal-radius)!important; box-shadow:var(--ww-modal-shadow)!important; }
html[data-ww-custom-dropdowns] .fi-dropdown-panel, html[data-ww-custom-dropdowns] .fi-select-input .choices__list--dropdown{ background:var(--ww-dropdown-background)!important; border-color:var(--ww-dropdown-border)!important; border-radius:var(--ww-dropdown-radius)!important; box-shadow:var(--ww-dropdown-shadow)!important; }
html[data-ww-custom-badges] .fi-badge:not(.fi-color-danger):not(.fi-color-success):not(.fi-color-warning):not(.fi-color-info){ background:var(--ww-badge-background)!important; color:var(--ww-badge-text)!important; border-radius:var(--ww-badge-radius)!important; }
html[data-ww-custom-danger] .fi-btn.fi-color-danger{ background:var(--ww-danger-button)!important; color:var(--ww-danger-button-text)!important; border-radius:var(--ww-danger-button-radius)!important; box-shadow:var(--ww-danger-button-shadow)!important; }


/* Symmetric default elevation contract: geometry/elevation is identical in light and dark;
   only the paired theme colors differ. */
.lc-filter-trigger {
    border: 1px solid var(--ww-filter-button-border) !important;
    box-shadow: var(--ww-filter-button-shadow) !important;
}
.lc-filter-popover,
.lc-filter-dialog,
.lc-filter-dialog-actions {
    border-color: var(--ww-filter-panel-border) !important;
    border-radius: var(--ww-filter-panel-radius) !important;
    box-shadow: var(--ww-filter-panel-shadow) !important;
}

/* Semantic appearance wins over the paired Live Chats theme defaults. */
html .lc-console { border-width:var(--ww-live-console-border-width)!important; border-color:var(--ww-border)!important; }
html .lc-console :is(.lc-inbox-heading,.lc-chat-heading) {background:var(--ww-chat-header)!important;border-bottom-color:var(--ww-chat-header-border)!important;}
html .lc-console .lc-inbox {background:var(--ww-chat-list)!important;}
html .lc-console .lc-inbox-tools {background:var(--ww-chat-tools)!important;border-bottom-color:var(--ww-chat-tools-border)!important;}
html .lc-console :is(.lc-context,.lc-context-item,.lc-filter-disclosure) {background:var(--ww-classification)!important;}
html .lc-console .lc-filter-trigger {background:var(--ww-filter-button)!important;color:var(--ww-filter-button-text)!important;}
html .lc-console .lc-composer {background:var(--ww-chat-composer)!important;}
html .lc-console .lc-composer textarea {background:var(--ww-field)!important;color:var(--ww-field-text)!important;border-color:var(--ww-field-border)!important;box-shadow:var(--ww-field-shadow)!important;border-radius:var(--ww-input-radius)!important;}
html .lc-console .lc-composer textarea:focus {border-color:var(--ww-field-focus)!important;}
.ww-preview-canvas {background:var(--ww-app-background);}

/* Density applies to the controls and table rows advertised by Appearance. */
html[data-ww-custom-layout][data-ww-density] .fi-ta-cell:not(.ww-preview-canvas *) {padding-block:var(--ww-row-padding)!important;}

/* Selected state belongs to the real inbox row, not a nonexistent child attribute. */
html .lc-console .lc-conversation-row.is-selected {background:var(--ww-conversation-selected)!important;}
html .lc-console .lc-conversation-row.is-selected .lc-conversation-content {background:transparent!important;}
html .lc-console .lc-filter-dialog {background:var(--ww-filter-panel)!important;}
/* Native semantic badges share the configured accessible state colours. */
html[data-ww-custom-badges] .fi-badge.fi-color-success{color:var(--ww-success)!important;background:color-mix(in srgb,var(--ww-success) 12%,var(--ww-surface))!important;}
html[data-ww-custom-badges] .fi-badge.fi-color-warning{color:var(--ww-warning)!important;background:color-mix(in srgb,var(--ww-warning) 12%,var(--ww-surface))!important;}
html[data-ww-custom-badges] .fi-badge.fi-color-danger{color:var(--ww-danger)!important;background:color-mix(in srgb,var(--ww-danger) 12%,var(--ww-surface))!important;}
html[data-ww-custom-badges] .fi-badge.fi-color-info{color:var(--ww-info)!important;background:color-mix(in srgb,var(--ww-info) 12%,var(--ww-surface))!important;}
.ww-screen-preview {container-type:inline-size;min-width:0;}
.ww-screen-preview-console {display:grid;grid-template-columns:minmax(0,var(--preview-list)) minmax(0,var(--preview-chat));gap:0;border:1px solid var(--ww-border);border-radius:var(--ww-card-radius);overflow:hidden;min-height:12rem;}
.ww-screen-preview-list {display:flex;flex-direction:column;gap:var(--preview-gap);padding:var(--preview-padding);background:var(--ww-chat-list);color:var(--ww-text);min-width:0;}
.ww-screen-preview-chat {display:flex;flex-direction:column;gap:.75rem;min-width:0;padding:1rem;background:var(--ww-chat-canvas);color:var(--ww-text);}
.ww-screen-preview-chat div {margin-top:auto;padding:.75rem;background:var(--ww-chat-composer);}
@container (max-width:560px) {.ww-screen-preview-console {grid-template-columns:minmax(0,1fr);}.ww-screen-preview-chat {display:none;}}

.ww-color-swatches {display:flex;flex-wrap:wrap;gap:.5rem;}
.ww-color-swatch {width:2rem;height:2rem;border-radius:.5rem;background:var(--swatch);border:1px solid #6b7280;}
.ww-color-swatch:hover:not(:disabled) {transform:translateY(-1px);}
:where(button,a).fi-disabled,:where(button,input,select,textarea):disabled,[aria-disabled="true"] {transform:none;transition:none;}
@media(prefers-reduced-motion:reduce) {.ww-color-swatch {transition:none;transform:none;}}

[data-ww-category] .fi-ta-text-item-label {color:inherit;}
/* Shared pointer/keyboard states use the same tokens in the panel and preview. */
:is(html[data-ww-custom-interactions] .fi-btn,html[data-ww-custom-interactions] .fi-icon-btn,html[data-ww-custom-interactions] .fi-link,.ww-preview-control,.ww-semantic-toggle,html[data-ww-custom-interactions] button[role="tab"],.lc-console button) {
  transition:filter var(--ww-button-transition,120ms),box-shadow var(--ww-button-transition,120ms),translate var(--ww-button-transition,120ms),scale var(--ww-button-transition,120ms),background-color var(--ww-button-transition,120ms),color var(--ww-button-transition,120ms);
}
@media(hover:hover) and (pointer:fine) {
  :is(html[data-ww-custom-interactions] .fi-btn,html[data-ww-custom-interactions] .fi-icon-btn,html[data-ww-custom-interactions] .fi-link,.ww-preview-control,.ww-semantic-toggle,html[data-ww-custom-interactions] button[role="tab"],.lc-console button):not(:disabled):not(.fi-disabled):not([aria-disabled="true"]):not([aria-busy="true"]):hover {
    filter:var(--ww-button-hover-filter,brightness(.94));
    box-shadow:var(--ww-button-hover-shadow,0 2px 7px rgb(0 0 0 / .14));
    translate:0 calc(var(--ww-button-hover-lift-enabled,1) * var(--ww-button-hover-elevation,-1px));
  }
}
:is(html[data-ww-custom-interactions] .fi-btn,html[data-ww-custom-interactions] .fi-icon-btn,html[data-ww-custom-interactions] .fi-link,.ww-preview-control,.ww-semantic-toggle,html[data-ww-custom-interactions] button[role="tab"],.lc-console button):not(:disabled):not(.fi-disabled):not([aria-disabled="true"]):not([aria-busy="true"]):active {
  translate:0 0;scale:var(--ww-button-press-scale,.985);filter:var(--ww-button-press-filter,none);
}
:is(html[data-ww-custom-interactions] .fi-btn,html[data-ww-custom-interactions] .fi-icon-btn,html[data-ww-custom-interactions] .fi-link,.ww-preview-control,.ww-semantic-toggle,html[data-ww-custom-interactions] button[role="tab"],.lc-console button):focus-visible {
  outline:2px solid var(--ww-focus,#d97706);outline-offset:3px;
}
:is(html[data-ww-custom-interactions] .fi-btn,html[data-ww-custom-interactions] .fi-icon-btn,html[data-ww-custom-interactions] .fi-link,.ww-preview-control,.ww-semantic-toggle,html[data-ww-custom-interactions] button[role="tab"],.lc-console button):is(:disabled,.fi-disabled,[aria-disabled="true"],[aria-busy="true"]) {
  filter:none;translate:none;scale:1;
}
@media(prefers-reduced-motion:reduce) {
  :is(html[data-ww-custom-interactions] .fi-btn,html[data-ww-custom-interactions] .fi-icon-btn,html[data-ww-custom-interactions] .fi-link,.ww-preview-control,.ww-semantic-toggle,html[data-ww-custom-interactions] button[role="tab"],.lc-console button) {transition:none;translate:none!important;scale:1!important;}
}
/* Shared editor shell for Appearance, Screen and Widget Web.
   The preview stage is fixed to the available viewport space, not to scroll
   position. CSS owns geometry/sticky placement; visual-preview.js only fits
   the logical content into the stage when its dimensions really change. */
.ww-appearance-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:1.5rem;
  min-width:0;
  align-items:start;
}
.ww-appearance-form,.ww-appearance-preview,.ww-live-preview {min-width:0;max-width:100%;}
.ww-appearance-form {overflow-wrap:anywhere;}
.ww-appearance-form,.ww-appearance-preview {
  padding:1rem;
  border:1px solid var(--ww-border);
  border-radius:var(--ww-card-radius);
  background:var(--ww-surface);
  box-sizing:border-box;
}
.ww-appearance-preview {
  position:static;
  align-self:start;
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:0;
}
.ww-preview-options {margin-block:.75rem;}
.ww-preview-options summary {cursor:pointer;font-weight:600;}
.ww-preview-viewport {
  display:flex;
  justify-content:center;
  align-items:flex-start;
  width:100%;
  min-width:0;
  max-width:100%;
  height:max(16rem,calc(100svh - var(--topbar-height,64px) - 7rem));
  overflow:clip;
}
.ww-appearance-preview > .ww-live-preview,
.ww-appearance-preview > .ww-preview-modes {
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-width:0;
  min-height:0;
}
.ww-appearance-preview .ww-preview-spacer {margin-inline:auto;}
@media(min-width:1200px) and (min-height:621px) {
  .ww-appearance-layout {grid-template-columns:minmax(0,3fr) minmax(0,2fr);}
  .ww-appearance-preview {
    position:sticky;
    top:calc(var(--topbar-height,64px) + 1rem);
    /* Sticky element fits beneath the top bar; no JS scroll adjustment. */
    height:max(0px,calc(100svh - var(--topbar-height,64px) - 2rem));
  }
  .ww-appearance-preview .ww-preview-viewport {
    flex:1 1 auto;
    height:auto;
    min-height:0;
  }
  /* With a measured grid column, fixed anchoring avoids sticky's initial
     snap and its mandatory release at the bottom of the editor. */
  .ww-appearance-layout[data-ww-preview-fixed] > .ww-appearance-preview {
    position:fixed;
    /* The document-origin anchor is stable at the start and end of scrolling. */
    top:var(--ww-preview-anchor-top,calc(var(--topbar-height,64px) + 1rem));
    left:var(--ww-preview-anchor-left);
    width:var(--ww-preview-anchor-width);
    /* Fit the first visible position once; scrolling never resizes the viewer. */
    height:var(--ww-preview-anchor-height,calc(100svh - var(--topbar-height,64px) - 2rem));
    max-width:none;
    margin:0;
    z-index:1; /* Filament topbar (.fi-topbar-ctn) uses z-index:30. */
  }
}
/* A fixed preview leaves its grid track in flow, including with short forms.
   Short viewports use the base single-column layout instead of an overlay. */
.ww-appearance-layout[data-ww-preview-fixed] {
  min-height:var(--ww-preview-anchor-height);
}
.ww-preview-viewport iframe {display:block;max-width:100%;height:520px;border:1px solid var(--ww-border);border-radius:var(--ww-card-radius);}
.ww-visual-actions {margin-block-start:1.5rem;}
.ww-configuration-restoration {margin-block:1rem;}
.ww-configuration-restoration summary {cursor:pointer;font-weight:600;}
.ww-restoration-content {display:grid;gap:.75rem;padding-block:.75rem;}
.ww-configuration-restoration .fi-input-wrp,.ww-configuration-restoration select {width:100%;min-width:0;}
.ww-configuration-restoration .fi-btn {justify-self:start;}


/* Semantic categories share the same tokens in real components and the isolated sample. */
html[data-ww-custom-semantics] .fi-btn[data-ww-action], .ww-preview-canvas .fi-btn[data-ww-action] {background-color:var(--ww-action)!important;color:var(--ww-action-on)!important;border-color:var(--ww-action)!important;}
html[data-ww-custom-semantics] .fi-link[data-ww-action], html[data-ww-custom-semantics] .fi-icon-btn[data-ww-action] {color:var(--ww-action)!important;}
[data-ww-state="state_active"] .fi-icon {color:var(--ww-sem-state_active)!important;}
[data-ww-state="state_inactive"] .fi-icon {color:var(--ww-sem-state_inactive)!important;}
html[data-ww-custom-semantics] .fi-header-heading{color:var(--ww-sem-title_main,var(--ww-text));}
html[data-ww-custom-semantics] .fi-section-header-heading{color:var(--ww-sem-title_section,var(--ww-text));}
html[data-ww-custom-semantics] .fi-fo-field-label-content{color:var(--ww-sem-label,var(--ww-text));}
html[data-ww-custom-semantics] [id$="-helper-text"],.ww-help {color:var(--ww-sem-help,var(--ww-text-muted));}
html[data-ww-custom-semantics] .fi-link:not([data-ww-action]) {color:var(--ww-sem-link,var(--ww-primary));}
html[data-ww-custom-semantics] .fi-toggle.fi-toggle-on{background-color:var(--ww-sem-toggle_active)!important;}
html[data-ww-custom-semantics] .fi-checkbox-input:checked{background-color:var(--ww-sem-checkbox_checked)!important;border-color:var(--ww-sem-checkbox_checked)!important;color:var(--ww-sem-checkbox_checked-on)!important;}
html[data-ww-custom-semantics] [role="option"][aria-selected="true"] {background-color:var(--ww-sem-selection)!important;color:var(--ww-sem-selection-on)!important;}
html[data-ww-custom-semantics] .fi-tabs-item[aria-selected="true"], html[data-ww-custom-semantics] .fi-tabs-item-active{background-color:var(--ww-sem-tab_active)!important;color:var(--ww-sem-tab_active-on)!important;}
.ww-semantic-example {display:grid;gap:.5rem;padding:.75rem;border-radius:.75rem;scroll-margin:1rem;}
.ww-semantic-caption {font-size:.8rem;color:var(--ww-text-muted);}
.ww-semantic-example .fi-btn {justify-self:start;}
.ww-semantic-highlight {outline:2px dashed var(--ww-focus);outline-offset:4px;}
.ww-semantic-group {margin-block:1rem;}
.ww-semantic-toggle {border-radius:2rem;padding:.375rem .75rem;justify-self:start;}
[data-ww-state="state_processing"] {color:var(--ww-sem-state_processing)!important;}
[data-ww-state="state_available"] {color:var(--ww-sem-state_available)!important;}
[data-ww-state="state_controlled"] {color:var(--ww-sem-state_controlled)!important;}
[data-ww-state="danger"] {color:var(--ww-sem-danger)!important;}
[data-ww-state] .fi-ta-text-item-label {color:inherit!important;}

.ww-preview-spacer {position:relative;flex:none;margin-inline:auto;overflow:clip;}
.ww-preview-spacer iframe {position:absolute;top:0;left:0;border:0;}
.ww-preview-dimensions {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;}
.ww-live-preview select,.ww-preview-dimensions input {max-width:100%;width:100%;min-width:0;padding:.5rem;border:1px solid var(--ww-field-border);border-radius:var(--ww-input-radius);background:var(--ww-field);color:var(--ww-text);}

/* Contextual preview uses the same structural rules with its own theme attributes. */
.ww-preview-canvas[data-ww-font="serif"] {--ww-font:Georgia,serif;} .ww-preview-canvas[data-ww-font="mono"] {--ww-font:ui-monospace,monospace;}
.ww-preview-canvas[data-ww-input-style="underline"] .fi-input-wrp {border-radius:0;box-shadow:none;border:0;border-bottom:2px solid var(--ww-field-border);background:transparent;}
.ww-preview-canvas[data-ww-input-style="filled"] .fi-input-wrp {box-shadow:none;border:1px solid transparent;background:var(--ww-field);}
.ww-preview-canvas[data-ww-input-style="outline"] .fi-input-wrp {box-shadow:none;border:1px solid var(--ww-field-border);}
.ww-preview-canvas[data-ww-input-style="underline"] .ww-preview-input {border:0;border-bottom:2px solid var(--ww-field-border);border-radius:0;background:transparent;}
.ww-preview-canvas[data-ww-input-style="filled"] .ww-preview-input {border-color:transparent;background:var(--ww-field);}
.ww-preview-canvas[data-ww-density] .fi-ta-cell {padding-block:var(--ww-row-padding)!important;}
.ww-preview-light {color-scheme:light;}
.ww-preview-dark {color-scheme:dark;}

.ww-color-swatches-native .ww-color-swatch {width:auto;height:auto;min-height:2.75rem;flex:1 1 8rem;padding:.5rem;color:var(--swatch-text);font-size:.8125rem;font-weight:600;}

/* One bounded contextual composition; editing selects its native component group. */
.ww-preview-spacer > .ww-appearance-frame {position:absolute;top:0;left:0;}
.ww-appearance-scene {width:100%;height:100%;box-sizing:border-box;font-family:var(--ww-font,system-ui);}
.ww-appearance-scene .ww-semantic-group:not([hidden]) {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin:0;}
.ww-appearance-scene .ww-semantic-group h3 {grid-column:1 / -1;}
.ww-appearance-scene .ww-semantic-example {min-width:0;padding:.5rem;overflow-wrap:anywhere;}
.ww-appearance-scene [data-ww-preview-scene][hidden] {display:none;}

/* Technical components: one parent disclosure, fully visible children, no stretched empty columns. */
.ww-maintenance-components {min-width:0;max-width:100%;}
.ww-maintenance-components-content {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ww-space);padding-block:var(--ww-space);align-items:start;}
@media(max-width:1100px){.ww-maintenance-components-content{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:700px){.ww-maintenance-components-content{grid-template-columns:minmax(0,1fr);}}
.ww-maintenance-components-content > * {min-width:0;align-self:start;}
/* Screen reference controls use the same Filament input surfaces as Appearance and Widget. */
.ww-preview-options {border:1px solid var(--ww-border);border-radius:var(--ww-card-radius);padding:.75rem 1rem;background:var(--ww-surface);min-width:0;}
.ww-preview-options > summary {list-style-position:inside;min-height:2rem;}
.ww-preview-options label {display:grid;gap:.4rem;min-width:0;margin-top:.75rem;}
.ww-preview-options .fi-input-wrp,.ww-preview-options select,.ww-preview-options input {width:100%;min-width:0;max-width:100%;}
.ww-preview-dimensions {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));gap:var(--ww-gap);min-width:0;}
/* Shared approved accent behaviour: filtering, chat sound, and theme selection.
   Geometry and interaction implementation remain owned by their original components. */
:root {--ww-shared-control-accent:#d97706;}
:is(.lc-console .lc-filter-trigger,.lc-console .lc-sound-toggle,.ww-preview-theme .ww-preview-control):is(:hover,:focus-visible) {
    border-color:var(--ww-shared-control-accent)!important;
    color:var(--ww-shared-control-accent)!important;
}
:is(.lc-console .lc-filter-trigger,.lc-console .lc-sound-toggle,.ww-preview-theme .ww-preview-control):focus-visible {
    outline:2px solid var(--ww-shared-control-accent);outline-offset:2px;
}

/* Shared interaction for header actions, table filters and theme-mode selectors.
   Preserve native component behaviour, changing only visible accent states. */
:where(.lc-console) .ww-shared-header-action:is(:hover,:focus-visible), :where(.lc-console) .lc-more-button:is(:hover,:focus-visible), :where(.fi-ta) .fi-ta-filters-trigger-action-ctn :is(button,a):is(:hover,:focus-visible), :where(.fi-ta) .fi-ta-filters-trigger-action-ctn :is(.fi-btn):is(:hover,:focus-visible){
    border-color:var(--ww-shared-control-accent,#d97706)!important;
    color:var(--ww-shared-control-accent,#d97706)!important;
}
:where(.lc-console) .ww-shared-header-action:focus-visible,
:where(.lc-console) .lc-more-button:focus-visible {
    outline:2px solid var(--ww-shared-control-accent,#d97706);
    outline-offset:2px;
}
/* Constrain Filament modals to the viewport, including Knowledge Base filters. */
.fi-ta-filters-modal .fi-modal-window {max-width:min(36rem,calc(100vw - 2rem));max-height:calc(100dvh - 2rem);}
.fi-ta-filters-modal .fi-modal-content {min-width:0;overflow-y:auto;}

/* Reuse the same accent on explicit filter actions outside Filament tables. */
:where(.fi-btn,.fi-link,.fi-icon-btn).ww-shared-filter-action:is(:hover,:focus-visible),
.ww-shared-filter-action:is(:hover,:focus-visible) {
    border-color:var(--ww-shared-control-accent,#d97706)!important;
    color:var(--ww-shared-control-accent,#d97706)!important;
}

/* A field's semantic label has its own token; a record value uses --ww-category-*.
   Themes remain independent and names never receive per-record overrides. */
[data-ww-label-category="profile"] .fi-fo-field-wrp-label,
[data-ww-label-category="profile"] .fi-fo-field-wrp-label-content {color:var(--ww-sem-category_profile_label)!important;}
[data-ww-label-category="user"] .fi-fo-field-wrp-label,
[data-ww-label-category="user"] .fi-fo-field-wrp-label-content {color:var(--ww-sem-category_user_label)!important;}
[data-ww-label-category="widget"] .fi-fo-field-wrp-label,
[data-ww-label-category="widget"] .fi-fo-field-wrp-label-content {color:var(--ww-sem-category_widget_label)!important;}
[data-ww-label-category="engine"] .fi-fo-field-wrp-label,
[data-ww-label-category="engine"] .fi-fo-field-wrp-label-content {color:var(--ww-sem-category_engine_label)!important;}
[data-ww-label-category="provider"] .fi-fo-field-wrp-label,
[data-ww-label-category="provider"] .fi-fo-field-wrp-label-content {color:var(--ww-sem-category_provider_label)!important;}
[data-ww-label-category="knowledge"] .fi-fo-field-wrp-label,
[data-ww-label-category="knowledge"] .fi-fo-field-wrp-label-content {color:var(--ww-sem-category_knowledge_label)!important;}

/* WidgetWeb: one approved visual contract for Live Chat header actions.
   Reference: Informacion y clasificacion; same surface, foreground, border,
   geometry and interaction for Filtrar, Sonido and Mas, in both themes.
   Semantic actions outside this family retain their established colours. */
:where(.lc-console) :is(.lc-filter-trigger,.lc-sound-toggle,.lc-more-button),
:where(.lc-console) .lc-context-modal-trigger > :first-child {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.4rem;
    min-height:34px;
    padding:.4rem .7rem;
    border:1px solid var(--lc-line) !important;
    border-radius:.55rem !important;
    background:var(--ww-surface) !important;
    color:var(--lc-muted) !important;
    font-size:.78rem;
    font-weight:600;
    box-shadow:none;
    transition:background-color 120ms ease,border-color 120ms ease,color 120ms ease;
}
:where(.lc-console) :is(.lc-filter-trigger,.lc-sound-toggle,.lc-more-button):is(:hover,:focus-visible,[aria-expanded="true"]),
:where(.lc-console) .lc-context-modal-trigger:is(:hover,:focus-visible) > :first-child {
    background:var(--ww-surface) !important;
    border-color:var(--ww-shared-control-accent,#d97706) !important;
    color:var(--ww-shared-control-accent,#d97706) !important;
}
:where(.lc-console) :is(.lc-filter-trigger,.lc-sound-toggle,.lc-more-button) :is(svg,span),
:where(.lc-console) .lc-context-modal-trigger > :first-child :is(svg,span) {
    color:inherit;
}
:where(.lc-console) :is(.lc-filter-trigger,.lc-sound-toggle,.lc-more-button):focus-visible,
:where(.lc-console) .lc-context-modal-trigger:focus-visible {
    outline:2px solid var(--ww-shared-control-accent,#d97706);
    outline-offset:2px;
}


/* WW 2026-10-09: one verified visual family for filter and Live Chat header actions.
   The classification action is the visual reference. Do not style action semantics elsewhere. */
html body .lc-console .lc-filter-trigger, html body .lc-console .lc-sound-toggle, html body .lc-console .lc-more-button, html body .lc-console .lc-context-modal-trigger > span, html body .fi-ta .fi-ta-filters-trigger-action-ctn :is(button,a), html body .fi-ta :is(button,a).ww-shared-filter-action{
    background:var(--ww-surface)!important;
    color:var(--ww-shared-control-accent,#d97706)!important;
    border:1px solid var(--ww-shared-control-accent,#d97706)!important;
    border-radius:.55rem!important;
    box-shadow:none!important;
    font-weight:600;
    transition:background-color 120ms ease,border-color 120ms ease,color 120ms ease,box-shadow 120ms ease;
}
html body .lc-console .lc-filter-trigger:is(:hover,:focus-visible,.is-open,[aria-expanded="true"]), html body .lc-console .lc-sound-toggle:is(:hover,:focus-visible,.is-enabled,[aria-pressed="true"]), html body .lc-console .lc-more-button:is(:hover,:focus-visible,[aria-expanded="true"]), html body .lc-console .lc-context-modal-trigger:is(:hover,:focus-visible) > span, html body .fi-ta .fi-ta-filters-trigger-action-ctn :is(button,a):is(:hover,:focus-visible,[aria-expanded="true"]), html body .fi-ta :is(button,a).ww-shared-filter-action:is(:hover,:focus-visible,[aria-expanded="true"]){
    background:var(--ww-surface)!important;
    color:var(--ww-shared-control-accent,#d97706)!important;
    border-color:var(--ww-shared-control-accent,#d97706)!important;
}
html body .lc-console :is(.lc-filter-trigger,.lc-sound-toggle,.lc-more-button) :is(svg,span), html body .fi-ta .fi-ta-filters-trigger-action-ctn :is(svg,span), html body .fi-ta .ww-shared-filter-action :is(svg,span){
    color:inherit!important;
}
html body .lc-console :is(.lc-filter-trigger,.lc-sound-toggle,.lc-more-button):focus-visible, html body .fi-ta .fi-ta-filters-trigger-action-ctn :is(button,a):focus-visible{
    outline:2px solid var(--ww-shared-control-accent,#d97706)!important;
    outline-offset:2px;
}
/* Shared family stays readable on touch, not hover-dependent. */


/* WW visual inheritance v3: source-of-truth defaults, never animations/geometry. */
html:not(.dark) { --ww-shared-control-accent: #d97706; }
html.dark { --ww-shared-control-accent: #fbbf24; }
/* One family across Live Chat header and Filament table filter triggers.
   Override historical solid orange and icon-only styles as a complete unit. */
html body .lc-console :is(.lc-filter-trigger,.lc-sound-toggle,.lc-more-button), html body .lc-console .lc-context-modal-trigger > span, html body .fi-ta .fi-ta-filters-trigger-action-ctn :is(button,a,.fi-btn,.fi-icon-btn), html body .fi-ta :is(button,a).ww-shared-filter-action{
    background:var(--ww-surface)!important;
    color:var(--ww-shared-control-accent)!important;
    border:1px solid var(--ww-shared-control-accent)!important;
    border-radius:.55rem!important;
    box-shadow:none!important;
    opacity:1!important;
}
html body .lc-console :is(.lc-filter-trigger,.lc-sound-toggle,.lc-more-button):is(:hover,:focus-visible,.is-open,[aria-expanded="true"],[aria-pressed="true"]), html body .lc-console .lc-context-modal-trigger:is(:hover,:focus-visible) > span, html body .fi-ta .fi-ta-filters-trigger-action-ctn :is(button,a,.fi-btn,.fi-icon-btn):is(:hover,:focus-visible,[aria-expanded="true"]), html body .fi-ta :is(button,a).ww-shared-filter-action:is(:hover,:focus-visible,[aria-expanded="true"]){
    background:var(--ww-surface)!important;
    color:var(--ww-shared-control-accent)!important;
    border-color:var(--ww-shared-control-accent)!important;
    box-shadow:0 2px 7px #00000018!important;
}
html body .lc-console :is(.lc-filter-trigger,.lc-sound-toggle,.lc-more-button) :is(svg,span), html body .fi-ta .fi-ta-filters-trigger-action-ctn :is(svg,span){
    color:inherit!important;
    fill:currentColor;
    opacity:1!important;
}
html body .fi-ta .fi-ta-filters-trigger-action-ctn :is(button,a,.fi-btn,.fi-icon-btn):focus-visible, html body .lc-console :is(.lc-filter-trigger,.lc-sound-toggle,.lc-more-button):focus-visible{
    outline:2px solid var(--ww-shared-control-accent)!important;
    outline-offset:2px;
}
/* Menus must stand apart from their parent surface in both themes. */
html[data-ww-custom-dropdowns]:not(.dark) .fi-dropdown-panel, html[data-ww-custom-dropdowns]:not(.dark) .fi-select-input .choices__list--dropdown{
    background:var(--ww-dropdown-background,#FFFFFF)!important;
    border:1px solid var(--ww-dropdown-border,#cbd5e1)!important;
    box-shadow:0 10px 26px #00000018!important;
}
html[data-ww-custom-dropdowns].dark .fi-dropdown-panel, html[data-ww-custom-dropdowns].dark .fi-select-input .choices__list--dropdown{
    background:var(--ww-dropdown-background,#111827)!important;
    border:1px solid var(--ww-dropdown-border,#475569)!important;
    box-shadow:0 14px 32px #00000060!important;
}
/* Keep text legible in Filament's nested filter menu. */
html[data-ww-custom-dropdowns].dark .fi-ta-filters-dropdown .fi-dropdown-panel, html[data-ww-custom-modals].dark .fi-ta-filters-modal .fi-modal-window{
    background:var(--ww-dropdown-background,#111827)!important;
    color:var(--ww-text,#f9fafb)!important;
}
/* Theme-specific field focus inherits the same default as semantic emphasis. */
html[data-ww-custom-fields]:not(.dark) :is(.fi-input-wrp,.fi-select-input,.fi-fo-field-wrp) :is(input,select,textarea):focus-visible{
    outline-color:var(--ww-field-focus,#d97706)!important;
}
html[data-ww-custom-fields].dark :is(.fi-input-wrp,.fi-select-input,.fi-fo-field-wrp) :is(input,select,textarea):focus-visible{
    outline-color:var(--ww-field-focus,#fbbf24)!important;
}
/* Explicit native chat send action: orange regardless of surrounding theme. */
html body .lc-console .lc-send {background:var(--ww-send-button)!important;border-color:var(--ww-send-button)!important;color:var(--ww-send-button-text)!important;}

/* Maintenance visual separation v1: page-scoped, theme-token driven. */
.ww-maintenance-page { --ww-maintenance-gap: clamp(.75rem, 1.5vw, 1.25rem); }
.ww-maintenance-page .fi-section { min-width: 0; }
/* The global design-system removes nested section borders. Restore them ONLY here. */
.ww-maintenance-page .fi-section .fi-section,
.ww-maintenance-page .ww-store > .fi-section,
.ww-maintenance-page .ww-maintenance-components-content > .fi-section {
  border: var(--ww-card-width, var(--ww-card-border-width, 1px)) solid var(--ww-card-border, var(--ww-card-border-color, var(--ww-border)));
  border-radius: var(--ww-card-radius);
  background: var(--ww-card-background, var(--ww-surface));
  box-shadow: var(--ww-card-shadow, var(--ww-shadow));
  padding-block: 0;
  margin-block: 0;
  min-width: 0;
}
/* Every horizontal action group has its own bounded area. */
.ww-maintenance-page .ww-actions {
  border: 1px solid var(--ww-border);
  border-radius: var(--ww-card-radius);
  background: var(--ww-surface-muted);
  padding: .75rem;
  gap: var(--ww-gap);
  align-items: center;
  min-width: 0;
}
.ww-maintenance-page .ww-actions > * { min-width: 0; }
/* Structured facts, technical details and historical tables are distinct surfaces. */
.ww-maintenance-page .ww-facts,
.ww-maintenance-page details,
.ww-maintenance-page .ww-table-scroll {
  border: 1px solid var(--ww-border);
  border-radius: var(--ww-card-radius);
  background: var(--ww-surface-muted);
  padding: .75rem;
  min-width: 0;
}
.ww-maintenance-page .ww-facts { column-gap: 1rem; row-gap: 0; }
.ww-maintenance-page .ww-facts > dt,
.ww-maintenance-page .ww-facts > dd {
  min-width: 0;
  margin: 0;
  padding: .55rem .25rem;
  border-bottom: 1px solid var(--ww-border);
}
.ww-maintenance-page .ww-facts > dt:nth-last-child(-n/**/+2),
.ww-maintenance-page .ww-facts > dd:nth-last-child(-n/**/+2) { border-bottom: 0; }
.ww-maintenance-page details > summary { cursor: pointer; font-weight: 600; }
.ww-maintenance-page details[open] > summary { margin-block-end: .75rem; }
.ww-maintenance-page .ww-metadata { max-width: 100%; }
.ww-maintenance-page .ww-table-scroll { padding: .25rem; }
.ww-maintenance-page .ww-maintenance-components-content,
.ww-maintenance-page .ww-store { gap: var(--ww-maintenance-gap); align-items: start; }
.ww-maintenance-page .ww-maintenance-components-content > *,
.ww-maintenance-page .ww-store > * { align-self: start; min-width: 0; }
@media (max-width: 640px) {
  .ww-maintenance-page .ww-actions { align-items: stretch; }
  .ww-maintenance-page .ww-facts > dt,
  .ww-maintenance-page .ww-facts > dd { border-bottom: 0; }
  .ww-maintenance-page .ww-facts > dd { border-bottom: 1px solid var(--ww-border); padding-top: 0; }
  .ww-maintenance-page .ww-facts > dd:last-child { border-bottom: 0; }
}

/* Maintenance cards v2: one bounded item per health check and plugin. */
.ww-maintenance-page .ww-health-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ww-maintenance-gap,1rem);align-items:start;margin-block:var(--ww-space);}
.ww-maintenance-page .ww-health-card {display:block;min-width:0;margin:0;padding:1rem;border:1px solid var(--ww-border);border-radius:var(--ww-card-radius, .75rem);background:var(--ww-surface-muted, var(--ww-surface));box-shadow:var(--ww-card-shadow,none);}
.ww-maintenance-page .ww-health-card dt {font-weight:700;margin:0 0 .5rem;padding:0 0 .5rem;border-bottom:1px solid var(--ww-border);}
.ww-maintenance-page .ww-health-card dd {margin:0;overflow-wrap:anywhere;color:var(--ww-text-muted);line-height:1.6;}
.ww-maintenance-page .ww-store {grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;}
.ww-maintenance-page .ww-store > .fi-section {min-width:0;align-self:start;}
.ww-maintenance-page .ww-maintenance-detail {padding:.75rem;border:1px solid var(--ww-border);border-radius:var(--ww-card-radius,.75rem);background:var(--ww-surface-muted,var(--ww-surface));min-width:0;overflow-wrap:anywhere;}
.ww-maintenance-page .ww-maintenance-detail h4 {font-weight:650;margin:0 0 .65rem;}
.ww-maintenance-page .ww-maintenance-detail pre {white-space:pre-wrap;overflow-wrap:anywhere;}
@media(max-width:1100px){.ww-maintenance-page .ww-store,.ww-maintenance-page .ww-health-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:700px){.ww-maintenance-page .ww-store,.ww-maintenance-page .ww-health-grid{grid-template-columns:minmax(0,1fr);}}

/* WidgetWeb maintenance user view v3 */
/* Tarjetas simétricas por fila: altura natural, sin scroll interno. */
.ww-maintenance-page .ww-maintenance-components-content,
.ww-maintenance-page .ww-store,
.ww-maintenance-page .ww-health-grid {
 display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;align-items:stretch;
}
.ww-maintenance-page .ww-maintenance-components-content > .fi-section,
.ww-maintenance-page .ww-store > .fi-section,
.ww-maintenance-page .ww-health-grid > .ww-health-card {
 height:auto;min-height:0;max-height:none;min-width:0;overflow:visible;
 align-self:stretch;border:1px solid var(--ww-card-border,var(--ww-border));
 border-radius:var(--ww-card-radius,.75rem);background:var(--ww-card-background,var(--ww-surface));
 box-shadow:var(--ww-card-shadow,none);
}
.ww-maintenance-page .ww-health-grid > .ww-health-card {padding:1rem;}
.ww-maintenance-page .ww-facts {overflow-wrap:anywhere;}
.ww-maintenance-page .ww-store .ww-actions {display:flex;flex-wrap:wrap;}
@media(max-width:1100px){.ww-maintenance-page .ww-maintenance-components-content,.ww-maintenance-page .ww-store,.ww-maintenance-page .ww-health-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:680px){.ww-maintenance-page .ww-maintenance-components-content,.ww-maintenance-page .ww-store,.ww-maintenance-page .ww-health-grid{grid-template-columns:minmax(0,1fr);}}

/* Solo Bases de conocimiento: Filament reasigna el contador del filtro al renderizar. */
html body .fi-ta .ww-kb-filter-no-count :is(.fi-badge, .fi-btn-badge),
html body .fi-ta .ww-kb-filter-no-count:is(.fi-badge, .fi-btn-badge) {
    display: none !important;
}

/* Solo Usuarios: ocultar el distintivo numérico del botón Filtrar. */
html body .fi-ta .ww-users-filter-no-count :is(.fi-badge, .fi-btn-badge),
html body .fi-ta .ww-users-filter-no-count:is(.fi-badge, .fi-btn-badge) {
    display: none !important;
}


/* WW native filter modal controls 2026-10-11.
   UI-only: native actions and Livewire behaviour stay unchanged.
   Do not inherit radius or motion effects from personal appearance settings. */
html body :is(.fi-ta-filters-modal, .ww-selection-modal, .ww-classification-modal) .fi-modal-footer :is(.fi-btn, button), html[data-ww-custom-buttons] body .dc-filter-panel .fi-btn, html body .lc-console .lc-filter-dialog-actions :is(button, .fi-btn), html body .lc-console .lc-filter-actions :is(button, .fi-btn){
    border-radius: .55rem !important;
    translate: none !important;
    scale: 1 !important;
    transform: none !important;
    filter: none !important;
    animation: none !important;
    transition: none !important;
}

.ww-preview-real-chat .lc-console-shell {min-height:380px;height:420px;}
.ww-preview-real-chat .lc-console {height:100%;min-height:0;}
.ww-preview-knowledge .fi-ta {overflow:hidden;}
.ww-preview-knowledge-head,.ww-preview-knowledge-row {display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);align-items:center;gap:.5rem;padding:.8rem;color:var(--ww-text);border-bottom:1px solid var(--ww-border);font-size:.85rem;}
.ww-preview-knowledge-head {background:var(--ww-table-header,var(--ww-surface-muted));}
.ww-preview-knowledge-row {background:var(--ww-table-row,var(--ww-surface));}
.ww-preview-knowledge-status {color:var(--ww-success);}

/* Shared symmetric editor cards.
   In two columns, the left editor and the right preview use one common
   responsive reference based on the taller collapsed editor. The fixed viewer
   continues to respect the safe space
   already measured by the UNMODIFIED preview anchor; expanded form sections
   may grow independently, without stretching the fixed viewer.
   No new fixed pixel ceiling: taller screens offer a taller preview.
   In one column, CSS grid gives the two stacked cards equal natural rows;
   neither card has a hard-coded height and both use the same width. */
@media (min-width: 1200px) and (min-height: 621px) {
  .ww-appearance-layout {
    --ww-editor-paired-height: min(
      calc(100svh - var(--topbar-height, 64px) - 18.5rem),
      var(--ww-preview-anchor-height, calc(100svh - var(--topbar-height, 64px) - 2rem))
    );
  }
  .ww-appearance-layout > .ww-appearance-form {
    min-height: var(--ww-editor-paired-height);
  }
  .ww-appearance-layout > .ww-appearance-preview,
  .ww-appearance-layout[data-ww-preview-fixed] > .ww-appearance-preview {
    height: var(--ww-editor-paired-height);
  }
  .ww-appearance-layout > .ww-appearance-preview > :is(.ww-preview-modes, .ww-live-preview) {
    flex: 1 1 auto;
    min-height: 0;
  }
  .ww-appearance-layout > .ww-appearance-preview .ww-preview-viewport {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    align-items: center;
  }
}
/* Natural symmetry when the editor and its preview are stacked. */
/* A stacked editor must follow the actual content height of each card.
   Never make the preview as tall as the whole (possibly long) form. */
@media (max-width: 1199px), (max-height: 620px) {
  .ww-appearance-layout {
    grid-auto-rows: max-content;
    align-items: start;
  }
  .ww-appearance-layout > .ww-appearance-form,
  .ww-appearance-layout > .ww-appearance-preview {
    height: auto;
    min-height: 0;
    align-self: start;
  }
  .ww-appearance-layout > .ww-appearance-preview > :is(.ww-preview-modes, .ww-live-preview) {
    flex: none;
    min-height: 0;
  }
  .ww-appearance-layout > .ww-appearance-preview .ww-preview-viewport {
    flex: none;
    height: clamp(17rem, 60svh, 34rem);
    min-height: 0;
    align-items: center;
  }
}
@media (max-width: 640px) {
  .ww-appearance-layout { gap: 1rem; }
  .ww-appearance-layout > .ww-appearance-form,
  .ww-appearance-layout > .ww-appearance-preview { padding: .75rem; }
  .ww-appearance-layout > .ww-appearance-preview .ww-preview-viewport {
    height: clamp(15rem, 48svh, 26rem);
  }
}

/* Functional families and semantic badges reuse Appearance colours, with derived contrast. */
[data-ww-channel-summary] [data-ww-family="channel"] .fi-badge {
    background:var(--ww-family-channel)!important;color:var(--ww-family-channel-on)!important;
}
[data-ww-state="state_active"]{--ww-state-colour:var(--ww-sem-state_active);--ww-state-on:var(--ww-sem-state_active-on);}
[data-ww-state="state_inactive"]{--ww-state-colour:var(--ww-sem-state_inactive);--ww-state-on:var(--ww-sem-state_inactive-on);}
[data-ww-state="state_available"]{--ww-state-colour:var(--ww-sem-state_available);--ww-state-on:var(--ww-sem-state_available-on);}
[data-ww-state="state_busy"]{--ww-state-colour:var(--ww-sem-state_busy);--ww-state-on:var(--ww-sem-state_busy-on);}
[data-ww-state="state_controlled"]{--ww-state-colour:var(--ww-sem-state_controlled);--ww-state-on:var(--ww-sem-state_controlled-on);}
[data-ww-state="state_processing"]{--ww-state-colour:var(--ww-sem-state_processing);--ww-state-on:var(--ww-sem-state_processing-on);}
[data-ww-state="danger"]{--ww-state-colour:var(--ww-sem-danger);--ww-state-on:var(--ww-sem-danger-on);}
[data-ww-state="warning"]{--ww-state-colour:var(--ww-sem-warning);--ww-state-on:var(--ww-sem-warning-on);}
[data-ww-state="success"]{--ww-state-colour:var(--ww-sem-success);--ww-state-on:var(--ww-sem-success-on);}
[data-ww-state="info"]{--ww-state-colour:var(--ww-sem-info);--ww-state-on:var(--ww-sem-info-on);}
[data-ww-channel-summary] [data-ww-state] .fi-badge,
#ww-diagnostics .fi-badge[data-ww-state],
html body .fi-ta [data-ww-state] .fi-badge,
.lc-status-badge[data-ww-state] {
    background:var(--ww-state-colour)!important;color:var(--ww-state-on)!important;
}

/* Visual consistency V4.2: compact operational diagnostics, responsive and theme-neutral. */
.ww-maintenance-page .ww-health-list {display:grid;grid-template-columns:minmax(0,1fr);gap:0;}
.ww-maintenance-page .ww-health-row {min-width:0;padding:.875rem .25rem;border-bottom:1px solid var(--ww-border);}
.ww-maintenance-page .ww-health-row:last-child {border-bottom:0;}
.ww-maintenance-page .ww-health-main {display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;}
.ww-maintenance-page .ww-health-name {font-weight:650;overflow-wrap:anywhere;}
.ww-maintenance-page .ww-health-detail {margin-block:.25rem;color:var(--ww-text-muted);overflow-wrap:anywhere;}
.ww-maintenance-page .ww-health-evidence {margin-block:.25rem;}
.ww-maintenance-page .ww-health-evidence > summary {font-size:.875rem;color:var(--ww-text-muted);cursor:pointer;}
.ww-maintenance-page .ww-health-evidence[open] {padding:.5rem;border:1px solid var(--ww-border);border-radius:var(--ww-radius);}
.ww-maintenance-page .ww-health-evidence .ww-facts {margin-top:.5rem;}

/* Keep the installation accordion separated from the appearance form by
   the same 1.5rem rhythm used by the editor grid and other sections. */
.ww-appearance-form > .ww-widget-installation-help { margin-block-end: 1.5rem; }

/* V4.3: Installation guidance stays in the form column, never beneath the
   separately anchored preview. Wrap example code within the native section. */
.ww-appearance-form .ww-installation-code {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  overflow-x: auto;
}