:host,
html {
    h2 {
        color: #A70924;
    }
  /* Typography */
  --lumo-font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Brand colors (QUI mapperemo i tuoi colori) */
  --lumo-primary-color: #A70924;                 /* TODO dal tuo CSS */
  --lumo-primary-text-color: var(--lumo-primary-color);
  --lumo-primary-contrast-color: #fff;

  /* Surface / background */
  --lumo-base-color: #fff;                    /* TODO */
  --lumo-body-text-color: rgba(0,0,0,.87);    /* TODO */
  --lumo-secondary-text-color: rgba(0,0,0,.6);/* TODO */

  /* Borders / radius */
  --lumo-border-radius-m: 10px;               /* TODO */
  --lumo-contrast-10pct: rgba(0,0,0,.10);     /* TODO */

  /* Focus ring */
  --lumo-primary-color-50pct: color-mix(in srgb, var(--lumo-primary-color) 50%, transparent);
}

/* Layout helpers */
.bloom-page {
  padding: var(--lumo-space-l);
  max-width: 1200px;
  margin: 0 auto;
}

.customer-card {
  border: 1px solid var(--lumo-contrast-10pct);
  border-radius: var(--lumo-border-radius-l);
  padding: var(--lumo-space-m);
  background: var(--lumo-base-color);
  box-shadow: var(--lumo-box-shadow-xs);
}

.pill {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--lumo-contrast-10pct);
  background: var(--lumo-contrast-5pct);
  font-size: var(--lumo-font-size-s);
}

.auto-added {
  background: rgba(0,0,0,0.05) !important;
}
.section-header {
  font-weight: 700;
  background: rgba(0,0,0,0.04) !important;;
}

.readonly-price::part(input-field) {
    background-color: var(--lumo-contrast-5pct);
    color: var(--lumo-secondary-text-color);
}