/* Cliniform ? Backoffice (matches marketing design system) */

:root {
    --color-primary: #2D6A6A;
    --color-primary-dark: #1F4F4F;
    --color-primary-light: #3D8A8A;
    --color-accent: #E8A87C;
    --color-bg: #FAFAF8;
    --color-bg-alt: #F0F4F3;
    --color-surface: #FFFFFF;
    --color-text: #1A2B2B;
    --color-text-muted: #5C7171;
    --color-text-light: #8A9E9E;
    --color-border: #E2EAEA;
    --color-success: #3D8B6E;
    --color-danger: #C45C5C;
    --color-ai: #6B5B95;
    --font-sans: 'DM Sans', system-ui, sans-serif;
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --shadow-sm: 0 1px 3px rgba(26, 43, 43, 0.06);
    --shadow-md: 0 4px 20px rgba(26, 43, 43, 0.08);
    --shadow-lg: 0 12px 40px rgba(26, 43, 43, 0.12);
    --transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --sidebar-width: 240px;
}

*, *::before, *::after { box-sizing: border-box; }

.bo-body {
    margin: 0;
    font-family: var(--font-sans);
    font-size: 15px;
    line-height: 1.6;
    color: var(--color-text);
    background: var(--color-bg);
    -webkit-font-smoothing: antialiased;
}

.bo-app {
    display: flex;
    min-height: 100vh;
}

/* Sidebar */
.bo-sidebar {
    width: var(--sidebar-width);
    flex-shrink: 0;
    background: var(--color-surface);
    border-right: 1px solid var(--color-border);
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 100;
}

.bo-sidebar-brand {
    padding: 20px 20px 16px;
    border-bottom: 1px solid var(--color-border);
}

.bo-sidebar-brand-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.bo-sidebar-collapse {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: var(--color-bg-alt, #f8fafc);
    color: var(--color-text-muted);
    cursor: pointer;
    flex-shrink: 0;
}

.bo-sidebar-collapse:hover {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.bo-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 18px;
    font-weight: 700;
    color: var(--color-primary);
    text-decoration: none;
}

.bo-logo svg { flex-shrink: 0; color: var(--color-primary); }

.bo-org-name {
    margin-top: 12px;
    font-size: 12px;
    font-weight: 600;
    color: var(--color-text-muted);
    line-height: 1.4;
    word-break: break-word;
}

.bo-org-plan {
    margin-top: 4px;
    font-size: 11px;
    font-weight: 600;
    color: var(--color-primary);
}

.bo-nav {
    flex: 1;
    padding: 16px 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow-y: auto;
}

.bo-nav-label {
    padding: 8px 10px 4px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-light);
}

.bo-nav-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: all var(--transition);
}

.bo-nav-item svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    opacity: 0.7;
}

.bo-nav-item:hover {
    background: var(--color-bg-alt);
    color: var(--color-primary);
}

.bo-nav-item.active {
    background: rgba(45, 106, 106, 0.1);
    color: var(--color-primary);
    font-weight: 600;
}

.bo-nav-item.active svg { opacity: 1; }

.bo-nav-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: var(--color-danger);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    margin-left: auto;
    line-height: 1;
}

.bo-nav-group {
    display: flex;
    flex-direction: column;
}

.bo-nav-toggle {
    cursor: pointer;
    border: none;
    background: none;
    font-family: inherit;
    font-size: inherit;
    text-align: left;
    width: 100%;
}

.bo-nav-chevron {
    width: 14px;
    height: 14px;
    margin-left: auto;
    opacity: 0.5;
    transition: transform var(--transition);
    flex-shrink: 0;
}

.bo-nav-chevron-open {
    transform: rotate(180deg);
}

.bo-nav-submenu {
    padding: 2px 0 4px 28px;
}

.bo-nav-subitem {
    display: block;
    padding: 6px 12px;
    font-size: 13px;
    color: var(--color-text-muted);
    border-radius: var(--radius-sm);
    transition: all var(--transition);
    text-decoration: none;
}

.bo-nav-subitem:hover {
    color: var(--color-primary);
    background: var(--color-bg-alt);
}

.bo-nav-subitem.active {
    color: var(--color-primary);
    font-weight: 600;
    background: rgba(45, 106, 106, 0.08);
}

.bo-sidebar-footer {
    padding: 16px 12px;
    border-top: 1px solid var(--color-border);
}

.bo-user {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: var(--radius-sm);
}

.bo-user-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--color-primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    flex-shrink: 0;
    overflow: hidden;
}

.bo-user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.bo-user-avatar--lg {
    width: 72px;
    height: 72px;
    font-size: 28px;
}

.bo-profile-photo-row {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 8px;
}

.bo-profile-photo-fields {
    flex: 1;
    min-width: 0;
}

.bo-link-btn {
    background: none;
    border: none;
    padding: 0;
    color: var(--color-primary);
    text-decoration: underline;
    cursor: pointer;
    font: inherit;
}

.bo-user-info { min-width: 0; flex: 1; }

.bo-user-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bo-user-email {
    font-size: 11px;
    color: var(--color-text-light);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bo-user-menu {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 8px;
}

.bo-user-menu a,
.bo-user-menu button {
    display: block;
    width: 100%;
    text-align: left;
    padding: 8px 10px;
    font-size: 13px;
    color: var(--color-text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    background: none;
    border: none;
    font-family: inherit;
    cursor: pointer;
    transition: all var(--transition);
}

.bo-user-menu a:hover,
.bo-user-menu button:hover {
    background: var(--color-bg-alt);
    color: var(--color-primary);
}

/* Main area */
.bo-main {
    flex: 1;
    margin-left: var(--sidebar-width);
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.bo-page-header {
    padding: 28px 32px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    overflow: visible;
}

.bo-page-header-main {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.bo-page-header-avatar {
    flex-shrink: 0;
}

.bo-user-avatar--header {
    width: 56px;
    height: 56px;
    font-size: 22px;
}

.bo-page-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-text);
    margin: 0;
    line-height: 1.3;
}

.bo-page-title .bo-heading-with-icon {
    gap: 12px;
}

.bo-page-subtitle {
    margin: 4px 0 0;
    font-size: 14px;
    color: var(--color-text-muted);
}

.bo-page-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    max-width: 100%;
}

.bo-page-actions .bo-btn {
    white-space: nowrap;
}

.bo-page-actions a {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-primary);
    text-decoration: none;
}

.bo-page-actions a.bo-btn {
    text-decoration: none;
}

.bo-page-actions a.bo-btn-outline {
    color: var(--color-text);
}

.bo-page-actions a.bo-btn-primary {
    color: #fff;
}

.bo-page-actions a.bo-btn-outline {
    color: var(--color-text);
}

.bo-page-actions a.bo-btn:hover { text-decoration: none; }

.bo-page-actions a:hover { text-decoration: underline; }

.bo-notify {
    position: relative;
}

.bo-notify-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 999px;
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    cursor: pointer;
    font-size: 16px;
    box-shadow: var(--shadow-sm);
}

.bo-notify-button:hover {
    border-color: rgba(45, 106, 106, 0.35);
}

.bo-notify-count {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: #dc2626;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}

.bo-notify-panel {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    width: min(360px, calc(100vw - 32px));
    max-height: 420px;
    overflow: auto;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    z-index: 40;
    padding: 12px;
}

.bo-notify-panel-header {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-muted);
    margin-bottom: 8px;
}

.bo-notify-empty {
    margin: 0;
    font-size: 13px;
    color: var(--color-text-muted);
}

.bo-notify-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 4px;
}

.bo-notify-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px;
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
}

.bo-notify-item:hover {
    background: rgba(45, 106, 106, 0.06);
    text-decoration: none;
}

.bo-notify-item-title {
    font-size: 13px;
    font-weight: 600;
}

.bo-notify-item-meta {
    font-size: 12px;
    color: var(--color-text-muted);
}

.bo-link-danger {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    font-size: inherit;
    font-weight: 500;
    color: var(--color-danger, #c0392b);
    cursor: pointer;
    text-decoration: none;
}

.bo-link-danger:hover {
    text-decoration: underline;
}

.bo-link-primary {
    background: none;
    border: none;
    padding: 0;
    font-size: inherit;
    font-family: inherit;
    color: var(--color-primary);
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
}

.bo-link-primary:hover {
    text-decoration: underline;
}

.bo-content {
    padding: 24px 32px 40px;
    flex: 1;
}

.bo-container { max-width: 1100px; }
.bo-container-narrow { max-width: 720px; }
.bo-container-wide { max-width: 1280px; }
.bo-container-full { max-width: none; width: 100%; }

/* Mobile / sidebar toggle */
.bo-mobile-toggle,
.bo-sidebar-toggle {
    display: none;
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: 200;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--color-text-muted);
}

.bo-sidebar-toggle:hover {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

/* Desktop collapsed sidebar */
@media (min-width: 901px) {
    .bo-body.bo-sidebar-collapsed .bo-sidebar {
        transform: translateX(-100%);
        pointer-events: none;
    }

    .bo-body.bo-sidebar-collapsed .bo-main {
        margin-left: 0;
    }

    .bo-body.bo-sidebar-collapsed .bo-sidebar-toggle {
        display: flex;
    }

    .bo-body.bo-sidebar-collapsed .bo-page-header {
        padding-left: 64px;
    }

    .bo-sidebar {
        transition: transform var(--transition);
    }

    .bo-main {
        transition: margin-left var(--transition);
    }
}

.bo-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(26, 43, 43, 0.4);
    z-index: 90;
}

/* Cards & panels (dashboard-mockup style) */
.bo-card {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    padding: 24px;
    box-shadow: var(--shadow-md);
    border: 1px solid var(--color-border);
}

.bo-card + .bo-card,
.bo-stack > * + * { margin-top: 20px; }

.bo-card-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 20px;
}

.bo-card-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--color-text);
    margin: 0;
}

.bo-card-subtitle {
    font-size: 13px;
    color: var(--color-text-muted);
    margin: 4px 0 0;
}

.bo-section-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--color-primary);
    margin: 0 0 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--color-border);
}

/* Stats */
.bo-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.bo-stat {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    padding: 20px 24px;
    box-shadow: var(--shadow-md);
    border: 1px solid var(--color-border);
}

.bo-stat-label {
    font-size: 13px;
    color: var(--color-text-muted);
    margin-bottom: 4px;
}

.bo-heading-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.bo-heading-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(45, 106, 106, 0.1);
    color: var(--color-primary);
}

.bo-heading-icon svg {
    width: 18px;
    height: 18px;
    display: block;
}

.bo-stat-label.bo-heading-with-icon {
    margin-bottom: 8px;
}

.bo-stat-label.bo-heading-with-icon .bo-heading-icon {
    width: 28px;
    height: 28px;
    border-radius: 7px;
}

.bo-stat-label.bo-heading-with-icon .bo-heading-icon svg {
    width: 16px;
    height: 16px;
}

.bo-heading-icon-plain {
    width: auto;
    height: auto;
    background: transparent;
    border-radius: 0;
    color: currentColor;
}

.bo-heading-icon-plain svg {
    width: 18px;
    height: 18px;
}

.bo-btn-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.bo-settings-card h3.bo-heading-with-icon {
    margin: 0 0 6px;
}

.bo-stat-value {
    font-size: 32px;
    font-weight: 700;
    color: var(--color-primary);
    line-height: 1.2;
}

.bo-stat-link {
    text-decoration: none;
    color: inherit;
    transition: box-shadow var(--transition), transform var(--transition);
    cursor: pointer;
}

.bo-stat-link:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-2px);
}

.bo-stat-link:hover .bo-stat-value {
    color: var(--color-primary-dark);
}

/* Dashboard rows (from marketing mockup) */
.bo-dash-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 12px 0;
    border-bottom: 1px solid var(--color-border);
    font-size: 14px;
    gap: 16px;
}

.bo-dash-row:last-child { border-bottom: none; }

.bo-dash-row dt,
.bo-dash-row span:first-child { color: var(--color-text-muted); margin: 0; }

.bo-dash-row dd,
.bo-dash-row span:last-child { font-weight: 600; text-align: right; margin: 0; }

/* Alerts */
.bo-alert {
    padding: 12px 16px;
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 16px;
}

.bo-alert-warning {
    background: #FEF3E8;
    border: 1px solid #F5D5B8;
    color: #8B5E3C;
}

.bo-alert-success {
    background: #EDF7F2;
    border: 1px solid #B8DFC9;
    color: #2D6A4A;
}

.bo-alert-danger {
    background: #FDF0F0;
    border: 1px solid #E8B8B8;
    color: #8B3C3C;
}

.bo-alert-info {
    background: rgba(45, 106, 106, 0.08);
    border: 1px solid rgba(45, 106, 106, 0.2);
    color: var(--color-primary-dark);
}

.bo-trial-banner {
    background: linear-gradient(90deg, #2D6A6A 0%, #3d8585 100%);
    color: #fff;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    padding: 10px 16px;
}

.bo-trial-banner a {
    color: inherit;
    text-decoration: none;
    display: block;
}

.bo-trial-banner a:hover {
    text-decoration: underline;
}

.bo-trial-banner--urgent {
    background: linear-gradient(90deg, #8B5E3C 0%, #B87333 100%);
}

.bo-trial-banner--final {
    background: linear-gradient(90deg, #8B3C3C 0%, #C44 100%);
    animation: bo-trial-pulse 2s ease-in-out infinite;
}

@keyframes bo-trial-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.92; }
}

/* AI summary block */
.bo-ai {
    margin-top: 16px;
    padding: 16px;
    background: linear-gradient(135deg, #F3F0FA 0%, #EDE8F5 100%);
    border-radius: var(--radius-md);
    border: 1px solid #D8D0E8;
}

.bo-ai strong {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-ai);
    margin-bottom: 8px;
}

.bo-ai p {
    font-size: 13px;
    color: #4A3F6B;
    line-height: 1.6;
    margin: 0;
}

.bo-ai-panel {
    background: var(--color-surface);
    border: 1px solid #D8D0E8;
    border-radius: var(--radius-md);
    padding: 20px;
    box-shadow: var(--shadow-sm);
}

.bo-ai-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px;
}

.bo-ai-panel-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-ai);
    font-weight: 600;
}

.bo-ai-panel-title {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 4px 0 0;
}

.bo-ai-panel-timestamp {
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-muted);
    margin-left: 12px;
}

.bo-ai-risk {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 16px;
}

.bo-ai-risk-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.bo-ai-risk-green {
    background: rgba(61, 139, 110, 0.12);
    color: #2D6B52;
}

.bo-ai-risk-green .bo-ai-risk-dot {
    background: #3D8B6E;
}

.bo-ai-risk-amber {
    background: rgba(212, 137, 106, 0.15);
    color: #8B5A2B;
}

.bo-ai-risk-amber .bo-ai-risk-dot {
    background: #D4896A;
}

.bo-ai-risk-red {
    background: rgba(196, 92, 92, 0.12);
    color: #8B3030;
}

.bo-ai-risk-red .bo-ai-risk-dot {
    background: #C45C5C;
}

.bo-ai-section {
    margin-top: 16px;
}

.bo-ai-section h3 {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-ai);
    margin-bottom: 8px;
}

.bo-ai-section ul {
    margin: 0;
    padding-left: 18px;
    font-size: 13px;
    color: #4A3F6B;
    line-height: 1.6;
}

.bo-ai-section li + li {
    margin-top: 4px;
}

.bo-ai-disclaimer {
    margin: 16px 0 0;
    font-size: 12px;
    color: var(--color-text-light);
    line-height: 1.5;
}

.bo-ai-meta {
    display: block;
    margin-top: 4px;
}

.bo-ai-pending {
    margin-top: 0;
}

.bo-ai-pending code {
    font-size: 12px;
    background: rgba(107, 91, 149, 0.1);
    padding: 2px 6px;
    border-radius: 4px;
}

/* Treatment notes */
.bo-note {
    padding: 16px;
    background: var(--color-bg);
    border-radius: var(--radius-md);
    margin-bottom: 12px;
}

.bo-note-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 8px;
}

.bo-note-attachments {
    margin-top: 16px;
}

.bo-note-attachments .bo-label {
    margin-bottom: 8px;
}

.bo-note-date {
    font-size: 12px;
    font-weight: 600;
    color: var(--color-text-muted);
    margin-bottom: 8px;
}

.bo-note p {
    font-size: 14px;
    margin: 0;
    white-space: pre-wrap;
}

/* Buttons */
.bo-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    border-radius: var(--radius-sm);
    border: none;
    cursor: pointer;
    text-decoration: none;
    transition: all var(--transition);
    white-space: nowrap;
}

.bo-btn-primary {
    background: var(--color-primary);
    color: #fff;
}

.bo-btn-primary:hover {
    background: var(--color-primary-dark);
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.bo-btn-outline {
    background: var(--color-surface);
    color: var(--color-text);
    border: 2px solid var(--color-border);
}

.bo-btn-outline:not(.bo-btn-danger):hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.bo-btn-outline.bo-btn-danger {
    color: #dc2626;
    border-color: #fecaca;
    background: var(--color-surface);
}

.bo-btn-outline.bo-btn-danger:hover {
    color: #b91c1c;
    border-color: #fca5a5;
    background: #fef2f2;
}

.bo-btn-ghost {
    background: transparent;
    color: var(--color-text-muted);
    padding: 10px 14px;
}

.bo-btn-ghost:hover { color: var(--color-primary); }

.bo-btn-danger:not(.bo-btn-outline) {
    background: var(--color-danger);
    color: #fff;
}

.bo-btn-warning {
    background: #D4896A;
    color: #fff;
}

.bo-btn-sm { padding: 7px 14px; font-size: 13px; }

.bo-btn-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.bo-table-actions-cell {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
}

.bo-table-actions {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
}

.bo-table-actions-divider {
    color: var(--color-border);
}

.bo-pagination {
    padding: 16px 24px;
    border-top: 1px solid var(--color-border);
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}

.bo-pagination-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.bo-table-access-cell {
    max-width: 220px;
    vertical-align: middle;
}

.bo-table-access-summary {
    display: block;
    width: 100%;
    padding: 0;
    border: none;
    background: none;
    text-align: left;
    font-size: 12px;
    line-height: 1.45;
    color: var(--color-text-muted);
    border-bottom: 1px dotted var(--color-border);
    cursor: pointer;
}

.bo-table-access-summary:hover,
.bo-table-access-summary:focus-visible {
    color: var(--color-text);
    border-bottom-color: var(--color-primary);
    outline: none;
}

.bo-table-wrap-access {
    overflow-x: auto;
}

.bo-access-tooltip {
    display: inline-block;
    max-width: 100%;
}

.bo-access-popover {
    padding: 10px 12px;
    background: var(--color-text);
    color: #fff;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    overflow-y: auto;
    overscroll-behavior: contain;
}

.bo-access-tooltip-title {
    display: block;
    margin-bottom: 6px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.72);
}

.bo-access-tooltip-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 4px;
}

.bo-access-tooltip-list li {
    font-size: 13px;
    line-height: 1.35;
    color: #fff;
}

.bo-access-tooltip-list li::before {
    content: '?';
    margin-right: 6px;
    color: rgba(255, 255, 255, 0.55);
}

/* Tabs */
.bo-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 0;
}

.bo-tab {
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 600;
    border-radius: var(--radius-sm);
    text-decoration: none;
    color: var(--color-text-muted);
    background: var(--color-bg-alt);
    transition: all var(--transition);
}

.bo-submission-tabs-nav {
    padding: 16px 20px;
    margin-bottom: 20px;
}

.bo-submission-tabs-nav .bo-tabs {
    gap: 10px;
}

.bo-submission-tabs-nav .bo-tab {
    cursor: pointer;
    border: none;
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.bo-submission-tab-panel {
    display: block;
}

.bo-signature-image {
    display: block;
    width: 100%;
    max-width: 400px;
    min-height: 80px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: #fff;
}

.bo-body-diagram {
    margin-top: 8px;
}

.body-diagram .cf-body-map,
.bo-body-diagram .cf-body-map,
.bo-form-preview .cf-body-map,
.cf-body-map {
    margin: 0;
    width: 100%;
    max-width: 100%;
    overflow: visible;
    container-type: inline-size;
    container-name: body-map;
}

.body-diagram .cf-body-map-row,
.bo-body-diagram .cf-body-map-row,
.bo-form-preview .cf-body-map-row,
.cf-body-map-row {
    --cf-body-aspect-sum: 1.2138;
    --cf-body-figure-h: min(400px, 52vw);
    --cf-body-figure-h: min(400px, calc(100cqi / var(--cf-body-aspect-sum) * 0.98));
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-evenly;
    align-items: flex-end;
    gap: 0.35rem;
    width: 100%;
    max-width: 100%;
    padding: 8px 0 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-sizing: border-box;
}

.body-diagram .cf-body-map-panel,
.bo-body-diagram .cf-body-map-panel,
.bo-form-preview .cf-body-map-panel,
.cf-body-map-panel {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 0 0 auto;
    width: calc(var(--cf-body-figure-h) * var(--cf-body-view-ratio, 0.433));
    min-width: 0;
    background: transparent;
}

.cf-body-map-panel[data-view="front"] { --cf-body-view-ratio: 0.4330; }
.cf-body-map-panel[data-view="back"] { --cf-body-view-ratio: 0.3915; }
.cf-body-map-panel[data-view="left"],
.cf-body-map-panel[data-view="right"] { --cf-body-view-ratio: 0.1947; }

.cf-body-map-panel-label {
    display: block;
    width: 100%;
    margin-bottom: 6px;
    font-size: 11px;
    font-weight: 700;
    color: var(--color-text);
    text-align: center;
}

.body-diagram .cf-body-map-stage,
.bo-body-diagram .cf-body-map-stage,
.bo-form-preview .cf-body-map-stage,
.cf-body-map-stage {
    position: relative;
    width: 100%;
    height: var(--cf-body-figure-h);
    margin-inline: auto;
    overflow: visible;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    line-height: 0;
    background: transparent;
}

.body-diagram .cf-body-map-figure,
.bo-body-diagram .cf-body-map-figure,
.bo-form-preview .cf-body-map-figure,
.cf-body-map-figure {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center bottom;
    background: transparent !important;
}

.bo-body-diagram .cf-body-map-practitioner-bar,
.bo-body-diagram .cf-body-map-popover,
.bo-body-diagram .cf-body-map-legend-remove {
    display: none !important;
}

.bo-form-preview .cf-body-map-intro,
.bo-form-preview .cf-body-map-guidance,
.bo-form-preview .cf-body-map-legend {
    display: none;
}

.bo-form-preview .cf-body-map-question {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
}

.bo-form-preview .cf-body-map-figure-choice {
    margin: 0 0 0.75rem;
    padding: 0.85rem 0.95rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: #f8fafc;
}

.bo-form-preview .cf-body-map-figure-choice-title {
    margin: 0 0 0.65rem;
    font-size: 13px;
    font-weight: 700;
    color: var(--color-text);
}

.bo-form-preview .cf-body-map-figure-choice-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.bo-form-preview .cf-body-map-figure-btn.is-preview-static {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 7.5rem;
    padding: 0.45rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: #fff;
    color: var(--color-text);
    font-size: 12px;
    font-weight: 600;
    cursor: default;
    pointer-events: none;
}

.bo-form-preview .cf-body-map-figure-choice-note {
    margin: 0.65rem 0 0;
    font-size: 11px;
    line-height: 1.4;
    color: var(--color-text-muted, #64748b);
}

.bo-treatment-note-add-form-separated {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--color-border);
}

.bo-tab:hover { color: var(--color-primary); }

.bo-tab.active {
    background: var(--color-primary);
    color: #fff;
}

.bo-tab-alert {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 16px;
    height: 16px;
    margin-left: 6px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--color-danger);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
}

.bo-tab-locked {
    opacity: 0.72;
}

/* Table */
.bo-table-wrap {
    overflow-x: auto;
    margin: 0 -24px;
    padding: 0 24px;
}

.bo-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.bo-table th {
    text-align: left;
    padding: 12px 16px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-text-light);
    background: var(--color-bg);
    border-bottom: 1px solid var(--color-border);
}

.bo-table td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--color-border);
}

.bo-table tbody tr:hover { background: var(--color-bg); }

.bo-table a {
    color: var(--color-primary);
    font-weight: 600;
    text-decoration: none;
}

.bo-table a:hover { text-decoration: underline; }

.bo-table .bo-link-button {
    display: inline;
    padding: 0;
    border: 0;
    background: none;
    color: var(--color-primary);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.bo-table .bo-link-button:hover { text-decoration: underline; }

.bo-table a.bo-btn,
.bo-table a.bo-btn:hover,
.bo-table a.bo-btn:focus {
    text-decoration: none;
}

.bo-table a.bo-btn-primary,
.bo-table a.bo-btn-primary:hover,
.bo-table a.bo-btn-primary:focus {
    color: #fff;
    text-decoration: none;
}

.bo-table-sort-row th {
    vertical-align: bottom;
}

.bo-table-sort {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    cursor: pointer;
    text-decoration: none;
}

.bo-table-sort:hover,
.bo-table-sort.is-active {
    color: var(--color-primary);
}

.bo-table-sort-icon {
    display: inline-flex;
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

.bo-table-sort-icon svg {
    width: 12px;
    height: 12px;
}

.bo-empty {
    text-align: center;
    padding: 48px 24px;
    color: var(--color-text-muted);
}

/* Form elements */
.bo-form-group { margin-bottom: 20px; }

.bo-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-muted);
    margin-bottom: 6px;
}

.bo-radio-group {
    display: flex;
    gap: 20px;
    margin-top: 8px;
}

.bo-radio-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    cursor: pointer;
}

.bo-radio-label input[type="radio"] {
    accent-color: var(--color-primary);
    width: 16px;
    height: 16px;
}

.bo-input,
.bo-select,
.bo-textarea {
    display: block;
    width: 100%;
    padding: 10px 12px;
    font-size: 14px;
    font-family: inherit;
    color: var(--color-text);
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    transition: border-color var(--transition);
}

.bo-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: 36px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%2364748b' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 16px 16px;
    cursor: pointer;
}

.bo-input:focus,
.bo-select:focus,
.bo-textarea:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(45, 106, 106, 0.12);
}

.bo-select-compact {
    width: auto;
    min-width: 132px;
    padding: 6px 36px 6px 10px;
    font-size: 13px;
}

.bo-select:disabled {
    opacity: 1;
    color: var(--color-text);
    background-color: var(--color-surface-muted, #f4f6f8);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%2394a3b8' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    cursor: default;
}

.bo-form-group-date {
    max-width: 320px;
}

.bo-date-field {
    position: relative;
    display: flex;
    align-items: center;
}

.bo-date-field-icon {
    position: absolute;
    left: 12px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    color: var(--color-primary);
    pointer-events: none;
}

.bo-date-field-icon svg {
    display: block;
    width: 18px;
    height: 18px;
}

.bo-date-input {
    width: 100%;
    min-height: 42px;
    padding: 10px 40px 10px 42px;
    font-variant-numeric: tabular-nums;
    color-scheme: light;
    cursor: pointer;
}

.bo-date-input:hover {
    border-color: rgba(45, 106, 106, 0.35);
}

.bo-date-input::-webkit-calendar-picker-indicator {
    position: absolute;
    right: 10px;
    width: 18px;
    height: 18px;
    padding: 0;
    margin: 0;
    cursor: pointer;
    opacity: 0.72;
    filter: invert(32%) sepia(18%) saturate(1048%) hue-rotate(131deg) brightness(92%) contrast(89%);
}

.bo-date-input:hover::-webkit-calendar-picker-indicator,
.bo-date-input:focus::-webkit-calendar-picker-indicator {
    opacity: 1;
}

.bo-date-input::-webkit-datetime-edit {
    padding: 0;
}

.bo-date-input::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
}

