body{font-family:Arial, sans-serif;background:#f5f5f5}

.booking-rating{
display:flex;
gap:50px;
background:#fff;
padding:50px;
border-radius:20px;
box-shadow:0 10px 40px rgba(0,0,0,.08);
cursor:pointer;
max-width:900px;
margin:80px auto;
transition:.3s;
}

.booking-rating:hover{transform:scale(1.02)}

.rating-score{
font-size:64px;
font-weight:700;
color:#003580;
}

.rating-label{
background:#003580;
color:#fff;
padding:6px 12px;
border-radius:8px;
display:inline-block;
margin-top:10px;
}

.rating-bars{flex:1}

.bar-row{
display:flex;
align-items:center;
gap:10px;
margin:8px 0;
}

.bar{
flex:1;
height:10px;
background:#eee;
border-radius:10px;
overflow:hidden;
}

.bar-fill{
height:100%;
background:#0071c2;
transition:width 1s ease;
}

.modal{
display:none;
position:fixed;
inset:0;
background:rgba(0,0,0,.6);
}

.modal-box{
background:#fff;
width:90%;
max-width:1000px;
margin:4% auto;
padding:50px;
border-radius:20px;
max-height:85vh;
overflow:auto;
}

.review-item{
padding:25px 0;
border-bottom:1px solid #eee;
}

.review-widget {
    width: 160px;
    min-width: 160px;
    height: auto;                      /* altura automática según contenido */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #fff;
    border-radius: 14px;
    padding: 15px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
    font-family: Inter, sans-serif;
    font-size: clamp(10px, 1.2vw, 13px); /* fuente también se adapta */
    transition: .3s ease;
    cursor: pointer;
    flex-shrink: 0;
}

.review-widget:hover{
    transform: translateY(-5px);
    box-shadow: 0 12px 35px rgba(0,0,0,0.2);
}

.rw-score{
text-align:center;
margin-bottom:10px;
}

.rw-number{
font-size: clamp(18px, 2vw, 26px); /* número también se adapta */
font-weight:700;
color:#003580;
display:block;
}

.rw-stars span{
font-size: clamp(10px, 1.2vw, 14px);
color:#ddd;
}

.rw-stars .filled{
color:#febb02;
}

.rw-total{
font-size: clamp(9px, 1vw, 12px);
color:#666;
}

.rw-bars{
margin-top:8px;
}

.rw-bar-row{
display:flex;
align-items:center;
gap:6px;
margin:4px 0;
}

.rw-bar{
flex:1;
height:6px;
background:#eee;
border-radius:6px;
overflow:hidden;
}

.rw-fill{
height:100%;
background:#0071c2;
transition:width 1s ease;
}

/* En móvil ocupa todo el ancho */
@media (max-width: 768px) {
    .review-widget {
        width: 100%;
        font-size: 13px;
    }

    .rw-number {
        font-size: 26px;
    }

    .rw-stars span {
        font-size: 14px;
    }

    .rw-total {
        font-size: 12px;
    }
}