/* Shared account-theme colors. Public pages always receive the light preference. */
:root {
    --surface: #ffffff;
    --surface-muted: #f6f8f5;
    --line: #dce4df;
    --muted-text: #64748b;
    --on-primary: #142016;
}

/* Keep the existing Light-mode text for pale accents; use white on dark accents. */
html[data-theme="light"][data-accent-contrast="light"] :is(
    nav .nav-item,
    .settings-update,
    .support-submit,
    .finance-view .finance-pay-button:not(.finance-pay-button-disabled),
    .finance-checklists .finance-list .finance-item .status.status-tag-1 p,
    .sum-create,
    .contacts-create,
    .payers-create,
    .calculator #reset,
    .help-sidebar__item.active:not(.help-sidebar__item--document),
    .site-footer__hotline span,
    .landing-button--primary,
    .auth-submit,
    .view .btn
) {
    color: #fff;
}

html[data-theme="light"][data-accent-contrast="light"] .settings-notification-option input:checked::after,
html[data-theme="light"][data-accent-contrast="light"] .auth-check > input:checked + .auth-check__box::after {
    border-color: #fff;
}

html[data-theme="light"][data-accent-contrast="light"] .calculator input::selection {
    color: #fff;
}

html[data-theme="light"][data-accent-contrast="light"] :is(
    .support-submit:hover:not(:disabled),
    .calculator #reset:hover:not(:disabled),
    .landing-button--primary:hover
) {
    background: color-mix(in srgb, var(--primary) 88%, black);
}

html[data-theme="dark"] {
    color-scheme: dark;
    --background-color: #111715;
    --secondary-color: #e5ebe7;
    --secondary-color-2: #a7b7ae;
    --secondary-color-3: #39483f;
    --foreground-color: #e5ebe7;
    --foreground2-color: #f5f7f6;
    --foreground3-color: #a7b7ae;
    --surface: #1b2420;
    --surface-muted: #243029;
    --line: #39483f;
    --muted-text: #a7b7ae;
    --on-primary: #142016;
    --modal-bg: var(--surface);
    --modal-fg: var(--foreground2-color);
    --modal-muted: var(--muted-text);
    --modal-border: var(--line);
}

.settings-theme-view {
    margin-top: 20px;
    width: calc(100% - 70px);
}

.settings-theme-options {
    min-width: 0;
    margin: 0;
    padding: 16px 35px 20px;
    border: 0;
}

.settings-theme-options legend {
    display: block;
    width: 100%;
    padding: 0;
}

.settings-theme-description {
    margin: 0 0 16px;
    color: var(--muted-text);
    font-size: .9rem;
}

.settings-theme-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.settings-theme-option {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 58px;
    padding: 10px 14px;
    box-sizing: border-box;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface);
    color: var(--fg);
    cursor: pointer;
}

.settings-theme-option:has(input:checked) {
    border-color: var(--primary);
    background: color-mix(in srgb, var(--primary) 17%, var(--surface));
}

.settings-theme-option:has(input:focus-visible) {
    outline: 3px solid color-mix(in srgb, var(--primary) 55%, transparent);
    outline-offset: 2px;
}

.settings-theme-option input {
    flex: none;
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--primary);
    cursor: pointer;
}

.settings-theme-option img {
    flex: none;
    width: 24px;
    height: 24px;
}

.settings-theme-status {
    min-height: 1.2em;
    margin-top: 10px;
    color: var(--muted-text);
    font-size: .85rem;
}

.settings-theme-status.error {
    color: #b91c1c;
}

@media (max-width: 600px) {
    .settings-theme-view { width: calc(100% - 30px); }
    .settings-theme-options { padding: 16px 14px 20px; }
    .settings-theme-list { grid-template-columns: 1fr; }
}

html[data-theme="dark"] body,
html[data-theme="dark"] .css-input,
html[data-theme="dark"] .css-textarea,
html[data-theme="dark"] .css-select,
html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
    background-color: var(--surface);
    color: var(--fg);
    border-color: var(--line);
}

