.serviceRatingSummary { display: inline-flex; align-items: center; gap: 8px; width: fit-content; border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 18px; background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.68)); box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12); color: var(--wine-black); white-space: nowrap; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } .card { margin-top: 10px; padding: 5px 9px; box-shadow: none; } .row { padding: 5px 9px; box-shadow: none; } .serviceRatingStars :global(.MuiRating-iconFilled), .serviceRatingStars :global(.MuiRating-iconHover) { color: #f5b83b; filter: drop-shadow(0 1px 1px rgba(82, 43, 0, 0.26)); } .card .serviceRatingStars :global(.MuiRating-iconFilled), .card .serviceRatingStars :global(.MuiRating-iconHover), .row .serviceRatingStars :global(.MuiRating-iconFilled), .row .serviceRatingStars :global(.MuiRating-iconHover) { filter: none; } .serviceRatingText { display: flex; flex-direction: column; justify-content: center; gap: 1px; line-height: 1; } .serviceRatingText strong { font-size: 14px; font-weight: 800; letter-spacing: -0.02em; } .serviceRatingText span { color: rgba(35, 26, 31, 0.72); font-size: 10px; font-weight: 700; } .compact { gap: 4px; margin-top: 0; padding: 3px 7px 3px 6px; border: 1px solid rgba(255, 255, 255, 0.58); background: rgba(255, 255, 255, 0.68); box-shadow: none; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } .compact strong { font-size: 13px; font-weight: 800; letter-spacing: -0.02em; line-height: 1; } .compactStar { color: #f5b83b; font-size: 20px; line-height: 1; }