/* ── Status dots ─────────────────────────────── */
.status-dot {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    vertical-align: middle;
}
.status-slut   { background-color: #dc3545; }
.status-lag    { background-color: #ffc107; }
.status-normal { background-color: #28a745; }
.status-full   { background-color: #0d6e26; }

/* ── Status badges (for toasts/feedback) ────── */
.badge-slut   { background-color: #dc3545; }
.badge-lag    { background-color: #ffc107; color: #212529 !important; }
.badge-normal { background-color: #28a745; }
.badge-full   { background-color: #0d6e26; }

/* ── Inventory table ─────────────────────────── */
#inventoryTable td,
#inventoryTable th {
    vertical-align: middle;
    white-space: nowrap;
}
#inventoryTable td:first-child {
    white-space: normal;
    word-break: break-word;
    max-width: 160px;
}

/* ── Mode button colors ──────────────────────── */
.mode-del    { border-color: #dc3545 !important; color: #dc3545 !important; }
.mode-add    { border-color: #28a745 !important; color: #28a745 !important; }
.mode-status { border-color: #adb5bd !important; color: #adb5bd !important; }

/* ── Action button sizing ────────────────────── */
.btn-action {
    min-width: 36px;
    padding: 2px 8px;
    font-size: 0.85rem;
}

/* ── Scanner modal ───────────────────────────── */
#reader {
    border-radius: 8px;
    overflow: hidden;
}
#reader video {
    border-radius: 8px;
}

/* ── Scan result feedback ────────────────────── */
#scanFeedback {
    min-height: 40px;
    font-size: 0.9rem;
}

/* ── Responsive tweaks ───────────────────────── */
@media (max-width: 576px) {
    .navbar-brand { font-size: 1rem; }
    #inventoryTable th,
    #inventoryTable td { padding: 6px 4px; font-size: 0.85rem; }
    .btn-action { min-width: 30px; padding: 2px 5px; font-size: 0.8rem; }
}

/* ── Login page ──────────────────────────────── */
body.login-body {
    background: #1a1a2e;
}

/* ── Highlight scanned row briefly ──────────────*/
tr.scan-flash {
    animation: rowflash 0.6s ease-out;
}
@keyframes rowflash {
    0%   { background-color: #fff3cd; }
    100% { background-color: transparent; }
}

/* ── HA on-list indicator ───────────────────── */
.ha-badge {
    font-size: 0.65rem;
    vertical-align: middle;
    opacity: 0.7;
}

/* ── Scan info bar ───────────────────────────── */
#scanInfoBar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #212529;
    color: #fff;
    padding: 10px 14px 14px;
    z-index: 1055;
    border-top: 3px solid #198754;
    transform: translateY(100%);
    transition: transform 0.22s ease-out;
}
#scanInfoBar.show {
    transform: translateY(0);
}
.scan-info-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 3px;
}
