/* ============================================================================
 * Digital Sanctuary — Design System
 * Работает поверх Bootstrap 5. Без жёстких пикселей, только классы.
 * ============================================================================ */

/* === Палитра === */
:root {

    --ds-surface: #f7f9fb;
    --ds-surface-low: #f2f4f6;
    --ds-surface-high: #e6e8ea;
    --ds-surface-card: #ffffff;
    --ds-text-primary: #191c1e;
    --ds-text-secondary: #45464d;
    --ds-text-muted: #76777d;
    --ds-accent: #003366;
    --ds-accent-hover: #c8d2dc;
    --ds-accent-light: #d5dee7;
/*    --ds-accent-light: #e8eaf6; */
    --ds-accent-light-text: #283593;
    --ds-border: rgba(0,0,0,0.06);
    --ds-green-bg: #e8f5e9;
    --ds-green-text: #2e7d32;
    --ds-green-dot: #4caf50;
    --ds-yellow-bg: #fff8e1;
    --ds-yellow-text: #f57f17;
    --ds-gray-bg: #f0f0f0;
    --ds-gray-text: #757575;
    --ds-red-bg: #fce4ec;
    --ds-red-text: #c62828;
    --ds-radius: 1rem;
    --ds-radius-sm: 0.75rem;
    --ds-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.03);
    --ds-shadow-hover: 0 4px 16px rgba(0,0,0,0.08), 0 1px 4px rgba(0,0,0,0.04);
}

/* === Typography === */
body {
    font-family: 'Inter', sans-serif;
    background: var(--ds-surface);
    color: var(--ds-text-primary);
}
h1, h2, h3, h4, h5, h6, .ds-brand { font-family: 'Manrope', sans-serif; }

/* === Sidebar === */
.ds-sidebar {
    background: var(--ds-surface-low);
    border-right: 1px solid var(--ds-border);
    min-height: 100vh;
    position: sticky;
    top: 0;
    overflow-y: auto;
}
.ds-sidebar-brand { letter-spacing: -0.03em; }
.ds-sidebar-brand img { border-radius: var(--ds-radius-sm); }

/* Profile block in sidebar */
.ds-profile-block {
    background: var(--ds-surface-card);
    border-radius: var(--ds-radius-sm);
    box-shadow: var(--ds-shadow);
}
.ds-profile-avatar {
    border-radius: var(--ds-radius-sm);
    color: #fff;
    overflow: hidden;
}
.ds-profile-avatar img { width: 50px; object-fit: cover; }

/* Nav items */
.ds-nav-link {
    border-radius: var(--ds-radius-sm);
    color: var(--ds-text-muted);
    transition: all 0.15s ease;
}
.ds-nav-link:hover {
    color: var(--ds-text-secondary);
    background: rgba(0,0,0,0.04);
}
.ds-nav-link.active {
    background: var(--ds-accent-light);
    color: var(--ds-accent-light-text);
    box-shadow: var(--ds-shadow);
}

/* Sidebar add button */
.ds-btn {
  border-radius: var(--ds-radius-sm);
  border: none;
  transition: opacity 0.15s;
}

.ds-btn-add {
    background: var(--ds-accent);
    color: #fff;
    border-radius: var(--ds-radius-sm);
    border: none;
    transition: opacity 0.15s;
}
.ds-btn-add:hover { background: var(--ds-accent-hover); }

/* === Main content === */
.ds-main {
    min-height: 100vh;
    overflow-y: auto;
}

/* === Filter bar === */
.ds-filter-bar {
    background: var(--ds-surface-low);
    border-radius: var(--ds-radius);
}
.ds-filter-bar .form-select,
.ds-filter-bar .form-control {
    background: var(--ds-surface-card);
    border: none;
    border-radius: var(--ds-radius-sm);
}
.ds-filter-bar .form-select:focus,
.ds-filter-bar .form-control:focus {
    box-shadow: 0 0 0 2px rgba(26,26,46,0.08);
}

/* === Client cards === */
.ds-client-card {
    background: var(--ds-surface-card);
    border-radius: var(--ds-radius);
    transition: all 0.2s ease;
    cursor: pointer;
    border: 1px solid transparent;
}
.ds-client-card:hover {
    box-shadow: var(--ds-shadow-hover);
    border-color: var(--ds-border);
}

