:root {
    --bg-main: #eef4ff;
    --bg-surface: #ffffff;
    --text-main: #1a1f2b;
    --text-muted: #4b5f7b;
    --accent: #0a468f;
    --accent-2: #0b5dbb;
    --border: #cfe0ff;
}

.theme-dark {
    --bg-main: #121820;
    --bg-surface: #1b2430;
    --text-main: #e7edf8;
    --text-muted: #b4c0d6;
    --accent: #1c5fae;
    --accent-2: #2c73c9;
    --border: #2f435c;
}

html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background: var(--bg-main);
    color: var(--text-main);
    min-height: 100%;
}

a, .btn-link {
    color: var(--accent);
}

.btn-primary {
    color: #fff;
    background-color: var(--accent);
    border-color: var(--accent);
}

.btn-outline-primary {
    color: var(--accent);
    border-color: var(--accent);
}

.btn-outline-primary:hover {
    background: var(--accent);
    color: #fff;
}

.btn-outline-primary:disabled,
.btn-outline-primary.disabled {
    color: #8ea4c6;
    border-color: #b7c7e3;
    background: transparent;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem var(--bg-surface), 0 0 0 0.25rem var(--accent-2);
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.card, .home-help, table, .form-control, .form-select, textarea, .table {
    background-color: var(--bg-surface);
    color: var(--text-main);
    border-color: var(--border);
}

.text-muted {
    color: var(--text-muted) !important;
}

.theme-dark .card,
.theme-dark .home-help,
.theme-dark .reservation-card,
.theme-dark .settings-card,
.theme-dark .added-box,
.theme-dark .added-item,
.theme-dark .table,
.theme-dark #material-calendar,
.theme-dark .fc,
.theme-dark .fc-theme-standard td,
.theme-dark .fc-theme-standard th {
    background-color: var(--bg-surface) !important;
    color: var(--text-main) !important;
    border-color: var(--border) !important;
}

.theme-dark .btn-outline-primary,
.theme-dark .btn-outline-secondary,
.theme-dark .btn-outline-danger,
.theme-dark .btn-outline-warning {
    border-color: #5078ac;
    color: #d8e5fa;
}

.theme-dark .btn-outline-primary:hover,
.theme-dark .btn-outline-secondary:hover,
.theme-dark .btn-outline-danger:hover,
.theme-dark .btn-outline-warning:hover {
    background: #244872;
    color: #fff;
}

.theme-dark .fc .fc-toolbar-title,
.theme-dark .fc .fc-col-header-cell-cushion,
.theme-dark .fc .fc-timegrid-slot-label-cushion {
    color: var(--text-main);
}

.theme-dark .fc .fc-button-primary {
    background: transparent !important;
    border-color: #5078ac !important;
    color: #cfe0ff !important;
}

.theme-dark .fc .fc-button-primary:not(:disabled):hover {
    background: #244872 !important;
    border-color: #5078ac !important;
    color: #fff !important;
}

.theme-dark .fc .fc-button-primary.fc-button-active,
.theme-dark .fc .fc-button-primary:active {
    background: var(--accent) !important;
    border-color: var(--accent) !important;
    color: #fff !important;
}



.theme-dark .page {
    background: linear-gradient(180deg, #101722 0%, #151f2d 100%);
}

.theme-dark .sidebar {
    background-image: linear-gradient(180deg, #113e77 0%, #0c2f59 100%);
}

.fc .fc-timegrid-now-indicator-line {
    border-color: #ff2d55;
    border-width: 2px;
}

.fc .fc-timegrid-now-indicator-arrow {
    border-top-color: #ff2d55;
    border-bottom-color: #ff2d55;
}

.theme-dark .fc .fc-timegrid-now-indicator-line {
    border-color: #ff7b9a;
}

.theme-dark .fc .fc-timegrid-now-indicator-arrow {
    border-top-color: #ff7b9a;
    border-bottom-color: #ff7b9a;
}

/* FC light buttons */
.fc .fc-button-primary {
    background: transparent !important;
    border-color: var(--accent) !important;
    color: var(--accent) !important;
}

.fc .fc-button-primary:not(:disabled):hover {
    background: var(--accent) !important;
    border-color: var(--accent) !important;
    color: #fff !important;
}

.fc .fc-button-primary.fc-button-active,
.fc .fc-button-primary:active {
    background: var(--accent) !important;
    border-color: var(--accent) !important;
    color: #fff !important;
}