/* Rozhraní produktu – průvodce instalací a administrace. Neutrální, nezávislé na šabloně obchodu.
   Barvy jen přes proměnné --ui-*; písmo Onest (assets/fonts); bez stínů a s malým zaoblením (docs/design-pravidla.md). Tmavý režim podle systému. */

:root {
  --ui-bg: #f3f2ee;
  --ui-panel: #ffffff;
  --ui-panel-2: #fafaf8;
  --ui-ink: #17171c;
  --ui-ink-2: #3a3a44;
  --ui-muted: #6c6c78;
  --ui-line: #e5e5df;
  --ui-line-2: #d6d6ce;
  /* barva akcentu = hlavní barva obchodu (--brand z ui_brand_style()), administrace tak působí „jako moje“ */
  --ui-accent: var(--brand, #c2410c);
  --ui-accent-ink: color-mix(in srgb, var(--brand, #c2410c) 78%, #000);
  --ui-accent-soft: color-mix(in srgb, var(--brand, #c2410c) 12%, #fff);
  --ui-on-accent: #ffffff;
  --ui-ok: #16834f;
  --ui-ok-soft: #e7f5ee;
  --ui-warn: #a15c07;
  --ui-warn-soft: #fdf3e2;
  --ui-err: #c2283c;
  --ui-err-soft: #fcebed;
  --ui-shadow: none;
  --ui-shadow-lg: 0 10px 40px rgb(20 20 30 / .14);
  --ui-r: 6px;
  --ui-r-sm: 4px;
  --ui-font: 'Onest', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ui-ease: cubic-bezier(.2, .7, .2, 1);
  color-scheme: light;
}

/* tmavý vzhled rozhraní jen podle přepínače v menu administrace (výchozí světlý – zadavatel 25. 10. 2026) */
:root[data-ui="dark"] {
    --ui-bg: #111115;
    --ui-panel: #1a1a20;
    --ui-panel-2: #16161b;
    --ui-ink: #f1f1f4;
    --ui-ink-2: #cfcfd8;
    --ui-muted: #9a9aa8;
    --ui-line: #2a2a33;
    --ui-line-2: #393944;
    --ui-accent: color-mix(in srgb, var(--brand, #f08a5d) 72%, #fff);
    --ui-accent-ink: color-mix(in srgb, var(--brand, #f08a5d) 55%, #fff);
    --ui-accent-soft: color-mix(in srgb, var(--brand, #f08a5d) 20%, #16161b);
    --ui-ok: #4cc38a;
    --ui-ok-soft: #13291f;
    --ui-warn: #f0b05a;
    --ui-warn-soft: #2d2313;
    --ui-err: #ff6b7f;
    --ui-err-soft: #331820;
    --ui-shadow: none;
    color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body.ui {
  margin: 0;
  font: 14.5px/1.5 var(--ui-font);
  color: var(--ui-ink);
  /* živé, ale klidné pozadí: jemný nádech barvy obchodu v rozích (bez fialových přechodů, bez skla) */
  background:
    radial-gradient(1200px 720px at 100% -12%, color-mix(in srgb, var(--ui-accent) 24%, transparent), transparent 64%),
    radial-gradient(1000px 680px at -10% 112%, color-mix(in srgb, var(--ui-accent) 14%, transparent), transparent 62%),
    var(--ui-bg);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
}
.ui a:not(.btn) { color: var(--ui-accent-ink); text-decoration: none; }
.ui a.btn { text-decoration: none; }
.ui a:not(.btn):hover { text-decoration: underline; }
.ui h1, .ui h2, .ui h3 { margin: 0 0 .4em; line-height: 1.2; letter-spacing: -.015em; }
.ui h1 { font-size: 26px; font-weight: 650; }
.ui h2 { font-size: 18px; font-weight: 620; }
.ui h3 { font-size: 15px; font-weight: 620; }
.ui p { margin: 0 0 .9em; }
.ui .muted { color: var(--ui-muted); }
.ui .small { font-size: 13px; }
.i { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- formuláře ---------- */
.field { display: grid; gap: 8px; margin-bottom: 18px; align-content: start; }
.field > label, .label { font-size: 13px; font-weight: 560; color: var(--ui-ink-2); }
.field .hint { font-size: 12.5px; color: var(--ui-muted); margin: 0; }
.field .err, .err-text { font-size: 12.5px; color: var(--ui-err); }
.row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 0 12px; }
.ui input:not([type]), .ui input[type=text], .ui input[type=email], .ui input[type=password], .ui input[type=number], .ui input[type=tel],
.ui input[type=url], .ui input[type=search], .ui input[type=date], .ui input[type=month], .ui select, .ui textarea {
  width: 100%;
  font: inherit;
  color: var(--ui-ink);
  background: var(--ui-panel);
  border: 1px solid var(--ui-line-2);
  border-radius: var(--ui-r-sm);
  padding: 8px 11px;
  min-height: 38px;
  transition: border-color .15s, box-shadow .15s;
}
.ui input[type=date], .ui input[type=month] { color-scheme: light dark; }
.ui textarea { min-height: 96px; resize: vertical; line-height: 1.5; }
.ui select { appearance: none; padding-right: 32px; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 17px) 55%, calc(100% - 12px) 55%; background-size: 5px 5px; background-repeat: no-repeat; }
.ui input:focus, .ui select:focus, .ui textarea:focus { outline: none; border-color: var(--ui-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-accent) 22%, transparent); }
.ui input[aria-invalid=true] { border-color: var(--ui-err); }
.ui :focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
.input-group { display: flex; gap: 8px; }
.input-group > input { flex: 1; min-width: 0; }

.check { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; font-size: 14px; }
.check + p, .check + .form-actions, .check + .btn { margin-top: 20px; } /* tlačítko pod zaškrtávátkem nesmí být přilepené */
.check input { margin: 3px 0 0; width: 16px; height: 16px; accent-color: var(--ui-accent); flex: none; }

/* přepínač zapnuto / vypnuto */
.switch { display: flex; align-items: center; justify-content: space-between; gap: 14px; cursor: pointer; }
.switch input { appearance: none; width: 40px; height: 23px; border-radius: var(--ui-r-sm); background: var(--ui-line-2); position: relative; cursor: pointer; transition: background .2s; flex: none; margin: 0; }
.switch input::after { content: ""; position: absolute; top: 3px; left: 3px; width: 17px; height: 17px; border-radius: 2px; background: #fff; box-shadow: 0 1px 3px rgb(0 0 0 / .25); transition: transform .2s var(--ui-ease); }
.switch input:checked { background: var(--ui-accent); }
.switch input:checked::after { transform: translateX(17px); }

/* segmentová volba (radio jako čipy) */
.seg { display: flex; flex-wrap: wrap; gap: 6px; }
.seg label { position: relative; }
.seg input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.seg span { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border: 1px solid var(--ui-line-2); border-radius: var(--ui-r-sm); font-size: 13px; background: var(--ui-panel); transition: .15s; }
.seg input:checked + span { border-color: var(--ui-accent); background: var(--ui-accent-soft); color: var(--ui-accent-ink); font-weight: 560; }
.seg input:focus-visible + span { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
/* výchozí volba šablony: malá tečka za popiskem; „Výchozí“ u popisku volbu vrátí */
.seg .is-def span::after { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; opacity: .45; flex: none; }
.reset-def { display: inline-flex; align-items: center; gap: 4px; margin-left: 10px; padding: 0; border: 0; background: none; color: var(--ui-muted);
  font: inherit; font-size: 12px; font-weight: 500; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; vertical-align: baseline; }
.reset-def:hover { color: var(--ui-ink); }
.reset-def .i { width: 13px; height: 13px; }
.reset-def[hidden] { display: none; }
.studio-defs { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 14px; margin: 0 0 18px; font-size: 12.5px; color: var(--ui-muted); }
.studio-defs .reset-all { margin-left: 0; }

.ui input[type=range] { width: 100%; accent-color: var(--ui-accent); }
.range-row { display: grid; grid-template-columns: 1fr 52px; gap: 12px; align-items: center; }
.range-row output { font-size: 13px; color: var(--ui-muted); text-align: right; font-variant-numeric: tabular-nums; }

/* barvy */
.color-input { display: flex; align-items: center; gap: 8px; border: 1px solid var(--ui-line-2); border-radius: var(--ui-r-sm); padding: 4px 8px 4px 4px; background: var(--ui-panel); }
.color-input input[type=color] { width: 30px; height: 30px; border: 0; padding: 0; background: none; border-radius: 6px; cursor: pointer; flex: none; }
.color-input input[type=color]::-webkit-color-swatch-wrapper { padding: 0; }
.color-input input[type=color]::-webkit-color-swatch { border: 1px solid rgb(0 0 0 / .12); border-radius: 6px; }
.color-input input[type=text] { border: 0 !important; box-shadow: none !important; padding: 4px 0; min-height: 0; font-family: ui-monospace, monospace; font-size: 13px; text-transform: lowercase; }
.color-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 12px; }
.color-grid .label { margin-bottom: 8px; display: block; }

.palettes { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 8px; }
.palette { border: 1px solid var(--ui-line-2); border-radius: var(--ui-r-sm); padding: 6px; background: var(--ui-panel); cursor: pointer; text-align: left; font: inherit; color: inherit; transition: .15s; }
.palette:hover { border-color: var(--ui-ink-2); }
.palette[aria-pressed=true] { border-color: var(--ui-accent); box-shadow: 0 0 0 2px var(--ui-accent-soft); }
.palette .sw { display: flex; height: 30px; border-radius: 4px; overflow: hidden; }
.palette .sw i { flex: 1; }
.palette .sw i:first-child { flex: 1.6; }
.palette small { display: block; font-size: 11.5px; margin-top: 5px; color: var(--ui-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- tlačítka ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font: inherit; font-weight: 560; font-size: 14px; line-height: 1;
  min-height: 38px; padding: 0 16px;
  border-radius: var(--ui-r-sm); border: 1px solid var(--ui-line-2);
  background: var(--ui-panel); color: var(--ui-ink);
  cursor: pointer; text-decoration: none !important; white-space: nowrap;
  transition: background .15s, border-color .15s, transform .1s, box-shadow .15s;
}
.btn:hover { border-color: var(--ui-ink-2); }

.btn .i { width: 18px; height: 18px; }
.btn-primary { background: var(--ui-ink); border-color: var(--ui-ink); color: var(--ui-panel); }
.btn-primary:hover { background: color-mix(in srgb, var(--ui-ink) 82%, var(--ui-panel)); border-color: color-mix(in srgb, var(--ui-ink) 82%, var(--ui-panel)); }
.btn-dark { background: var(--ui-ink); border-color: var(--ui-ink); color: var(--ui-panel); }
.btn-ghost { background: transparent; border-color: transparent; color: var(--ui-ink-2); }
.btn-ghost:hover { background: color-mix(in srgb, var(--ui-ink) 6%, transparent); border-color: transparent; }
.btn-danger { color: var(--ui-err); }
.btn-danger:hover { border-color: var(--ui-err); }
.btn-sm { min-height: 32px; padding: 0 11px; font-size: 13px; }
.btn-lg { min-height: 46px; padding: 0 22px; font-size: 15px; }
.btn-block { width: 100%; }
.btn[disabled], .btn.is-busy { opacity: .6; pointer-events: none; }
.btn.is-busy::after { content: ""; width: 14px; height: 14px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- karty, štítky, upozornění ---------- */
/* Bloky obsahu bez rámečků a podkladů („žádné chlívky“): blok začíná tenkou linkou nahoře, odděluje ho prostor.
   Nikdy dvě linky pod sebou ani vedle sebe bez obsahu mezi nimi – hlídá scripts/kontrola-linek.js. */
.card { background: none; border: 0; border-top: 1px solid var(--ui-line-2); border-radius: 0; box-shadow: none; }
.card-pad { padding: 18px 0 8px; }
.card + .card { margin-top: 36px; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 0 12px; border-bottom: 1px solid var(--ui-line); }
.card-head h2 { margin: 0; font-size: 15.5px; }
.badge { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: var(--ui-r-sm); font-size: 12px; font-weight: 560; background: color-mix(in srgb, var(--ui-ink) 7%, transparent); color: var(--ui-ink-2); white-space: nowrap; }
.badge-ok { background: var(--ui-ok-soft); color: var(--ui-ok); }
.badge-warn { background: var(--ui-warn-soft); color: var(--ui-warn); }
.badge-err { background: var(--ui-err-soft); color: var(--ui-err); }
.badge-accent { background: var(--ui-accent-soft); color: var(--ui-accent-ink); }
.notice { display: flex; gap: 10px; padding: 12px 14px; border-radius: var(--ui-r-sm); background: var(--ui-accent-soft); color: var(--ui-ink); font-size: 13.5px; margin-bottom: 16px; }
.notice .i { color: var(--ui-accent-ink); margin-top: 1px; }
.notice-ok { background: var(--ui-ok-soft); } .notice-ok .i { color: var(--ui-ok); }
.notice-warn { background: var(--ui-warn-soft); } .notice-warn .i { color: var(--ui-warn); }
.notice-err { background: var(--ui-err-soft); } .notice-err .i { color: var(--ui-err); }
.notice p:last-child { margin: 0; }

.toast { position: fixed; z-index: 100; left: 50%; bottom: 24px; transform: translate(-50%, 20px); opacity: 0; background: var(--ui-ink); color: var(--ui-panel); padding: 10px 16px; border-radius: var(--ui-r-sm); font-size: 13.5px; box-shadow: var(--ui-shadow-lg); transition: .25s var(--ui-ease); pointer-events: none; display: flex; gap: 8px; align-items: center; }
.toast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* ---------- průvodce instalací ---------- */
.wz { display: grid; grid-template-columns: minmax(420px, 480px) 1fr; height: 100vh; height: 100dvh; }
.wz-panel { min-width: 0; display: flex; flex-direction: column; background: var(--ui-panel); border-right: 1px solid var(--ui-line); min-height: 0; }
.wz-head { padding: 20px 28px 0; }
.wz-brand { display: flex; align-items: center; gap: 10px; font-weight: 620; font-size: 14px; }
@media (max-width: 480px) { .wz-brand { gap: 4px; } .wz-brand-label { display: none; } } /* telefon: Upravit na webu jen ikonou */
.wz-progress { display: flex; gap: 4px; margin: 20px 0 14px; }
.wz-progress a, .wz-progress span { flex: 1; height: 4px; border-radius: 9px; background: var(--ui-line); transition: background .3s; }
.wz-progress .done { background: var(--ui-accent); opacity: .45; }
.wz-progress .now { background: var(--ui-accent); }
.wz-step-meta { font-size: 12.5px; color: var(--ui-muted); font-weight: 520; letter-spacing: .02em; }
.wz-body { flex: 1; overflow-y: auto; padding: 8px 28px 28px; scrollbar-gutter: stable; }
.wz-body h1 { margin-top: 6px; }
.wz-lead { color: var(--ui-muted); font-size: 15px; margin-bottom: 22px; }
.wz-section { padding: 18px 0; border-top: 1px solid var(--ui-line); }
.wz-section:first-of-type { border-top: 0; padding-top: 4px; }
.ui .wz-section > h2 { font-size: 14.5px; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.wz-section > h2 .i { color: var(--ui-muted); width: 18px; height: 18px; }
/* výběr dopravy a plateb v průvodci: zaškrtávací seznam s cenou / poznámkou pod názvem */
.pick-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pick-list .check { align-items: flex-start; }
.pick-list .check span { display: grid; gap: 1px; }
.pick-list small { color: var(--ui-muted); font-size: 12.5px; line-height: 1.4; }
.wz-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 16px 28px; border-top: 1px solid var(--ui-line); background: var(--ui-panel); }
.wz-saved { font-size: 12.5px; color: var(--ui-muted); display: flex; align-items: center; gap: 6px; opacity: 0; transition: opacity .3s; }
.wz-saved.is-on { opacity: 1; }
.wz-saved .i { width: 16px; height: 16px; color: var(--ui-ok); }

.wz-preview { position: relative; display: flex; flex-direction: column; min-width: 0; background:
  radial-gradient(1200px 600px at 70% -10%, color-mix(in srgb, var(--ui-accent) 9%, transparent), transparent 70%), var(--ui-bg); }
.wz-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 22px; }
.wz-devices { display: inline-flex; background: var(--ui-panel); border: 1px solid var(--ui-line); border-radius: var(--ui-r-sm); padding: 3px; }
.wz-devices button { border: 0; background: transparent; color: var(--ui-muted); width: 38px; height: 30px; border-radius: var(--ui-r-sm); cursor: pointer; display: grid; place-items: center; }
.wz-devices button[aria-pressed=true] { background: var(--ui-ink); color: var(--ui-panel); }
.wz-preview .wz-edit-hint { display: flex; align-items: center; justify-content: flex-start; gap: 8px; margin: -4px 22px 12px; color: var(--ui-muted); font-size: 13px; text-align: left; }
/* lišta náhledu ve Studiu: dvě pevné strany, nic se podle šířky okna nepřesouvá na střed */
.studio-bar-side { display: flex; align-items: center; gap: 10px; min-width: 0; }
.studio-bar-end { margin-left: auto; gap: 8px; }
@media (max-width: 860px) {
  /* telefon: stav náhledu na vlastním řádku pod přepínačem, tlačítka zůstávají vpravo nahoře */
  .studio-bar { flex-wrap: wrap; row-gap: 10px; }
  .studio-bar-end { display: contents; }
  .studio-bar-end [data-replay] { margin-left: auto; }
  .studio-bar::after { content: ""; order: 9; flex-basis: 100%; } /* zalomení řádku před stavem náhledu */
  .studio-bar-end .badge { order: 10; }
  .wz-preview .wz-edit-hint { margin: 0 14px 10px; }
}
.wz-edit-hint .i { width: 16px; height: 16px; flex: none; }
.wz-stage { flex: 1; position: relative; min-height: 0; padding: 0 22px 22px; display: grid; place-items: center; }
.wz-frame { position: relative; background: var(--ui-panel); border-radius: 12px; box-shadow: var(--ui-shadow-lg); overflow: hidden; transform-origin: top left; }
.wz-frame::before { content: ""; display: block; height: 30px; background: var(--ui-panel-2); border-bottom: 1px solid var(--ui-line);
  background-image: radial-gradient(circle at 16px 15px, #ff5f57 5px, transparent 5.5px), radial-gradient(circle at 34px 15px, #febc2e 5px, transparent 5.5px), radial-gradient(circle at 52px 15px, #28c840 5px, transparent 5.5px); }
.wz-frame iframe { display: block; border: 0; background: #fff; }
.wz-frame.is-phone { border-radius: 34px; padding: 10px; background: #111; }
.wz-frame.is-phone::before { display: none; }
.wz-frame.is-phone iframe { border-radius: 26px; }
.wz-loading { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; opacity: 0; transition: opacity .2s; }
.wz-loading.is-on { opacity: 1; }
.wz-loading span { width: 28px; height: 28px; border: 3px solid var(--ui-accent); border-right-color: transparent; border-radius: 50%; animation: spin .7s linear infinite; }

.wz-mobile-toggle { display: none; }

/* volba oboru a šablony */
.choices { display: grid; grid-template-columns: 1fr; border-top: 1px solid var(--ui-line); }
/* výběr jako seznam oddělený linkami – žádné dlaždice s ikonou */
.choice { position: relative; display: grid; gap: 2px; padding: 13px 36px 13px 0; border: 0; border-bottom: 1px solid var(--ui-line); border-radius: 0; background: none; cursor: pointer; text-align: left; font: inherit; color: inherit; }
.choice strong { font-size: 15px; font-weight: 600; }
.choice small { color: var(--ui-muted); font-size: 13px; line-height: 1.4; }
.choice:hover strong { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.choice[aria-pressed=true] strong { color: var(--ui-accent-ink); }
.choice[aria-pressed=true]::after { content: ""; position: absolute; right: 4px; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); background: var(--ui-accent-ink); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat; }
.choice:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
/* obor s náhledem šablony, kterou nastaví (krok Název a obor) */
.choice.has-img { grid-template-columns: 104px minmax(0, 1fr); column-gap: 16px; align-content: center; }
.choice-img { grid-row: 1 / span 2; width: 104px; aspect-ratio: 16 / 10; object-fit: cover; object-position: top center; border-radius: var(--ui-r-sm); background: var(--ui-panel-2); }
.choice.has-img strong { align-self: end; }
.choice.has-img small { align-self: start; }
.choice[aria-pressed=true] .choice-img { outline: 2px solid var(--ui-accent-ink); outline-offset: 2px; }
@media (max-width: 560px) { .choice.has-img { grid-template-columns: 84px minmax(0, 1fr); column-gap: 14px; } .choice-img { width: 84px; } }
.choice.is-busy { opacity: .6; pointer-events: none; }

.themes { display: grid; gap: 26px; }
/* šablona = živý zmenšený náhled obchodu (váš obsah v této šabloně) a popis pod ním; celá karta je jedno tlačítko */
.theme-card { position: relative; display: grid; gap: 10px; }
.theme-view { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--ui-panel-2); border: 1px solid var(--ui-line); border-radius: 4px; }
.theme-view img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.theme-view iframe { position: absolute; top: 0; left: 0; width: 1440px; height: 900px; border: 0; transform-origin: 0 0; transform: scale(var(--s, .3)); pointer-events: none; background: transparent; opacity: 0; transition: opacity .3s; }
.theme-view iframe.is-ready { opacity: 1; }
.theme-card.is-on .theme-view { outline: 2px solid var(--ui-accent); outline-offset: 3px; }
.theme-card .meta { display: grid; gap: 3px; width: 100%; padding-right: 32px; }
.theme-card strong { font-size: 15px; font-weight: 600; }
.theme-card small { color: var(--ui-muted); font-size: 13px; line-height: 1.4; }
.theme-card .tags { color: var(--ui-muted); font-size: 12.5px; }
.theme-card.is-on strong { color: var(--ui-accent-ink); }
.theme-card:hover strong { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.theme-pick { position: absolute; inset: 0; width: 100%; border: 0; padding: 0; background: none; cursor: pointer; border-radius: 4px; }
.theme-pick:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 4px; }
.theme-pick[aria-pressed=true]::after { content: ""; position: absolute; right: 4px; bottom: 14px; width: 20px; height: 20px; background: var(--ui-accent-ink); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.fonts-list { display: grid; gap: 8px; }
.font-pair { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; padding: 11px 14px; border: 1px solid var(--ui-line-2); border-radius: var(--ui-r-sm); background: var(--ui-panel); cursor: pointer; text-align: left; font: inherit; color: inherit; }
.font-pair[aria-pressed=true] { border-color: var(--ui-accent); box-shadow: 0 0 0 2px var(--ui-accent-soft); }
.font-pair .h { font-size: 21px; line-height: 1.15; }
.font-pair .b { font-size: 13px; color: var(--ui-muted); }
.font-pair small { font-size: 11.5px; color: var(--ui-muted); }

.dropzone { position: relative; display: grid; place-items: center; gap: 8px; min-height: 120px; padding: 18px; border: 1.5px dashed var(--ui-line-2); border-radius: var(--ui-r); background: var(--ui-panel-2); text-align: center; cursor: pointer; transition: .15s; }
.dropzone:hover, .dropzone.is-over { border-color: var(--ui-accent); background: var(--ui-accent-soft); }
.dropzone input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.dropzone-sm { min-height: 84px; padding: 12px; }
.dropzone img { max-height: 84px; max-width: 80%; object-fit: contain; }
.dropzone .i { width: 26px; height: 26px; color: var(--ui-muted); }
.dropzone.has-dark { background: #1d1d22; }

.checks { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 2px; }
.checks li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--ui-line); font-size: 14px; }
.checks li:last-child { border-bottom: 0; }
.checks .ok { color: var(--ui-ok); }
.checks .bad { color: var(--ui-err); }
.checks .warn { color: var(--ui-warn); }
.checks small { display: block; color: var(--ui-muted); font-size: 12.5px; }

.usp-row { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 8px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dashed var(--ui-line); }
.usp-row .wide { grid-column: 1 / -1; }

.sections-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--ui-line); }
.sections-list li { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--ui-line); }
[data-when][hidden], [data-when-kind][hidden] { display: none !important; }
/* „Smazat / Odebrat“ jako text s ikonou koše (zaškrtávátko skryté, při zaškrtnutí červeně) – administrace i Studio */
.m-del { position: relative; border: 0; background: none; font: inherit; padding: 0; min-height: 34px; display: inline-flex; align-items: center; gap: 6px; color: var(--ui-muted); font-size: 13px; cursor: pointer; white-space: nowrap; }
.m-del input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.m-del .i { width: 17px; height: 17px; }
.m-del:hover, .m-del:has(input:focus-visible) { color: var(--ui-err); }
.m-del:has(input:checked) { color: var(--ui-err); font-weight: 600; }
.sections-list .grip { color: var(--ui-muted); cursor: grab; }
.sections-list li.is-carousel { flex-wrap: wrap; }
.sections-list .carousel-edit { order: 3; flex-basis: 100%; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 2px 0 4px 28px; }
.sections-list .carousel-edit .m-del { min-height: 0; }
@media (max-width: 560px) { .sections-list .carousel-edit { grid-template-columns: 1fr; } }
.sections-list .move { margin-left: auto; display: flex; gap: 2px; }
.sections-list .move button { border: 0; background: transparent; color: var(--ui-muted); width: 26px; height: 26px; border-radius: var(--ui-r-sm); cursor: pointer; display: grid; place-items: center; }
.sections-list .move button:hover { background: var(--ui-bg); color: var(--ui-ink); }
.sections-list .move .i { width: 16px; height: 16px; }

/* Úvod průvodce: vpravo přehlídka šablon přes celou plochu (sloupce se pomalu posouvají), vlevo seznam s linkami */
.welcome-show { position: absolute; inset: -10% -6%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; padding: 0 4%;
  transform: rotate(-7deg); -webkit-mask-image: linear-gradient(to bottom, transparent, #000 14%, #000 66%, transparent 84%); mask-image: linear-gradient(to bottom, transparent, #000 14%, #000 66%, transparent 84%); }
.welcome-col { display: flex; flex-direction: column; gap: 22px; animation: welcome-drift 70s linear infinite; }
.welcome-col:nth-child(2) { animation-direction: reverse; animation-duration: 85s; margin-top: -18%; }
.welcome-col:nth-child(3) { animation-duration: 95s; margin-top: -8%; }
.welcome-col img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; box-shadow: 0 18px 40px rgb(30 25 20 / .16); }
@keyframes welcome-drift { from { transform: translateY(0); } to { transform: translateY(-33.333%); } }
.wz[data-step="start"] .wz-foot { display: none; } /* úvod má tlačítko v obsahu – prázdná patička s linkou by jen překážela */
.welcome-caption { position: absolute; left: 32px; bottom: 28px; z-index: 1; margin: 0; display: grid; gap: 2px; max-width: min(560px, 80%);
  font-size: 15px; font-weight: 620; color: var(--ui-ink); }
.welcome-caption span { font-size: 12.5px; font-weight: 450; color: var(--ui-muted); }
.wz-preview:has(.welcome-show) { overflow: hidden; }
.welcome-strip { display: none; }
.ui .welcome-title { margin: 4px 0 14px; }
/* „Vítejte!“ velké na vlastním řádku, slib pod ním menší (zadavatel 25. 10. 2026) */
.welcome-hi { display: block; font-size: clamp(40px, 3.6vw, 54px); font-weight: 720; letter-spacing: -.04em; line-height: 1; margin-bottom: 12px; }
.welcome-sub { display: block; font-size: clamp(20px, 1.7vw, 24px); font-weight: 560; letter-spacing: -.02em; line-height: 1.25; color: var(--ui-ink-2); }
.welcome-list { list-style: none; margin: 0 0 22px; padding: 0; border-top: 1px solid var(--ui-line); }
.welcome-list li { display: grid; grid-template-columns: 22px minmax(0, 1fr); column-gap: 14px; row-gap: 2px; padding: 12px 0; border-bottom: 1px solid var(--ui-line); }
.welcome-list li > .i { grid-row: span 2; width: 20px; height: 20px; margin-top: 1px; color: var(--ui-accent-ink); stroke-width: 1.6; }
.welcome-list strong { font-size: 14.5px; font-weight: 620; }
.welcome-list span { color: var(--ui-muted); font-size: 13.5px; line-height: 1.45; }
.server-check { margin: 0 0 18px; }
.server-check summary { display: flex; align-items: center; gap: 10px; cursor: pointer; list-style: none; font-size: 14.5px; font-weight: 560; padding: 4px 0; }
.server-check summary::-webkit-details-marker { display: none; }
.server-check summary .i { width: 20px; height: 20px; flex: none; }
.server-check summary small { margin-left: auto; color: var(--ui-muted); font-weight: 450; font-size: 12.5px; text-decoration: underline; text-underline-offset: 3px; }
.server-check[open] summary small { text-decoration: none; }
.server-check .checks { margin-top: 8px; }
.server-check .i.ok { color: var(--ui-ok); } .server-check .i.warn { color: var(--ui-warn); } .server-check .i.bad { color: var(--ui-err); }
.server-probe { display: flex; gap: 10px; margin: 0 0 18px; font-size: 13.5px; color: var(--ui-ink-2); }
.server-probe[hidden] { display: none; }
.server-probe .i { width: 20px; height: 20px; flex: none; color: var(--ui-warn); }
.welcome-go .muted { margin: 12px 0 0; }
.welcome-code { margin-bottom: 16px; }
.welcome-code input { font-size: 17px; letter-spacing: .06em; }
/* adresa nového obchodu na platformě: pevný začátek adresy a pole na konec */
.slug-group { align-items: center; gap: 4px; }
.slug-prefix { color: var(--ui-muted); font-size: 13.5px; white-space: nowrap; }
/* dole na úvodu průvodce jen text: © AVITONA a platforma (zadavatel 26. 10. 2026) */
.ui .welcome-maker { margin: 34px 0 0; color: var(--ui-muted); font-size: 12.5px; line-height: 1.6; }
.ui .welcome-maker a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.ui .welcome-maker a:hover { color: var(--ui-ink); }

@media (max-width: 900px) {
  /* úvod průvodce na telefonu a tabletu: pás náhledů šablon nad nadpisem */
  /* pás náhledů plyne sám dokola (dvě stejné sady za sebou, posun o polovinu); při omezení pohybu stojí a posouvá se prstem */
  .welcome-strip { display: block; margin: 0 -18px 26px; padding: 0 0 14px; overflow: hidden; }
  .welcome-strip-track { display: flex; width: max-content; animation: welcome-slide 70s linear infinite; }
  /* náhledy šablon těsně za sebou, ostré rohy, mezi nimi tenká bílá linka */
  .welcome-strip img { flex: none; width: min(62vw, 280px); aspect-ratio: 16 / 10; object-fit: cover; object-position: top; border-right: 1px solid #fff; }
  .wz { grid-template-columns: minmax(0, 1fr); height: auto; min-height: 100dvh; }
  .wz-panel { border-right: 0; min-height: 100dvh; }
  .wz-body { overflow: visible; }
  .wz-foot { position: sticky; bottom: 0; }
  .wz-preview { position: fixed; inset: 0; z-index: 50; transform: translateY(100%); transition: transform .35s var(--ui-ease); }
  .wz.show-preview .wz-preview { transform: none; }
  .wz-mobile-toggle { display: inline-flex; }
  .wz-head, .wz-body, .wz-foot { padding-left: 18px; padding-right: 18px; }
  .wz-bar { padding: 12px 14px; gap: 8px; }
  .wz-bar .badge { min-width: 0; white-space: normal; line-height: 1.3; }
}
@media (max-width: 560px) {
  .input-group { flex-wrap: wrap; }
  .input-group > input { flex-basis: 100%; }
}
@media (max-width: 420px) {
  .color-grid { grid-template-columns: 1fr; }
}
@keyframes welcome-slide { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .welcome-col, .welcome-strip-track { animation: none; }
  .welcome-strip { overflow-x: auto; scrollbar-width: none; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
.back { display: inline-flex; align-items: center; gap: 6px; }
.back .i { width: 17px; height: 17px; }
.ui input[type=file] { max-width: 100%; font: inherit; font-size: 13.5px; color: var(--ui-muted); }
.ui input[type=file]::file-selector-button { margin-right: 12px; padding: 7px 13px; border: 1px solid var(--ui-line-2); border-radius: var(--ui-r-sm); background: var(--ui-panel); color: var(--ui-ink); font: inherit; font-weight: 560; cursor: pointer; }
.ui input[type=file]::file-selector-button:hover { border-color: var(--ui-accent); }

/* Studio: ukázka tvaru tlačítka u volby „Tvar tlačítek“ */
.shape-sample { display: inline-block; width: 22px; height: 12px; margin-right: 7px; vertical-align: -1px; border: 1.5px solid currentColor; }
.shape-square { border-radius: 0; }
.shape-soft { border-radius: 4px; }
.shape-round { border-radius: 999px; }
/* Studio: výřez fotky v úvodu – klik na fotku nastaví viditelné místo */
.focus-zoom { margin-top: 8px; max-width: 360px; }
.focus-pick { position: relative; max-width: 360px; border-radius: var(--ui-r-sm); overflow: hidden; cursor: crosshair; touch-action: none; user-select: none; border: 1px solid var(--ui-line); }
.focus-pick img { display: block; width: 100%; height: auto; pointer-events: none; }
.focus-dot { position: absolute; width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1.5px rgb(0 0 0 / .55), 0 2px 8px rgb(0 0 0 / .35); background: rgb(255 255 255 / .25); pointer-events: none; }
.focus-ranges { margin-top: 10px; }
.focus-ranges label { display: block; margin-bottom: 2px; color: var(--ui-muted); }

/* Studio → Úvodní stránka: sekce jako rozbalovací řádky oddělené linkami (žádné boxy) */
.ui .sec-intro { margin: 0 0 16px; line-height: 1.5; }
.ui .on-page-tip { margin: 0 0 16px; line-height: 1.5; }
.sec-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ui-line); }
.sec { border-bottom: 1px solid var(--ui-line); }
.sec-head { display: flex; align-items: center; gap: 8px; min-height: 58px; }
.sec-toggle { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; padding: 10px 4px 10px 0; border: 0; background: none; color: var(--ui-ink); font: inherit; text-align: left; cursor: pointer; }
.sec-toggle > .i:first-child { width: 20px; height: 20px; color: var(--ui-accent); flex: none; }
.sec-name { display: grid; gap: 2px; min-width: 0; }
.sec-name strong { font-size: 14.5px; font-weight: 620; }
.sec-name small { color: var(--ui-muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sec-chev { width: 16px; height: 16px; margin-left: auto; color: var(--ui-muted); transition: transform .2s var(--ui-ease); flex: none; }
.sec-toggle[aria-expanded="true"] .sec-chev { transform: rotate(180deg); }
.sec-toggle:hover strong { color: var(--ui-accent-ink); }
.sec .move { display: flex; gap: 2px; }
.sec .move button { border: 0; background: transparent; color: var(--ui-muted); width: 28px; height: 28px; border-radius: var(--ui-r-sm); cursor: pointer; display: grid; place-items: center; }
.sec .move button:hover { background: var(--ui-bg); color: var(--ui-ink); }
.sec .move .i { width: 16px; height: 16px; }
.sec-switch { flex: none; gap: 0; }
.sec.is-off .sec-name, .sec.is-off .sec-toggle > .i:first-child { opacity: .5; }
.sec-body { padding: 4px 0 22px 32px; }
.sec.is-sec-flash > .sec-head { background: var(--ui-accent-soft); transition: background-color .6s; }
.sec-body > .field:last-child, .sec-style > .field:last-child { margin-bottom: 0; }
.sec-sub { margin: 26px 0 10px; font-size: .78rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--ui-muted); }
.sec-body > .hint, .sec-body > div > .hint { font-size: 12.5px; color: var(--ui-muted); margin: 0 0 14px; }
.sec-sub + .hint { margin-top: -4px; }
.ui .sec-note { margin: 0 0 16px; }
.ui .sec-note a { margin-left: 4px; }
.sec-style { margin-top: 18px; padding-top: 16px; border-top: 1px dashed var(--ui-line); }
.sec-add { margin-top: 16px; }
@media (max-width: 560px) { .sec-body { padding-left: 0; } }

/* Správa platformy (/sprava): jeden sloupec, sekce oddělené linkami, obchody jako řádky */
.wz-bar-hint { flex: 1; margin: 0 14px; text-align: center; }
@media (max-width: 1100px) { .wz-bar-hint { display: none; } }
.pf-facts { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 8px 18px; margin: 0; font-size: 13.5px; }
.pf-facts dt { color: var(--ui-muted); }
.pf-facts dd { margin: 0; overflow-wrap: anywhere; }
.pf-actions { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.pf-gen { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 16px; }
.pf-gen .field { margin: 0; }
.pf-gen select { min-width: 84px; }
.pf-gen-note { flex: 1 1 260px; }
.pf-codes .pf-code-copy { display: inline-flex; max-width: 200px; }
.pf-codes .pf-code-copy input { border: 0; background: transparent; padding-left: 0; font-size: 14px; width: 11ch; flex: 0 0 auto; }
.pf-note-form input { width: 100%; min-width: 140px; }
.pf-gen-mail { flex: 1 1 240px; }
.pf-send-form .input-group { display: flex; min-width: 240px; }
.pf-send-form input { flex: 1; min-width: 0; }
.pf-send-form + .small { display: block; margin-top: 4px; }
.pf-mail-actions { display: flex; flex-wrap: wrap; gap: 8px 12px; margin-top: 8px; }
.pf-gen + .hint { margin-top: 12px; }
/* tablet a telefon: řádek kódu skládaný – nahoře kód, stav, datum a smazání, pod tím Komu a Odkaz e-mailem */
.table .pf-send-form { display: block; }
@media (max-width: 1000px) {
  .table.pf-codes thead { display: none; }
  .table.pf-codes, .table.pf-codes tbody { display: block; width: 100%; overflow: visible; }
  .table.pf-codes tr { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; padding: 12px 0 14px; border-bottom: 1px solid var(--ui-line); }
  .table.pf-codes tr:last-child { border-bottom: 0; }
  .table.pf-codes td { display: block; padding: 0; border-bottom: 0; }
  .table.pf-codes td:nth-child(1) { order: 1; flex: 1 1 auto; }
  .table.pf-codes td:nth-child(4) { order: 2; }
  .table.pf-codes td:nth-child(6) { order: 3; }
  .table.pf-codes td:nth-child(2) { order: 4; flex: 1 1 60%; }
  .table.pf-codes td:nth-child(7) { order: 5; }
  .table.pf-codes td:nth-child(3) { order: 6; flex-basis: 100%; }
  .table.pf-codes td:nth-child(5) { order: 7; flex-basis: 100%; }
  .table.pf-codes td.pf-none { display: none; }
  .table.pf-codes td.num { text-align: right; }
  .pf-codes .pf-code-copy { max-width: none; }
  .table.pf-codes .pf-code-copy input { padding-left: 0 !important; }
  .pf-send-form .input-group { min-width: 0; flex-wrap: nowrap; }
  .pf-send-form .input-group > input { flex-basis: auto; }
  .pf-codes tr.is-fresh { background: var(--ui-accent-soft); }
}

.check-inline { display: inline-flex; align-items: center; gap: 6px; margin-left: 6px; }
.pf-codes tr.is-fresh td { background: var(--ui-accent-soft); }
.danger-zone > h2, .danger-zone > p { flex-basis: 100%; margin: 0; }
@media (max-width: 560px) { .pf-facts { grid-template-columns: 1fr; gap: 2px; } .pf-facts dd { margin-bottom: 8px; } }
.pf-del summary::-webkit-details-marker { display: none; }
.pf-del[open] { flex-basis: 100%; }
.pf-del form { padding: 10px 0 4px; }
@media (max-width: 560px) { .pf { padding: 24px 16px 60px; } .pf-head { flex-wrap: wrap; } }
.wz-bar [data-preview-home][hidden] { display: none; }
/* Studio: volby jen pro zařízení v náhledu (telefon / počítač) */
[data-studio-device="phone"] [data-only="desktop"], [data-studio-device="desktop"] [data-only="phone"], html:not([data-studio-device]) [data-only="phone"] { display: none !important; }
.studio-device-note { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 16px; padding: 10px 0; border-bottom: 1px solid var(--ui-line); font-size: 13px; color: var(--ui-ink-2); }
.studio-device-note .i { width: 18px; height: 18px; flex: none; color: var(--ui-accent-ink); margin-top: 1px; }

/* Značka produktu „AVITONA | ESHOP STUDIO“ (product_mark()) podle brand manuálu AVITONA – Logo + projekt (26. 10. 2026):
   logo (celý soubor SVG), tenká svislá linka, ESHOP STUDIO písmem Bebas Neue v barvě textu jako logo (černě, v tmavém
   režimu bíle); tyrkysová (#177d82 na světlém, #32d3da na tmavém) jen po najetí myší. Závazný poměr výška loga 96 : písmo 45,7, mezery 18,6, nahoře 5,4 (.476 / .194 / .056). Mění se jen --pm-h. */
@font-face { font-family: 'Bebas Neue'; font-weight: 400; font-display: swap; src: url(../fonts/bebas-neue/latin-ext-normal.woff2) format('woff2'); unicode-range: U+0100-024F, U+1E00-1EFF; }
@font-face { font-family: 'Bebas Neue'; font-weight: 400; font-display: swap; src: url(../fonts/bebas-neue/latin-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+2000-206F, U+20AC; }
.pm { --pm-h: 36px; --pm-accent: #177d82; display: inline-flex; align-items: center; gap: calc(var(--pm-h) * .194); color: var(--ui-ink); line-height: 1; vertical-align: middle; }
:root[data-ui="dark"] .pm { --pm-accent: #32d3da; }
.pm-logo { display: flex; color: inherit !important; text-decoration: none !important; transition: color .2s; }
.pm-logo svg { display: block; height: var(--pm-h); width: auto; }
a.pm-logo:hover, a.pm-logo:focus-visible { color: var(--pm-accent) !important; }
.pm-name { padding: calc(var(--pm-h) * .056) 0 0 calc(var(--pm-h) * .194); border-left: 1px solid var(--ui-line-2);
  font: 400 calc(var(--pm-h) * .476)/1 'Bebas Neue', var(--ui-font); letter-spacing: .08em; white-space: nowrap;
  color: var(--ui-ink) !important; text-decoration: none !important; transition: color .2s; }
/* název černě jako logo (v tmavém režimu bíle) – zadavatel 26. 10. 2026: „nech ESHOP STUDIO taky černé“; tyrkysová jen po najetí */
a.pm-name:hover, a.pm-name:focus-visible { color: var(--pm-accent) !important; }
/* hlavní logo stránky (průvodce, přihlášení) stejně velké jako AVITONA | SHOP v hlavičce shop.avitona.cz: 56 px, telefon 46 px
   (pod 390 px menší, ať se vejde vedle tlačítka) – zadavatel 26. 10. 2026: „velikost (a hlavně poměr) stejný jako u loga SHOP“ */
.wz-brand .pm { --pm-h: 56px; }
@media (max-width: 860px) { .wz-brand .pm { --pm-h: clamp(30px, calc(25.2vw - 49px), 46px); } }

/* přihlášení kódem: adresa obchodu jen jako ukázka odvozená z názvu (needitovatelná) */
.ui .slug-preview { margin: 2px 0 0; padding: 9px 0; border-bottom: 1px solid var(--ui-line); color: var(--ui-muted); font-size: 14.5px; overflow-wrap: anywhere; }
.ui .slug-preview strong { color: var(--ui-ink); font-weight: 600; }

/* přihlášení kódem: viditelné vysvětlení nad polem, že sem patří zakoupený kód (text v barvě textu, ne šedá nápověda) */
.ui .code-lead { margin: -2px 0 8px; color: var(--ui-ink-2); font-size: 13.5px; line-height: 1.45; }