:root {
    --gw-bg: #f1efe7;
    --gw-bg-soft: #f8f7f2;
    --gw-text: #1f3330;
    --gw-muted: #5a6d68;
    --gw-accent: #1f5d56;
    --gw-accent-2: #b56a3a;
    --gw-border: #d7ded8;
    --gw-focus: #79b6a4;
}

html,
body {
    font-family: "Manrope", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    color: var(--gw-text);
    background:
        radial-gradient(circle at 2% 10%, rgba(58, 116, 88, 0.16), transparent 26%),
        radial-gradient(circle at 92% 90%, rgba(181, 106, 58, 0.12), transparent 23%),
        var(--gw-bg);
}

body {
    min-height: 100vh;
}

h1,
h2,
h3,
h4 {
    font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
    letter-spacing: 0.01em;
    color: #193632;
}

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

a:hover,
.btn-link:hover {
    color: #0f4842;
}

.btn:not(.btn-link),
a.btn,
.dxbl-btn {
    border-radius: 10px !important;
    border: 1px solid #c5d2cc !important;
    background: #ffffff !important;
    color: #244842 !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em;
    transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease, transform 140ms ease, box-shadow 140ms ease !important;
    box-shadow: 0 4px 12px rgba(17, 51, 43, 0.12);
}

.btn:not(.btn-link):hover,
a.btn:hover,
.dxbl-btn:hover {
    background: #edf5f1 !important;
    border-color: #8db5a4 !important;
    color: #173e37 !important;
    transform: translateY(-1px);
    box-shadow: 0 7px 16px rgba(17, 51, 43, 0.16);
}

.btn:not(.btn-link):active,
a.btn:active,
.dxbl-btn:active {
    transform: translateY(1px);
}

.btn-primary,
.dxbl-btn.btn-primary,
a.btn-primary {
    background: linear-gradient(135deg, #1f6454 0%, #2f8565 100%) !important;
    border-color: #1f6454 !important;
    color: #f4fbf7 !important;
}

.btn-primary:hover,
.dxbl-btn.btn-primary:hover,
a.btn-primary:hover {
    background: linear-gradient(135deg, #1b5a4d 0%, #2a7a5e 100%) !important;
    border-color: #1b5a4d !important;
    color: #ffffff !important;
}

.btn-secondary,
.dxbl-btn.btn-secondary,
a.btn-secondary {
    background: #ffffff !important;
    border-color: #c5d2cc !important;
    color: #244842 !important;
}

.btn-danger,
.dxbl-btn.btn-danger,
a.btn-danger {
    background: linear-gradient(135deg, #a34842 0%, #ba5b4f 100%) !important;
    border-color: #a34842 !important;
    color: #fff8f7 !important;
}

.btn-danger:hover,
.dxbl-btn.btn-danger:hover,
a.btn-danger:hover {
    background: linear-gradient(135deg, #933e39 0%, #aa5248 100%) !important;
    border-color: #933e39 !important;
}

.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus,
.form-select:focus {
    box-shadow: 0 0 0 0.23rem rgba(121, 182, 164, 0.3);
}

.content {
    padding-top: 1.15rem;
}

h1:focus {
    outline: none;
}

.card {
    border-color: var(--gw-border);
}

.form-control,
.form-select {
    border-color: #cdd7d1;
}

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

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

.validation-message {
    color: #d42f2f;
}

.blazor-error-boundary {
    background: #9f2e1a;
    padding: 1rem 1.1rem;
    color: #fff;
    border-radius: 10px;
}

.blazor-error-boundary::after {
    content: "Došlo je do greške.";
}

.darker-border-checkbox.form-check-input {
    border-color: #7f938d;
}

.form-floating > .form-control-plaintext::placeholder,
.form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder,
.form-floating > .form-control:focus::placeholder {
    text-align: start;
}