/* Badges (Existing + new compatibility where needed) */
.badge {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    border-radius: 5px;
    font-size: 90%;
    line-height: 1.2;
    font-weight: 500;
    background-color: #f1f5f9;
    color: var(--text-muted);
}

/* Clickable badges that link to a category/topic page */
a.badge {
    text-decoration: none;
    cursor: pointer;
    transition: filter 0.15s ease, box-shadow 0.15s ease;
}
a.badge:hover {
    filter: brightness(0.96);
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.06) inset;
}


.badge.badge_notation { background-color: rgb(244 244 244); color: #616161; border: 1px solid var(--text-muted); }

.badge.badge_SFA { background-color: #fef7e9; color: #cb9200; border: 1px solid #cb9200; }
.badge.badge_MUFA { background-color: #fef0e9; color: #d97228; border: 1px solid #d97228; }
.badge.badge_PUFA { background-color: #ede9fe; color: #6d28d9; border: 1px solid #6d28d9; }
.badge.badge_BCFA { background-color: #e8fff4; color: #00b981; border: 1px solid #00b981; }
.badge.badge_FuFA { background-color: #e8fffd; color: #00b9a3; border: 1px solid #00b9a3; }
.badge.badge_CYFA { background-color: #fdeef2; color: #be185d; border: 1px solid #be185d; }
.badge.badge_OXFA { background-color: #fdeef2; color: #be185d; border: 1px solid #be185d; }
.badge.badge_NFA  { background-color: #fdeef2; color: #be185d; border: 1px solid #be185d; }

.badge.badge_essential { background: rgb(224 251 221);  color: #00a003;  border: 1px solid #00a003; }

.badge.badge_TRA  { background-color: #ede9fe; color: #6d28d9; border: 1px solid #6d28d9; }
.badge.badge_iTrans  { background-color: #fdeef2; color: #be185d; border: 1px solid #be185d; }
.badge.badge_industrial  { background-color: #fdeef2; color: #be185d; border: 1px solid #be185d; }
.badge.badge_rTrans  { background: rgb(224 251 221);  color: #00a003;  border: 1px solid #00a003; }
.badge.badge_cis { background: rgb(215 223 214);  color: #4d6e4e;  border: 1px solid #4d6e4e; }

.badge.badge-omega-3 {  background: rgb(224 251 221);  color: #00a003;  border: 1px solid #00a003; }
.badge.badge-omega-6 {  background-color: #feeee9; color: #d95128; border: 1px solid #d94828; }
.badge.badge-omega-5,
.badge.badge-omega-7,
.badge.badge-omega-9,
.badge.badge-omega-8,
.badge.badge-omega-11 {  background: rgb(221 242 239);  color: #0e8a7d;  border: 1px solid #0e8a7d; }






body.dark-mode {
    .badge.badge_notation { background-color: #4d4d4d; color: #dcdcdc; border: 1px solid #4d4d4d; }

    .badge.badge_SFA { background-color: #b39341; color: #fef7e9; border: 1px solid #b39341; }
    .badge.badge_MUFA { background-color: #d97228; color: #fef0e9; border: 1px solid #d97228; }
    .badge.badge_PUFA { background-color: #562b98; color: #ede9fe; border: 1px solid #6d28d9; }
    .badge.badge_BCFA { background-color: #00b981; color: #e8fff4; border: 1px solid #00b981; }
    .badge.badge_FuFA { background-color: #00b9a3; color: #e8fffd; border: 1px solid #00b9a3; }
    .badge.badge_CYFA { background-color: #be185d; color: #fdeef2; border: 1px solid #be185d; }
    .badge.badge_OXFA { background-color: #be185d; color: #fdeef2; border: 1px solid #be185d; }
    .badge.badge_NFA  { background-color: #be185d; color: #fdeef2; border: 1px solid #be185d; }

    .badge.badge_TRA  { background-color: #562b98; color: #ede9fe; border: 1px solid #6d28d9; }
    .badge.badge_iTrans  { background-color: #be1818; color: #fdeef2; border: 1px solid #be1818; }
    .badge.badge_industrial  { background-color: #fdeef2; color: #be185d; border: 1px solid #be185d; }
    .badge.badge_rTrans  { background: #00a003;  color: rgb(194 255 185);  border: 1px solid #00a003; }
    .badge.badge_cis { background-color:  rgb(215 223 214); color: #4d6e4e;  border: 1px solid #4d6e4e; }

    .badge.badge-omega-3 {  background: #00a003;  color: rgb(151 255 137);  border: 1px solid #00a003; }
    .badge.badge-omega-6 {  background-color: #d94328; color: #fab8a4; border: 1px solid #d94328; }
    .badge.badge-omega-5,
    .badge.badge-omega-7,
    .badge.badge-omega-9,
    .badge.badge-omega-8,
    .badge.badge-omega-11 {  background: #1e6e65;  color: rgb(139 227 213);  border: 1px solid #0e8a7d; }

    .badge.badge_essential { background: #00a003;  color: rgb(151 255 137);  border: 1px solid #00a003; }
    .badge.badge-danger { background: rgba(239, 68, 68, 0.15); color: var(--accent-danger); border: 1px solid var(--accent-danger); }


}


.badge-ok      { background: #dcfce7; color: #166534; }
.badge-warn    { background: #fef9c3; color: #854d0e; }
.badge-info    { background: #dbeafe; color: #1e40af; }
.badge-inferred    { background: #cfcaca; color: #616161; }
.badge-neutral { background: var(--bg-level-3); color: var(--text-main); }
.badge.badge-danger { background: rgba(239, 68, 68, 0.15); color: var(--accent-danger); border: 1px solid var(--accent-danger); }

body.dark-mode {
    .badge.badge-ok      { background: #14532d; color: #bbf7d0; }
    .badge.badge-warn    { background: #4d3b09; color: #fde68a; }
    .badge-inferred    { background: #cfcaca; color: #3e3e3e; }
    .badge.badge-info    { background: #1e3a8a; color: #bfdbfe; }
    .badge.badge-neutral { background: var(--bg-level-3); color: var(--text-main); }
    .badge.badge-danger { background: red; color: white; }
}



/* badgeCombo — consolidates the type / notation / omega badges into one
   segmented pill (takes far less horizontal space than 3 separate badges).
   Built by \FA_Profiles\Cat::comboBadge() (PHP) and comboBadgeHtml() (JS).
   Works with 1, 2 or 3 children. */

.badgeCombo {
    display: inline-flex;
    gap: 0;
    flex-wrap: nowrap;
    vertical-align: middle;
    max-width: max-content;
}
.badgeCombo .badge {
    margin: 0 !important;
    border: 1px solid #888888;
    padding: 0.125rem 0.2rem;
    font-family: monospace;
    white-space: nowrap;
    border-radius: 0;
}
.badgeCombo .badge:first-child {
    border-radius: 5px 0 0 5px;
}
.badgeCombo .badge:not(:last-child) {
    border-right: 0;
}
.badgeCombo .badge:last-child {
    border-radius: 0 5px 5px 0;
}
.badgeCombo .badge:only-child {
    border-radius: 5px;
    border-right: 1px solid #888888;
}