/* Dark appearance */
html[data-theme="dark"] {
    color-scheme: dark;
    --ink: #eef0f7;
    --muted: #949aab;
    --line: #303440;
    --surface: #1d202a;
    --canvas: #151821;
    --sidebar: #0d0f16;
    --note-editor-frame: #191c25;
    --note-editor-page: #191c25;
    --shadow: 0 18px 60px rgba(0, 0, 0, .24);
}

html[data-theme="dark"] .app-page,
html[data-theme="dark"] .login-page {
    background-color: var(--canvas);
}

html[data-theme="dark"] .topbar {
    border-color: rgba(48, 52, 64, .85);
    background: rgba(21, 24, 33, .88);
}

html[data-theme="dark"] .app-notification {
    color: var(--ink);
    border-color: rgba(55, 60, 74, .92);
    background: rgba(29, 32, 42, .97);
    box-shadow: 0 22px 58px rgba(0, 0, 0, .36);
}

html[data-theme="dark"] .app-notification-success .app-notification-icon {
    color: #7bd8b4;
    background: rgba(65, 185, 149, .14);
}

html[data-theme="dark"] .app-notification-error .app-notification-icon {
    color: #ff8aa0;
    background: rgba(255, 138, 160, .12);
}

html[data-theme="dark"] .app-notification-info .app-notification-icon {
    color: #9aa7ff;
    background: rgba(101, 119, 255, .14);
}

html[data-theme="dark"] .app-notification-close:hover,
html[data-theme="dark"] .app-notification-close:focus-visible {
    color: var(--ink);
    background: rgba(255, 255, 255, .07);
}

html[data-theme="dark"] .search-box,
html[data-theme="dark"] .privacy-pill,
html[data-theme="dark"] .view-switcher,
html[data-theme="dark"] .filter-chips button,
html[data-theme="dark"] .sort-control,
html[data-theme="dark"] .file-card,
html[data-theme="dark"] .settings-panel,
html[data-theme="dark"] .managed-location,
html[data-theme="dark"] .editable-location,
html[data-theme="dark"] .settings-secondary-button,
html[data-theme="dark"] .trash-confirm-dialog,
html[data-theme="dark"] .upload-dialog,
html[data-theme="dark"] .folder-dialog,
html[data-theme="dark"] .pin-dialog,
html[data-theme="dark"] .move-dialog,
html[data-theme="dark"] .folder-access-dialog,
html[data-theme="dark"] .note-share-dialog,
html[data-theme="dark"] .note-nav-button,
html[data-theme="dark"] .note-editor-menu-panel,
html[data-theme="dark"] .icon-button {
    color: var(--ink);
    border-color: var(--line);
    background: var(--surface);
}

html[data-theme="dark"] .filter-chips button.active {
    color: #fff;
    border-color: #6677ee;
    background: #5969d8;
}

html[data-theme="dark"] .view-switcher button.active,
html[data-theme="dark"] .icon-button:hover,
html[data-theme="dark"] .settings-secondary-button:hover,
html[data-theme="dark"] .ui-dropdown-toggle:hover,
html[data-theme="dark"] .ui-dropdown.open .ui-dropdown-toggle {
    color: var(--ink);
    background: #2a2e3a;
}

html[data-theme="dark"] .ui-dropdown-menu {
    border-color: var(--line);
    background: rgba(29, 32, 42, .97);
    box-shadow: 0 18px 55px rgba(0, 0, 0, .38);
}

html[data-theme="dark"] .language-dropdown .ui-dropdown-toggle {
    border-color: var(--line);
    background: var(--surface);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .14);
}

html[data-theme="dark"] .language-dropdown .ui-dropdown-toggle:hover,
html[data-theme="dark"] .language-dropdown.open .ui-dropdown-toggle {
    border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
    background: #2a2e3a;
}

