/* Shared Frexima interface. Loaded only on non-studio routes by ui_theme.php.
   Salon public booking pages retain their own configured brand colours. */
html[data-ui-theme="workspace"] body {
    --workspace-page: #F7F3EE;
    --workspace-surface: #FFFDFA;
    --workspace-subtle: #F1EBE3;
    --workspace-text: #2E2723;
    --workspace-muted: #6D5847;
    --workspace-line: #DED2C7;
    --workspace-control: #988373;
    --workspace-action: #A45F57;
    --workspace-action-hover: #8E4F49;
    --workspace-action-strong: #713E3A;
    --workspace-selected: #EEE0D5;
    --workspace-nav-active: #986D55;
    --workspace-shadow: 0 3px 14px rgb(46 39 35 / 5%);
    --workspace-floating-bottom: 20px;

    /* Compatibility aliases let existing components share semantic values. */
    --fx-color-purple-600: var(--workspace-action);
    --fx-color-purple-700: var(--workspace-action-hover);
    --fx-color-purple-900: var(--workspace-action-strong);
    --fx-color-purple-050: var(--workspace-selected);
    --fx-color-gray-025: var(--workspace-surface);
    --fx-color-gray-050: var(--workspace-page);
    --fx-color-ink-950: var(--workspace-text);
    --fx-color-ink-700: var(--workspace-muted);
    --fx-color-ink-600: var(--workspace-muted);
    --fx-color-line-100: var(--workspace-line);
    --fx-color-line-300: var(--workspace-control);
    --fx-color-line-control: var(--workspace-control);
    --fx-action-primary: var(--workspace-action);
    --fx-action-primary-hover: var(--workspace-action-hover);
    --fx-purple: var(--workspace-action);
    --fx-purple-hover: var(--workspace-action-hover);
    --fx-purple-dark: var(--workspace-action-strong);
    --fx-purple-soft: var(--workspace-selected);
    --fx-primary: var(--workspace-action);
    --fx-primary-dark: var(--workspace-action-strong);
    --fx-primary-border: var(--workspace-line);
    --fx-accent: var(--workspace-action);
    --fx-accent-strong: var(--workspace-action-strong);
    --fx-accent-soft: var(--workspace-selected);
    --fx-page-bg: var(--workspace-page);
    --fx-background: var(--workspace-page);
    --fx-card-bg: var(--workspace-surface);
    --fx-card: var(--workspace-surface);
    --fx-surface-soft: var(--workspace-subtle);
    --fx-surface-page: var(--workspace-page);
    --fx-surface-raised: var(--workspace-surface);
    --fx-surface-subtle: var(--workspace-subtle);
    --fx-surface-selected: var(--workspace-selected);
    --fx-text: var(--workspace-text);
    --fx-text-primary: var(--workspace-text);
    --fx-text-secondary: var(--workspace-muted);
    --fx-text-muted: var(--workspace-muted);
    --fx-border: var(--workspace-line);
    --fx-border-subtle: var(--workspace-line);
    --fx-border-strong: var(--workspace-control);
    --fx-border-control: var(--workspace-control);
    --fx-sidebar: var(--workspace-subtle);
    --fx-focus-ring: var(--workspace-action-strong);
    --fx-shadow-card: var(--workspace-shadow);
    --fx-shadow-focus: 0 0 0 4px rgb(164 95 87 / 20%);
    --frexima-purple: var(--workspace-action);
    --frexima-purple-dark: var(--workspace-action-strong);
    --frexima-sidebar: var(--workspace-subtle);
    --frexima-bg: var(--workspace-page);
    --frexima-border: var(--workspace-line);
    --frexima-text: var(--workspace-text);
    --frexima-muted: var(--workspace-muted);
    --primary: var(--workspace-action);
    --primary-dark: var(--workspace-action-strong);
    --primary-light: var(--workspace-selected);
    --text-dark: var(--workspace-text);
    --text-muted: var(--workspace-muted);
    --border: var(--workspace-line);
    --body-bg: var(--workspace-page);
    --card-bg: var(--workspace-surface);
    --client-color-primary: var(--workspace-action);
    --client-color-primary-hover: var(--workspace-action-hover);
    --client-color-primary-strong: var(--workspace-action-strong);
    --client-color-primary-soft: var(--workspace-selected);
    --client-color-page: var(--workspace-page);
    --client-color-surface: var(--workspace-surface);
    --client-color-surface-soft: var(--workspace-subtle);
    --client-color-text: var(--workspace-text);
    --client-color-text-secondary: var(--workspace-muted);
    --client-color-text-muted: var(--workspace-muted);
    --client-color-border: var(--workspace-line);
    --client-color-border-control: var(--workspace-control);
    --bx-page: var(--workspace-page);
    --bx-text: var(--workspace-text);
    --bx-muted: var(--workspace-muted);
    --bx-border: var(--workspace-line);
    --bx-pink: var(--workspace-action);
    --brand-purple: var(--workspace-action);
    --brand-purple-dark: var(--workspace-action-strong);
    --brand-purple-softer: var(--workspace-selected);
    --community-purple: var(--workspace-action);
    --community-purple-deep: var(--workspace-action-strong);
    --timeline-purple: var(--workspace-action);
    --forum-purple: var(--workspace-action);
    --flow-gradient: linear-gradient(135deg, var(--workspace-action), var(--workspace-action-strong));
    color: var(--workspace-text);
    background: var(--workspace-page);
}