html[data-theme="dark"] body { background-color: var(--bg); }
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: var(--muted-text); }
html[data-theme="dark"] .css-view { border-color: var(--line); background: var(--surface); }
html[data-theme="dark"] .css-main { color: var(--fg); }
html[data-theme="dark"] .css-button { background: var(--surface-muted); color: var(--fg2); border: 1px solid var(--line); }
html[data-theme="dark"] .css-button:hover:not(:disabled) { background: color-mix(in srgb, var(--surface-muted) 78%, var(--fg2)); }
html[data-theme="dark"] header { border-bottom: 1px solid var(--line); }
html[data-theme="dark"] nav { background: var(--surface); border-bottom: 1px solid var(--line); }
html[data-theme="dark"] nav .nav-item { color: var(--fg); }
html[data-theme="dark"] nav .nav-item:hover,
html[data-theme="dark"] nav .nav-item.active { color: var(--fg2); }
html[data-theme="dark"] nav .nav-item::after { background: var(--primary); }
html[data-theme="dark"] nav .nav-button { background: var(--primary); color: var(--on-primary); border-color: transparent; }
html[data-theme="dark"] nav .nav-button:hover { background: color-mix(in srgb, var(--primary) 82%, white); }
html[data-theme="dark"] .phone-header,
html[data-theme="dark"] .phone-nav { background: var(--surface); }
html[data-theme="dark"] .phone-header { border-bottom: 1px solid var(--line); }
html[data-theme="dark"] .phone-nav .nav-item.active { background: var(--surface-muted); color: var(--fg2); }
html[data-theme="dark"] .settings-update,
html[data-theme="dark"] .support-submit { background: var(--primary); color: var(--on-primary); }
html[data-theme="dark"] .settings-update:hover:not(:disabled),
html[data-theme="dark"] .support-submit:hover:not(:disabled) { background: color-mix(in srgb, var(--primary) 82%, white); }
html[data-theme="dark"] .settings-info-item,
html[data-theme="dark"] .settings-notification-option,
html[data-theme="dark"] .settings-session-card { background: var(--surface-muted); border-color: var(--line); }
html[data-theme="dark"] .settings-notifications-description,
html[data-theme="dark"] .settings-sessions-description,
html[data-theme="dark"] .settings-sessions-status,
html[data-theme="dark"] .settings-session-subtitle,
html[data-theme="dark"] .settings-session-detail,
html[data-theme="dark"] .settings-session-agent { color: var(--muted-text); }
html[data-theme="dark"] .settings-notification-option input:checked::after { border-color: var(--on-primary); }
html[data-theme="dark"] .settings-theme-status.error,
html[data-theme="dark"] .settings-sessions-status.error,
html[data-theme="dark"] .sum-dur,
html[data-theme="dark"] .phone-nav .nav-balance-amount.is-negative,
html[data-theme="dark"] .support-field > span:first-child { color: #ff9b9b; }

html[data-theme="dark"] img[src^="/icons/nav/"],
html[data-theme="dark"] img[src^="/icons/secondary_"],
html[data-theme="dark"] img[src="/icons/off_favorite.svg"],
html[data-theme="dark"] img[src="/icons/system.svg"],
html[data-theme="dark"] img[src="/icons/light_mode.svg"],
html[data-theme="dark"] img[src="/icons/dark_mode.svg"] {
    filter: brightness(0) invert(.9);
}

html[data-theme="dark"] img[src="/images/logo.svg"] {
    filter: invert(1) brightness(1.35);
}

html[data-theme="dark"] .css-select,
html[data-theme="dark"] .calculator select,
html[data-theme="dark"] .order-hint-input,
html[data-theme="dark"] .edrpou-hint-input,
html[data-theme="dark"] .contacts-input {
    background-image: url("/icons/dropdown2.svg");
}

html[data-theme="dark"] .calculator {
    --calculator-surface: var(--surface);
    --calculator-surface-muted: var(--surface-muted);
    --calculator-border: var(--line);
    --calculator-border-strong: #63736b;
    --calculator-text: var(--fg2);
    --calculator-muted: var(--muted-text);
    --calculator-error: #ff9b9b;
    --calculator-shadow: 0 12px 32px rgba(0, 0, 0, .2);
}
html[data-theme="dark"] .calculator input:disabled,
html[data-theme="dark"] .calculator select:disabled,
html[data-theme="dark"] .calculator #leave:disabled,
html[data-theme="dark"] .calculator #submit:disabled,
html[data-theme="dark"] .calculator #reset:disabled {
    background-color: var(--surface-muted);
    color: var(--muted-text);
}
html[data-theme="dark"] .calculator-check:has(input:disabled) {
    background: var(--surface-muted);
    color: var(--muted-text);
    border-color: var(--line);
}
html[data-theme="dark"] .calculator #leave { color: var(--fg); }
html[data-theme="dark"] .calculator #submit { background: var(--primary); color: var(--on-primary); }
html[data-theme="dark"] .calculator #submit:hover:not(:disabled) { background: color-mix(in srgb, var(--primary) 82%, white); }
html[data-theme="dark"] .calculator #reset { background: var(--surface-muted); color: var(--fg2); border-color: var(--line); }
html[data-theme="dark"] .calculator #reset:hover:not(:disabled) { background: color-mix(in srgb, var(--surface-muted) 78%, var(--fg2)); }