html[data-theme="dark"] .folder-button,
html[data-theme="dark"] .folder-name-field input,
html[data-theme="dark"] .move-dialog select,
html[data-theme="dark"] .folder-share-grid select,
html[data-theme="dark"] .share-invite-form input,
html[data-theme="dark"] .share-invite-form select,
html[data-theme="dark"] .share-inline-form select,
html[data-theme="dark"] .notes-search-field,
html[data-theme="dark"] .notes-filter-field,
html[data-theme="dark"] .note-card-action,
html[data-theme="dark"] .note-card-category-form select,
html[data-theme="dark"] .note-card-menu-panel,
html[data-theme="dark"] .note-menu-button,
html[data-theme="dark"] .note-find-panel,
html[data-theme="dark"] .note-find-field,
html[data-theme="dark"] .note-find-icon-button,
html[data-theme="dark"] .note-filter-toggle,
html[data-theme="dark"] .note-filter-panel,
html[data-theme="dark"] .bottom-search-field {
    color: var(--ink);
    border-color: var(--line);
    background: var(--surface);
}

html[data-theme="dark"] .folder-button.danger {
    color: #ff8aa0;
    border-color: rgba(255, 138, 160, .26);
    background: rgba(255, 138, 160, .1);
}

html[data-theme="dark"] .folder-button.danger:hover {
    background: rgba(255, 138, 160, .16);
}

html[data-theme="dark"] .share-invite-form,
html[data-theme="dark"] .share-invite-item,
html[data-theme="dark"] .share-notification-item,
html[data-theme="dark"] .profile-menu-panel,
html[data-theme="dark"] .share-collaborator-row,
html[data-theme="dark"] .folder-access-section .settings-toggle.compact {
    border-color: var(--line);
    background: #20232d;
}

html[data-theme="dark"] .profile-menu-item:hover,
html[data-theme="dark"] .profile-menu-item:focus-visible {
    background: rgba(101, 119, 255, .16);
}

html[data-theme="dark"] .profile-menu-danger {
    color: #ff8aa0;
}

html[data-theme="dark"] .profile-menu-danger:hover,
html[data-theme="dark"] .profile-menu-danger:focus-visible {
    color: #ff9caf;
    background: rgba(255, 138, 160, .12);
}

html[data-theme="dark"] .profile-menu-danger .profile-menu-close {
    background: rgba(255, 138, 160, .12);
}

html[data-theme="dark"] .note-menu-button.active,
html[data-theme="dark"] .note-menu-button[aria-pressed="true"] {
    color: #fff;
    border-color: color-mix(in srgb, var(--accent) 70%, #fff);
    background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 74%, #101422));
    box-shadow: 0 10px 24px rgba(101, 119, 255, .32);
}

html[data-theme="dark"] ::highlight(note-find-highlight) {
    background-color: rgba(255, 204, 64, .36);
}

html[data-theme="dark"] ::highlight(note-find-active) {
    color: #1e1903;
    background-color: #ffd64f;
}

html[data-theme="dark"] .note-find-highlight {
    background-color: rgba(255, 204, 64, .36);
}

html[data-theme="dark"] .note-find-highlight.active {
    color: #1e1903;
    background-color: #ffd64f;
}

html[data-theme="dark"] .share-collaborator-row.pending {
    background: #1b1e28;
}

html[data-theme="dark"] .note-category-pill {
    color: color-mix(in srgb, var(--filter-accent) 78%, var(--ink));
    border-color: color-mix(in srgb, var(--filter-accent) 21%, var(--line));
    background: rgba(255, 255, 255, .025);
}

html[data-theme="dark"] .note-category-pill.active {
    color: color-mix(in srgb, var(--filter-accent) 88%, #ffffff);
    border-color: color-mix(in srgb, var(--filter-accent) 78%, var(--line));
    background: color-mix(in srgb, var(--filter-accent) 30%, var(--surface));
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--filter-accent) 34%, transparent),
        0 8px 20px color-mix(in srgb, var(--filter-accent) 20%, transparent);
}

html[data-theme="dark"] .note-filter-chip {
    border-color: color-mix(in srgb, var(--filter-accent) 21%, var(--line));
    background: rgba(255, 255, 255, .025);
}

html[data-theme="dark"] .note-filter-chip.active,
html[data-theme="dark"] .note-active-filter {
    background: color-mix(in srgb, var(--filter-accent) 18%, transparent);
}

html[data-theme="dark"] .notes-search-field input,
html[data-theme="dark"] .notes-filter-field select {
    color: var(--ink);
}

