/* Panel de prueba de los restaurantes de ejemplo */
@font-face{font-family:Inter;src:url(../fonts/inter-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url(../fonts/inter-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Inter;src:url(../fonts/inter-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Fraunces;src:url(../fonts/fraunces-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}

:root{--bg:#f4f1ec;--side:#16120f;--ink:#1d1814;--muted:#6f655b;--line:#e4ddd2;--card:#fff;--accent:#e8661b;--ok:#2f8a4c;--warn:#c9861b;--bad:#b4402a}
.panel-villa{--accent:#b08a4a}
.panel-lola{--accent:#d8452b}
*{box-sizing:border-box;margin:0}
body{background:var(--bg);color:var(--ink);font:15px/1.55 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.p-banner{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;justify-content:center;padding:10px 16px;background:#fff3d6;color:#5b4210;font-size:.86rem;text-align:center;border-bottom:1px solid #f0dca8}
.p-banner-links{display:inline-flex;gap:12px;align-items:center}
.p-banner a{text-decoration:underline;font-weight:600}
.p-banner form{display:inline}
.p-banner button{background:none;border:1px solid #c9a24a;border-radius:99px;padding:3px 12px;cursor:pointer;color:inherit}

.p-shell{display:grid;grid-template-columns:250px 1fr;min-height:calc(100vh - 42px)}
.p-side{background:var(--side);color:#efe8de;padding:24px 16px;display:flex;flex-direction:column;gap:26px;position:sticky;top:0;height:100vh}
.p-brand{display:flex;gap:12px;align-items:center;padding:0 8px}
.p-avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--accent);color:#fff;font:400 1.3rem Fraunces,serif}
.p-brand small{display:block;color:rgba(239,232,222,.55);font-size:.78rem}
.p-side nav{display:grid;gap:4px}
.p-side nav a{display:flex;gap:12px;align-items:center;padding:11px 12px;border-radius:12px;color:rgba(239,232,222,.75);font-weight:500;transition:background .2s}
.p-nav svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.p-side nav a:hover{background:rgba(255,255,255,.06)}
.p-side nav a.on{background:rgba(255,255,255,.1);color:#fff}
.p-made{margin-top:auto;font-size:.78rem;color:rgba(239,232,222,.5);padding:0 8px}
.p-made b{color:#f0a160}

.p-main{padding:clamp(20px,3.5vw,44px);max-width:1180px;width:100%}
.p-head{margin-bottom:26px}
.p-head.row{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.p-head h1{font:400 clamp(1.8rem,3vw,2.4rem)/1.1 Fraunces,serif;letter-spacing:-.02em}
.p-head p{color:var(--muted);margin-top:6px}
.p-ok,.p-error{padding:12px 16px;border-radius:12px;margin-bottom:18px;font-weight:500}
.p-ok{background:#e3f3e7;color:#1f5c34}
.p-ok a{text-decoration:underline}
.p-error{background:#fbe4dd;color:#7d2a12}

.p-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:12px;background:var(--ink);color:#fff;font-weight:600;border:1px solid var(--ink);cursor:pointer}
.p-btn.ghost{background:#fff;color:var(--ink);border-color:var(--line)}
.p-link{color:var(--accent);font-weight:600;font-size:.88rem}

.p-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.p-stats article{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px}
.p-stats small{color:var(--muted);font-size:.8rem}
.p-stats b{display:block;font:400 2.2rem/1.1 Fraunces,serif;margin:6px 0 4px}
.p-stats span{font-size:.82rem;color:var(--muted)}
.status.on{color:var(--ok)}
.status.off{color:var(--bad)}

.p-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;align-items:start}
.p-card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:20px 22px;margin-bottom:16px}
.p-card>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.p-card>header h2{font:400 1.3rem Fraunces,serif}
.p-card>header a,.p-card>header span{font-size:.85rem;color:var(--muted)}
.p-card>header a{color:var(--accent);font-weight:600}
.p-row{display:grid;grid-template-columns:60px 1fr auto;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--line)}
.p-row span{color:var(--muted);font-size:.92rem}
.p-empty{color:var(--muted);padding:12px 0}
.st-confirmada{color:var(--ok);font-style:normal;font-weight:600;font-size:.82rem}
.st-pendiente{color:var(--warn);font-style:normal;font-weight:600;font-size:.82rem}
.st-cancelada{color:var(--bad);font-style:normal;font-weight:600;font-size:.82rem}
.p-shortcuts{display:grid;gap:8px}
.p-shortcuts a{padding:13px 14px;border-radius:12px;background:var(--bg);font-weight:500}
.p-shortcuts a:hover{background:#ebe5db}

.p-dish{display:grid;grid-template-columns:1fr auto auto auto auto;gap:14px;align-items:center;padding:13px 0;border-top:1px solid var(--line);scroll-margin-top:20px}
.p-dish-main b{display:block}
.p-dish-main small{display:block;color:var(--muted);font-size:.84rem}
.p-all{color:#9a7f63!important}
.p-dish.sold .p-dish-main{opacity:.5}
.p-price{font-weight:600;white-space:nowrap}
.p-switch{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px 0 6px;border-radius:99px;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:.82rem;color:var(--bad);font-weight:600}
.p-switch span{width:34px;height:20px;border-radius:99px;background:#d8cfc2;position:relative;transition:background .2s}
.p-switch span::after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#fff;transition:left .2s}
.p-switch.on{color:var(--ok)}
.p-switch.on span{background:var(--ok)}
.p-switch.on span::after{left:17px}
.p-del{width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--muted);cursor:pointer}
.p-del:hover{color:var(--bad);border-color:var(--bad)}

.p-editor{border-color:var(--accent);box-shadow:0 20px 50px -30px rgba(0,0,0,.35)}
.p-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.p-fields .wide{grid-column:span 1}
.p-fields label,.p-block,.p-courses label{display:grid;gap:6px;font-size:.84rem;color:var(--muted);font-weight:500}
.p-block{margin-bottom:16px}
.p-block small{font-weight:400}
.p-main input:not([type=checkbox]),.p-main select,.p-main textarea{font:inherit;font-size:16px;color:var(--ink);background:#fbfaf7;border:1px solid var(--line);border-radius:10px;padding:11px 12px;width:100%}
.p-main textarea{resize:vertical}
.p-label{font-size:.84rem;color:var(--muted);font-weight:500;margin:6px 0 8px}
.p-checks{display:flex;flex-wrap:wrap;gap:8px 16px;margin-bottom:16px;font-size:.9rem}
.p-checks label{display:flex;gap:6px;align-items:center}
.p-checks input,.p-toggle input{width:18px;height:18px;accent-color:var(--accent)}
.p-toggle{display:flex;gap:10px;align-items:center;margin-bottom:16px;font-weight:500}
.p-courses{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}

.p-day{font:400 1.2rem Fraunces,serif;margin:18px 0 6px}
.p-day:first-child{margin-top:0}
.p-res{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;padding:13px 0;border-top:1px solid var(--line);scroll-margin-top:20px}
.p-res.mine{background:linear-gradient(90deg,rgba(232,102,27,.08),transparent);border-radius:10px;padding-left:8px}
.p-res small{display:block;color:var(--muted);font-size:.84rem}
.p-res em{color:var(--accent);font-style:normal;font-weight:600}
.p-time{font:400 1.3rem Fraunces,serif}
.p-status{display:flex;flex-wrap:wrap;gap:6px}
.st-btn{min-height:34px;padding:0 12px;border-radius:99px;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:.8rem;font-weight:600;color:var(--muted)}
.st-btn.on.st-confirmada{background:var(--ok);border-color:var(--ok);color:#fff}
.st-btn.on.st-pendiente{background:var(--warn);border-color:var(--warn);color:#fff}
.st-btn.on.st-cancelada{background:var(--bad);border-color:var(--bad);color:#fff}

.p-qr{text-align:center}
.p-qr svg{width:100%;max-width:280px;height:auto;margin:0 auto}
.p-qr p{font-size:.8rem;color:var(--muted);word-break:break-all;margin-top:10px}
.p-steps{padding-left:20px;margin-bottom:18px;color:var(--muted)}
.p-steps li{margin-bottom:8px}

@media (max-width:900px){
  .p-shell{grid-template-columns:minmax(0,1fr);min-height:0}
  .p-side{position:sticky;top:0;z-index:20;height:auto;flex-direction:row;align-items:center;gap:12px;padding:12px 16px}
  .p-made{display:none}
  .p-nav{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:30;display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:2px;padding:6px;background:rgba(22,18,15,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:20px;box-shadow:0 18px 40px -16px rgba(0,0,0,.6)}
  .p-nav a{flex-direction:column;justify-content:center;gap:4px!important;padding:8px 2px!important;border-radius:14px!important;font-size:.64rem;line-height:1.1;text-align:center;min-width:0}
  .p-nav a span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .p-nav a[data-short] span{display:none}
  .p-nav a[data-short]::after{content:attr(data-short)}
  .p-nav a.on{background:var(--accent)!important;color:#fff}
  .p-main{min-width:0;padding-bottom:110px}
  .p-stats{grid-template-columns:1fr 1fr}
  .p-grid,.p-courses{grid-template-columns:1fr}
  .p-banner{font-size:.8rem;padding:9px 12px;gap:6px 12px}
}
@media (min-width:621px) and (max-width:900px){.p-nav{left:calc(50% - 280px)!important;right:calc(50% - 280px)!important}}
@media (max-width:620px){
  .p-dish{grid-template-columns:1fr auto auto auto;row-gap:10px;gap:10px}
  .p-dish-main{grid-column:1/-1}
  .p-switch{padding:0 10px 0 5px}
  .p-fields{grid-template-columns:1fr}
  .p-res{grid-template-columns:54px 1fr}
  .p-status{grid-column:1/-1}
  .p-row{grid-template-columns:50px 1fr}
  .p-row em{grid-column:2}
}
