/* ================= CUEVA LIVE TABLES ================= */

.stats-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin-bottom:22px;
}

.stat-card{
  background:#fff;
  border:1px solid #ececec;
  border-radius:20px;
  padding:20px;
  display:flex;
  align-items:center;
  gap:16px;
  box-shadow:0 8px 24px rgba(0,0,0,.05);
}

.stat-card h3{
  margin:0;
  font-size:28px;
  color:#111827;
}

.stat-card p{
  margin:4px 0 0;
  color:#6b7280;
  font-weight:600;
}

.live-summary{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:20px;
}

.summary-pill{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:999px;
  padding:10px 18px;
  font-weight:700;
  color:#374151;
}

.live-toolbar{
  display:flex;
  justify-content:space-between;
  gap:15px;
  flex-wrap:wrap;
}

.live-toolbar input{
  flex:1;
  min-width:260px;
  padding:13px 16px;
  border:1px solid #e5e7eb;
  border-radius:14px;
  outline:none;
  font-weight:600;
}

.live-filters{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.filter-btn{
  border:none;
  background:#f3f4f6;
  padding:11px 18px;
  border-radius:14px;
  cursor:pointer;
  font-weight:700;
}

.filter-btn.active{
  background:#d4af37;
  color:#fff;
}

.live-status-indicator{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  font-weight:700;
  color:#166534;
}

.live-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#22c55e;
  animation:pulse 1.5s infinite;
}

@keyframes pulse{
  0%{opacity:1}
  50%{opacity:.35}
  100%{opacity:1}
}

.live-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(360px,1fr));
  gap:20px;
}

.live-table-card{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:22px;
  padding:22px;
  box-shadow:0 10px 28px rgba(0,0,0,.06);
}

.live-table-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:15px;
  margin-bottom:18px;
}

.live-table-top h3{
  margin:0;
  font-size:22px;
  font-weight:800;
  color:#111827;
}

.live-table-top small{
  color:#6b7280;
  font-weight:700;
}

.live-status{
  padding:8px 14px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}

.live-status.active{
  background:#d1fae5;
  color:#065f46;
}

.live-status.waiting{
  background:#fef3c7;
  color:#92400e;
}

.live-status.free{
  background:#dbeafe;
  color:#1e40af;
}

.live-status.ended{
  background:#fee2e2;
  color:#991b1b;
}

.live-detail-list{
  display:flex;
  flex-direction:column;
  gap:13px;
  margin-top:16px;
}

.live-detail-list div{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
}

.live-detail-list span{
  color:#6b7280;
  font-size:14px;
  font-weight:600;
}

.live-detail-list b{
  color:#111827;
  font-size:15px;
  font-weight:800;
  text-align:right;
}

.remaining-timer{
  margin-top:20px;
  padding:18px;
  border-radius:18px;
  text-align:center;
}

.remaining-timer strong{
  display:block;
  font-size:30px;
  font-weight:900;
  letter-spacing:.5px;
}

.remaining-timer span{
  font-size:13px;
  font-weight:700;
}

.remaining-timer.active{
  background:#ecfdf5;
  color:#065f46;
}

.remaining-timer.free{
  background:#eff6ff;
  color:#1e40af;
}

.remaining-timer.waiting{
  background:#fff7ed;
  color:#c2410c;
}

.remaining-timer.ended{
  background:#fef2f2;
  color:#b91c1c;
}

.live-warning{
  padding:14px;
  border-radius:16px;
  font-size:13px;
  line-height:1.7;
  margin-bottom:15px;
  font-weight:700;
}

.live-warning.booking{
  background:#fff7ed;
  color:#9a3412;
}

.live-warning.soon{
  background:#fef3c7;
  color:#92400e;
}

.live-warning.danger{
  background:#fee2e2;
  color:#991b1b;
}

.live-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:18px;
}

.live-actions .view-btn{
  grid-column:1;
}

.live-actions .warning-btn{
  grid-column:2;
}

.live-actions .checkout-btn{
  grid-column:1 / -1;
  width:100%;
}

.live-actions button{
  border:none;
  border-radius:14px;
  padding:14px;
  font-weight:800;
  cursor:pointer;
  transition:.2s ease;
}

.live-actions button:hover{
  transform:translateY(-1px);
  opacity:.92;
}

.start-btn{
  background:#d4af37;
  color:#fff;
}