html[data-theme="dark"] .ui-dropdown-menu button:hover,
html[data-theme="dark"] .ui-dropdown-menu button:focus-visible {
    background: #292d39;
}

html[data-theme="dark"] .ui-dropdown-menu button[aria-selected="true"] {
    color: #bcc4ff;
    background: #303650;
}

html[data-theme="dark"] .selection-toolbar {
    border-color: rgba(101, 119, 255, .3);
    background: linear-gradient(135deg, rgba(101, 119, 255, .18), rgba(98, 212, 168, .08));
}

html[data-theme="dark"] .file-card.selected {
    border-color: rgba(142, 154, 255, .72);
    box-shadow: 0 18px 42px rgba(101, 119, 255, .22);
}

html[data-theme="dark"] .file-visual,
html[data-theme="dark"] .upload-dropzone,
html[data-theme="dark"] .settings-field input,
html[data-theme="dark"] .settings-field select,
html[data-theme="dark"] .trash-admin-filter input,
html[data-theme="dark"] .login-form > input:not([type="hidden"]),
html[data-theme="dark"] .password-field input {
    color: #aab0c1;
    border-color: var(--line);
    background: #252934;
}

html[data-theme="dark"] .file-visual.folder,
html[data-theme="dark"] .file-visual.document,
html[data-theme="dark"] .file-visual.video,
html[data-theme="dark"] .file-visual.audio,
html[data-theme="dark"] .file-visual.archive {
    background: #252a38;
}

