/* ============================================
   BIM Badges & Utility Text Colors
   ============================================
   Text color utilities for semantic states
   ============================================ */

/* ============================================
   UTILITY TEXT COLORS
   ============================================ */

/* Success (Green) */
.bim-text-success {
    color: var(--bim-success) !important;
}

/* Danger / Accent (Red) */
.bim-text-danger,
.bim-text-accent {
    color: var(--bim-accent) !important;
}

/* Warning (Orange) */
.bim-text-warning {
    color: var(--bim-warning) !important;
}

/* Info (Blue) */
.bim-text-info {
    color: var(--bim-info) !important;
}

/* Primary (Dark) */
.bim-text-primary {
    color: var(--bim-text-primary) !important;
}

/* Secondary (Gray) */
.bim-text-secondary {
    color: var(--bim-text-secondary) !important;
}

/* Muted (Light Gray) */
.bim-text-muted {
    color: var(--bim-text-muted) !important;
}

/* Faint (Very Light Gray) */
.bim-text-faint {
    color: var(--bim-text-faint) !important;
}

/* ============================================
   STATUS BADGES
   ============================================
   Used by BIM_Notification_Helper::get_status_badge()
   Output: <span class="bim-status-badge {status_slug}">icon label</span>
   ============================================ */

/* ── Base ── */
.bim-status-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--bim-space-1);
    padding: 0.1875rem 0.5rem;
    border-radius: var(--bim-radius-sm);
    font-family: var(--bim-font);
    font-size: var(--bim-text-sm);
    font-weight: 700;
    line-height: 1.5;
    white-space: nowrap;
    /* Default fallback — neutral */
    background: var(--bim-bg-hover);
    color: var(--bim-text-secondary);
}

/* ── Pending quote — waiting, amber ── */
.bim-status-badge.pending_quote {
    background: var(--bim-warning-light);
    color: var(--bim-warning-dark);
}

/* ── Quoted — needs payment decision, indigo ── */
.bim-status-badge.quoted {
    background: var(--bim-info-light);
    color: var(--bim-info);
}

/* ── Payment in review / Pending cash — amber ── */
.bim-status-badge.payment_review,
.bim-status-badge.pending_cash_payment {
    background: var(--bim-warning-light);
    color: var(--bim-warning-dark);
}

/* ── Paid — confirmed, success green ── */
.bim-status-badge.paid {
    background: var(--bim-success-light);
    color: var(--bim-success);
}

/* ── Active transit states — info blue ── */
.bim-status-badge.processing,
.bim-status-badge.in_miami,
.bim-status-badge.in_transit,
.bim-status-badge.customs,
.bim-status-badge.out_for_delivery {
    background: var(--bim-info-light);
    color: var(--bim-info);
}

/* ── Delivered / Completed — earned, success green ── */
.bim-status-badge.delivered,
.bim-status-badge.completed {
    background: var(--bim-success-light);
    color: var(--bim-success);
}

/* ── Cancelled — danger ── */
.bim-status-badge.cancelled {
    background: var(--bim-danger-light);
    color: var(--bim-danger);
}

/* ── Refunded — warning ── */
.bim-status-badge.refunded {
    background: var(--bim-warning-light);
    color: var(--bim-warning-dark);
}

/* ============================================
   PAYMENT METHOD BADGES
   ============================================
   Used in dashboard & payment tables.
   Extends .bim-status-badge base.
   ============================================ */

.bim-method-badge .material-symbols-outlined {
    font-size: var(--bim-icon-sm);
}

/* QR — info indigo */
.bim-method-badge--qr {
    background: var(--bim-info-light);
    color: var(--bim-info);
}

/* Cash — neutral */
.bim-method-badge--cash {
    background: var(--bim-bg-hover);
    color: var(--bim-text-secondary);
}

/* ============================================
   STATUS DOT BADGES
   ============================================
   Used in the customer order list table.
   Component: .bim-status-dot-badge + .bim-dot
   Variant modifier: .bim-dot-badge--{group}
   ============================================ */

/* ── Base ── */
.bim-status-dot-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 6px;
    font-family: var(--bim-font);
    font-size: var(--bim-text-sm);
    font-weight: 600;
    white-space: nowrap;
    line-height: 1.4;
}

.bim-status-dot-badge .bim-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Pending — grey */
.bim-dot-badge--pending {
    background: var(--bim-bg-hover);
    color: var(--bim-text-secondary);
}
.bim-dot-badge--pending .bim-dot { background: var(--bim-text-faint); }

/* Quoted — indigo */
.bim-dot-badge--quoted {
    background: var(--bim-info-light);
    color: var(--bim-info);
}
.bim-dot-badge--quoted .bim-dot { background: var(--bim-info); }

/* Payment pending — amber */
.bim-dot-badge--payment {
    background: var(--bim-warning-light);
    color: var(--bim-warning-dark);
}
.bim-dot-badge--payment .bim-dot { background: var(--bim-warning); }

/* Active/processing — amber pulsing */
.bim-dot-badge--active {
    background: var(--bim-warning-light);
    color: var(--bim-warning-dark);
}
.bim-dot-badge--active .bim-dot {
    background: var(--bim-warning);
    animation: bimPulse 2s ease-in-out infinite;
}

/* In transit — gold pulsing */
.bim-dot-badge--transit {
    background: var(--bim-bolivia-yellow-light);
    color: var(--bim-bolivia-yellow-dark);
}
.bim-dot-badge--transit .bim-dot {
    background: var(--bim-bolivia-yellow);
    animation: bimPulse 2s ease-in-out infinite;
}

/* Arriving soon — orange */
.bim-dot-badge--arriving {
    background: var(--bim-orange-light);
    color: var(--bim-orange-dark);
}
.bim-dot-badge--arriving .bim-dot { background: var(--bim-orange); }

/* Completed — green */
.bim-dot-badge--completed {
    background: var(--bim-success-light);
    color: var(--bim-success);
}
.bim-dot-badge--completed .bim-dot { background: var(--bim-success); }

/* Cancelled — red */
.bim-dot-badge--cancelled {
    background: var(--bim-danger-light);
    color: var(--bim-danger);
}
.bim-dot-badge--cancelled .bim-dot { background: var(--bim-danger); }

/* Expired quote — brand red, pulsing */
.bim-dot-badge--expired {
    background: var(--bim-accent-light);
    color: var(--bim-accent);
}
.bim-dot-badge--expired .bim-dot {
    background: var(--bim-accent);
    animation: bimPulse 1.5s ease-in-out infinite;
}

/* Negotiate — indigo */
.bim-dot-badge--negotiate {
    background: var(--bim-info-light);
    color: var(--bim-info);
}
.bim-dot-badge--negotiate .bim-dot {
    background: var(--bim-info);
    animation: bimPulse 2s ease-in-out infinite;
}

/* Partial paid — green pulsing */
.bim-dot-badge--partial {
    background: var(--bim-success-light);
    color: var(--bim-success);
}
.bim-dot-badge--partial .bim-dot {
    background: var(--bim-success);
    animation: bimPulse 2s ease-in-out infinite;
}