/* 
 * Clases CSS para colorear iconos SVG
 * Equivalentes a las clases text-* de Bootstrap 5.3
 * Autor: GitHub Copilot
 * Fecha: Septiembre 2025
 */

/* Colores principales de Bootstrap 5.3 */
.svg-primary {
    fill: #212529;
}

.svg-secondary {
    fill: #6c757d;
}

.svg-success {
    fill: #198754;
}

.svg-danger {
    fill: #dc3545;
}

.svg-warning {
    fill: #ffc107;
}

.svg-info {
    fill: #0dcaf0;
}

.svg-light {
    fill: #f8f9fa;
}

.svg-dark {
    fill: #0d6efd;
}

.svg-muted {
    fill: #6c757d;
}

/* Colores adicionales útiles */
.svg-white {
    fill: #ffffff;
}

.svg-black {
    fill: #000000;
}

/* Colores personalizados para marketplace/subastas */
.svg-gold {
    fill: #ffd700;
}

.svg-silver {
    fill: #c0c0c0;
}

.svg-bronze {
    fill: #cd7f32;
}

/* Estados de hover para interactividad */
.svg-primary:hover {
    fill: #212529;
}

.svg-secondary:hover {
    fill: #5c636a;
}

.svg-success:hover {
    fill: #157347;
}

.svg-danger:hover {
    fill: #bb2d3b;
}

.svg-warning:hover {
    fill: #ffca2c;
}

.svg-info:hover {
    fill: #3dd5f3;
}

.svg-white:hover {
    fill: #ffffff;
}


.svg-dark:hover {
    fill: #0d6efd;
}

/* Tamaños de iconos SVG */
.svg-xs {
    width: 12px;
    height: 12px;
}

.svg-sm {
    width: 16px;
    height: 16px;
}

.svg-md {
    width: 20px;
    height: 20px;
}

.svg-lg {
    width: 24px;
    height: 24px;
}

.svg-xl {
    width: 32px;
    height: 32px;
}

.svg-xxl {
    width: 48px;
    height: 48px;
}


/* Efectos adicionales */
.svg-opacity-25 {
    opacity: 0.25;
}

.svg-opacity-50 {
    opacity: 0.5;
}

.svg-opacity-75 {
    opacity: 0.75;
}

/* Transiciones suaves */
.svg-transition {
    transition: fill 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}

/* Efectos de rotación */
.svg-rotate-90 {
    transform: rotate(90deg);
}

.svg-rotate-180 {
    transform: rotate(180deg);
}

.svg-rotate-270 {
    transform: rotate(270deg);
}

/* Efectos de escala en hover */
.svg-hover-scale:hover {
    transform: scale(1.1);
}

.svg-hover-scale-sm:hover {
    transform: scale(1.05);
}

.svg-hover-scale-lg:hover {
    transform: scale(1.2);
}