/* CSS commun pour les catégories - VERSION PROPRE */

/* Variables CSS centralisées */
:root {
    --color-nourriture: #FF4757;
    --color-nourriture-light: rgba(255, 71, 87, 0.15);
    --color-nourriture-very-light: rgba(255, 71, 87, 0.05);
    --color-nourriture-border: rgba(255, 71, 87, 0.3);
    
    --color-boisson: #3742FA;
    --color-boisson-light: rgba(55, 66, 250, 0.15);
    --color-boisson-very-light: rgba(55, 66, 250, 0.05);
    --color-boisson-border: rgba(55, 66, 250, 0.3);
    
    --color-civil: #2ED573;
    --color-civil-light: rgba(46, 213, 115, 0.15);
    --color-civil-very-light: rgba(46, 213, 115, 0.05);
    --color-civil-border: rgba(46, 213, 115, 0.3);
    
    --color-crimi: #8E44AD;
    --color-crimi-light: rgba(142, 68, 173, 0.15);
    --color-crimi-very-light: rgba(142, 68, 173, 0.05);
    --color-crimi-border: rgba(142, 68, 173, 0.3);
    
    --color-undefined: #747D8C;
    --color-undefined-light: rgba(116, 125, 140, 0.15);
    --color-undefined-very-light: rgba(116, 125, 140, 0.05);
    --color-undefined-border: rgba(116, 125, 140, 0.3);
}

/* VERSION SOLIDE - Couleurs pleines pour badges */
.category-solid.category-nourriture {
    background-color: var(--color-nourriture) !important;
    color: white !important;
}

.category-solid.category-boisson {
    background-color: var(--color-boisson) !important;
    color: white !important;
}

.category-solid.category-civil {
    background-color: var(--color-civil) !important;
    color: white !important;
}

.category-solid.category-crimi {
    background-color: var(--color-crimi) !important;
    color: white !important;
}

.category-solid.category-undefined {
    background-color: var(--color-undefined) !important;
    color: white !important;
}

/* VERSION GRADIENT - Dégradés doux pour interfaces */
.category-gradient.category-nourriture {
    background: linear-gradient(135deg, var(--color-nourriture-light) 0%, var(--color-nourriture-very-light) 100%) !important;
    border: 2px solid var(--color-nourriture-border) !important;
}

.category-gradient.category-boisson {
    background: linear-gradient(135deg, var(--color-boisson-light) 0%, var(--color-boisson-very-light) 100%) !important;
    border: 2px solid var(--color-boisson-border) !important;
}

.category-gradient.category-civil {
    background: linear-gradient(135deg, var(--color-civil-light) 0%, var(--color-civil-very-light) 100%) !important;
    border: 2px solid var(--color-civil-border) !important;
}

.category-gradient.category-crimi {
    background: linear-gradient(135deg, var(--color-crimi-light) 0%, var(--color-crimi-very-light) 100%) !important;
    border: 2px solid var(--color-crimi-border) !important;
}

.category-gradient.category-undefined {
    background: linear-gradient(135deg, var(--color-undefined-light) 0%, var(--color-undefined-very-light) 100%) !important;
    border: 2px solid var(--color-undefined-border) !important;
}

/* STYLES SPÉCIFIQUES PAR USAGE */

/* Badges de catégories */
.category-badge {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: bold;
    text-transform: capitalize;
}

/* Items de calculette - bordure fine */
.calculator-item.category-gradient {
    border-width: 1px !important;
}

/* Items de recettes dans stockage - bordure fine */
.recipe-item.category-gradient {
    border-width: 1px !important;
}