/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 09 2026 | 02:57:26 */
/* ========================================================================
FILNAMN: [CSS] – Recept: Badges (AIP & Paleo)
BESKRIVNING: 
Designar de små "pillren" (badges) som ligger ovanpå receptbilder.
UPPDATERAD: Matchar butikens stil (9px text, ramar) men UTAN ikoner.
========================================================================
*/

/* --- 1. GRUNDDESIGN (POSITION & FORM) --- */
.kost-badge {
    /* Placering (Absolut i hörnet på bilden) */
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    z-index: 20 !important;
    
    /* Typografi - Matchar butiken (9px + Proxima Nova) */
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    
    /* Form & Ram */
    padding: 4px 9px !important;
    border-radius: 50px !important; /* Piller-form */
    border: 1px solid transparent !important; /* Förbereder för ram */
    
    /* Skugga */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
    
    /* Interaktion */
    pointer-events: none; 
    line-height: 1 !important;
    white-space: nowrap !important;
}

/* --- 2. AIP-BADGE (BLÅ MED RAM) --- */
.aip-badge {
    background-color: #F0F5F9 !important; 
    color: #587B99 !important;
    border-color: #D6E4ED !important; /* Samma ram som i butiken */
}

/* --- 3. PALEO-BADGE (BEIGE MED RAM) --- */
.paleo-badge {
    background-color: #F8F5F2 !important; 
    color: #8C857A !important; 
    border-color: #E8E0D5 !important; /* Samma ram som i butiken */
}