@media (min-width: 1200px) { /* Bootstrap XL breakpoint */
    .border-xl-start {
        border-left: 1px solid var(--bs-border-color);
    }

    .border-xl-bottom {
        border-bottom: 1px solid var(--bs-border-color);
    }
}


.star-rating {
    display: inline-flex;
    flex-direction: row-reverse; /* ters sıra, CSS ~ selector’ı için */
    font-size: 2rem;           /* yıldız boyutu */
}
.star-rating input {
    display: none;               /* gizli radio’lar */
}
.star-rating label {
    cursor: pointer;
    color: #ddd;                 /* boş yıldız rengi */
    transition: color .2s;
}

/* ======= Initial state: hover yokken checked yıldızı göster ======= */
.star-rating:not(:hover) input:checked ~ label {
    color: #ffc107;              /* dolu yıldız rengi */
}

/* ======= Hover’da yalnızca o değere kadar doldur ======= */
.star-rating:hover label:hover,
.star-rating:hover label:hover ~ label {
    color: #ffc107;
}