/* Shell components are deliberately shared by all application routes. */
html[data-ui-theme="workspace"] body:is(.brand-body, .dashboard-body) :is(.brand-sidebar, .sidebar, .sidebar-canvas, .brand-sidebar-canvas) {
    background: var(--workspace-subtle) !important;
    color: var(--workspace-muted);
    border-color: var(--workspace-line);
}
html[data-ui-theme="workspace"] body:is(.brand-body, .dashboard-body) :is(.sidebar-brand, .brand-sidebar-link, .brand-sidebar-sublink, .sidebar-link, .sidebar-sublink, .sidebar-profile-meta strong, .sidebar-profile-meta small, .sidebar-upgrade-link, .sidebar-account-upgrade, .brand-mobile-more h3, .brand-mobile-more .section-label) {
    color: var(--workspace-muted) !important;
}
html[data-ui-theme="workspace"] body:is(.brand-body, .dashboard-body) :is(.sidebar-brand, .brand-sidebar-link, .brand-sidebar-sublink, .sidebar-link, .sidebar-sublink) i {
    color: inherit !important;
}
html[data-ui-theme="workspace"] body:is(.brand-body, .dashboard-body) :is(.brand-sidebar-link, .brand-sidebar-sublink, .sidebar-link, .sidebar-sublink, .brand-mobile-more-link):hover {
    color: var(--workspace-text) !important;
    background: var(--workspace-selected) !important;
}
html[data-ui-theme="workspace"] body:is(.brand-body, .dashboard-body) :is(.brand-sidebar-link, .brand-sidebar-sublink, .sidebar-link, .sidebar-sublink, .brand-mobile-more-link).active {
    color: #fff !important;
    background: var(--workspace-nav-active) !important;
    box-shadow: inset 3px 0 0 var(--workspace-action-strong);
}
html[data-ui-theme="workspace"] body:is(.brand-body, .dashboard-body) :is(.brand-sidebar-link, .brand-sidebar-sublink, .sidebar-link, .sidebar-sublink, .brand-mobile-more-link).active :is(i, span) {
    color: inherit !important;
}
html[data-ui-theme="workspace"] :is(.brand-mobile-more-link, .brand-mobile-more .sidebar-mobile-account) {
    color: var(--workspace-text);
    background: var(--workspace-surface);
    border-color: var(--workspace-line);
}
html[data-ui-theme="workspace"] :is(.brand-mobile-more-link > i:first-child, .brand-mobile-more-link > i:last-child) {
    color: var(--workspace-action-strong);
    background: var(--workspace-selected);
}
html[data-ui-theme="workspace"] :is(.sidebar-canvas, .brand-sidebar-canvas) .btn-close { filter: none; }
html[data-ui-theme="workspace"] :is(.sidebar, .brand-sidebar) .sidebar-mobile-account {
    background: transparent;
    border-color: var(--workspace-line);
}
html[data-ui-theme="workspace"] .sidebar-plan-link {
    color: var(--workspace-action-strong) !important;
    background: var(--workspace-surface) !important;
    border-color: var(--workspace-line) !important;
}
html[data-ui-theme="workspace"] .sidebar-plan-link:is(:hover, :focus-visible) {
    color: var(--workspace-text) !important;
    background: var(--workspace-selected) !important;
}
html[data-ui-theme="workspace"] :is(.brand-topbar, .topbar, .marketing-nav) {
    background: var(--workspace-surface);
    border-color: var(--workspace-line);
}

html[data-ui-theme="workspace"] .frexima-premium-dashboard {
    display: flex;
    flex-direction: column;
}