.bo-date-input::-webkit-datetime-edit-text {
    color: var(--color-text-light);
    padding: 0 2px;
}

.bo-date-input::-webkit-datetime-edit-month-field,
.bo-date-input::-webkit-datetime-edit-day-field,
.bo-date-input::-webkit-datetime-edit-year-field {
    color: var(--color-text);
    padding: 0 2px;
}

.bo-date-input:focus::-webkit-datetime-edit-month-field,
.bo-date-input:focus::-webkit-datetime-edit-day-field,
.bo-date-input:focus::-webkit-datetime-edit-year-field {
    background: rgba(45, 106, 106, 0.08);
    border-radius: 4px;
    outline: none;
}

.bo-date-field > input.flatpickr-input[name] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    padding: 0;
    border: 0;
    pointer-events: none;
}

.bo-flatpickr-calendar.flatpickr-calendar {
    width: 307.875px;
    font-family: var(--font-sans);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--color-border);
    overflow: hidden;
    background: var(--color-surface);
    box-sizing: border-box;
}

.bo-flatpickr-calendar .flatpickr-innerContainer,
.bo-flatpickr-calendar .flatpickr-rContainer {
    width: 100%;
}

.bo-flatpickr-calendar .flatpickr-months {
    background: var(--color-primary);
    padding: 10px 8px;
    height: auto;
    min-height: 54px;
    box-sizing: border-box;
}

.bo-flatpickr-calendar .flatpickr-months .flatpickr-month {
    height: 34px;
    color: #fff;
}

.bo-flatpickr-calendar .flatpickr-current-month {
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    padding-top: 0;
}

.bo-flatpickr-calendar .flatpickr-current-month .flatpickr-monthDropdown-months,
.bo-flatpickr-calendar .flatpickr-current-month input.cur-year {
    color: #fff;
    font-weight: 600;
    background-color: var(--color-primary);
    border: 0;
    color-scheme: light;
}

.bo-flatpickr-calendar .flatpickr-monthDropdown-months option,
.bo-flatpickr-calendar .flatpickr-monthDropdown-month {
    color: var(--color-text) !important;
    background-color: var(--color-surface) !important;
}

.bo-flatpickr-calendar .flatpickr-monthDropdown-months option:checked,
.bo-flatpickr-calendar .flatpickr-monthDropdown-months option:hover,
.bo-flatpickr-calendar .flatpickr-monthDropdown-months option:focus {
    color: #fff !important;
    background-color: var(--color-primary) !important;
}

.bo-flatpickr-calendar .flatpickr-current-month .flatpickr-monthDropdown-months:hover,
.bo-flatpickr-calendar .flatpickr-current-month input.cur-year:hover {
    background: rgba(255, 255, 255, 0.12);
}

.bo-flatpickr-calendar .flatpickr-prev-month,
.bo-flatpickr-calendar .flatpickr-next-month {
    top: 12px;
    color: #fff;
    fill: #fff;
}

.bo-flatpickr-calendar .flatpickr-prev-month:hover,
.bo-flatpickr-calendar .flatpickr-next-month:hover {
    background: rgba(255, 255, 255, 0.16);
    border-radius: var(--radius-sm);
}

.bo-flatpickr-calendar .flatpickr-weekdays {
    background: var(--color-bg-alt);
    padding: 8px 0 4px;
    width: 100%;
}

.bo-flatpickr-calendar .flatpickr-weekday {
    color: var(--color-text-muted);
    font-weight: 600;
    font-size: 12px;
}

.bo-flatpickr-calendar .flatpickr-days {
    width: 100%;
    padding: 4px 0 8px;
}

.bo-flatpickr-calendar .dayContainer {
    width: 100%;
    min-width: 0;
}

.bo-flatpickr-calendar .flatpickr-day {
    color: var(--color-text);
    border-radius: var(--radius-sm);
    font-weight: 500;
    border: 1px solid transparent;
}

.bo-flatpickr-calendar .flatpickr-day:hover,
.bo-flatpickr-calendar .flatpickr-day:focus {
    background: rgba(45, 106, 106, 0.1);
    border-color: transparent;
}

.bo-flatpickr-calendar .flatpickr-day.selected,
.bo-flatpickr-calendar .flatpickr-day.startRange,
.bo-flatpickr-calendar .flatpickr-day.endRange {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
}

.bo-flatpickr-calendar .flatpickr-day.today {
    border-color: var(--color-primary-light);
}

.bo-flatpickr-calendar .flatpickr-day.today:hover,
.bo-flatpickr-calendar .flatpickr-day.today:focus {
    background: rgba(45, 106, 106, 0.12);
    color: var(--color-text);
}

.bo-flatpickr-calendar .flatpickr-day.selected.today {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
}

.bo-flatpickr-calendar .flatpickr-day.prevMonthDay,
.bo-flatpickr-calendar .flatpickr-day.nextMonthDay {
    color: var(--color-text-light);
}

.bo-flatpickr-calendar .flatpickr-day.flatpickr-disabled,
.bo-flatpickr-calendar .flatpickr-day.flatpickr-disabled:hover {
    color: #c5d0d0;
    background: transparent;
    cursor: not-allowed;
}

.bo-flatpickr-footer {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-top: 1px solid var(--color-border);
    background: var(--color-bg);
}

.bo-flatpickr-footer-btn {
    border: 0;
    background: transparent;
    color: var(--color-primary);
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    padding: 4px 6px;
}

.bo-flatpickr-footer-btn:hover {
    color: var(--color-primary-dark);
    text-decoration: underline;
}

.bo-inline-role-form {
    display: inline-block;
}

.bo-password-field {
    position: relative;
}

.bo-password-field .bo-input {
    width: 100%;
    padding-right: 44px;
}

.bo-password-toggle {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: none;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--color-text-muted);
    cursor: pointer;
}

.bo-password-toggle:hover {
    color: var(--color-primary);
    background: var(--color-bg-alt);
}

.bo-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.bo-label-row .bo-label {
    margin-bottom: 0;
}

.bo-input[type="color"] {
    padding: 4px;
    height: 48px;
    min-height: 48px;
    cursor: pointer;
}

.bo-branding-preview {
    padding: 20px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
}

.bo-branding-preview-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-muted);
    margin: 0 0 16px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.bo-branding-preview-form {
    padding: 20px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: #fff;
}

.bo-branding-preview-heading {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 16px;
    padding-bottom: 8px;
    border-bottom: 2px solid currentColor;
}

.bo-branding-preview-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.bo-branding-preview-btn {
    display: inline-block;
    padding: 10px 18px;
    border-radius: var(--radius-sm);
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    border: 2px solid transparent;
}

.bo-branding-preview-btn-label {
    font-size: 12px;
    color: var(--color-text-light);
    margin-top: 6px;
}

.bo-branding-preview-swatch {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 8px;
    font-size: 13px;
    color: var(--color-text-muted);
}

.bo-branding-preview-swatch .bo-branding-swatch-chip {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    border: 1px solid var(--color-border);
    flex-shrink: 0;
}

.bo-branding-preview-swatch .bo-branding-swatch-hex {
    font-family: ui-monospace, monospace;
}

.bo-branding-preview-modal {
    max-width: min(980px, 96vw);
    width: calc(100% - 32px);
}

.bo-branding-preview-form-modal {
    margin-top: 12px;
}

.bo-branding-preview-practice {
    margin: 0 0 8px;
    text-align: center;
    font-size: 24px;
    font-weight: 700;
}

.bo-branding-client-header-preview {
    margin-bottom: 20px;
    text-align: center;
}

.bo-branding-preview-tagline,
.bo-branding-preview-welcome {
    margin: 0 0 8px;
    color: var(--color-text-muted);
    line-height: 1.5;
}

.bo-branding-preview-tagline {
    font-size: 15px;
}

.bo-branding-preview-welcome {
    font-size: 14px;
    margin-bottom: 0;
}

.bo-quill-editor {
    background: #fff;
    border-radius: var(--radius-sm);
}

.bo-privacy-editor-wrap .bo-privacy-intro {
    padding: 12px 15px;
    border: 1px solid var(--color-border);
    border-bottom: none;
    border-radius: var(--radius-sm) var(--radius-sm) 0 0;
    background: var(--color-bg);
    font-size: 14px;
    line-height: 1.6;
    color: var(--color-text-muted);
    user-select: none;
    cursor: not-allowed;
}

.bo-privacy-editor-wrap .bo-privacy-intro p {
    margin: 0 0 12px;
}

.bo-privacy-editor-wrap .bo-privacy-intro p:last-child {
    margin-bottom: 0;
}

.bo-privacy-editor-wrap .bo-privacy-intro strong {
    font-weight: 600;
    color: var(--color-text);
}

.bo-privacy-editor-wrap .bo-quill-editor {
    border-radius: 0 0 var(--radius-sm) var(--radius-sm);
}

.bo-privacy-editor-wrap .bo-quill-editor .ql-toolbar {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.bo-quill-editor .ql-toolbar {
    border-top-left-radius: var(--radius-sm);
    border-top-right-radius: var(--radius-sm);
    border-color: var(--color-border);
    background: var(--color-bg);
}

.bo-quill-editor .ql-container {
    height: 110px;
    overflow-y: auto;
    border-bottom-left-radius: var(--radius-sm);
    border-bottom-right-radius: var(--radius-sm);
    border-color: var(--color-border);
    font-family: inherit;
    font-size: 14px;
}

.bo-quill-editor--privacy .ql-editor {
    min-height: 0 !important;
    height: auto;
    padding-bottom: 12px;
}

.bo-quill-editor--privacy .ql-clipboard {
    display: none;
}

.bo-quill-editor--privacy .ql-editor ol li[data-list="bullet"] {
    list-style-type: disc;
}

.bo-quill-editor--privacy .ql-editor ol li[data-list="ordered"] {
    list-style-type: decimal;
}

.bo-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.bo-branding-preview-logo {
    margin-bottom: 16px;
}

.bo-branding-preview-logo img {
    max-height: 56px;
    width: auto;
}

.bo-branding-preview-field {
    margin-bottom: 12px;
}

.bo-branding-preview-field label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 4px;
    color: var(--color-text-muted);
}

.bo-branding-preview-input {
    padding: 10px 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: #fff;
    font-size: 14px;
}

button.bo-tab {
    border: none;
    font-family: inherit;
    cursor: pointer;
}

.bo-support-reply-staff {
    border-color: var(--color-border);
    background: #fff;
}

.bo-support-message-layout {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.bo-support-message-avatar {
    flex-shrink: 0;
    padding-top: 2px;
}

.bo-user-avatar--support {
    background: #fff;
    border: 1px solid var(--color-border);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.bo-user-avatar--support img {
    object-fit: contain;
    padding: 5px;
}

.bo-support-staff-label {
    display: inline-block;
    font-weight: 700;
    color: var(--color-text);
    background: #fff;
    padding: 2px 10px;
    border-radius: 6px;
    border: 1px solid var(--color-border);
}

.bo-support-message-content {
    flex: 1;
    min-width: 0;
}

.bo-support-message-header {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px 12px;
    margin-bottom: 8px;
}

.bo-support-message-body {
    white-space: pre-wrap;
}

.bo-support-attachments {
    margin-top: 16px;
}

.bo-support-attachment-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bo-support-attachment-list li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: 14px;
}

.bo-support-attachment-image {
    display: block;
    padding: 0;
    border: none;
    background: none;
    cursor: pointer;
}

.bo-support-attachment-image img {
    max-width: 160px;
    max-height: 120px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    object-fit: cover;
}

.bo-support-attachment-link {
    padding: 0;
    border: none;
    background: none;
    color: var(--color-primary);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    text-align: left;
    text-decoration: underline;
}

.bo-support-attachment-link:hover {
    color: var(--color-primary-dark, #3a7b7b);
}

.bo-list-link-meta {
    display: block;
    font-size: 13px;
    font-weight: 400;
    color: var(--color-text-muted);
    margin-top: 2px;
}

.bo-textarea { resize: vertical; min-height: 100px; }

.bo-checkbox-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--color-text);
    cursor: pointer;
}

.bo-checkbox-label input { accent-color: var(--color-primary); }

.bo-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}

.bo-checkbox-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--color-text);
    cursor: pointer;
}

.bo-checkbox-row input { accent-color: var(--color-primary); }

.bo-permissions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 10px;
    margin-top: 8px;
}

.bo-permission-option {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    background: var(--color-surface);
    cursor: pointer;
    font-size: 14px;
}

.bo-permission-option:hover {
    border-color: var(--color-primary-muted, #c5d9f0);
}

.bo-permission-option input {
    margin-top: 2px;
    accent-color: var(--color-primary);
    flex-shrink: 0;
}

.bo-permission-option strong {
    display: block;
    font-weight: 600;
    color: var(--color-text);
    margin-bottom: 2px;
}

.bo-permission-option .bo-help {
    display: block;
    margin: 0;
}

.bo-help {
    font-size: 12px;
    color: var(--color-text-light);
    margin-top: 4px;
}

.bo-error {
    font-size: 13px;
    color: var(--color-danger);
    margin-top: 4px;
}

.bo-code {
    display: block;
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    padding: 12px 14px;
    font-size: 13px;
    word-break: break-all;
    color: var(--color-text);
}

.bo-copy-link {
    max-width: 100%;
}

.bo-copy-link-field {
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    padding: 6px 6px 6px 14px;
}

.bo-copy-link-url {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    line-height: 1.5;
    word-break: break-all;
    color: var(--color-text-muted);
}

.bo-copy-link-btn {
    flex-shrink: 0;
    margin: 0;
}

.bo-copy-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: #fff;
    color: var(--color-text-muted);
    cursor: pointer;
    flex-shrink: 0;
}

.bo-copy-icon-btn:hover {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.bo-copy-icon-btn svg {
    width: 16px;
    height: 16px;
}

@media (max-width: 600px) {
    .bo-copy-link-field {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 14px;
        gap: 10px;
    }

    .bo-copy-link-btn {
        width: 100%;
    }
}

/* Template list cards */
.bo-template-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
    padding: 20px 24px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--transition);
}

@media (min-width: 768px) {
    .bo-template-card:not(.bo-template-card-has-footer) {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.bo-template-card-content {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex: 1;
    min-width: 0;
}

.bo-template-card-body {
    flex: 1;
    min-width: 0;
}

.bo-template-card-body .bo-template-meta {
    line-height: 1.5;
    margin-top: 4px;
}

.bo-template-card-body .bo-template-tags {
    margin-top: 12px;
}

.bo-template-library-icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(45, 106, 106, 0.1);
    color: var(--color-primary);
}

.bo-template-library-icon svg {
    width: 22px;
    height: 22px;
    display: block;
}

.bo-template-card-actions {
    flex-shrink: 0;
}

.bo-template-card:hover { box-shadow: var(--shadow-md); }

.bo-template-card + .bo-template-card { margin-top: 12px; }

.bo-template-name {
    font-size: 17px;
    font-weight: 700;
    margin: 0 0 4px;
}

.bo-template-meta {
    font-size: 13px;
    color: var(--color-text-muted);
    margin: 0;
}

.bo-template-tags {
    font-size: 12px;
    color: var(--color-text-light);
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.bo-template-completions {
    color: var(--color-text-muted);
    font-size: 12px;
}

.bo-template-actions {
    margin-top: 4px;
    flex-wrap: wrap;
}

.bo-template-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.bo-template-card-delete {
    margin-left: auto;
    flex-shrink: 0;
}

.bo-library-search {
    margin-bottom: 20px;
}

.bo-library-search-wrap {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.bo-library-search-wrap .bo-input {
    flex: 1;
    min-width: 220px;
    max-width: 420px;
}

.bo-library-empty {
    text-align: center;
    padding: 32px 20px;
    color: var(--color-text-muted);
    font-size: 14px;
}

.bo-voice-modal-footer {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.bo-voice-modal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.bo-voice-recording {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    background: rgba(192, 57, 43, 0.08);
    border-radius: var(--radius-sm);
    font-weight: 600;
    color: var(--color-danger, #c0392b);
}

.bo-voice-recording-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--color-danger, #c0392b);
    animation: bo-voice-pulse 1.2s ease-in-out infinite;
}

@keyframes bo-voice-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.45; transform: scale(0.85); }
}

.bo-voice-playback {
    margin-top: 4px;
}

.bo-voice-audio {
    width: 100%;
    max-width: 100%;
    min-height: 40px;
}

.bo-voice-notes-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.bo-voice-note-item {
    padding: 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-bg);
}

.hidden {
    display: none !important;
}

.bo-voice-attached-label {
    color: var(--color-primary);
    font-weight: 600;
}

.bo-badge {
    display: inline-block;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: 600;
    border-radius: 99px;
}

.bo-badge-success { background: #EDF7F2; color: var(--color-success); }
.bo-badge-danger { background: #FDF0F0; color: var(--color-danger); }
.bo-badge-warning { background: #FEF3E8; color: #8B5E3C; }
.bo-badge-type {
    background: rgba(45, 106, 106, 0.1);
    color: var(--color-primary);
    letter-spacing: 0.01em;
}

/* Field editor */
.bo-editor-section {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    margin-bottom: 20px;
    overflow: hidden;
}

.bo-editor-section-header {
    padding: 16px 20px;
    background: var(--color-bg-alt);
    border-bottom: 1px solid var(--color-border);
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
}

.bo-editor-section-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    flex-shrink: 0;
}

.bo-editor-sections-sortable {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.bo-editor-section-ghost {
    opacity: 0.5;
}

.bo-editor-section-pinned {
    margin-top: 20px;
    border-style: dashed;
}

.bo-editor-pinned-note {
    margin: 0;
    padding: 12px 20px 16px;
    font-style: italic;
}

.bo-editor-add-section {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin: 20px 0;
    padding: 16px 20px;
    background: var(--color-surface);
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-md);
}

.bo-section-drag-handle {
    margin-bottom: 2px;
}

.bo-editor-field {
    padding: 16px 20px;
    border-bottom: 1px solid var(--color-border);
}

.bo-editor-field:last-child { border-bottom: none; }

.bo-field-drag-handle {
    cursor: grab;
    flex-shrink: 0;
}

.bo-field-drag-handle:active {
    cursor: grabbing;
}

.bo-editor-fields-sortable { min-height: 8px; }

.bo-editor-canvas-drop {
    min-height: 72px;
}

.bo-editor-canvas-drop.is-drop-target,
.bo-editor-fields-sortable.is-drop-target {
    outline: 2px dashed var(--color-primary);
    outline-offset: -2px;
    background: rgba(45, 106, 106, 0.05);
    border-radius: 10px;
}

.bo-editor-drop-empty {
    margin: 16px 20px;
    padding: 28px 16px;
    border: 1px dashed var(--color-border);
    border-radius: 10px;
    text-align: center;
    color: var(--color-text-muted);
    font-weight: 600;
    background: var(--color-bg);
}

.bo-editor-palette {
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid var(--color-border);
}

.bo-editor-palette-head strong {
    display: block;
    font-size: 13px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.bo-editor-palette-head .bo-help {
    margin: 4px 0 0;
}

.bo-editor-palette-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 12px;
}

.bo-editor-palette-item {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) 10px;
    align-items: center;
    gap: 10px;
    width: 100%;
    border: 1px solid var(--color-border);
    border-radius: 12px;
    background: #fff;
    padding: 10px 10px 10px 10px;
    text-align: left;
    font: inherit;
    cursor: grab;
    color: var(--color-text);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}

.bo-editor-palette-item:hover {
    border-color: var(--color-primary);
    background: #fff;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
    transform: translateY(-1px);
}

.bo-editor-palette-item:active {
    cursor: grabbing;
    transform: translateY(0);
}

.bo-editor-palette-icon {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    color: #1d4ed8;
    background: rgba(59, 130, 246, 0.12);
    flex-shrink: 0;
}

.bo-editor-palette-icon svg {
    width: 20px;
    height: 20px;
}

.bo-editor-palette-icon[data-type="textarea"] {
    color: #15803d;
    background: rgba(34, 197, 94, 0.14);
}

.bo-editor-palette-icon[data-type="email"] {
    color: #1d4ed8;
    background: rgba(59, 130, 246, 0.12);
}

.bo-editor-palette-icon[data-type="number"] {
    color: #0369a1;
    background: rgba(14, 165, 233, 0.14);
}

.bo-editor-palette-icon[data-type="date"] {
    color: #a16207;
    background: rgba(234, 179, 8, 0.16);
}

.bo-editor-palette-icon[data-type="yes_no"] {
    color: #7e22ce;
    background: rgba(168, 85, 247, 0.14);
}

.bo-editor-palette-icon[data-type="radio"] {
    color: #6d28d9;
    background: rgba(139, 92, 246, 0.14);
}

.bo-editor-palette-icon[data-type="checkbox_list"] {
    color: #6d28d9;
    background: rgba(139, 92, 246, 0.14);
}

.bo-editor-palette-icon[data-type="checkbox_group"] {
    color: #5b21b6;
    background: rgba(124, 58, 237, 0.14);
}

.bo-editor-palette-icon[data-type="body_diagram"] {
    color: #0f766e;
    background: rgba(20, 184, 166, 0.16);
}

.bo-editor-palette-copy {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.bo-editor-palette-label {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--color-text);
}

.bo-editor-palette-help {
    font-size: 11px;
    line-height: 1.35;
    color: var(--color-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bo-editor-palette-grip {
    width: 8px;
    height: 14px;
    justify-self: end;
    background-image: radial-gradient(circle, #94a3b8 1px, transparent 1.2px);
    background-size: 4px 4px;
    opacity: 0.7;
}

.bo-editor-section-list-pinned {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px dashed var(--color-border);
}

.bo-editor-option-row {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
}

.bo-option-drag-handle {
    width: 28px;
    height: 28px;
}

.bo-editor-field-draggable { position: relative; }

.bo-editor-field-toolbar {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
}

.bo-drag-handle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-bg);
    color: var(--color-text-light);
    cursor: grab;
    transition: all var(--transition);
}

.bo-drag-handle:hover {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background: rgba(45, 106, 106, 0.06);
}

.bo-drag-handle:active { cursor: grabbing; }

.bo-editor-field-ghost {
    opacity: 0.45;
    background: rgba(45, 106, 106, 0.06);
}

.bo-editor-add-field {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 20px;
    border-top: 1px dashed var(--color-border);
    background: var(--color-bg);
    color: var(--color-text-muted);
    font-size: 0.875rem;
    font-weight: 600;
}

.bo-field-type {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 3px 8px;
    border-radius: var(--radius-sm);
    background: rgba(45, 106, 106, 0.1);
    color: var(--color-primary);
}

.bo-editor-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(380px, 1fr);
    gap: 24px;
    align-items: start;
}

.bo-editor-layout-3col {
    grid-template-columns: minmax(360px, 380px) minmax(0, 1.15fr) minmax(320px, 0.95fr);
    transition: grid-template-columns .25s ease;
}

.bo-editor-layout-3col.is-preview-mobile {
    grid-template-columns: minmax(360px, 380px) minmax(0, 1.35fr) minmax(300px, 360px);
}

.bo-editor-layout-3col.is-preview-tablet {
    grid-template-columns: minmax(360px, 380px) minmax(0, 1fr) minmax(420px, 520px);
}

.bo-editor-layout-3col.is-preview-desktop {
    grid-template-columns: minmax(360px, 380px) minmax(0, 0.95fr) minmax(520px, 1.15fr);
}

.bo-editor-sections-nav {
    position: sticky;
    top: 24px;
    align-self: start;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 14px;
    min-width: 0;
    max-height: calc(100vh - 48px);
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 5;
}

.bo-editor-section-nav-label {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bo-editor-sections-nav-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}

.bo-editor-ai-assist {
    white-space: nowrap;
    font-size: 12px;
    padding: 6px 10px;
}

.bo-editor-section-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.bo-editor-section-nav-row {
    display: flex;
    align-items: center;
    gap: 2px;
    border-radius: 8px;
}

.bo-editor-section-nav-row.is-active {
    background: rgba(45, 106, 106, 0.1);
}

.bo-editor-section-nav-item {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    border-radius: 8px;
    padding: 9px 10px;
    text-align: left;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
    color: var(--color-text);
}

.bo-editor-section-nav-item:hover,
.bo-editor-section-nav-item.is-active {
    background: rgba(45, 106, 106, 0.1);
    color: var(--color-primary);
}

.bo-editor-section-nav-handle,
.bo-editor-section-nav-pin {
    color: var(--color-text-muted);
    font-size: 12px;
    flex-shrink: 0;
}

.bo-editor-section-menu {
    position: relative;
    flex-shrink: 0;
}

.bo-editor-section-menu-trigger {
    border: 0;
    background: transparent;
    border-radius: 6px;
    width: 28px;
    height: 28px;
    font-weight: 800;
    cursor: pointer;
    color: var(--color-text-muted);
}

.bo-editor-section-menu-trigger:hover {
    background: rgba(15, 23, 42, 0.06);
    color: var(--color-text);
}

.bo-editor-section-menu-panel {
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    min-width: 180px;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
    padding: 6px;
    z-index: 30;
}

.bo-editor-section-menu-item {
    display: block;
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    padding: 8px 10px;
    border-radius: 7px;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.bo-editor-section-menu-item:hover {
    background: rgba(45, 106, 106, 0.08);
}

.bo-editor-section-menu-item.is-danger {
    color: var(--color-danger);
}

.bo-editor-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-bottom: 16px;
}

.bo-editor-add-question {
    font-weight: 700;
    padding: 10px 16px;
    font-size: 0.95rem;
}

.bo-editor-field-card {
    border: 1px solid var(--color-border);
    border-radius: 10px;
    background: #fff;
    padding: 0;
    overflow: hidden;
    margin-bottom: 6px;
}

.bo-editor-field-summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    cursor: pointer;
    background: #f8fafc;
}

.bo-editor-field-meta {
    margin-top: 1px;
    font-size: 0.78rem;
}

.bo-field-type-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    flex-shrink: 0;
    background: #94a3b8;
}

.bo-field-type-dot[data-type="text"],
.bo-field-type-dot[data-type="email"],
.bo-field-type-dot[data-type="number"] {
    background: #3b82f6;
}

.bo-field-type-dot[data-type="textarea"] {
    background: #22c55e;
}

.bo-field-type-dot[data-type="date"] {
    background: #eab308;
}

.bo-field-type-dot[data-type="yes_no"],
.bo-field-type-dot[data-type="radio"] {
    background: #a855f7;
}

.bo-field-type-dot[data-type="checkbox_list"],
.bo-field-type-dot[data-type="checkbox_group"] {
    background: #8b5cf6;
}

.bo-field-type-dot[data-type="signature"] {
    background: #ef4444;
}

.bo-field-type-dot[data-type="body_diagram"] {
    background: #0ea5e9;
}

.bo-field-type-dot[data-type="declaration"] {
    background: #64748b;
}

.bo-editor-field-body {
    padding: 14px;
    border-top: 1px solid var(--color-border);
}

.bo-question-type-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.bo-question-type-card {
    display: flex;
    flex-direction: column;
    gap: 4px;
    text-align: left;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    background: #fff;
    padding: 12px;
    cursor: pointer;
    font: inherit;
}

