/*
 * Unified visual system for the isolated Hasavurt demo.
 *
 * The functional component styles remain in silica-theme.css and hs-theme.css.
 * This layer remaps their tokens and gives every application surface the same
 * petrol / pine / mint language as the dispatcher dashboard.
 */

:root {
    --hs-petrol-950: #061a1d;
    --hs-petrol-900: #082428;
    --hs-petrol-800: #07363b;
    --hs-petrol-700: #124d50;
    --hs-pine-700: #285c4d;
    --hs-mint-600: #0a8b72;
    --hs-mint-500: #22aa87;
    --hs-mint-400: #43c7a2;
    --hs-mint-300: #72e0c0;
    --hs-ink: #193135;
    --hs-paper: #eef4f2;

    --bg-primary: #081b1f;
    --bg-secondary: #0d2529;
    --bg-tertiary: #123035;
    --bg-elevated: #102a2e;

    --surface-1: rgba(222, 248, 240, 0.025);
    --surface-2: rgba(222, 248, 240, 0.055);
    --surface-3: rgba(222, 248, 240, 0.09);
    --surface-hover: rgba(114, 224, 192, 0.1);

    --border-subtle: rgba(174, 222, 209, 0.1);
    --border-default: rgba(174, 222, 209, 0.17);
    --border-strong: rgba(174, 222, 209, 0.26);

    --text-primary: #eef9f6;
    --text-secondary: #9eb7b3;
    --text-tertiary: #78938f;
    --text-muted: #5e7774;

    --accent-primary: #43c7a2;
    --accent-secondary: #72e0c0;
    --accent-tertiary: #a5f0da;
    --accent-glow: rgba(67, 199, 162, 0.2);
    --accent-soft: rgba(67, 199, 162, 0.13);
    --accent-gradient: linear-gradient(135deg, #087467 0%, #0a9477 100%);

    --success: #2ca879;
    --success-soft: rgba(44, 168, 121, 0.14);
    --warning: #d89735;
    --warning-soft: rgba(216, 151, 53, 0.15);
    --danger: #d4564b;
    --danger-soft: rgba(212, 86, 75, 0.15);
    --info: #4d8ec8;
    --info-soft: rgba(77, 142, 200, 0.15);

    --sidebar-bg: linear-gradient(155deg, #123f4c 0%, #183f3d 52%, #385f49 100%);

    --silica-blue: #4d8ec8;
    --silica-blue-hover: #397bb6;
    --lv-shadow-sm: 0 2px 8px rgba(0, 12, 14, 0.16);
    --lv-shadow-md: 0 10px 28px rgba(0, 12, 14, 0.2);
    --lv-shadow-lg: 0 22px 54px rgba(0, 12, 14, 0.28);

    --hs-status-classified: #49bda2;
    --hs-status-routed: #4d8ec8;
    --hs-status-assigned: #6689c7;
    --hs-chart-1: #4d8ec8;
    --hs-chart-2: #43c7a2;
    --hs-chart-3: #6d9d90;
    --hs-chart-4: #8a76b5;
    --hs-chart-5: #76b9d1;
    --hs-chart-6: #d89735;
    --hs-chart-7: #2ca879;
    --hs-chart-8: #a97fbb;
}

html[data-theme="light"] {
    --bg-primary: #eef4f2;
    --bg-secondary: #f8fbfa;
    --bg-tertiary: #e6efec;
    --bg-elevated: #ffffff;

    --surface-1: rgba(7, 54, 59, 0.018);
    --surface-2: rgba(7, 54, 59, 0.04);
    --surface-3: rgba(7, 54, 59, 0.07);
    --surface-hover: rgba(10, 139, 114, 0.08);

    --border-subtle: rgba(7, 54, 59, 0.09);
    --border-default: rgba(7, 54, 59, 0.15);
    --border-strong: rgba(7, 54, 59, 0.24);

    --text-primary: #193135;
    --text-secondary: #617679;
    --text-tertiary: #71878a;
    --text-muted: #91a2a4;

    --accent-primary: #087765;
    --accent-secondary: #0a8b72;
    --accent-tertiary: #1baa87;
    --accent-glow: rgba(10, 139, 114, 0.16);
    --accent-soft: rgba(10, 139, 114, 0.11);
    --sidebar-bg: linear-gradient(155deg, #123f4c 0%, #183f3d 52%, #385f49 100%);

    --lv-shadow-sm: 0 2px 8px rgba(16, 52, 48, 0.06);
    --lv-shadow-md: 0 10px 30px rgba(16, 52, 48, 0.09);
    --lv-shadow-lg: 0 22px 54px rgba(16, 52, 48, 0.13);
}

/* Application shell */
body.hs-app-page {
    background:
        radial-gradient(circle at 88% -12%, rgba(67, 199, 162, 0.09), transparent 32rem),
        var(--bg-primary);
}

body.hs-app-page::before {
    display: none;
}

body.hs-app-page .main-content {
    background:
        radial-gradient(circle at 90% 0%, rgba(67, 199, 162, 0.075), transparent 27rem),
        var(--bg-primary);
}

body.hs-app-page .main-content > .page-content {
    margin: 26px auto 0;
    padding: 0 26px 44px;
}

body.hs-app-page .sidebar {
    color: #eefbf7;
    background:
        radial-gradient(circle at 30% -5%, rgba(97, 188, 154, 0.2), transparent 30%),
        var(--sidebar-bg);
    border-right: 0;
    box-shadow: 14px 0 40px rgba(4, 31, 32, 0.14);
}

body.hs-app-page .sidebar-header,
body.hs-app-page .sidebar-footer {
    border-color: rgba(255, 255, 255, 0.1);
}

body.hs-app-page .sidebar-logo,
body.hs-app-page .sidebar-logo:hover,
body.hs-app-page .sidebar .logo-text {
    color: #ffffff;
}

body.hs-app-page .sidebar .logo-icon {
    color: #dcfff5;
    background: rgba(255, 255, 255, 0.11);
    border: 1px solid rgba(255, 255, 255, 0.22);
    box-shadow: none;
}

body.hs-app-page .sidebar-nav > div {
    color: rgba(224, 246, 239, 0.5) !important;
}

body.hs-app-page .sidebar .silica-menu-item {
    color: rgba(240, 252, 248, 0.72);
    border-radius: 11px;
}

body.hs-app-page .sidebar .silica-menu-item:hover,
body.hs-app-page .sidebar .silica-menu-item.active {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.11);
    box-shadow: inset 3px 0 0 var(--hs-mint-400);
}

body.hs-app-page .sidebar .silica-menu-item.active::before {
    display: none;
}

body.hs-app-page .main-header {
    color: rgba(255, 255, 255, 0.84);
    background: rgba(7, 54, 59, 0.96);
    border-bottom-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 8px 28px rgba(4, 31, 32, 0.08);
}

body.hs-app-page .main-header .breadcrumb-nav,
body.hs-app-page .main-header .breadcrumb-nav a,
body.hs-app-page .main-header .header-right > span {
    color: rgba(255, 255, 255, 0.68) !important;
}

body.hs-app-page .main-header .breadcrumb-nav a:hover,
body.hs-app-page .main-header .breadcrumb-nav span:last-child {
    color: #ffffff;
}

body.hs-app-page .main-header .header-btn {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.17);
}

body.hs-app-page .main-header .header-btn:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.28);
}