html[data-theme="dark"] .finance-view .finance-pay-button:not(.finance-pay-button-disabled),
html[data-theme="dark"] .sum-create,
html[data-theme="dark"] .contacts-create,
html[data-theme="dark"] .payers-create { background: var(--primary); color: var(--on-primary); }
html[data-theme="dark"] .finance-view .finance-pay-button:not(.finance-pay-button-disabled),
html[data-theme="dark"] .sum-create { background: var(--primary); border-color: transparent; }
html[data-theme="dark"] .finance-view .finance-pay-button:not(.finance-pay-button-disabled):hover,
html[data-theme="dark"] .sum-create:hover:not(:disabled) { background: color-mix(in srgb, var(--primary) 82%, white); }

html[data-theme="dark"] .order-table .order-item,
html[data-theme="dark"] .contacts-table .contacts-item:nth-child(even),
html[data-theme="dark"] .finance-checklists .finance-list .finance-item:nth-child(even) {
    background: var(--surface-muted);
    border-color: var(--line);
}
html[data-theme="dark"] .file-progress-container,
html[data-theme="dark"] .order-create-progress,
html[data-theme="dark"] .order-input-group,
html[data-theme="dark"] .order-input-dropdown .order-input-section-title {
    background: var(--surface-muted);
    border-color: var(--line);
    color: var(--fg);
}
html[data-theme="dark"] .file-progress-header,
html[data-theme="dark"] .order-input-dropdown .order-input-section-title,
html[data-theme="dark"] .deadline-options-loading { color: var(--muted-text); }
html[data-theme="dark"] .file-progress-track { background: var(--line); }
html[data-theme="dark"] .order-input-option:not(:last-child) { border-color: var(--line); }
html[data-theme="dark"] .edrpou-input-option.is-message { color: var(--muted-text); }
html[data-theme="dark"] .edrpou-input-option.is-warning { background: #42371e; color: #f4d795; border-color: #745d28; }
html[data-theme="dark"] .new-view-2 .view { background: var(--surface-muted); }

html[data-theme="dark"] .finance-checklists .finance-list .finance-item .status.status-tag-0 p,
html[data-theme="dark"] .finance-checklists .finance-list .finance-item .status.status-tag-2 p,
html[data-theme="dark"] .finance-checklists .finance-list .finance-item .status.status-tag-4 p {
    background: var(--surface-muted);
    border-color: var(--line);
    color: var(--fg);
}
html[data-theme="dark"] .finance-checklists .finance-list .finance-item .status.status-tag-1 p { background: #254232; border-color: #4e8c63; color: #b4edc6; }
html[data-theme="dark"] .finance-checklists .finance-list .finance-item .status.status-tag-3 p { background: #273d51; border-color: #48799a; color: #b9dfff; }
html[data-theme="dark"] .finance-checklists .finance-list .finance-item .status.status-tag-5 p { background: #512b2b; border-color: #a85d5d; color: #ffc7c7; }
html[data-theme="dark"] .finance-checklists .finance-list .finance-item .status p { color: var(--fg); }

html[data-theme="dark"] .bubble .head { background: var(--surface-muted); }
html[data-theme="dark"] .bubble .head .head-title { color: var(--fg); }
html[data-theme="dark"] .bubble .content .left .file-list .file-item { background: var(--surface-muted); }
html[data-theme="dark"] .bubble .content .left .file-list .file-item .file-review.loading { background: var(--line); }
html[data-theme="dark"] .bubble .content .left .file-list .file-item .file-info p:last-child { color: var(--muted-text); }

html[data-theme="dark"] .help-sidebar,
html[data-theme="dark"] .help-calendar-status,
html[data-theme="dark"] .help-document-state,
html[data-theme="dark"] .help-calendar,
html[data-theme="dark"] .help-document-content code { background: var(--surface-muted); }
html[data-theme="dark"] .help-day--working,
html[data-theme="dark"] .help-legend-box--working { background: var(--surface); color: var(--fg); }
html[data-theme="dark"] .help-day--current,
html[data-theme="dark"] .help-legend-box--current { background: #50665b; border-color: #81a58f; color: #fff; }
html[data-theme="dark"] .help-document-content a { color: var(--primary); }
html[data-theme="dark"] .help-sidebar__item.active { color: var(--on-primary); }
html[data-theme="dark"] .help-sidebar__item--document.active { color: var(--fg); }
html[data-theme="dark"] .help-document-state.error,
html[data-theme="dark"] .help-calendar-status.error { background: #422828; color: #ffb4b4; }
html[data-theme="dark"] .help-docs-status.error { color: #ffb4b4; }

html[data-theme="dark"] .support-eyebrow { color: var(--primary); }
html[data-theme="dark"] .support-main .main-desc,
html[data-theme="dark"] .support-form__heading p,
html[data-theme="dark"] .support-hint { color: var(--muted-text); }
html[data-theme="dark"] .support-form { background: var(--surface); border-color: var(--line); }
html[data-theme="dark"] .support-form__heading { border-color: var(--line); }
html[data-theme="dark"] .support-form__icon { background: var(--surface-muted); border-color: var(--line); color: var(--primary); }
html[data-theme="dark"] .support-field input[readonly],
html[data-theme="dark"] .support-field select:disabled { background: var(--surface-muted); color: var(--muted-text); border-color: var(--line); }
html[data-theme="dark"] .support-status.success { color: var(--primary); }
html[data-theme="dark"] .support-status.error { color: #ff9b9b; }

html[data-theme="dark"] .site-footer {
    background: radial-gradient(circle at 8% 0%, color-mix(in srgb, var(--primary) 8%, transparent), transparent 34%), var(--surface);
}
html[data-theme="dark"] .site-footer__hotline span { color: var(--on-primary); }
html[data-theme="dark"] .site-footer__hotline a:hover,
html[data-theme="dark"] .site-footer__phones a:hover { color: var(--primary); }
html[data-theme="dark"] .site-footer__payment-logos img { background: #f2f4f2; }

html[data-theme="dark"] .custom-modal-footer { background: var(--surface-muted); }

/* Account chrome, lists, and neutral actions share the same dark surfaces. */
html[data-theme="dark"] .order-table .order-header,
html[data-theme="dark"] .contacts-table .contacts-header,
html[data-theme="dark"] .payers-table .payers-header {
    background: var(--surface-muted);
    color: var(--fg2);
    border: 1px solid var(--line);
}
html[data-theme="dark"] .order-filter,
html[data-theme="dark"] .finance-boxview,
html[data-theme="dark"] .contacts-table { border-color: var(--line); }
html[data-theme="dark"] .finance-view .finance-balance { background: var(--surface-muted); color: var(--fg2); }
html[data-theme="dark"] .order-table .order-item,
html[data-theme="dark"] .contacts-table .contacts-item,
html[data-theme="dark"] .payers-table .payers-item,
html[data-theme="dark"] .finance-checklists .finance-list .finance-item {
    background: var(--surface);
    border-color: var(--line);
    color: var(--fg);
}
html[data-theme="dark"] .order-table .order-item:nth-child(even),
html[data-theme="dark"] .contacts-table .contacts-item:nth-child(even),
html[data-theme="dark"] .payers-table .payers-item:nth-child(even),
html[data-theme="dark"] .finance-checklists .finance-list .finance-item:nth-child(even) {
    background: var(--surface-muted);
}
html[data-theme="dark"] .finance-checklists .finance-list .finance-item .info p,
html[data-theme="dark"] .payers-table .payers-item-empty,
html[data-theme="dark"] .finance-checklists .finance-list .finance-item-empty {
    color: var(--muted-text);
}
html[data-theme="dark"] :is(.order-page, .finance-page, .contacts-page, .payers-page) .switcher button,
html[data-theme="dark"] :is(.contacts-return, .payers-create2),
html[data-theme="dark"] .help-calendar-retry,
html[data-theme="dark"] .help-docs-retry {
    background: var(--surface-muted);
    color: var(--fg2);
    border: 1px solid var(--line);
}
html[data-theme="dark"] :is(.order-page, .finance-page, .contacts-page, .payers-page) .switcher button:hover:not(:disabled),
html[data-theme="dark"] :is(.contacts-return, .payers-create2):hover {
    background: color-mix(in srgb, var(--surface-muted) 78%, var(--fg2));
}

/* Order creation, editing, file lists, and autocomplete. */
html[data-theme="dark"] .new-view .view { border-color: var(--line); }
html[data-theme="dark"] .drag-drop-overlay .drag-content { background: var(--surface); color: var(--fg2); }
html[data-theme="dark"] .image-area .image-list .image-item,
html[data-theme="dark"] .order-input-dropdown,
html[data-theme="dark"] .edrpou-input-dropdown { background: var(--surface); border-color: var(--line); }
html[data-theme="dark"] .order-input-group-title,
html[data-theme="dark"] .order-input-dropdown .order-input-section-title { background: var(--surface-muted); color: var(--muted-text); border-color: var(--line); }
html[data-theme="dark"] .order-input-option:hover,
html[data-theme="dark"] .edrpou-input-option:hover:not(.is-message):not(.is-warning) { background: var(--surface-muted); color: var(--fg2); }
html[data-theme="dark"] .order-input-option:not(:last-child) { border-color: var(--line); }
html[data-theme="dark"] .contacts-input-dropdown { background: var(--surface); border-color: var(--line); }
html[data-theme="dark"] .contacts-input-option:hover { background: var(--surface-muted); color: var(--fg2); }
html[data-theme="dark"] .contacts-input-option:not(:last-child) { border-color: var(--line); }
html[data-theme="dark"] .contacts-input-dropdown::-webkit-scrollbar-thumb { background: var(--line); }
html[data-theme="dark"] .file-progress-header { color: var(--fg); }
html[data-theme="dark"] .bubble .content .left .file-list,
html[data-theme="dark"] .bubble .content .right .view { border-color: var(--line); }
html[data-theme="dark"] .bubble .content .right .save-input .order-name-save.is-saved { background: #254232; }

/* Help calendar: each state stays legible without a white month grid. */
html[data-theme="dark"] .help-panel,
html[data-theme="dark"] .help-month { background: var(--surface); border-color: var(--line); }
html[data-theme="dark"] .help-sidebar__item--child { background: var(--surface); }
html[data-theme="dark"] .help-sidebar__item--child:hover,
html[data-theme="dark"] .help-sidebar__item--child:focus-visible { background: var(--surface-muted); }
html[data-theme="dark"] .help-month__title,
html[data-theme="dark"] .help-month__weekday { color: var(--fg2); }
html[data-theme="dark"] .help-day--working,
html[data-theme="dark"] .help-legend-box--working { background: var(--surface-muted); border-color: var(--line); color: var(--fg); }
html[data-theme="dark"] .help-day--closed,
html[data-theme="dark"] .help-legend-box--closed { background: #512b2b; border-color: #a85d5d; color: #ffc7c7; }
html[data-theme="dark"] .help-day--current,
html[data-theme="dark"] .help-legend-box--current {
    background: color-mix(in srgb, var(--primary) 22%, var(--surface-muted));
    border-color: var(--primary);
    color: var(--fg2);
    box-shadow: inset 0 0 0 1px var(--primary);
}
html[data-theme="dark"] .help-day--empty { background: transparent; border-color: transparent; box-shadow: none; }
html[data-theme="dark"] .help-document-content a { color: color-mix(in srgb, var(--primary) 65%, var(--fg2)); }
html[data-theme="dark"] .help-document-content .is-code { background: var(--surface-muted); color: var(--fg2); }
/* Saved Docs colors are inline styles, so dark mode must override them. */
html[data-theme="dark"] .help-document-content span { color: var(--fg2) !important; }
html[data-theme="dark"] .help-document-content a span { color: inherit !important; }
html[data-theme="dark"] .help-document-content span[style*="background-color"] { background-color: var(--surface-muted) !important; }

/* Settings, support, and transient UI. */
html[data-theme="dark"] .settings-session-current { background: #254232; color: #b4edc6; }
html[data-theme="dark"] .settings-notification-option input { background: var(--surface); border-color: var(--line); }
html[data-theme="dark"] .settings-notification-option input:checked { background: var(--primary); border-color: var(--primary); }
html[data-theme="dark"] .settings-notification-channel { background: var(--surface); color: var(--fg2); border-color: var(--line); }
html[data-theme="dark"] .settings-logo-preview { background: var(--surface-muted); }
html[data-theme="dark"] .support-field :is(input, select, textarea) { background-color: var(--surface-muted); color: var(--fg2); border-color: var(--line); }
html[data-theme="dark"] .support-field :is(input, select, textarea):hover { border-color: var(--muted-text); }
html[data-theme="dark"] .support-form::before { background: linear-gradient(90deg, var(--primary), transparent); }
html[data-theme="dark"] .custom-modal-card { border: 1px solid var(--line); }
html[data-theme="dark"] .custom-modal-btn--neutral { background: var(--surface-muted); color: var(--fg2); border-color: var(--line); }
html[data-theme="dark"] .custom-modal-btn--neutral:hover { background: color-mix(in srgb, var(--surface-muted) 78%, var(--fg2)); filter: none; }
html[data-theme="dark"] .custom-modal-btn--neutral img[src^="/icons/dmodal_"] { filter: brightness(0) invert(.9); }
html[data-theme="dark"] .site-footer { border-top-color: var(--line); }
html[data-theme="dark"] .site-footer__offer,
html[data-theme="dark"] .site-footer__copyright,
html[data-theme="dark"] .site-footer__service { border-color: var(--line); }
