/* Navidad en tu mesa: Creme, Waldgrün, Gold (Plakat). Admin teilt die Farben. */
:root {
  --bg: #faf4e4; --card: #fffdf7; --ink: #12281d; --text: #1c2b35; --muted: #5f6e67; --line: #e3dcc3;
  --green: #1f4a37; --green-dark: #12281d; --green-soft: #ece9d4; --green-pale: #f6f0dc; --gold: #b8863b;
  --red: #c53630; --red-soft: #fff0ef; --amber: #d79816; --amber-soft: #fff6df; --amber-ink: #79540d;
  --shadow: 0 10px 28px rgba(20, 48, 34, .06); --radius: 18px;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); }
body { font-size: 17px; line-height: 1.5; }
.wrap { max-width: 760px; margin: 0 auto; padding: 16px; }
.wide { max-width: 1100px; }
h1 { font-size: 1.9rem; letter-spacing: -.8px; margin: 8px 0; color: var(--ink); }
h2 { font-size: 1.3rem; letter-spacing: -.4px; margin: 24px 0 8px; color: var(--green-dark); }
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px; margin: 12px 0; }
.row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.grow { flex: 1 1 200px; }
.price { font-weight: 800; color: var(--green-dark); font-size: 1.15rem; }
.muted { color: var(--muted); font-size: .92rem; }
.err { color: var(--red); font-weight: 700; }
.chip { display: inline-block; padding: 3px 11px; border-radius: 999px; background: var(--amber-soft); color: var(--amber-ink); font-size: .85rem; font-weight: 800; }
.chip.ok { background: var(--green-soft); color: var(--green-dark); }
.chip.bad { background: var(--red-soft); color: var(--red); }
button, .btn { font: inherit; font-weight: 800; min-height: 48px; padding: 10px 20px; border-radius: 12px; border: 2px solid var(--green); background: var(--green); color: #fff; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
button:hover, .btn:hover { background: var(--green-dark); border-color: var(--green-dark); }
button.ghost, .btn.ghost { background: transparent; color: var(--green-dark); border-color: var(--line); }
button.ghost:hover, .btn.ghost:hover { background: var(--green-soft); border-color: var(--green); }
button.danger { background: var(--red-soft); border-color: #f0c2bf; color: var(--red); }
button.danger:hover { background: var(--red); color: #fff; border-color: var(--red); }
button:disabled { opacity: .5; cursor: not-allowed; }
button.pick { background: var(--card); color: var(--ink); border-color: var(--line); }
button.pick:hover { background: var(--green-pale); border-color: var(--green); }
button.pick[aria-pressed="true"] { background: var(--green); color: #fff; border-color: var(--green); }
label { display: block; font-weight: 700; margin: 12px 0 4px; color: var(--ink); }
input, select, textarea { font: inherit; width: 100%; min-height: 48px; padding: 10px 12px; border: 2px solid var(--line); border-radius: 12px; background: var(--card); color: var(--ink); }
input[type=checkbox], input[type=radio] { width: auto; min-height: 0; }
:focus-visible { outline: 3px solid var(--amber); outline-offset: 2px; }
table.mini { width: 100%; border-collapse: collapse; } table.mini td, table.mini th { padding: 5px 6px; text-align: left; border-bottom: 1px solid var(--line); }
details summary { cursor: pointer; color: var(--green-dark); font-weight: 700; }
.badge { background: var(--red); color: #fff; border-radius: 999px; padding: 0 8px; margin-left: 6px; font-size: .85rem; }
.tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 12px 0; }
.topbar { background: var(--green); color: var(--bg); padding: 14px 16px; }
.topbar h1 { color: var(--bg); margin: 0; font-size: 1.5rem; }
.topbar button.ghost { color: var(--bg); border-color: rgba(252, 248, 236, .5); }
.topbar button.ghost:hover { background: rgba(252, 248, 236, .15); }

/* ---------- Typeform: eine Frage pro Bildschirm ---------- */
.tf { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
.tf-bar { height: 6px; background: var(--green-soft); }
.tf-bar i { display: block; height: 100%; width: 0; background: var(--green); transition: width .3s ease; }
.tf-top { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; }
.tf-top img { height: 44px; width: auto; }
.tf-top .muted { font-weight: 700; }
.tf-main { flex: 1; width: 100%; max-width: 640px; margin: 0 auto; padding: 8px 16px 24px; display: flex; flex-direction: column; justify-content: center; }
.tf-step { animation: tfin .25s ease both; }
@keyframes tfin { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .tf-step { animation: none; } .tf-bar i { transition: none; } }
.tf-kicker { font-size: .78rem; font-weight: 900; letter-spacing: 1.3px; text-transform: uppercase; color: var(--green); }
.tf-q { font-size: 1.9rem; line-height: 1.15; letter-spacing: -.8px; margin: 6px 0 6px; color: var(--ink); }
.tf-help { color: var(--muted); margin: 0 0 18px; }
.tf-opts { display: grid; gap: 10px; }
.tf-opt { justify-content: flex-start; text-align: left; font-size: 1.1rem; padding: 14px 18px; min-height: 58px; border-radius: 14px; }
.tf-opt small { display: block; font-weight: 600; opacity: .8; font-size: .85rem; }
.tf-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 10px; }
.tf-input { font-size: 1.4rem; min-height: 60px; border-radius: 14px; }
.tf-nav { display: flex; gap: 10px; margin-top: 22px; align-items: center; }
.tf-nav .grow { flex: 1; }
.tf-hint { font-size: .85rem; color: var(--muted); }
.tf-hint kbd { background: var(--green-soft); border-radius: 6px; padding: 1px 6px; font: inherit; font-weight: 700; }
.tf-sum { background: var(--green-pale); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; }
.tf-sum .total { font-size: 1.4rem; font-weight: 900; }
.big { font-size: 2.4rem; font-weight: 900; color: var(--green-dark); letter-spacing: 1px; }
.tf-done { text-align: center; }
.tf-note { background: var(--amber-soft); border: 1px solid #efdfae; color: var(--amber-ink); border-radius: 14px; padding: 12px 14px; font-size: .92rem; }

@font-face { font-family: "Cinzel"; font-style: normal; font-weight: 400 600; font-display: swap; src: url(/fonts/cinzel.woff2) format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 500; font-display: swap; src: url(/fonts/cormorant-italic.woff2) format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500 700; font-display: swap; src: url(/fonts/cormorant.woff2) format("woff2"); }
/* ---------- Navidad: Plakat-Look für die Kundenseite (Muster „Rama navideña A“) ---------- */
.tf { --ink: #2d6a4f; --text: #2d6a4f; --green: #2d6a4f; --green-dark: #1f4a37; --muted: #4f7a66; --dw: 340px; --dx: left; --ds: auto 100%; position: relative; font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.15rem; color: var(--text); overflow-x: hidden; }
.tf::before, .tf::after { content: ""; position: fixed; top: 0; bottom: 0; width: var(--dw); background: url(/deco-rama.jpg) var(--dx) top / var(--ds) no-repeat; mix-blend-mode: multiply; pointer-events: none; z-index: 0; }
.tf::before { left: 0; }
.tf::after { right: 0; transform: scaleX(-1); }
.tf > * { position: relative; z-index: 1; }
.tf button, .tf .btn, .tf input { font-family: Inter, -apple-system, "Segoe UI", sans-serif; }
.tf-bar i { background: var(--gold); }
.tf-top { width: 100%; max-width: 640px; min-height: 48px; margin: 0 auto; justify-content: center; }
.tf-kicker { color: var(--green); letter-spacing: 3px; font-family: Inter, sans-serif; font-size: 1.05rem; text-align: center; margin-bottom: 10px; }
.tf-q { font-family: Cinzel, Georgia, serif; font-weight: 600; font-size: 1.7rem; letter-spacing: .5px; line-height: 1.2; }
.tf-help { font-size: 1.1rem; }
.tf-q, .tf-help { text-align: center; text-wrap: balance; }
.tf-help { color: var(--ink); font-weight: 600; }
.tf-help-big { font-size: 1.4rem; line-height: 1.3; }
.tf-count { display: block; width: fit-content; margin: 16px auto 4px; padding: 8px 22px; text-align: center; background: var(--card); border: 1px solid #e0cfa0; border-radius: 6px; font-family: Inter, sans-serif; font-size: 1.05rem; font-weight: 900; letter-spacing: 3px; text-transform: uppercase; color: var(--green); }
.tf-count.ok { background: var(--card); color: var(--green); border-color: var(--green); }
.tf-count.ok::before { content: "✓"; display: inline-block; margin-right: 12px; font-size: 1.3em; line-height: 1; color: #fff; background: #3f8f68; width: 1.5em; height: 1.5em; line-height: 1.5em; border-radius: 50%; letter-spacing: 0; vertical-align: middle; }
.tf .err:empty { display: none; }
.tf .err { display: block; width: fit-content; max-width: 100%; margin: 16px auto 4px; padding: 8px 22px; text-align: center; background: var(--red-soft); border: 1px solid var(--red); border-radius: 6px; font-family: Inter, sans-serif; font-size: 1.05rem; font-weight: 900; letter-spacing: 3px; text-transform: uppercase; color: var(--red); }
.tf-intro .tf-help, .tf-menu span { color: var(--ink); }
.tf-opt { font-family: "Cormorant Garamond", Georgia, serif; font-weight: 700; font-size: 1.25rem; border-radius: 6px; }
.tf-opt small { font-family: Inter, -apple-system, "Segoe UI", sans-serif; font-size: .82rem; font-weight: 800; opacity: .85; }
.tf .card { border-radius: 6px; border-color: #e0cfa0; box-shadow: none; }
.tf .card strong { font-family: Cinzel, Georgia, serif; font-size: 1.05rem; font-weight: 600; letter-spacing: .5px; }
.tf .price { font-size: 1.5rem; color: var(--ink); font-weight: 700; }
.tf .muted { font-size: 1.02rem; }
.tf button, .tf .btn { border-radius: 6px; letter-spacing: .6px; }
.tf button { border-color: var(--green); }
.tf button.pick[aria-pressed="true"] { background: var(--green); border-color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); }
.tf-main { padding-top: 8px; justify-content: flex-start; }
.tf-intro { font-family: Cinzel, Georgia, serif; }
.tf-logo { width: 210px; max-width: 100%; height: auto; margin: 0 auto; display: block; }
.tf-brand { display: inline-block; font-size: .72rem; letter-spacing: .34em; text-transform: uppercase; margin-top: 8px; padding-top: 6px; border-top: 1px solid var(--gold); }
.tf-script { display: block; width: 100%; max-width: 410px; height: auto; margin: 4px auto 0; }
.tf-title { text-transform: uppercase; letter-spacing: .09em; font-size: clamp(1.75rem, 7.4vw, 2.7rem); margin: -.15em 0 8px; }
.tf-intro .tf-help { font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.2rem; color: var(--ink); }
.tf-menu { list-style: none; padding: 0; margin: 12px auto 8px; border-top: 1px solid var(--gold); max-width: 420px; text-align: left; font-family: "Cormorant Garamond", Georgia, serif; }
.tf-menu li { display: flex; gap: 16px; align-items: baseline; padding: 6px 8px; border-bottom: 1px solid var(--gold); }
.tf-menu strong { width: 1ch; font-variant-numeric: lining-nums; font-size: 1.5rem; font-weight: 700; color: var(--gold); }
.tf-menu span { font-size: 1.2rem; font-weight: 600; letter-spacing: .3px; }
.tf-sub { font-size: 1.35rem; margin: 22px 0 10px; }
.tf-slots .tf-opt { justify-content: center; padding-left: 8px; padding-right: 8px; }
.tf-head { text-align: center; margin-bottom: 14px; }
.tf-bunuelos { text-align: center; margin: 18px 0 0; }
.tf-bunuelos strong { display: block; font-family: Cinzel, Georgia, serif; font-size: 1.2rem; letter-spacing: 3px; text-transform: uppercase; }
.tf-sum { border-radius: 6px; border-color: #e0cfa0; }
.big { color: var(--gold); }
@media (max-width: 1040px) {
  .tf { --dw: 150px; --ds: 150px auto; }
}
@media (max-width: 700px) {
  .tf-main { padding-left: 62px; padding-right: 62px; }
  .tf-logo { width: 190px; } .tf-brand { font-size: .55rem; letter-spacing: .2em; }
  .tf-intro .tf-help { font-size: 1rem; }
  .tf-menu li { gap: 9px; padding: 6px 0; } .tf-menu strong { font-size: 1.3rem; } .tf-menu span { font-size: 1rem; letter-spacing: 0; }
  .tf-main { padding-top: 84px; }
  .tf.inner .tf-main { padding-left: 20px; padding-right: 20px; }
  .tf.inner .tf-head { margin-left: 42px; margin-right: 42px; }
  .tf-q { font-size: 1.35rem; } .tf-q.tf-title { font-size: 1.75rem; }
  .tf-nav { flex-wrap: wrap; }
  .tf-hint { display: none; }
}

.tf-size { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px solid #e0cfa0; }
.tf-size .grow { flex: 1 1 auto; min-width: 0; }
.tf-size-p { display: block; font-family: Inter, -apple-system, "Segoe UI", sans-serif; font-size: 1rem; font-weight: 800; }
.tf-size .price { display: block; font-size: 1.25rem; }
.tf-size-sum { font-family: Inter, -apple-system, "Segoe UI", sans-serif; font-size: .78rem; font-weight: 700; color: var(--gold); margin-top: 2px; }
.tf-counter { flex-wrap: nowrap; gap: 6px; }
.tf-counter button { padding: 8px 12px; min-width: 44px; }
.tf-counter strong { min-width: 20px; text-align: center; }
.tf-dessert-sum { font-weight: 700; margin: 14px 0 6px; text-align: center; }
.card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.card-head .price { white-space: nowrap; }
.tf .muted.persons { font-family: Inter, -apple-system, "Segoe UI", sans-serif; font-size: 1.05rem; font-weight: 800; margin-top: 4px; }

/* Hinweise in Rot, mittig; Absatz ausgewogen */
.tf-note { text-align: center; text-wrap: balance; line-height: 1.45; margin: 18px auto; max-width: 30em; }
.tf .tf-note-red { background: var(--red-soft); border: 1px solid var(--red); color: var(--red); font-family: Inter, -apple-system, "Segoe UI", sans-serif; font-size: 1.05rem; font-weight: 800; padding: 14px 18px; }
/* Name und Apellido auf einer Seite */
.tf-field label { font-family: Inter, -apple-system, "Segoe UI", sans-serif; font-size: 1rem; font-weight: 800; color: var(--ink); margin: 14px 0 6px; }
/* Último paso und Pedido recibido: klare Schrift ohne Schnörkel, alles untereinander */
.tf-review, .tf-bizum { font-family: Inter, -apple-system, "Segoe UI", sans-serif; font-size: 1.05rem; line-height: 1.5; color: var(--green-dark); text-align: left; }
.rv-line { padding: 12px 0; border-bottom: 1px solid #e0cfa0; }
.rv-line:last-child { border-bottom: 0; }
.rv-label { display: block; font-size: .8rem; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; color: var(--muted); margin-bottom: 2px; }
.rv-value { font-weight: 600; }
.rv-value strong { font-family: inherit; font-size: inherit; font-weight: 800; letter-spacing: 0; }
.rv-total .rv-value { font-size: 1.4rem; font-weight: 800; }
.rv-pay .rv-value { font-size: 1.6rem; font-weight: 900; }
.tf-bizum { text-align: center; }
.tf-bizum p { margin: 0; font-weight: 600; }
.tf-bizum .bz-big { font-size: 1.7rem; font-weight: 900; letter-spacing: .5px; margin: 2px 0 14px; color: var(--green-dark); }
/* Bestätigungsseite: alles in Inter */
.tf-main.tf-done .tf-help, .tf-main.tf-done > p, .tf-main.tf-done .big { font-family: Inter, -apple-system, "Segoe UI", sans-serif; }
.tf-main.tf-done .tf-help { font-size: 1.05rem; font-weight: 700; margin-bottom: 4px; }
.tf-main.tf-done > p { font-size: 1.05rem; font-weight: 600; line-height: 1.5; color: var(--green-dark); }
.tf-main.tf-done .big { font-weight: 900; margin-bottom: 8px; }
.tf-main.tf-done > p.tf-note-red { color: var(--red); font-weight: 800; }

/* ---------- Panel de administración (primero para iPhone) ---------- */
body.adm-body { --green: #2d6a4f; --green-dark: #1f4a37; --bg: #d6eadd; --green-pale: #e6f2ea; --green-soft: #cfe3d6; background: var(--bg); }
.adm { max-width: 860px; margin: 0 auto; padding: 0 14px calc(40px + env(safe-area-inset-bottom)); }
.adm h1, .adm h2 { font-family: Cinzel, Georgia, serif; color: var(--green); }
.adm h2 { font-size: 1.15rem; letter-spacing: .04em; margin: 4px 0 8px; }
.adm .card { border-radius: 8px; border-color: #e0cfa0; box-shadow: none; padding: 14px; }
.adm label { font-size: .9rem; margin: 0 0 4px; }
.adm input, .adm select, .adm textarea { font-size: 16px; min-height: 48px; border-radius: 8px; border-color: #e0cfa0; }
.adm button, .adm .btn { border-radius: 8px; min-height: 48px; letter-spacing: .3px; font-size: 15px; }
.adm button.ghost, .adm .btn.ghost { border-color: #cdbd8a; color: var(--green); }
.adm-top { display: flex; align-items: center; gap: 12px; margin: 0 -14px 12px; padding: calc(10px + env(safe-area-inset-top)) 14px 10px; background: var(--bg); border-bottom: 2px solid var(--gold); position: sticky; top: 0; z-index: 4; }
.adm .adm-top .adm-home { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: flex-start; gap: 12px; background: none; border: 0; padding: 0; min-height: 0; text-align: left; color: inherit; font-weight: inherit; letter-spacing: normal; }
.adm-logo { height: 30px; width: auto; display: block; }
.adm-kicker { font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.adm-top h1 { margin: 0; font-size: 1rem; letter-spacing: .06em; text-transform: uppercase; line-height: 1.2; }
.adm-top button { min-height: 44px; padding: 6px 12px; }
.adm-login { max-width: 360px; margin: 60px auto; text-align: center; }
.adm-login .adm-logo { height: 64px; margin: 0 auto 12px; }
.adm-login form { text-align: left; }
.adm-flash { background: var(--green); color: #fff; border-radius: 8px; padding: 10px 14px; font-weight: 700; margin: 0 0 12px; }
.adm-alert { background: var(--red-soft); border: 1px solid var(--red); border-radius: 8px; padding: 10px 14px; margin: 0 0 12px; color: var(--red); }
.adm-field { margin: 0 0 12px; }
.adm-two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.adm-sub { font-family: Cinzel, Georgia, serif; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--green); margin: 14px 0 6px; font-size: .95rem; }
.adm-tabs { display: flex; gap: 4px; margin: 0 0 12px; }
.adm .adm-tabs button { flex: 1 1 auto; min-width: 0; padding: 6px 3px; white-space: nowrap; letter-spacing: 0; }
.adm-print { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.adm button.ghost, .adm .btn.ghost, .adm .adm-print .btn, .adm .adm-print button, .adm button.pick:not([aria-pressed="true"]) { background: #faf4e4; border-color: #e0cfa0; color: var(--green-dark); }
.adm button.ghost:hover, .adm .btn.ghost:hover, .adm .adm-print .btn:hover, .adm .adm-print button:hover, .adm button.pick:not([aria-pressed="true"]):hover { background: #f6f0dc; border-color: var(--green); }
.adm-print .btn, .adm-print button { flex: 1 1 auto; padding: 8px 12px; }
.adm-filter { display: flex; gap: 8px; overflow-x: auto; padding: 2px 0 10px; -webkit-overflow-scrolling: touch; }
.adm .adm-filter button { flex: 0 0 auto; padding: 6px 14px; }
.adm-order-head { display: flex; align-items: center; gap: 8px; }
.adm-order-head .grow { min-width: 0; overflow-wrap: anywhere; }
.adm-status { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; font-weight: 800; }
.adm-order-head .chip { flex: none; font-size: 1.05rem; padding: 6px 14px; border-radius: 8px; text-align: right; font-weight: 800; line-height: 1.3; }
.adm-order-head { padding: 6px 12px; min-height: 48px; border: 2px solid transparent; border-radius: 8px; color: #fff; }
.adm-order-head strong { color: #fff; }
.adm-order-head .chip { background: rgba(255, 255, 255, .22); color: #fff; }
.adm-order-head .chip.status { background: none; padding: 0; border-radius: 0; font-size: 1.05rem; text-align: right; line-height: 1.25; }
/* Colores de la barra (letra blanca, contraste mínimo 4,4:1) */
/* offen (sin pagar, anticipo) = gleiches Rosa wie der Button "Cancelar por falta de pago": Hintergrund, Rand und rote Schrift */
.adm-order-head.st-recibido, .adm-order-head.st-anticipo { background: var(--red-soft); border-color: #f0c2bf; color: var(--red); }
.adm-order-head.st-recibido strong, .adm-order-head.st-anticipo strong, .adm-order-head.st-recibido .chip, .adm-order-head.st-anticipo .chip { color: var(--red); }
.adm-order-head.st-pagado { background: #3a8760; }
.adm-order-head.st-preparado { background: #2f6f8f; }
.adm-order-head.st-recogido { background: #1f4a37; }
.adm-order-head.st-cancelado { background: #6b6f6c; }
.adm-when { margin: 6px 0 10px; font-weight: 800; font-size: 1rem; color: var(--ink); display: flex; gap: 14px; flex-wrap: wrap; align-items: baseline; }
.adm-when a { font-weight: 600; font-size: 1rem; color: var(--ink); text-decoration: none; }
.adm-line { border-top: 1px solid #e8dcb4; padding: 8px 0; }
.adm-light { font-weight: 400; white-space: nowrap; }
.adm-line-head { display: flex; justify-content: space-between; gap: 10px; }
.adm-portion { font-size: 1rem; color: var(--text); margin-top: 2px; }
.adm-portion span { font-weight: 800; color: var(--green); }
.adm-note { background: var(--amber-soft); border-radius: 8px; padding: 8px 12px; margin: 8px 0; }
.adm-total { border-top: 1px solid #e8dcb4; padding-top: 8px; margin: 4px 0 10px; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
/* Una sola letra en toda la tarjeta: la jerarquía la da solo el negrita */
.adm-order, .adm-order .muted, .adm-order .price, .adm-order .adm-note, .adm-order .adm-total { font-size: 1rem; }
.adm-total .price { white-space: nowrap; }
.adm-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.adm-actions > * { flex: 1 1 140px; white-space: nowrap; padding-left: 10px; padding-right: 10px; }
.adm .adm-wa button.wa-sent { background: #d4efdc; border-color: var(--green); color: var(--green-dark); }
.adm .adm-wa button.wa-sent:hover { background: #c3e8cf; }
.adm-wa-logo { display: inline-flex; align-items: center; padding: 0 4px; }
.adm-wa { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 4px; }
.adm-wa button { padding: 6px 12px; }
.adm-form { border-top: 2px solid var(--gold); margin-top: 12px; padding-top: 12px; }
.adm-opt { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-top: 1px solid #e8dcb4; }
.adm-step { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.adm-step button { min-width: 48px; padding: 6px; font-size: 1.3rem; }
.adm-step strong { min-width: 28px; text-align: center; font-size: 1.1rem; }
.adm-count { display: block; width: fit-content; margin: 10px auto 4px; padding: 6px 18px; text-align: center; background: var(--card); border: 1px solid #e0cfa0; border-radius: 6px; font: 900 .85rem Inter, sans-serif; letter-spacing: 2.5px; text-transform: uppercase; color: var(--muted); }
.adm-count.ok { color: var(--green); border-color: var(--green); }
.adm-count.ok::before { content: "✓"; display: inline-block; margin-right: 10px; width: 1.5em; height: 1.5em; line-height: 1.5em; border-radius: 50%; background: #3f8f68; color: #fff; letter-spacing: 0; }
.adm-group { margin: 0 0 12px; }
.adm-group > summary { cursor: pointer; font-family: Cinzel, Georgia, serif; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--green); font-size: 1.05rem; padding: 12px 14px; background: var(--card); border: 1px solid #e0cfa0; border-radius: 8px; margin-bottom: 8px; min-height: 48px; }
.adm-switch { display: flex; align-items: center; gap: 10px; min-height: 44px; margin: 0 0 8px; font-weight: 700; }
.adm-switch input { width: 24px; height: 24px; min-height: 0; accent-color: var(--green); }
@media (min-width: 900px) {
  .adm-actions > * { flex: 0 1 auto; }
}

.adm-cancel { width: 100%; margin-top: 10px; }