/* Integración demo Supabase, pantalla independiente y de solo lectura. */
.mesa-shared-intro { display:flex; align-items:start; justify-content:space-between; gap:16px; margin-bottom:16px; flex-wrap:wrap; }
.mesa-shared-intro h2 { margin:0 0 6px; font-size:19px; letter-spacing:-.4px; }
.mesa-shared-intro p { margin:0; max-width:780px; color:var(--muted); line-height:1.6; font-size:12px; }
.mesa-shared-label { display:inline-flex; align-items:center; gap:7px; padding:6px 10px; border:1px solid rgba(46,230,160,.25); background:var(--accent-soft); border-radius:99px; font-size:10px; color:var(--accent); font-weight:800; }
.mesa-shared-frame { border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--panel); }
.mesa-shared-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 18px; border-bottom:1px solid var(--line); }
.mesa-shared-heading strong { font-size:13px; }
.mesa-shared-heading small { color:var(--muted); font-size:11px; }
.mesa-shared-empty { padding:25px 18px; color:var(--muted); font-size:12px; line-height:1.7; }
.mesa-shared-list { display:grid; }
.mesa-shared-row { padding:17px 18px; display:grid; grid-template-columns: minmax(150px,1.2fr) minmax(160px,.9fr) 75px 110px; gap:12px; align-items:center; border-top:1px solid var(--line); }
.mesa-shared-row:first-child { border-top:0; }
.mesa-shared-row strong { display:block; margin-bottom:5px; font-size:13px; overflow-wrap:anywhere; }
.mesa-shared-row small { color:var(--muted); font-size:10px; }
.mesa-shared-status { display:inline-flex; width:fit-content; padding:5px 9px; border-radius:99px; background:rgba(255,255,255,.06); color:var(--text); font-size:10px; font-weight:700; }
.mesa-shared-status.is-confirmed { background:rgba(46,230,160,.11); color:var(--success); }
.mesa-shared-status.is-pending { background:rgba(243,201,105,.12); color:var(--warning); }
.mesa-shared-note { border-left:3px solid rgba(243,201,105,.75); background:rgba(243,201,105,.07); padding:12px 14px; margin-top:16px; font-size:11px; line-height:1.7; color:#dfd4b5; border-radius:0 10px 10px 0; }
@media(max-width:760px) {
 .mesa-shared-intro h2 {font-size:17px}
 .mesa-shared-row {grid-template-columns:minmax(0,1fr) auto; gap:10px}
 .mesa-shared-row .mesa-shared-date {grid-column:1}
 .mesa-shared-row .mesa-shared-party {grid-column:2;grid-row:1}
 .mesa-shared-row .mesa-shared-status {grid-column:2;grid-row:2}
}