body.hs-app-page .mobile-navbar {
    color: #ffffff;
    background: rgba(7, 54, 59, 0.97);
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

body.hs-app-page .mobile-logo {
    color: #ffffff;
}

body.hs-app-page .mobile-logo-icon {
    color: #dcfff5;
    background: rgba(255, 255, 255, 0.11);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

body.hs-app-page .mobile-menu-btn {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.17);
}

/* Typography and page rhythm */
body.hs-app-page h1 {
    font-size: clamp(25px, 2.2vw, 34px);
    font-weight: 760;
    letter-spacing: -0.035em;
}

body.hs-app-page h2 {
    letter-spacing: -0.025em;
}

body.hs-app-page .lv-tabular,
body.hs-app-page .mono,
body.hs-app-page time,
body.hs-app-page td:first-child {
    font-variant-numeric: tabular-nums;
}

body.hs-app-page .skip-link:focus {
    color: var(--hs-petrol-800);
    background: var(--hs-mint-300);
}

/* Panels */
body.hs-app-page .card,
body.hs-app-page .silica-card,
body.hs-app-page .silica-card-large,
body.hs-app-page .hs-filters,
body.hs-app-page .hs-stat-filters,
body.hs-app-page .hs-map-panel,
body.hs-app-page .hs-power-side,
body.hs-app-page .hs-sc-card {
    background: var(--bg-elevated);
    border-color: var(--border-subtle);
    border-radius: 18px;
    box-shadow: var(--lv-shadow-sm);
}

body.hs-app-page .card:hover,
body.hs-app-page .silica-card:hover,
body.hs-app-page .silica-card-large:hover {
    border-color: var(--border-default);
    box-shadow: var(--lv-shadow-md);
}

body.hs-app-page .card-header,
body.hs-app-page .silica-card-header {
    min-height: 54px;
    padding: 15px 20px;
    border-bottom-color: var(--border-subtle);
}

body.hs-app-page .card-header > i,
body.hs-app-page .card-title > i {
    color: var(--accent-secondary) !important;
}

/* Buttons and links */
body.hs-app-page .btn-primary,
body.hs-app-page .silica-btn-primary {
    color: #ffffff;
    background: var(--accent-gradient);
    border-color: transparent;
    box-shadow: 0 7px 18px rgba(7, 116, 103, 0.2);
}

body.hs-app-page .btn-primary:hover,
body.hs-app-page .btn-primary:focus,
body.hs-app-page .silica-btn-primary:hover {
    color: #ffffff;
    box-shadow: 0 10px 24px rgba(7, 116, 103, 0.28);
}

body.hs-app-page .btn-secondary,
body.hs-app-page .btn-outline-secondary,
body.hs-app-page .silica-btn:not(.silica-btn-primary):not(.silica-btn-danger) {
    background: var(--surface-2);
    border-color: var(--border-default);
}

body.hs-app-page .btn-secondary:hover,
body.hs-app-page .btn-outline-secondary:hover,
body.hs-app-page .silica-btn:not(.silica-btn-primary):not(.silica-btn-danger):hover {
    background: var(--surface-3);
    border-color: var(--border-strong);
}

body.hs-app-page .btn-outline-primary {
    color: var(--accent-primary);
    background: var(--accent-soft);
    border-color: color-mix(in srgb, var(--accent-primary) 30%, transparent);
}

/* Forms */
body.hs-app-page .form-control,
body.hs-app-page .form-select,
body.hs-app-page .silica-search,
body.hs-app-page textarea {
    min-height: 42px;
    color: var(--text-primary);
    background-color: var(--surface-2);
    border-color: var(--border-default);
    border-radius: 11px;
}

body.hs-app-page .form-control-sm,
body.hs-app-page .form-select-sm {
    min-height: 36px;
}

body.hs-app-page .form-control:focus,
body.hs-app-page .form-select:focus,
body.hs-app-page .silica-search:focus,
body.hs-app-page textarea:focus {
    color: var(--text-primary);
    background-color: var(--bg-elevated);
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-soft);
}