.view-btn{
  background:#111827;
  color:#fff;
}

.checkout-btn{
  background:#16a34a;
  color:#fff;
}

.warning-btn{
  background:#f59e0b;
  color:#fff;
}

/* ================= MODALS ================= */

.modal{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.45);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
  padding:22px;
}

.modal.show{
  display:flex;
}

.modal-content{
  background:#fff;
  width:100%;
  max-width:540px;
  max-height:90vh;
  overflow-y:auto;
  border-radius:24px;
  padding:26px;
  box-shadow:0 24px 70px rgba(0,0,0,.22);
}

.large-modal{
  max-width:1100px;
}

.modal-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:18px;
}

.close-modal{
  border:none;
  background:#fee2e2;
  color:#991b1b;
  width:38px;
  height:38px;
  border-radius:50%;
  cursor:pointer;
}

.form-group{
  margin-bottom:16px;
}

.form-group label{
  display:block;
  font-weight:800;
  margin-bottom:8px;
  color:#374151;
}

.form-group input,
.form-group select,
.form-group textarea{
  width:100%;
  border:1px solid #e5e7eb;
  border-radius:14px;
  padding:13px 15px;
  outline:none;
  font-weight:600;
}

.session-info-box{
  background:#fffaf0;
  border:1px solid #f5d77a;
  border-radius:16px;
  padding:14px;
  margin-bottom:18px;
  display:flex;
  flex-direction:column;
  gap:5px;
}

.session-info{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:15px;
}

.session-info div{
  background:#f9fafb;
  padding:14px;
  border-radius:14px;
}

.session-info label{
  display:block;
  color:#6b7280;
  font-size:12px;
  margin-bottom:6px;
  font-weight:700;
}

.session-info strong{
  font-size:15px;
  color:#111827;
}

.session-summary{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:15px;
  margin-top:20px;
}

.summary-card{
  background:#fffaf0;
  border:1px solid #f5d77a;
  border-radius:16px;
  padding:16px;
  text-align:center;
}

.summary-card span{
  color:#6b7280;
  font-size:12px;
  font-weight:700;
}

.summary-card h3{
  margin:8px 0 0;
  color:#111827;
}

.notes-box{
  margin-top:20px;
  padding:15px;
  border-radius:16px;
  background:#f9fafb;
}

.session-actions{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:12px;
  margin-top:22px;
}

.session-actions button{
  padding:14px;
  border:none;
  border-radius:14px;
  font-weight:800;
  cursor:pointer;
  background:#f3f4f6;
}

.modal-actions{
  display:flex;
  justify-content:flex-end;
  gap:12px;
  margin-top:20px;
}

.modal-actions button{
  border:none;
  padding:12px 18px;
  border-radius:14px;
  font-weight:800;
  cursor:pointer;
}

.modal-actions button:last-child{
  background:#d4af37;
  color:#fff;
}

.success-btn{
  background:#16a34a!important;
  color:#fff!important;
}

.checkout-customer{
  text-align:center;
  margin-bottom:16px;
  font-size:18px;
  font-weight:900;
}

.checkout-summary{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-bottom:16px;
}

