/* review and star */

.review-section {
    display: flex; align-items: center; gap: 8px; margin: 10px 0;  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.rating-number {  font-size: 0.9em;   font-weight: 500;  color: #363636 !important; line-height: 1;}

.stars-container {display: inline-flex; align-items: center;}

/* Update star styling to match Image 2 */
.stars-container .fa-star,
.stars-container .fa-star-half-o { color: #ffc107; /* Golden yellow */  font-size: 14px;  margin-right: 2px;}

.stars-container .fa-star-o {  color: #e4e5e9; /* Light gray for empty stars */ font-size: 14px; margin-right: 2px;}

.review-count {color: #363636 !important; font-size: 0.9em; font-weight: 500;}

/* Alternative single-line layout if preferred */
.review-section.inline { display: inline-flex; align-items: baseline;}

.review-section.inline .rating-number {  margin-right: 6px;}

.review-section.inline .review-count { margin-left: 4px;}

.review-container {   max-height: 400px; overflow-y: auto;}

.view-review {display: none; /* hidden by default, JS will show */ align-items: flex-start;
    border-bottom: 1px solid #ddd;  padding: 15px;   margin-bottom: 15px;  background: #fff;
    border-radius: 8px;  position: relative; /* for absolute stars */
}
/* stars section aligned to right */
.view-review .stars {   position: absolute; top: 15px; right: 15px; font-size: 18px;color: #f1c40f;}
.view-review .span {background: #f1c40f;  color: #fff; font-weight: bold;  font-size: 16px;width: 45px;  height: 45px; border-radius: 50%; display: flex;align-items: center;justify-content: center;margin-right: 15px;}
.view-review .comet-fix { flex-grow: 1;}
.view-review h5 { margin: 0; font-size: 16px;font-weight: 600;}
.view-review h5 small {display: block; font-size: 13px;color: #777;}
.view-review p { margin-top: 8px; color: #444; font-size: 14px;line-height: 1.5;}
.rating h5{font-size:1.2em;color:#ffbf00;font-weight:800;}
.rating p{color:#363636;font-size:0.9em;font-weight:500;margin:25px 0}
.rating img{width:100px}
.rating .star {cursor: pointer;font-size: 22px;color: #ccc;}
.rating .star.checked { color: #ffbf00;}
.rating .star.hover {color: #ffbf00;}

/* Bootstrap Select main block */
    .bootstrap-select {
        display: block !important;
    }
    /* Fix width/overflow for dropdown menu - REMOVE overflow-y here */
    .bootstrap-select .dropdown-menu {
        will-change: transform;
        transform: translateZ(0);
        border-radius: 8px !important;
        border: 1px solid #ddd !important;
        padding: 5px !important;
        max-height: 250px !important;
        /* REMOVED: overflow-y: auto !important; */
        min-width: 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    /* Add scrollbar only to the inner list */
    .bootstrap-select .dropdown-menu .inner {
        max-height: 240px !important;
        overflow-y: auto !important;
    }
    /* Show dropdown over inputs--no shifting */
    .bootstrap-select.open .dropdown-menu {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        z-index: 1050 !important;
    }
    /* Selectpicker look and prevent jumping */
    .bootstrap-select .dropdown-toggle {
        background: #fff !important;
        border: 1px solid #ced4da !important;
        border-radius: 50px !important;
        padding: 10px 12px !important;
        font-size: 14px !important;
        color: rgb(37, 35, 35) !important;
        box-shadow: none !important;
    }
    .bootstrap-select,
    .bootstrap-select .dropdown-toggle,
    .bootstrap-select .dropdown-menu {
        white-space: normal !important;
    }
    /* Reduce height/spacing of dropdown items */
    .bootstrap-select .dropdown-menu li a {
        margin: 0 !important;
        padding: 4px 10px !important;
        color: rgb(37, 35, 35) !important;
        font-weight: 500 !important;
    }
    .bootstrap-select .dropdown-menu li {
        margin: 0 !important;
    }
    .bootstrap-select .dropdown-menu li a span.text {
        margin: 0 !important;
        display: block;
        color: rgb(37, 35, 35) !important;
    }
    .bootstrap-select .dropdown-menu li a:hover {
        background: #c2bfbf !important;
        color: rgb(20, 20, 20) !important;
    }
    /* Form field and error handling */
    .form-group {
        position: relative !important;
        margin-bottom: 1.5rem !important;
    }
    .modal, .container, .form-group, .profile, .row, .col-lg-4 {
        overflow: visible !important;
    }
    /* Error message styling below fields */
    .form-group .help-block,
    .form-group .error-message,
    .form-group .error-container .text-danger { position: absolute; bottom: -18px;left: 0; font-size: 12px;color: #dc3545 !important;  margin: 0; padding: 2px 0; width: 100%; z-index: 10;
    }
    /* Ensure error messages don't interfere with layout */
    .form-group .help-block:empty,
    .form-group .error-message:empty { display: none;}
    /* Keep asterisks in labels normal */
    .form-group label .text-danger { position: static !important;font-size: inherit !important; margin: 0 !important;padding: 0 !important; }
    /* Custom validation error styling */
    .form-control.error,
    .bootstrap-select.error .dropdown-toggle {
        border-color: #dc3545 !important;
        box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
    }
    /* Label style */
    .form-group label { display: block; margin-bottom: 5px;  font-weight: 500; color: #333; }
    /* Responsive column margin */
    .modal-form .col-lg-4 {margin-bottom: 25px;}
    /* Ensure parent .form-group/.col has relative positioning */
    .form-group, .col-lg-4 {position: relative !important;  }
    /* Hide the search input scrollbar if it appears */
    .bootstrap-select .bs-searchbox input { overflow: hidden !important; }