body.hs-app-page .form-check-input:checked {
    background-color: var(--accent-primary);
    border-color: var(--accent-primary);
}

body.hs-app-page .form-label {
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.015em;
}

/* Tables */
body.hs-app-page .table-responsive {
    border-radius: inherit;
}

body.hs-app-page .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--text-primary);
    --bs-table-hover-bg: var(--surface-hover);
    --bs-table-hover-color: var(--text-primary);
    margin-bottom: 0;
}

body.hs-app-page .table thead th {
    color: var(--text-tertiary);
    background: color-mix(in srgb, var(--bg-tertiary) 72%, transparent);
    border-bottom-color: var(--border-default);
    font-size: 10.5px;
    font-weight: 760;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

body.hs-app-page .table > :not(caption) > * > * {
    border-bottom-color: var(--border-subtle);
}

body.hs-app-page .table tbody tr {
    transition: background-color 150ms ease;
}

body.hs-app-page .table tbody tr:last-child > * {
    border-bottom: 0;
}

/* Tabs, filters and compact navigation */
body.hs-app-page .silica-tabs,
body.hs-app-page .nav-tabs {
    padding: 4px;
    background: var(--surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: 13px;
}

body.hs-app-page .silica-tab.active,
body.hs-app-page .nav-tabs .nav-link.active {
    color: var(--text-primary);
    background: var(--bg-elevated);
    border-color: var(--border-default);
    box-shadow: var(--lv-shadow-sm);
}

body.hs-app-page .nav-tabs .nav-link {
    color: var(--text-secondary);
    border-radius: 9px;
}

body.hs-app-page .hs-filters,
body.hs-app-page .hs-stat-filters {
    padding: 16px;
}

body.hs-app-page .hs-my-work-scope {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 16px;
    color: var(--text-primary);
    background:
        linear-gradient(100deg,
            color-mix(in srgb, var(--accent-secondary) 12%, var(--bg-elevated)),
            var(--bg-elevated) 68%);
    border: 1px solid color-mix(in srgb, var(--accent-secondary) 28%, var(--border-subtle));
    border-radius: 15px;
    box-shadow: var(--lv-shadow-sm);
}

body.hs-app-page .hs-my-work-scope__icon {
    display: grid;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    place-items: center;
    color: var(--hs-petrol-900);
    background: var(--hs-mint-300);
    border-radius: 11px;
}

body.hs-app-page .hs-my-work-scope > div > strong,
body.hs-app-page .hs-my-work-scope > div > span {
    display: block;
}

body.hs-app-page .hs-my-work-scope strong {
    font-size: 13.5px;
}

body.hs-app-page .hs-my-work-scope div > span {
    margin-top: 1px;
    color: var(--text-secondary);
    font-size: 12px;
}

body.hs-app-page .hs-my-work-scope__count {
    min-width: 38px;
    margin-left: auto;
    padding: 5px 9px;
    color: var(--accent-secondary);
    font-size: 13px;
    font-weight: 750;
    text-align: center;
    background: color-mix(in srgb, var(--accent-secondary) 10%, transparent);
    border-radius: 999px;
}

body.hs-app-page .hs-filters__check {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* Domain surfaces */
body.hs-app-page .gchip {
    border-color: color-mix(in srgb, var(--chip-color) 36%, var(--border-subtle));
    box-shadow: var(--lv-shadow-sm);
}

html[data-theme="dark"] body.hs-app-page .gchip {
    background: rgba(16, 42, 46, 0.84);
}

html[data-theme="light"] body.hs-app-page .gchip {
    background: rgba(255, 255, 255, 0.94);
}

body.hs-app-page .news-card {
    background: var(--bg-elevated);
    border-radius: 16px;
    box-shadow: var(--lv-shadow-sm);
}

body.hs-app-page .news-card:hover {
    border-color: var(--border-default);
    box-shadow: var(--lv-shadow-md);
}

body.hs-app-page .hs-board-col {
    background: color-mix(in srgb, var(--bg-tertiary) 58%, transparent);
    border-color: var(--border-subtle);
    border-radius: 16px;
}

body.hs-app-page .hs-board-col__header {
    border-bottom-color: var(--border-subtle);
}

body.hs-app-page .hs-appeal-card,
body.hs-app-page .hs-tpl-card,
body.hs-app-page .hs-sector-row,
body.hs-app-page .hs-sc-tile {
    background: var(--bg-elevated);
    border-color: var(--border-subtle);
    box-shadow: var(--lv-shadow-sm);
}

body.hs-app-page .hs-appeal-card:hover,
body.hs-app-page .hs-tpl-card:hover,
body.hs-app-page .hs-sector-row:hover,
body.hs-app-page .hs-sc-tile:hover {
    border-color: var(--border-default);
    box-shadow: var(--lv-shadow-md);
}

body.hs-app-page .hs-sc-hero {
    color: #ffffff;
    background:
        radial-gradient(circle at 84% 0%, rgba(114, 224, 192, 0.22), transparent 24rem),
        linear-gradient(118deg, var(--hs-petrol-800), #0a4447 48%, var(--hs-pine-700));
    border-color: rgba(255, 255, 255, 0.11);
    box-shadow: var(--lv-shadow-md);
}

body.hs-app-page .hs-sc-hero__title,
body.hs-app-page .hs-sc-hero__clock {
    color: #ffffff;
}

body.hs-app-page .hs-sc-hero__sub,
body.hs-app-page .hs-sc-hero__date {
    color: rgba(238, 253, 249, 0.68);
}

/* Overlays, feedback and paging */
body.hs-app-page .modal-content,
body.hs-app-page .dropdown-menu,
body.hs-app-page .silica-dropdown-menu {
    background: var(--bg-elevated) !important;
    border-color: var(--border-default) !important;
    box-shadow: var(--lv-shadow-lg) !important;
}

body.hs-app-page .modal-content {
    border-radius: 18px;
}

body.hs-app-page .modal-backdrop {
    background-color: var(--hs-petrol-950);
}

body.hs-app-page .page-link {
    color: var(--text-secondary);
    background: var(--bg-elevated);
    border-color: var(--border-subtle);
}

body.hs-app-page .page-link:hover,
body.hs-app-page .page-item.active .page-link {
    color: #ffffff;
    background: var(--accent-gradient);
    border-color: transparent;
}

body.hs-app-page .alert {
    border-radius: 12px;
}

body.hs-app-page .badge {
    letter-spacing: 0.01em;
}

/* Login */
body.hs-auth-page {
    min-height: 100vh;
    background: var(--bg-primary);
}

.hs-login-page {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 24px;
    overflow: hidden;
    background:
        radial-gradient(circle at 78% 12%, rgba(114, 224, 192, 0.2), transparent 30rem),
        radial-gradient(circle at 16% 88%, rgba(40, 92, 77, 0.34), transparent 34rem),
        linear-gradient(135deg, var(--hs-petrol-950), var(--hs-petrol-800) 58%, var(--hs-pine-700));
}

.hs-login-page::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    opacity: 0.17;
    background:
        repeating-radial-gradient(
            ellipse at 85% 20%,
            transparent 0 23px,
            rgba(255, 255, 255, 0.2) 24px 25px,
            transparent 26px 42px
        );
    transform: scale(1.25) rotate(-6deg);
}

.hs-login-card {
    width: min(100%, 410px);
    padding: 38px 34px;
    color: #eef9f6;
    background: rgba(8, 36, 40, 0.76);
    border: 1px solid rgba(213, 246, 236, 0.17);
    border-radius: 24px;
    box-shadow: 0 28px 70px rgba(0, 12, 14, 0.34);
    backdrop-filter: blur(18px) saturate(130%);
    -webkit-backdrop-filter: blur(18px) saturate(130%);
    animation: hsThemeEnter 380ms cubic-bezier(0.16, 1, 0.3, 1);
}

.hs-login-card h2 {
    color: #ffffff;
}

.hs-login-card p,
.hs-login-card .form-label {
    color: rgba(232, 250, 245, 0.67);
}

.hs-login-card .form-control {
    min-height: 46px;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.075);
    border-color: rgba(255, 255, 255, 0.14);
    border-radius: 12px;
}

.hs-login-card .form-control:focus {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.11);
    border-color: var(--hs-mint-300);
    box-shadow: 0 0 0 3px rgba(114, 224, 192, 0.14);
}

.hs-login-card .btn-primary {
    min-height: 46px;
    color: var(--hs-petrol-800);
    background: var(--hs-mint-300);
    border-color: var(--hs-mint-300);
    box-shadow: 0 10px 24px rgba(0, 12, 14, 0.2);
}

.hs-login-card .btn-primary:hover {
    color: var(--hs-petrol-800);
    background: #91ead0;
    border-color: #91ead0;
}

.hs-login-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin-bottom: 20px;
    color: #dcfff5;
    background: rgba(255, 255, 255, 0.11);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 15px;
    box-shadow: none;
    font-size: 24px;
    font-weight: 800;
}

