/* Schlossblick Design System, übernommen aus der TahomaHomeApp (Resources/Styles/Colors.xaml
   & Styles.xaml): Terracotta/Grün/Gold auf warmem Pergament-Hintergrund, Nunito, weiche
   grün-getönte Schatten, großzügig gerundete (Pill-)Buttons. */

@font-face {
    font-family: 'Nunito';
    src: url('../fonts/Nunito.ttf') format('truetype');
    font-weight: 300 900;
    font-display: swap;
}

:root {
    --sb-terracotta-darkest: #5E2C10;
    --sb-terracotta-dark: #9A4A1E;
    --sb-terracotta: #C86028;
    --sb-terracotta-pale: #F4CCAC;
    --sb-terracotta-palest: #FAE6D3;

    --sb-green-darker: #1E3428;
    --sb-green-dark: #284838;
    --sb-green: #355D48;
    --sb-green-pale: #C5D5CA;

    --sb-gold: #C1A264;

    --sb-sand-50: #FBF8F1;
    --sb-sand-100: #F5EEDF;
    --sb-sand-200: #ECE2CC;
    --sb-sand-300: #DDD0B2;
    --sb-sand-400: #C3B492;

    --sb-ink-900: #23221D;
    --sb-ink-700: #3B392F;
    --sb-ink-600: #5C5947;
    --sb-ink-400: #8A8672;

    --sb-success: #3F7D4E;
    --sb-error: #B23A26;
}

body {
    font-family: 'Nunito', sans-serif;
    background-color: var(--sb-sand-50);
    color: var(--sb-ink-900);
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Nunito', sans-serif;
    font-weight: 700;
    color: var(--sb-green-dark);
}

a {
    color: var(--sb-terracotta);
}

a:hover {
    color: var(--sb-terracotta-dark);
}

/* Navbar / Sidebar (Layout/NavMenu) - Grün wie Shell.FlyoutBackgroundColor in der App */
.sidebar {
    background-color: var(--sb-green-darker) !important;
    background-image: none !important;
}

.nav-item .nav-link {
    color: var(--sb-green-pale) !important;
}

.nav-item .nav-link.active,
.nav-item .nav-link:hover {
    color: #fff !important;
    background-color: var(--sb-green) !important;
}

/* Karten / Tabellen */
.card {
    background-color: #fff;
    border: 1px solid var(--sb-sand-300);
    border-radius: 18px;
    box-shadow: 0 8px 20px rgba(30, 52, 40, 0.12);
}

.table {
    --bs-table-bg: transparent;
}

.table th {
    color: var(--sb-green-dark);
}

/* Buttons - Pill-Form wie in der App (RadiusPill / CornerRadius 28 bei Height 56) */
.btn {
    font-family: 'Nunito', sans-serif;
    font-weight: 700;
    border-radius: 999px;
    padding: 0.6rem 1.5rem;
}

.btn-primary {
    background-color: var(--sb-terracotta);
    border-color: var(--sb-terracotta);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: var(--sb-terracotta-dark) !important;
    border-color: var(--sb-terracotta-dark) !important;
}

.btn-success {
    background-color: var(--sb-success);
    border-color: var(--sb-success);
}

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

.btn-outline-primary:hover {
    background-color: var(--sb-terracotta);
    border-color: var(--sb-terracotta);
}

.btn-outline-secondary {
    color: var(--sb-green-dark);
    border-color: var(--sb-sand-400);
}

.btn-outline-secondary:hover {
    background-color: var(--sb-green-dark);
    border-color: var(--sb-green-dark);
}

.btn-outline-danger {
    color: var(--sb-error);
    border-color: var(--sb-error);
}

.btn-outline-danger:hover {
    background-color: var(--sb-error);
    border-color: var(--sb-error);
}

/* Formularelemente */
.form-control,
.form-select {
    font-family: 'Nunito', sans-serif;
    border-radius: 12px;
    border-color: var(--sb-sand-400);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--sb-terracotta);
    box-shadow: 0 0 0 0.2rem rgba(200, 96, 40, 0.2);
}

/* Alerts */
.alert-success {
    background-color: #E3EFE3;
    border-color: var(--sb-success);
    color: var(--sb-green-darker);
}

.alert-danger {
    background-color: #F8E3DD;
    border-color: var(--sb-error);
    color: var(--sb-terracotta-darkest);
}

.alert-secondary {
    background-color: var(--sb-sand-100);
    border-color: var(--sb-sand-300);
    color: var(--sb-ink-700);
}