/* Avatars */
.ds-avatar {
    border-radius: var(--ds-radius-sm);
    overflow: hidden;
    flex-shrink: 0;
}
.ds-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--ds-radius-sm); }
.ds-avatar-1 { background: #d8e3fb; color: #3c475a; }
.ds-avatar-2 { background: #d5e3fd; color: #3a485c; }
.ds-avatar-3 { background: #a6f2d1; color: #002116; }
.ds-avatar-4 { background: #ffd8cc; color: #5c2a1a; }
.ds-avatar-5 { background: #e8d5f5; color: #3a1a5c; }

.ds-client-desc {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Arrow button on cards */
.ds-arrow-btn {
    border-radius: var(--ds-radius-sm);
    border: none;
    background: var(--ds-accent-hover);
    color: var(--ds-text-muted);
    transition: all 0.15s;
}
.ds-client-card:hover .ds-arrow-btn { background: var(--ds-accent); color: #fff; }

/* === Status badges === */
.ds-status {
    border-radius: 1.25rem;
}
.ds-status-dot {
    width: 0.5rem; height: 0.5rem;
    border-radius: 50%;
    display: inline-block;
}
.ds-status-active { background: var(--ds-green-bg); color: var(--ds-green-text); }
.ds-status-active .ds-status-dot { background: var(--ds-green-dot); }
.ds-status-archived { background: var(--ds-gray-bg); color: var(--ds-gray-text); }
.ds-status-archived .ds-status-dot { background: var(--ds-gray-text); }

/* === Client detail header === */
.ds-client-header {
    background: var(--ds-surface-card);
    border-radius: var(--ds-radius);
    box-shadow: var(--ds-shadow);
}
.ds-detail-avatar {
    border-radius: var(--ds-radius);
    overflow: hidden;
}
.ds-detail-avatar img { width: 100px;object-fit: cover; border-radius: var(--ds-radius); }

.ds-btn-edit {
    border-radius: var(--ds-radius-sm);
    border: 1px solid var(--ds-border);
    background: var(--ds-surface-card);
    transition: all 0.15s;
}
.ds-btn-edit:hover { background: var(--ds-surface-low); }

/* Stats */
.ds-stat-item {
    background: var(--ds-accent-light);
    border-radius: var(--ds-radius-sm);
}
.ds-stat-value {
    font-family: 'Manrope', sans-serif;
    color: var(--ds-accent-light-text);
}

/* === Primary button === */
.ds-btn-primary {
    background: var(--ds-accent);
    color: #fff;
    border: none;
    border-radius: var(--ds-radius-sm);
    transition: opacity 0.15s;
}
.ds-btn-primary:hover { background: var(--ds-accent-hover); }

/* === Session cards === */
.ds-session-card {
    background: var(--ds-surface-card);
    border-radius: var(--ds-radius);
    overflow: hidden;
    transition: box-shadow 0.2s;
    border: 1px solid transparent;
}
.ds-session-card:hover {
    border-color: var(--ds-border);
    box-shadow: var(--ds-shadow);
}
.ds-session-head {
    cursor: pointer;
    user-select: none;
}
.ds-session-badge { border-radius: 1.25rem; }
.ds-badge-attended { background: var(--ds-green-bg); color: var(--ds-green-text); }
.ds-badge-scheduled { background: var(--ds-yellow-bg); color: var(--ds-yellow-text); }
.ds-badge-cancelled { background: var(--ds-red-bg); color: var(--ds-red-text); }

.ds-session-chevron {
    color: var(--ds-text-muted);
    transition: transform 0.2s;
}
.ds-session-card.open .ds-session-chevron { transform: rotate(90deg); }

/* Expandable body */
.ds-session-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}
.ds-session-card.open .ds-session-body { max-height: 3000px; }
.ds-session-body-inner {
    border-top: 1px solid var(--ds-border);
}
.ds-session-field {
    border-bottom: 1px solid var(--ds-border);
}
.ds-session-field:last-child { border-bottom: none; }
.ds-session-field-label {
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ds-text-muted);
}

/* Audio button */
.ds-audio-btn {
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-sm);
    background: var(--ds-surface-low);
    transition: all 0.15s;
}
.ds-audio-btn:hover { background: var(--ds-surface-high); }

/* File chips */
.ds-file-chip {
    background: var(--ds-surface-low);
    border-radius: var(--ds-radius-sm);
    cursor: pointer;
    transition: background 0.15s;
}
.ds-file-chip:hover { background: var(--ds-surface-high); }

.ds-session-edit-btn {
    background: var(--ds-accent);
    color: #fff;
    border: none;
    border-radius: var(--ds-radius-sm);
    transition: opacity 0.15s;
}
.ds-session-edit-btn:hover { background: var(--ds-accent-hover); }

.ds-icon-audio { color: var(--ds-accent); }

/* === Empty & loading states === */
.ds-empty-state {
    color: var(--ds-text-muted);
}
.ds-empty-state i { color: var(--ds-surface-high); }

/* === Mobile bottom bar === */
.ds-mobile-bottombar {
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(12px);
    border-top: 1px solid var(--ds-border);
    padding-bottom: env(safe-area-inset-bottom);
}
.ds-mobile-tab {
    color: var(--ds-text-muted);
    background: none;
    border: none;
    cursor: pointer;
}
.ds-mobile-tab.active { color: var(--ds-accent); }
.ds-mobile-fab {
    background: var(--ds-accent);
    color: #fff;
    border: none;
    box-shadow: 0 4px 16px rgba(26,26,46,0.25);
    cursor: pointer;
}

/* === Offcanvas override for sidebar === */
.offcanvas.ds-offcanvas {
    background: var(--ds-surface-low);
}

/* === Sizing classes === */
.ds-avatar-sm { width: 2.75rem; height: 2.75rem; }
.ds-avatar-md { width: 3.25rem; height: 3.25rem; min-width: 3.25rem; }
.ds-avatar-lg { width: 4.5rem; height: 4.5rem; }
.ds-arrow-size { width: 2.5rem; height: 2.5rem; }
.ds-fab-size { width: 3.25rem; height: 3.25rem; margin-top: -1.5rem; }
.ds-main-inner { max-width: 1200px; }
.ds-list-header-text { letter-spacing: 0.1em; font-size: 0.7rem; }
.ds-spacer-sm { width: 2rem; }

/* ===================================================================
   CONCEPTUALIZATION DIAGRAM
   =================================================================== */

/* Progress ring */
.ds-concept-ring {
    width: 3.5rem;
    height: 3.5rem;
}
.ds-concept-ring-text {
    font-family: 'Manrope', sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    fill: var(--ds-text-primary);
}

/* Diagram blocks (top level) */
.ds-diagram-block {
    border-radius: var(--ds-radius-sm);
    padding: 1rem;
    cursor: pointer;
    transition: all 0.15s ease;
    border: 2px dashed var(--ds-surface-high);
    background: var(--ds-surface-card);
}
.ds-diagram-block:hover {
    border-color: var(--ds-accent);
    box-shadow: var(--ds-shadow);
}
.ds-block-filled {
    border-style: solid;
    border-color: var(--ds-border);
}
.ds-block-empty {
    opacity: 0.7;
}
.ds-diagram-block-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ds-text-muted);
    margin-bottom: 0.35rem;
}
.ds-diagram-block-value {
    font-size: 0.875rem;
    color: var(--ds-text-secondary);
    line-height: 1.5;
    white-space: pre-line;
}

/* Situation cards */
.ds-situation-card {
    border-radius: var(--ds-radius-sm);
    padding: 1rem;
    background: var(--ds-surface-card);
    border: 1px solid var(--ds-border);
    min-height: 100%;
}
.ds-sit-filled {
    border-color: var(--ds-green-dot);
    border-left-width: 3px;
}

.ds-sit-field {
    padding: 0.5rem;
    border-radius: 0.375rem;
    cursor: pointer;
    margin-bottom: 0.25rem;
    transition: background 0.15s;
    border: 1px dashed transparent;
}
.ds-sit-field:hover {
    background: var(--ds-surface-low);
    border-color: var(--ds-accent);
}
.ds-sit-field-filled {
    border-style: solid;
    border-color: var(--ds-border);
    background: var(--ds-surface-low);
}
.ds-sit-field-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ds-text-muted);
    margin-bottom: 0.15rem;
}
.ds-sit-field-value {
    line-height: 1.4;
    white-space: pre-line;
}

