.badge-turquoise {
    background-color: #ccfbf1 !important;
    color: #0f766e !important;
}

.dark .badge-turquoise {
    background-color: rgba(20, 184, 166, 0.2) !important;
    color: #5eead4 !important;
}

.badge-lavender {
    background-color: #ede9fe !important;
    color: #6d28d9 !important;
}

.dark .badge-lavender {
    background-color: rgba(139, 92, 246, 0.2) !important;
    color: #c4b5fd !important;
}

.badge-shift {
    align-items: center !important;
    background-color: #f8fafc !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.28) !important;
    color: #475569 !important;
    display: inline-flex !important;
    gap: 2px !important;
}

.badge-shift--m {
    background-color: #dcfce7 !important;
    box-shadow: inset 0 0 0 1px rgba(22, 163, 74, 0.22) !important;
}

.badge-shift--d {
    background-color: #ffedd5 !important;
    box-shadow: inset 0 0 0 1px rgba(249, 115, 22, 0.24) !important;
}

.badge-shift--n {
    background-color: #e0f2fe !important;
    box-shadow: inset 0 0 0 1px rgba(2, 132, 199, 0.22) !important;
}

.badge-shift--md {
    background: linear-gradient(110deg, #dcfce7 0%, #ffedd5 100%) !important;
}

.badge-shift--mn {
    background: linear-gradient(110deg, #dcfce7 0%, #e0f2fe 100%) !important;
}

.badge-shift--dn {
    background: linear-gradient(110deg, #ffedd5 0%, #e0f2fe 100%) !important;
}

.badge-shift--mdn {
    background:
        linear-gradient(
            110deg,
            #dcfce7 0%,
            #ffedd5 50%,
            #e0f2fe 100%
        ) !important;
}

.badge-shift__letter {
    font-weight: 700 !important;
}

.badge-shift__letter--m {
    color: #16a34a !important;
}

.badge-shift__letter--d {
    color: #f97316 !important;
}

.badge-shift__letter--n {
    color: #0284c7 !important;
}

.badge-shift__separator {
    color: #64748b !important;
    font-weight: 700 !important;
}

.dark .badge-shift {
    background-color: rgba(148, 163, 184, 0.14) !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.22) !important;
    color: #cbd5e1 !important;
}

.dark .badge-shift--m {
    background-color: rgba(34, 197, 94, 0.18) !important;
}

.dark .badge-shift--d {
    background-color: rgba(249, 115, 22, 0.18) !important;
}

.dark .badge-shift--n {
    background-color: rgba(14, 165, 233, 0.18) !important;
}

.dark .badge-shift--md {
    background:
        linear-gradient(
            110deg,
            rgba(34, 197, 94, 0.18) 0%,
            rgba(249, 115, 22, 0.18) 100%
        ) !important;
}

.dark .badge-shift--mn {
    background:
        linear-gradient(
            110deg,
            rgba(34, 197, 94, 0.18) 0%,
            rgba(14, 165, 233, 0.18) 100%
        ) !important;
}

.dark .badge-shift--dn {
    background:
        linear-gradient(
            110deg,
            rgba(249, 115, 22, 0.18) 0%,
            rgba(14, 165, 233, 0.18) 100%
        ) !important;
}

.dark .badge-shift--mdn {
    background:
        linear-gradient(
            110deg,
            rgba(34, 197, 94, 0.18) 0%,
            rgba(249, 115, 22, 0.18) 50%,
            rgba(14, 165, 233, 0.18) 100%
        ) !important;
}

.dark .badge-shift__letter--m {
    color: #4ade80 !important;
}

.dark .badge-shift__letter--d {
    color: #fb923c !important;
}

.dark .badge-shift__letter--n {
    color: #38bdf8 !important;
}

.dark .badge-shift__separator {
    color: #94a3b8 !important;
}

.badge-electric {
    background-color: #00d5ff !important;
    color: #00344d !important;
    box-shadow:
        0 0 7px rgba(0, 213, 255, 0.65),
        inset 0 0 0 1px rgba(0, 149, 199, 0.35) !important;
}

.dark .badge-electric {
    background-color: rgba(0, 213, 255, 0.22) !important;
    color: #33e0ff !important;
    box-shadow:
        0 0 8px rgba(0, 213, 255, 0.5),
        inset 0 0 0 1px rgba(51, 224, 255, 0.55) !important;
}

/* ------------------------------------------------------------------ */
/* Staff color badges (assignment table)                              */
/* Color = group (top/admin palette, operator inherits admin).        */
/* Form = role (solid top / normal admin / operator dot / SUB border).*/
/* ------------------------------------------------------------------ */

.badge-staff {
    align-items: center !important;
    display: inline-flex !important;
    gap: 4px !important;
    text-transform: none !important;
}

.badge-staff__name {
    text-transform: none !important;
}

/* --- Warm palette --- */
.badge-staff--red    { background-color: #fee2e2 !important; color: #b91c1c !important; }
.badge-staff--amber  { background-color: #fef3c7 !important; color: #b45309 !important; }
.badge-staff--orange { background-color: #ffedd5 !important; color: #c2410c !important; }
.badge-staff--rose   { background-color: #ffe4e6 !important; color: #be123c !important; }

/* --- Cold palette --- */
.badge-staff--blue   { background-color: #dbeafe !important; color: #1d4ed8 !important; }
.badge-staff--cyan   { background-color: #cffafe !important; color: #0e7490 !important; }
.badge-staff--indigo { background-color: #e0e7ff !important; color: #4338ca !important; }
.badge-staff--violet { background-color: #ede9fe !important; color: #6d28d9 !important; }

/* --- Neutral / no profile --- */
.badge-staff--gray   { background-color: #f1f5f9 !important; color: #475569 !important; }

/* --- Search highlight (temporary display mode) --- */
.badge-staff--highlight {
    background-color: #fef9c3 !important;
    color: #854d0e !important;
    box-shadow: inset 0 0 0 1.5px rgba(202, 138, 4, 0.45) !important;
}

/* --- Role forms --- */
.badge-staff--solid {
    box-shadow: inset 0 0 0 1px currentColor !important;
    font-weight: 700 !important;
}

.badge-staff--opr {
    opacity: 0.92 !important;
}

.badge-staff__dot {
    background-color: currentColor !important;
    border-radius: 50% !important;
    display: inline-block !important;
    height: 6px !important;
    width: 6px !important;
}

/* --- Substitute marker (orange border + SUB tag), stacks on color --- */
.badge-staff--sub {
    box-shadow: inset 0 0 0 1.5px #f97316 !important;
}

.badge-staff__sub-tag {
    background-color: #f97316 !important;
    border-radius: 4px !important;
    color: #fff !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin-left: 2px !important;
    padding: 0 3px !important;
}

/* --- Dark mode --- */
.dark .badge-staff--red    { background-color: rgba(239, 68, 68, 0.2) !important;  color: #f87171 !important; }
.dark .badge-staff--amber  { background-color: rgba(245, 158, 11, 0.2) !important; color: #fbbf24 !important; }
.dark .badge-staff--orange { background-color: rgba(249, 115, 22, 0.2) !important; color: #fb923c !important; }
.dark .badge-staff--rose   { background-color: rgba(244, 63, 94, 0.2) !important;  color: #fb7185 !important; }
.dark .badge-staff--blue   { background-color: rgba(59, 130, 246, 0.2) !important; color: #60a5fa !important; }
.dark .badge-staff--cyan   { background-color: rgba(6, 182, 212, 0.2) !important;  color: #22d3ee !important; }
.dark .badge-staff--indigo { background-color: rgba(99, 102, 241, 0.2) !important; color: #818cf8 !important; }
.dark .badge-staff--violet { background-color: rgba(139, 92, 246, 0.2) !important; color: #c4b5fd !important; }
.dark .badge-staff--gray   { background-color: rgba(148, 163, 184, 0.18) !important; color: #cbd5e1 !important; }

.dark .badge-staff--highlight {
    background-color: rgba(234, 179, 8, 0.22) !important;
    color: #fde047 !important;
    box-shadow: inset 0 0 0 1.5px rgba(234, 179, 8, 0.5) !important;
}