.checkout-summary div{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.checkout-total{
  border-top:1px solid #e5e7eb;
  padding-top:12px;
  font-weight:900;
}

.extension-preview,
.discount-preview{
  background:#f9fafb;
  border-radius:16px;
  padding:15px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.extension-preview div,
.discount-preview div{
  display:flex;
  justify-content:space-between;
}

.move-warning{
  margin-top:12px;
  background:#fff7ed;
  color:#9a3412;
  padding:13px;
  border-radius:14px;
  font-weight:700;
}

/* ================= RECENT SESSIONS ================= */

.table-wrapper{
  width:100%;
  overflow:auto;
}

.recent-sessions-scroll{
  max-height:420px;
  overflow:auto;
}

table{
  width:100%;
  border-collapse:collapse;
}

th,td{
  padding:15px;
  text-align:left;
  border-bottom:1px solid #e5e7eb;
}

th{
  color:#475569;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.empty-state{
  text-align:center;
  padding:55px 20px;
  color:#6b7280;
}

.empty-state i{
  font-size:42px;
  margin-bottom:12px;
  color:#d4af37;
}

/* ================= RESPONSIVE ================= */

@media(max-width:1200px){
  .stats-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .session-summary{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:700px){
  .stats-grid,
  .session-info,
  .session-summary{
    grid-template-columns:1fr;
  }

  .live-grid{
    grid-template-columns:1fr;
  }

  .live-actions{
    grid-template-columns:1fr;
  }

  .modal-content{
    max-width:100%;
  }
}

.next-booking-box{
  padding:14px;
  border-radius:16px;
  margin:14px 0;
  font-weight:700;
  font-size:13px;
}

.next-booking-box.next{
  background:#fff7ed;
  color:#9a3412;
}

/* ================= GLOBAL ALERTS ================= */

#globalBookingWarning{
  display:grid;
  gap:10px;
  margin-bottom:18px;
}

.global-warning-item{
  padding:14px 18px;
  border-radius:14px;
  font-size:14px;
  font-weight:700;
  line-height:1.5;
  border-left:5px solid transparent;
  box-shadow:0 2px 10px rgba(0,0,0,.06);
}

/* ⛔ Session Ended */

.global-warning-item.ended{
  background:#fef2f2;
  color:#991b1b;
  border-left-color:#dc2626;
}

/* 🔴 5 Min Remaining */

.global-warning-item.urgent{
  background:#fff1f2;
  color:#be123c;
  border-left-color:#e11d48;
  animation:pulseAlert 1.1s infinite;
}

/* 🟡 10 Min Remaining */

.global-warning-item.warning{
  background:#fffbeb;
  color:#92400e;
  border-left-color:#f59e0b;
}

/* 👤 Waiting Customer */

.global-warning-item.late{
  background:#eff6ff;
  color:#1d4ed8;
  border-left-color:#3b82f6;
}

/* 📅 Upcoming Booking */

.global-warning-item.next{
  background:#ecfdf5;
  color:#065f46;
  border-left-color:#10b981;
}

@keyframes pulseAlert{

  0%{
    transform:scale(1);
  }

  50%{
    transform:scale(1.01);
  }

  100%{
    transform:scale(1);
  }

}

.alert-call-btn{
  background:#16a34a;
  color:#fff;
  text-decoration:none;
  padding:10px 16px;
  border-radius:12px;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
  box-shadow:0 4px 12px rgba(22,163,74,.25);
  transition:.2s;
}

.alert-call-btn:hover{
  transform:translateY(-1px);
}

.alert-left{
  flex:1;
}

.global-warning-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}

.modal{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  justify-content:center;
  align-items:center;
  z-index:9999;
}

.modal.show{
  display:flex;
}

.remaining-timer.danger{
  background:#fff1f2;
  border:2px solid #be123c;
  color:#be123c;
}

.remaining-timer.danger strong{
  color:#be123c;
}

.remaining-timer.danger.blink{
  animation: urgentPulse 1s infinite;
}

@keyframes urgentPulse{
  0%{
    transform:scale(1);
    box-shadow:0 0 0 rgba(190,18,60,0);
  }
  50%{
    transform:scale(1.03);
    box-shadow:0 0 25px rgba(190,18,60,.35);
  }
  100%{
    transform:scale(1);
    box-shadow:0 0 0 rgba(190,18,60,0);
  }
}

#liveTablesGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(320px,1fr));
  gap:20px;
  align-items:start;
}

/* Card */
.live-table-card{
  width:100%;
  min-height:340px;
}

/* Keep filtered single card same size */
#liveTablesGrid:has(.live-table-card:only-child){
  grid-template-columns:repeat(3,minmax(320px,1fr));
}

#liveTablesGrid .live-table-card:only-child{
  max-width:420px;
}


/* =========================================================
   CUEVA PRO — REVIEWS PRODUCTION MOBILE V1
   Production Reviews logic unchanged; presentation only.
========================================================= */

.reviews-page,
.review-page,
.reviews-wrapper{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}

/* Header */

.page-title,
.reviews-header{
  display:flex!important;
  justify-content:space-between!important;
  gap:10px!important;
  align-items:center!important;
  margin:0 0 8px!important;
}