html[data-ui-theme="workspace"] .frexima-premium-dashboard > .frexima-dashboard-hero { order: 1; }
html[data-ui-theme="workspace"] .frexima-premium-dashboard > :is(.dashboard-preview-state, .dashboard-access-state) { order: 2; }
html[data-ui-theme="workspace"] .frexima-premium-dashboard > .premium-dashboard-workspace { order: 3; }
html[data-ui-theme="workspace"] .frexima-premium-dashboard > .frexima-outcome-actions { order: 4; }
html[data-ui-theme="workspace"] .frexima-premium-dashboard > .bella-work-queue { order: 5; }
html[data-ui-theme="workspace"] .frexima-premium-dashboard > .dashboard-onboarding { order: 6; }
html[data-ui-theme="workspace"] .frexima-premium-dashboard > :is(.dashboard-toast, .modal) { order: 7; }

html[data-ui-theme="workspace"] .premium-dashboard-workspace > .premium-my-day { order: 1; }
html[data-ui-theme="workspace"] .premium-dashboard-workspace > .premium-priorities { order: 2; }
html[data-ui-theme="workspace"] .premium-dashboard-workspace > .premium-client-activity { order: 3; }
html[data-ui-theme="workspace"] .premium-dashboard-workspace > .premium-business-snapshot { order: 4; }
html[data-ui-theme="workspace"] .premium-dashboard-workspace > .premium-completed { order: 5; }

html[data-ui-theme="workspace"] .dashboard-invitation-sharing > summary {
    cursor: pointer;
    list-style: none;
}

html[data-ui-theme="workspace"] .dashboard-invitation-sharing > summary::-webkit-details-marker { display: none; }
html[data-ui-theme="workspace"] .dashboard-invitation-sharing > summary::after {
    content: "+";
    display: inline-grid;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    place-items: center;
    color: var(--workspace-action);
    border: 1px solid var(--workspace-line);
    border-radius: 50%;
    font-size: 1.2rem;
    font-weight: 700;
}

html[data-ui-theme="workspace"] .dashboard-invitation-sharing[open] > summary::after { content: "−"; }
html[data-ui-theme="workspace"] :is(.brand-main-content, .main-content, .auth-shell, .legal-page-container) {
    background: var(--workspace-page);
}

/* Semantic actions; success, warning and destructive actions keep their roles. */
html[data-ui-theme="workspace"] body .status-badge.primary {
    color: var(--workspace-action-strong) !important;
    background: var(--workspace-selected) !important;
    border-color: var(--workspace-line) !important;
}
html[data-ui-theme="workspace"] body .messages-search-input .form-control {
    color: var(--workspace-text);
    background: var(--workspace-surface);
    border-color: var(--workspace-control);
}
html[data-ui-theme="workspace"] body .messages-search-input i {
    color: var(--workspace-muted);
}
html[data-ui-theme="workspace"] body.route-messages-php :is(.salon-search-box, .message-recipient-search) {
    color: var(--workspace-text);
    background: var(--workspace-surface);
    border-color: var(--workspace-control);
}
html[data-ui-theme="workspace"] body .btn-primary {
    --bs-btn-disabled-bg: var(--workspace-action);
    --bs-btn-disabled-border-color: var(--workspace-action);
    color: #fff;
    background: var(--workspace-action) !important;
    border-color: var(--workspace-action) !important;
    box-shadow: none;
}
html[data-ui-theme="workspace"] body .btn-primary:is(:hover, :focus-visible, :active) {
    background: var(--workspace-action-hover) !important;
    border-color: var(--workspace-action-hover) !important;
}
html[data-ui-theme="workspace"] .btn-outline-primary {
    --bs-btn-color: var(--workspace-action-strong);
    --bs-btn-border-color: var(--workspace-action);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--workspace-action-hover);
    --bs-btn-hover-border-color: var(--workspace-action-hover);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--workspace-action-hover);
    --bs-btn-active-border-color: var(--workspace-action-hover);
}
html[data-ui-theme="workspace"] :is(.auth-card, .legal-content, .content-panel, .card, .modal-content) {
    border-color: var(--workspace-line);
    box-shadow: var(--workspace-shadow);
}
html[data-ui-theme="workspace"] :is(.sidebar, .sidebar-canvas, .brand-sidebar, .brand-sidebar-canvas) .brand-mark {
    background: transparent !important;
    filter: none !important;
}
html[data-ui-theme="workspace"] :is(.sidebar, .sidebar-canvas, .brand-sidebar, .brand-sidebar-canvas) .brand-mark::before,
html[data-ui-theme="workspace"] :is(.sidebar, .sidebar-canvas, .brand-sidebar, .brand-sidebar-canvas) .brand-mark::after,
html[data-ui-theme="workspace"] :is(.sidebar, .sidebar-canvas, .brand-sidebar, .brand-sidebar-canvas) .brand-mark > span {
    background: var(--workspace-action) !important;
    box-shadow: none !important;
}
html[data-ui-theme="workspace"] :is(.sidebar, .sidebar-canvas, .brand-sidebar, .brand-sidebar-canvas) .brand-wordmark strong {
    color: var(--workspace-text) !important;
}
html[data-ui-theme="workspace"] :is(.sidebar, .sidebar-canvas, .brand-sidebar, .brand-sidebar-canvas) .brand-wordmark small {
    color: var(--workspace-muted) !important;
}
html[data-ui-theme="workspace"] .locale-switcher-button { max-width: 100%; white-space: nowrap; }
html[data-ui-theme="workspace"] .locale-switcher-button [data-locale-current] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
html[data-ui-theme="workspace"] body :is(a, button, input, select, textarea, summary):focus-visible {
    outline: 3px solid var(--workspace-action-strong) !important;
    outline-offset: 3px;
}
html[data-ui-theme="workspace"] :is(.nav-pills .nav-link.active, .client-profile-tabs a.active, .client-profile-tabs button.active, .campaign-platform-tab.active, .fx-workspace-tabs a.active, .frexima-section-tabs a.active) {
    color: var(--workspace-action-strong);
    background: var(--workspace-selected);
    border-color: var(--workspace-action);
}
html[data-ui-theme="workspace"] .frexima-client-page { background: var(--workspace-page); }
html[data-ui-theme="workspace"] .frexima-client-page::before { background: none; }
html[data-ui-theme="workspace"] .quick-client-invite-page {
    --quick-purple: var(--workspace-action);
    --quick-purple-dark: var(--workspace-action-strong);
    --quick-ink: var(--workspace-text);
    --quick-muted: var(--workspace-muted);
    --quick-line: var(--workspace-line);
}

