:root {
    --portal-ink: #28254a;
    --portal-ink-soft: #403d63;
    --portal-accent: #dc594a;
    --portal-accent-soft: #fff0eb;
    --portal-cream: #faf7f2;
    --portal-surface: #ffffff;
    --portal-muted: #6a677b;
    --portal-rule: #ddd9d2;
    --wood-dark: var(--portal-ink);
    --wood-accent: var(--portal-accent);
    --wood-soft: var(--portal-cream);
    --wood-border: var(--portal-rule);
}

body {
    background: var(--portal-cream);
    color: var(--portal-ink);
}

.portal-template-watermark {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image: url('../img/logo-watermark.webp');
    background-position: center;
    background-repeat: no-repeat;
    background-size: min(82vw, 58rem) auto;
    opacity: 0.1;
}

.navbar {
    min-height: 66px;
    border-color: #dedbe8 !important;
}

.navbar-brand-logo {
    display: block;
    width: auto;
    height: 46px;
    max-width: 180px;
    object-fit: contain;
}

.navbar .nav-link {
    color: var(--portal-ink-soft);
    font-weight: 650;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus,
.navbar .nav-link.active {
    color: var(--portal-accent);
}

.navbar .btn {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.app-shell {
    min-height: calc(100vh - 132px);
}

.footer-lite {
    border-color: #dedbe8;
    background: #ffffff;
}

.card-soft {
    border: 1px solid var(--portal-rule);
    border-top: 4px solid var(--portal-accent);
    border-radius: 0;
    box-shadow: 0 5px 8px rgba(40, 37, 74, 0.07);
}

.card-soft .card-body > h1,
.card-soft .card-body > h2 {
    color: var(--portal-ink);
    font-weight: 750;
    letter-spacing: -0.03em;
}

.card-soft hr,
.border-top {
    border-color: var(--portal-rule) !important;
}

.card-soft .border.rounded,
.public-quote-document .border.rounded {
    border-color: var(--portal-rule) !important;
    border-radius: 0 !important;
    background: #fffdf9;
}

.card-soft .rounded.bg-light {
    border-color: var(--portal-rule) !important;
    border-radius: 0 !important;
    background: #f0edef !important;
}

.btn {
    min-height: 38px;
    border-radius: 5px;
    font-weight: 700;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.btn-dark,
.btn-dark:active {
    background: var(--portal-ink);
    border-color: var(--portal-ink);
}

.btn-dark:hover,
.btn-dark:focus {
    background: var(--portal-accent);
    border-color: var(--portal-accent);
}

.btn-outline-secondary,
.btn-outline-dark {
    border-color: #918da0;
    color: var(--portal-ink);
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-dark:hover,
.btn-outline-dark:focus {
    background: var(--portal-ink);
    border-color: var(--portal-ink);
    color: #ffffff;
}

.btn-success {
    background: #2f7d5b;
    border-color: #2f7d5b;
}

.btn-success:hover,
.btn-success:focus {
    background: #246348;
    border-color: #246348;
}

.form-label {
    color: var(--portal-ink);
    font-weight: 700;
}

.form-control,
.form-select {
    min-height: 42px;
    border-color: #bcb7c2;
    border-radius: 4px;
    color: var(--portal-ink);
}

textarea.form-control {
    min-height: auto;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--portal-accent);
    box-shadow: 0 0 0 0.2rem rgba(220, 89, 74, 0.16);
}

.form-text,
.text-secondary {
    color: var(--portal-muted) !important;
}

.alert {
    border-width: 1px;
    border-radius: 4px;
}

.alert-warning {
    border-color: #e8c978;
    background: #fff8dc;
    color: #66500d;
}

.alert-secondary {
    border-color: #d7d2de;
    background: #f2f0f4;
    color: var(--portal-ink);
}

.table {
    --bs-table-color: var(--portal-ink);
    --bs-table-border-color: var(--portal-rule);
}

.table > :not(caption) > * > * {
    padding: 0.8rem 0.75rem;
}

.table > thead > tr > th {
    border-bottom-width: 1px;
    background: #f0edef;
    color: var(--portal-ink);
    font-size: 0.78rem;
    font-weight: 750;
}

.table > tbody > tr:hover > * {
    background: #fff9f6;
}

.modal-content {
    border: 1px solid var(--portal-rule);
    border-top: 4px solid var(--portal-accent);
    border-radius: 0;
    box-shadow: 0 5px 8px rgba(40, 37, 74, 0.14);
}

.modal-header,
.modal-footer {
    border-color: var(--portal-rule);
    background: #fffdf9;
}

.modal-title {
    color: var(--portal-ink);
    font-weight: 750;
}

.modal-body {
    color: var(--portal-ink);
}

.modal-backdrop.show {
    opacity: 0.6;
}

.portal-loading-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(40, 37, 74, 0.74);
}

.portal-loading-box {
    width: min(92vw, 360px);
    padding: 24px;
    border: 1px solid #ffffff;
    border-top: 4px solid var(--portal-accent);
    border-radius: 0;
    background: #fffdf9;
    color: var(--portal-ink);
    text-align: center;
    box-shadow: 5px 5px 0 var(--portal-accent);
}

.password-toggle {
    min-width: 44px;
}

.password-icon {
    display: block;
    width: 18px;
    height: 18px;
}

@media (max-width: 575.98px) {
    .navbar-brand-logo {
        height: 40px;
    }

    .card-soft {
        box-shadow: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .btn {
        transition: none;
    }
}
