/* 
* KarlGoods.com Product Colors CSS
* Ce fichier contient les styles pour les options de couleur des produits
*/

:root {
    --primary-blue: #0A3B5C;    /* Bleu marine profond du logo */
    --secondary-color: #FF8C00; /* Orange vif du logo */
    --tertiary-color: #40BFA0;  /* Vert turquoise/menthe du logo */
    --white: #FFFFFF;
    --light-gray: #F3F4F6;
}

/* Options de couleur pour les produits */
.fashion-colors {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.color-option {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid transparent;
    transition: transform 0.2s ease, border-color 0.2s ease;
}

.color-option:hover {
    transform: scale(1.1);
}

.color-option.active {
    border-color: var(--primary-blue);
}

/* Couleurs spécifiques */
.color-silver {
    background-color: #C0C0C0;
}

.color-gold {
    background-color: #FFD700;
}

.color-black {
    background-color: #000000;
}

.color-white {
    background-color: #FFFFFF;
    border: 1px solid #e0e0e0;
}

.color-blue-sky {
    background-color: #87CEEB;
}

.color-coral {
    background-color: #F08080;
}

.color-brown {
    background-color: #A52A2A;
}

.color-green {
    background-color: #008000;
}

.color-gray-dark {
    background-color: #333333;
}

.color-navy {
    background-color: #1E3A8A;
}

.color-purple {
    background-color: #7851A9;
}