.bo-question-type-card:hover {
    border-color: var(--color-primary);
    background: rgba(45, 106, 106, 0.05);
}

.bo-editor-main {
    min-width: 0;
}

.bo-form-preview-phone {
    margin: 0 auto;
    width: min(340px, 100%);
    border: 10px solid #111827;
    border-radius: 28px;
    overflow: hidden;
    background: #fff;
    transition: width .25s ease, max-width .25s ease, border-radius .25s ease, border-width .25s ease, padding .25s ease;
}

.bo-form-preview-phone.is-desktop {
    width: 100%;
    max-width: 100%;
    border-width: 1px;
    border-radius: 12px;
    border-color: var(--color-border, #e2e8f0);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.bo-form-preview-phone.is-tablet {
    width: min(480px, 100%);
    max-width: 480px;
    border-width: 8px;
    border-radius: 22px;
    border-color: #111827;
}

.bo-form-preview-phone.is-mobile {
    width: min(300px, 100%);
    max-width: 300px;
    border-width: 10px;
    border-radius: 28px;
    border-color: #111827;
}

.bo-form-preview-device-toggle {
    display: inline-flex;
    gap: 6px;
    margin-left: auto;
    margin-right: 8px;
    flex-wrap: nowrap;
}

.bo-form-preview-device-toggle .bo-btn {
    white-space: nowrap;
    padding: 5px 9px;
    font-size: 12px;
}

.bo-form-preview-body {
    padding: 16px;
    overflow: auto;
    background:
        radial-gradient(circle at top, rgba(45,106,106,.06), transparent 40%),
        #e8eef0;
}

.bo-form-preview-phone.is-desktop .bo-form-preview-container {
    padding: 22px 24px;
}

.bo-form-preview-phone.is-tablet .bo-form-preview-container {
    padding: 18px 16px;
}

.bo-form-preview-phone.is-mobile .bo-form-preview-container,
.bo-form-preview-phone:not(.is-desktop):not(.is-tablet) .bo-form-preview-container {
    padding: 14px 12px;
}

.bo-editor-section-nav-chevron {
    margin-left: auto;
    flex-shrink: 0;
    font-size: 10px;
    color: var(--color-text-muted);
}

.bo-field-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    flex-shrink: 0;
    background: #94a3b8;
}

.bo-field-status-dot[data-status="required"] {
    background: #22c55e;
}

.bo-field-status-dot[data-status="optional"] {
    background: #3b82f6;
}

.bo-field-status-dot[data-status="conditional"] {
    background: #a855f7;
}

.bo-field-type-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    flex-shrink: 0;
    background: #94a3b8;
}

.bo-field-type-dot[data-type="text"],
.bo-field-type-dot[data-type="email"],
.bo-field-type-dot[data-type="number"] {
    background: #3b82f6;
}

.bo-field-type-dot[data-type="textarea"] {
    background: #22c55e;
}

.bo-field-type-dot[data-type="date"] {
    background: #eab308;
}

.bo-field-type-dot[data-type="yes_no"],
.bo-field-type-dot[data-type="radio"] {
    background: #a855f7;
}

.bo-field-type-dot[data-type="checkbox_list"],
.bo-field-type-dot[data-type="checkbox_group"] {
    background: #8b5cf6;
}

.bo-field-type-dot[data-type="signature"] {
    background: #ef4444;
}

.bo-field-type-dot[data-type="body_diagram"] {
    background: #0ea5e9;
}

.bo-field-type-dot[data-type="declaration"] {
    background: #64748b;
}

.bo-editor-preview {
    min-width: 0;
    position: sticky;
    top: 24px;
    align-self: start;
}

.bo-form-preview-frame {
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 120px);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-md);
    overflow: hidden;
}

.bo-form-preview-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--color-border);
    background: var(--color-bg-alt);
}

.bo-form-preview-header .bo-help {
    margin-left: auto;
}

.bo-preview-expand-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    color: var(--color-text-muted);
    cursor: pointer;
    transition: all var(--transition);
}

.bo-preview-expand-btn:hover {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.bo-preview-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bo-preview-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
}

.bo-preview-modal-panel {
    position: relative;
    width: 90vw;
    max-width: 720px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

.bo-preview-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--color-border);
    background: var(--color-bg-alt);
}

.bo-preview-modal-body {
    flex: 1;
    overflow-y: auto;
    padding: 24px;
    background: #f5f5f5;
}

.bo-form-preview-body {
    overflow-y: auto;
    padding: 16px;
    background: #f5f5f5;
}

.bo-form-preview-container {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    padding: 24px 20px;
}

.bo-form-preview-title {
    text-align: center;
    color: #4a9b9b;
    margin: 0 0 24px;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.3;
}

.bo-form-preview-empty {
    margin: 0;
    color: var(--color-text-muted);
    font-size: 14px;
    line-height: 1.5;
    text-align: center;
    padding: 24px 12px;
}

.bo-form-preview .form-section {
    margin-bottom: 24px;
    transition: outline-color 0.15s ease, background-color 0.15s ease;
}

.bo-form-preview .form-section.is-preview-focused {
    outline: 2px solid rgba(45, 106, 106, 0.35);
    outline-offset: 4px;
    border-radius: 6px;
}

.bo-form-preview .form-row.is-preview-focused {
    background: rgba(45, 106, 106, 0.07);
    border-radius: 6px;
    box-shadow: inset 0 0 0 1px rgba(45, 106, 106, 0.18);
}

.bo-form-preview .form-row.is-preview-focused .form-group {
    padding: 4px 6px;
}

.bo-form-preview .form-section h2 {
    color: #4a9b9b;
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 12px;
    border-bottom: 2px solid #4a9b9b;
    padding-bottom: 4px;
}

.bo-form-preview .form-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: 12px;
}

.bo-form-preview-phone.is-desktop .form-row.is-two-col,
.bo-form-preview-phone.is-tablet .form-row.is-two-col {
    grid-template-columns: 1fr 1fr;
}

.bo-form-preview-phone.is-mobile .form-row.is-two-col,
.bo-form-preview-phone:not(.is-desktop):not(.is-tablet) .form-row.is-two-col {
    grid-template-columns: 1fr;
}

.bo-form-preview-phone.is-desktop .form-row {
    margin-bottom: 14px;
    gap: 14px;
}

.bo-form-preview-phone.is-mobile .form-row,
.bo-form-preview-phone:not(.is-desktop):not(.is-tablet) .form-row {
    margin-bottom: 16px;
}

.bo-form-preview-phone.is-desktop .btn-submit,
.bo-form-preview-phone.is-tablet .btn-submit {
    width: auto;
    min-width: 180px;
}

.bo-form-preview-phone.is-mobile .btn-submit,
.bo-form-preview-phone:not(.is-desktop):not(.is-tablet) .btn-submit {
    width: 100%;
}

.bo-form-preview .form-group {
    margin-bottom: 12px;
}

.bo-form-preview .form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: 700;
    color: #666;
    font-size: 13px;
}

.bo-form-preview .form-group input[type="text"],
.bo-form-preview .form-group textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 14px;
    font-family: inherit;
    background: #fff;
}

.bo-form-preview .form-group textarea {
    resize: vertical;
    min-height: 72px;
}

.bo-form-preview .form-group small {
    display: block;
    margin-top: 6px;
    color: #666;
    font-size: 12px;
    line-height: 1.4;
}

.bo-form-preview .required {
    color: #c45c5c;
}

.bo-form-preview .radio-group {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.bo-form-preview .radio-group label,
.bo-form-preview .checkbox-item label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 400;
    color: #444;
    margin: 0;
}

.bo-form-preview .checkbox-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 10px;
}

.bo-form-preview .checkbox-item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.bo-form-preview .declaration {
    font-size: 13px;
    line-height: 1.6;
    color: #555;
}

.bo-form-preview .declaration a {
    color: #4a9b9b;
}

.bo-form-preview .body-diagram p {
    margin: 0 0 12px;
    font-size: 13px;
    line-height: 1.5;
    color: #555;
}

.bo-form-preview-body-images {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}

.bo-form-preview .body-view {
    text-align: center;
}

.bo-form-preview .body-view span {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #666;
    margin-bottom: 6px;
}

.bo-form-preview .body-view svg,
.bo-form-preview .body-view .body-figure-img {
    width: 120px;
    height: auto;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    padding: 6px;
    display: block;
}

.bo-form-preview .body-figure-hitarea {
    position: relative;
    line-height: 0;
}

.bo-form-preview-signature {
    height: 120px;
    border: 1px dashed #ccc;
    border-radius: 4px;
    background: #fafafa;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #999;
    font-size: 13px;
}

.bo-form-preview-follow-up {
    margin-top: 10px;
}

.bo-form-preview-submit {
    width: 100%;
    margin-top: 8px;
    opacity: 0.85;
    cursor: not-allowed;
}

.bo-form-preview .btn.btn-submit {
    display: block;
    width: 100%;
    padding: 14px 20px;
    border: 0;
    border-radius: 4px;
    background: #4a9b9b;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
}

@media (max-width: 1100px) {
    .bo-editor-layout,
    .bo-editor-layout-3col {
        grid-template-columns: 1fr;
    }

    .bo-editor-preview {
        order: -1;
        position: static;
    }

    .bo-editor-sections-nav {
        position: static;
    }

    .bo-form-preview-frame {
        max-height: 360px;
    }
}

/* Tags / chips */
.bo-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.bo-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    font-size: 13px;
    font-weight: 500;
    border-radius: var(--radius-sm);
    background: #FDF0F0;
    color: var(--color-danger);
}

/* Billing plans */
.bo-plans {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
}

.bo-plans.bo-plans-4plus1 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.bo-plans.bo-plans-4plus1 .bo-plan-enterprise {
    grid-column: 1 / -1;
}

@media (max-width: 1100px) {
    .bo-plans {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .bo-plans.bo-plans-4plus1 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .bo-plans,
    .bo-plans.bo-plans-4plus1 {
        grid-template-columns: 1fr;
    }
}

.bo-plan-comparison {
    margin-top: 12px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--color-text-muted);
}

.bo-plan-comparison strong {
    color: var(--color-text);
    font-weight: 600;
}

.bo-plan-comparison ul {
    margin: 6px 0 0;
    padding-left: 0;
    list-style: none;
}

.bo-plan-comparison li {
    margin-bottom: 4px;
    position: relative;
    padding-left: 18px;
}

.bo-plan-comparison li::before {
    content: '?';
    position: absolute;
    left: 0;
    color: var(--color-primary);
    font-size: 12px;
    top: 1px;
}

.bo-plan-comparison-cols ul {
    columns: 2;
    column-gap: 32px;
}

.bo-plan-comparison-cols li {
    break-inside: avoid;
}

.bo-plan {
    padding: 20px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
}

.bo-plan-body {
    flex: 1;
}

.bo-plan-footer {
    margin-top: 16px;
}

.bo-plan-status {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
}

.bo-plan.current {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(45, 106, 106, 0.2);
}

.bo-plan-name {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 8px;
}

.bo-plan-price {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-primary);
}

.bo-plan-price span {
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text-muted);
}

/* Billing page redesign */
.bo-billing {
    gap: 20px;
}

.bo-billing-eyebrow {
    margin: 0 0 6px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.bo-billing-dashboard {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: 16px;
}

.bo-billing-dash-card {
    padding: 24px 28px;
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.bo-billing-dash-card--plan {
    border-color: rgba(45, 106, 106, 0.2);
    background:
        radial-gradient(ellipse 70% 80% at 100% 0%, rgba(45, 106, 106, 0.1), transparent 55%),
        linear-gradient(160deg, #F3F8F7 0%, #FFFFFF 48%);
}

.bo-billing-dash-card--usage {
    background: linear-gradient(180deg, #FAFAF8 0%, #FFFFFF 100%);
}

.bo-billing-dash-title-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.bo-billing-plan-name {
    margin: 0;
    font-size: clamp(1.8rem, 3vw, 2.35rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    text-transform: uppercase;
}

.bo-billing-hero-price {
    margin: 8px 0 0;
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--color-primary-dark);
}

.bo-billing-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.bo-billing-status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

.bo-billing-dash-meta {
    margin-top: 16px;
}

.bo-billing-dash-meta > div {
    display: grid;
    gap: 2px;
}

.bo-billing-dash-meta span {
    font-size: 12px;
    color: var(--color-text-muted);
}

.bo-billing-dash-meta strong {
    font-size: 15px;
}

.bo-billing-dash-note {
    margin: 8px 0 0;
    font-size: 14px;
    color: var(--color-text-muted);
}

.bo-billing-payment {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 18px;
    padding: 12px 14px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.8);
    border: 1px solid var(--color-border);
}

.bo-billing-payment strong {
    display: block;
    font-size: 14px;
}

.bo-billing-payment span {
    display: block;
    font-size: 12px;
    color: var(--color-text-muted);
    margin-top: 2px;
}

.bo-billing-payment-link {
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}

.bo-billing-dash-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.bo-billing-usage-heading {
    margin: 0 0 16px;
    font-size: 1.15rem;
    font-weight: 700;
}

.bo-billing-usage-grid {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 12px;
}

.bo-billing-usage-grid li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: var(--radius-md);
    background: var(--color-bg);
    border: 1px solid var(--color-border);
}

.bo-billing-usage-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(45, 106, 106, 0.1);
    color: var(--color-primary);
    flex-shrink: 0;
}

.bo-billing-usage-grid strong {
    display: block;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.bo-billing-usage-grid span:last-child {
    font-size: 13px;
    color: var(--color-text-muted);
}

.bo-billing-pending {
    background: #FEF3E8;
    border: 1px solid rgba(139, 94, 60, 0.25);
    color: #6B4423;
}

.bo-billing-pending-form {
    margin-top: 12px;
}

.bo-billing-panel {
    padding: 24px 28px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.bo-billing-panel-header h3 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
}

.bo-billing-compare-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}

.bo-billing-interval {
    display: inline-flex;
    padding: 4px;
    border-radius: 999px;
    background: var(--color-bg);
    border: 1px solid var(--color-border);
}

.bo-billing-interval-btn {
    appearance: none;
    border: none;
    background: transparent;
    color: var(--color-text-muted);
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    padding: 8px 14px;
    border-radius: 999px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.bo-billing-interval-btn.is-active {
    background: var(--color-surface);
    color: var(--color-text);
    box-shadow: var(--shadow-sm);
}

.bo-billing-interval-save {
    font-size: 11px;
    font-weight: 700;
    color: var(--color-success);
    background: #EDF7F2;
    padding: 2px 6px;
    border-radius: 999px;
}

.bo-billing-annual-note {
    margin: 12px 0 0;
    font-size: 13px;
    color: var(--color-text-muted);
}

.bo-billing-selector {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 20px;
}

.bo-billing-select-card {
    appearance: none;
    text-align: left;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-height: 0;
    padding: 14px 16px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background: var(--color-bg);
    color: inherit;
    font: inherit;
    transition: border-color var(--transition), box-shadow var(--transition), background var(--transition);
}

.bo-billing-select-card:hover {
    border-color: rgba(45, 106, 106, 0.35);
}

.bo-billing-select-card.is-selected {
    border-color: var(--color-primary);
    background: #FFFFFF;
    box-shadow: 0 0 0 2px rgba(45, 106, 106, 0.15);
}

.bo-billing-select-card.is-current {
    background: #EDF7F2;
    border-color: rgba(61, 139, 110, 0.35);
}

.bo-billing-select-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.bo-billing-select-name {
    font-size: 14px;
    font-weight: 700;
}

.bo-billing-select-price {
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.bo-billing-select-price small {
    font-size: 12px;
    font-weight: 500;
    color: var(--color-text-muted);
}

.bo-billing-select-hint {
    font-size: 12px;
    color: var(--color-text-muted);
    line-height: 1.35;
    min-height: 1.35em;
}

.bo-billing-detail {
    margin-top: 16px;
}

.bo-billing-detail-panel {
    padding: 20px 22px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background: var(--color-bg);
}

.bo-billing-detail-panel--current {
    background: linear-gradient(180deg, #F3F8F7 0%, #FFFFFF 50%);
    border-color: rgba(45, 106, 106, 0.22);
}

.bo-billing-detail-panel--change {
    background: #FFFCF8;
    border-color: rgba(232, 168, 124, 0.4);
}

.bo-billing-detail-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.bo-billing-detail-header h4 {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.bo-billing-detail-price {
    margin: 4px 0 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--color-primary);
}

.bo-billing-detail-price span {
    font-weight: 500;
    color: var(--color-text-muted);
}

.bo-billing-detail-saving {
    text-align: right;
}

.bo-billing-detail-saving span {
    display: block;
    font-size: 12px;
    color: var(--color-text-muted);
}

.bo-billing-detail-saving strong {
    font-size: 1.25rem;
    color: var(--color-success);
}

.bo-billing-feature-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 8px;
}

.bo-billing-feature-list--compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.bo-billing-feature-list li {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    font-size: 14px;
    line-height: 1.4;
}

.bo-billing-feature-list li > span:first-child {
    color: var(--color-success);
    font-weight: 700;
}

.bo-billing-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 28px;
    margin: 16px 0 0;
    padding-top: 14px;
    border-top: 1px solid var(--color-border);
}

.bo-billing-detail-meta div {
    display: grid;
    gap: 2px;
}

.bo-billing-detail-meta dt {
    margin: 0;
    font-size: 12px;
    color: var(--color-text-muted);
}

.bo-billing-detail-meta dd {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
}

.bo-billing-included {
    margin-bottom: 14px;
}

.bo-billing-included-title {
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 700;
    color: var(--color-text);
}

.bo-billing-expand {
    appearance: none;
    border: none;
    background: none;
    padding: 0;
    margin-top: 8px;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-primary);
    cursor: pointer;
}

.bo-billing-confirm-lose {
    margin-bottom: 14px;
    padding: 14px 16px;
    border-radius: var(--radius-md);
    background: #FDF0F0;
    border: 1px solid rgba(196, 92, 92, 0.25);
}

.bo-billing-confirm-lose-title {
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 700;
    color: var(--color-danger);
}

.bo-billing-confirm-lose ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 6px;
}

.bo-billing-confirm-lose li {
    position: relative;
    padding-left: 16px;
    font-size: 14px;
}

.bo-billing-confirm-lose li::before {
    content: "?";
    position: absolute;
    left: 0;
    color: var(--color-danger);
    font-weight: 700;
}

.bo-billing-reassure,
.bo-billing-safety {
    padding: 14px 16px;
    border-radius: var(--radius-md);
    background: #EDF7F2;
    border: 1px solid rgba(61, 139, 110, 0.25);
    font-size: 13px;
    line-height: 1.55;
    color: var(--color-text);
}

.bo-billing-reassure strong,
.bo-billing-safety strong {
    display: inline;
    color: var(--color-success);
}

.bo-billing-detail-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.bo-billing-enterprise {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 24px;
    margin-top: 20px;
    padding: 28px;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(26, 43, 43, 0.12);
    background:
        radial-gradient(ellipse 60% 80% at 0% 0%, rgba(45, 106, 106, 0.16), transparent 50%),
        linear-gradient(135deg, #1A2B2B 0%, #243B3B 55%, #2D6A6A 100%);
    color: #F4F9F8;
}

.bo-billing-enterprise.is-selected {
    box-shadow: 0 0 0 2px rgba(232, 168, 124, 0.55);
}

.bo-billing-enterprise .bo-billing-eyebrow {
    color: rgba(244, 249, 248, 0.7);
}

.bo-billing-enterprise h3 {
    margin: 0 0 8px;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.bo-billing-enterprise-copy > p {
    margin: 0 0 16px;
    color: rgba(244, 249, 248, 0.78);
    font-size: 14px;
    max-width: 42ch;
}

.bo-billing-enterprise-list {
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 16px;
}

.bo-billing-enterprise-list li {
    display: flex;
    gap: 8px;
    font-size: 13px;
}

.bo-billing-enterprise-list span {
    color: #E8A87C;
}

.bo-billing-enterprise-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.bo-billing-enterprise-actions .bo-btn-outline {
    border-color: rgba(244, 249, 248, 0.35);
    color: #F4F9F8;
    background: transparent;
}

.bo-billing-enterprise-actions .bo-btn-outline:hover {
    background: rgba(255, 255, 255, 0.08);
}

.bo-billing-enterprise-aside {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    padding: 20px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.bo-billing-enterprise-price {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
}

.bo-billing-enterprise-aside p {
    margin: 0;
    font-size: 13px;
    color: rgba(244, 249, 248, 0.75);
    line-height: 1.5;
}

.bo-billing-compare-details {
    margin-top: 20px;
    border-top: 1px solid var(--color-border);
    padding-top: 16px;
}

.bo-billing-compare-details summary {
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 12px;
}

.bo-billing-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.bo-billing-compare-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    min-width: 640px;
}

.bo-billing-compare-table th,
.bo-billing-compare-table td {
    padding: 10px 14px;
    text-align: center;
    border-bottom: 1px solid var(--color-border);
}

.bo-billing-compare-table thead th {
    background: var(--color-bg-alt);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-text-muted);
}

.bo-billing-compare-table tbody th {
    text-align: left;
    font-weight: 500;
    color: var(--color-text);
    background: var(--color-surface);
}

.bo-billing-compare-table .is-current-col {
    background: rgba(61, 139, 110, 0.08);
}

.bo-billing-compare-table thead .is-current-col {
    color: var(--color-success);
    background: rgba(61, 139, 110, 0.12);
}

.bo-billing-cell-yes {
    color: var(--color-success);
    font-weight: 700;
}

.bo-billing-cell-no {
    color: var(--color-text-light);
}

.bo-billing-empty-invoices {
    padding: 20px;
    border-radius: var(--radius-md);
    background: var(--color-bg);
    border: 1px dashed var(--color-border);
}

.bo-billing-empty-invoices strong {
    display: block;
    margin-bottom: 6px;
    font-size: 15px;
}

.bo-billing-empty-invoices p {
    margin: 0;
    font-size: 14px;
    color: var(--color-text-muted);
    max-width: 48ch;
    line-height: 1.55;
}

@media (max-width: 960px) {
    .bo-billing-dashboard,
    .bo-billing-enterprise {
        grid-template-columns: 1fr;
    }

    .bo-billing-selector {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bo-billing-feature-list--compact,
    .bo-billing-enterprise-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .bo-billing-selector {
        grid-template-columns: 1fr;
    }

    .bo-billing-dash-card {
        padding: 20px;
    }

    .bo-billing-enterprise {
        padding: 22px;
    }
}


/* Dashboard columns */
.bo-dashboard-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: stretch;
}

.bo-dashboard-columns > .bo-card {
    margin: 0;
}

@media (max-width: 768px) {
    .bo-dashboard-columns {
        grid-template-columns: 1fr;
    }
}

/* List links */
.bo-list-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid var(--color-border);
    text-decoration: none;
    color: inherit;
    transition: background var(--transition);
    margin: 0 -8px;
    padding-left: 8px;
    padding-right: 8px;
    border-radius: var(--radius-sm);
}

.bo-list-link:hover { background: var(--color-bg); }

.bo-list-link:last-child { border-bottom: none; }

.bo-list-link strong { font-weight: 600; }

.bo-list-link span { font-size: 13px; color: var(--color-text-muted); }

/* Iframe preview */
.bo-iframe {
    width: 100%;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    min-height: 720px;
}

.bo-form-preview-modal-panel {
    position: relative;
    z-index: 1;
    width: min(960px, 95vw);
    max-height: 92vh;
    margin: 4vh auto;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.18);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.bo-form-preview-modal-body {
    flex: 1;
    min-height: 0;
    background: #f5f5f5;
}

.bo-form-preview-iframe {
    width: 100%;
    height: min(78vh, 900px);
    border: none;
    display: block;
    background: #f5f5f5;
}

/* Breeze form overrides inside backoffice cards */
.bo-card .bg-gray-800 {
    background: var(--color-primary) !important;
}
.bo-card .bg-gray-800:hover,
.bo-card .bg-gray-800:focus {
    background: var(--color-primary-dark) !important;
}
.bo-card .text-indigo-600 { color: var(--color-primary) !important; }
.bo-card .border-gray-300 { border-color: var(--color-border) !important; }
.bo-card .focus\:ring-indigo-500:focus { --tw-ring-color: var(--color-primary) !important; }

.bo-content nav[role="navigation"] { margin-top: 16px; }

/* Plan gating & settings */
.bo-plan-lock {
    padding: 20px 24px;
    background: var(--color-bg-alt);
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-md);
    text-align: center;
}

.bo-plan-lock strong {
    display: block;
    margin-bottom: 6px;
}

.bo-plan-lock p {
    margin: 0 0 14px;
    font-size: 14px;
    color: var(--color-text-muted);
}

.bo-settings-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 16px;
}

.bo-settings-card {
    padding: 20px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    display: flex;
    flex-direction: column;
}

.bo-settings-card h3 {
    margin: 0 0 6px;
    font-size: 16px;
}

.bo-settings-card p {
    margin: 0 0 16px;
    font-size: 14px;
    color: var(--color-text-muted);
    line-height: 1.5;
    flex: 1;
}

.bo-settings-card .bo-btn {
    align-self: flex-start;
    margin-top: auto;
}

.bo-settings-card-locked {
    opacity: 0.85;
    background: var(--color-bg-alt);
}

.bo-settings-upgrade {
    margin: 0 0 12px;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-muted);
}

.bo-check-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 0;
    cursor: pointer;
}

.bo-check-row input { margin-top: 4px; flex-shrink: 0; }

.bo-check-row strong { display: block; }

.bo-check-row .bo-help { display: block; margin-top: 2px; }

.bo-progress-timeline {
    border-left: 2px solid var(--color-border);
    margin-left: 8px;
    padding-left: 20px;
}

.bo-progress-item {
    position: relative;
    padding-bottom: 16px;
}

.bo-progress-dot {
    position: absolute;
    left: -27px;
    top: 4px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--color-primary);
    border: 2px solid var(--color-surface);
    box-shadow: 0 0 0 2px var(--color-primary);
}

.bo-attachments-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 16px;
    margin-bottom: 8px;
}

.bo-attachment {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--color-bg);
}

.bo-attachment-preview {
    display: block;
    width: 100%;
    padding: 0;
    border: none;
    cursor: pointer;
    aspect-ratio: 1;
    overflow: hidden;
    background: var(--color-bg-alt);
}

.bo-attachment-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.bo-attachment-file {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 120px;
    padding: 16px;
    border: none;
    text-align: center;
    text-decoration: none;
    color: var(--color-text);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    background: transparent;
}

.bo-attachment-icon {
    font-size: 28px;
}

.bo-attachment-meta {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 12px;
    font-size: 12px;
    border-top: 1px solid var(--color-border);
    background: var(--color-surface);
}

[x-cloak] { display: none !important; }

body.bo-modal-open { overflow: hidden; }

dialog.bo-dialog {
    border: none;
    border-radius: 12px;
    padding: 0;
    max-width: min(520px, calc(100vw - 2rem));
    width: 100%;
    background: transparent;
    box-shadow: none;
}

dialog.bo-dialog::backdrop {
    background: rgba(15, 23, 42, 0.45);
}

dialog.bo-dialog[open] {
    display: block;
}

.bo-confirm-modal {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.bo-confirm-modal-stacked {
    z-index: 1200;
}

.bo-confirm-modal-fit {
    overflow-y: auto;
    align-items: flex-start;
}

.bo-confirm-modal-fit .bo-confirm-modal-panel {
    margin: auto;
}

.bo-confirm-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.72);
}