.hs-login-pass {
    position: relative;
}

.hs-login-pass .form-control {
    padding-right: 46px;
}

.hs-login-pass__eye {
    position: absolute;
    top: 50%;
    right: 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    min-height: 32px;
    color: rgba(232, 250, 245, 0.68);
    background: transparent;
    border: 0;
    border-radius: 8px;
    transform: translateY(-50%);
}

.hs-login-pass__eye:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.1);
}

/* Public TV/embed pages inherit the same palette without the application shell. */
body.hs-embed-page {
    min-height: 100vh;
    color: var(--text-primary);
    background:
        radial-gradient(circle at 86% -12%, rgba(67, 199, 162, 0.09), transparent 34rem),
        var(--bg-primary);
}

body.hs-embed-page .hs-tv {
    background:
        radial-gradient(circle at 88% -14%, rgba(67, 199, 162, 0.1), transparent 34rem),
        var(--bg-primary);
}

body.hs-embed-page .hs-tv__topbar {
    padding: 12px 16px;
    color: #ffffff;
    background:
        radial-gradient(circle at 82% 0%, rgba(114, 224, 192, 0.2), transparent 22rem),
        linear-gradient(118deg, var(--hs-petrol-800), #0a4447 52%, var(--hs-pine-700));
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 18px;
    box-shadow: var(--lv-shadow-md);
}

body.hs-embed-page .hs-tv__brand-mark {
    color: #dcfff5;
    background: rgba(255, 255, 255, 0.11);
    border: 1px solid rgba(255, 255, 255, 0.22);
    box-shadow: none;
}

body.hs-embed-page .hs-tv__brand-text,
body.hs-embed-page .hs-tv__clock {
    color: #ffffff;
}

body.hs-embed-page .hs-tv__date {
    color: rgba(238, 253, 249, 0.68);
}

body.hs-embed-page .hs-tv__theme-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 12px;
    color: #eafff8;
    background: rgba(255, 255, 255, 0.09);
    border: 1px solid rgba(255, 255, 255, 0.17);
    border-radius: 11px;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: background 150ms ease, border-color 150ms ease, transform 150ms ease;
}