/* Client CRM controls share the same semantic selection treatment. */
html[data-ui-theme="workspace"] .frexima-client-page :is(
    .client-filter-open,
    .client-clear-filters,
    .client-filter-chip,
    .client-pagination a
) {
    color: var(--workspace-action-strong);
    background: var(--workspace-selected);
    border-color: var(--workspace-line);
}
html[data-ui-theme="workspace"] .frexima-client-page .client-filter-open span {
    color: #fff;
    background: var(--workspace-action);
}
html[data-ui-theme="workspace"] .frexima-client-page :is(
    .client-avatar,
    .client-vip-pill,
    .client-view-all,
    .client-contact-list a,
    .client-action-grid i,
    .client-card-heading a,
    .client-photo-strip :is(img, span, a),
    .client-activity-list article > span,
    .client-more-fields-toggle
) { color: var(--workspace-action-strong); }
html[data-ui-theme="workspace"] .frexima-client-page :is(.client-avatar, .client-vip-pill, .client-activity-list article > span) {
    background: var(--workspace-selected);
    border-color: var(--workspace-line);
}

html[data-ui-theme="workspace"] .brand-team-primary-sections {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 16px;
}

html[data-ui-theme="workspace"] .brand-team-primary-sections > .team-members-panel { order: 1; }
html[data-ui-theme="workspace"] .brand-team-primary-sections > .team-calendar-panel {
    order: 2;
    margin-bottom: 0 !important;
}

html[data-ui-theme="workspace"] details.forum-collapsible-info {
    display: block;
}

html[data-ui-theme="workspace"] details.forum-collapsible-info > summary {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    cursor: pointer;
    list-style: none;
}

html[data-ui-theme="workspace"] details.forum-collapsible-info > summary::-webkit-details-marker { display: none; }
html[data-ui-theme="workspace"] details.forum-collapsible-info > summary strong { display: block; }
html[data-ui-theme="workspace"] details.forum-collapsible-info > summary > .bi-chevron-down { transition: transform 160ms ease; }
html[data-ui-theme="workspace"] details.forum-collapsible-info[open] > summary > .bi-chevron-down { transform: rotate(180deg); }
html[data-ui-theme="workspace"] .forum-collapsible-info-body { padding-top: 12px; }
html[data-ui-theme="workspace"] .forum-collapsible-info-body > :last-child { margin-bottom: 0; }
html[data-ui-theme="workspace"] .forum-question-alert-actions a {
    align-items: center;
    display: inline-flex;
    min-height: 44px;
    padding: 0.35rem 0.25rem;
}