.page-title h1,
.page-title h2,
.reviews-header h1,
.reviews-header h2{
  margin:0!important;
  overflow:hidden!important;
  font-size:22px!important;
  line-height:1.05!important;
  letter-spacing:-.045em!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

.page-title p,
.reviews-header p{
  margin:4px 0 0!important;
  color:#8e8e93!important;
  font-size:8px!important;
}

/* Summary */

.reviews-stats,
.review-stats,
.stats-grid,
.main-stats{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
  margin:8px 0!important;
}

.reviews-stats .stat-card,
.review-stats .stat-card,
.stats-grid .stat-card,
.main-stats .stat-card{
  min-width:0!important;
  min-height:92px!important;
  padding:10px!important;
  border:1px solid rgba(17,17,17,.055)!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 7px 20px rgba(0,0,0,.035)!important;
}

.reviews-stats .stat-card h3,
.review-stats .stat-card h3,
.stats-grid .stat-card h3,
.main-stats .stat-card h3,
.reviews-stats .stat-card strong,
.review-stats .stat-card strong,
.stats-grid .stat-card strong,
.main-stats .stat-card strong{
  display:block!important;
  margin-top:6px!important;
  overflow:hidden!important;
  font-size:20px!important;
  line-height:1!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

.reviews-stats .stat-card p,
.review-stats .stat-card p,
.stats-grid .stat-card p,
.main-stats .stat-card p{
  margin-top:4px!important;
  color:#8e8e93!important;
  font-size:7px!important;
}

/* Rating summary */

.rating-summary,
.reviews-rating-summary{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  gap:12px!important;
  align-items:center!important;
  margin:8px 0!important;
  padding:11px!important;
  border:1px solid rgba(17,17,17,.055)!important;
  border-radius:18px!important;
  background:#fff!important;
}

.rating-score,
.average-rating{
  display:grid!important;
  justify-items:center!important;
  align-content:center!important;
  min-width:74px!important;
}

.rating-score strong,
.average-rating strong{
  font-size:28px!important;
  line-height:1!important;
  letter-spacing:-.05em!important;
}

.rating-score small,
.average-rating small{
  margin-top:4px!important;
  color:#8e8e93!important;
  font-size:7px!important;
}

.rating-bars,
.review-rating-bars{
  display:grid!important;
  gap:5px!important;
  min-width:0!important;
}

.rating-bar-row,
.review-rating-row{
  display:grid!important;
  grid-template-columns:28px minmax(0,1fr) 30px!important;
  gap:6px!important;
  align-items:center!important;
  min-width:0!important;
  font-size:7px!important;
}

.rating-track{
  height:6px!important;
  overflow:hidden!important;
  border-radius:999px!important;
  background:#f0f0f2!important;
}

.rating-fill{
  height:100%!important;
  border-radius:999px!important;
  background:#d4a62a!important;
}

/* Filters */

.reviews-filters,
.review-filters,
.filter-card,
.filter-row{
  display:flex!important;
  gap:5px!important;
  width:100%!important;
  min-width:0!important;
  overflow-x:auto!important;
  margin:8px 0!important;
  padding:0 0 2px!important;
  scrollbar-width:none!important;
}

.reviews-filters::-webkit-scrollbar,
.review-filters::-webkit-scrollbar,
.filter-card::-webkit-scrollbar,
.filter-row::-webkit-scrollbar{
  display:none!important;
}

.reviews-filters button,
.review-filters button,
.filter-card button,
.filter-row button,
.reviews-filters select,
.review-filters select{
  flex:0 0 auto!important;
  min-height:38px!important;
  padding:0 10px!important;
  border:1px solid rgba(17,17,17,.06)!important;
  border-radius:11px!important;
  background:#fff!important;
  font-size:7px!important;
  font-weight:800!important;
}

.reviews-filters button.active,
.review-filters button.active,
.filter-card button.active,
.filter-row button.active{
  background:#111!important;
  color:#fff!important;
}

/* Review list */

.reviews-list,
.review-list{
  display:grid!important;
  gap:7px!important;
  width:100%!important;
  min-width:0!important;
}

.review-card,
.reviews-card,
.review-item{
  min-width:0!important;
  padding:10px!important;
  border:1px solid rgba(17,17,17,.055)!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 7px 20px rgba(0,0,0,.03)!important;
}

.review-card header,
.reviews-card header,
.review-item header{
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) auto!important;
  gap:8px!important;
  align-items:center!important;
}

.review-avatar,
.review-card img,
.reviews-card img,
.review-item img{
  width:42px!important;
  height:42px!important;
  border-radius:13px!important;
  object-fit:cover!important;
}

.review-card h3,
.reviews-card h3,
.review-item h3{
  margin:0!important;
  overflow:hidden!important;
  font-size:10px!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

.review-card small,
.reviews-card small,
.review-item small{
  display:block!important;
  margin-top:3px!important;
  color:#8e8e93!important;
  font-size:7px!important;
}

.review-stars,
.stars,
.rating-stars{
  display:flex!important;
  gap:2px!important;
  flex:0 0 auto!important;
  color:#d4a62a!important;
  font-size:10px!important;
}

.review-card>p,
.reviews-card>p,
.review-item>p,
.review-comment{
  margin:8px 0 0!important;
  color:#3a3a3c!important;
  font-size:8px!important;
  line-height:1.5!important;
  white-space:normal!important;
}

/* Review metadata */

.review-meta,
.review-details{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
  margin-top:8px!important;
}

.review-meta>div,
.review-details>div{
  min-width:0!important;
  padding:8px!important;
  border-radius:12px!important;
  background:#f7f7f8!important;
}

.review-meta span,
.review-meta strong,
.review-details span,
.review-details strong{
  display:block!important;
}

.review-meta span,
.review-details span{
  color:#8e8e93!important;
  font-size:6px!important;
}

.review-meta strong,
.review-details strong{
  margin-top:4px!important;
  overflow:hidden!important;
  font-size:8px!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

/* Owner response */

.review-response,
.owner-response,
.reply-box{
  margin-top:8px!important;
  padding:9px!important;
  border-radius:13px!important;
  background:#f7f7f8!important;
}

.review-response span,
.owner-response span,
.reply-box span{
  color:#8e8e93!important;
  font-size:6px!important;
  font-weight:800!important;
}

.review-response p,
.owner-response p,
.reply-box p{
  margin:4px 0 0!important;
  color:#3a3a3c!important;
  font-size:8px!important;
  line-height:1.45!important;
}

/* Actions */

.review-actions,
.review-card-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
  margin-top:8px!important;
}

.review-actions button,
.review-card-actions button{
  min-width:0!important;
  min-height:40px!important;
  border-radius:11px!important;
  font-size:7px!important;
  font-weight:800!important;
}

/* Response modal -> bottom sheet */

.modal,
.review-modal,
#reviewModal,
#replyModal{
  z-index:7400!important;
}

.modal-content,
.review-modal-content,
#reviewModal .modal-content,
#replyModal .modal-content{
  width:100%!important;
  max-width:none!important;
  max-height:90dvh!important;
  overflow-y:auto!important;
  margin:0!important;
  padding:
    11px
    13px
    calc(18px + env(safe-area-inset-bottom))!important;
  border-radius:25px 25px 0 0!important;
  background:#f8f8fa!important;
}

