:root {
    color-scheme: light;

    --ws-font-family: "Segoe UI", Tahoma, Arial, sans-serif;
    --ws-font-size: 0.95rem;
    --ws-font-weight: 400;

    --ws-bg: #f2f3f5;
    --ws-surface: #ffffff;
    --ws-surface-2: #f8f9fa;
    --ws-surface-3: #e9ecef;
    --ws-overlay: rgba(0, 0, 0, .34);

    --ws-text: #212529;
    --ws-text-muted: #6c757d;
    --ws-link: #0d6efd;

    --ws-primary: #0d6efd;
    --ws-primary-hover: #0b5ed7;
    --ws-primary-text: #ffffff;
    --ws-success: #198754;
    --ws-warning: #ffc107;
    --ws-danger: #dc3545;
    --ws-info: #0dcaf0;

    --ws-border: #ced4da;
    --ws-border-strong: #adb5bd;
    --ws-input-bg: #ffffff;
    --ws-input-text: var(--ws-text);
    --ws-control-bg: #f8f9fa;
    --ws-control-hover: #e9ecef;
    --ws-control-active: #dee2e6;
    --ws-focus: rgba(13, 110, 253, .3);

    --ws-radius: .375rem;
    --ws-radius-lg: .65rem;
    --ws-shadow: 0 .5rem 1.4rem rgba(0, 0, 0, .16);
    --ws-shadow-soft: 0 .2rem .75rem rgba(0, 0, 0, .10);
    --ws-inset-shadow: none;
    --ws-backdrop-filter: none;

    --ws-titlebar-bg: linear-gradient(90deg, #0d6efd, #5ca8ff);
    --ws-titlebar-text: #ffffff;
    --ws-titlebar-inactive: #7c8794;
    --ws-window-border: 1px solid var(--ws-border);
    --ws-window-padding: 0;
    --ws-window-body-padding: 1rem;
    --ws-window-title-height: 2.2rem;
    --ws-window-control-size: 1.8rem;

    --ws-sidebar-bg: var(--ws-surface);
    --ws-sidebar-text: var(--ws-text);
    --ws-sidebar-link: var(--ws-text);
    --ws-sidebar-link-hover: var(--ws-surface-2);
    --ws-sidebar-link-active: var(--ws-primary);
    --ws-sidebar-link-active-text: var(--ws-primary-text);
    --ws-topbar-bg: var(--ws-surface);
    --ws-topbar-border: var(--ws-border);

    --bs-body-font-family: var(--ws-font-family);
    --bs-body-font-size: var(--ws-font-size);
    --bs-body-color: var(--ws-text);
    --bs-border-color: var(--ws-border);
    --bs-link-color: var(--ws-link);
    --bs-primary: var(--ws-primary);
    --bs-secondary-bg: var(--ws-surface-2);
    --bs-tertiary-bg: var(--ws-surface-3);
    --bs-border-radius: var(--ws-radius);
    --bs-border-radius-lg: var(--ws-radius-lg);
}

html,
body {
    min-height: 100%;
    color: var(--ws-text);
    background: var(--ws-bg);
    font-family: var(--ws-font-family);
    font-size: var(--ws-font-size);
}

body {
    min-height: 100vh;
    background-attachment: fixed;
}

a {
    color: var(--ws-link);
}

::selection {
    color: var(--ws-primary-text);
    background: var(--ws-primary);
}

.ws-theme-picker {
    width: min(245px, 48vw);
}