body.hs-embed-page .hs-tv__theme-btn:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.28);
    transform: translateY(-1px);
}

body.hs-embed-page .hs-tv__theme-btn:focus-visible {
    outline: 3px solid rgba(114, 224, 192, 0.38);
    outline-offset: 3px;
}

body.hs-embed-page .hs-tv .gchip,
body.hs-embed-page .hs-tv-col,
body.hs-embed-page .hs-tv-feed-card {
    background: color-mix(in srgb, var(--bg-elevated) 92%, transparent);
    border-color: var(--border-subtle);
    box-shadow: var(--lv-shadow-sm);
}

body.hs-embed-page .hs-tv-col__summary {
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 4px 8px;
    color: inherit;
    text-decoration: none;
    border-radius: 9px;
}

body.hs-embed-page .hs-tv-col__summary .hs-tv-col__count {
    grid-column: 1;
}

body.hs-embed-page .hs-tv-col__summary .hs-tv-col__title {
    grid-column: 1;
}

body.hs-embed-page .hs-tv-col__summary > i {
    grid-column: 2;
    grid-row: 1 / 3;
    align-self: center;
    color: var(--text-tertiary);
    font-size: 18px;
}

body.hs-embed-page .hs-tv-col__summary:hover > i {
    color: var(--accent-secondary);
}

