/* Zomeal theme: accent tokens + Zomeal-only rules (loaded after ../base.css) */
:root{
  --accent:#FAA61A;
  --accent-dark:#D98D0A;
  --accent-soft:#FFF4E0;
  --accent-pulse:rgba(250,166,26,.4);
  --on-accent:#1A1D23;   /* white on amber fails contrast */
  --accent-text:#B54708; /* amber text on light backgrounds */
  --csshr-accent:#4F46E5; /* CSS HR brand colour, for the cross-promo mark */
}

/* Logo images instead of the CSS HR text wordmark */
.brand{align-items:center;}
.brand-logo{height:26px; width:auto;}
.footer-logo{height:24px; width:auto;}

/* Laptop mockup (blank MacBook photo + live HTML overlay of the order dashboard) */
.laptop-mock{container-type:inline-size;}
.laptop-screen{
  position:absolute;
  z-index:1;
  left:10.7%;
  top:5.3%;
  width:79.8%;
  height:82.8%;
  padding:3.5% 3% 2%;
  overflow:hidden;
  /* 16px at the full 620px laptop width; everything inside is in em so the
     whole mock scales with the photo instead of overflowing it */
  font-size:2.58cqw;
}
.laptop-app-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:.875em;
}
.laptop-app-title{font-size:1em; font-weight:700;}
.laptop-app-badge{
  font-size:.66em;
  font-weight:700;
  color:var(--accent-text);
  background:var(--accent-soft);
  border-radius:999px;
  padding:.3em .95em;
}
.laptop-body{
  display:flex;
  gap:1em;
  align-items:flex-start;
}
.table-panel{
  flex:0 0 34%;
  min-width:0;
}
.table-panel-title{
  display:block;
  font-size:.66em;
  font-weight:700;
  color:var(--text-muted);
  text-transform:uppercase;
  letter-spacing:.04em;
  margin-bottom:.75em;
}
.table-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:.375em;
}
.table-card{
  aspect-ratio:1;
  border-radius:.5em;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.72em;
  font-weight:700;
  color:#fff;
}
.table-available{background:var(--success);}
.table-occupied{background:#D92D20;}
.table-reserved{background:#E2A03F; color:var(--text);}
.order-panel{flex:1; min-width:0;}
.order-row{
  padding:.5em .625em;
  border-radius:.5625em;
  background:var(--bg);
  margin-bottom:.4375em;
}
.order-row-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5em;
  margin-bottom:.1875em;
}
.order-row-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5em;
}
.order-table{font-size:.72em; font-weight:700; flex-shrink:0;}
.order-items{
  font-size:.6em;
  color:var(--text-muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  flex:1;
  min-width:0;
}
.order-total{font-size:.66em; font-weight:700; flex-shrink:0;}
.order-action{
  margin-top:.625em;
  width:100%;
  font-family:inherit;
  font-size:.6em;
  font-weight:700;
  color:var(--text);
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:999px;
  padding:.52em 1.15em;
}
.order-action-primary{
  color:var(--on-accent);
  background:var(--accent);
  border-color:var(--accent);
}
/* status tags inside the laptop scale with it too */
.laptop-screen .phone-tag{font-size:.5em; padding:.2em .6em;}

/* Phone overlay tweaks for the longer order labels */
.phone-stat-value{font-size:.78rem; white-space:nowrap;}
.phone-list-text{line-height:1.3;}
.phone-tag{white-space:nowrap;}

/* Cross-promo: CSS HR text wordmark */
.cross-promo-mark{
  flex-shrink:0;
  font-weight:800;
  font-size:1.4rem;
  letter-spacing:-.02em;
}
.cross-promo-mark-css{color:var(--csshr-accent);}
.cross-promo-mark-hr{color:var(--text);}