.bo-confirm-modal-panel {
    position: relative;
    width: min(440px, 100%);
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

.bo-confirm-modal-panel-wide {
    width: min(520px, 100%);
}

.bo-confirm-modal-panel.bo-consultation-modal {
    width: min(860px, calc(100vw - 32px));
    max-width: none;
}

.bo-confirm-modal-panel-team {
    width: min(600px, 100%);
    max-height: calc(100dvh - 48px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.bo-confirm-modal-panel-team .bo-confirm-modal-header {
    flex-shrink: 0;
}

.bo-confirm-modal-panel-team > form {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.bo-confirm-modal-panel-team .bo-confirm-modal-body {
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}

.bo-confirm-modal-panel-team .bo-permissions-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.bo-confirm-modal-panel-team .bo-permission-option {
    padding: 8px 10px;
}

.bo-confirm-modal-panel-team .bo-permission-option .bo-help {
    font-size: 11px;
    line-height: 1.35;
}

.bo-confirm-modal-panel-team .bo-confirm-modal-footer {
    flex-shrink: 0;
    flex-wrap: wrap;
}

@media (max-width: 560px) {
    .bo-confirm-modal-panel-team .bo-permissions-grid {
        grid-template-columns: 1fr;
    }
}

.bo-integration-summary {
    margin: 0;
    font-size: 13px;
    color: var(--color-text-muted);
    word-break: break-word;
}

.bo-wordpress-key-box {
    margin-top: 12px;
    padding: 12px;
    border-radius: var(--radius-md);
    background: var(--color-bg-alt);
    border: 1px solid var(--color-border);
}

.bo-confirm-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 20px 0;
}

.bo-confirm-modal-title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--color-text);
}

.bo-confirm-modal-close {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-bg);
    color: var(--color-text-muted);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

.bo-confirm-modal-close:hover {
    background: var(--color-bg-alt);
    color: var(--color-text);
}

.bo-confirm-modal-body {
    padding: 12px 20px 20px;
}

.bo-confirm-modal-body p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--color-text-muted);
}

.bo-confirm-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 20px;
    border-top: 1px solid var(--color-border);
    background: var(--color-bg);
}

.bo-confirm-modal-footer-stacked {
    flex-direction: column;
    align-items: stretch;
}

.bo-confirm-modal-footer-stacked .bo-btn {
    width: 100%;
    justify-content: center;
}

.bo-api-endpoints {
    margin: 0;
    padding-left: 20px;
    display: grid;
    gap: 8px;
    overflow-x: auto;
}

.bo-api-endpoints li {
    font-size: 14px;
    color: var(--color-text-muted);
    white-space: nowrap;
}

.bo-api-key {
    font-size: 13px;
    word-break: break-all;
}

.bo-integrations-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}

.bo-integration-card {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.bo-integration-card-connected {
    border-color: rgba(45, 106, 106, 0.35);
    box-shadow: inset 0 0 0 1px rgba(45, 106, 106, 0.08);
}

.bo-integration-card-header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.bo-integration-logo {
    flex-shrink: 0;
    object-fit: contain;
}

.bo-integration-name {
    margin: 0 0 6px;
    font-size: 1rem;
    font-weight: 600;
}

.bo-attachment-modal {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.bo-attachment-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.72);
}

.bo-attachment-modal-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    width: min(960px, 100%);
    max-height: min(90vh, 900px);
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

.bo-attachment-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--color-border);
}

.bo-attachment-modal-title {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.bo-attachment-modal-title strong {
    font-size: 15px;
    word-break: break-word;
}

.bo-attachment-modal-caption {
    font-size: 13px;
    color: var(--color-text-muted);
}

.bo-attachment-modal-close {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-bg);
    color: var(--color-text-muted);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

.bo-attachment-modal-close:hover {
    background: var(--color-bg-alt);
    color: var(--color-text);
}

.bo-attachment-modal-body {
    flex: 1;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: var(--color-bg);
    overflow: auto;
}

.bo-attachment-modal-image {
    display: block;
    max-width: 100%;
    max-height: min(70vh, 720px);
    object-fit: contain;
    border-radius: var(--radius-md);
}

.bo-attachment-modal-pdf {
    width: 100%;
    height: min(70vh, 720px);
    border: none;
    border-radius: var(--radius-md);
    background: #fff;
}

.bo-attachment-modal-file {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 32px;
    text-align: center;
}

.bo-attachment-modal-footer {
    display: flex;
    justify-content: flex-end;
    padding: 12px 20px;
    border-top: 1px solid var(--color-border);
}

.bo-attachment-modal-enter { transition: opacity 0.2s ease; }
.bo-attachment-modal-enter-start,
.bo-attachment-modal-leave-end { opacity: 0; }
.bo-attachment-modal-enter-end,
.bo-attachment-modal-leave-start { opacity: 1; }
.bo-attachment-gallery-compact .bo-attachments-grid {
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 12px;
}

.bo-attachment-gallery-compact .bo-attachment-file {
    min-height: 96px;
    padding: 12px;
}

.bo-branding-logo-preview {
    margin-bottom: 12px;
    padding: 16px;
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    text-align: center;
}

.bo-branding-logo-row {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.bo-branding-logo-thumb {
    flex-shrink: 0;
    width: 96px;
    height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px;
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.bo-branding-logo-thumb img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
}

.bo-branding-logo-placeholder {
    font-size: 12px;
    color: var(--color-text-muted);
    text-align: center;
    line-height: 1.4;
}

.bo-branding-logo-fields {
    flex: 1;
    min-width: 0;
}

.bo-branding-logo-preview img {
    max-height: 80px;
    max-width: 100%;
    object-fit: contain;
}

.bo-branding-section {
    padding-top: 8px;
    border-top: 1px solid var(--color-border);
}

.bo-branding-section-title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 4px;
}

.bo-branding-preview-footer {
    margin-top: 8px;
}

.bo-branding-footer-badge {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-light);
}

.bo-branding-footer-copyright {
    margin: 0;
    font-size: 13px;
    color: var(--color-text-muted);
}

.bo-branding-footer-contact {
    margin-top: 10px;
}

.bo-branding-footer-contact p {
    margin: 0;
    font-size: 13px;
    color: var(--color-text-muted);
    line-height: 1.5;
}

.bo-branding-footer-contact p + p {
    margin-top: 4px;
}

[x-cloak] {
    display: none !important;
}

/* Analytics */
.bo-analytics-section {
    margin-bottom: 0;
}

.bo-analytics-period-bar {
    margin-bottom: 8px;
}

.bo-analytics-period-bar .bo-btn:disabled {
    opacity: 0.6;
    cursor: wait;
    transform: none;
    box-shadow: none;
}

.bo-analytics-content {
    display: flex;
    flex-direction: column;
    gap: 24px;
    transition: opacity 0.15s ease;
}

.bo-analytics-content.bo-analytics-loading {
    opacity: 0.55;
    pointer-events: none;
}

.bo-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

@media (max-width: 600px) {
    .bo-form-row {
        grid-template-columns: 1fr;
    }
}

.bo-analytics-section-head {
    margin-bottom: 16px;
}

.bo-analytics-section-head .bo-section-title {
    margin-bottom: 4px;
    padding-bottom: 0;
    border-bottom: none;
}

.bo-analytics-intro {
    margin: 0 0 16px;
}

.bo-analytics-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

.bo-analytics-grid-nested {
    gap: 32px;
}

.bo-analytics-grid-nested.bo-analytics-insights-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.bo-analytics-insight-block {
    min-width: 0;
}

.bo-analytics-muted {
    color: var(--color-text-muted);
    font-weight: 500;
    font-size: 12px;
}

.bo-analytics-overview .bo-stat-value {
    font-size: 28px;
}

.bo-analytics-template {
    padding: 16px 0;
    border-bottom: 1px solid var(--color-border);
}

.bo-analytics-template:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.bo-analytics-template-name {
    margin: 0 0 12px;
    font-size: 15px;
    font-weight: 600;
}

.bo-analytics-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 20px;
}

.bo-analytics-metric {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 14px;
}

.bo-analytics-metric-label {
    color: var(--color-text-muted);
}

.bo-analytics-metric-value {
    font-weight: 600;
    text-align: right;
}

.bo-analytics-subtitle {
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-text-muted);
}

.bo-analytics-compliance-group + .bo-analytics-compliance-group {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--color-border);
}

.bo-analytics-flag {
    display: inline-block;
    min-width: 2rem;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
}

.bo-analytics-flag-amber {
    background: #FEF3E8;
    color: #8B5E3C;
}

.bo-analytics-flag-red {
    background: #FDF0F0;
    color: #9B2C2C;
}

.bo-analytics-value-green { color: #2D6A4A; }
.bo-analytics-value-amber { color: #B7791F; }
.bo-analytics-value-red { color: #C53030; }

.bo-analytics-ai-stats .bo-stat-value {
    font-size: 28px;
}

.bo-analytics-therapist {
    padding: 16px 0;
    border-bottom: 1px solid var(--color-border);
}

.bo-analytics-therapist:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.bo-analytics-therapist-name {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
}

.bo-analytics-usage-row + .bo-analytics-usage-row {
    margin-top: 16px;
}

.bo-analytics-usage-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 600;
}

.bo-analytics-usage-bar {
    height: 8px;
    background: var(--color-bg);
    border-radius: 999px;
    overflow: hidden;
}

.bo-analytics-usage-bar span {
    display: block;
    height: 100%;
    background: var(--color-primary);
    border-radius: 999px;
}

@media (max-width: 900px) {
    .bo-analytics-grid {
        grid-template-columns: 1fr;
    }

    .bo-analytics-insights-grid {
        grid-template-columns: 1fr;
    }

    .bo-analytics-metrics {
        grid-template-columns: 1fr;
    }
}

/* Responsive */
@media (max-width: 900px) {
    .bo-sidebar {
        transform: translateX(-100%);
        transition: transform var(--transition);
    }

    .bo-sidebar.open { transform: translateX(0); }

    .bo-overlay.open { display: block; }

    .bo-main { margin-left: 0; }

    .bo-mobile-toggle,
    .bo-sidebar-toggle { display: flex; }

    .bo-sidebar-collapse { display: none; }

    .bo-page-header { padding: 56px 20px 0; }

    .bo-content { padding: 20px; }
}

/* Super Admin */
.sa-sidebar {
    background: linear-gradient(180deg, #1a2e35 0%, #0f1c21 100%);
}

.sa-sidebar .bo-nav-item.active {
    background: rgba(74, 155, 155, 0.2);
}

.sa-badge {
    display: inline-block;
    margin-top: 8px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #a8e6cf;
    background: rgba(74, 155, 155, 0.15);
    border: 1px solid rgba(74, 155, 155, 0.35);
    border-radius: 99px;
}

.sa-body {
    --sidebar-width: 248px;
}

.sa-sidebar .bo-nav-label,
.sa-sidebar .sa-nav-heading {
    color: rgba(255,255,255,0.55);
}

.sa-sidebar .bo-nav-item,
.sa-sidebar .sa-nav-heading {
    color: rgba(255,255,255,0.82);
}

.sa-sidebar .bo-nav-item:hover,
.sa-sidebar .sa-nav-heading:hover {
    background: rgba(255,255,255,0.06);
    color: #fff;
}

.sa-sidebar .bo-nav-subitem {
    color: rgba(255,255,255,0.72);
}

.sa-sidebar .bo-nav-subitem:hover,
.sa-sidebar .bo-nav-subitem.active {
    color: #fff;
    background: rgba(74, 155, 155, 0.2);
}

.sa-sidebar .bo-user-name,
.sa-sidebar .bo-user-email {
    color: rgba(255,255,255,0.85);
}

.sa-page-header {
    align-items: flex-start;
}

.sa-header-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 12px;
    margin-left: auto;
}

.sa-search {
    position: relative;
    min-width: min(420px, 100%);
}

.sa-search-input {
    width: 100%;
}

.sa-search-results {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 80;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    box-shadow: 0 12px 40px rgba(15, 28, 33, 0.12);
    max-height: 360px;
    overflow: auto;
}

.sa-search-result {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 14px;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px solid var(--color-border);
}

.sa-search-result:hover {
    background: var(--color-bg);
}

.sa-search-type {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.sa-metric-danger .bo-stat-value { color: #b42318; }
.sa-metric-warning .bo-stat-value { color: #b54708; }

.sa-health-healthy { color: #067647; }
.sa-health-needs_attention { color: #b54708; }
.sa-health-at_risk,
.sa-health-churned { color: #b42318; }

.sa-actions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 8px;
}

.sa-actions-grid form { margin: 0; }

/* Onboarding progress bar on dashboard */
.bo-onboarding-progress {
    position: relative;
    padding: 20px 24px;
    background: linear-gradient(135deg, rgba(45,106,106,0.04), rgba(45,106,106,0.01));
    border: 1px solid rgba(45,106,106,0.15);
}

.bo-onboarding-progress-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.bo-onboarding-progress-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--color-heading);
}

.bo-onboarding-progress-pct {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-primary);
}

.bo-onboarding-progress-bar-wrap {
    height: 6px;
    background: var(--color-border);
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 16px;
}

.bo-onboarding-progress-bar {
    height: 100%;
    background: var(--color-primary);
    border-radius: 3px;
    transition: width 0.5s ease;
}

.bo-onboarding-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.bo-onboarding-steps li {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--color-text-muted);
}

.bo-onboarding-steps li.done {
    color: var(--color-text);
}

.bo-onboarding-step-check {
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 2px solid var(--color-border);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.bo-onboarding-steps li.done .bo-onboarding-step-check {
    background: #16a34a;
    border-color: #16a34a;
    color: #fff;
}

.bo-onboarding-dismiss {
    position: absolute;
    top: 12px;
    right: 12px;
    background: none;
    border: none;
    font-size: 20px;
    color: var(--color-text-muted);
    cursor: pointer;
    line-height: 1;
    padding: 4px;
}

.bo-onboarding-dismiss:hover {
    color: var(--color-text);
}

/* Milestone toast */
.bo-milestone-toast {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 20px;
    background: #fff;
    border: 1px solid #d1fae5;
    border-left: 4px solid #16a34a;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06);
    animation: bo-milestone-in 0.4s ease;
}

@keyframes bo-milestone-in {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: translateY(0); }
}

.bo-milestone-emoji {
    font-size: 24px;
}

.bo-milestone-text {
    font-size: 15px;
    font-weight: 600;
    color: var(--color-heading);
}

.bo-milestone-close {
    margin-left: auto;
    background: none;
    border: none;
    font-size: 18px;
    color: var(--color-text-muted);
    cursor: pointer;
    padding: 4px;
}

.bo-milestone-close:hover {
    color: var(--color-text);
}

/* API & Webhooks */
.bo-webhook-events-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 20px;
    margin-top: 12px;
}

.bo-webhook-event-group h4 {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 8px;
    color: var(--color-heading);
}

.bo-webhook-event-group ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.bo-webhook-event-group ul li {
    font-size: 13px;
    padding: 4px 0;
}

.bo-api-usage-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 12px;
}

.bo-api-usage-stat {
    text-align: center;
    padding: 16px;
    background: var(--color-bg-subtle, #f8f9fb);
    border-radius: 8px;
}

.bo-api-usage-label {
    display: block;
    font-size: 12px;
    color: var(--color-text-muted);
    margin-bottom: 4px;
}

.bo-api-usage-value {
    display: block;
    font-size: 24px;
    font-weight: 700;
    color: var(--color-heading);
}

.bo-confirm-modal-panel-wide {
    max-width: 600px;
}

.bo-confirm-modal-panel.bo-consultation-modal {
    max-width: none;
}

.bo-code-block {
    background: #1e293b;
    border-radius: 8px;
    padding: 16px;
    overflow-x: auto;
}

.bo-code-block pre {
    margin: 0;
}

.bo-code-block code {
    color: #e2e8f0;
    font-size: 13px;
    line-height: 1.6;
    white-space: pre;
}

.bo-link-danger {
    color: #dc2626;
    font-size: 13px;
    text-decoration: none;
    background: none;
    border: none;
    cursor: pointer;
}

.bo-link-danger:hover {
    text-decoration: underline;
}

/* Security settings */
.bo-security-content {
    min-width: 0;
}

.bo-security-status-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
}

.bo-security-status-label {
    font-size: 14px;
    color: var(--color-text-muted);
}

.bo-security-status {
    font-size: 14px;
    font-weight: 600;
}

.bo-security-masked-value {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    letter-spacing: 2px;
    font-size: 16px;
}

.bo-coming-soon-badge {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--color-bg-subtle, #f8f9fb);
    color: var(--color-text-muted);
    font-size: 13px;
    font-weight: 600;
}

.bo-2fa-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 20px;
    border-radius: 12px;
    border: 1px solid #c7d2fe;
    background: linear-gradient(135deg, #eef2ff 0%, #f8fafc 100%);
}

.bo-2fa-banner-content {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.bo-2fa-banner-icon {
    font-size: 24px;
    line-height: 1;
}

.bo-2fa-banner-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--color-heading);
}

.bo-2fa-banner-text {
    margin-top: 4px;
    font-size: 14px;
    color: var(--color-text-muted);
}

.bo-2fa-banner-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.bo-2fa-banner-dismiss {
    background: none;
    border: none;
    font-size: 20px;
    color: var(--color-text-muted);
    cursor: pointer;
    padding: 4px 8px;
    line-height: 1;
}

.bo-2fa-banner-dismiss:hover {
    color: var(--color-text);
}

.bo-activity-banner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 20px;
    border-radius: 12px;
    border: 1px solid #b8e0d8;
    background: linear-gradient(135deg, #eef8f6 0%, #f8fafc 100%);
}

.bo-activity-banner-content {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
}

.bo-activity-banner-icon {
    font-size: 24px;
    line-height: 1;
    flex-shrink: 0;
}

.bo-activity-banner-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--color-heading);
}

.bo-activity-banner-list {
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bo-activity-banner-link {
    display: flex;
    flex-direction: column;
    gap: 2px;
    text-decoration: none;
    color: inherit;
}

.bo-activity-banner-link:hover .bo-activity-banner-entry-title {
    color: var(--color-primary, #2d6a6a);
}

.bo-activity-banner-entry-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-heading);
}

.bo-activity-banner-entry-meta {
    font-size: 13px;
    color: var(--color-text-muted);
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.bo-activity-banner-live {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 600;
    color: #0f766e;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.bo-activity-banner-live-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #14b8a6;
    animation: bo-activity-pulse 1.8s ease-in-out infinite;
}

@keyframes bo-activity-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.55; transform: scale(0.92); }
}

.bo-2fa-wizard-steps {
    display: flex;
    gap: 8px;
    margin-bottom: 24px;
}

