/* assets/styles/app.css */
body {
    background-color: #f8f9fa;
}

/* Mobile bottom navbar styles */
@media (max-width: 767.98px) {
    body {
        padding-bottom: 70px;
        /* Space for fixed bottom navbar */
    }

    .mobile-nav-bottom {
        border-top: 1px solid #dee2e6;
        height: 60px;
    }

    .mobile-nav-bottom .nav-link {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100%;
        padding: 0.5rem;
    }

    .mobile-nav-bottom .bi {
        font-size: 1.5rem;
    }
}

/* Desktop top navbar styles */
@media (min-width: 768px) {
    body {
        padding-top: 60px;
        /* Space for fixed top navbar if used fixed-top class */
    }
}

/* Macro colors */
:root {
    --macro-protein: #27ae60;
    --macro-protein-pale: #e8f5e9;
    --macro-fat: #f39c12;
    --macro-fat-pale: #fffde7;
    --macro-carbs: #288fd4;
    --macro-carbs-pale: #e1f5fe;
    /* Open Food Facts status bars (pastel) */
    --off-bar-idle: #e4e8ee;
    --off-bar-loading: #c5cad4;
    --off-bar-left-ok: #b8e6ba;
    --off-bar-left-err: #f0c4c8;
    --off-bar-right-data: #b8e6ba;
    --off-bar-right-empty: #c5daf1;
    --off-bar-right-err: #f0c4c8;
    --off-bar-not-called: #a8ddd6;
}

/* OFF / API sync indicator (add product modal) */
.off-sync-bars {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin: 10px 0;
}

.off-sync-bars__segment {
    width: 40px;
    height: 3px;
    border-radius: 2px;
    background-color: var(--off-bar-idle);
    transition: background-color 0.2s ease;
}

.off-sync-bars__segment[data-side="left"][data-off-bar="loading"],
.off-sync-bars__segment[data-side="right"][data-off-bar="loading"] {
    background-color: var(--off-bar-loading);
}

.off-sync-bars__segment[data-side="left"][data-off-bar="ok"] {
    background-color: var(--off-bar-left-ok);
}

.off-sync-bars__segment[data-side="left"][data-off-bar="err"] {
    background-color: var(--off-bar-left-err);
}

.off-sync-bars__segment[data-side="right"][data-off-bar="ok"] {
    background-color: var(--off-bar-right-data);
}

.off-sync-bars__segment[data-side="right"][data-off-bar="empty"] {
    background-color: var(--off-bar-right-empty);
}

.off-sync-bars__segment[data-side="right"][data-off-bar="err"] {
    background-color: var(--off-bar-right-err);
}

.off-sync-bars__segment[data-side="right"][data-off-bar="teal"] {
    background-color: var(--off-bar-not-called);
}

/* Fixed width columns for food diary */
.col-fixed-qty {
    width: 90px;
    min-width: 90px;
}

.col-fixed-macro {
    width: 65px;
    min-width: 65px;
}

.col-fixed-actions {
    width: 110px;
    min-width: 110px;
}

/* Macro backgrounds */
.bg-protein-pale {
    background-color: var(--macro-protein-pale) !important;
}

.bg-fat-pale {
    background-color: var(--macro-fat-pale) !important;
}

.bg-carbs-pale {
    background-color: var(--macro-carbs-pale) !important;
}

/* Custom summary colors */
.bg-success-custom {
    background-color: var(--macro-protein) !important;
}

.bg-warning-custom {
    background-color: var(--macro-fat) !important;
}

.bg-info-custom {
    background-color: var(--macro-carbs) !important;
}

/* Dotted border for quantity */
.border-dotted {
    border-bottom-style: dotted !important;
}

/* Header alignment */
.header-summary-align .badge {
    font-size: 0.85rem;
    font-weight: 600;
}

.col-fixed-macro.px-3 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}
