/* ── Base ──────────────────────────────────────────────── */
body {
    background-color: #1a1a1a;
    color: #ececec;
    font-family: system-ui, -apple-system, sans-serif;
}

/* Non-label body text inside containers gets a softer gray */
div p, div span, div li, div small,
a p, a span {
    color: #9ca3af;
}

/* Bootstrap muted text on dark backgrounds */
.text-muted { color: #9ca3af !important; }

a { color: #6ea8fe; }
a:hover { color: #9ec5fe; }

/* ── Week grid (homepage) ──────────────────────────────── */
.week-title {
    font-size: 1.25rem;
    font-weight: 600;
}

.grid-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 30vh);
    gap: 10px;
    align-items: center;
}

.weekday {
    border: 2px #ececec solid;
    height: 100%;
    color: #ececec;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    transition: background-color 0.15s, border-color 0.15s;
}

.weekday:hover {
    background-color: #2a2a2a;
    border-color: #6ea8fe;
}

.weekday.today {
    border-color: #0d6efd;
    background-color: #0d1b38;
}

.weekday-label {
    font-weight: 600;
    font-size: 1rem;
    margin: 0;
}

.weekday-date {
    font-size: 0.85rem;
    color: #9ca3af;
    margin: 0;
}

.weekday-macros {
    width: 100%;
}

.weekday-macro-cal {
    font-size: 0.8rem;
    font-weight: 700;
    color: #fbbf24;
}

.weekday-macro-detail {
    font-size: 0.7rem;
    color: #9ca3af;
}

#sunday {
    grid-column-start: 2;
    grid-column-end: 3;
    grid-row-start: 3;
    grid-row-end: 4;
}

/* ── Macro summary card (day view) ─────────────────────── */
.macro-summary-card {
    background-color: #2a2a2a;
    border: 1px solid #3a3a3a;
    border-radius: 0.5rem;
    padding: 1.25rem;
}

.macro-grid {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.macro-pill {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #1a1a1a;
    border-radius: 0.4rem;
    padding: 0.6rem 1rem;
    min-width: 80px;
    border: 1px solid #3a3a3a;
}

.macro-pill.calories  { border-color: #f59e0b; }
.macro-pill.protein   { border-color: #10b981; }
.macro-pill.carbs     { border-color: #6366f1; }
.macro-pill.fat       { border-color: #ef4444; }

.macro-value {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.1;
}

.macro-label {
    font-size: 0.7rem;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ── Day view ───────────────────────────────────────────── */
.slot-header {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #9ca3af;
    border-bottom: 1px solid #3a3a3a;
    padding-bottom: 0.4rem;
    margin-bottom: 0.75rem;
}

.meal-card {
    background-color: #2a2a2a;
    border: 1px solid #3a3a3a;
    border-radius: 0.5rem;
    padding: 1rem;
}

.macro-grid-sm {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.badge-macro {
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    border-radius: 0.3rem;
    font-weight: 600;
    white-space: nowrap;
}

.badge-macro.cal  { background-color: #451a03; color: #fbbf24; }
.badge-macro.pro  { background-color: #052e16; color: #34d399; }
.badge-macro.carb { background-color: #1e1b4b; color: #a5b4fc; }
.badge-macro.fat  { background-color: #450a0a; color: #fca5a5; }

.recipe-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.recipe-row {
    font-size: 0.85rem;
    color: #9ca3af;
    padding: 0.2rem 0;
    border-top: 1px solid #2a2a2a;
}

/* ── Add Ingredient result card ─────────────────────────── */
.ingredient-result-card {
    background-color: #2a2a2a;
    border: 1px solid #3a3a3a;
}

/* ── Tables ─────────────────────────────────────────────── */
.table-dark {
    --bs-table-bg: #2a2a2a;
    --bs-table-hover-bg: #333;
    --bs-table-border-color: #3a3a3a;
}

/* ── Forms ──────────────────────────────────────────────── */
.form-control, .form-select {
    background-color: #2a2a2a;
    border-color: #3a3a3a;
    color: #ececec;
}

.form-control:focus, .form-select:focus {
    background-color: #2a2a2a;
    border-color: #6ea8fe;
    color: #ececec;
    box-shadow: 0 0 0 0.2rem rgba(110, 168, 254, 0.15);
}

.form-control::placeholder { color: #6b7280; }
.form-label { color: #d1d5db; font-weight: 500; }

/* ── Navbar / footer ────────────────────────────────────── */
.navbar-dark .navbar-nav .nav-link { color: #9ca3af; }
.navbar-dark .navbar-nav .nav-link:hover { color: #ececec; }

.navbar-brand-center {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.footer { background-color: #111 !important; }