:root {
  --olive: #2D3120;
  --olive2: #3E4630;
  --gold: #D8A967;
  --gold-lt: rgba(216, 169, 103, .10);
  --bg: #F5F2EC;
  --bg2: #EDE8DF;
  --bg3: #E4DECE;
  --green: #3D6B3A;
  --green-lt: #EAF3E9;
  --text: rgba(45, 49, 32, .75);
  --muted: rgba(45, 49, 32, .44);
  --border: rgba(45, 49, 32, .12); 
  --white: #FEFCF8;
  --shadow: 0 2px 16px rgba(45, 49, 32, .08);
  --shadow-md: 0 8px 32px rgba(45, 49, 32, .12);
  --r: 12px;
  --r-lg: 20px;
  --r-xl: 28px;
}

/* Kapsayıcı Alan (Senin Yapın) */
.hst-allergen-wrapper { 
    display: flex; 
    flex-wrap: wrap; 
    gap: 9px; /* Pill'ler arasındaki ideal boşluk */
    margin: 15px 0; 
}

/* Hap (Pill) Tasarımı (Senin Yapın) */
.hst-badge-pill { 
    display: inline-flex; 
    align-items: center; 
    background: transparent !important; /* Koyu arka planı tamamen sıfırladık */
    border: 1px solid var(--border) !important; /* Temanın soft border değişkenini bağladık */
    color: rgba(45, 49, 32, .60) !important; /* Yazı rengi ilk görseldeki tonda */
    padding: 7px 16px; /* Tam o oval yapıyı veren iç boşluklar */
    border-radius: 50px; 
    
    font-family: 'Jost', sans-serif;
    font-size: 13px; 
    font-weight: 400; 
    text-transform: capitalize !important; /* SUIKERVRIJ bağırmasını önleyip sadece baş harfi büyütür */
    letter-spacing: 0.02em; 
    
    transition: all 0.3s ease; 
    cursor: pointer; 
}

/* Hover Efekti */
.hst-badge-pill:hover { 
    background: var(--gold-lt) !important; /* Temandaki soft gold arka plan rengi */
    border-color: var(--gold) !important;
    color: var(--olive) !important; 
    transform: translateY(-2px); 
}

/* İçindeki Tik (Check) İşareti (Senin Yapın) */
.hst-badge-icon { 
    margin-right: 6px; 
    font-weight: 600;
    color: var(--gold) !important; /* Tik işaretini temadaki gold rengine eşitledik */
    font-size: 13px;
}