/* styles.css - minimal, delicate aesthetic */

:root{
    --bg: #c2bfb3;
    --card: #FFFFFF;
    --muted: #8a8a8a;
    --accent: #a3996c;
    --accent-dark: #8a805a;
    --text: #333;
}

body{
    background: var(--bg);
    color: var(--text);
    font-family: "Helvetica Neue", Arial, sans-serif;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}

.container-card{
    background: var(--card);
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 6px 18px rgba(0,0,0,0.05);
}

a{
    color: var(--text);
    text-decoration: none;
}

a:hover{
    color: var(--accent-dark);
    text-decoration: none;
}

.navbar-custom{
    background: var(--card);
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

.navbar-brand{font-weight:700; color: var(--accent);}

.btn-accent{
    background: var(--accent);
    color: white;
    border: none;
}

.btn-accent:hover{
    background: var(--accent-dark);
    color: white;
}

.btn.btn-link{
    color: #333 !important;
    background-color: #9d9a8e !important;
    text-decoration: none !important;
    transition: color 0.3s ease, background-color 0.3s ease;
    border: 1px solid #88857a !important;
    padding: 0.375rem 0.75rem !important;
    border-radius: 0.375rem !important;
    display: inline-block !important;
}

.btn.btn-link:hover, .btn.btn-link:focus, .btn.btn-link:active{
    color: white !important;
    background-color: var(--accent) !important;
    text-decoration: none !important;
    border-color: var(--accent) !important;
}

.navbar a{
    color: var(--text) !important;
    text-decoration: none !important;
    transition: color 0.3s ease, background-color 0.3s ease;
    padding: 0.5rem 1rem;
    border-radius: 6px;
}

.navbar a:hover{
    color: white !important;
    background-color: var(--accent) !important;
    text-decoration: none !important;
}

.navbar .nav-link.active{
    color: white !important;
    background-color: var(--accent) !important;
    font-weight:600;
}

.navbar .navbar-brand-link{
    padding: 0 !important;
    background-color: transparent !important;
}

.navbar .navbar-brand-link:hover{
    color: var(--text) !important;
    background-color: transparent !important;
}

.navbar .navbar-brand-link .navbar-brand{
    color: var(--accent) !important;
}

.table thead th{
    border-bottom: 2px solid rgba(0,0,0,0.06);
}

.form-label{font-weight:600}

.invalid-feedback{display:block}

.footer-small{
    font-size:0.85rem;
    color:var(--muted);
}

/* Card section headers for configuration and similar pages */
.card-header.config-section{
    background: linear-gradient(135deg, var(--accent) 0%, var(--accent-dark) 100%);
    color: #fff;
    border-bottom: none;
    padding: 0.6rem 0.85rem;
}
.card-header.config-section h6{
    font-size: 0.9rem;
    letter-spacing: .5px;
    margin:0;
    font-weight:600;
    text-transform: uppercase;
}