/* Alinear cantidad y botón */
.product__actions {
     display: flex;
     align-items: center;
     flex-wrap: wrap;
}
/* Consistencia de ancho entre estados del botón */
.product__actions-item--addtocart .add-to-cart-btn {
     min-width: 200px; /* compacto y consistente entre estados */
     white-space: nowrap;
}
/* Separación sutil entre cantidad y botón en desktop */
@media (min-width: 768px) {
     .product__actions-item--quantity { margin-right: .5rem; }
}
@media (max-width: 576px) {
     .product__actions-item--addtocart .add-to-cart-btn {
          width: 100%;
          min-width: 0;
     }
}
.review {
     transition: all 0.3s ease;
}

.review:hover {
     background-color: #f9f9f9;
     border-radius: 8px;
     margin: 0 -10px;
     padding: 20px 10px !important;
}

.rating__star {
     background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23ddd' stroke-width='1'/%3e%3cpath d='M7 1l1.5 3h3.5l-2.5 2 1 3.5-3-2-3 2 1-3.5-2.5-2h3.5z' fill='%23ddd'/%3e%3c/svg%3e");
}

.rating__star--active {
     background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23ffc107' stroke-width='1'/%3e%3cpath d='M7 1l1.5 3h3.5l-2.5 2 1 3.5-3-2-3 2 1-3.5-2.5-2h3.5z' fill='%23ffc107'/%3e%3c/svg%3e");
}

.badge {
     display: inline-block;
     padding: 0.25em 0.6em;
     font-size: 0.75em;
     font-weight: 700;
     line-height: 1;
     text-align: center;
     white-space: nowrap;
     vertical-align: baseline;
     border-radius: 0.25rem;
}

.badge-primary {
     color: #fff;
     background-color: #007bff;
}

.ml-2 {
     margin-left: 0.5rem;
}

.auth-required-message {
     transition: all 0.3s ease;
}

.auth-required-message:hover {
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.auth-required-message .btn {
     min-width: 140px;
}

.auth-required-message .fas {
     margin-right: 8px;
}

@media (max-width: 768px) {
     .auth-required-message .btn {
          display: block;
          width: 100%;
          margin: 5px 0;
     }
}