/* Styles pour les sections avec images sepia - Palette #2381 "In Fashion Balance" */

/* Overlay optimisé pour les images sepia */
.section-overlay {
    background: linear-gradient(
        135deg,
        rgba(10, 4, 0, 0.6) 0%,       /* Noir profond transparent */
        rgba(152, 163, 165, 0.3) 50%, /* Gris ardoise transparent */
        rgba(251, 176, 35, 0.2) 100%  /* Jaune moutarde transparent */
    );
}

/* Titres de sections avec ombres optimisées */
.section-title {
    text-shadow: 2px 2px 4px rgba(10, 4, 0, 0.8);
    color: #fefdf8; /* Blanc pur */
}

/* Texte des sections */
.section-text {
    text-shadow: 1px 1px 2px rgba(10, 4, 0, 0.7);
    color: #f8f6f3; /* Gris très clair */
}

/* Effet de brillance au hover adapté */
.section-shine {
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(251, 176, 35, 0.4) 50%,  /* Jaune moutarde vif transparent */
        transparent 100%
    );
}

/* Tags optimisés pour les images sepia */
.tag-vintage {
    background: linear-gradient(135deg, #fbb023, #e09e1f); /* Jaune moutarde vif */
    color: #0a0400; /* Noir profond */
    border: 1px solid #c18a1b; /* Moutarde foncée */
    text-shadow: none;
}

.tag-vintage:hover {
    background: linear-gradient(135deg, #e09e1f, #c18a1b);
    color: #0a0400; /* Noir profond */
}

/* Boutons adaptés aux images sepia */
.btn-vintage-primary {
    background: linear-gradient(135deg, #fbb023, #e09e1f);
    color: #0a0400;
    border: none;
    box-shadow: 0 4px 12px rgba(251, 176, 35, 0.3);
}

.btn-vintage-primary:hover {
    background: linear-gradient(135deg, #e09e1f, #c18a1b);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(251, 176, 35, 0.4);
}

.btn-vintage-secondary {
    background: linear-gradient(135deg, #f1ac88, #d99a7a);
    color: #0a0400;
    border: none;
    box-shadow: 0 4px 12px rgba(241, 172, 136, 0.3);
}

.btn-vintage-secondary:hover {
    background: linear-gradient(135deg, #d99a7a, #c1886c);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(241, 172, 136, 0.4);
}

/* Accents colorés pour les actions */
.btn-vintage-success {
    background: linear-gradient(135deg, #f1ac88, #d99a7a);
    color: #0a0400;
    border: none;
    box-shadow: 0 4px 12px rgba(241, 172, 136, 0.3);
}

.btn-vintage-error {
    background: linear-gradient(135deg, #fb6465, #e55a5b);
    color: white;
    border: none;
    box-shadow: 0 4px 12px rgba(251, 100, 101, 0.3);
}

.btn-vintage-info {
    background: linear-gradient(135deg, #98a3a5, #7a8a8c);
    color: white;
    border: none;
    box-shadow: 0 4px 12px rgba(152, 163, 165, 0.3);
}

/* Effet de transition doux */
.section-transition {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Responsive pour les sections */
@media (max-width: 768px) {
    .section-title {
        font-size: 1.5rem;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
    }
    
    .section-text {
        font-size: 0.875rem;
    }
}