body.hs-embed-page .hs-tv-col__item,
body.hs-embed-page .hs-tv-feed-card {
    color: var(--text-secondary);
    text-decoration: none;
    cursor: pointer;
}

body.hs-embed-page .hs-tv-col__item:hover {
    color: var(--text-primary);
    background: var(--surface-3);
}

body.hs-embed-page .hs-tv-feed-card:hover {
    color: inherit;
    border-color: var(--border-default);
    transform: translateY(-1px);
}

body.hs-embed-page .hs-tv__map {
    border-color: var(--border-default);
    box-shadow: var(--lv-shadow-sm);
}

body.hs-embed-page .hs-tv__map .leaflet-control-zoom a {
    color: var(--text-primary);
    background: var(--bg-elevated);
    border-color: var(--border-default);
}

body.hs-embed-page .hs-tv__map .leaflet-control-zoom a:hover {
    color: var(--accent-primary);
    background: var(--surface-3);
}

html[data-theme="light"] body.hs-embed-page .hs-tv {
    background:
        radial-gradient(circle at 88% -14%, rgba(67, 199, 162, 0.1), transparent 34rem),
        #eef4f2;
}

html[data-theme="light"] body.hs-embed-page .hs-tv .gchip,
html[data-theme="light"] body.hs-embed-page .hs-tv-col,
html[data-theme="light"] body.hs-embed-page .hs-tv-feed-card {
    background: rgba(255, 255, 255, 0.96);
}