/* Add situation */
.ds-situation-add {
    border: 2px dashed var(--ds-surface-high);
    border-radius: var(--ds-radius-sm);
    padding: 2rem 1rem;
    cursor: pointer;
    transition: all 0.15s;
    min-height: 100%;
}
.ds-situation-add:hover {
    border-color: var(--ds-accent);
    background: var(--ds-surface-low);
}

/* ===================================================================
   SCHEDULE / CALENDAR
   =================================================================== */

.ds-schedule-green {
    background: var(--ds-green-bg);
    color: var(--ds-green-text);
    border-left: 3px solid var(--ds-green-dot);
}
.ds-schedule-blue {
    background: #e3f2fd;
    color: #1565c0;
    border-left: 3px solid #42a5f5;
}
.ds-schedule-red {
    background: var(--ds-red-bg);
    color: var(--ds-red-text);
    border-left: 3px solid #ef5350;
}

.ds-legend-dot {
    display: inline-block;
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 0.2rem;
}
.ds-legend-green { background: var(--ds-green-dot); }
.ds-legend-blue { background: #42a5f5; }
.ds-legend-red { background: #ef5350; }

.ds-schedule-view-btn.active {
    background: var(--ds-accent);
    color: #fff;
    border-color: var(--ds-accent);
}

/* Month view */
.ds-calendar-table { table-layout: fixed; }
.ds-calendar-table th {
    background: var(--ds-surface-low);
    padding: 0.5rem;
    font-size: 0.75rem;
    border-color: var(--ds-border);
}
.ds-calendar-cell {
    vertical-align: top;
    padding: 0.35rem;
    height: 6.5rem;
    border-color: var(--ds-border);
    background: var(--ds-surface-card);
    transition: background 0.1s;
}
.ds-calendar-cell:hover { background: var(--ds-surface-low); }
.ds-calendar-other-month { background: var(--ds-surface-low); opacity: 0.45; }
.ds-calendar-today { background: #fffde7; }
.ds-calendar-day-num { font-size: 0.8rem; font-weight: 600; color: var(--ds-text-secondary); margin-bottom: 0.25rem; }
.ds-today-num { color: var(--ds-accent-light-text); }

.ds-calendar-event {
    font-size: 0.7rem;
    padding: 0.15rem 0.35rem;
    border-radius: 0.25rem;
    margin-bottom: 0.2rem;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    transition: opacity 0.15s;
    line-height: 1.4;
}
.ds-calendar-event:hover { opacity: 0.8; }
.ds-event-time { font-weight: 600; }

/* Week view */
.ds-week-table { table-layout: fixed; }
.ds-week-table th { background: var(--ds-surface-low); border-color: var(--ds-border); padding: 0.5rem; }
.ds-week-time-col { width: 3.5rem; background: var(--ds-surface-low); border-color: var(--ds-border); }
.ds-week-time-label { padding: 0.25rem 0.5rem; vertical-align: top; background: var(--ds-surface-low); border-color: var(--ds-border); font-size: 0.75rem; }
.ds-week-cell { vertical-align: top; padding: 0.25rem; height: 3rem; border-color: var(--ds-border); background: var(--ds-surface-card); }
.ds-week-cell:hover { background: var(--ds-surface-low); }

.ds-week-event {
    font-size: 0.7rem;
    padding: 0.2rem 0.4rem;
    border-radius: 0.25rem;
    margin-bottom: 0.15rem;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    transition: opacity 0.15s;
}
.ds-week-event:hover { opacity: 0.8; }

@media (max-width: 767.98px) {
    .ds-calendar-cell { height: auto; min-height: 3.5rem; }
    .ds-calendar-event { font-size: 0.6rem; }
    .ds-event-name { display: none; }
}

/* ===================================================================
   ANALYTICS
   =================================================================== */

/* Summary cards */
.ds-analytics-card {
    background: var(--ds-surface-card);
    border-radius: var(--ds-radius-sm);
    padding: 1.25rem;
    text-align: center;
    border: 1px solid var(--ds-border);
    transition: box-shadow 0.15s;
}
.ds-analytics-card:hover {
    box-shadow: var(--ds-shadow-hover);
}
.ds-analytics-card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--ds-radius-sm);
    margin-bottom: 0.75rem;
    font-size: 1.1rem;
}
.ds-analytics-icon-clients { background: var(--ds-accent-light); color: var(--ds-accent-light-text); }
.ds-analytics-icon-sessions { background: #e3f2fd; color: #1565c0; }
.ds-analytics-icon-warning { background: var(--ds-red-bg); color: var(--ds-red-text); }
.ds-analytics-icon-ok { background: var(--ds-green-bg); color: var(--ds-green-text); }
.ds-analytics-icon-new { background: #e0f2f1; color: #00695c; }

.ds-analytics-card-value {
    font-family: 'Manrope', sans-serif;
    font-size: 1.75rem;
    font-weight: 800;
    color: var(--ds-text-primary);
    line-height: 1;
    margin-bottom: 0.25rem;
}
.ds-analytics-card-label {
    font-size: 0.75rem;
    color: var(--ds-text-muted);
}

/* Section block (chart, lists) */
.ds-analytics-section {
    background: var(--ds-surface-card);
    border-radius: var(--ds-radius-sm);
    padding: 1.25rem;
    border: 1px solid var(--ds-border);
    margin-bottom: 1rem;
}

/* Bar chart */
.ds-chart-container {
    display: flex;
    align-items: flex-end;
    gap: 0.25rem;
    height: 10rem;
    padding-top: 0.5rem;
}
.ds-chart-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
}
.ds-chart-bar-group {
    flex: 1;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.ds-chart-bar {
    width: 100%;
    min-height: 0;
    transition: height 0.3s;
}
.ds-chart-bar-attended { background: #42a5f5; border-radius: 0.2rem 0.2rem 0 0; }
.ds-chart-bar-scheduled { background: var(--ds-green-dot); }
.ds-chart-bar-cancelled { background: #ef5350; }
.ds-chart-label { font-size: 0.65rem; color: var(--ds-text-muted); margin-top: 0.35rem; }
.ds-chart-value { font-size: 0.6rem; font-weight: 600; color: var(--ds-text-secondary); }

.ds-chart-dot-attended { background: #42a5f5; }
.ds-chart-dot-scheduled { background: var(--ds-green-dot); }
.ds-chart-dot-cancelled { background: #ef5350; }

/* Client lists */
.ds-analytics-list-item {
    padding: 0.625rem 0;
    border-bottom: 1px solid var(--ds-border);
    cursor: pointer;
    transition: background 0.1s;
}
.ds-analytics-list-item:last-child { border-bottom: none; }
.ds-analytics-list-item:hover { background: var(--ds-surface-low); margin: 0 -0.5rem; padding-left: 0.5rem; padding-right: 0.5rem; border-radius: 0.25rem; }

/* ===================================================================
   LANGUAGE DROPDOWN
   =================================================================== */

.ds-lang-dropdown {
    position: relative;
    display: inline-block;
}

.ds-lang-trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.65rem;
    border: 1px solid var(--ds-border);
    border-radius: 0.5rem;
    background: var(--ds-surface-card);
    cursor: pointer;
    font-size: 0.8rem;
    color: var(--ds-text-secondary);
    transition: all 0.15s;
}
.ds-lang-trigger:hover {
    border-color: var(--ds-accent);
    box-shadow: var(--ds-shadow);
}
.ds-lang-flag {
    font-size: 1.1rem;
    line-height: 1;
}
.ds-lang-code {
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: navy;
}
.ds-lang-chevron {
    font-size: 0.6rem;
    transition: transform 0.2s;
    opacity: 0.5;
}
.ds-lang-dropdown.open .ds-lang-chevron {
    transform: rotate(180deg);
}

.ds-lang-menu {
    position: absolute;
    bottom: 100%;
    left: 0;
    min-width: 10rem;
    margin-bottom: 0.35rem;
    padding: 0.35rem;
    background: var(--ds-surface-card);
    border: 1px solid var(--ds-border);
    border-radius: 0.625rem;
    box-shadow: 0 8px 24px rgba(0,0,0,0.1);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: all 0.15s ease;
    z-index: 1050;
}
.ds-lang-dropdown.open .ds-lang-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.ds-lang-option {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.65rem;
    border-radius: 0.375rem;
    cursor: pointer;
    font-size: 0.8rem;
    color: var(--ds-text-secondary);
    transition: background 0.1s;
}
.ds-lang-option:hover {
    background: var(--ds-surface-low);
}
.ds-lang-option-active {
    background: var(--ds-accent-light);
    color: var(--ds-accent-light-text);
    font-weight: 600;
}
.ds-lang-option-active:hover {
    background: var(--ds-accent-light);
}
.ds-lang-name {
    flex: 1;
}

/* Login page: dropdown opens upward or downward depending on context */
.ds-login-lang .ds-lang-menu {
    bottom: auto;
    top: 100%;
    margin-top: 0.35rem;
    margin-bottom: 0;
    right: 0;
    left: auto;
}

/* Mobile: ensure dropdown is above bottom bar */
@media (max-width: 991.98px) {
    .ds-lang-menu {
        bottom: 100%;
        top: auto;
    }
}

/* ===================================================================
   HELP PAGE
   =================================================================== */

.ds-help-accordion .accordion-item {
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-sm);
    margin-bottom: 0.5rem;
    overflow: hidden;
}
.ds-help-accordion .accordion-item:last-child {
    margin-bottom: 0;
}

.ds-help-btn {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--ds-text-primary);
    background: var(--ds-surface-card);
    padding: 1rem 1.25rem;
}
.ds-help-btn:not(.collapsed) {
    background: var(--ds-accent-light);
    color: var(--ds-accent-light-text);
    box-shadow: none;
}
.ds-help-btn:focus {
    box-shadow: none;
}
.ds-help-btn::after {
    flex-shrink: 0;
}

.ds-help-body {
    font-size: 0.9rem;
    line-height: 1.7;
    color: var(--ds-text-secondary);
    padding: 1rem 1.25rem;
}
.ds-help-body h6 {
    font-weight: 700;
    color: var(--ds-text-primary);
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}
.ds-help-body h6:first-child {
    margin-top: 0;
}
.ds-help-body ul, .ds-help-body ol {
    padding-left: 1.25rem;
    margin-bottom: 0.75rem;
}
.ds-help-body li {
    margin-bottom: 0.35rem;
}
.ds-help-body p {
    margin-bottom: 0.75rem;
}

.ds-help-alert {
    display: flex;
    align-items: flex-start;
    gap: 0.25rem;
    padding: 0.875rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.85rem;
    line-height: 1.6;
    margin: 0.75rem 0;
}
.ds-help-alert i {
    flex-shrink: 0;
    margin-top: 0.15rem;
}
.ds-help-alert-danger {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}
.ds-help-alert-info {
    background: #eff6ff;
    color: #1e40af;
    border: 1px solid #bfdbfe;
}

.ds-help-icon-shield { color: var(--ds-accent-light-text); }
.ds-help-icon-clients { color: #1565c0; }
.ds-help-icon-search { color: #6a1b9a; }
.ds-help-icon-schedule { color: #f57f17; }
.ds-help-icon-sessions { color: #2e7d32; }
.ds-help-icon-files { color: #4527a0; }
.ds-help-icon-beck { color: #c62828; }
.ds-help-icon-analytics { color: #00695c; }

.ds-help-color-green { color: #4caf50; }
.ds-help-color-blue { color: #42a5f5; }
.ds-help-color-red { color: #ef5350; }

/* ===================================================================
   ASSESSMENTS (ОПРОСНИКИ)
   =================================================================== */

/* --- Indicators row on client card --- */
.ds-assess-indicators-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.ds-assess-indicator {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--ds-border);
    border-radius: 0.625rem;
    cursor: pointer;
    transition: all 0.15s;
    min-width: 5rem;
    background: var(--ds-surface-card);
}
.ds-assess-indicator:hover {
    border-color: var(--ds-accent);
    box-shadow: var(--ds-shadow);
    transform: translateY(-1px);
}
.ds-assess-indicator-empty {
    border-style: dashed;
    opacity: 0.7;
}
.ds-assess-indicator-empty:hover {
    opacity: 1;
}
.ds-assess-indicator-header {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    width: 100%;
    justify-content: space-between;
}
.ds-assess-indicator-abbr {
    font-family: 'Manrope', sans-serif;
    font-weight: 700;
    font-size: 0.7rem;
    color: var(--ds-text-secondary);
    letter-spacing: 0.02em;
}
.ds-assess-indicator-score {
    font-family: 'Manrope', sans-serif;
    font-weight: 800;
    font-size: 0.85rem;
}
.ds-assess-indicator-add {
    color: var(--ds-text-muted);
    font-size: 0.75rem;
}
.ds-assess-indicator-hint {
    font-size: 0.6rem;
    color: var(--ds-text-muted);
}

.ds-assess-sparkline {
    width: 3.75rem;
    height: 1.25rem;
    display: block;
}

/* --- Assessment page chart --- */
.ds-assess-chart {
    background: var(--ds-surface-card);
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-sm);
    padding: 1rem;
    overflow-x: auto;
}
.ds-assess-chart svg {
    width: 100%;
    max-width: 500px;
    height: auto;
    display: block;
    margin: 0 auto;
}
.ds-assess-chart-label {
    font-size: 9px;
    fill: var(--ds-text-muted);
    font-family: 'Inter', sans-serif;
}
.ds-assess-chart-score {
    font-size: 9px;
    fill: var(--ds-text-primary);
    font-weight: 600;
    font-family: 'Manrope', sans-serif;
}
.ds-assess-chart-empty {
    background: var(--ds-surface-card);
    border: 1px dashed var(--ds-border);
    border-radius: var(--ds-radius-sm);
}

/* --- History list --- */
.ds-assess-history-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0;
    border-bottom: 1px solid var(--ds-border);
    font-size: 0.85rem;
}
.ds-assess-history-row:last-child {
    border-bottom: none;
}
.ds-assess-history-date {
    flex: 1;
    color: var(--ds-text-secondary);
}
.ds-assess-history-severity {
    font-weight: 600;
    font-size: 0.8rem;
    min-width: 8rem;
}
.ds-assess-history-actions {
    flex-shrink: 0;
}

/* --- Score badge --- */
.ds-assess-score-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.2rem 0.6rem;
    border-radius: 1rem;
    font-weight: 700;
    font-size: 0.8rem;
    font-family: 'Manrope', sans-serif;
    border: 1px solid;
}
.ds-assess-score-badge-lg {
    padding: 0.35rem 0.85rem;
    font-size: 0.95rem;
}

/* --- Questionnaire form --- */
.ds-assess-question {
    display: flex;
    gap: 0.75rem;
    padding: 0.875rem 0;
    border-bottom: 1px solid var(--ds-border);
}
.ds-assess-question:last-child {
    border-bottom: none;
}
.ds-assess-question-num {
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 50%;
    background: var(--ds-accent-light);
    color: var(--ds-accent-light-text);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.75rem;
    flex-shrink: 0;
    font-family: 'Manrope', sans-serif;
}
.ds-assess-question-body {
    flex: 1;
}
.ds-assess-question-text {
    font-size: 0.9rem;
    color: var(--ds-text-primary);
    margin-bottom: 0.5rem;
    line-height: 1.5;
}
.ds-assess-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}
.ds-assess-option {
    cursor: pointer;
}
.ds-assess-option input[type="radio"] {
    display: none;
}
.ds-assess-option-label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.65rem;
    border: 1px solid var(--ds-border);
    border-radius: 0.5rem;
    font-size: 0.8rem;
    color: var(--ds-text-secondary);
    transition: all 0.15s;
    background: var(--ds-surface-card);
}
.ds-assess-option-label:hover {
    border-color: var(--ds-accent);
}
.ds-assess-option input[type="radio"]:checked + .ds-assess-option-label {
    background: var(--ds-accent);
    color: #fff;
    border-color: var(--ds-accent);
}
.ds-assess-option-value {
    font-weight: 700;
    font-size: 0.7rem;
    opacity: 0.7;
}

/* --- Responsive --- */
@media (max-width: 575.98px) {
    .ds-assess-indicators-row {
        gap: 0.375rem;
    }
    .ds-assess-indicator {
        padding: 0.4rem 0.5rem;
        min-width: 4rem;
    }
    .ds-assess-history-severity {
        display: none;
    }
    .ds-assess-options {
        flex-direction: column;
    }
}