html[data-theme="dark"] .file-visual.shared-hidden-notice-visual {
    color: #ef3f5f;
    background:
        radial-gradient(circle at 72% 20%, rgba(255, 255, 255, .12), transparent 27%),
        linear-gradient(145deg, #3b202a, #2d1a22);
}

html[data-theme="dark"] .file-visual.folder.customized-folder {
    color: var(--folder-accent);
    background: color-mix(in srgb, var(--folder-accent) 20%, #252a38);
}

html[data-theme="dark"] .file-visual.preview-folder {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .015)),
        linear-gradient(160deg, #1a2233, #101724 72%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .05),
        inset 0 0 0 1px rgba(255, 255, 255, .045);
}

html[data-theme="dark"] .folder-preview-stage {
    background: transparent;
    box-shadow: none;
}

html[data-theme="dark"] .folder-preview-grid {
    background: transparent;
}

html[data-theme="dark"] .folder-preview-grid > span {
    background: rgba(255, 255, 255, .06);
}

html[data-theme="dark"] .folder-pin-mark {
    background: color-mix(in srgb, var(--folder-accent) 24%, #252a38);
}

html[data-theme="dark"] .pin-button.active {
    color: var(--pin-accent);
    border-color: color-mix(in srgb, var(--pin-accent) 40%, var(--line));
    background: color-mix(in srgb, var(--pin-accent) 18%, var(--surface));
}

html[data-theme="dark"] .folder-access-pill,
html[data-theme="dark"] .file-access-badge {
    color: #9aa8ff;
    border-color: rgba(154, 168, 255, .28);
    background: rgba(101, 119, 255, .18);
}

html[data-theme="dark"] .folder-access-pill.public,
html[data-theme="dark"] .file-access-badge.public {
    color: #67d8a4;
    border-color: rgba(103, 216, 164, .25);
    background: rgba(34, 179, 107, .16);
}

html[data-theme="dark"] .folder-access-pill.shared,
html[data-theme="dark"] .file-access-badge.shared {
    color: #e1b64a;
    border-color: rgba(225, 182, 74, .3);
    background: rgba(225, 182, 74, .15);
}

html[data-theme="dark"] .folder-access-pill.hidden,
html[data-theme="dark"] .file-access-badge.hidden,
html[data-theme="dark"] .note-access-badge.hidden {
    color: #f0a85f;
    border-color: rgba(240, 168, 95, .28);
    background: rgba(240, 168, 95, .15);
}

html[data-theme="dark"] .icon-options span {
    color: var(--muted);
    border-color: var(--line);
    background: #252934;
}

html[data-theme="dark"] .folder-preview-toggle,
html[data-theme="dark"] .folder-hidden-toggle,
html[data-theme="dark"] .hidden-folders-status {
    border-color: var(--line);
    background: #252934;
}

html[data-theme="dark"] .folder-access-section .settings-toggle.compact {
    border-color: var(--line);
    background: #252934;
}

html[data-theme="dark"] .icon-options input:checked + span {
    color: #bcc4ff;
    background: #303650;
}

html[data-theme="dark"] .settings-field input:focus,
html[data-theme="dark"] .settings-field select:focus,
html[data-theme="dark"] .trash-admin-filter input:focus,
html[data-theme="dark"] .login-form > input:not([type="hidden"]):focus,
html[data-theme="dark"] .password-field input:focus {
    color: var(--ink);
    background: #252934;
}

html[data-theme="dark"] .upload-flash.readonly,
html[data-theme="dark"] .settings-help {
    color: var(--muted);
    border-color: var(--line);
    background: rgba(255, 255, 255, .025);
}

html[data-theme="dark"] .login-shell {
    border-color: var(--line);
    background: var(--surface);
}

html[data-theme="dark"] .theme-options button {
    color: var(--muted);
    border-color: var(--line);
    background: #252934;
}

html[data-theme="dark"] .theme-options button.active {
    color: var(--ink);
    border-color: var(--accent);
}

html[data-theme="dark"] body[data-view="list"] .file-card:hover {
    background: #252934;
}

html[data-theme="dark"] .file-actions a,
html[data-theme="dark"] .file-actions button {
    color: var(--ink);
    border-color: var(--line);
    background: rgba(29, 32, 42, .94);
}

html[data-theme="dark"] .file-actions button.copy-confirmed,
html[data-theme="dark"] .preview-download.copy-confirmed {
    color: #fff;
    border-color: rgba(103, 216, 164, .4);
    background: #1f7a58;
}

html[data-theme="dark"] .file-actions button.copy-blocked {
    color: #fff;
    border-color: rgba(168, 64, 85, .5);
    background: #a84055;
}

html[data-theme="dark"] .upload-dropzone:hover,
html[data-theme="dark"] .upload-dropzone.dragging {
    border-color: var(--accent);
    background: #292d3c;
}

html[data-theme="dark"] .upload-queue {
    border-color: var(--line);
    background: #20242f;
}

html[data-theme="dark"] .upload-queue-item {
    border-color: #343948;
    background: #292d38;
}

html[data-theme="dark"] .upload-queue-item-progress {
    background: #343a4d;
}

html[data-theme="dark"] .settings-panel-icon,
html[data-theme="dark"] .upload-dropzone-icon,
html[data-theme="dark"] .runtime-status-icon {
    background: #292f48;
}

html[data-theme="dark"] .runtime-status {
    background: #252934;
}

html[data-theme="dark"] .trash-item-icon,
html[data-theme="dark"] .trash-empty > span {
    background: #292f48;
}

html[data-theme="dark"] .thumbnail-generator {
    background: #252934;
}

html[data-theme="dark"] .admin-view-panel {
    border-color: rgba(142, 154, 255, .24);
    background:
        linear-gradient(135deg, rgba(101, 119, 255, .14), rgba(65, 185, 149, .07)),
        var(--surface);
}

html[data-theme="dark"] .admin-view-current,
html[data-theme="dark"] .account-view-note {
    border-color: var(--line);
    background: #252934;
}

html[data-theme="dark"] .user-create-form,
html[data-theme="dark"] .managed-user {
    background: #252934;
}

html[data-theme="dark"] .trash-confirm-skip {
    background: #252934;
}

html[data-theme="dark"] .thumbnail-job-progress,
html[data-theme="dark"] .settings-toggle > span {
    background: #393e4d;
}

html[data-theme="dark"] .settings-toggle input:checked + span {
    background: #22b36b;
}

html[data-theme="dark"] .remember-login > span {
    border-color: var(--line);
    background: #252934;
}

html[data-theme="dark"] .remember-login input:checked + span {
    border-color: var(--accent);
    background: var(--accent);
}

html[data-theme="dark"] .login-form .remember-login strong {
    color: var(--ink);
}

html[data-theme="dark"] .search-box input,
html[data-theme="dark"] .settings-field input {
    color: var(--ink);
}