/* Карточка обращения: содержательный поток вместо пустой переписки. */
.hs-appeal-content {
    display: grid;
    gap: 12px;
}

.hs-appeal-content__item {
    min-width: 0;
}

.hs-appeal-content__item + .hs-appeal-content__item {
    padding: 14px 16px;
    border: 1px solid var(--border-subtle);
    border-left: 3px solid var(--border-strong);
    border-radius: 10px;
    background: var(--surface-2);
}

.hs-appeal-content__item--out {
    border-left-color: var(--success);
    background: var(--success-soft);
}

.hs-appeal-content__item--internal {
    border-left-color: var(--warning);
    background: var(--warning-soft);
}

.hs-appeal-content__label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 6px;
    color: var(--text-tertiary);
    font-size: 10.5px;
    font-weight: 750;
    letter-spacing: 0.055em;
    line-height: 1.35;
    text-transform: uppercase;
}

.hs-appeal-content__label time {
    flex: 0 0 auto;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
}

.hs-appeal-content__text {
    margin: 0;
    color: var(--text-primary);
    font-size: 14px;
    line-height: 1.65;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.hs-appeal-facts {
    margin: 0;
}

.hs-appeal-fact {
    display: grid;
    grid-template-columns: minmax(110px, 40%) minmax(0, 1fr);
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--border-subtle);
    font-size: 12.5px;
    line-height: 1.45;
}

.hs-appeal-fact:first-child {
    padding-top: 0;
}

.hs-appeal-fact:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.hs-appeal-fact dt {
    color: var(--text-secondary);
    font-weight: 550;
}

.hs-appeal-fact dd {
    min-width: 0;
    margin: 0;
    color: var(--text-primary);
    font-weight: 620;
    overflow-wrap: anywhere;
}

.hs-appeal-fact__empty {
    color: var(--text-tertiary) !important;
    font-weight: 550 !important;
}

