@font-face {
    font-family: "Inter";
    src: url("/static/fonts/Inter/Inter-VariableFont_opsz,wght.ttf")
        format("truetype");
    font-weight: 100 900; /* covers all weights in one file */
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/static/fonts/Inter/Inter-Italic-VariableFont_opsz,wght.ttf")
        format("truetype");
    font-weight: 100 900;
    font-style: italic;
    font-display: swap;
}

body {
    font-family: "Inter", sans-serif;
    font-weight: 400;
}
:root {
    --info: #2563eb;
    --success: #16a34a;
    --fail: #dc2626;
    --warning: #f7bb00;
    --non-reusable: #111827;

    /* soft backgrounds (tinted) */
    --info-bg: rgba(37, 99, 235, 0.12);
    --success-bg: rgba(22, 163, 74, 0.12);
    --fail-bg: rgba(220, 38, 38, 0.12);
    --warning-bg: rgba(234, 179, 8, 0.16);
    --non-reusable-bg: rgba(156, 163, 175, 0.16);

    /* Stock In */
    --stock-in: #16a34a;
    --stock-in-hover: #15803d;
    --stock-in-bg: rgba(22, 163, 74, 0.12);

    /* Stock Out */
    --stock-out: #f97316;
    --stock-out-hover: #ea580c;
    --stock-out-bg: rgba(249, 115, 22, 0.12);
}

.icon-success {
    color: #16a34a;
}

.icon-failure {
    color: #dc2626;
}

.icon-info {
    color: #2563eb;
}

.icon-warning {
    color: #f7bb00;
}

.icon-muted {
    color: #9ca3af;
}

.icon {
    width: 16px;
    height: 16px;
}