/*!
 * Hello Rodolfo — DESIGN SYSTEM
 * Base ufficiale (dashboard cucina/cameriere = riferimento visivo).
 * Token colori/geometria/tipografia + pattern componenti riutilizzabili.
 */
:root{
  /* palette */
  --dh-ciano:#5BF5FF;
  --dh-ciano-soft:#B3F9FF;
  --dh-verde:#CBFF98;
  --dh-verde-soft:#E2FFC8;
  --dh-dash-bg:#CECECE;
  --dh-verde-scuro:#1a7a3d;
  --dh-text:#2d5a3d;
  --dh-muted:#6b7280;
  --dh-white:#ffffff;
  /* geometria */
  --dh-radius:14px;
  --dh-radius-lg:28px;
  --dh-gap:12px;
  --dh-shadow:0 2px 12px rgba(0,0,0,.10);
  /* tipografia / motion */
  --font:'New Atlas',Georgia,serif;
  --ease:cubic-bezier(.4,0,.2,1);
}

/* ===== PATTERN COMPONENTI (namespace .hr-) ===== */

/* superficie / sfondo pagina */
.hr-surface{background:var(--dh-dash-bg);font-family:var(--font);color:var(--dh-text);}

/* card bianca base */
.hr-card{background:var(--dh-white);border-radius:var(--dh-radius);padding:18px;border:0;box-shadow:var(--dh-shadow);}
.hr-card.is-confirmed{background:var(--dh-verde);}

/* titolo sezione + azione (titlerow) */
.hr-titlerow{display:flex;align-items:flex-end;justify-content:space-between;min-height:48px;margin:0 0 16px;}
.hr-title{font-family:var(--font);font-size:1.6rem;font-weight:500;color:var(--dh-text);margin:0;line-height:1;}

/* pulsante + (quadrato arrotondato) */
.hr-add{display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex:0 0 auto;border-radius:12px;background:var(--dh-white);border:0;color:var(--dh-text);font-size:1.8rem;line-height:1;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.08);}
.hr-add:hover{box-shadow:var(--dh-shadow);}

/* tab a pillole */
.hr-tabs{display:flex;gap:8px;justify-content:center;padding:6px;background:#BFBFBF;border-radius:var(--dh-radius);margin:0 0 18px;}
.hr-tab{flex:0 0 auto;background:transparent;color:var(--dh-text);border:0;border-radius:10px;padding:12px 22px;font-family:var(--font);font-size:1.05rem;font-weight:500;cursor:pointer;transition:background .2s var(--ease);}
.hr-tab.is-active{background:var(--dh-white);box-shadow:0 2px 6px rgba(0,0,0,.12);}

/* bottone azione pieno */
.hr-btn{display:inline-flex;align-items:center;justify-content:center;background:var(--dh-text);color:var(--dh-white);border:0;border-radius:12px;padding:12px 24px;font-family:var(--font);font-weight:500;font-size:1rem;cursor:pointer;transition:opacity .2s;}
.hr-btn:hover{opacity:.9;}