html[data-ui-theme="workspace"] .salon-community-stories-collapsible {
    display: block;
    padding: 0;
}

html[data-ui-theme="workspace"] .salon-community-stories-collapsible > summary {
    display: grid;
    min-height: 52px;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    cursor: pointer;
    list-style: none;
}

html[data-ui-theme="workspace"] .salon-community-stories-collapsible > summary::-webkit-details-marker { display: none; }
html[data-ui-theme="workspace"] .salon-community-stories-collapsible > summary > span { font-weight: 850; }
html[data-ui-theme="workspace"] .salon-community-stories-collapsible > summary > small { color: var(--workspace-muted); }
html[data-ui-theme="workspace"] .salon-community-stories-collapsible > summary > .bi-chevron-down { transition: transform 160ms ease; }
html[data-ui-theme="workspace"] .salon-community-stories-collapsible[open] > summary > .bi-chevron-down { transform: rotate(180deg); }
html[data-ui-theme="workspace"] .salon-community-stories-collapsible > .cw-story-rail-heading { display: none; }
html[data-ui-theme="workspace"] .salon-community-stories-collapsible > .cw-story-scroller { padding: 4px 14px 14px; }
html[data-ui-theme="workspace"] .frexima-client-page .client-hero-avatar {
    color: #fff;
    background: linear-gradient(135deg, #C98291, var(--workspace-action));
}
html[data-ui-theme="workspace"] .frexima-client-page .client-floating-save {
    background: var(--workspace-action);
    box-shadow: 0 12px 24px rgb(164 95 87 / 22%);
}

/* Server validation must remain actionable even for the other invite channel. */
html[data-ui-theme="workspace"] .quick-client-form .quick-input-shell {
    grid-template-columns: 20px minmax(0, 1fr);
}
html[data-ui-theme="workspace"] .quick-client-invite-page :is([data-quick-email-field], [data-quick-phone-field]):has([aria-invalid="true"]) {
    display: grid;
}
html[data-ui-theme="workspace"] .quick-input-shell:has([aria-invalid="true"]) {
    border-color: var(--fx-danger-action);
}
html[data-ui-theme="workspace"] .quick-client-form .invalid-feedback {
    color: var(--fx-danger-action);
}
html[data-ui-theme="workspace"] :is(.task-workspace, .media-library-layout) :is(input, select, textarea)[aria-invalid="true"] {
    border-color: var(--fx-danger-action);
}
html[data-ui-theme="workspace"] :is(.task-workspace, .media-library-layout) .invalid-feedback {
    color: var(--fx-danger-action);
}
html[data-ui-theme="workspace"] .media-library-layout [data-user-content] {
    overflow-wrap: anywhere;
}
html[data-ui-theme="workspace"] :is(.task-workspace .task-page-tabs .nav-link.active, .media-library-layout .media-folder-link.active) {
    color: var(--workspace-action-strong);
    background: var(--workspace-selected) !important;
    border-color: var(--workspace-action) !important;
    box-shadow: none;
}

/* Fixed controls share one measured bottom offset. Keep the two entry points
   in separate corners instead of accumulating page-specific offsets. */
html[data-ui-theme="workspace"] body :is(.brand-module-guide-floating, .client-guide-floating-launcher) {
    bottom: var(--workspace-floating-bottom);
    inset-inline-end: max(16px, env(safe-area-inset-right));
    max-width: calc(100vw - 90px);
}
html[data-ui-theme="workspace"] body .frexima-back-to-top {
    bottom: var(--workspace-floating-bottom);
    inset-inline-start: max(16px, env(safe-area-inset-left));
    inset-inline-end: auto;
}
@media (max-width: 991.98px) {
    html[data-ui-theme="workspace"] body:has(.frexima-mobile-nav, .client-bottom-nav) {
        --workspace-floating-bottom: calc(90px + env(safe-area-inset-bottom));
    }
    html[data-ui-theme="workspace"] body[data-workspace-keyboard="open"] :is(.frexima-mobile-nav, .client-bottom-nav, .brand-module-guide-floating, .client-guide-floating-launcher, .frexima-back-to-top) {
        visibility: hidden;
        pointer-events: none;
    }
    html[data-ui-theme="workspace"] :is(.form-control, .form-select) { font-size: 16px; }
}