/* La Piazza moderner Tischplan · v=1782207986 */

:root {
  --lp-green: #06402f;
  --lp-green-dark: #043426;
  --lp-gold: #c89b4f;
  --lp-cream: #f7f1e6;
  --lp-card: #ffffff;
  --lp-text: #15231d;
  --lp-muted: #6f6253;
  --lp-green-soft: #e8f6ef;
  --lp-orange: #c96723;
  --lp-orange-soft: #fff1df;
  --lp-purple: #6a4bb3;
  --lp-purple-soft: #f0ebff;
}

body {
  background:
    radial-gradient(circle at top left, rgba(6, 64, 47, .14), transparent 34%),
    linear-gradient(135deg, #fffaf1 0%, #f2e8d8 100%) !important;
}

.main-content,
.dashboard-main,
.page-main {
  background: transparent !important;
}

#tablesGrid,
.tables-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 18px !important;
  align-items: stretch !important;
}

.table-card.modern-table-card {
  position: relative;
  overflow: hidden;
  min-height: 190px;
  padding: 22px 22px 18px !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .88) !important;
  border: 1px solid rgba(6, 64, 47, .10) !important;
  box-shadow: 0 18px 42px rgba(45, 26, 16, .08) !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.table-card.modern-table-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 50px rgba(45, 26, 16, .12) !important;
}

.table-card.modern-table-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(255,255,255,.65), transparent 60%);
}

.table-card.modern-table-card.free {
  background: linear-gradient(135deg, rgba(232,246,239,.86), rgba(255,255,255,.88)) !important;
  border-color: rgba(6, 64, 47, .16) !important;
}

.table-card.modern-table-card.busy {
  background: linear-gradient(135deg, rgba(255,248,232,.92), rgba(255,255,255,.9)) !important;
  border-color: rgba(200, 155, 79, .25) !important;
}

.table-card.modern-table-card.soon {
  background: linear-gradient(135deg, rgba(255,241,223,.94), rgba(255,255,255,.9)) !important;
  border-color: rgba(201, 103, 35, .32) !important;
}

.table-card.modern-table-card.group {
  background: linear-gradient(135deg, rgba(240,235,255,.94), rgba(255,255,255,.9)) !important;
  border-color: rgba(106, 75, 179, .28) !important;
}

.modern-table-head {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 18px;
}

.modern-table-left {
  display: flex;
  gap: 15px;
  align-items: center;
  min-width: 0;
}

.table-icon-bubble {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  font-size: 28px;
  background: rgba(6, 64, 47, .10);
  color: var(--lp-green);
  border: 1px solid rgba(6, 64, 47, .12);
}

.modern-table-card.busy .table-icon-bubble,
.modern-table-card.soon .table-icon-bubble {
  background: rgba(201, 103, 35, .11);
  color: var(--lp-orange);
  border-color: rgba(201, 103, 35, .16);
}

.modern-table-card.group .table-icon-bubble {
  background: rgba(106, 75, 179, .11);
  color: var(--lp-purple);
  border-color: rgba(106, 75, 179, .16);
}

.modern-table-number {
  font-size: 25px;
  font-weight: 900;
  color: var(--lp-text);
  line-height: 1.05;
}

.modern-table-meta {
  margin-top: 6px;
  color: var(--lp-muted);
  font-size: 15px;
  line-height: 1.3;
}

.modern-table-badge {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 8px 13px;
  font-weight: 900;
  font-size: 13px;
  line-height: 1;
  border: 1px solid transparent;
  white-space: nowrap;
}

.modern-table-badge.free {
  background: var(--lp-green-soft);
  color: var(--lp-green);
  border-color: rgba(6, 64, 47, .14);
}

.modern-table-badge.busy {
  background: #f7ead3;
  color: #94631e;
  border-color: rgba(148, 99, 30, .16);
}

.modern-table-badge.soon {
  background: var(--lp-orange-soft);
  color: var(--lp-orange);
  border-color: rgba(201, 103, 35, .18);
}

.modern-table-badge.group {
  background: var(--lp-purple-soft);
  color: var(--lp-purple);
  border-color: rgba(106, 75, 179, .18);
}

.modern-reservation-list {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 10px;
}

.modern-reservation-line {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: center;
  padding: 13px 14px;
  border-radius: 14px;
  background: rgba(255, 248, 232, .72);
  border: 1px solid rgba(200, 155, 79, .20);
}

.modern-reservation-line.free-line {
  background: rgba(232,246,239,.70);
  border-color: rgba(6, 64, 47, .16);
}

.modern-reservation-line.soon-line {
  background: rgba(255,241,223,.82);
  border-color: rgba(201, 103, 35, .22);
}

.modern-reservation-line.group-line {
  background: rgba(240,235,255,.82);
  border-color: rgba(106, 75, 179, .18);
}

.modern-line-icon {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 16px;
  background: rgba(255,255,255,.72);
}

.modern-line-time {
  display: inline-block;
  margin-right: 10px;
  font-weight: 900;
  font-size: 18px;
  color: var(--lp-text);
}

.modern-line-name {
  font-weight: 700;
  color: #4b4036;
}

.modern-line-sub {
  margin-top: 4px;
  font-size: 13px;
  color: var(--lp-muted);
}

.modern-more-lines {
  margin-top: 2px;
  font-size: 13px;
  color: var(--lp-muted);
  font-weight: 700;
}

@media (max-width: 760px) {
  #tablesGrid,
  .tables-grid {
    grid-template-columns: 1fr !important;
  }

  .table-card.modern-table-card {
    min-height: auto;
  }

  .modern-table-head {
    flex-direction: column;
  }

  .modern-table-badge {
    align-self: flex-start;
  }
}
