*{box-sizing:border-box}body.to-table-picker{margin:0;min-height:100dvh;padding:28px 20px;background:radial-gradient(ellipse at top,#293e38,#101a17 80%);color:#f2ecdf;font:17px/1.5 system-ui,sans-serif}.to-table-picker main{width:min(100%,760px);margin:4vh auto}.to-table-picker .hero{padding:30px;border:1px solid #c7ac7855;border-radius:24px;background:#202c27;box-shadow:0 20px 70px #0003}.picker-logo{display:block;max-width:210px;max-height:95px;object-fit:contain;margin:0 auto 25px}.to-table-picker h1{font-size:30px;line-height:1.2;margin:8px 0 14px}.to-table-picker p{color:#c0cec5}.to-table-picker .eyebrow{color:#d1b781;letter-spacing:.1em;font-size:14px}.to-table-picker .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:16px;margin:24px 0}.to-table-picker .tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:155px;padding:25px 16px 20px;background:linear-gradient(145deg,#34473e,#26382f);border:1px solid #657d6b;border-radius:12px;box-shadow:0 8px 22px #0002;text-align:center;color:#f5f0e4;transition:transform .15s,border-color .15s;text-decoration:none;font:inherit;cursor:pointer}.to-table-picker .tile strong{font:600 36px/1.1 system-ui;margin:0}.to-table-picker .tile:not([aria-disabled]):not(:disabled):hover{transform:translateY(-2px);border-color:#c8b17e}.to-table-picker .table-status{position:absolute;right:13px;top:13px;display:inline-flex}.to-table-picker .table-status-dot{display:block;width:11px;height:11px;border-radius:50%;box-shadow:0 0 0 4px #ffffff09}.to-table-picker .tile[data-status=free] .table-status-dot{background:#66cf91}.to-table-picker .tile[data-status=occupied] .table-status-dot{background:#efac50}.to-table-picker .tile[data-status=cleaning] .table-status-dot{background:#ea7474}.to-table-picker .tile[aria-disabled],.to-table-picker .tile:disabled{background:#393e3b;opacity:.8;pointer-events:none;cursor:not-allowed}.to-table-picker [data-reservation-label]{font:400 13px/1.5 system-ui;color:#e8d6b5;max-width:210px}.to-table-picker [data-reservation-label]:empty{display:none}.to-table-picker small{color:#c0c8c2;font:400 12px/1.3 system-ui}.picker-legend{display:flex;justify-content:center;gap:17px;flex-wrap:wrap;font-size:12px;color:#b9c9bf}.picker-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px}.picker-legend .green{background:#66cf91}.picker-legend .orange{background:#efac50}.picker-legend .red{background:#ea7474}.picker-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.to-table-picker .tile:focus-visible{outline:3px solid #bce9d0;outline-offset:4px}.picker-error{padding:15px;border:1px solid #f0b4a4;background:#5d302b;border-radius:12px;color:#fff0ea!important}.picker-network{font-size:12px}.to-table-picker [hidden]{display:none!important}.to-table-picker a{color:#d1b781}@media(max-width:550px){body.to-table-picker{padding:20px 14px}.to-table-picker .hero{padding:24px}.to-table-picker .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.to-table-picker .tile{padding:25px 10px 20px}.to-table-picker h1{font-size:27px}}@media(prefers-reduced-motion:reduce){.to-table-picker .tile{transition:none}}
.to-table-picker .tile{padding-bottom:38px}.seat-icons{display:flex;justify-content:center;flex-wrap:wrap;gap:3px;color:#bfd0c4;opacity:.48;max-width:100%;margin-top:4px}.seat-icons svg{flex:none}.to-table-picker .tile>.seat-icons{margin-bottom:-22px}.seat-icons[aria-label="1 Plätze"]{gap:0}

.to-table-picker .tile>.seat-icons{position:absolute;left:12px;right:12px;bottom:12px;margin:0;max-width:none}.to-table-picker .tile[data-capacity]{padding-bottom:42px}

.to-table-picker .seat-icons{color:#e2dcc9;opacity:.92;gap:5px}.to-table-picker .seat-icons svg{width:21px;height:23px;filter:drop-shadow(0 1px 1px #0002)}.to-table-picker .tile[data-capacity]{padding-bottom:52px;min-height:170px}
/* Fixed table-number badge and clearer traffic-light indicator in both views. */
.to-table-picker .tile strong{position:absolute;left:14px;top:14px;width:50px;height:50px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#ded0ae,#b59c6c);border:1px solid #eee1c1;color:#26362d;box-shadow:0 3px 9px #0003,inset 0 1px 0 #fff7;font:600 25px/1 system-ui;font-variant-numeric:tabular-nums}
.to-table-picker .tile .table-status{right:16px;top:18px}.to-table-picker .table-status-dot{width:16px;height:16px;box-shadow:0 0 0 5px #ffffff09}
.to-table-picker .tile{padding-top:80px}.to-table-picker .tile [data-reservation-label]{margin-bottom:8px}

.to-table-picker .tile strong{background:linear-gradient(145deg,#ffffff,#e3e8e5);border-color:#ffffffb3;color:#243b32;box-shadow:0 3px 9px #0003,inset 0 1px 0 #fff}.to-table-picker [data-reservation-guest]{display:block}.to-table-picker [data-reservation-period]{display:block;font-size:16px;font-weight:700;line-height:1.4;margin-top:3px;color:#f8f2e4}.to-table-picker [data-reservation-period]:empty,.to-table-picker [data-reservation-guest]:empty{display:none}
/* Dark walnut tabletop: subtle grain and softly bevelled edges. */
.to-table-picker .tile{background-color:#302019;background-image:linear-gradient(145deg,#ffffff08,#00000024),repeating-linear-gradient(3deg,transparent 0,transparent 7px,#bb895410 8px,transparent 9px,transparent 18px,#09050422 19px,transparent 21px),repeating-linear-gradient(177deg,#33231c 0,#38271e 3px,#2e1e18 8px,#3d2b21 12px,#302018 19px,#35231b 27px);border-color:#74563c;box-shadow:inset 0 1px 1px #c89a6229,inset 0 -3px 6px #10080566,0 8px 22px #0003}
.to-table-picker .tile:not([aria-disabled]):not(:disabled):hover{border-color:#c49a63;box-shadow:inset 0 1px 1px #d2ac7540,inset 0 -3px 6px #10080566,0 10px 25px #0004}
/* Customer-supplied timber reference, shared by both table views. */
.to-table-picker .tile{background-color:#513a25;background-image:linear-gradient(145deg,rgba(25,16,9,.40),rgba(18,12,8,.57)),url('table-wood-reference.png');background-size:cover;background-position:center;border-color:#8c6b43;box-shadow:inset 0 1px 1px #e8c78b40,inset 0 -3px 7px #160c0766,0 8px 22px #0003}
.to-table-picker .tile strong{box-shadow:0 6px 12px rgba(0,0,0,.42),0 2px 3px rgba(0,0,0,.22),inset 0 1px 0 #fff}

.to-table-picker .tile{border:1px solid rgba(255,255,255,.85)}.to-table-picker .tile:not([aria-disabled]):not(:disabled):hover{border-color:#fff}

.to-table-picker .tile{padding-top:68px}.to-table-picker .tile[data-capacity]{min-height:150px}.to-table-picker .grid{gap:14px}

.to-table-picker .tile strong{font-size:var(--badge-font,25px);white-space:nowrap}

.to-table-picker .grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}.to-table-picker .tile{padding-top:64px}.to-table-picker .tile[data-capacity]{min-height:135px}.to-table-picker .tile strong{font-size:min(var(--badge-font,25px),21px)}@media(max-width:550px){.to-table-picker .grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.to-table-picker .grid{grid-auto-rows:var(--tile-height,200px)}.to-table-picker .tile,.to-table-picker .tile[data-capacity]{height:var(--tile-height,200px);min-height:var(--tile-height,200px);max-height:var(--tile-height,200px);padding-bottom:54px}.to-table-picker [data-reservation-label]{position:absolute;top:78px;left:10px;right:10px;margin:0!important;max-width:none}.to-table-picker [data-reservation-guest]{overflow-wrap:anywhere}

/* Premium table selection: timber, fine illuminated frame and raised porcelain badges. */
body.to-table-picker{background:radial-gradient(ellipse at 50% 0,#314b40 0,#172a23 40%,#0c1713 100%);background-attachment:fixed}
.to-table-picker .hero{background:linear-gradient(145deg,#25392fee,#15251ff5);border:1px solid #c6b58b44;box-shadow:0 24px 70px #0005,inset 0 1px 0 #ffffff0b;border-radius:28px}
.to-table-picker h1{letter-spacing:-.65px;text-wrap:balance}.to-table-picker .eyebrow{font-size:11px;letter-spacing:.18em;color:#c7b789}.picker-logo{filter:drop-shadow(0 6px 12px #0003)}
.to-table-picker .grid{gap:15px;padding-top:3px}
.to-table-picker .tile{isolation:isolate;overflow:visible;border-radius:18px;border:1px solid #f7efd6b3;background-image:linear-gradient(155deg,#fff4d713 0,#130a0640 52%,#10090588 100%),url('table-wood-reference.png');box-shadow:0 10px 20px #0005,0 2px 2px #0003,inset 0 1px 0 #fff7,inset 0 -5px 9px #150b0777;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.to-table-picker .tile::before{content:'';position:absolute;inset:6px;border:1px solid #fff2;border-radius:12px;pointer-events:none;box-shadow:inset 0 0 15px #0002;z-index:-1}
.to-table-picker .tile:not([aria-disabled]):not(:disabled):hover{transform:translateY(-4px);border-color:#fff8dc;box-shadow:0 16px 26px #0006,0 0 0 2px #c6aa6433,inset 0 1px 0 #fff8,inset 0 -5px 9px #150b0777}
.to-table-picker .tile:not([aria-disabled]):not(:disabled):active{transform:translateY(-1px) scale(.985)}
.to-table-picker .tile strong{left:13px;top:13px;border:1px solid #fff;background:linear-gradient(145deg,#fff 10%,#edf0e9 65%,#d9dfd5);box-shadow:0 6px 10px #0006,0 1px 2px #0005,inset 0 2px 0 #fff;color:#203d31;letter-spacing:-.4px}
.to-table-picker .table-status{top:17px;right:16px;padding:4px;background:#0a171780;border:1px solid #ffffff2b;border-radius:50%;box-shadow:0 2px 5px #0003}
.to-table-picker .table-status-dot{width:13px;height:13px;box-shadow:none}
.to-table-picker .tile[data-status=free] .table-status-dot{background:#71e6a0;box-shadow:0 0 9px #68e79a88,inset 0 1px 1px #ffffffa0}
.to-table-picker .tile[data-status=occupied] .table-status-dot{background:#ffc467;box-shadow:0 0 9px #ffba5488,inset 0 1px 1px #ffffffa0}
.to-table-picker .tile[data-status=cleaning] .table-status-dot{background:#ff8585;box-shadow:0 0 9px #ff797988,inset 0 1px 1px #ffffffa0}
.to-table-picker [data-reservation-label]{left:12px;right:12px;top:78px;text-shadow:0 1px 3px #0009}
.to-table-picker [data-reservation-guest]{font-size:12px;color:#fff6e7;line-height:1.3;margin-bottom:6px}
.to-table-picker [data-reservation-period]{display:block;font-size:14px;line-height:1.3;font-weight:700;color:#f9e7bd;border:1px solid #f8dfac44;background:linear-gradient(145deg,#16241de8,#11221ddd);border-radius:7px;padding:6px 2px;margin:0;white-space:nowrap;box-shadow:0 3px 8px #0003;font-variant-numeric:tabular-nums;letter-spacing:-.2px}
.to-table-picker [data-reservation-period]:empty{display:none}
.to-table-picker .seat-icons{opacity:1;color:#f0e9d4;gap:4px;filter:drop-shadow(0 2px 2px #0008)}
.to-table-picker .seat-icons::before{content:'';position:absolute;inset:-6px -4px;background:linear-gradient(180deg,#11241b36,#0b181452);border-top:1px solid #f6e8be29;border-radius:0 0 7px 7px;z-index:-1}
.to-table-picker .tile[aria-disabled],.to-table-picker .tile:disabled{background-image:linear-gradient(#101a17b8,#101a17c9),url('table-wood-reference.png');border-color:#b0b5aa66}
@keyframes tableReveal{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){.to-table-picker .tile{animation:tableReveal .35s ease both}.to-table-picker .tile:nth-child(2n){animation-delay:.035s}.to-table-picker .tile:nth-child(3n){animation-delay:.07s}}
@media(prefers-reduced-motion:reduce){.to-table-picker .tile{transition:none}}
/* Polished silver number plaques with reflected light and machined rim. */
.to-table-picker .tile strong{background:linear-gradient(135deg,#fff 0%,#e9edef 18%,#adb5ba 37%,#fdfefe 49%,#fff 53%,#c0c7cb 68%,#f2f5f6 87%,#a0a9af 100%);border:1px solid #f4f8fa;color:#1a302a;text-shadow:0 1px 0 #fff;box-shadow:0 6px 11px #0008,0 2px 3px #0007,inset 0 0 0 2px #ffffff73,inset 0 2px 2px #fff,inset 0 -3px 4px #5d6b7366}
.to-table-picker .tile strong::after{content:'';position:absolute;inset:3px;border:1px solid #ffffff8c;border-bottom-color:#66747c66;border-radius:50%;pointer-events:none}

.to-table-picker [data-cleaning-label]{position:absolute;top:71px;font-size:12px;color:#ffd2cc}

.cleaning-broom{display:none}

.cleaning-stop{display:none}.to-table-picker .tile strong{background:#f1f2ed!important;border:1px solid #d4d9d3!important;box-shadow:0 3px 7px #0005!important;text-shadow:none!important}.to-table-picker .tile strong::after,.to-table-picker .tile strong::before{display:none!important}.to-table-picker .seat-icons{align-items:center;flex-wrap:nowrap;gap:7px}.to-table-picker .seat-count{font:600 18px/1 system-ui}

.to-table-picker .table-status-dot{border:2px solid #fff!important}.to-table-picker .tile strong{border-color:#fff!important;box-shadow:0 5px 8px #0008,0 10px 18px #0006!important}

.to-table-picker .table-status-dot{width:19px;height:19px;box-sizing:border-box;box-shadow:0 0 6px #63db98,0 0 14px #63db9880!important}.to-table-picker .tile[data-status="occupied"] .table-status-dot{box-shadow:0 0 6px #ffbd58,0 0 14px #ffbd5880!important}.to-table-picker .tile[data-status="cleaning"] .table-status-dot{box-shadow:0 0 6px #ff717b,0 0 14px #ff717b80!important}

body.to-table-picker main > .hero {
  box-shadow:0 24px 58px #000b,0 6px 16px #0008,inset 0 1px 0 #ffffff0b;
  background:linear-gradient(145deg,#090c10a6,#090c10e6 76%),
    url("schiefer-oberlicht.webp") center top / cover #17191b;
}
body.to-table-picker .grid {--tile-height:138px;row-gap:34px;justify-items:center}
body.to-table-picker .grid > .tile {width:100%;max-width:156px;margin-block:8px}
body.to-table-picker .grid [data-reservation-label] {top:65px}
.table-chairs {
  position:absolute;
  inset:-16px 12px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  pointer-events:none;
}
.table-chairs > span {
  display:flex;
  justify-content:center;
  gap:4px;
}
.table-chairs > span:last-child {transform:rotate(180deg)}
.table-chairs i {
  display:block;
  width:25px;
  min-width:0;
  height:15px;
  border:1px solid #9b7650;
  border-top:3px solid #b78d62;
  border-radius:7px 7px 4px 4px;
  background:linear-gradient(#574538,#302520);
  box-shadow:0 2px 4px #0008,inset 0 1px 2px #dbc4a94d;
}
.to-table-picker .picker-title {margin:0 0 16px;text-align:center;color:#fff}

.to-table-picker .picker-empty-state {text-align:center;margin:20px auto 8px}
.to-table-picker .grid:empty {display:none}
.to-table-picker .picker-empty-state p {margin:0 0 18px}
.to-table-picker a.picker-login {
  display:inline-flex;align-items:center;justify-content:center;gap:14px;
  min-height:48px;padding:10px 20px;border:1px solid #e8c992;border-radius:10px;
  background:linear-gradient(155deg,#eed6a7,#ba9459);color:#261e14;
  font-weight:700;text-decoration:none;box-shadow:inset 0 1px #fff8,0 5px 14px #0006;
}
.to-table-picker a.picker-login:hover {filter:brightness(1.1)}
.to-table-picker a.picker-login:focus-visible {outline:2px solid #fff;outline-offset:4px}