.bo-2fa-wizard-step {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 600;
    background: var(--color-bg-subtle, #f8f9fb);
    color: var(--color-text-muted);
}

.bo-2fa-wizard-step.active {
    background: var(--color-primary, #4f46e5);
    color: #fff;
}

.bo-2fa-app-list {
    list-style: none;
    margin: 16px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: var(--color-text);
}

.bo-2fa-app-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    font-weight: 500;
}

.bo-2fa-app-list img {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    flex-shrink: 0;
}

.bo-2fa-qr-wrap {
    margin-top: 20px;
    display: inline-block;
    padding: 12px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid var(--color-border, #e5e7eb);
}

.bo-2fa-qr-wrap svg {
    display: block;
}

.bo-2fa-secret-code {
    margin-top: 12px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 18px;
    letter-spacing: 2px;
    font-weight: 600;
}

.bo-2fa-code-input {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 24px;
    letter-spacing: 6px;
    text-align: center;
}

.bo-2fa-recovery-codes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 16px;
    padding: 16px;
    border-radius: 10px;
    background: var(--color-bg-subtle, #f8f9fb);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 15px;
    font-weight: 600;
}

@media (max-width: 768px) {
    .bo-2fa-banner,
    .bo-activity-banner {
        flex-direction: column;
        align-items: flex-start;
    }

    .bo-2fa-recovery-codes {
        grid-template-columns: 1fr;
    }
}

/* Active sessions */
.bo-session-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.bo-session-badge {
    display: inline-block;
    margin-bottom: 8px;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--color-primary-soft, #eef2ff);
    color: var(--color-primary, #4f46e5);
    font-size: 12px;
    font-weight: 600;
}

.bo-session-browser {
    margin-top: 4px;
    font-size: 15px;
    color: var(--color-text);
}

.bo-session-location,
.bo-session-last-active {
    margin-top: 8px;
}

/* Audit log */
.bo-audit-filters {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-items: end;
}

.bo-audit-date-range .bo-form-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: 12px;
    align-items: end;
}

.bo-audit-table th {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-text-muted);
}

.bo-audit-details-cell {
    max-width: 220px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bo-audit-detail-list {
    margin: 0;
    display: grid;
    gap: 10px;
}

.bo-audit-detail-list > div {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 12px;
    font-size: 14px;
}

.bo-audit-detail-list dt {
    margin: 0;
    font-weight: 600;
    color: var(--color-text-muted);
}

.bo-audit-detail-list dd {
    margin: 0;
    color: var(--color-text);
}

.bo-audit-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
}

.bo-audit-badge-auth { background: #fef3c7; color: #92400e; }
.bo-audit-badge-clients { background: #dcfce7; color: #166534; }
.bo-audit-badge-forms { background: #dbeafe; color: #1d4ed8; }
.bo-audit-badge-consent { background: #ede9fe; color: #6d28d9; }
.bo-audit-badge-treatment { background: #ffedd5; color: #c2410c; }
.bo-audit-badge-security { background: #fee2e2; color: #b91c1c; }
.bo-audit-badge-staff { background: #f5f0eb; color: #78350f; }
.bo-audit-badge-practice { background: #e0f2fe; color: #0369a1; }
.bo-audit-badge-billing { background: #d1fae5; color: #047857; }
.bo-audit-badge-api { background: #f3f4f6; color: #1f2937; }
.bo-audit-badge-integrations { background: #fef9c3; color: #a16207; }
.bo-audit-badge-portal { background: #e0e7ff; color: #4338ca; }
.bo-audit-badge-comms { background: #fce7f3; color: #9d174d; }
.bo-audit-badge-ai { background: #f3e8ff; color: #7e22ce; }
.bo-audit-badge-developer { background: #e5e7eb; color: #374151; }

@media (max-width: 900px) {
    .bo-audit-filters {
        grid-template-columns: 1fr 1fr;
    }

    .bo-audit-date-range .bo-form-row {
        grid-template-columns: 1fr;
    }
}

/* Client history */
.bo-client-history-group + .bo-client-history-group {
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid var(--color-border, #e5e7eb);
}

.bo-client-history-date {
    font-size: 14px;
    font-weight: 700;
    color: var(--color-heading);
    margin-bottom: 12px;
}

.bo-client-history-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.bo-client-history-time {
    flex-shrink: 0;
    font-size: 13px;
    font-weight: 500;
    color: var(--color-text-muted);
    font-variant-numeric: tabular-nums;
}

.bo-client-history-item + .bo-client-history-item {
    border-top: 1px solid var(--color-border, #e5e7eb);
}

.bo-client-history-table-head,
.bo-client-history-item-grid {
    display: grid;
    grid-template-columns: minmax(220px, 1.1fr) minmax(240px, 1.6fr) minmax(150px, 0.8fr);
    gap: 20px 28px;
    align-items: start;
}

.bo-client-history-table-head {
    padding: 0 4px 12px;
    border-bottom: 1px solid var(--color-border, #e5e7eb);
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.bo-client-history-table-head span:last-child {
    text-align: right;
}

.bo-client-history-item-grid {
    padding: 16px 4px;
}

.bo-client-history-item.is-highlighted {
    margin-left: -8px;
    margin-right: -8px;
    padding: 16px 12px;
    border-radius: 12px;
    background: rgba(45, 106, 106, 0.08);
    border-top-color: transparent;
    transition: background 0.25s ease;
}

.bo-client-history-item.is-highlighted + .bo-client-history-item {
    border-top-color: transparent;
}

.bo-client-history-col-action {
    min-width: 0;
}

.bo-client-history-col-detail {
    min-width: 0;
}

.bo-client-history-col-when {
    min-width: 0;
    text-align: right;
}

.bo-client-history-title {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--color-heading);
    line-height: 1.4;
}

.bo-client-history-description {
    margin: 0;
    font-size: 14px;
    color: var(--color-text-muted);
    line-height: 1.5;
}

.bo-client-history-when {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-heading);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.bo-client-history-jump {
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    font-size: 20px;
    font-weight: 700;
    color: var(--color-primary, #2d6a6a);
    cursor: pointer;
    text-decoration: none;
}

.bo-client-history-jump:hover {
    color: var(--color-primary-dark, #1f4f4f);
}

.bo-client-history-actor {
    margin-top: 6px;
    font-size: 13px;
    color: var(--color-text-muted);
}

/* Sent forms + consultation status */
.bo-sent-forms-table th,
.bo-sent-forms-table td {
    vertical-align: middle;
    padding: 12px 10px;
}

.bo-sent-forms-table th {
    font-size: 11px;
}

.bo-table-wrap-sent-forms {
    overflow-x: visible;
    margin: 0;
    padding: 0;
}

.bo-sent-forms-date {
    color: var(--color-text-muted);
    white-space: nowrap;
    font-size: 13px;
}

.bo-consultation-status-text {
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
}

.bo-consultation-status-draft { color: #6b7280; }
.bo-consultation-status-sent { color: #2563eb; }
.bo-consultation-status-delivered { color: #0d9488; }
.bo-consultation-status-opened { color: #7c3aed; }
.bo-consultation-status-in-progress { color: #ea580c; }
.bo-consultation-status-completed { color: #16a34a; }
.bo-consultation-status-expired { color: #dc2626; }

.bo-consultation-modal-kicker {
    margin: 0 0 20px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.bo-consultation-modal-layout {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.bo-consultation-modal-card {
    padding: 16px 18px;
    border: 1px solid var(--color-border, #e5e7eb);
    border-radius: 12px;
    background: var(--color-surface, #fff);
}

.bo-consultation-modal-columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 1fr);
    gap: 32px;
    align-items: start;
}

@media (max-width: 768px) {
    .bo-confirm-modal-panel.bo-consultation-modal {
        width: min(100%, calc(100vw - 16px));
    }

    .bo-consultation-modal-columns {
        grid-template-columns: 1fr;
    }
}

.bo-consultation-modal-status-heading {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 16px;
    font-weight: 700;
}

.bo-consultation-modal-status-message,
.bo-consultation-modal-status-elapsed {
    margin: 8px 0 0;
    font-size: 14px;
    color: var(--color-text-muted);
    line-height: 1.5;
}

.bo-consultation-modal-status-elapsed {
    margin-top: 4px;
    color: var(--color-heading);
    font-weight: 600;
}

.bo-consultation-modal-divider,
.bo-consultation-summary-divider {
    height: 1px;
    background: var(--color-border, #e5e7eb);
    margin: 16px 0;
}

.bo-consultation-last-updated {
    margin: 24px 0 0;
    padding-top: 16px;
    border-top: 1px solid var(--color-border, #e5e7eb);
    font-size: 12px;
    color: var(--color-text-muted);
}

.bo-consultation-step-enter {
    transition: all 0.35s ease;
}

.bo-consultation-step-enter-start {
    opacity: 0;
    transform: translateY(-4px);
}

.bo-consultation-step-enter-end {
    opacity: 1;
    transform: translateY(0);
}

.bo-consultation-stepper {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bo-consultation-stepper-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    text-align: left;
}

.bo-consultation-stepper-row.is-complete .bo-consultation-stepper-marker,
.bo-consultation-stepper-row.is-complete .bo-consultation-stepper-label {
    color: var(--color-heading);
}

.bo-consultation-stepper-row.is-pending .bo-consultation-stepper-marker,
.bo-consultation-stepper-row.is-pending .bo-consultation-stepper-label,
.bo-consultation-stepper-row.is-pending .bo-consultation-stepper-when {
    color: #9ca3af;
}

.bo-consultation-stepper-marker {
    width: 18px;
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}

.bo-consultation-stepper-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.bo-consultation-stepper-label {
    font-size: 15px;
    font-weight: 600;
}

.bo-consultation-stepper-when {
    font-size: 13px;
    color: var(--color-text-muted);
}

.bo-consultation-delivery-row,
.bo-consultation-delivery-detail {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    font-size: 14px;
}

.bo-consultation-delivery-detail {
    margin-top: 8px;
    color: var(--color-text-muted);
}

.bo-consultation-delivery-label {
    color: var(--color-heading);
    font-weight: 600;
}

.bo-consultation-summary-list {
    margin: 8px 0 0;
}

.bo-consultation-summary-list div {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 8px 16px;
    align-items: baseline;
    font-size: 14px;
}

.bo-consultation-summary-list dt {
    margin: 0;
    color: var(--color-text-muted);
    font-weight: 600;
    white-space: nowrap;
}

.bo-consultation-summary-list dd {
    margin: 0;
    color: var(--color-heading);
    font-weight: 500;
    min-width: 0;
    word-break: normal;
    overflow-wrap: break-word;
}

.bo-client-history-summary {
    padding: 18px 20px;
    border: 1px solid var(--color-border, #e5e7eb);
    border-radius: 12px;
    background: var(--color-surface-muted, #f9fafb);
}

.bo-client-history-summary-header {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.bo-client-history-summary-header strong {
    font-size: 18px;
    color: var(--color-heading);
}

.bo-client-history-summary-divider {
    height: 1px;
    background: var(--color-border, #e5e7eb);
    margin: 16px 0;
}

.bo-client-history-summary-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px 24px;
    margin: 0;
}

.bo-client-history-summary-stats div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.bo-client-history-summary-stats dt {
    margin: 0;
    font-size: 13px;
    color: var(--color-text-muted);
    font-weight: 600;
}

.bo-client-history-summary-stats dd {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    color: var(--color-heading);
}

.bo-client-history-stat-outstanding dd {
    color: #d97706;
}

.bo-client-history-stat-completed dd {
    color: #16a34a;
}

.bo-client-history-stat-notes dd {
    color: #2563eb;
}

.bo-client-history-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px;
}

.bo-client-history-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    margin-top: 24px;
}

.bo-client-history-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.bo-client-history-filter {
    border: 1px solid var(--color-border, #e5e7eb);
    background: var(--color-surface, #fff);
    color: var(--color-text-muted);
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.bo-client-history-filter:hover {
    color: var(--color-heading);
    border-color: #cbd5e1;
}

.bo-client-history-filter.is-active {
    background: var(--color-primary, #2d6a6a);
    border-color: var(--color-primary, #2d6a6a);
    color: #fff;
}

.bo-client-history-search {
    flex: 1 1 240px;
    max-width: 320px;
}

.bo-client-history-export {
    position: relative;
}

.bo-client-history-export-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 140px;
    padding: 6px;
    border: 1px solid var(--color-border, #e5e7eb);
    border-radius: 10px;
    background: var(--color-surface, #fff);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
    z-index: 20;
}

.bo-client-history-export-menu a {
    display: block;
    padding: 10px 12px;
    border-radius: 8px;
    color: var(--color-heading);
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
}

.bo-client-history-export-menu a:hover {
    background: var(--color-surface-muted, #f9fafb);
}

.bo-client-history-loading {
    margin-top: 16px;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.bo-consultation-timeline-divider {
    height: 1px;
    background: var(--color-border, #e5e7eb);
    margin: 16px 0;
}

.bo-consultation-timeline-detailed .bo-consultation-timeline-entry {
    text-align: center;
}

.bo-consultation-timeline-icon {
    font-size: 22px;
    line-height: 1.2;
    margin-bottom: 6px;
}

.bo-consultation-timeline-label {
    font-size: 15px;
    font-weight: 600;
    color: var(--color-heading);
}

.bo-consultation-timeline-when {
    margin-top: 4px;
    font-size: 14px;
    color: var(--color-text-muted);
}

.bo-consultation-timeline-compact-row {
    display: grid;
    grid-template-columns: 52px 1fr;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--color-border, #e5e7eb);
}

.bo-consultation-timeline-compact-row:last-child {
    border-bottom: none;
}

.bo-consultation-timeline-compact-time {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-heading);
    font-variant-numeric: tabular-nums;
}

.bo-consultation-timeline-compact-label {
    font-size: 14px;
    color: var(--color-text-muted);
}


@media (max-width: 1100px) {
    .bo-table-wrap-sent-forms {
        overflow-x: auto;
        margin: 0 -24px;
        padding: 0 24px;
    }
}

@media (max-width: 900px) {
    .bo-client-history-summary-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bo-client-history-table-head {
        display: none;
    }

    .bo-client-history-item-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .bo-client-history-col-when {
        text-align: left;
    }

    .bo-audit-filters {
        grid-template-columns: 1fr;
    }

    .bo-session-card {
        flex-direction: column;
    }
}

/* Devices */
.bo-device-section-label {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-muted);
    margin-bottom: 4px;
}

.bo-device-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.bo-device-card--current {
    flex-direction: column;
    align-items: stretch;
}

.bo-device-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 8px 0 12px;
    font-size: 14px;
    font-weight: 600;
    color: #15803d;
}

.bo-device-browser,
.bo-device-name {
    margin: 0;
    font-size: 15px;
    color: var(--color-text);
}

.bo-device-name {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-heading);
}

.bo-device-location,
.bo-device-last-active,
.bo-device-first-signed {
    margin-top: 8px;
}

.bo-device-meta {
    margin: 16px 0 0;
}

.bo-device-meta-row {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 8px;
    padding: 6px 0;
    font-size: 14px;
}

.bo-device-meta-row dt {
    color: var(--color-text-muted);
}

.bo-device-meta-row dd {
    margin: 0;
    color: var(--color-heading);
    font-weight: 500;
}

.bo-device-trusted {
    margin-top: 16px;
    padding: 14px 16px;
    border-radius: 10px;
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
}

.bo-device-trusted-title {
    font-size: 14px;
    font-weight: 700;
    color: #166534;
    margin-bottom: 6px;
}

.bo-device-card-button {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: none;
    text-align: left;
    cursor: pointer;
}

.bo-device-card-main {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.bo-device-emoji {
    font-size: 28px;
    line-height: 1;
}

.bo-device-signout-all {
    margin-top: 8px;
}

.bo-device-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.bo-device-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
}

.bo-device-modal-panel {
    position: relative;
    width: min(100%, 480px);
    background: #fff;
    border-radius: 14px;
    padding: 24px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.18);
}

.bo-device-modal-close {
    position: absolute;
    top: 12px;
    right: 14px;
    border: 0;
    background: none;
    font-size: 24px;
    color: var(--color-text-muted);
    cursor: pointer;
}

.bo-security-activity-list {
    list-style: none;
    margin: 16px 0 0;
    padding: 0;
    display: grid;
    gap: 12px;
}

.bo-security-activity-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 12px 0;
    border-bottom: 1px solid var(--color-border, #e5e7eb);
}

.bo-security-activity-item:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.bo-security-activity-icon {
    color: #15803d;
    font-weight: 700;
}

.bo-security-activity-label {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: var(--color-heading);
}

.bo-security-activity-detail {
    display: block;
    margin-top: 2px;
    font-size: 14px;
    color: var(--color-text-muted);
}

/* Active sessions page */
.bo-session-status-card {
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
}

.bo-session-status-list {
    list-style: none;
    margin: 16px 0 0;
    padding: 0;
    display: grid;
    gap: 10px;
}

.bo-session-status-list li {
    font-size: 14px;
    color: var(--color-text);
}

.bo-session-status-list li.ok {
    color: #166534;
}

.bo-session-status-list li.warn {
    color: #b45309;
}

.bo-session-status-list li.muted {
    color: var(--color-text-muted);
}

.bo-session-alert-detail {
    display: grid;
    gap: 2px;
    margin-top: 6px;
    color: var(--color-text-muted);
    font-size: 13px;
}

.bo-session-badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--color-primary-soft, #eef2ff);
    color: var(--color-primary, #4f46e5);
    font-size: 12px;
    font-weight: 600;
}

.bo-recent-signins {
    margin-top: 16px;
    border-top: 1px solid var(--color-border, #e5e7eb);
}

.bo-recent-signin-item {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr);
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid var(--color-border, #e5e7eb);
}

.bo-recent-signin-item:last-child {
    border-bottom: 0;
}

.bo-recent-signin-date {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-heading);
}

.bo-recent-signin-detail {
    font-size: 14px;
    color: var(--color-text);
}

.bo-recent-signin-status {
    margin-top: 4px;
    font-size: 13px;
    font-weight: 600;
}

.bo-recent-signin-status--success {
    color: #166534;
}

.bo-recent-signin-status--failed {
    color: #b91c1c;
}

.bo-device-emoji--modal {
    font-size: 34px;
    margin-bottom: 10px;
}

@media (max-width: 768px) {
    .bo-recent-signin-item {
        grid-template-columns: 1fr;
        gap: 6px;
    }
}

@media (max-width: 768px) {
    .bo-device-card {
        flex-direction: column;
    }

    .bo-device-meta-row {
        grid-template-columns: 1fr;
        gap: 2px;
    }
}

.bo-dashboard-day-summary {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
}

.bo-dashboard-day-summary li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--bo-border, #e2e8f0);
    font-size: 0.95rem;
}

.bo-dashboard-day-summary li:last-child { border-bottom: 0; }
.bo-dashboard-day-summary span:first-child { color: var(--bo-text-muted, #64748b); }
.bo-dashboard-day-summary strong { font-weight: 700; }

/* Booking settings ? business hours */
.bo-business-hours {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bo-business-hours-head,
.bo-business-hours-row {
    display: grid;
    grid-template-columns: minmax(110px, 1.1fr) minmax(120px, 1fr) minmax(120px, 1fr) minmax(120px, 1fr);
    gap: 12px;
    align-items: end;
}

.bo-business-hours-head {
    padding: 0 2px 4px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--color-text-muted, #6b7280);
}

.bo-business-hours-day {
    display: flex;
    align-items: center;
    min-height: 42px;
}

.bo-business-hours-day .bo-label {
    margin: 0;
}

.bo-business-hours-mobile-label {
    display: none;
}

.bo-business-hours-row.is-closed .bo-field:nth-child(3),
.bo-business-hours-row.is-closed .bo-field:nth-child(4) {
    opacity: 0.45;
    pointer-events: none;
}

.bo-practitioner-closed-label {
    display: flex;
    align-items: center;
    min-height: 42px;
    color: var(--bo-text-muted, #64748b);
    font-weight: 600;
}

.bo-business-hours-row.is-closed input:disabled {
    background: #f3f4f6;
    color: #9ca3af;
    cursor: not-allowed;
}

@media (max-width: 720px) {
    .bo-business-hours-head {
        display: none;
    }

    .bo-business-hours-row {
        grid-template-columns: 1fr 1fr;
        gap: 10px 12px;
        padding: 12px;
        border: 1px solid var(--color-border, #e5e7eb);
        border-radius: 10px;
    }

    .bo-business-hours-day {
        grid-column: 1 / -1;
        min-height: auto;
    }

    .bo-business-hours-mobile-label {
        display: block;
    }
}

/* Public / sales live demo chrome */
.demo-live-banner {
    position: sticky;
    top: 0;
    z-index: 200;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    padding: 10px 20px;
    background: var(--color-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}

.demo-live-banner-actions {
    display: inline-flex;
    align-items: center;
    gap: 14px;
}

.demo-live-banner a,
.demo-live-banner button {
    color: #fff;
    background: transparent;
    border: 0;
    padding: 0;
    font: inherit;
    font-weight: 700;
    text-decoration: underline;
    cursor: pointer;
}

.demo-live-banner-exit {
    display: inline;
    margin: 0;
}

.impersonation-banner {
    position: sticky;
    top: 0;
    z-index: 250;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    padding: 10px 20px;
    background: #7c2d12;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}

.impersonation-banner-email {
    font-weight: 500;
    opacity: 0.9;
}

.impersonation-banner-form {
    display: inline;
    margin: 0;
}

.impersonation-banner button {
    color: #fff;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 6px;
    padding: 6px 12px;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.impersonation-banner button:hover {
    background: rgba(255, 255, 255, 0.12);
}

.bo-body.bo-impersonating .bo-sidebar {
    top: 46px;
    height: calc(100vh - 46px);
    bottom: auto;
}

.bo-app-demo .bo-sidebar {
    top: 42px;
    height: calc(100vh - 42px);
    bottom: auto;
}

.demo-welcome {
    position: fixed;
    inset: 0;
    z-index: 400;
    display: grid;
    place-items: center;
    padding: 24px;
}

.demo-welcome-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(26, 43, 43, 0.45);
}

.demo-welcome-panel {
    position: relative;
    width: min(480px, 100%);
    padding: 28px 28px 22px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 24px 60px rgba(26, 43, 43, 0.22);
}

.demo-welcome-kicker {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-primary);
}

.demo-welcome-panel h2 {
    margin: 0 0 10px;
    font-size: 1.45rem;
    letter-spacing: -0.02em;
    line-height: 1.25;
}

.demo-welcome-lead {
    margin: 0 0 16px;
    color: var(--color-text-muted);
    font-size: 14px;
}

.demo-welcome-checklist {
    list-style: none;
    margin: 0 0 22px;
    padding: 0;
    display: grid;
    gap: 8px;
}

.demo-welcome-checklist li {
    position: relative;
    padding-left: 22px;
    font-size: 14px;
    font-weight: 600;
}

.demo-welcome-checklist li::before {
    content: '?';
    position: absolute;
    left: 0;
    color: var(--color-primary);
}

.demo-welcome-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 12px;
}

.demo-welcome-footnote {
    margin: 0;
    font-size: 12px;
    color: var(--color-text-light);
}

/* Guided live demo tour chrome */
.demo-tour-chrome {
    position: sticky;
    top: 42px;
    z-index: 190;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    padding: 10px 20px;
    background: #fff;
    border-bottom: 1px solid var(--color-border);
}

.demo-tour-crumbs {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: var(--color-text-muted);
}

.demo-tour-crumbs strong {
    color: var(--color-text);
}

.demo-tour-progress {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.demo-tour-progress-dot {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    color: var(--color-text-muted);
    background: var(--color-bg);
    border: 1px solid var(--color-border);
}

.demo-tour-progress-dot.is-done {
    color: #fff;
    background: var(--color-primary);
    border-color: var(--color-primary);
}

.demo-tour-progress-dot.is-current {
    box-shadow: 0 0 0 3px rgba(45, 106, 106, 0.18);
    color: #fff;
    background: var(--color-primary);
    border-color: var(--color-primary);
}

.demo-tour-progress-line {
    width: 10px;
    height: 2px;
    background: var(--color-border);
}

.demo-tour-next {
    font-size: 13px;
    font-weight: 700;
    color: var(--color-primary);
    text-decoration: none;
    white-space: nowrap;
}

.demo-tour-next:hover {
    text-decoration: underline;
}

.demo-sample-notice {
    margin: 0;
    padding: 8px 20px;
    font-size: 12px;
    color: var(--color-text-muted);
    background: var(--color-bg-alt);
    border-bottom: 1px solid var(--color-border);
}

.demo-welcome-panel-tour {
    width: min(520px, 100%);
}

.demo-welcome-steps {
    list-style: none;
    margin: 0 0 20px;
    padding: 0;
    display: grid;
    gap: 8px;
}

.demo-welcome-steps li {
    display: grid;
    grid-template-columns: 28px 1fr;
    gap: 10px;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
}

.demo-welcome-step-num {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    color: var(--color-primary);
    background: rgba(45, 106, 106, 0.1);
}

.demo-welcome-steps-done .demo-welcome-step-num {
    color: #fff;
    background: var(--color-primary);
}

.bo-app-demo .bo-sidebar {
    top: 130px;
    height: calc(100vh - 130px);
}

@media (max-width: 900px) {
    .demo-tour-progress { display: none; }
    .bo-app-demo .bo-sidebar {
        top: 0;
        height: 100vh;
    }
}

.bo-review-note-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
    gap: 24px;
    align-items: start;
}

.bo-review-note-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.bo-review-note-fields,
.bo-review-note-sections {
    display: grid;
    gap: 14px;
}

.bo-review-note-section h4 {
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 650;
    color: var(--color-text-muted);
}

.bo-review-note-section p {
    margin: 0;
    white-space: pre-wrap;
    line-height: 1.55;
}

.bo-pain-slider input[type="range"] {
    width: 100%;
    accent-color: var(--color-primary);
}

.bo-pain-slider-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 6px;
    font-size: 13px;
    color: var(--color-text-muted);
}

.bo-review-note-previous {
    margin-top: 0;
}

@media (max-width: 900px) {
    .bo-review-note-layout,
    .bo-review-note-meta {
        grid-template-columns: 1fr;
    }

    .bo-review-note-previous {
        margin-top: 8px;
    }
}

.bo-app-hub-actions {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    margin: 0 0 1.5rem;
}

.bo-app-hub-actions > .bo-card {
    margin-top: 0;
}

a.bo-app-hub-action {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    height: 100%;
    min-height: 118px;
    text-decoration: none;
    color: inherit;
    padding: 1rem 1.1rem;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

a.bo-app-hub-action:hover {
    border-color: var(--color-primary, #2d6a6a);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
}

a.bo-app-hub-action strong {
    display: block;
    margin-bottom: 0.2rem;
}

a.bo-app-hub-action .bo-help {
    margin: 0;
}

.bo-app-hub-stat {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.bo-app-hub-stat span {
    font-size: 1.35rem;
    font-weight: 700;
}

.bo-app-workspace {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
}

.bo-app-workspace > .bo-card {
    margin-top: 0;
}

.bo-app-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--color-border, rgba(0,0,0,.06));
}

.bo-app-row-meta {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-shrink: 0;
}

@media (max-width: 900px) {
    .bo-app-hub-actions,
    .bo-app-workspace {
        grid-template-columns: 1fr;
    }
}

.bo-pos-terminal {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.bo-pos-terminal > .bo-card {
    margin-top: 0;
}

.bo-pos-subhead {
    margin: 0.5rem 0 0;
    font-size: 0.95rem;
}

.bo-pos-option {
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
    padding: 12px 14px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md, 10px);
    background: var(--color-surface);
}

.bo-pos-option.is-disabled {
    opacity: 0.55;
}

.bo-pos-option input {
    margin-top: 3px;
}

.bo-pos-option strong {
    display: block;
}

.bo-pos-option .bo-help {
    margin: 4px 0 0;
}

.bo-pos-reader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 12px 0;
    border-bottom: 1px solid var(--color-border);
}

.bo-pos-reader-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.bo-pos-status {
    font-size: 0.85rem;
    font-weight: 700;
}

.bo-pos-status-waiting { color: #b45309; }
.bo-pos-status-online { color: #15803d; }
.bo-pos-status-offline { color: #b91c1c; }

.bo-pos-connect {
    padding-top: 8px;
}

.bo-pos-stripe-banner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.bo-pos-stripe-banner.is-connected strong {
    color: #15803d;
}

.bo-pos-payopt-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0.85rem;
}

.bo-pos-payopt-card {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    margin-top: 0;
}

.bo-pos-payopt-icon {
    color: var(--color-primary, #2d6a6a);
}

.bo-pos-payopt-title {
    margin: 0;
    font-size: 1rem;
}

.bo-pos-payopt-ready {
    margin: 0;
    font-weight: 700;
    color: #15803d;
}

.bo-pos-payopt-pending {
    margin: 0;
    color: #64748b;
    font-size: 0.88rem;
}

.bo-pos-terminal-empty {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    align-items: flex-start;
}

.bo-pos-device {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem 1rem;
    padding: 0.85rem 0;
    border-bottom: 1px solid var(--color-border, rgba(15, 23, 42, 0.12));
}

.bo-pos-device:last-of-type {
    border-bottom: 0;
}

.bo-pos-device-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.bo-pos-device-status {
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.bo-pos-device-status.is-online { color: #15803d; }
.bo-pos-device-status.is-offline { color: #b91c1c; }
.bo-pos-device-status.is-waiting { color: #b45309; }

.bo-pos-device-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
}

.bo-pos-device-manage {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: center;
}

.bo-pos-device-rename {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    flex: 1 1 14rem;
}

.bo-pos-order-card {
    margin-top: 0;
}

.bo-pos-reader-promo {
    margin-top: 0;
    padding: 0;
    overflow: hidden;
}

.bo-pos-reader-promo-body {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    align-items: center;
    gap: 1.25rem;
    min-height: 240px;
}

.bo-pos-reader-promo-copy {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    padding: 1.15rem 0 1.15rem 1.15rem;
}

.bo-pos-reader-promo-lead {
    margin: 0;
    color: var(--color-text-muted, #64748b);
    font-size: 0.92rem;
    line-height: 1.45;
}

.bo-pos-reader-promo-model {
    margin: 0.15rem 0 0;
    font-size: 1rem;
    font-weight: 700;
}

.bo-pos-reader-promo-tagline {
    margin: 0;
    color: var(--color-text-muted, #64748b);
    font-size: 0.88rem;
    line-height: 1.4;
}

.bo-pos-reader-promo-features {
    margin: 0.15rem 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.25rem 1rem;
    font-size: 0.86rem;
    line-height: 1.35;
}

.bo-pos-reader-promo-features li {
    position: relative;
    padding-left: 1.15rem;
}

.bo-pos-reader-promo-features li::before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 0;
    color: #15803d;
    font-weight: 700;
}

.bo-pos-reader-promo-pricing {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    margin-top: 0.15rem;
}

.bo-pos-reader-promo-pricing strong {
    font-size: 0.95rem;
}

.bo-pos-reader-promo-pricing span {
    color: var(--color-text-muted, #64748b);
    font-size: 0.82rem;
    line-height: 1.35;
}

.bo-pos-reader-promo-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.25rem;
}

.bo-pos-reader-promo-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 220px;
    padding: 0.75rem 1.15rem 0.75rem 0;
    background: linear-gradient(180deg, rgba(241, 245, 249, 0.65) 0%, rgba(248, 250, 252, 0.2) 100%);
}

.bo-pos-reader-promo-visual img {
    width: min(100%, 210px);
    height: auto;
    max-height: 230px;
    object-fit: contain;
}

.bo-pos-order-points {
    margin: 0;
    padding-left: 1.1rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

@media (max-width: 900px) {
    .bo-pos-payopt-grid {
        grid-template-columns: 1fr;
    }

    .bo-pos-device {
        grid-template-columns: 1fr;
    }

    .bo-pos-reader-promo-body {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .bo-pos-reader-promo-copy {
        padding: 1.15rem;
    }

    .bo-pos-reader-promo-visual {
        min-height: 180px;
        padding: 0 1.15rem 1.15rem;
    }

    .bo-pos-reader-promo-features {
        grid-template-columns: 1fr;
    }
}

.bo-pos-order {
    padding-top: 4px;
}

.bo-pos-dashboard {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-bottom: 0.5rem;
}

.bo-pos-dashboard .bo-card + .bo-card {
    margin-top: 0;
}

.bo-pos-section {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.bo-pos-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
}

.bo-pos-section-title {
    margin: 0;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--bo-muted, #64748b);
}

.bo-pos-section-meta {
    font-size: 0.82rem;
    color: var(--bo-muted, #64748b);
}

.bo-pos-panel-title {
    margin: 0 0 0.65rem;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--bo-text, #0f172a);
}

.bo-pos-text-link {
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--color-primary, #2d6a6a);
    text-decoration: none;
    white-space: nowrap;
}

.bo-pos-text-link:hover {
    text-decoration: underline;
}

.bo-pos-kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.bo-pos-kpi-card {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-height: 92px;
    padding: 0.9rem 1rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.bo-pos-kpi-label {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--bo-muted, #64748b);
}

.bo-pos-kpi-value {
    font-size: 1.45rem;
    line-height: 1.1;
    font-weight: 700;
    color: var(--bo-text, #0f172a);
}

.bo-pos-kpi-meta {
    font-size: 0.78rem;
    color: var(--bo-muted, #64748b);
}

.bo-pos-primary-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.85fr) minmax(260px, 1fr);
    gap: 0.75rem;
    align-items: stretch;
}

.bo-pos-side-col {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-width: 0;
}

.bo-pos-sale-card,
.bo-pos-terminal-card,
.bo-pos-ready-card {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    padding: 0.75rem 0.95rem;
    margin-top: 0;
}

.bo-pos-sale-empty {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.bo-pos-sale-selected {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.bo-pos-selected-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.bo-pos-selected-name {
    display: block;
    font-size: 1.05rem;
    margin-bottom: 0.15rem;
}

.bo-pos-current-sale {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0.75rem;
    border-radius: 10px;
    background: rgba(45, 106, 106, 0.07);
    font-size: 0.88rem;
}

.bo-pos-current-sale strong {
    font-size: 1.05rem;
}

.bo-pos-continue-sale {
    align-self: flex-start;
}

.bo-pos-ready-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
}

.bo-pos-ready-head .bo-pos-panel-title {
    margin-bottom: 0;
}

.bo-pos-ready-count {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--bo-muted, #64748b);
    white-space: nowrap;
}

.bo-pos-ready-list {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.bo-pos-ready-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    padding: 0.5rem 0.6rem;
    border-radius: 8px;
    background: rgba(45, 106, 106, 0.06);
    color: inherit;
    text-decoration: none;
    font-size: 0.82rem;
}

.bo-pos-ready-link:hover {
    background: rgba(45, 106, 106, 0.12);
}

.bo-pos-ready-link-text {
    min-width: 0;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bo-pos-ready-link-action {
    flex-shrink: 0;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--color-primary, #2d6a6a);
}

.bo-pos-ready-empty-title {
    margin: 0;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--bo-text, #0f172a);
}

.bo-pos-ready-empty-text {
    margin: 0;
    font-size: 0.8rem;
    color: var(--bo-muted, #64748b);
}

.bo-pos-field {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.bo-pos-field-label {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--bo-muted, #64748b);
}

.bo-pos-search-wrap {
    position: relative;
    max-width: 28rem;
}

.bo-pos-search-wrap .bo-input {
    width: 100%;
}

.bo-pos-walkin {
    align-self: flex-start;
}

.bo-pos-client-results {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 5;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.1));
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
    overflow: hidden;
}

.bo-pos-client-option {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.1rem;
    width: 100%;
    padding: 0.65rem 0.8rem;
    border: 0;
    background: #fff;
    text-align: left;
    cursor: pointer;
}

.bo-pos-client-option:hover {
    background: rgba(45, 106, 106, 0.06);
}

.bo-pos-selected-client {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0.45rem 0.65rem;
    border-radius: 8px;
    background: rgba(45, 106, 106, 0.08);
    font-size: 0.84rem;
    font-weight: 600;
    width: fit-content;
}

.bo-pos-quick-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.bo-pos-start-sale {
    margin-top: auto;
    width: fit-content;
    min-width: 11rem;
}

.bo-pos-terminal-card .bo-pos-panel-title {
    margin-bottom: 0.35rem;
}

.bo-pos-terminal-status {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    flex: 1;
}

.bo-pos-status-dot {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    margin-top: 0.35rem;
    flex-shrink: 0;
}

.bo-pos-status-online,
.bo-pos-status-ready {
    background: #15803d;
    box-shadow: 0 0 0 3px rgba(21, 128, 61, 0.12);
}

.bo-pos-status-waiting {
    background: #b45309;
    box-shadow: 0 0 0 3px rgba(180, 83, 9, 0.12);
}

.bo-pos-status-unconfigured {
    background: #94a3b8;
    box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.12);
}

.bo-pos-status-offline {
    background: #b91c1c;
    box-shadow: 0 0 0 3px rgba(185, 28, 28, 0.12);
}

.bo-pos-tap-note {
    margin: 0;
    font-size: 0.78rem;
}

.bo-pos-checkout-queue {
    padding: 0.35rem 0.85rem;
    margin-top: 0;
}

.bo-pos-checkout-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.65rem 0;
    border-top: 1px solid var(--color-border, rgba(15, 23, 42, 0.06));
}

.bo-pos-checkout-row:first-child {
    border-top: 0;
}

.bo-pos-checkout-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background: rgba(45, 106, 106, 0.12);
    color: var(--color-primary, #2d6a6a);
    font-size: 0.72rem;
    font-weight: 700;
}

.bo-pos-checkout-main {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.bo-pos-checkout-main .bo-help {
    margin: 0;
}

.bo-pos-checkout-amount {
    white-space: nowrap;
}

.bo-pos-activity-card {
    padding: 0.85rem 1rem;
    margin-top: 0;
}

.bo-pos-activity-card--empty {
    padding-bottom: 0.65rem;
}

.bo-pos-activity-card--empty .bo-pos-empty {
    padding: 0.85rem 0.5rem 0.35rem;
}

.bo-pos-activity-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.35rem;
}

.bo-pos-activity-head .bo-pos-panel-title {
    margin-bottom: 0;
}

.bo-pos-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 1.25rem 1rem 0.75rem;
    text-align: center;
}

.bo-pos-empty-title {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--bo-text, #0f172a);
}

.bo-pos-empty-text {
    margin: 0 0 0.35rem;
    font-size: 0.84rem;
    color: var(--bo-muted, #64748b);
}

.bo-pos-activity-table {
    display: flex;
    flex-direction: column;
}

.bo-pos-activity-row {
    display: grid;
    grid-template-columns: 3.25rem 6.5rem minmax(0, 1fr) 4.5rem 3.5rem 4.5rem;
    gap: 0.55rem;
    align-items: center;
    padding: 0.5rem 0;
    border-top: 1px solid var(--color-border, rgba(15, 23, 42, 0.06));
    font-size: 0.84rem;
}

.bo-pos-activity-row:first-child {
    border-top: 0;
}

.bo-pos-activity-row--head {
    padding-top: 0;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--bo-muted, #64748b);
}

.bo-pos-activity-row strong {
    text-align: right;
}

.bo-pos-activity-status {
    font-size: 0.78rem;
    font-weight: 600;
    color: #15803d;
}

.bo-pos-snapshot-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    align-items: start;
}

.bo-pos-snapshot-card {
    display: flex;
    flex-direction: column;
    align-self: start;
    gap: 0.35rem;
    padding: 0.9rem 1rem;
    margin-top: 0;
}

.bo-pos-snapshot-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.86rem;
}

.bo-pos-snapshot-empty {
    margin: 0.15rem 0 0;
    font-size: 0.84rem;
    color: var(--bo-muted, #64748b);
}

.bo-pos-manage-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    align-items: start;
}

.bo-pos-manage-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    padding: 0.85rem 0.95rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    border-radius: 12px;
    background: #fff;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
    cursor: pointer;
}

.bo-pos-manage-card:hover {
    border-color: var(--color-primary, #2d6a6a);
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
}

.bo-pos-manage-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    background: rgba(45, 106, 106, 0.08);
    color: var(--color-primary, #2d6a6a);
    flex-shrink: 0;
}

.bo-pos-manage-icon .bo-heading-icon {
    width: 1.1rem;
    height: 1.1rem;
}

.bo-pos-manage-copy {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.bo-pos-manage-copy strong {
    font-size: 0.9rem;
}

.bo-pos-manage-copy span {
    font-size: 0.8rem;
    color: var(--bo-muted, #64748b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bo-pos-manage-arrow {
    color: var(--bo-muted, #94a3b8);
    font-size: 1rem;
    line-height: 1;
}

@media (max-width: 1100px) {
    .bo-pos-kpi-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bo-pos-snapshot-grid,
    .bo-pos-manage-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .bo-pos-terminal {
        grid-template-columns: 1fr;
    }

    .bo-pos-primary-grid,
    .bo-pos-kpi-strip,
    .bo-pos-snapshot-grid,
    .bo-pos-manage-grid {
        grid-template-columns: 1fr;
    }

    .bo-pos-side-col {
        order: 2;
    }

    .bo-pos-search-wrap {
        max-width: none;
    }

    .bo-pos-activity-row {
        grid-template-columns: 1fr 1fr;
        gap: 0.35rem 0.65rem;
    }

    .bo-pos-activity-row--head {
        display: none;
    }

    .bo-pos-till-grid {
        grid-template-columns: 1fr;
    }

    .bo-pos-till-basket {
        position: static;
    }
}

/* POS Checkout — till layout */
.bo-pos-checkout-revenue {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.1rem;
    text-align: right;
}

.bo-pos-checkout-revenue-label {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--bo-muted, #64748b);
}

.bo-pos-checkout-revenue-value {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--bo-text, #0f172a);
}

.bo-pos-till {
    margin-top: 0.25rem;
}

.bo-pos-till-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.85fr) minmax(280px, 1fr);
    gap: 0.85rem;
    align-items: start;
}

.bo-pos-till-sale,
.bo-pos-till-basket {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem 1.1rem;
    margin-top: 0;
}

.bo-pos-till-basket {
    position: sticky;
    top: 1rem;
}

.bo-pos-till-section-title {
    margin: 0;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--bo-muted, #64748b);
}

.bo-pos-till-client {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.bo-pos-till-client-empty {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
}

.bo-pos-till-client-empty .bo-pos-search-wrap {
    flex: 1;
    min-width: 0;
}

.bo-pos-till-client-selected {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    border-radius: 10px;
    background: rgba(45, 106, 106, 0.03);
}

.bo-pos-till-client-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 999px;
    background: var(--color-primary, #2d6a6a);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 700;
    flex-shrink: 0;
}

.bo-pos-till-client-copy {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1;
}

.bo-pos-till-client-copy strong {
    font-size: 0.95rem;
}

.bo-pos-till-client-meta {
    font-size: 0.8rem;
    color: var(--bo-muted, #64748b);
}

.bo-pos-till-client-links {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
}

.bo-pos-till-client-links .bo-pos-text-link {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    cursor: pointer;
}

.bo-pos-till-client-sep {
    color: var(--bo-muted, #94a3b8);
}

.bo-pos-till-search .bo-input {
    width: 100%;
}

.bo-pos-till-quick,
.bo-pos-till-browse,
.bo-pos-till-custom {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.bo-pos-till-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.bo-pos-till-tab {
    padding: 0.35rem 0.7rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.1));
    border-radius: 999px;
    background: #fff;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--bo-muted, #64748b);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.bo-pos-till-tab:hover {
    border-color: var(--color-primary, #2d6a6a);
    color: var(--color-primary, #2d6a6a);
}

.bo-pos-till-tab.is-active {
    border-color: var(--color-primary, #2d6a6a);
    background: rgba(45, 106, 106, 0.08);
    color: var(--color-primary, #2d6a6a);
}

a.bo-pos-till-tab {
    text-decoration: none;
}

.bo-pos-till-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(10.25rem, 1fr));
    gap: 0.5rem;
}

.bo-pos-till-tiles--browse {
    max-height: 18rem;
    overflow-y: auto;
    padding-right: 0.15rem;
}

.bo-pos-till-tile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.12rem;
    min-height: 0;
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    border-radius: 8px;
    background: #fff;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.bo-pos-till-tile:hover {
    border-color: var(--color-primary, #2d6a6a);
    background: rgba(45, 106, 106, 0.03);
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
}

.bo-pos-till-tile strong {
    font-size: 0.82rem;
    line-height: 1.25;
}

.bo-pos-till-tile-price {
    font-size: 0.86rem;
    font-weight: 700;
    color: var(--bo-text, #0f172a);
}

.bo-pos-till-tile .bo-help {
    margin: 0;
    font-size: 0.72rem;
}

.bo-pos-till-custom-form,
.bo-pos-till-discount-form {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    padding: 0.75rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.015);
}

.bo-pos-till-basket-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.bo-pos-till-basket-head .bo-pos-till-section-title {
    margin: 0;
}

.bo-pos-till-more {
    position: relative;
}

.bo-pos-till-more-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--bo-muted, #64748b);
    font-size: 1rem;
    letter-spacing: 0.04em;
    cursor: pointer;
}

.bo-pos-till-more-toggle:hover {
    background: rgba(15, 23, 42, 0.05);
    color: var(--bo-text, #0f172a);
}

.bo-pos-till-more-menu {
    position: absolute;
    right: 0;
    top: calc(100% + 0.25rem);
    z-index: 5;
    min-width: 9rem;
    padding: 0.25rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.1));
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
}

.bo-pos-till-more-menu button {
    display: block;
    width: 100%;
    padding: 0.45rem 0.65rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    text-align: left;
    font-size: 0.82rem;
    cursor: pointer;
}

.bo-pos-till-more-menu button:hover {
    background: rgba(45, 106, 106, 0.08);
}

.bo-pos-till-basket-empty {
    margin: 0;
    padding: 1.25rem 0.5rem;
    text-align: center;
    font-size: 0.88rem;
    color: var(--bo-muted, #64748b);
}

.bo-pos-till-lines {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.bo-pos-till-line {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.55rem 0;
    border-bottom: 1px solid var(--color-border, rgba(15, 23, 42, 0.06));
}

.bo-pos-till-line:last-child {
    border-bottom: 0;
}

.bo-pos-till-line-copy {
    min-width: 0;
    flex: 1;
}

.bo-pos-till-line strong {
    display: block;
    font-size: 0.88rem;
}

.bo-pos-till-qty {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.25rem;
    font-size: 0.8rem;
    color: var(--bo-muted, #64748b);
}

.bo-pos-till-qty-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.12));
    border-radius: 6px;
    background: #fff;
    color: var(--bo-text, #0f172a);
    font-size: 0.9rem;
    line-height: 1;
    cursor: pointer;
}

.bo-pos-till-qty-btn:hover {
    border-color: var(--color-primary, #2d6a6a);
    color: var(--color-primary, #2d6a6a);
}

.bo-pos-till-line-actions {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-shrink: 0;
}

.bo-pos-till-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border: 0;
    border-radius: 6px;
    background: rgba(15, 23, 42, 0.05);
    color: var(--bo-muted, #64748b);
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
}

.bo-pos-till-remove:hover {
    background: rgba(185, 28, 28, 0.08);
    color: #b91c1c;
}

.bo-pos-till-totals {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding-top: 0.35rem;
    border-top: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
}

.bo-pos-till-total-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.86rem;
    color: var(--bo-muted, #64748b);
}

.bo-pos-till-discount-row {
    color: #b45309;
}

.bo-pos-till-grand-total {
    padding-top: 0.35rem;
    margin-top: 0.15rem;
    border-top: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    font-size: 0.95rem;
    color: var(--bo-text, #0f172a);
}

.bo-pos-till-grand-total strong {
    font-size: 1.15rem;
}

.bo-pos-till-payment {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    padding-top: 0.35rem;
    border-top: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
}

.bo-pos-till-pay-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
}

.bo-pos-till-pay {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.12));
    border-radius: 10px;
    background: #fff;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    box-shadow: none;
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--bo-text, #0f172a);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.bo-pos-till-pay:hover {
    border-color: var(--color-primary, #2d6a6a);
}

.bo-pos-till-pay:focus,
.bo-pos-till-pay:focus-visible {
    outline: none;
    box-shadow: none;
}

.bo-pos-till-pay.is-active {
    border-color: var(--color-primary, #2d6a6a);
    background: rgba(45, 106, 106, 0.1);
    color: var(--color-primary, #2d6a6a);
    box-shadow: none;
}

.bo-pos-till-pay-check {
    font-size: 0.85rem;
    font-weight: 700;
    line-height: 1;
}

.bo-pos-till-pay-note {
    margin: 0;
}

.bo-pos-till-submit {
    width: 100%;
    padding: 0.85rem 1rem;
    font-size: 0.95rem;
    font-weight: 700;
}

.bo-pos-till-extras {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.bo-pos-till-complete {
    margin-top: 0.5rem;
}

.bo-pos-complete-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.45rem;
    max-width: 32rem;
    margin: 0 auto;
    padding: 2rem 1.5rem;
    text-align: center;
}

.bo-pos-complete-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    background: rgba(21, 128, 61, 0.12);
    color: #15803d;
    font-size: 1.5rem;
    font-weight: 700;
}

.bo-pos-complete-title {
    margin: 0;
    font-size: 1.35rem;
}

.bo-pos-complete-amount {
    margin: 0;
    font-size: 1rem;
    color: var(--bo-muted, #64748b);
}

.bo-pos-complete-meta {
    margin: 0;
    font-size: 0.92rem;
}

.bo-pos-complete-checklist {
    margin: 0.35rem 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.88rem;
    color: #15803d;
}

.bo-pos-complete-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.55rem;
    margin-top: 0.75rem;
}

.bo-product-main {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    min-width: 0;
}

.bo-product-thumb {
    width: 56px;
    height: 56px;
    border-radius: 8px;
    object-fit: cover;
    background: var(--color-border, rgba(0, 0, 0, .06));
    flex-shrink: 0;
}

.bo-product-thumb-empty {
    border: 1px dashed var(--color-border, rgba(0, 0, 0, .16));
    background: transparent;
}

.bo-product-image-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.45rem;
}

.bo-product-image-form input[type="file"] {
    max-width: 14rem;
    font-size: 0.8rem;
}

.bo-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* POS catalogue */
.bo-pos-catalog {
    margin-top: 0.25rem;
}

.bo-pos-catalog-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem 1.1rem 1.15rem;
    margin-top: 0;
}

.bo-pos-catalog-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.bo-pos-catalog-add {
    position: relative;
}

.bo-pos-catalog-add-menu {
    right: 0;
    left: auto;
    min-width: 13rem;
}

.bo-pos-till-more-menu a {
    display: block;
    width: 100%;
    padding: 0.45rem 0.65rem;
    border-radius: 6px;
    color: inherit;
    text-decoration: none;
    font-size: 0.82rem;
}

.bo-pos-till-more-menu a:hover {
    background: rgba(45, 106, 106, 0.08);
}

.bo-pos-catalog-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
}

.bo-pos-catalog-search {
    flex: 1;
    min-width: 14rem;
}

.bo-pos-catalog-table-wrap {
    overflow-x: auto;
}

.bo-pos-catalog-table {
    width: 100%;
    border-collapse: collapse;
}

.bo-pos-catalog-table th {
    padding: 0.45rem 0.65rem 0.55rem 0;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--bo-muted, #64748b);
    text-align: left;
    border-bottom: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
}

.bo-pos-catalog-table td {
    padding: 0.7rem 0.65rem 0.7rem 0;
    border-bottom: 1px solid var(--color-border, rgba(15, 23, 42, 0.06));
    font-size: 0.86rem;
    vertical-align: middle;
}

.bo-pos-catalog-table td strong {
    display: block;
    font-size: 0.9rem;
}

.bo-pos-catalog-table td .bo-help {
    margin: 0.1rem 0 0;
}

.bo-pos-catalog-status {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.82rem;
    font-weight: 600;
}

.bo-pos-catalog-dot {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 999px;
    background: #94a3b8;
}

.bo-pos-catalog-status.is-active {
    color: #15803d;
}

.bo-pos-catalog-status.is-active .bo-pos-catalog-dot {
    background: #22c55e;
}

.bo-pos-catalog-status.is-inactive {
    color: var(--bo-muted, #64748b);
}

.bo-pos-catalog-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
    white-space: nowrap;
}

.bo-pos-catalog-empty {
    padding: 1.75rem 1rem;
    text-align: center;
}

.bo-pos-catalog-empty .bo-btn {
    margin-top: 0.65rem;
}

@media (max-width: 800px) {
    .bo-pos-catalog-head,
    .bo-pos-catalog-toolbar {
        flex-direction: column;
        align-items: stretch;
    }
}

/* POS transactions ledger */
.bo-pos-ledger {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.bo-pos-ledger-card {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding: 1rem 1.1rem 1.15rem;
    margin-top: 0;
}

.bo-pos-ledger-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.bo-pos-ledger-search {
    flex: 1;
    min-width: 16rem;
}

.bo-pos-ledger-toolbar .bo-input {
    width: auto;
    min-width: 9rem;
}

.bo-pos-ledger-custom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    width: 100%;
}

.bo-pos-ledger-row {
    cursor: pointer;
}

.bo-pos-ledger-row:hover td {
    background: rgba(45, 106, 106, 0.04);
}

.bo-pos-ledger-status {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    font-weight: 700;
    color: #15803d;
}

.bo-pos-ledger-status::before {
    content: "";
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: currentColor;
    flex-shrink: 0;
}

.bo-pos-ledger-status.is-partially_refunded {
    color: #c2410c;
}

.bo-pos-ledger-status.is-refunded {
    color: #b91c1c;
}

.bo-pos-ledger-status.is-failed,
.bo-pos-ledger-status.is-voided {
    color: #b91c1c;
}

.bo-pos-ledger-amount {
    text-align: right;
}

.bo-pos-ledger-total {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.05rem;
}

.bo-pos-ledger-total s {
    color: var(--bo-muted, #94a3b8);
    font-weight: 500;
}

.bo-pos-ledger-refunded {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.78rem;
    font-weight: 700;
}

.bo-pos-ledger-refunded.is-partially_refunded {
    color: #c2410c;
}

.bo-pos-ledger-refunded.is-refunded {
    color: #b91c1c;
}

.bo-pos-drawer {
    position: fixed;
    inset: 0;
    z-index: 60;
}

.bo-pos-drawer-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
}

.bo-pos-drawer-panel {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(26.5rem, 100%);
    background: #fff;
    box-shadow: -12px 0 32px rgba(15, 23, 42, 0.12);
    overflow-y: auto;
}

.bo-pos-drawer-inner {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.1rem 1.15rem 1.5rem;
}

.bo-pos-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.bo-pos-drawer-hero {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.bo-pos-drawer-hero strong {
    font-size: 1.85rem;
    line-height: 1.1;
}

.bo-pos-drawer-lines,
.bo-pos-drawer-meta {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0.85rem 0;
    border-top: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    border-bottom: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
}

.bo-pos-drawer-line,
.bo-pos-drawer-meta dd {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.88rem;
}

.bo-pos-drawer-meta {
    border-bottom: 0;
    gap: 0.75rem;
}

.bo-pos-drawer-meta div {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.bo-pos-drawer-meta dt {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--bo-muted, #64748b);
}

.bo-pos-drawer-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.bo-pos-drawer-more {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
}

.bo-pos-drawer-more .bo-pos-text-link {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    cursor: pointer;
}

.bo-pos-drawer-subhead {
    margin: 0;
    font-size: 1rem;
}

.bo-pos-drawer-history {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    padding-top: 0.35rem;
    border-top: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
}

.bo-pos-history-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.86rem;
}

.bo-pos-history-row div {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.bo-pos-history-row.is-refund strong:last-child {
    color: #b91c1c;
}

.bo-pos-refund-choice {
    justify-content: flex-start;
}

.bo-pos-refund-choice span {
    flex: 1;
}

.bo-pos-refund-items {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.bo-pos-refund-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.bo-pos-kpi-strip.is-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.bo-pos-cash,
.bo-pos-cash-simple {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.bo-pos-cash-current-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.35rem;
}

.bo-pos-cash-current-head .bo-pos-till-section-title {
    margin: 0;
}

.bo-pos-cash-lines {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    margin: 1rem 0;
}

.bo-pos-cash-expected {
    padding-top: 0.55rem;
    border-top: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    font-weight: 700;
}

.bo-pos-cash-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.bo-pos-cash-warning {
    margin: 0;
    font-weight: 700;
    color: #b91c1c;
}

.bo-pos-cash-warning.is-over {
    color: #c2410c;
}

.bo-pos-cash-diff.is-short {
    color: #b91c1c;
    font-weight: 700;
}

.bo-pos-cash-diff.is-over {
    color: #c2410c;
    font-weight: 700;
}

.bo-pos-reports {
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
}

.bo-pos-report-period {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.bo-pos-report-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0.85rem;
}

.bo-pos-report-lines {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    margin-bottom: 0.75rem;
}

.bo-pos-report-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    margin-bottom: 0.65rem;
}

.bo-pos-report-card-head .bo-pos-panel-title {
    margin: 0;
}

@media (max-width: 900px) {
    .bo-pos-report-grid {
        grid-template-columns: 1fr;
    }
}

.bo-pos-vat {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.bo-pos-vat-status {
    margin: 0;
    font-weight: 700;
    color: #15803d;
}

.bo-pos-vat-check {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 0.9rem;
}

.bo-pos-vat-preview {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    margin-top: 0.35rem;
    padding: 0.85rem 1rem;
    border: 1px dashed var(--color-border, rgba(15, 23, 42, 0.12));
    border-radius: 10px;
    background: var(--color-surface-muted, #f8fafc);
    font-size: 0.88rem;
}

.bo-pos-settings {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.bo-pos-settings .bo-pos-vat-check {
    align-items: flex-start;
}

.bo-pos-settings-linkrow {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem;
}

.bo-pos-settings-linkrow > div {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.bo-pos-commission-row {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid var(--color-border, rgba(15, 23, 42, 0.12));
}

.bo-pos-commission-row:last-of-type {
    border-bottom: 0;
    padding-bottom: 0;
}

.bo-pos-complete-email {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    justify-content: center;
    margin-top: 1rem;
    max-width: 28rem;
}

.bo-pos-complete-email .bo-input {
    flex: 1 1 12rem;
}

.bo-pos-receipt-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 22rem);
    gap: 0.85rem;
    align-items: start;
}

.bo-pos-receipt-main {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    min-width: 0;
}

.bo-pos-receipt-preview-wrap {
    position: sticky;
    top: 1rem;
}

.bo-pos-receipt-brand-status {
    margin: 0;
    font-weight: 700;
    color: #15803d;
}

.bo-pos-receipt-brand {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
}

.bo-pos-receipt-brand-logo {
    width: 3.25rem;
    height: 3.25rem;
    object-fit: contain;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.12));
    border-radius: 10px;
    background: #fff;
    padding: 0.25rem;
}

.bo-pos-receipt-brand-logo.is-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    color: #64748b;
    text-align: center;
}

.bo-pos-receipt-slip {
    max-width: 18rem;
    margin: 0 auto;
    padding: 1.15rem 1rem;
    background: #fff;
    border: 1px dashed var(--color-border, rgba(15, 23, 42, 0.18));
    border-radius: 4px;
    text-align: center;
    font-size: 0.82rem;
    line-height: 1.35;
}

.bo-pos-receipt-slip-logo {
    display: block;
    max-height: 2.4rem;
    width: auto;
    margin: 0 auto 0.55rem;
}

.bo-pos-receipt-slip-name {
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 0.25rem;
}

.bo-pos-receipt-slip-meta {
    color: #475569;
    font-size: 0.78rem;
}

.bo-pos-receipt-slip-rule {
    border-top: 1px dashed rgba(15, 23, 42, 0.18);
    margin: 0.7rem 0;
}

.bo-pos-receipt-slip-line {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    text-align: left;
}

.bo-pos-receipt-slip-total {
    font-weight: 800;
    margin-top: 0.2rem;
}

.bo-pos-receipt-slip-footer {
    margin-top: 0.75rem;
    font-size: 0.78rem;
    color: #334155;
}

@media (max-width: 900px) {
    .bo-pos-receipt-layout {
        grid-template-columns: 1fr;
    }

    .bo-pos-receipt-preview-wrap {
        position: static;
        order: -1;
    }
}

.bo-sms-dashboard .bo-sms-compose-form {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.bo-sms-body {
    min-height: 7.5rem;
    resize: vertical;
}

.bo-sms-compose-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    font-size: 0.8rem;
    color: var(--bo-muted, #64748b);
}

.bo-sms-template-pick {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.bo-sms-template-pick .bo-input {
    min-width: 10rem;
}

.bo-sms-compose-actions {
    display: flex;
    justify-content: flex-end;
}

.bo-sms-kpi-status {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 1.15rem;
}

.bo-sms-kpi-status .bo-pos-status-dot {
    margin-top: 0;
}

.bo-sms-status-off {
    background: #94a3b8;
    box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.18);
}

.bo-sms-next {
    margin: 0;
    font-size: 0.86rem;
    color: var(--bo-text, #0f172a);
}

.bo-sms-next span {
    display: block;
    margin-top: 0.15rem;
    color: var(--bo-muted, #64748b);
}

.bo-sms-setup-lead {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 600;
}

.bo-sms-credit-balance {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
}

.bo-sms-low-credits {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.7rem 0.8rem;
    border-radius: 10px;
    background: #FEF3E8;
    border: 1px solid #F5D5B8;
    color: #8B5E3C;
    font-size: 0.84rem;
}

.bo-sms-activity-row {
    grid-template-columns: 3.5rem 6.5rem minmax(0, 1.4fr) 5.5rem 5.5rem 4.25rem;
}

.bo-sms-status {
    font-weight: 600;
}

.bo-sms-status-delivered { color: #15803d; }
.bo-sms-status-sent,
.bo-sms-status-pending { color: #b45309; }
.bo-sms-status-failed { color: #b91c1c; }

.bo-sms-hours {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    flex-wrap: wrap;
}

.bo-sms-hours .bo-input {
    max-width: 8.5rem;
}

@media (max-width: 900px) {
    .bo-sms-activity-row {
        grid-template-columns: 1fr 1fr;
    }
}

.bo-sms-credit-banner {
    margin-bottom: 0;
}

.bo-sms-campaign-row {
    grid-template-columns: minmax(0, 1.4fr) 7rem 3.5rem 4.5rem 3.5rem 5rem;
    text-decoration: none;
    color: inherit;
}

a.bo-sms-campaign-link:hover {
    background: rgba(45, 106, 106, 0.04);
}

.bo-sms-status-draft { color: #64748b; }
.bo-sms-status-scheduled { color: #b45309; }
.bo-sms-status-sent { color: #15803d; }

.bo-sms-wizard {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.bo-sms-steps {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--bo-muted, #64748b);
}

.bo-sms-steps li.is-active { color: var(--color-primary, #2d6a6a); }
.bo-sms-steps li.is-done { color: var(--bo-text, #0f172a); }

.bo-sms-wizard-tools {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.bo-sms-wizard-tools .bo-input {
    min-width: 10rem;
}

.bo-sms-tokens {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: center;
}

.bo-sms-wizard-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding-top: 0.35rem;
}

.bo-sms-wizard-actions {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.bo-sms-choice {
    display: flex;
    gap: 0.7rem;
    align-items: flex-start;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    border-radius: 10px;
}

.bo-sms-choice strong {
    display: block;
}

.bo-sms-audience-card,
.bo-sms-preview {
    padding: 0.75rem 0.85rem;
    border-radius: 10px;
    background: rgba(45, 106, 106, 0.05);
    white-space: pre-wrap;
}

.bo-sms-reasons {
    margin: 0.4rem 0 0;
    padding-left: 1.1rem;
    font-size: 0.84rem;
}

.bo-sms-selected {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.bo-sms-selected .bo-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.bo-sms-selected .bo-chip button {
    border: 0;
    background: transparent;
    cursor: pointer;
    color: inherit;
}

.bo-sms-review-name {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
}

.bo-sms-failed-row {
    grid-template-columns: 8rem minmax(0, 1fr) minmax(0, 1.4fr);
}

.bo-sms-wizard .bo-sms-hours .bo-input {
    max-width: none;
}

.bo-sms-compose-meta-stack {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
    text-align: right;
}

.bo-sms-ai {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.65rem;
}

.bo-sms-ai-panel {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.85rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    border-radius: 10px;
    background: rgba(45, 106, 106, 0.04);
}

.bo-sms-template-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
    margin-top: 0.85rem;
}

.bo-sms-template-card {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-height: 100%;
    padding: 0.95rem 1rem 1rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    border-radius: 12px;
    background: #fff;
}

.bo-sms-template-kicker {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--bo-muted, #64748b);
}

.bo-sms-template-name {
    margin: 0;
    font-size: 1.02rem;
    font-weight: 700;
}

.bo-sms-template-preview {
    margin: 0.15rem 0 0;
    min-height: 3.2rem;
    font-size: 0.88rem;
    color: var(--bo-text, #0f172a);
    line-height: 1.45;
}

.bo-sms-template-meta,
.bo-sms-template-used {
    margin: 0;
    font-size: 0.8rem;
    color: var(--bo-muted, #64748b);
}

.bo-sms-template-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: auto;
    padding-top: 0.55rem;
}

@media (max-width: 900px) {
    .bo-sms-campaign-row {
        grid-template-columns: 1fr 1fr;
    }

    .bo-sms-template-grid {
        grid-template-columns: 1fr;
    }

    .bo-sms-compose-meta-stack {
        align-items: flex-start;
        text-align: left;
    }

    .bo-sms-pack-grid,
    .bo-sms-billing-grid,
    .bo-sms-history-row {
        grid-template-columns: 1fr;
    }
}

.bo-sms-pack-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12.5rem, 1fr));
    gap: 0.85rem;
}

.bo-sms-pack-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 1rem 1.05rem 1.1rem;
    border: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
    border-radius: 12px;
    background: #fff;
}

.bo-sms-pack-card.is-popular {
    border-color: var(--color-primary, #2d6a6a);
    box-shadow: 0 0 0 3px rgba(45, 106, 106, 0.08);
}

.bo-sms-pack-badge {
    position: absolute;
    top: 0.7rem;
    right: 0.75rem;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-primary, #2d6a6a);
}

.bo-sms-pack-kicker {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--bo-muted, #64748b);
}

.bo-sms-pack-price {
    font-size: 1.45rem;
    font-weight: 700;
}

.bo-sms-pack-card .bo-btn {
    margin-top: auto;
    justify-content: center;
}

.bo-sms-billing-section {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    max-width: 36rem;
}

.bo-sms-billing-grid {
    display: grid;
    grid-template-columns: minmax(0, 36rem);
    gap: 1rem;
}

.bo-sms-history-row {
    grid-template-columns: 5.5rem minmax(0, 1.6fr) 5.5rem 5rem;
    text-decoration: none;
    color: inherit;
}

.bo-sms-status-banner .bo-pos-terminal-status {
    align-items: center;
}

.bo-sms-status-banner .bo-pos-status-dot {
    margin-top: 0;
}

.bo-sms-status-banner strong {
    display: block;
}

.bo-sms-reminder-summary,
.bo-sms-enforced {
    margin: 0;
    padding-left: 1.1rem;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.bo-sms-reminder-summary li,
.bo-sms-enforced li {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.bo-sms-enforced li::marker {
    color: #15803d;
}

.bo-op-timeline li {
    display: grid;
    grid-template-columns: 6.5rem minmax(0, 1fr);
    gap: 0.65rem;
    padding: 0.35rem 0;
    font-size: 0.86rem;
}

.bo-op-timeline-time {
    color: var(--bo-muted, #64748b);
}

.bo-op-dashboard .bo-op-stripe-setup {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.25rem;
    background: #FEF3E8;
    border-color: #F5D5B8;
}

.bo-pos-dashboard .bo-op-subnav,
.bo-pos-dashboard .bo-op-stripe-setup {
    margin-bottom: 0;
}

.bo-op-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.bo-op-request-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 0;
    border-top: 1px solid var(--color-border, rgba(15, 23, 42, 0.06));
}

.bo-op-request-row:first-of-type {
    border-top: 0;
}

.bo-op-request-link {
    color: inherit;
    text-decoration: none;
}

.bo-op-request-side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.25rem;
    text-align: right;
}

.bo-op-status {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
}

.bo-op-status.is-awaiting { color: #b45309; }
.bo-op-status.is-paid { color: #15803d; }
.bo-op-status.is-overdue { color: #b91c1c; }
.bo-op-status.is-expired { color: #9f1239; }
.bo-op-status.is-draft,
.bo-op-status.is-cancelled { color: #64748b; }

.bo-status-badge {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    background: #e2e8f0;
    color: #334155;
}
.bo-status-badge.is-draft,
.bo-status-badge.is-cancelled { background: #e2e8f0; color: #475569; }
.bo-status-badge.is-awaiting { background: #fef3c7; color: #92400e; }
.bo-status-badge.is-paid { background: #dcfce7; color: #166534; }
.bo-status-badge.is-overdue { background: #fee2e2; color: #b91c1c; }
.bo-status-badge.is-expired { background: #ffe4e6; color: #9f1239; }

.bo-kpi-link { text-decoration: none; color: inherit; }
.bo-kpi-link.is-active { outline: 2px solid var(--color-primary, #2d6a6a); }
.bo-pr-page { min-width: 0; }
.bo-pr-kpis .bo-pos-kpi-card {
    min-height: 0;
    padding: 0.7rem 0.85rem;
    gap: 0.15rem;
}
.bo-pr-kpis .bo-pos-kpi-value { font-size: 1.2rem; }
.bo-pr-panel { padding: 0; overflow: visible; }
.bo-pr-panel-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem 1rem 0.45rem;
}
.bo-pr-panel-head .bo-pos-panel-title { margin: 0; }
.bo-pr-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    padding: 0 1rem 0.7rem;
}
.bo-pr-toolbar .bo-input { min-width: 8rem; }
.bo-pr-toolbar input[type="search"] { flex: 1 1 16rem; }
.bo-pr-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    padding: 0 1rem 0.75rem;
}
.bo-pr-tab {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    color: #475569;
    background: #f1f5f9;
    text-decoration: none;
}
.bo-pr-tab.is-active {
    background: var(--color-primary, #2d6a6a);
    color: #fff;
}
.bo-pr-table-wrap { overflow: visible; }
.bo-pr-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: auto;
}
.bo-pr-table th {
    background: #f1f5f9;
    color: #64748b;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-align: left;
    padding: 0.55rem 0.9rem;
    border-bottom: 1px solid var(--color-border, rgba(15, 23, 42, 0.08));
}
.bo-pr-table td {
    height: 72px;
    padding: 0.45rem 0.9rem;
    vertical-align: middle;
    border-bottom: 1px solid var(--color-border, rgba(15, 23, 42, 0.06));
    font-size: 0.88rem;
}
.bo-pr-table tbody tr {
    cursor: pointer;
}
.bo-pr-table tbody tr:hover,
.bo-pr-table tbody tr.is-open {
    background: #f8fafc;
}
.bo-pr-table .is-num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.bo-pr-table th.is-num { text-align: right; }
.bo-pr-client { display: flex; gap: 0.55rem; align-items: center; min-width: 0; }
.bo-pr-avatar {
    flex: 0 0 1.75rem;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #2d6a6a;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
}
.bo-pr-muted {
    display: block;
    margin: 0.1rem 0 0;
    font-size: 0.75rem;
    font-weight: 500;
    color: #64748b;
}
.bo-pr-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.4rem;
    white-space: nowrap;
}
.bo-pr-menu { position: relative; }
.bo-pr-menu summary {
    cursor: pointer;
    list-style: none;
    font-weight: 700;
    padding: 0.15rem 0.4rem;
    border-radius: 6px;
}
.bo-pr-menu summary::-webkit-details-marker { display: none; }
.bo-pr-menu-list {
    position: absolute;
    right: 0;
    z-index: 6;
    min-width: 11rem;
    padding: 0.35rem;
    background: #fff;
    border: 1px solid var(--color-border, rgba(15,23,42,.12));
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
}
.bo-pr-menu-list a, .bo-pr-menu-list .bo-link-btn { text-align: left; padding: 0.25rem 0.4rem; }
.bo-pr-pagination { padding: 0.75rem 1rem 1rem; }
.bo-pr-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}
.bo-pr-step {
    font-size: 0.72rem;
    font-weight: 600;
    color: #94a3b8;
}
.bo-pr-step.is-done { color: #166534; }
.bo-pr-step:not(:last-child)::after {
    content: "→";
    margin-left: 0.35rem;
    color: #cbd5e1;
}
.bo-pr-drawer-actions, .bo-pr-due-form {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.bo-hidden-form { display: none; }
.bo-pr-more { position: relative; }
.bo-pr-more-panel {
    position: absolute;
    z-index: 5;
    right: 0;
    margin-top: 0.4rem;
    padding: 0.75rem;
    min-width: 16rem;
    background: #fff;
    border: 1px solid var(--color-border, rgba(15,23,42,.12));
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.bo-pr-table-card { padding: 0.85rem 1rem 1rem; }
.bo-pr-table-head { display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; margin-bottom: 0.5rem; }
.bo-hidden-form { display: none; }
.bo-pr-pagination { margin-top: 0.75rem; }

.bo-op-outstanding-list {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.bo-op-outstanding-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.bo-op-outstanding-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
}

.bo-op-activity-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) 6rem 5.5rem 4.5rem;
}

.bo-op-send-panel,
.bo-op-send-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    align-items: center;
}

.bo-op-more-options summary {
    cursor: pointer;
    list-style: none;
}

.bo-op-request-summary {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.bo-op-request-amount {
    font-size: 1.35rem;
}

.bo-op-created-banner strong {
    color: #15803d;
}

.bo-op-appointment-balance {
    padding: 0.75rem;
    border-radius: 10px;
    background: var(--color-surface-muted, #f8fafc);
}

@media (max-width: 900px) {
    .bo-op-request-row,
    .bo-op-outstanding-row,
    .bo-op-stripe-setup {
        flex-direction: column;
    }

    .bo-op-request-side,
    .bo-op-outstanding-meta {
        align-items: flex-start;
        text-align: left;
    }

    .bo-op-activity-row {
        grid-template-columns: 1fr 1fr;
    }
}

.bo-op-invoice-preview {
    max-width: 420px;
    margin: 0 auto;
}

.bo-op-invoice-preview-inner {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1.25rem;
    background: #fff;
}

.bo-op-invoice-logo,
.bo-op-invoice-logo-placeholder {
    text-align: center;
    margin-bottom: 1rem;
}

.bo-op-invoice-logo img {
    max-height: 48px;
    max-width: 160px;
    width: auto;
    object-fit: contain;
}

.bo-op-invoice-preview-dates > div {
    display: flex;
    gap: 0.4rem;
    align-items: baseline;
    flex-wrap: wrap;
}

.bo-op-invoice-preview {
    max-width: 720px;
    margin-inline: auto;
}

.bo-op-invoice-logo-placeholder {
    width: 56px;
    height: 56px;
    margin-inline: auto;
    border-radius: 999px;
    background: #f1f5f9;
    display: grid;
    place-items: center;
    font-weight: 700;
    color: #475569;
}

.bo-op-invoice-preview-head {
    text-align: center;
    margin-bottom: 1rem;
}

.bo-op-invoice-preview-label {
    display: block;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}

.bo-op-invoice-preview-block,
.bo-op-invoice-preview-dates,
.bo-op-invoice-preview-lines,
.bo-op-invoice-preview-totals {
    display: grid;
    gap: 0.35rem;
    margin-bottom: 1rem;
}

.bo-op-invoice-preview-dates {
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.bo-op-invoice-preview-line,
.bo-op-invoice-preview-totals > div,
.bo-op-invoice-balance-grid > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.bo-op-invoice-preview-total,
.bo-op-invoice-preview-due,
.bo-op-invoice-total-row {
    font-weight: 700;
    border-top: 1px solid #e2e8f0;
    padding-top: 0.5rem;
}

.bo-op-invoice-preview-pay {
    text-align: center;
}

.bo-op-invoice-lines-head,
.bo-op-invoice-line-row {
    display: grid;
    grid-template-columns: 2fr 0.6fr 0.8fr 0.8fr 0.8fr auto;
    gap: 0.5rem;
    align-items: center;
}

.bo-op-invoice-lines-head {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
}

.bo-op-invoice-line-actions,
.bo-op-invoice-picker {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.bo-op-invoice-totals {
    display: grid;
    gap: 0.35rem;
    margin-top: 0.75rem;
}

.bo-op-invoice-totals > div {
    display: flex;
    justify-content: space-between;
}

.bo-op-invoice-balance-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.bo-op-invoice-public-pay {
    margin-top: 1rem;
    text-align: center;
}

.bo-op-subnav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 1rem;
}

.bo-op-subnav-link {
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--color-text-muted);
    text-decoration: none;
    border: 1px solid var(--color-border);
    background: #fff;
}

.bo-op-subnav-link.is-active {
    color: #fff;
    background: var(--color-primary, #2d6a6a);
    border-color: var(--color-primary, #2d6a6a);
}

.bo-op-deposit-rules-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.bo-op-deposit-rules-main {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.bo-op-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.bo-pos-kpi-strip.is-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.bo-op-deposit-overrides-head,
.bo-op-deposit-overrides-row {
    display: grid;
    grid-template-columns: 2fr 1fr 2fr;
    gap: 0.75rem;
    align-items: start;
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--color-border);
}

@media (max-width: 900px) {
    .bo-pos-kpi-strip.is-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bo-op-deposit-overrides-head,
    .bo-op-deposit-overrides-row {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .bo-op-invoice-lines-head {
        display: none;
    }

    .bo-op-invoice-line-row {
        grid-template-columns: 1fr;
    }

    .bo-op-invoice-balance-grid {
        grid-template-columns: 1fr;
    }
}

.bo-inv-dashboard .bo-app-workspace {
    margin-top: 0;
}

.bo-gift-dashboard .bo-app-workspace {
    margin-top: 0;
}

.bo-gift-card-row {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.2fr) 5.5rem 5.5rem 5.5rem;
}

.bo-gift-ledger-row {
    grid-template-columns: 6.5rem 5.5rem minmax(0, 1.1fr) minmax(0, 1fr) 5.5rem 5.5rem minmax(0, 0.9fr);
}

.bo-gift-list-row {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1fr) 5.5rem 5.5rem 6.5rem 5.5rem 5.5rem;
}

.bo-gift-week-chart {
    display: flex;
    align-items: flex-end;
    gap: 0.65rem;
    min-height: 6rem;
}

.bo-gift-week {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    color: var(--bo-muted, #64748b);
}

.bo-gift-week-bars {
    display: flex;
    align-items: flex-end;
    gap: 3px;
    height: 64px;
}

.bo-gift-week-bars span {
    width: 8px;
    border-radius: 3px 3px 0 0;
    display: block;
}

.bo-gift-week-bars .is-sales { background: #2563eb; }
.bo-gift-week-bars .is-redeemed { background: #059669; }

.bo-mem-dashboard .bo-mem-plan-row {
    grid-template-columns: minmax(0, 1.4fr) 4.5rem 5rem minmax(0, 1fr) 4rem 5.5rem 4.5rem;
}

.bo-mem-dashboard .bo-mem-member-row {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.1fr) 5rem minmax(0, 0.9fr) 5.5rem 4.5rem;
}

.bo-loy-dashboard .bo-loy-tier-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) 4.5rem 4.5rem minmax(0, 1fr) 4.5rem;
}

.bo-loy-dashboard .bo-loy-reward-row {
    grid-template-columns: minmax(0, 1.4fr) 4.5rem 5.5rem 4.5rem 4.5rem;
}

.bo-loy-dashboard .bo-loy-referral-row {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.1fr) minmax(0, 0.9fr) 5rem 5rem;
}

.bo-vc-dashboard .bo-vc-consult-row {
    grid-template-columns: 4rem minmax(0, 1fr) minmax(0, 1fr) 6rem 6rem;
}

.bo-vc-dashboard .bo-vc-archive-row {
    grid-template-columns: 4rem minmax(0, 1fr) minmax(0, 0.9fr) 4rem 5.5rem 5rem;
}

.bo-vc-dashboard .bo-vc-recording-row {
    grid-template-columns: 4rem minmax(0, 1fr) minmax(0, 0.9fr) 4rem 5.5rem 3rem;
}

.bo-mc-dashboard .bo-mc-location-row {
    grid-template-columns: minmax(0, 1.2fr) 5.5rem 5.5rem 4.5rem 4rem 5rem;
}

.bo-mc-dashboard .bo-mc-location-list-row {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.4fr) 4rem 4.5rem;
}

.bo-mc-dashboard .bo-mc-transfer-row {
    grid-template-columns: 5rem minmax(0, 1fr) minmax(0, 1fr) 3.5rem 5rem 5.5rem;
}

.bo-mc-dashboard .bo-mc-report-row {
    grid-template-columns: minmax(0, 1.1fr) 5.5rem 5.5rem 5rem 5rem 5rem;
}

.bo-wl-dashboard .bo-wl-practice-row {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) 4rem 5rem;
}

.bo-ai-dashboard .bo-ai-staff-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.bo-ai-staff-card {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.bo-ai-staff-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
}

.bo-ai-staff-status {
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--color-primary, #2563eb);
}

.bo-ai-staff-status.is-paused,
.bo-ai-staff-status.is-issue-detected {
    color: #b45309;
}

.bo-ai-staff-awaiting {
    margin: 0.35rem 0 0;
    font-weight: 650;
}

.bo-ai-setup-list {
    margin: 0;
    padding-left: 1.2rem;
    display: grid;
    gap: 0.35rem;
}

.bo-ai-setup-list li span {
    display: inline-block;
    min-width: 3.5rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.bo-ai-setup-list li.is-done span {
    color: #15803d;
}

.bo-ai-inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.bo-ai-workspace-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.65fr);
}

.bo-ai-queue-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.bo-ai-queue-tabs a {
    display: inline-flex;
    gap: 0.35rem;
    align-items: center;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    text-decoration: none;
    font-size: 0.85rem;
    color: inherit;
    background: #f1f5f9;
}

.bo-ai-queue-tabs a.is-active {
    background: var(--color-primary, #2563eb);
    color: #fff;
}

.bo-ai-work-item,
.bo-ai-knowledge-item {
    display: grid;
    gap: 0.5rem;
    padding: 0.85rem 0;
    border-top: 1px solid #e2e8f0;
}

.bo-ai-work-item-head {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: flex-start;
}

.bo-ai-work-item-flags,
.bo-ai-suggestions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.bo-ai-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    background: #e2e8f0;
}

.bo-ai-chip.is-clinical,
.bo-ai-chip.is-high {
    background: #fee2e2;
    color: #991b1b;
}

.bo-ai-chip.is-medium {
    background: #ffedd5;
    color: #9a3412;
}

.bo-ai-draft pre,
.bo-ai-clinical-split pre,
.bo-ai-result-body {
    white-space: pre-wrap;
    margin: 0;
    font: inherit;
}

.bo-ai-clinical-banner {
    padding: 0.65rem 0.9rem;
    border-radius: 0.65rem;
    background: #fff7ed;
    color: #9a3412;
    font-weight: 700;
}

.bo-ai-clinical-split {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.bo-ai-clinical-split section,
.bo-ai-draft,
.bo-ai-tone-preview {
    padding: 0.75rem;
    border-radius: 0.65rem;
    background: #f8fafc;
}

.bo-ai-empty {
    padding: 0.5rem 0 0.25rem;
}

.bo-ai-result-meta {
    display: grid;
    gap: 0.65rem;
    margin: 0;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.bo-ai-result-meta dt {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
}

.bo-ai-result-meta dd {
    margin: 0.2rem 0 0;
}

.bo-ai-subhead {
    margin: 0.5rem 0 0;
    font-size: 0.95rem;
}

.bo-ai-suggestion {
    border: 0;
    background: #eef2ff;
    color: #3730a3;
    border-radius: 999px;
    padding: 0.35rem 0.7rem;
    cursor: pointer;
    font: inherit;
}

.bo-ai-extra-context summary {
    cursor: pointer;
    font-weight: 650;
}

.bo-ai-briefing-copy {
    font-size: 1.05rem;
    margin: 0;
}

.bo-ai-briefing-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

.bo-ai-briefing-grid strong {
    display: block;
}

.bo-ai-knowledge-list {
    margin: 0;
    padding-left: 1.1rem;
}

.bo-ai-knowledge-list li + li,
.bo-ai-activity-row + .bo-ai-activity-row,
.bo-ai-approval-teaser + .bo-ai-approval-teaser {
    margin-top: 0.65rem;
}

.bo-ai-staff-settings {
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 0.85rem;
    display: grid;
    gap: 0.5rem;
}

.bo-ai-settings-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.bo-ai-capability-table {
    display: grid;
    gap: 0.35rem;
}

.bo-ai-capability-table > div {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 0.8fr));
    gap: 0.5rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid #e2e8f0;
}

.bo-ai-capability-head {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

@media (max-width: 900px) {
    .bo-ai-workspace-grid {
        grid-template-columns: 1fr;
    }
}

.bo-inv-attention-row {
    grid-template-columns: minmax(0, 1.6fr) 5rem 5.5rem 4.5rem;
}

.bo-inv-attention-row strong {
    text-align: left;
}

.bo-inv-stock-status {
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.bo-inv-stock-status.is-out { color: #b91c1c; }
.bo-inv-stock-status.is-low { color: #b45309; }

.bo-inv-summary-row {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 0.35rem 0;
    border-top: 1px solid var(--color-border, rgba(15, 23, 42, 0.06));
}

.bo-inv-summary-row:first-of-type {
    border-top: 0;
    padding-top: 0;
}

@media (max-width: 900px) {
    .bo-inv-attention-row {
        grid-template-columns: minmax(0, 1fr) 4rem 4.5rem;
    }

    .bo-inv-attention-row span:last-child {
        grid-column: 1 / -1;
    }
}


/* Advanced Analytics dashboard */
.bo-aa { display: flex; flex-direction: column; gap: 1rem; }
.bo-aa-period { display: flex; flex-wrap: wrap; align-items: center; gap: 0.65rem; min-width: 0; max-width: 100%; }
.bo-aa-period-field { min-width: 0; }
.bo-aa-period-select { min-width: 8.5rem; max-width: 100%; }
.bo-aa-period-compare { display: inline-flex; align-items: flex-start; gap: 0.4rem; font-size: 0.875rem; color: var(--color-muted, #64748b); min-width: 0; flex: 1 1 14rem; white-space: normal; line-height: 1.35; }
.bo-aa-period-compare span { min-width: 0; }
.bo-aa-period-export { flex: 0 0 auto; margin-left: auto; }
.bo-aa-kpi-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.75rem; }
.bo-aa-kpi-strip.is-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.bo-aa-kpi, .bo-aa-health { display: flex; flex-direction: column; gap: 0.2rem; padding: 0.9rem 1rem; border: 1px solid var(--color-border, rgba(15,23,42,.08)); border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.bo-aa-kpi-label { font-size: 0.75rem; letter-spacing: .02em; text-transform: uppercase; color: var(--color-muted, #64748b); font-weight: 600; }
.bo-aa-kpi-value, .bo-aa-health strong { font-size: 1.45rem; line-height: 1.15; font-weight: 700; color: #0f172a; }
.bo-aa-kpi-delta { font-size: 0.8125rem; font-weight: 600; }
.bo-aa-kpi-delta.is-up { color: #15803d; }
.bo-aa-kpi-delta.is-down { color: #b91c1c; }
.bo-aa-kpi-delta.is-flat { color: var(--color-muted, #64748b); }
.bo-aa-kpi-badge { align-self: flex-start; margin-top: 0.2rem; font-size: 0.65rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 0.15rem 0.4rem; border-radius: 999px; background: #ecfdf5; color: #047857; }
.bo-aa-tip { cursor: help; border-bottom: 1px dotted currentColor; }
.bo-aa-metric-note { margin: 0; }
.bo-aa-primary-grid, .bo-aa-secondary-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 0.85rem; }
.bo-aa-section { display: flex; flex-direction: column; gap: 0.65rem; }
.bo-aa-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem; }
.bo-aa-health-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.65rem; }
.bo-aa-insight-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem; }
.bo-aa-insight-grid.is-wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bo-aa-insight h3 { margin: 0 0 0.35rem; font-size: 1rem; }
.bo-aa-insight p { margin: 0 0 0.75rem; color: var(--color-muted, #64748b); font-size: 0.9rem; }
.bo-aa-insight-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.bo-aa-client-stats { display: grid; gap: 0.55rem; }
.bo-aa-client-stats > div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.35rem 0; border-bottom: 1px solid var(--color-border, rgba(15,23,42,.06)); }
.bo-aa-client-stats span { color: var(--color-muted, #64748b); }
.bo-aa-callout { padding: 0.85rem 1rem; border-radius: 10px; background: #f8fafc; border: 1px solid var(--color-border, rgba(15,23,42,.08)); }
.bo-aa-callout p { margin: 0.35rem 0 0.65rem; color: var(--color-muted, #64748b); }
.bo-aa-breakdown-row { display: flex; justify-content: space-between; gap: 1rem; padding: 0.35rem 0; border-bottom: 1px solid var(--color-border, rgba(15,23,42,.06)); font-size: 0.925rem; }
.bo-aa-table th, .bo-aa-table td { white-space: nowrap; }
.bo-aa-chart-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.75rem; }
.bo-aa-chart-tabs { display: inline-flex; gap: 0.25rem; padding: 0.2rem; border-radius: 999px; background: #f1f5f9; }
.bo-aa-chart-tab { border: 0; background: transparent; padding: 0.35rem 0.7rem; border-radius: 999px; font-size: 0.8125rem; font-weight: 600; color: #64748b; cursor: pointer; }
.bo-aa-chart-tab.is-active { background: #fff; color: #0f172a; box-shadow: 0 1px 2px rgba(15,23,42,.08); }
.bo-aa-chart-canvas { position: relative; height: 240px; }
.bo-aa-chart-svg { width: 100%; height: 210px; display: block; }
.bo-aa-chart-grid { stroke: rgba(15,23,42,.06); stroke-width: 1; }
.bo-aa-chart-line { fill: none; stroke: #0f766e; stroke-width: 2.5; }
.bo-aa-chart-area { fill: rgba(15,118,110,.12); stroke: none; }
.bo-aa-chart-dot { fill: #0f766e; opacity: 0; }
.bo-aa-chart-dot.is-active { opacity: 1; }
.bo-aa-chart-tooltip { position: absolute; transform: translate(-50%, -120%); background: #0f172a; color: #fff; padding: 0.4rem 0.55rem; border-radius: 8px; font-size: 0.75rem; pointer-events: none; display: flex; flex-direction: column; gap: 0.1rem; min-width: 72px; }
.bo-aa-chart-xlabels { display: flex; justify-content: space-between; gap: 0.5rem; font-size: 0.75rem; color: #64748b; margin-top: 0.15rem; }
.bo-aa-chart-summary { display: flex; gap: 1.5rem; margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid var(--color-border, rgba(15,23,42,.06)); }
.bo-aa-chart-summary strong { display: block; margin-top: 0.15rem; }
.bo-aa-chart-empty { min-height: 10rem; display: flex; flex-direction: column; justify-content: center; gap: 0.45rem; padding: 1.25rem 0.25rem; }
.bo-aa-chart-empty strong { font-size: 1.02rem; }
.bo-aa-chart-empty p { margin: 0; color: var(--color-muted, #64748b); }
.bo-aa-heatmap-grid { display: grid; grid-template-columns: 4.5rem repeat(var(--aa-days, 6), minmax(0, 1fr)); gap: 0.35rem; align-items: stretch; }
.bo-aa-heatmap-day, .bo-aa-heatmap-slot { font-size: 0.75rem; font-weight: 600; color: #64748b; display: flex; align-items: center; justify-content: center; }
.bo-aa-heatmap-slot { justify-content: flex-start; }
.bo-aa-heatmap-cell { min-height: 2.2rem; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 600; color: #0f172a; background: color-mix(in srgb, #0f766e calc(var(--aa-fill, 0) * 1%), #f1f5f9); }
.bo-aa-heatmap-cell.is-empty { background: #f8fafc; color: #94a3b8; }
.bo-aa-heatmap-legend { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 0.75rem; font-size: 0.85rem; color: #64748b; }
@media (max-width: 1100px) {
  .bo-aa-kpi-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bo-aa-insight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .bo-aa-kpi-strip, .bo-aa-primary-grid, .bo-aa-secondary-grid, .bo-aa-insight-grid, .bo-aa-insight-grid.is-wide, .bo-aa-health-grid { grid-template-columns: 1fr; }
  .bo-aa-heatmap-grid { grid-template-columns: 3.5rem repeat(var(--aa-days, 6), minmax(2.5rem, 1fr)); overflow-x: auto; }
}

/* Practice Health page */
.bo-aa-score-label { margin: 0; font-size: 1.75rem; font-weight: 750; letter-spacing: -0.02em; }
.bo-aa-score.is-strong .bo-aa-score-label { color: #15803d; }
.bo-aa-score.is-good .bo-aa-score-label { color: #0f766e; }
.bo-aa-score.is-attention .bo-aa-score-label { color: #b45309; }
.bo-aa-score-summary { margin: 0; color: var(--color-muted, #64748b); line-height: 1.45; }
.bo-aa-score-indicators { display: flex; flex-direction: column; gap: 0.45rem; margin-top: 0.35rem; }
.bo-aa-score-row { display: flex; justify-content: space-between; gap: 1rem; padding: 0.4rem 0; border-bottom: 1px solid var(--color-border, rgba(15,23,42,.06)); font-size: 0.925rem; }
.bo-aa-score-row.is-healthy strong { color: #15803d; }
.bo-aa-score-row.is-watch strong { color: #b45309; }
.bo-aa-score-row.is-concern strong { color: #b91c1c; }
.bo-aa-score-row.is-flat strong { color: #64748b; }
.bo-aa-attention-list { display: flex; flex-direction: column; gap: 0.75rem; }
.bo-aa-attention-item { padding: 0.75rem 0; border-bottom: 1px solid var(--color-border, rgba(15,23,42,.06)); }
.bo-aa-attention-item:last-child { border-bottom: 0; padding-bottom: 0; }
.bo-aa-attention-item p { margin: 0.25rem 0 0.45rem; color: var(--color-muted, #64748b); font-size: 0.9rem; }
.bo-aa-healthy-empty { padding: 0.5rem 0; }
.bo-aa-healthy-empty p { margin: 0.35rem 0 0; color: var(--color-muted, #64748b); }
.bo-aa-status-bar { display: flex; flex-direction: column; gap: 0.3rem; }
.bo-aa-status-bar-head { display: flex; justify-content: space-between; gap: 1rem; font-size: 0.9rem; }
.bo-aa-status-bar-track { height: 0.55rem; border-radius: 999px; background: #f1f5f9; overflow: hidden; }
.bo-aa-status-bar-track span { display: block; height: 100%; border-radius: inherit; background: #0f766e; }
.bo-aa-util { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 0.75rem; }
.bo-aa-util-head { display: flex; justify-content: space-between; gap: 1rem; }
.bo-aa-util-track { height: 0.7rem; border-radius: 999px; background: #f1f5f9; overflow: hidden; }
.bo-aa-util-track span { display: block; height: 100%; border-radius: inherit; background: #0f766e; }
.bo-aa-finance-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem; }
.bo-aa-finance { display: flex; flex-direction: column; gap: 0.2rem; padding: 0.85rem 1rem; border: 1px solid var(--color-border, rgba(15,23,42,.08)); border-radius: 12px; background: #fff; }
.bo-aa-finance strong { font-size: 1.2rem; }
@media (max-width: 900px) {
  .bo-aa-finance-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.bo-aa-empty { padding: 1.25rem 0.25rem; max-width: 36rem; }
.bo-aa-empty-title { display: block; font-size: 1.05rem; margin-bottom: 0.35rem; }
.bo-aa-empty p { margin: 0 0 0.45rem; color: var(--color-muted, #64748b); }
.bo-aa-team-table tr.bo-aa-row-link { cursor: pointer; }
.bo-aa-team-table tr.bo-aa-row-link:hover { background: #f8fafc; }
.bo-aa-col-action { width: 2rem; text-align: right; }
.bo-aa-team-insight-list { display: flex; flex-direction: column; gap: 0.85rem; }
.bo-aa-team-insight { display: flex; flex-direction: column; gap: 0.2rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--color-border, rgba(15,23,42,.06)); }
.bo-aa-team-insight:last-child { border-bottom: 0; padding-bottom: 0; }
.bo-aa-team-insight strong { font-size: 0.95rem; line-height: 1.35; font-weight: 600; }

.bo-aa-month-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem; }
.bo-aa-month-stat { padding: 0.85rem 1rem; border: 1px solid var(--color-border, rgba(15,23,42,.08)); border-radius: 12px; background: #fff; display: flex; flex-direction: column; gap: 0.25rem; }
.bo-aa-month-stat strong { font-size: 1.15rem; }
.bo-aa-insight-stack { display: flex; flex-direction: column; gap: 0.75rem; }
.bo-aa-insight-card-head { display: flex; flex-direction: column; gap: 0.35rem; margin-bottom: 0.35rem; }
.bo-aa-insight-card h3 { margin: 0; font-size: 1.05rem; }
.bo-aa-insight-evidence { margin: 0 0 0.35rem; color: #0f172a; font-size: 0.95rem; }
.bo-aa-insight-why { margin: 0 0 0.75rem; color: var(--color-muted, #64748b); font-size: 0.9rem; }
.bo-aa-insight-basis { margin: 0.65rem 0 0; padding: 0.65rem 0.75rem; border-radius: 8px; background: #f8fafc; color: #64748b; font-size: 0.85rem; }
.bo-aa-type { display: inline-flex; align-self: flex-start; font-size: 0.7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 0.2rem 0.45rem; border-radius: 999px; background: #f1f5f9; color: #475569; }
.bo-aa-type.is-attention { background: #fff7ed; color: #c2410c; }
.bo-aa-type.is-opportunity { background: #eff6ff; color: #1d4ed8; }
.bo-aa-type.is-positive { background: #ecfdf5; color: #047857; }
.bo-aa-type.is-info { background: #f8fafc; color: #64748b; }
.bo-aa-insights-building { gap: 0.85rem; }
.bo-aa-source-list { margin: 0.35rem 0 0; padding: 0; list-style: none; display: grid; gap: 0.45rem; }
.bo-aa-source-list li { display: flex; justify-content: space-between; gap: 1rem; padding: 0.45rem 0; border-bottom: 1px solid var(--color-border, rgba(15,23,42,.06)); font-size: 0.92rem; }
.bo-aa-source-list li::before { content: '●'; color: #94a3b8; margin-right: 0.35rem; }
.bo-aa-source-list li.is-ready::before { color: #15803d; }
.bo-aa-source-list li span { display: inline-flex; align-items: center; }
.bo-aa-source-list li strong { font-weight: 600; color: var(--color-muted, #64748b); }
.bo-aa-watch-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem; }
.bo-aa-watch-card { display: flex; flex-direction: column; gap: 0.25rem; min-height: 8.5rem; }
.bo-aa-watch-icon { font-size: 1.1rem; color: var(--color-primary, #2d6a6a); }
.bo-aa-watch-card h3 { margin: 0; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-muted, #64748b); }
.bo-aa-watch-card strong { font-size: 0.95rem; }
.bo-aa-watch-card p { margin: 0; color: var(--color-muted, #64748b); font-size: 0.88rem; line-height: 1.4; }
.bo-aa-insight-metric { margin: 0 0 0.35rem; font-size: 1.05rem; font-weight: 700; color: #0f172a; }
.bo-aa-appointment-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; align-items: flex-start; padding-bottom: 0.35rem; border-bottom: 1px solid var(--color-border, rgba(15,23,42,.06)); }
.bo-aa-primary-grid--nested { margin-top: 0.75rem; }
.bo-aa-health-grid--inline { grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 14rem; }
.bo-aa-score-indicators--compact { margin-top: 0.65rem; }
.bo-aa-example-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem; }
.bo-aa-example { padding: 0.85rem; border: 1px dashed var(--color-border, rgba(15,23,42,.14)); border-radius: 10px; background: #fbfcfd; }
.bo-aa-example strong { display: block; margin: 0.45rem 0 0.25rem; }
.bo-aa-example p { margin: 0; color: var(--color-muted, #64748b); font-size: 0.9rem; }
.bo-aa-why-block { padding: 0.85rem 0; color: var(--color-muted, #64748b); font-size: 0.9rem; }
.bo-aa-why-block p { margin: 0.25rem 0 0; }
.bo-aa-week-list { margin: 0; padding-left: 1.1rem; display: flex; flex-direction: column; gap: 0.35rem; }
.bo-aa-week-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.65rem; }
.bo-aa-week-item { display: flex; flex-direction: column; gap: 0.2rem; padding: 0.7rem 0.8rem; border: 1px solid var(--color-border, rgba(15,23,42,.08)); border-radius: 10px; background: #f8fafc; }
.bo-aa-week-item span { font-size: 0.78rem; color: var(--color-muted, #64748b); font-weight: 600; }
.bo-aa-week-item strong { font-size: 1.15rem; }
.bo-aa-why-modal { position: fixed; inset: 0; z-index: 80; display: flex; align-items: flex-start; justify-content: flex-end; }
.bo-aa-why-modal-backdrop { position: absolute; inset: 0; background: rgba(15,23,42,.35); }
.bo-aa-why-modal-panel { position: relative; width: min(28rem, 100%); height: 100%; overflow: auto; background: #fff; padding: 1.25rem 1.35rem; box-shadow: -8px 0 24px rgba(15,23,42,.12); }
.bo-aa-why-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.bo-aa-why-modal-head h3 { margin: 0; font-size: 1.05rem; }
.bo-aa-why-dl { display: grid; gap: 0.85rem; margin: 0 0 1rem; }
.bo-aa-why-dl dt { font-size: 0.75rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--color-muted, #64748b); }
.bo-aa-why-dl dd { margin: 0.25rem 0 0; color: #0f172a; line-height: 1.45; }
.bo-aa-definitions { margin-top: 1.25rem; }
.bo-page-actions .bo-aa-period { width: 100%; max-width: 42rem; }
@media (max-width: 900px) {
  .bo-aa-month-strip, .bo-aa-example-grid, .bo-aa-watch-grid, .bo-aa-week-grid { grid-template-columns: 1fr; }
  .bo-aa-health-grid--inline { min-width: 0; width: 100%; }
  .bo-aa-why-modal { justify-content: stretch; }
  .bo-aa-why-modal-panel { width: 100%; }
}

.bo-offer-form { display: flex; flex-direction: column; gap: 1rem; padding-bottom: 2rem; }
.bo-offer-repeater { margin-bottom: 0.75rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--color-border, rgba(15,23,42,.08)); }
.bo-offer-save { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.bo-offer-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; font-size: 0.85rem; }
.bo-link-btn { background: none; border: 0; padding: 0; color: inherit; cursor: pointer; text-decoration: underline; font: inherit; }
.bo-inline-fields { display: flex; gap: 0.5rem; }
.bo-row-link { text-decoration: none; color: inherit; }
.bo-row-link:hover { background: rgba(15,23,42,.03); }
.bo-mem-dashboard .bo-mem-plan-row { grid-template-columns: minmax(0, 1.3fr) 5rem 6rem minmax(0, 1fr) 4rem 6rem 4.5rem 8rem; }
.bo-mem-dashboard .bo-mem-package-row { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.2fr) 5rem 3.5rem 5rem 5rem 4.5rem 8rem; }
.bo-loy-dashboard .bo-loy-reward-row { grid-template-columns: minmax(0, 1.4fr) 4.5rem 4.5rem 6rem 4rem 4.5rem 4.5rem 8rem; }
.bo-mc-dashboard .bo-mc-location-list-row { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.3fr) 4rem 3.5rem 6rem 5rem 4rem; }
.bo-wl-dashboard .bo-wl-practice-row { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) 6rem 6rem 4.5rem 5rem; }
.bo-wl-preview-mini { padding: 1rem; border-radius: 10px; background: var(--wl-primary, #2563eb); color: #fff; display: flex; flex-direction: column; gap: 0.25rem; }
.bo-wl-preview-frame { border: 1px solid var(--color-border, rgba(15,23,42,.12)); border-radius: 12px; overflow: hidden; max-width: 960px; }
.bo-wl-preview-frame.is-tablet { max-width: 720px; }
.bo-wl-preview-frame.is-mobile { max-width: 390px; }
.bo-wl-preview-chrome { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 1rem; color: #fff; }
.bo-wl-preview-body { padding: 1.25rem; background: #fff; min-height: 16rem; }
.bo-wl-preview-card { max-width: 32rem; }

.bo-status-badge.is-viewed { background: #dbeafe; color: #1d4ed8; }
.bo-status-badge.is-partial { background: #ede9fe; color: #6d28d9; }
.bo-status-badge.is-refunded { background: #f3e8ff; color: #6b21a8; }
.bo-inv-ref { font-weight: 700; text-decoration: none; color: inherit; }
.bo-inv-ref:hover { text-decoration: underline; }
.bo-inv-check { width: 2.2rem; padding-right: 0 !important; }
.bo-inv-table .bo-pr-client { text-decoration: none; color: inherit; }
.bo-inv-bulk { display: none; }
.bo-inv-cards { display: none; }
.bo-inv-card {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--color-border, rgba(15,23,42,.08));
}
.bo-inv-card header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.35rem;
}
.bo-inv-card p { margin: 0.15rem 0; }
.bo-pr-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}
@media (max-width: 900px) {
    .bo-inv-page .bo-pr-table-wrap { display: none; }
    .bo-inv-cards { display: block; }
}

/* Help Suite */
.bo-help-suite { padding-bottom: 2rem; }
.bo-help-search { margin-bottom: 1.25rem; }
.bo-help-search-row { display: flex; flex-wrap: wrap; gap: 0.65rem; align-items: center; margin-top: 0.45rem; }
.bo-help-search-row .bo-input { flex: 1 1 16rem; min-width: 0; }
.bo-help-layout { display: grid; grid-template-columns: minmax(13rem, 16rem) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.bo-help-sidebar { position: sticky; top: 1rem; padding: 1rem 1.1rem; }
.bo-help-sidebar-title { margin: 0 0 0.75rem; font-size: 0.92rem; font-weight: 700; }
.bo-help-section-nav { display: flex; flex-direction: column; gap: 0.25rem; }
.bo-help-section-link {
    display: flex; align-items: center; justify-content: space-between; gap: 0.75rem;
    padding: 0.55rem 0.65rem; border-radius: 8px; text-decoration: none; color: inherit; font-size: 0.92rem;
}
.bo-help-section-link:hover { background: rgba(15,23,42,.04); }
.bo-help-section-link.is-active { background: rgba(37,99,235,.08); color: #1d4ed8; font-weight: 600; }
.bo-help-section-link span { font-size: 0.78rem; color: var(--color-muted, #64748b); font-weight: 500; }
.bo-help-results-meta { margin: 0 0 1rem; color: var(--color-muted, #64748b); font-size: 0.92rem; }
.bo-help-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1rem; }
.bo-help-card {
    display: flex; flex-direction: column; gap: 0.45rem; padding: 1.1rem 1.15rem;
    text-decoration: none; color: inherit; transition: box-shadow .15s ease, transform .15s ease;
}
.bo-help-card:hover { box-shadow: 0 8px 24px rgba(15,23,42,.08); transform: translateY(-1px); }
.bo-help-card-section { font-size: 0.72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--color-muted, #64748b); }
.bo-help-card-title { margin: 0; font-size: 1.05rem; line-height: 1.35; }
.bo-help-card-summary { margin: 0; color: var(--color-muted, #64748b); font-size: 0.9rem; line-height: 1.45; flex: 1; }
.bo-help-card-cta { margin-top: 0.35rem; font-size: 0.86rem; font-weight: 600; color: #2563eb; }
.bo-help-empty { padding: 1.5rem; }
.bo-help-article-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem); gap: 1.25rem; align-items: start; }
.bo-help-steps, .bo-help-tips { margin: 0; padding-left: 1.2rem; display: flex; flex-direction: column; gap: 0.65rem; line-height: 1.55; }
.bo-help-related { display: grid; gap: 0.75rem; margin-top: 0.75rem; }
.bo-help-related-link {
    display: flex; flex-direction: column; gap: 0.2rem; padding: 0.75rem 0.85rem; border-radius: 10px;
    border: 1px solid var(--color-border, rgba(15,23,42,.08)); text-decoration: none; color: inherit;
}
.bo-help-related-link:hover { background: rgba(15,23,42,.02); }
.bo-help-related-link span { color: var(--color-muted, #64748b); font-size: 0.88rem; line-height: 1.4; }
.bo-help-support-cta { display: flex; flex-direction: column; gap: 0.65rem; align-items: flex-start; }
.bo-help-meta { padding: 1rem 1.1rem; display: flex; flex-direction: column; gap: 0.65rem; margin-top: 1rem; }
.bo-help-meta-title { margin: 0; font-size: 0.78rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--color-muted, #64748b); }
.bo-help-meta p { margin: 0; }
.bo-help-meta-link { font-size: 0.9rem; }
.bo-help-open-feature { width: 100%; justify-content: center; }
.bo-help-screenshot {
    border: 1px solid var(--color-border, rgba(15,23,42,.1)); border-radius: 12px; overflow: hidden;
    background: #fff; box-shadow: 0 10px 30px rgba(15,23,42,.08);
}
.bo-help-screenshot-chrome {
    display: flex; align-items: center; gap: 0.45rem; padding: 0.65rem 0.85rem;
    background: #f8fafc; border-bottom: 1px solid var(--color-border, rgba(15,23,42,.08));
}
.bo-help-screenshot-dot { width: 0.55rem; height: 0.55rem; border-radius: 999px; background: #cbd5e1; }
.bo-help-screenshot-title { margin-left: 0.35rem; font-size: 0.82rem; font-weight: 600; color: var(--color-muted, #64748b); }
.bo-help-screenshot-image { display: block; width: 100%; height: auto; }
.bo-help-screenshot-mock { padding: 1rem; display: flex; flex-direction: column; gap: 0.85rem; background: linear-gradient(180deg, #f8fafc 0%, #fff 100%); }
.bo-help-screenshot-panels { display: grid; grid-template-columns: repeat(auto-fit, minmax(5.5rem, 1fr)); gap: 0.55rem; }
.bo-help-screenshot-panel {
    display: flex; flex-direction: column; gap: 0.15rem; padding: 0.65rem 0.7rem; border-radius: 10px;
    border: 1px solid var(--color-border, rgba(15,23,42,.08)); background: #fff;
}
.bo-help-screenshot-panel span { font-size: 0.72rem; color: var(--color-muted, #64748b); font-weight: 600; }
.bo-help-screenshot-panel strong { font-size: 0.95rem; }
.bo-help-screenshot-panel.is-primary strong { color: #2563eb; }
.bo-help-screenshot-panel.is-success strong { color: #059669; }
.bo-help-screenshot-panel.is-warning strong { color: #d97706; }
.bo-help-screenshot-rows { display: flex; flex-direction: column; gap: 0.45rem; }
.bo-help-screenshot-row {
    padding: 0.65rem 0.75rem; border-radius: 8px; background: #fff;
    border: 1px solid var(--color-border, rgba(15,23,42,.08)); font-size: 0.86rem; color: #334155;
}
@media (max-width: 900px) {
    .bo-help-layout, .bo-help-article-layout { grid-template-columns: 1fr; }
    .bo-help-sidebar { position: static; }
    .bo-help-meta { margin-top: 0; }
}

.bo-tpc-settings .bo-card {
    padding: 28px;
}
.bo-tpc-settings-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
    gap: 28px 40px;
    align-items: start;
}
.bo-tpc-template-list {
    display: grid;
    gap: 10px;
}
.bo-tpc-settings-actions {
    margin-top: 8px;
    padding-top: 18px;
    border-top: 1px solid var(--color-border, #e2e8f0);
}
@media (max-width: 900px) {
    .bo-tpc-settings-grid { grid-template-columns: 1fr; }
}

.bo-inline-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.bo-tpc-request {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.bo-tpc-request-method {
    width: auto;
    min-width: 13.75rem;
    height: 34px;
    padding: 6px 38px 6px 12px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    background-position: right 10px center;
}

/* User appearance and resizable navigation */
.bo-notify-button {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    color: var(--color-text-muted);
    box-shadow: none;
    transition: color var(--transition), border-color var(--transition), background var(--transition);
}

.bo-notify-button svg {
    width: 19px;
    height: 19px;
}

.bo-notify-button:hover,
.bo-notify-button[aria-expanded="true"] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background: var(--color-bg-alt);
}

.bo-theme-switch {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    background: var(--color-bg-alt);
}

.bo-theme-switch form {
    display: flex;
    margin: 0;
}

.bo-theme-option {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    padding: 4px 8px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--color-text-muted);
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.bo-theme-option svg {
    width: 16px;
    height: 16px;
}

.bo-theme-option:hover {
    color: var(--color-primary);
}

.bo-theme-option.is-active {
    color: var(--color-primary);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.bo-location-bar {
    padding: 10px 32px;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    background: var(--color-bg-alt);
}

.bo-location-switcher {
    display: flex;
    align-items: center;
    gap: 12px;
}

.bo-location-label {
    color: var(--color-text-muted);
    font-size: 13px;
    font-weight: 600;
}

.bo-location-switcher .bo-input {
    min-height: 36px;
    color: var(--color-text);
    border-color: var(--color-border);
    background-color: var(--color-surface);
}

.bo-sidebar-resizer {
    position: absolute;
    z-index: 3;
    top: 0;
    right: -5px;
    bottom: 0;
    width: 10px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: ew-resize;
    touch-action: none;
}

.bo-sidebar-resizer::after {
    content: "";
    position: absolute;
    top: 0;
    right: 4px;
    bottom: 0;
    width: 2px;
    background: transparent;
    transition: background var(--transition);
}

.bo-sidebar-resizer:hover::after,
.bo-sidebar-resizer:focus-visible::after,
.bo-sidebar-resizing .bo-sidebar-resizer::after {
    background: var(--color-primary-light);
}

.bo-sidebar-resizing,
.bo-sidebar-resizing * {
    cursor: ew-resize !important;
    user-select: none !important;
}

.bo-sidebar-resizing .bo-sidebar,
.bo-sidebar-resizing .bo-main {
    transition: none !important;
}

.bo-theme-dark {
    color-scheme: dark;
    --color-primary: #7DCBC5;
    --color-primary-dark: #9ADBD6;
    --color-primary-light: #62B8B2;
    --color-accent: #F2B68E;
    --color-bg: #0D1516;
    --color-bg-alt: #182425;
    --color-surface: #121F20;
    --color-text: #E8F0EF;
    --color-text-muted: #A8BABA;
    --color-text-light: #809493;
    --color-border: #2A3B3C;
    --color-success: #73C8A3;
    --color-danger: #EE9898;
    --color-ai: #B2A3D7;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 6px 24px rgba(0, 0, 0, 0.32);
    --shadow-lg: 0 18px 50px rgba(0, 0, 0, 0.4);
}

.bo-theme-dark .bo-logo img {
    padding: 0;
    border-radius: 0;
    background: transparent;
    filter: brightness(0) invert(1);
}

.bo-theme-dark .bo-page-header {
    border-bottom-color: var(--color-border);
    background: var(--color-bg);
}

.bo-theme-dark .bo-nav-item:hover,
.bo-theme-dark .bo-nav-item.active,
.bo-theme-dark .bo-nav-subitem:hover,
.bo-theme-dark .bo-nav-subitem.active,
.bo-theme-dark .bo-notify-item:hover {
    background: rgba(125, 203, 197, 0.12);
}

.bo-theme-dark .bo-btn-outline,
.bo-theme-dark .bo-input,
.bo-theme-dark .bo-select,
.bo-theme-dark .bo-textarea,
.bo-theme-dark input,
.bo-theme-dark select,
.bo-theme-dark textarea {
    color: var(--color-text);
    background-color: var(--color-surface);
    border-color: var(--color-border);
}

.bo-theme-dark .bo-table th,
.bo-theme-dark .bo-table td,
.bo-theme-dark .bo-card,
.bo-theme-dark .bo-modal,
.bo-theme-dark dialog {
    border-color: var(--color-border);
}

.bo-theme-dark .bo-badge,
.bo-theme-dark code {
    color: var(--color-text);
    background: var(--color-bg-alt);
}

.bo-theme-dark img {
    opacity: 0.96;
}

@media (max-width: 900px) {
    .bo-sidebar-resizer {
        display: none;
    }
}

@media (max-width: 640px) {
    .bo-theme-option span {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }
}

/* Keep sidebar identity and account details consistent with navigation. */
.bo-org-name,
.bo-org-plan,
.bo-user-name,
.bo-user-email,
.bo-user-menu a,
.bo-user-menu button {
    font-family: var(--font-sans);
    font-size: 14px;
    line-height: 1.45;
    color: var(--color-text-muted);
}

.bo-org-name,
.bo-user-name {
    font-weight: 500;
    color: var(--color-text);
}

.bo-org-name {
    margin-top: 14px;
}

.bo-org-plan,
.bo-user-email {
    margin-top: 2px;
    font-size: 13px;
    font-weight: 400;
}

.bo-user-menu a,
.bo-user-menu button {
    font-weight: 400;
}

.bo-booking-event-icon {
    display: inline-flex;
    color: var(--color-text-muted);
}

.bo-booking-event-icon .bo-heading-icon {
    width: 30px;
    height: 30px;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    background: var(--color-bg-alt);
}

.bo-booking-event-icon svg {
    width: 17px;
    height: 17px;
}