.hs-appeal-create {
    width: 100%;
    max-width: 880px;
}

.hs-upload-field {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 92px;
    padding: 16px 18px;
    border: 1px dashed var(--border-strong);
    border-radius: 14px;
    background: color-mix(in srgb, var(--accent-primary) 4%, var(--surface-1));
    cursor: pointer;
    transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.hs-upload-field:hover {
    border-color: var(--accent-primary);
    background: color-mix(in srgb, var(--accent-primary) 8%, var(--surface-1));
    transform: translateY(-1px);
}

.hs-upload-field:has(+ input:focus-visible) {
    outline: 2px solid var(--accent-primary);
    outline-offset: 3px;
}

.hs-upload-field__icon {
    display: inline-grid;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 12px;
    color: var(--accent-primary);
    background: var(--accent-soft);
    font-size: 20px;
}

.hs-upload-field__title,
.hs-upload-field__meta {
    display: block;
}

.hs-upload-field__title {
    color: var(--text-primary);
    font-size: 13.5px;
    font-weight: 720;
}

.hs-upload-field__meta {
    margin-top: 3px;
    color: var(--text-secondary);
    font-size: 11.5px;
}

.hs-upload-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 20px;
    margin-top: 8px;
    color: var(--text-secondary);
    font-size: 11.5px;
}

.hs-upload-list span {
    max-width: 100%;
    padding: 4px 8px;
    overflow: hidden;
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    background: var(--surface-2);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hs-appeal-media-file {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 74px;
    padding: 12px 14px;
    color: var(--text-primary);
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    background: var(--surface-2);
    text-decoration: none;
}

.hs-appeal-media-file:hover {
    color: var(--accent-secondary);
    border-color: var(--border-strong);
    background: var(--surface-3);
}

.hs-appeal-media-file__icon {
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 10px;
    color: var(--accent-primary);
    background: var(--accent-soft);
    font-size: 17px;
}

.hs-appeal-media-file__body,
.hs-appeal-media-file__name,
.hs-appeal-media-file__meta {
    display: block;
    min-width: 0;
}

.hs-appeal-media-file__name {
    overflow: hidden;
    font-size: 12.5px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hs-appeal-media-file__meta {
    margin-top: 2px;
    color: var(--text-secondary);
    font-size: 10.5px;
}

@keyframes hsThemeEnter {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 991.98px) {
    body.hs-app-page .main-content > .page-content {
        max-width: none;
        margin: 0;
        padding: 18px 16px 36px;
    }

    body.hs-app-page .sidebar {
        box-shadow: 18px 0 48px rgba(0, 12, 14, 0.32);
    }
}

@media (max-width: 575.98px) {
    body.hs-app-page h1 {
        font-size: 24px !important;
    }

    body.hs-app-page .card,
    body.hs-app-page .silica-card,
    body.hs-app-page .silica-card-large,
    body.hs-app-page .hs-filters,
    body.hs-app-page .hs-stat-filters {
        border-radius: 14px;
    }

    body.hs-app-page .hs-my-work-scope {
        align-items: flex-start;
        border-radius: 14px;
    }

    body.hs-app-page .hs-my-work-scope__count {
        align-self: center;
    }

    .hs-appeal-fact {
        grid-template-columns: 1fr;
        gap: 2px;
    }

    .hs-appeal-content__label {
        align-items: flex-start;
        flex-direction: column;
        gap: 2px;
    }

    .hs-login-page {
        padding: 16px;
    }

    .hs-login-card {
        padding: 30px 24px;
        border-radius: 20px;
    }
}

@media (max-width: 1100px) {
    body.hs-embed-page .hs-tv__theme-btn span {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hs-login-card {
        animation: none;
    }

    body.hs-app-page *,
    body.hs-auth-page *,
    body.hs-embed-page * {
        scroll-behavior: auto !important;
    }
}