/* ====== HERO  ====== */
/* ====== Card apilada (media top + info bottom) ====== */
.hero-stack{ border-radius:1rem; box-shadow:0 4px 24px rgba(0,0,0,.10); overflow:hidden; background:#fff; }
.hero-stack .media-top img{ width:100%; aspect-ratio:16/9; object-fit:cover; display:block; background:#f2f4f7; }
.hero-stack .info-pane{ padding:.9rem 1rem 1rem; }
.hero-stack h1{ font-size:1.5rem; font-weight:700; margin:0 0 .25rem 0; color:#0f172a; }
.badge-open{ background:#16a34a; color:#fff; font-weight:700; border-radius:999px; padding:.2rem .55rem; font-size:.8rem; }
.badge-closed{ background:#64748b; color:#fff; font-weight:700; border-radius:999px; padding:.2rem .55rem; font-size:.8rem; }
.meta-line{ display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; color:#6b7280; font-size:.95rem; }
.meta-line .dot{ width:4px; height:4px; border-radius:50%; background:#cbd5e1 }
.addr{ color:#475569; margin-top:.2rem }
.actions-row{ display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.8rem }
.btn-cta{ border-radius:0.375rem; padding:.5rem .8rem; display:inline-flex; align-items:center; gap:.45rem; text-decoration: none;}
.btn-cta.primary{ background:#2563eb; color:#fff; border:1px solid #2563eb; }
.btn-cta.primary:hover{ filter:brightness(1.05) }
.btn-cta.map{ background:#0f172a; color:#fff; border:1px solid #0f172a; }
.btn-cta.success{ background:#16a34a; color:#fff; border:1px solid #16a34a; }
@media (max-width:576px){
  .actions-row{ gap:.4rem }
  .btn-cta{ flex:1 1 auto; justify-content:center; padding:.55rem .7rem }
}


  .meta{ color:#6b7280; font-size:.95rem }
  .sidebar-sticky{ position:sticky; top:1rem }
  .card-soft{ background:#fff; border-radius:1rem; box-shadow:0 2px 14px rgba(0,0,0,.08) }
  .hours-table td{ padding:.25rem .5rem }
  .hours-today{ background:#f8fafc; border-radius:.5rem }
  .star-input i{ font-size:1.4rem; cursor:pointer }
	
/* Tarjetas Cercanos */
.near-card{
  border-radius:1rem;
  box-shadow:0 2px 12px rgba(0,0,0,.06);
  overflow:hidden;
  transition:transform .15s ease;
  background:#fff;
}
.near-card:hover{ transform:translateY(-2px) }

.near-card .thumb{
  position:relative;
  border-radius:.75rem;
  overflow:hidden;
}
.near-card .thumb img{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  display:block;
}

/* Badge con estrellas + número */
/* Badge */
.near-card .stars-badge{
  position:absolute; top:.5rem; right:.5rem;
  display:flex; align-items:center; gap:.45rem;
  padding:.22rem .5rem; border-radius:999px;
  background:rgba(22,22,22,.70);
  -webkit-backdrop-filter:saturate(120%) blur(1.5px);
  backdrop-filter:saturate(120%) blur(1.5px);
}

/* 5 estrellas alineadas (dos capas, mismo ícono) */
.near-card .stars-badge .stars-5{ display:flex; align-items:center; }
.near-card .stars-badge .stars-5 .star{
  position:relative; display:inline-block;
  width:1.05em; height:1.05em;
}
.near-card .stars-badge .stars-5 .star + .star{ margin-left:2px; }

/* Todas las capas ocupan EXACTAMENTE el mismo cuadro */
.near-card .stars-badge .stars-5 .star i{
  position:absolute; inset:0; line-height:1; font-size:.98rem;
}

/* Fondo blanco uniforme */
.near-card .stars-badge .stars-5 .star .star-bg{
  color:#fff;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.25));
}

/* Capa dorada (llena por defecto) */
.near-card .stars-badge .stars-5 .star .star-gold{ color:#ffc107; }

/* Media: recortamos la dorada al 50% (izquierda) */
.near-card .stars-badge .stars-5 .star.half .star-gold{
  clip-path: inset(0 50% 0 0);
}

/* Vacía: ocultamos la dorada; fondo blanco hace la “vacía” */
.near-card .stars-badge .stars-5 .star.empty .star-gold{ opacity:0; }

/* número */
.near-card .stars-badge .rating-num{
  color:#fff; font-weight:600; font-size:.85rem; line-height:1;
  letter-spacing:.2px;
}
	
.near-card .meta{ font-size:.9rem; color:#6b7280 }
.star-input i{ font-size:1.4rem; cursor:pointer; color:#e5e7eb; }
.star-input .bi-star-fill{ color:#ffc107; }

/* Inputs con error */
#reviewForm .is-invalid { border-color:#dc3545 !important; box-shadow:0 0 0 .1rem rgba(220,53,69,.08); }
#reviewForm .invalid-feedback{ display:block; color:#dc3545; font-size:.85rem; margin-top:.15rem; }
#reviewForm .form-check .invalid-feedback{ margin-left:1.6rem; }

/* Estrellas como input, ahora con margen arriba para quedar debajo del título */
.star-input{
  display:inline-flex; align-items:center; gap:.25rem;
  /*border:1px solid #d1d5db;*/ border-radius:.5rem; background:#fff;
  padding:6px 8px; user-select:none; margin-top:.35rem;   /* <-- */
}
.star-input.is-invalid{ border:1px solid #dc3545 !important; box-shadow:0 0 0 .1rem rgba(220,53,69,.08); }

/* Inputs con error */
#reviewForm .is-invalid { border-color:#dc3545 !important; box-shadow:0 0 0 .1rem rgba(220,53,69,.08); }
#reviewForm .invalid-feedback{ display:block; color:#dc3545; font-size:.85rem; margin-top:.15rem; }

/* Checkbox con error: solo colorea el label, sin texto adicional */
.form-check-input.is-invalid + .form-check-label{ color:#dc3545; }

	.stars-5{display:inline-flex;gap:2px;vertical-align:middle}
.stars-5 .star{position:relative;width:1em;height:1em;display:inline-block}
.star .star-bg{opacity:.25}
.star .star-gold{position:absolute;inset:0;clip-path:inset(0 0 0 0)}
.star.empty .star-gold{display:none}
.star.half .star-gold{clip-path:inset(0 50% 0 0)} /* mitad izquierda */

	
	/* Sidebar */
.sidebar-sticky .card-soft .dropdown-menu{ width:100%; }
#btnFavGym.faved .bi-heart-fill{ color:#e11d48; }      /* rojo */
#btnFavGym.faved{ border-color:#e11d48; }

.video-card{border-radius:0.75rem;overflow:hidden;background:#000;box-shadow:0 4px 20px rgba(0,0,0,.08)}
.video-card .thumb{position:relative}
.video-card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;filter:brightness(.9)}
.video-card .play{position:absolute;inset:0;display:grid;place-items:center;border:0;background:transparent;color:#fff}
.video-card .play .chip{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;border-radius:.75rem;
  padding:.55rem .85rem;background:rgba(0,0,0,.42);backdrop-filter:saturate(120%) blur(2px)}
.video-card .play i{font-size:1.6rem}

.modal.video-modal .modal-content{background:#000;border:0;border-radius:1rem;overflow:hidden}
.modal.video-modal .modal-body{padding:0}

	/* Posiciona la X encima del video */
.video-modal .video-close{
  position:absolute;
  top:.5rem;
  right:.5rem;
  z-index: 5;
  opacity:.9;
}
.video-modal .video-close:hover{ opacity:1 }

/* Si tu Bootstrap no trae .btn-close-white, forzamos blanco */
.btn-close.btn-close-white{
  filter: invert(1) grayscale(100%) brightness(200%);
}
/* Asegura que el player llene el contenedor ratio */
.ratio > iframe,.ratio > video{width:100%;height:100%;display:block}

/* ====== Horarios – UI Pro ====== */
.hours-modern{ overflow:hidden }
.hours-head{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-bottom:.5rem;
}
.status-dot{ width:.55rem; height:.55rem; border-radius:50%; background:#94a3b8 }
.status-dot.on{ background:#16a34a; box-shadow:0 0 0 3px rgba(22,163,74,.12) }
.status-dot.off{ background:#9ca3af }
.today-chip{
  background:linear-gradient(180deg,#f8fafc,#eef2f7);
  border:1px solid #e5e7eb; border-radius:.9rem; padding:.45rem .7rem; min-width:220px;
  display:flex; align-items:center; gap:.55rem;
}
.today-chip .ico{ width:28px; height:28px; border-radius:.6rem; display:grid; place-items:center;
  background:#111827; color:#fff; font-size:.95rem; box-shadow:0 2px 10px rgba(0,0,0,.06);
}
.today-chip .txt{ line-height:1.15 }
.today-chip .txt .day{ font-weight:600; color:#0f172a }
.today-chip .txt .msg{ font-size:.85rem; color:#475569 }

.subline{
  display:flex; align-items:center; gap:.5rem; padding:.6rem .8rem; border-radius:.7rem;
  background:#f8fafc; border:1px dashed #e5e7eb; color:#334155;
}
.progress.progress-thin{ background:#eef2f7; border-radius:999px; overflow:hidden }
.progress-thin .progress-bar{ background:#16a34a }

.week-grid{ margin-top:.6rem }
.week-row{ display:flex; padding:.5rem .6rem; border-radius:.6rem }
.week-row + .week-row{ margin-top:.25rem }
.week-row .d{ width:34%; font-weight:600; color:#111827 }
.week-row .h{ flex:1; color:#475569 }
.week-row.today{ background:#f1f5f9; border:1px solid #e2e8f0 }
.week-row .closed{ color:#9aa3ad }
@media (max-width: 576px){
  .today-chip{ min-width:unset }
  .week-row .d{ width:40% }
}
/* ---- amenity-----*/
.amenity-chip{ display:inline-flex; align-items:center; gap:.4rem;
  background:#f1f5f9; color:#0f172a; border:1px solid #e2e8f0;
  border-radius:999px; padding:.28rem .6rem; margin:.25rem; font-size:.9rem;
}
.amenity-chip i{ font-size:1rem }

/* ===== Clases – chips azul claro, mobile-first ===== */
.classes-card{border-radius:1rem; box-shadow:0 2px 14px rgba(0,0,0,.06); background:#fff}

/* Grid para que NO se desborde en móvil */
.class-item{
  display:grid;
  grid-template-columns: 32px 1fr auto;   /* icon | texto | horario */
  gap:.6rem;
  align-items:center;
  padding:.55rem .7rem;
  border:1px solid #e5e7eb;
  border-radius:14px;
  background:#f1f5f9;                     /* celeste suave */
}
.class-item + .class-item{ margin-top:.5rem }

.class-ico{
  width:32px; height:32px; border-radius:999px;
  display:grid; place-items:center;
  color:#2563eb; background:#e7f0ff;
  font-size:1rem;
}

/* Texto principal */
.class-main{min-width:0}
.class-name{
  font-size:.9rem; font-weight:400;       /* sin negritas */
  color:#0f172a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* Nivel (opcional) */
.class-level{
  font-size:.8rem; font-weight:400;
  padding:.15rem .45rem; border-radius:999px;
  background:#f1effe;          /* lila/indigo muy suave */
  border:1px solid #e1dcff;    /* borde pastel */
  color:#4338ca;               /* indigo medio (buena legibilidad) */
  display:inline-block; margin-top:.2rem;
}

/* Horario: chip azul suave en texto oscuro */
.class-time{
  font-size:.8rem; font-weight:400; line-height:1.2;
  color:#0b2850; background:#e8f0ff; border:1px solid #d5dffc;
  border-radius:10px; padding:.28rem .5rem;
  display:inline-flex; align-items:center; gap:.35rem;
  max-width:100%; white-space:normal; word-break:break-word;
}
.class-time i{font-size:1rem;opacity:.95}

/* ===== Responsive ===== */
@media (max-width:576px){
  .class-item{
    grid-template-columns: 32px 1fr;      /* icon | texto */
    align-items:flex-start;
  }
  .class-time{
    grid-column: 1 / -1;                  /* horario ocupa toda la fila */
    margin-left: 32px;                    /* alinea con el texto */
  }
}
/* ---Planes ---*/
.price-grid .price-card{
  border:1px solid #e5e7eb; border-radius:1rem; padding:1rem; background:#fff;
  box-shadow:0 1px 8px rgba(0,0,0,.04); transition:transform .15s ease, box-shadow .15s ease;
  position:relative;
}
.price-grid .price-card:hover{ transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,.08) }
.price-grid .name{ font-weight:600; line-height:1.2 }
.price-grid .price-line{ display:flex; align-items:baseline; gap:.5rem; margin-top:.25rem }
.price-grid .price{ font-size:1.5rem; font-weight:700; letter-spacing:.2px }
.price-grid .per{ color:#64748b; font-size:.9rem }
.price-grid .notes{ color:#6b7280; font-size:.9rem }
.price-grid .btn{ border-radius:.7rem }
.price-grid .ribbon{
  position:absolute; top:.8rem; right:.8rem; background:#fef3c7; color:#92400e;
  font-weight:700; font-size:.75rem; padding:.2rem .5rem; border-radius:.5rem;
  border:1px solid #fde68a;
}
.price-grid .consult{
  background:#eef2ff; color:#3730a3; padding:.15rem .45rem; border-radius:.5rem; font-weight:700; font-size:.85rem;
}
/* --Detalles de contacto---*/
.contact-card .cta-grid{ display:flex; flex-wrap:wrap; gap:.5rem }
.contact-card .cta-grid .btn{ border-radius:.8rem }
.contact-card .info-list{ margin:0; padding:0; list-style:none }
.contact-card .info-item{
  display:flex; align-items:center; justify-content:space-between;
  gap:.75rem; padding:.6rem .75rem; border:1px solid #eef2f7; border-radius:.75rem;
  background:#fbfdff;
}
.contact-card .info-item + .info-item{ margin-top:.5rem }
.contact-card .info-left{ display:flex; align-items:center; gap:.6rem; overflow:hidden }
.contact-card .info-ico{
  width:36px; height:36px; border-radius:.6rem; display:grid; place-items:center; flex:0 0 36px;
  background:#111827; color:#fff; box-shadow:0 2px 10px rgba(0,0,0,.06)
}
.contact-card .info-text{ font-size:.95rem; color:#0f172a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.contact-card .info-sub{ font-size:.8rem; color:#6b7280 }
.contact-card .copy-btn{ border:none; background:#f1f5f9; color:#0f172a; border-radius:.6rem; padding:.35rem .55rem; font-size:.8rem }
.contact-card .copy-btn:hover{ background:#e5e7eb }


/*---- Opiniones ---*/
.reviews-card .kpi{ display:flex; align-items:center; gap:1rem }
.reviews-card .kpi .avg{ font-size:2.25rem; font-weight:800; line-height:1 }
.reviews-card .kpi .meta{ color:#6b7280; font-size:.9rem }
.reviews-card .dist-row{ display:flex; align-items:center; gap:.5rem }
.reviews-card .dist-row .label{ width:2.2rem; text-align:right; font-size:.85rem; color:#475569 }
.reviews-card .progress{ height:8px; background:#eef2f7 }
.reviews-card .progress-bar{ background:#f59e0b }

.reviews-card .toolbar .form-select {
  height: 36px;                 /* si quieres mantenerlo compacto */
 /* border-radius: .6rem;*/
  padding: .25rem .75rem;       /* tu padding… */
  padding-right: 2.25rem !important;   /* …pero restauramos el espacio del icono */
  background-position: right .65rem center !important;
  background-repeat: no-repeat; /* por si acaso */
  /*min-width: 160px; */            /* opcional: evita cortes */
  max-width: 155px;
}
.review-item{ display:flex; gap:.9rem; padding:1rem; border:1px solid #eef2f7; border-radius:1rem; background:#fff }
.review-item + .review-item{ margin-top:.75rem }
.review-avatar{
  width:42px; height:42px; border-radius:50%; flex:0 0 42px; display:grid; place-items:center;
  font-weight:700; color:#fff; background:#64748b
}
.review-head{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap }
.review-name{ font-weight:600 }
.review-date{ color:#6b7280; font-size:.85rem }
.review-body{ color:#0f172a; font-size:.95rem }
.review-more{ color:#2563eb; cursor:pointer; user-select:none }
.review-badge{ background:#f1f5f9; color:#475569; border-radius:999px; padding:.2rem .55rem; font-size:.75rem }
.load-more-wrap{ text-align:center }
.load-more-btn{ border-radius:.8rem }
	
/* Permite que la fila envuelva en varias líneas cuando no entra */
.reviews-card .toolbar{
  display:flex;
  align-items:center;
  gap:.5rem;
  /*flex-wrap: wrap;  */               /* <-- clave */
}

/* Estado normal (>=481px): puedes mantener tu min-width y nowrap */
.reviews-card .toolbar .btn-write{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  white-space: nowrap;
  /*min-width: 152px;*/
	max-width: 155px;
  padding: .36rem .8rem;
}

/* XS: que todo quepa y se apile sin overflow */
@media (max-width: 480px){
  .reviews-card .toolbar{ gap:.4rem; flex-wrap: wrap; }
  
  /* Que los hijos ocupen la fila completa y no impongan anchos mínimos */
  .reviews-card .toolbar > *{
    flex: 1 1 100%;
    min-width: 0;                 /* evita desbordes por min-width internos */
    width: 100%;
  }

  .reviews-card .toolbar .btn-write{
    white-space: normal;          /* permite partir el texto en 2 líneas si hace falta */
    min-width: 0;                 /* anula el min-width fijo */
    justify-content: center;      /* se ve centrado */
  }

  /* Si tienes un <select> en la toolbar, que no imponga ancho mínimo */
  .reviews-card .toolbar .form-select{
    min-width: 0;
  }
}

	.reviews-card .kpi .rating{ display:inline-flex; gap:2px; white-space:nowrap; }
/* Mantén todo en una fila en desktop */
.reviews-head{ display:flex; align-items:flex-start; justify-content:space-between; }

/* Móvil: KPI arriba, toolbar abajo a la derecha */
@media (max-width: 576px){
  .reviews-head{ 
    flex-direction: column; 
    align-items: stretch;
    gap:.5rem;
  }
  .reviews-card .toolbar{
    margin-top:.25rem;
    align-self: flex-end;        /* pega a la derecha */
    display:flex;
    gap:.4rem;
    justify-content:flex-end;    /* contenidos a la derecha */
    width:100%;
    flex-wrap:nowrap;            /* evita que se apilen entre sí */
  }
  .reviews-card .toolbar > *{
    flex:0 0 auto;               /* no estirar a 100% */
    width:auto;
    min-width:0;
  }
  .reviews-card .toolbar .btn-write{
    white-space:nowrap;          /* “Escribir opinión” en una línea */
  }
}

.flag-modal .form-control, .flag-modal .form-select { border-radius:.6rem }
/* Botón fantasma mini para "Reportar" */
.review-flag{
  background:transparent;
  border:0;
  padding:.125rem .25rem;
  margin-left:auto;                 /* empuja a la derecha en .review-head */
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  font-size:.8rem;
  line-height:1.1;
  color:#dc3545;                    /* rojo Bootstrap */
  text-decoration:none !important;  /* sin subrayado aun si fuese <a> */
  cursor:pointer;
}
.review-flag i{ font-size:.95rem; }
.review-flag:hover{ color:#b02a37; }
.review-flag:focus{
  outline:0;
  box-shadow:0 0 0 .15rem rgba(220,53,69,.25);
  border-radius:.375rem;
}

/* Estado reportado (verde, desactivado) */
.review-flag.reported,
.review-flag:disabled{
  color:#198754;                    /* verde Bootstrap */
  opacity:1;
  cursor:default;
  pointer-events:none;              /* no clickeable */
}
.review-flag.reported i{ font-size:1rem; }
.owner-reply{
  border-left:3px solid #16a34a;
  background:#f0fdf4;
  border-radius:.5rem;
}	 