.modal.open,
.review-modal.open,
#reviewModal:not(.hidden),
#replyModal:not(.hidden){
  display:flex!important;
  align-items:flex-end!important;
}

.modal textarea,
.review-modal textarea{
  width:100%!important;
  min-width:0!important;
  min-height:100px!important;
  padding:10px!important;
  border:1px solid rgba(17,17,17,.07)!important;
  border-radius:12px!important;
  background:#fff!important;
  font-size:9px!important;
  resize:vertical!important;
}

.modal-actions,
.review-modal-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:7px!important;
  margin-top:10px!important;
}

.modal-actions button,
.review-modal-actions button{
  min-height:46px!important;
  border-radius:13px!important;
  font-size:8px!important;
}

/* Empty state */

.reviews-empty,
.review-empty,
.empty-state{
  display:grid!important;
  justify-items:center!important;
  gap:7px!important;
  padding:28px 12px!important;
  border-radius:17px!important;
  background:#fff!important;
  color:#8e8e93!important;
  text-align:center!important;
}

/* Phone */

@media(max-width:430px){
  .reviews-stats,
  .review-stats,
  .stats-grid,
  .main-stats,
  .review-meta,
  .review-details{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .review-card header,
  .reviews-card header,
  .review-item header{
    grid-template-columns:40px minmax(0,1fr) auto!important;
  }

  .review-avatar,
  .review-card img,
  .reviews-card img,
  .review-item img{
    width:40px!important;
    height:40px!important;
  }
}

@media(max-width:350px){
  .rating-summary,
  .reviews-rating-summary{
    grid-template-columns:1fr!important;
  }

  .review-meta,
  .review-details,
  .review-actions,
  .review-card-actions,
  .modal-actions,
  .review-modal-actions{
    grid-template-columns:1fr!important;
  }
}
