/* style.css */
/* Shared palette and layout */
:root {
  --royal-blue: #0b4dbb;
  --royal-blue-dark: #073786;
  --royal-blue-soft: #eaf2ff;
  --orange: #f58220;
  --orange-dark: #d9670f;
  --orange-soft: #fff1e6;
  --ink: #172033;
  --muted: #667085;
  --surface: #fff;
  --surface-soft: #f6f8fc;
  --border: #dce3ed;
  --success: #18794e;
  --danger: #b42318;
  --radius: 14px;
  --gutter: clamp(16px, 3vw, 40px);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; min-width: 280px; min-height: 100vh;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px; line-height: 1.6; color: var(--ink); background: var(--surface-soft);
}
h1, h2, h3 { color: var(--royal-blue-dark); line-height: 1.2; letter-spacing: -.025em; overflow-wrap: anywhere; }
h1 { margin: 0 0 24px; font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 750; }
h2 { margin: 0 0 16px; font-size: 1.35rem; }
h3 { margin: 0 0 12px; font-size: 1.1rem; }
p { margin: 0 0 16px; }
p:last-child { margin-bottom: 0; }
a { color: var(--royal-blue); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 4px; }
img, svg { max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
button, .btn, input, select, textarea, summary { -webkit-tap-highlight-color: transparent; }
:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--royal-blue); outline-offset: 3px;
}
.muted, small { color: var(--muted); }
.wrap { width: min(1160px, calc(100% - var(--gutter) * 2)); margin-inline: auto; }
.grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.grid > *, .head-row > *, .admin-layout > *, .field { min-width: 0; }
.card, .panel, .metric {
  padding: clamp(20px, 3vw, 32px); border: 1px solid var(--border);
  border-radius: var(--radius); background: var(--surface); overflow-wrap: anywhere;
}
/* Public website */
.topbar { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 16px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; font-size: 1.4rem; color: var(--royal-blue); letter-spacing: -.03em; }
.brand::before { content: ""; width: 8px; height: 28px; border-radius: 4px; background: var(--orange); }
.nav { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 24px; }
.nav > a:not(.btn) { color: var(--ink); font-weight: 600; }
.topbar.home-topbar { align-items: center; flex-wrap: wrap; }
.home-topbar .nav { margin-left: auto; max-width: 100%; justify-content: flex-end; gap: 12px clamp(8px, 3vw, 24px); }
.home-topbar .nav > a { display: inline-flex; align-items: center; min-height: 44px; }
.home-topbar .home-language { flex-shrink: 0; }
.hero { background: var(--royal-blue); color: white; padding-block: clamp(48px, 7vw, 96px); }
.hero h1 { max-width: 900px; margin: 16px 0 24px; color: white; font-size: clamp(2.25rem, 5.3vw, 4.25rem); line-height: 1.08; letter-spacing: -.04em; }
.hero p:not(.muted) { max-width: 740px; margin-bottom: 32px; font-size: clamp(1rem, 2vw, 1.15rem); color: #edf3ff; }
.hero .muted { color: #ffe0c4; font-size: .9rem; font-weight: 650; }
footer { border-top: 1px solid var(--border); }
/* Controls */
.btn, button, input[type="submit"] {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; max-width: 100%; padding: 11px 20px;
  border: 1px solid transparent; border-radius: 10px;
  background: var(--orange); color: #172033; font-weight: 700; line-height: 1.4;
  text-align: center; white-space: normal; overflow-wrap: anywhere; cursor: pointer;
  transition: background-color .15s, border-color .15s;
}
.btn:hover, button:hover, input[type="submit"]:hover { background: #ffa04d; color: #172033; text-decoration: none; }
.btn.secondary { background: white; color: var(--royal-blue); border-color: var(--border); }
.btn.secondary:hover { background: var(--royal-blue-soft); border-color: #adc4e9; }
button:disabled, input[type="submit"]:disabled { opacity: .55; cursor: not-allowed; }
label { display: block; margin-bottom: 8px; color: var(--ink); font-size: .95rem; font-weight: 650; }
.field { margin-bottom: 24px; }
.field small { display: block; margin-top: 8px; line-height: 1.5; }
input, select, textarea {
  width: 100%; min-width: 0; min-height: 48px; padding: 11px 14px;
  border: 1px solid #b8c5d8; border-radius: 9px; background: white; color: var(--ink);
}
input:hover, select:hover, textarea:hover { border-color: #879bb8; }
input:focus, select:focus, textarea:focus { border-color: var(--royal-blue); }
input:disabled, select:disabled, textarea:disabled { color: var(--muted); background: #f0f3f7; cursor: not-allowed; }
textarea { min-height: 144px; resize: vertical; }
input[type="checkbox"], input[type="radio"] { width: 20px; height: 20px; min-height: 0; margin: 2px 0 0; padding: 0; flex-shrink: 0; accent-color: var(--royal-blue); }
input[type="file"] { padding: 8px; font-size: .9rem; }
input::file-selector-button { border: 0; border-radius: 5px; padding: 7px 10px; margin-right: 12px; background: var(--royal-blue-soft); color: var(--royal-blue-dark); cursor: pointer; }
.check { display: flex; align-items: flex-start; gap: 12px; min-height: 44px; padding: 10px 0; margin: 0; font-weight: 500; cursor: pointer; }
.actions { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--border); }
.notice { margin-block: 16px; padding: 14px 16px; border: 1px solid #f5c89f; border-left: 3px solid var(--orange); border-radius: 9px; background: var(--orange-soft); overflow-wrap: anywhere; }
.notice:empty { display: none; }
.notice.error { color: var(--danger); background: #fff1f0; border-color: #f5c1bb; }
.badge, .status { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 6px; background: var(--royal-blue-soft); color: var(--royal-blue-dark); font-size: .8rem; font-weight: 650; }
.badge.orange, .status.warn { color: #8a450a; background: var(--orange-soft); }
.status.ok { color: var(--success); background: #eaf6ef; }
.status.bad { color: var(--danger); background: #fff1f0; }
.status-online { color: var(--success); font-weight: 650; }
.status-offline { color: var(--danger); font-weight: 650; }
/* Employee flow and login screens */
.app-shell { min-height: 100vh; min-height: 100dvh; }
.app-head { background: white; border-bottom: 1px solid var(--border); }
.head-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; max-width: 960px; margin-inline: auto; padding: 16px var(--gutter); }
.head-row > strong, .head-row > .company-home { color: var(--royal-blue); font-size: 1.2rem; overflow-wrap: anywhere; }
.stepbar, .progress { height: 4px; background: #e3eaf5; overflow: hidden; }
.stepbar > span, .progress > span { display: block; height: 100%; background: var(--orange); }
.wizard { width: min(800px, 100%); margin-inline: auto; padding: clamp(24px, 4vw, 48px) var(--gutter); }
#root > .wizard { max-width: 600px; padding-top: clamp(32px, 8vh, 96px); }
.panel > .muted:first-child { margin-bottom: 8px; font-size: .875rem; }
.email-login #human-check { width: 100%; }
.email-login #login-status:not(:empty) { margin-top: 16px; }
.email-login #email { font-size: 16px; }
/* Keep 300px available for the horizontal widget on small phones. */
@media (max-width: 380px) {
  #root > .wizard.email-login { padding-inline: 8px; }
  .email-login > .panel { padding-inline: 0; border: 0; background: transparent; }
}
@media (max-width: 560px) {
  .email-login .actions > .btn { width: 100%; }
  .email-login .actions > span:empty { display: none; }
}
.choices { display: grid; gap: 12px; }
.choice { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; min-height: 64px; padding: 18px 20px; border: 1px solid var(--border); border-radius: 10px; background: white; color: var(--ink); text-align: left; font-weight: 500; }
button.choice:hover { color: var(--royal-blue-dark); border-color: #adc4e9; background: var(--royal-blue-soft); }
.choice > :first-child { min-width: 0; overflow-wrap: anywhere; }
.choice > :last-child { flex-shrink: 0; }
.blank-preset-section { margin-bottom: 32px; }
.blank-preset-grid { width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.choice.blank-preset-tile { aspect-ratio: 1; min-height: 0; padding: 16px; flex-direction: column; justify-content: center; gap: 10px; text-align: center; }
.blank-preset-tile > b { width: 100%; min-height: 4.2em; display: flex; align-items: center; justify-content: center; line-height: 1.4; text-wrap: balance; }
.blank-preset-tile > span { color: var(--royal-blue); font-size: 1.5rem; line-height: 1; }
@media (max-width: 480px) {
  .blank-preset-grid { gap: 6px; }
  .choice.blank-preset-tile { padding: 12px; font-size: .9rem; }
}
.allergen-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin-bottom: 24px; }
.allergen-grid .check { align-items: center; font-weight: 400; padding: 12px; border: 1px solid var(--border); border-radius: 9px; }
.allergen-grid .check:has(input:checked) { border-color: var(--royal-blue); background: var(--royal-blue-soft); }
.allergen-subgroup { min-width: 0; margin: 0 0 24px; padding: 16px; border: 1px solid var(--border); border-radius: 10px; }
.allergen-subgroup legend { padding: 0 8px; color: var(--royal-blue-dark); font-weight: 700; }
.allergen-subgroup .allergen-grid { margin-bottom: 0; }
.qty { display: flex; align-items: center; justify-content: center; gap: 24px; margin: 24px 0; }
.home-return { margin-top: 16px; }
.home-return .btn { width: 100%; }
.qty button { width: 48px; padding: 10px; }
.qty b { min-width: 3ch; text-align: center; font-size: 1.4rem; font-variant-numeric: tabular-nums; }
.label-preview { box-sizing: border-box; display: flex; flex-direction: column; width: min(100%, var(--label-width, 101mm)); min-height: var(--label-height, 54mm); aspect-ratio: var(--label-width, 101) / var(--label-height, 54); padding: clamp(4px, 1.8vw, 14px); margin-bottom: 8px; border: 1px solid #aeb9c8; border-radius: 8px; background: white; color: #111; overflow: hidden; overflow-wrap: anywhere; }
.label-title { margin-bottom: clamp(3px, 1vw, 8px); font-size: clamp(.65rem, 2.6vw, 1.1rem); font-weight: 800; line-height: 1.15; }
.label-meta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 2px clamp(5px, 1.5vw, 10px); padding-bottom: clamp(3px, 1vw, 8px); margin-bottom: clamp(3px, 1vw, 8px); border-bottom: 1px solid #ddd; font-size: clamp(.48rem, 1.7vw, .78rem); line-height: 1.15; }
.allergen-line { display: flex; flex-wrap: wrap; gap: clamp(2px, .7vw, 6px) clamp(5px, 1.2vw, 10px); margin-top: clamp(3px, .8vw, 6px); font-size: clamp(.45rem, 1.5vw, .72rem); line-height: 1.1; }
.allergen-line span { text-decoration: underline; font-weight: 400; }
.allergen-icon { width: 16.8px; height: 16.8px; flex: 0 0 16.8px; vertical-align: middle; }
.allergen-image { width: clamp(12px, 5vw, 28px); height: clamp(12px, 5vw, 28px); flex-basis: clamp(12px, 5vw, 28px); object-fit: contain; background: white; filter: grayscale(1) brightness(.6) contrast(20); }
.allergen-line span { display: inline-flex; align-items: center; gap: clamp(2px, .7vw, 5px); max-width: 100%; }
.label-allergens { margin-top: auto; }
.label-dimensions { margin: 0 0 20px; color: var(--muted); font-size: .875rem; }
.allergen-line i { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; margin-right: 6px; border: 1px solid #ccc; border-radius: 4px; font-style: normal; font-size: .75rem; }
/* Compact language dropdown */
.language-picker { position: relative; flex-shrink: 0; }
.language-picker summary { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 9px 12px; border: 1px solid var(--border); border-radius: 9px; background: white; color: var(--royal-blue-dark); cursor: pointer; list-style: none; font-weight: 650; }
.global-language-picker { min-height: 44px; padding: 8px 28px 8px 12px; border: 1px solid var(--border); border-radius: 9px; background: white; color: var(--royal-blue-dark); font-weight: 650; }
.language-picker summary::-webkit-details-marker { display: none; }
.language-picker summary::after { content: ""; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); margin-top: -4px; }
#current-language, #home-current-language, .language-current { display: inline-flex; align-items: center; gap: 8px; }
.language-options { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; min-width: 116px; padding: 5px; background: white; border: 1px solid #b8c5d8; border-radius: 10px; }
.language-options button { display: flex; width: 100%; min-height: 44px; padding: 8px 12px; gap: 8px; border-radius: 6px; background: white; color: var(--ink); }
.language-options button:hover, .language-options button[aria-pressed="true"] { background: var(--royal-blue-soft); color: var(--royal-blue-dark); }
.flag { display: inline-block; width: 24px; height: 16px; flex-shrink: 0; box-shadow: 0 0 0 1px #0002; }
.flag-nl { background: linear-gradient(#ae1c28 33.33%, white 33.33% 66.66%, #21468b 66.66%); }
.flag-de { background: linear-gradient(#000 33.33%, #d00 33.33% 66.66%, #ffce00 66.66%); }
.flag-fr { background: linear-gradient(90deg, #002395 33.33%, white 33.33% 66.66%, #ed2939 66.66%); }
.flag-en { background: url('/assets/flag-gb.svg') center / cover; }


/* Account menu inside the shared application header. */
.account-control { position: relative; flex: 0 0 auto; margin-left: auto; }
.account-dropdown > summary { position: relative; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; list-style: none; cursor: pointer; color: var(--royal-blue); background: var(--royal-blue-soft); border: 1px solid var(--border); border-radius: 50%; }
.account-dropdown > summary::-webkit-details-marker { display: none; }
.account-dropdown > summary:hover, .account-dropdown[open] > summary { background: #dce8ff; }
.account-dropdown > summary:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
.account-status-dot { position: absolute; right: 1px; bottom: 1px; width: 10px; height: 10px; border: 2px solid white; border-radius: 50%; background: #16834a; }
.account-menu { position: absolute; top: calc(100% + 10px); right: 0; z-index: 50; width: min(320px, calc(100vw - 32px)); padding: 18px; border: 1px solid var(--border); border-radius: 12px; background: white; box-shadow: 0 12px 36px #071b3d24; }
.account-company, .account-identity, .account-email { display: block; overflow-wrap: anywhere; }
.account-company { color: var(--royal-blue-dark); margin-bottom: 6px; }
.account-identity { color: var(--muted); font-size: .875rem; }
.account-email { margin-top: 6px; font-size: .875rem; }
.account-email[hidden] { display: none; }
.account-control .account-menu .account-logout { width: 100%; margin-top: 16px; min-height: 44px; }
.account-error { margin: 12px 0 0; color: var(--danger); font-size: .875rem; }
.app-head { position: relative; z-index: 35; }
.head-row > .language-picker { margin-left: auto; }
.head-row > .language-picker + .account-control { margin-left: 0; }

/* Administration */
.admin-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); min-height: 100vh; min-height: 100dvh; }
.side { position: sticky; top: 0; align-self: start; height: 100vh; height: 100dvh; overflow-y: auto; padding: 32px 20px; background: white; border-right: 1px solid var(--border); }
.side h2 { padding: 0 12px; margin-bottom: 28px; font-size: 1.2rem; }
.side nav { display: grid; gap: 6px; }
.side nav a { display: flex; align-items: center; min-height: 44px; padding: 10px 12px; border-radius: 8px; color: #344054; font-size: .95rem; font-weight: 600; }
.side nav a:hover, .side nav a[aria-current="page"] { color: var(--royal-blue); background: var(--royal-blue-soft); text-decoration: none; }
.main { width: 100%; max-width: 1440px; padding: var(--gutter); }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.metric { display: flex; flex-direction: column; gap: 12px; padding: 20px; }
.metric span { color: var(--muted); font-size: .875rem; }
.metric strong { font-size: clamp(1.5rem, 2.5vw, 2rem); line-height: 1.2; color: var(--royal-blue-dark); font-variant-numeric: tabular-nums; }
.table-scroll { max-width: 100%; overflow-x: auto; border: 1px solid var(--border); border-radius: 12px; background: white; }
.table { width: 100%; border-collapse: collapse; text-align: left; font-size: .9rem; }
.table th, .table td { padding: 16px 20px; border-bottom: 1px solid var(--border); vertical-align: top; overflow-wrap: anywhere; }
.table th { background: #eef3fa; color: var(--royal-blue-dark); font-weight: 650; white-space: nowrap; }
.table tr:last-child td { border-bottom: 0; }
.table tbody tr:hover td { background: #f9fbfe; }
/* Tablet */
@media (max-width: 1100px) {
  .admin-layout { grid-template-columns: 210px minmax(0, 1fr); }
  .main .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .admin-layout { display: block; }
  .side { position: static; height: auto; padding: 20px var(--gutter); border-right: 0; border-bottom: 1px solid var(--border); }
  .side h2 { padding: 0; margin-bottom: 16px; }
  .side nav { display: flex; overflow-x: auto; gap: 8px; padding-bottom: 4px; }
  .side nav a { flex-shrink: 0; white-space: nowrap; }
  .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .topbar { flex-wrap: wrap; gap: 16px; }
  .table { min-width: 560px; }
}
/* Mobile */
@media (max-width: 560px) {
  .topbar { align-items: flex-start; }
  .nav { width: 100%; gap: 12px 20px; }
  .nav .btn { margin-left: auto; padding-inline: 14px; }
  .grid, .main .grid, .allergen-grid { grid-template-columns: minmax(0, 1fr); }
  .hero h1 { font-size: clamp(2rem, 9vw, 3rem); }
  .hero .btn { width: 100%; }
  .wizard { padding: 24px 16px; }
  .panel { padding: 20px; }
  .actions { gap: 12px; margin-top: 24px; padding-top: 20px; }
  .actions .btn { flex: 1 1 120px; }
  .actions > span:empty { display: none; }
  .metric-grid { gap: 12px; }
  .metric { padding: 16px; }
  .label-preview { padding: 16px; }
  .label-meta { gap: 8px 12px; font-size: .9rem; }
  .choice { padding: 16px; }
  .table th, .table td { padding: 12px 16px; }
}
/* Smaller application controls; the public homepage retains its original sizes.
   Standard height and horizontal padding are 65% of the previous 48px / 20px.
   Keep readable text and allow long labels to wrap rather than clipping them. */
.application-page :is(button, .btn, input[type="submit"]) {
  min-height: 31.2px; padding: 4.8px 13px; gap: 5.2px;
  font-size: 14px; line-height: 1.4; border-radius: 6.5px;
}
.application-page .choice { min-height: 41.6px; padding: 11.7px 13px; gap: 10.4px; }
.application-page .qty button { width: 31.2px; padding: 4.8px; }
.application-page .language-options button { min-height: 28.6px; padding: 3.5px 7.8px; }
.application-page .choice.blank-preset-tile { min-height: 80px; padding: 6px; gap: 4px; font-size: clamp(11px, 2.8vw, 14px); }
.application-page input::file-selector-button { padding: 4.55px 6.5px; }
.administration-page :is(.main, .card, .field, section, form) { min-width: 0; }
.administration-page .main { overflow-wrap: anywhere; }
.administration-page :is(input, select, textarea) { max-width: 100%; font-size: 16px; }
.administration-page .main img { max-width: 100% !important; height: auto; }
.administration-page .table td > .btn { margin-block: 4px; }
@media (max-width: 820px) {
  .administration-page .side nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; }
  .administration-page .side nav a { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
  .administration-page .side { padding-block: 12px; }
  .administration-page .side h2 { margin-bottom: 8px; }
}
@media (max-width: 560px) {
  .administration-page .main { padding: 16px 12px 28px; }
  .administration-page :is(.card, .panel) { padding: 16px 12px; }
  .administration-page .field { margin-bottom: 18px; }
  .administration-page .actions { gap: 12px; }
  .administration-page .table-scroll:has(.mobile-table) { overflow: visible; border: 0; border-radius: 0; background: transparent; }
  .administration-page .mobile-table { display: block; min-width: 0; }
  .administration-page .mobile-table thead {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip-path: inset(50%); white-space: nowrap;
  }
  .administration-page .mobile-table tbody { display: grid; gap: 16px; }
  .administration-page .mobile-table tbody tr {
    display: block; min-width: 0; border: 1px solid var(--border);
    border-radius: 10px; background: white;
  }
  .administration-page .mobile-table td { display: block; padding: 10px 12px; border: 0; }
  .administration-page .mobile-table td + td { border-top: 1px solid var(--border); }
  .administration-page .mobile-table td::before {
    content: attr(data-label); display: block; margin-bottom: 4px;
    color: var(--royal-blue-dark); font-weight: 650; font-size: .8rem;
  }
}
@media (max-width: 380px) {
  .administration-page .email-login > .panel { padding-inline: 0; }
  .administration-page .metric-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

.label-preview.label-preview-svg{padding:0;min-height:0;height:auto;max-width:100%;overflow:hidden}.label-preview-svg>svg{display:block;width:100%;height:auto}

.label-font-picker { width:100%; border:1px solid var(--border); border-radius:8px; }
.label-font-picker summary { cursor:pointer; padding:12px; overflow-wrap:anywhere; }
.label-font-picker fieldset { margin:0; padding:8px; border:0; max-height:340px; overflow-y:auto; }
.label-font-picker legend { padding:4px; font-size:14px; }
.label-font-picker fieldset label { display:flex; align-items:center; gap:12px; min-height:48px; padding:8px; cursor:pointer; overflow-wrap:anywhere; }
.label-font-picker input[type=radio] { width:18px; min-width:18px; height:18px; margin:0; }
.label-font-picker label:has(input:checked) { background:var(--royal-blue-soft); }
.label-font-picker label:focus-within { outline:2px solid var(--royal-blue); }

/* Action feedback stays visible when an admin view is redrawn. */
.admin-feedback { position:fixed; right:16px; bottom:max(16px,env(safe-area-inset-bottom)); z-index:2000; width:min(400px,calc(100vw - 32px)); display:grid; gap:8px; pointer-events:none; }
.admin-feedback-message { padding:12px 16px; border:1px solid var(--border); border-left:4px solid var(--royal-blue); border-radius:8px; background:#fff; color:#172033; box-shadow:0 4px 18px #0002; overflow-wrap:anywhere; font-size:14px; }
.admin-feedback-message[data-state="success"] { border-left-color:#16803c; }
.admin-feedback-message[data-state="error"] { border-left-color:var(--danger); }
.administration-page .feedback-pressed { outline:3px solid var(--royal-blue); outline-offset:2px; }
.administration-page [aria-busy="true"] { cursor:progress; }
.administration-page button[aria-busy="true"]::after { content:""; display:inline-block; width:.8em; height:.8em; margin-left:6px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:admin-feedback-spin .8s linear infinite; }
@keyframes admin-feedback-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .administration-page button[aria-busy="true"]::after { animation:none; } }

.server-card { margin-top:20px; overflow-wrap:anywhere; }
.server-card[hidden] { display:none; }
.server-card h3 { margin-top:20px; }
.server-printer { padding:12px 0; border-bottom:1px solid var(--border); }
.server-card .check { margin:12px 0; }

.server-card fieldset { min-width:0; margin:12px 0; border:1px solid var(--border); border-radius:8px; padding:12px; }
.server-card .actions { flex-wrap:wrap; }
.server-card button { white-space:normal; }

.backup-restore-dialog { width:min(680px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); overflow:auto; box-sizing:border-box; border:1px solid var(--border); border-radius:12px; padding:20px; }
.backup-restore-dialog::backdrop { background:#0008; }
.backup-restore-dialog li { margin-bottom:12px; }

.queue-job { flex-wrap: wrap; }
.queue-job > :first-child { flex: 1 1 160px; }
.queue-job > button { white-space: normal; }

.flag-da{background:linear-gradient(90deg,transparent 28%,white 28% 40%,transparent 40%),linear-gradient(0deg,#c8102e 40%,white 40% 57%,#c8102e 57%)}

/* Keep each page's existing navigation visible while scrolling. */
body > .wrap:has(> .topbar), body > .topbar, .app-head {
  position:sticky;top:0;z-index:35;background:#fff;box-shadow:0 4px 20px #07378608;
}
html{scroll-padding-top:calc(var(--page-header-height,0px) + 16px)}
@media print{body > .wrap:has(> .topbar),body > .topbar,.app-head{position:static;box-shadow:none}}

.topbar .nav{flex-wrap:wrap;justify-content:flex-end}.site-navigation-link{display:inline-flex;align-items:center;min-height:44px}.app-head>.site-navigation{max-width:960px;margin-inline:auto;padding:0 var(--gutter) 12px}.administration-page .admin-navigation{flex-wrap:wrap}.admin-navigation>.site-navigation{order:10;flex-basis:100%;gap:8px 20px}.app-head>.site-navigation{gap:8px 20px}

/* Full-width navigation with the same inset on every page. */
body>.wrap:has(>.topbar),body>.topbar{width:100%;max-width:none}
body>.wrap>.topbar,body>.topbar{padding-inline:var(--gutter)}
.app-head>.head-row,.app-head>.site-navigation{max-width:none}

.reprint-batch-dialog{box-sizing:border-box;width:min(520px,calc(100% - 24px));max-height:90dvh;overflow:auto;padding:22px;border:1px solid var(--line,#dce3f2);border-radius:16px;color:var(--text,#172c49);background:#fff}.reprint-batch-dialog::backdrop{background:#14244399}.reprint-batch-dialog h2{margin-top:0}.reprint-batch-dialog p{overflow-wrap:anywhere}.reprint-batch-dialog .check{display:flex;align-items:center;gap:10px;margin:14px 0}.reprint-batch-dialog .check input{width:20px;height:20px;margin:0}.reprint-batch-dialog [role=alert]{color:var(--danger,#aa243b)}.reprint-batch-dialog [hidden]{display:none!important}.reprint-batch-dialog .actions{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap}@media(max-width:480px){.reprint-batch-dialog{padding:16px}.reprint-batch-dialog .actions .btn{flex:1}}

/* Compact language control: 65% of the original dimensions. */
html .language-picker>summary{min-height:29px;padding:6px 8px;gap:8px;border-radius:6px;font-size:10px;line-height:1.3;align-items:center}
html .language-picker>summary::after{width:4px;height:4px;margin-top:-3px}
html .language-picker :is(#current-language,#home-current-language,.language-current){gap:5px;align-items:center}
html .language-picker summary .flag{width:16px;height:10px}
html .global-language-picker{min-height:29px;padding:5px 18px 5px 8px;border-radius:6px;font-size:10px}
.topbar .nav,.head-row{align-items:center}

html .language-picker{width:max-content;max-width:100%}

/* Text links remain identifiable without colour perception. */
:is(p,li,dd,small,.muted,.faq-intro,.review-consent) a:not(.btn){text-decoration:underline;text-underline-offset:.18em;text-decoration-thickness:1.5px}

.flag-es{background:linear-gradient(#aa151b 25%,#f1bf00 25% 75%,#aa151b 75%)}
.flag-it{background:linear-gradient(90deg,#009246 33.33%,#fff 33.33% 66.66%,#ce2b37 66.66%)}

/* legal.css */
.legal-content{max-width:900px;padding-top:32px;padding-bottom:48px;overflow-wrap:anywhere}.legal-content h1{font-size:clamp(28px,5vw,42px)}.legal-content h2{font-size:22px;margin-top:32px}.legal-content p{line-height:1.7}.legal-footer{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:24px;padding-bottom:30px;border-top:1px solid var(--border);color:var(--muted)}.legal-footer nav{display:flex;gap:20px;flex-wrap:wrap}.legal-footer a{padding:8px 0}@media(max-width:600px){.legal-content{padding-top:20px}.legal-footer{flex-direction:column}.legal-content .btn{white-space:normal}}@media print{.topbar,.legal-footer,.legal-content .btn{display:none}.legal-content{max-width:none;padding:0}body{background:white;color:black}h2{break-after:avoid}}

.legal-content p{overflow-wrap:anywhere}.legal-content h2{overflow-wrap:anywhere}@media(max-width:600px){body>.home-topbar .nav{flex-wrap:wrap;justify-content:flex-end}.legal-content .btn{max-width:100%;box-sizing:border-box}}

/* cookie-notice.css */
.cookie-notice{position:fixed;z-index:1000;left:16px;right:16px;bottom:16px;max-width:480px;margin:auto;display:flex;gap:14px;align-items:center;padding:12px 14px;background:var(--surface,#fff);border:1px solid var(--border,#d8e1ee);border-radius:10px;box-shadow:0 5px 22px #102a561c;color:var(--text,#25334a);max-height:calc(100dvh - 32px);overflow:auto}.cookie-copy{flex:1;min-width:0}.cookie-notice h2{font-size:14px;margin:0 0 4px;color:var(--royal-blue-dark,#003f8f)}.cookie-notice p{font-size:12px;line-height:1.4;margin:0 0 4px}.cookie-settings-link,.cookie-notice a{font-size:11px;color:var(--royal-blue-dark,#003f8f)}.cookie-settings-link{border:0;background:none;padding:3px 0;text-decoration:underline;cursor:pointer;font-family:inherit}.cookie-notice .btn{flex-shrink:0;min-height:32px;padding:6px 12px;font-size:12px}.cookie-preferences{padding-top:8px;border-top:1px solid var(--border,#d8e1ee);margin-top:5px}.cookie-preferences[hidden]{display:none}.cookie-preferences label{display:flex;align-items:center;gap:8px;font-size:12px;margin:4px 0}.cookie-preferences input{width:16px;height:16px;margin:0}.cookie-preferences a{display:block;margin:6px 0}.cookie-reopen{font:inherit;color:inherit;border:0;background:none;text-decoration:underline;cursor:pointer;padding:8px 0}@media(max-width:600px){.cookie-notice{left:10px;right:10px;bottom:10px;padding:11px 12px;gap:10px}.cookie-notice:has(.cookie-preferences:not([hidden])){align-items:flex-start}.cookie-notice .btn{min-height:36px}}@media print{.cookie-notice,.cookie-reopen{display:none}}

/* accessibility.css */
.accessibility-trigger{position:fixed;right:20px;bottom:20px;z-index:1100;width:56px;height:56px;border:2px solid white;border-radius:50%;background:#084bbc;color:white;box-shadow:0 3px 14px #102a5633;cursor:pointer;display:grid;place-items:center;padding:8px}.accessibility-trigger svg{width:36px;height:36px}.accessibility-trigger:focus-visible,.accessibility-panel :focus-visible{outline:3px solid #f58220;outline-offset:4px}.accessibility-panel{position:fixed;inset: auto 20px 88px auto;margin:0;width:420px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 112px);overflow:auto;border:1px solid #d8e1ee;border-radius:18px;padding:24px;background:#fff;color:#25334a;box-shadow:0 12px 48px #102a5633}.accessibility-panel::backdrop{background:#102a5644}.accessibility-panel header{display:flex;gap:12px;align-items:flex-start}.accessibility-panel h2{font-size:22px;line-height:1.3;margin:0;color:#003f8f}.accessibility-close{border:0;background:transparent;font-size:30px;min-width:44px;min-height:44px;cursor:pointer;color:inherit}.accessibility-panel p{font-size:14px;line-height:1.6}.accessibility-size{display:grid;gap:8px;font-weight:600}.accessibility-size select{width:100%;min-height:44px}.accessibility-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.accessibility-options button{border:1px solid #cbd7e8;border-radius:10px;background:#f7f9fc;color:#003f8f;min-height:72px;padding:12px;font:inherit;font-size:15px;cursor:pointer}.accessibility-options button[aria-pressed=true]{background:#084bbc;color:#fff;border-color:#084bbc}.accessibility-reset{width:100%;white-space:normal}body:has(.cookie-notice) .accessibility-trigger{bottom:calc(var(--cookie-height,250px) + 32px)}html[data-text-size="1"] main{--accessibility-scale:1.15}html[data-text-size="2"] main{--accessibility-scale:1.3}html[data-text-size="1"] main p,html[data-text-size="2"] main p{font-size:calc(18px * var(--accessibility-scale));line-height:1.65}html[data-text-size="1"] main h1,html[data-text-size="2"] main h1{font-size:calc(clamp(32px,5vw,56px) * var(--accessibility-scale))}html[data-text-size="1"] main h2,html[data-text-size="2"] main h2{font-size:calc(28px * var(--accessibility-scale))}html[data-text-size="1"] main h3,html[data-text-size="2"] main h3{font-size:calc(22px * var(--accessibility-scale))}.accessibility-links a{text-decoration:underline!important;text-underline-offset:4px}.accessibility-spacing main{letter-spacing:.08em;word-spacing:.12em}.accessibility-spacing main p{line-height:1.9}.accessibility-motion *, .accessibility-motion *::before,.accessibility-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.accessibility-contrast body,.accessibility-contrast .hero,.accessibility-contrast .card,.accessibility-contrast .cookie-notice{background:#fff!important;color:#111!important}.accessibility-contrast main *,.accessibility-contrast .muted,.accessibility-contrast .legal-footer{color:#111!important}.accessibility-contrast a{color:#003580!important}.accessibility-contrast .btn{background:#111!important;color:#fff!important;border-color:#111!important}.accessibility-contrast .card{border-color:#111!important}@media(max-width:600px){.accessibility-trigger{right:16px;bottom:16px;width:50px;height:50px}.accessibility-panel{right:16px;bottom:78px;padding:20px}.accessibility-panel h2{font-size:20px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important}}@media print{.accessibility-trigger,.accessibility-panel{display:none}}
.accessibility-panel button,.accessibility-panel select{transition:none}

/* High contrast also identifies links without relying on their colour. */
html.accessibility-contrast{--ink:#000;--muted:#000;--surface:#fff;--surface-soft:#fff;--border:#000}
.accessibility-contrast :is(body,.hero,.card,.reviews-band,.review-card,.cookie-notice,.topbar,.legal-footer,.accessibility-panel,.assistant-panel,.assistant-message,.language-options,.callback-dialog){background:#fff!important;color:#000!important;border-color:#000!important}
.accessibility-contrast :is(main,.topbar,.legal-footer,.cookie-notice,.accessibility-panel,.assistant-panel) :is(p,h1,h2,h3,h4,strong,label,small,.muted){color:#000!important}
.accessibility-contrast a:not(.btn),.accessibility-contrast a:not(.btn):visited{background:#fff!important;color:#000!important;text-decoration:underline!important;text-decoration-thickness:2px!important;text-underline-offset:.2em;text-decoration-skip-ink:auto}
.accessibility-contrast a:not(.btn):hover{background:#000!important;color:#fff!important;text-decoration-thickness:3px!important}
.accessibility-contrast a:not(.btn) *{color:inherit!important}
.accessibility-contrast :is(button,.btn),.accessibility-contrast :is(button,.btn):hover{background:#000!important;color:#fff!important;border:2px solid #000!important}
.accessibility-contrast :is(button,.btn) *{color:inherit!important}
.accessibility-contrast a.btn{text-decoration:underline!important;text-decoration-thickness:2px!important;text-underline-offset:.2em}
.accessibility-contrast :is(input,textarea,select){background:#fff!important;color:#000!important;border-color:#000!important;accent-color:#000}
.accessibility-contrast :is(input,textarea)::placeholder{color:#333!important;opacity:1}
.accessibility-contrast :focus-visible{outline:3px solid #000!important;outline-offset:4px!important;box-shadow:0 0 0 4px #fff!important}
.accessibility-contrast .accessibility-options button[aria-pressed=true]{background:#fff!important;color:#000!important;box-shadow:inset 0 0 0 2px #000}

/* brand.css */
.preptag-logo{display:block;width:190px;height:auto;max-width:100%;object-fit:contain}
.brand,.admin-brand{display:inline-flex;align-items:center;flex-shrink:0}
.admin-brand .preptag-logo{width:165px}
.brand-login{display:inline-flex;margin-bottom:28px;max-width:100%}
.brand-login .preptag-logo{width:220px}
.company-home{display:flex;align-items:center;gap:12px;min-width:0}
.company-home .preptag-logo{width:140px;flex-shrink:0}
.company-home #company{font-size:14px;overflow-wrap:anywhere}
.preptag-icon{display:inline-block;width:36px;height:36px;object-fit:contain;vertical-align:middle;flex-shrink:0}
.brand-feature-icon{width:44px;height:44px;margin-bottom:14px}
.legal-footer .preptag-logo{width:140px}
.brand-footer{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:12px;color:var(--royal-blue-dark);text-decoration:none;font-weight:700}
@media(max-width:600px){.brand .preptag-logo{width:145px}.admin-brand .preptag-logo{width:145px}.company-home{align-items:flex-start;flex-direction:column;gap:5px}.company-home .preptag-logo{width:120px}.brand-login .preptag-logo{width:190px}}
@media print{.brand-footer{display:none}}

.brand::before{display:none}

/* onboarding.css */
.product-intro{max-width:780px;margin:44px 0 30px}.product-intro h1{font-size:clamp(30px,5vw,48px);line-height:1.12;letter-spacing:-1px}.product-intro p{line-height:1.65}.eyebrow{font-size:12px;font-weight:800;letter-spacing:2px;color:#233faf}.product-grid,.plan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.product-card,.plan-card{border:1px solid #dce3f2;border-radius:18px;background:#fff;padding:24px;min-width:0}.product-card summary{cursor:pointer;list-style:none;display:flex;gap:16px;justify-content:space-between;align-items:flex-start}.product-card summary::after{content:'Meer info';font-size:13px;font-weight:600;white-space:nowrap;color:#233faf}.product-card[open] summary::after{content:'Minder info'}.product-card h2{font-size:21px;margin:0 0 12px}.product-price{display:block;font-size:26px;font-weight:800;color:#233faf}.product-card ul{padding-left:20px;line-height:1.7}.product-actions,.wizard-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px;align-items:center}.product-actions.card{margin-top:28px}.plan-card{display:block;cursor:pointer}.plan-card:has(input:checked){border:2px solid #233faf;padding:23px;background:#f5f7ff}.plan-card input{width:auto;margin-right:10px}.plan-card strong{font-size:18px}.plan-card .product-price{margin:14px 0 5px}.plan-card p{margin:8px 0;line-height:1.5}.onboarding-page{padding-bottom:40px}.onboarding-steps{list-style:none;display:flex;gap:12px;padding:0;margin:24px 0}.onboarding-steps li{flex:1;padding:12px;border-bottom:3px solid #dce3f2;color:#62708b}.onboarding-steps li[aria-current]{border-color:#233faf;color:#233faf;font-weight:700}.onboarding-panel{padding:28px!important}.onboarding-panel h2{margin-top:0}.onboarding-panel .grid,.contact-section .grid,.callback-dialog .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.onboarding-panel label,.contact-section label,.callback-dialog label{display:block;font-weight:600}.onboarding-panel input,.onboarding-panel select,.contact-section input,.contact-section textarea,.callback-dialog input,.callback-dialog textarea{display:block;width:100%;box-sizing:border-box;margin-top:7px;border:1px solid #bdc8df;border-radius:9px;padding:12px;font:inherit;background:#fff;color:#17213b}.field{margin-bottom:16px}.check-row{display:flex!important;gap:10px;align-items:flex-start;margin:20px 0;font-weight:400!important}.check-row input{width:19px;height:19px;margin:2px 0;flex:0 0 auto}.price-summary{padding:22px;background:#f2f5fc;border-radius:14px;margin-top:22px}.price-summary p{display:flex;justify-content:space-between;gap:20px;margin:10px 0}.price-summary .total{border-top:1px solid #cad4ea;padding-top:14px;font-size:20px;font-weight:800;color:#233faf}.price-summary small,.muted{color:#55647e;line-height:1.5}.notice{padding:16px;background:#edf2ff;border-left:3px solid #233faf;border-radius:6px;line-height:1.6}.form-error{color:#aa243b}.form-success{color:#176345}.cart-line{display:flex;gap:20px;justify-content:space-between;border-bottom:1px solid #e1e7f2;padding:14px 0}.cart-line small{display:block;margin-top:5px}.billing-preview{line-height:1.7;overflow-wrap:anywhere}.contact-section{margin:44px auto}.contact-section>.card{padding:30px}.contact-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.callback-dialog{border:0;border-radius:20px;padding:28px;width:min(560px,calc(100% - 32px));box-sizing:border-box;max-height:90vh;box-shadow:0 20px 80px #10215050}.callback-dialog::backdrop{background:#14244399}.dialog-heading{display:flex;justify-content:space-between;gap:12px;align-items:center}.dialog-heading h2{margin:0}.public-topbar .nav{flex-wrap:wrap}.onboarding-panel button:disabled{opacity:.55;cursor:wait}.legal-footer{margin-top:40px}.contact-section textarea,.callback-dialog textarea{resize:vertical}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #7b96ef;outline-offset:3px}@media(max-width:600px){.product-grid,.plan-grid,.onboarding-panel .grid,.contact-section .grid,.callback-dialog .grid{grid-template-columns:1fr}.onboarding-panel,.contact-section>.card{padding:20px!important}.onboarding-steps{gap:5px;font-size:13px}.onboarding-steps li{padding:10px 2px}.public-topbar{flex-wrap:wrap;gap:15px}.public-topbar .nav{gap:14px}.product-card,.plan-card{padding:20px}.plan-card:has(input:checked){padding:19px}.callback-dialog{padding:20px}.price-summary{padding:15px}.price-summary p{gap:10px}.product-intro{margin-top:30px}.wizard-actions .btn{flex:1;text-align:center}}

.onboarding-panel .plan-card input{display:inline-block;width:auto;margin:0 10px 0 0}.onboarding-panel .plan-card{font-weight:400}.product-actions .button-row{display:flex;flex-wrap:wrap;gap:12px}

.product-grid{align-items:start}.cart-line>strong,.price-summary strong,.price-summary .total>span:last-child{white-space:nowrap;flex-shrink:0}.cart-line>span,.price-summary p>span:first-child{min-width:0}@media(max-width:400px){.wizard-actions{flex-direction:column;align-items:stretch}.wizard-actions .btn{width:100%}.price-summary .total{font-size:17px}.product-card,.plan-card{padding:18px}.plan-card:has(input:checked){padding:17px}}

.contact-section{max-width:720px;margin:28px auto}.contact-section>.card{padding:24px}.contact-section h2{font-size:24px;margin:8px 0}.contact-section .field{margin-bottom:12px}.contact-section input,.contact-section textarea{padding:9px 11px}.contact-section [data-human-check]{margin:12px 0}.contact-section [data-form-status]:empty{display:none}[data-contact-form] button:disabled{opacity:.55;cursor:not-allowed}

.address-question{border:0;padding:0;margin:24px 0 12px}.address-question legend{font-weight:600}.same-options{display:flex;gap:24px;margin-top:10px}.onboarding-panel .same-options label{display:flex;align-items:center;gap:8px}.onboarding-panel .same-options input{width:18px;height:18px;margin:0}.extra-address{border:1px solid #dce3f2;border-radius:12px;padding:18px;margin:16px 0}.extra-address[hidden]{display:none}.extra-address legend{font-weight:600;padding:0 6px}.field small{display:block;font-size:12px;margin-top:5px}

.product-go{display:flex;justify-content:flex-end;padding:0 24px 24px}

.product-printer-choice{margin:20px 0}.product-printer-choice label{display:block;font-weight:600}.product-printer-choice input{display:block;width:100%;max-width:180px;padding:10px;border:1px solid #bdc8df;border-radius:8px;margin-top:8px;font:inherit}.product-printer-choice p{line-height:1.6;color:#55647e}.product-go a[aria-disabled="true"]{opacity:.5}

body > .wrap:has(> .public-topbar){width:100%;max-width:none}.public-topbar{padding-inline:var(--gutter)}

.onboarding-discount{display:flex;align-items:flex-end;flex-wrap:wrap;gap:12px;margin-bottom:20px;padding-bottom:18px;border-bottom:1px solid #cad4ea}.onboarding-discount .field{margin:0;flex:1 1 180px}.onboarding-discount .field:nth-child(2){flex:0 1 180px}.onboarding-discount .btn{margin-bottom:1px}@media(max-width:600px){.onboarding-discount .field,.onboarding-discount .field:nth-child(2){flex:1 1 120px}.onboarding-discount .btn{width:100%}}
.lease-checkout-notice p{margin-top:0}.lease-checkout-dialog{box-sizing:border-box;width:min(780px,calc(100% - 24px));max-height:90dvh;padding:24px;border:1px solid #dce3f2;border-radius:16px;overflow:auto;color:#172c49}.lease-checkout-dialog::backdrop{background:#14244399}.lease-checkout-dialog h2{font-size:22px}.lease-checkout-dialog .dialog-heading{align-items:flex-start}.lease-checkout-dialog section p{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6}.lease-checkout-dialog h3{color:#003e93}.lease-checkout-dialog .wizard-actions{justify-content:flex-end}@media(max-width:600px){.lease-checkout-dialog{padding:16px}.lease-checkout-dialog .dialog-heading{flex-wrap:wrap}}

/* home-community.css */
.reviews-band{background:var(--royal-blue,#233faf);color:#fff;padding:56px 0;margin-top:40px}.reviews-band h2,.reviews-band h3{color:#fff}.reviews-band .eyebrow{color:#ffe0c4}.reviews-intro{max-width:680px}.reviews-intro h2,.home-faq h2{font-size:clamp(27px,4vw,38px);margin:10px 0 16px}.reviews-band p{line-height:1.65}.reviews-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:26px 0}.review-card{background:#ffffff12;border:1px solid #ffffff45;border-radius:16px;padding:22px;min-width:0}.review-card blockquote{margin:12px 0;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7}.review-card>p:last-child{font-weight:700;overflow-wrap:anywhere}.review-stars{color:#ffe0a3;letter-spacing:3px}.review-compose{max-width:720px;margin-top:24px}.review-compose>summary{cursor:pointer;font-weight:700;padding:12px 0}.review-compose form{background:#fff;color:#17213b;border-radius:16px;padding:24px;margin-top:12px}.review-compose label{display:block;margin-bottom:14px}.review-compose input:not([type=checkbox]),.review-compose select,.review-compose textarea{display:block;width:100%;box-sizing:border-box;font:inherit;padding:10px;border:1px solid #bdc8df;border-radius:8px;margin-top:6px}.review-compose textarea{resize:vertical}.review-compose .review-consent{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.5}.review-consent input{width:18px;height:18px;flex:0 0 auto;margin-top:3px}.review-compose [data-review-check]{margin:14px 0}.review-compose button:disabled{opacity:.5}.home-faq{max-width:900px;padding:56px 0}.home-faq details{border-bottom:1px solid #dce3f2;padding:19px 0}.home-faq summary{font-weight:700;cursor:pointer;font-size:18px;line-height:1.5}.home-faq details p{line-height:1.8;margin:14px 0 4px;color:#46536c}.home-faq u{text-decoration-color:#8c9dcc;text-underline-offset:3px}.home-faq a{color:#233faf;text-decoration:underline;text-underline-offset:3px;font-weight:600}.faq-intro{color:#55647e;line-height:1.7}@media(max-width:760px){.reviews-grid{grid-template-columns:1fr}.reviews-band{padding:36px 0}.home-faq{padding:36px 0}.review-compose form{padding:18px}}

html[lang="da"] .product-card summary::after{content:"Mere info"}html[lang="da"] .product-card[open] summary::after{content:"Mindre info"}

.lease-disclosure{display:block;margin:12px 0 4px;font-size:14px;font-weight:700;line-height:1.5}.lease-disclosure a{color:#173c90;text-decoration:underline;text-underline-offset:3px}.product-card summary .lease-disclosure{font-size:13px}.home-faq summary .lease-disclosure{font-weight:600}

.cart-line:has(>.lease-disclosure){flex-wrap:wrap}.cart-line>.lease-disclosure{flex-basis:100%}

.home-faq{max-width:1100px}.faq-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start;margin-top:26px}.home-faq .faq-grid details{border:1px solid #dce3f2;border-radius:18px;background:#fff;padding:24px;min-width:0}.home-faq .faq-grid summary{list-style:none;display:block;font-size:21px;overflow-wrap:anywhere}.home-faq .faq-grid summary::-webkit-details-marker{display:none}.home-faq .faq-grid summary::after{content:"Klik voor het antwoord";display:block;margin-top:16px;color:#233faf;font-size:13px;font-weight:600}.home-faq .faq-grid details[open] summary::after{content:"Antwoord sluiten"}.home-faq .faq-grid details p{overflow-wrap:anywhere}
html[lang="en"] .faq-grid summary::after{content:"Click for the answer"}html[lang="en"] .faq-grid details[open] summary::after{content:"Close answer"}html[lang="de"] .faq-grid summary::after{content:"Klicken für die Antwort"}html[lang="de"] .faq-grid details[open] summary::after{content:"Antwort schließen"}html[lang="fr"] .faq-grid summary::after{content:"Cliquez pour la réponse"}html[lang="fr"] .faq-grid details[open] summary::after{content:"Fermer la réponse"}html[lang="da"] .faq-grid summary::after{content:"Klik for at se svaret"}html[lang="da"] .faq-grid details[open] summary::after{content:"Luk svaret"}
@media(max-width:1000px){.faq-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.faq-grid{grid-template-columns:1fr}.home-faq .faq-grid details{padding:20px}}

.home-blue-divider{height:40px;background:var(--royal-blue,#233faf);width:100%}

.home-blue-divider + .contact-section{margin-top:54px}

.reviews-grid{display:block;overflow:hidden}.reviews-track{display:flex;align-items:flex-start;transition:transform 1.2s ease-in-out}.reviews-track>.review-card{flex:0 0 100%;box-sizing:border-box}.review-stars{color:#f58220}.review-rating{border:0;padding:0;margin:0 0 16px}.review-rating legend{font-weight:600}.review-rating-options{display:flex;gap:8px;margin-top:6px}.review-compose .review-rating-star{position:relative;display:block;margin:0;cursor:pointer}.review-compose .review-rating-star input{position:absolute;width:1px;height:1px;opacity:0;padding:0;margin:0}.review-rating-star span{display:flex;align-items:center;justify-content:center;width:44px;height:48px;font-size:38px;color:#69778b;border-radius:6px}.review-rating-star.selected span{color:#f58220}.review-rating-star:has(input:focus-visible) span{outline:3px solid #233faf;outline-offset:2px}/* Compact review cards arranged around a three-dimensional orbit. */
.reviews-grid{perspective:1000px;padding:22px 0;margin:20px 0}.reviews-track{position:relative;display:block;transform-style:preserve-3d;transition:none;min-height:0}.reviews-track>.review-card{width:min(360px,78%);margin:0 auto;padding:18px 22px;background:#2949a9;border:1px solid #ffffff70;box-shadow:0 16px 30px #071b3d35}.reviews-carousel .review-card{position:absolute;left:50%;top:0;margin:0;will-change:transform,opacity}.review-card blockquote{font-size:15px;line-height:1.6;max-height:168px;overflow-y:auto;overscroll-behavior:contain}.review-card .review-stars{margin:0 0 8px}.review-card>p:last-child{margin:12px 0 0}.reviews-carousel:focus-visible{outline:2px solid #f58220;outline-offset:4px}.reviews-static .reviews-track{height:auto!important;display:flex;gap:18px;overflow-x:auto;min-height:0;padding-bottom:12px}.reviews-static .review-card{position:relative;left:auto;flex:0 0 min(360px,85%);margin:0;will-change:auto}@media(max-width:600px){.reviews-track>.review-card{width:78%;padding:16px}.reviews-track{min-height:0}.review-card blockquote{font-size:14px}}

html[lang="en"] .product-card summary::after{content:"More info"}html[lang="en"] .product-card[open] summary::after{content:"Less info"}html[lang="de"] .product-card summary::after{content:"Mehr Infos"}html[lang="de"] .product-card[open] summary::after{content:"Weniger Infos"}html[lang="fr"] .product-card summary::after{content:"En savoir plus"}html[lang="fr"] .product-card[open] summary::after{content:"Réduire"}

.home-questions{padding:0 0 32px;max-width:1100px}.home-questions>h2{font-size:1.25rem;margin-bottom:16px}.home-questions-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.home-questions-grid .card{padding:20px}.home-questions-grid h3{font-size:1rem;line-height:1.4;margin:0 0 10px}.home-questions-grid p{font-size:.9rem;line-height:1.7;color:#46536c}.home-questions-grid a{font-size:.85rem;font-weight:650;text-decoration:underline;text-underline-offset:.2em}@media(max-width:600px){.home-questions-grid{grid-template-columns:1fr}.home-questions-grid .card{padding:18px}}

.employee-app-thumbnail{display:block;width:300px;max-width:100%;height:auto;border:1px solid var(--border);border-radius:10px;margin-top:12px}

.reviews-track:focus-visible{outline:2px solid #003e93;outline-offset:2px}

.handbook-card{margin-top:14px}.home-questions-grid+.handbook-card{padding:20px}.handbook-card>h3{margin:0 0 16px;font-size:1rem}.handbook-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.handbook-points h4{margin:0 0 8px;font-size:.95rem;line-height:1.5}.handbook-card p{font-size:.9rem;line-height:1.7;color:#46536c}.handbook-card .handbook-note{font-size:.8rem;margin-top:18px}.handbook-links{display:flex;gap:16px;flex-wrap:wrap}.handbook-links a{font-size:.85rem;font-weight:650;text-decoration:underline;text-underline-offset:.2em}@media(max-width:760px){.handbook-points{grid-template-columns:1fr;gap:10px}}

/* admin-navigation.css */
.administration-page .admin-layout { display: block; }
:is(.administration-page .admin-navigation, .public-navigation) { position: sticky; top: 0; z-index: 35; display: flex; align-items: center; gap: 24px; padding: 12px var(--gutter); background: #fff; border-bottom: 1px solid var(--border); box-shadow: 0 4px 20px #07378608; }
.admin-navigation-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.admin-navigation > .language-picker { margin-left: auto; }
.admin-navigation > .language-picker + .account-control { margin-left: 0; }
@media (max-width: 600px) {
  .administration-page .admin-navigation .admin-menu-toggle { font-size: 0; gap: 0; padding: 8px; min-height: 36px; }
  .administration-page .admin-navigation .admin-brand .preptag-logo { width: 100px; }
}
@media (max-width: 380px) {
  .administration-page .admin-navigation .admin-brand .preptag-logo { width: 74px; }
  .administration-page .admin-navigation-top { gap: 6px; }
  .administration-page .admin-navigation .admin-menu-toggle { padding-inline: 7px; }
}
.admin-brand { color: var(--royal-blue); font-size: 25px; font-weight: 800; letter-spacing: -1px; white-space: nowrap; }
.admin-brand span { color: var(--orange); }
.admin-brand:hover { text-decoration: none; }
:is(.administration-page .admin-navigation, .public-navigation) .side { position: static; height: auto; padding: 0; flex: 1; min-width: 0; overflow: visible; border: 0; background: transparent; }
:is(.admin-navigation, .public-navigation) .side h2 { display: none; }
:is(.administration-page .admin-navigation, .public-navigation) .side nav { display: flex; flex-wrap: wrap; gap: 4px; padding: 0; overflow: visible; }
:is(.administration-page .admin-navigation, .public-navigation) .side nav a { min-height: 44px; padding: 10px 13px; border-radius: 9px; font-size: 14px; color: var(--ink); white-space: normal; }
:is(.administration-page .admin-navigation, .public-navigation) .side nav a:hover { background: var(--surface-soft); color: var(--royal-blue); }
:is(.administration-page .admin-navigation, .public-navigation) .side nav a:is([aria-current="page"],[aria-current="location"]) { color: var(--royal-blue-dark); background: var(--royal-blue-soft); box-shadow: inset 0 -3px var(--orange); }
.administration-page .main { margin-inline: auto; max-width: 1680px; padding-top: 28px; }
:is(.admin-navigation, .public-navigation) .admin-menu-toggle, :is(.admin-navigation, .public-navigation) .admin-menu-close, :is(.admin-navigation, .public-navigation) .admin-menu-overlay { display: none; }
:is(.admin-navigation, .public-navigation) :is(a, button):focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
@media (max-width: 1200px) {
  :is(.administration-page .admin-navigation, .public-navigation) { display: flex; gap: 10px; padding-block: 10px; }
  .admin-navigation-top { flex: 1; min-width: 0; gap: 8px; }
  :is(.admin-navigation, .public-navigation) .admin-menu-toggle { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 14px; background: var(--royal-blue); color: white; border: 0; border-radius: 10px; font-weight: 650; }
  .hamburger { width: 18px; height: 14px; border-block: 2px solid currentColor; position: relative; }
  .hamburger::after { content: ''; position: absolute; inset: 5px 0 auto; border-top: 2px solid currentColor; }
  :is(.administration-page .admin-navigation, .public-navigation) .side { position: fixed; inset: 0 auto 0 0; width: min(350px, 88vw); height: 100vh; height: 100dvh; padding: max(20px, env(safe-area-inset-top)) 20px max(24px, env(safe-area-inset-bottom)); background: white; z-index: 2; overflow-y: auto; overscroll-behavior: contain; transform: translateX(-100%); visibility: hidden; transition: transform .24s ease, visibility .24s; box-shadow: 12px 0 50px #07378626; }
  :is(.administration-page .admin-navigation, .public-navigation).menu-open .side { transform: translateX(0); visibility: visible; }
  :is(.admin-navigation, .public-navigation) .side h2 { display: block; padding: 12px 4px 20px; margin: 0; color: var(--royal-blue-dark); font-size: 19px; overflow-wrap: anywhere; }
  :is(.administration-page .admin-navigation, .public-navigation) .side nav { display: flex; flex-direction: column; gap: 7px; }
  :is(.administration-page .admin-navigation, .public-navigation) .side nav a { min-height: 48px; padding: 12px 14px; font-size: 16px; }
  :is(.admin-navigation, .public-navigation) .admin-menu-close { display: block; margin-left: auto; min-height: 44px; padding: 10px 12px; border: 1px solid var(--border); background: white; color: var(--royal-blue); }
  :is(.admin-navigation, .public-navigation) .admin-menu-overlay { display: block; position: fixed; inset: 0; width: 100%; height: 100%; border: 0; border-radius: 0; background: #071b3d73; opacity: 0; visibility: hidden; transition: opacity .24s ease, visibility .24s; }
  :is(.admin-navigation, .public-navigation).menu-open .admin-menu-overlay { opacity: 1; visibility: visible; }
  body.admin-menu-open { overflow: hidden; }
}
@media (prefers-reduced-motion: reduce) {
  :is(.administration-page .admin-navigation, .public-navigation) .side, :is(.admin-navigation, .public-navigation) .admin-menu-overlay { transition: none; }
}

.payment-mode-control{display:inline-flex;align-items:center;gap:12px;position:relative;cursor:pointer;min-height:48px}
.payment-mode-control input{position:absolute;width:52px;height:30px;opacity:0;margin:0}
.payment-mode-slider{pointer-events:none;width:52px;height:30px;border-radius:20px;background:#667085;position:relative;transition:background .15s}
.payment-mode-slider::after{content:"";position:absolute;top:4px;left:4px;width:22px;height:22px;border-radius:50%;background:white;transition:transform .15s}
.payment-mode-control input:checked+.payment-mode-slider{background:var(--royal-blue)}
.payment-mode-control input:checked+.payment-mode-slider::after{transform:translateX(22px)}
.payment-mode-control input:focus-visible+.payment-mode-slider{outline:3px solid var(--orange);outline-offset:3px}
.payment-mode-control input:disabled+.payment-mode-slider{opacity:.5}

@media (max-width: 380px) {
  :is(.admin-navigation, .public-navigation) .admin-brand .preptag-logo { width: 110px; }
  :is(.admin-navigation, .public-navigation) .admin-menu-toggle { padding-inline: 10px; gap: 6px; }
}

.public-navigation>.side{margin-left:auto}.public-navigation .side nav{margin-left:0}.public-navigation .public-menu-heading{display:none}@media(max-width:1200px){.public-navigation.topbar{flex-wrap:nowrap;align-items:center}.public-navigation .admin-menu-toggle{margin-left:auto}.public-navigation .side nav{align-items:stretch;justify-content:flex-start;max-width:none}.public-navigation .side .home-language{margin-top:12px}.public-navigation .side .language-picker{align-self:flex-start}.public-navigation .public-menu-heading{display:block}.public-navigation .side .language-options{left:0;right:auto}.public-navigation .preptag-logo{width:165px}}

.public-navigation .side nav a.current-page-link{display:none}@media(max-width:1200px){.public-navigation .side nav a.current-page-link{display:flex}}
/* Compact customer rows on the printerservers page. */
#serverCards{display:grid;gap:10px}
#serverCards .server-card{padding:0;margin:0;overflow:hidden}
#serverCards .server-card[hidden]{display:none}
#serverCards .server-card-summary{display:grid;grid-template-columns:14px minmax(0,1fr) auto;align-items:center;gap:12px;padding:17px 22px;cursor:pointer;list-style:none}
#serverCards .server-card-summary::-webkit-details-marker{display:none}
#serverCards .server-card-summary::before{content:'';width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);transition:transform .15s}
#serverCards .server-card[open]>.server-card-summary::before{transform:rotate(45deg)}
#serverCards .server-customer-name{font-weight:700;font-size:17px;overflow-wrap:anywhere}
#serverCards .server-customer-code{font-size:14px;font-weight:600;color:var(--muted);white-space:nowrap}
#serverCards .server-card[open]>.server-card-summary{border-bottom:1px solid var(--border)}
#serverCards .server-card-content{padding:6px 24px 24px}
@media(max-width:600px){#serverCards .server-card-summary{padding:15px;gap:9px}#serverCards .server-customer-name{font-size:15px}#serverCards .server-customer-code{font-size:12px}#serverCards .server-card-content{padding:4px 15px 18px}}

@media(max-width:1200px){
 :is(.administration-page .admin-navigation,.public-navigation) .admin-menu-toggle{min-height:29px;padding:6px 9px;gap:6px;border-radius:7px;font-size:10px}
 :is(.admin-navigation,.public-navigation) .hamburger{width:12px;height:9px;border-block-width:1.3px}
 :is(.admin-navigation,.public-navigation) .hamburger::after{inset:3px 0 auto;border-top-width:1.3px}
 :is(.administration-page .admin-navigation,.public-navigation) .side{width:min(175px,88vw);box-sizing:border-box;padding-inline:10px}
 :is(.administration-page .admin-navigation,.public-navigation) .side nav a{padding:8px 6px;min-height:36px;font-size:14px;overflow-wrap:anywhere;hyphens:auto}
 :is(.admin-navigation,.public-navigation) .side h2{font-size:15px;padding:10px 0}
 :is(.admin-navigation,.public-navigation) .admin-menu-close{min-height:29px;padding:6px 8px;font-size:11px}
 :is(.admin-navigation,.public-navigation) .side>.language-picker,:is(.admin-navigation,.public-navigation) .side>.currency-language-stack{margin:8px 0}
}
@media(max-width:600px){.administration-page .admin-navigation .admin-menu-toggle{font-size:0;min-height:24px;padding:5px;gap:0}}

/* Reserve the compact header layout before the drawer is mounted. */
@media(max-width:1200px){.home-topbar:not(.public-navigation)>.nav{display:none}.home-topbar:not(.public-navigation){padding-block:10px;min-height:88px}}

/* home-video.css */
.home-demo-video{padding:24px 0 8px;text-align:center}.home-demo-video-player{display:inline-block;position:relative;max-width:100%}.home-demo-video video{display:block;width:auto;max-width:min(100%,18.28125vh);max-height:32.5vh;margin:auto;border-radius:12px;background:#fff}.home-video-dialog{width:fit-content;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:12px;border:1px solid #dce3ed;border-radius:12px;overflow:auto}.home-video-dialog::backdrop{background:#071b3dcc}.home-video-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px}.home-video-dialog-heading h2{font-size:16px;margin:0}.home-video-dialog-heading button{min-height:32px;padding:5px 9px;font-size:12px}.home-video-dialog video{display:block;width:auto;max-width:100%;max-height:calc(100dvh - 100px);background:#fff}@media(max-width:600px){.home-demo-video{padding:16px 0 0}.home-video-dialog{padding:8px}}

.home-demo-video video{cursor:pointer}.home-demo-video video:focus-visible{outline:3px solid #f58220;outline-offset:4px}

@media(min-width:1201px){.hero-with-video{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:48px}.hero-with-video .hero-copy{min-width:0}.hero-with-video>.home-demo-video{width:auto;max-width:none;margin:0;padding:0;justify-self:end;align-self:center}.hero-with-video .home-demo-video-player{display:block}}

.home-demo-video-player{overflow:hidden;border:1px solid #fff;border-radius:12px;background:transparent}.home-demo-video video{border-radius:0;background:transparent}

.home-demo-video-player{width:min(324px,18.28125vh);padding:0;line-height:0}.home-demo-video-player>video{width:100%;max-width:100%;height:auto;margin:0}

button.home-demo-video-player{display:inline-block;min-height:0;padding:0;aspect-ratio:9/16;vertical-align:middle;background:transparent;color:inherit;overflow:hidden;transition:none}button.home-demo-video-player:hover{background:transparent}button.home-demo-video-player:focus-visible{outline:3px solid #f58220;outline-offset:4px}.home-demo-video-player>video{height:100%;object-fit:cover}.step-title{font-size:1.1rem}

@media(min-width:1201px){.hero-with-video{grid-template-columns:minmax(0,1fr) min(324px,18.28125vh);min-height:32.5vh}}

/* public-assistant.css */
.public-assistant{--assistant-bottom:20px;position:fixed;right:86px;bottom:var(--assistant-bottom);z-index:900;color:#172033;font-family:Arial,sans-serif}.assistant-launch{display:flex;align-items:center;gap:6px;padding:7px 10px;min-height:38px;border:1px solid #dce3ed;border-radius:22px;background:#073786;color:white;font-size:12px;box-shadow:0 3px 14px #07378626}.assistant-launch:hover{background:#0b4dbb}.assistant-launch img{display:block}.assistant-panel{position:absolute;right:-66px;bottom:48px;width:min(320px,calc(100vw - 24px));max-height:min(470px,calc(100dvh - var(--assistant-bottom) - 65px));overflow:auto;background:#fff;border:1px solid #dce3ed;border-radius:14px;box-shadow:0 8px 30px #07378630;padding:12px;box-sizing:border-box}.assistant-panel[hidden]{display:none}.assistant-panel header{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#073786;font-size:14px}.assistant-panel button{min-height:30px;padding:5px 8px;border-radius:7px;font-size:12px;border:1px solid #dce3ed;background:#eaf2ff;color:#073786;cursor:pointer}.assistant-panel .assistant-close{font-size:22px;line-height:1;min-width:30px;background:white}.assistant-panel button:disabled{opacity:.5;cursor:default}.assistant-voice{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:8px 0}.assistant-voice label{display:flex;align-items:center;gap:4px;font-size:11px;margin:0;font-weight:400}.assistant-voice input{width:15px;height:15px;min-height:0;padding:0;margin:0}.assistant-mic-note{font-size:10px;line-height:1.4;color:#667085;margin:4px 0 8px}.assistant-messages{height:190px;overflow:auto;overscroll-behavior:contain;font-size:12px;line-height:1.5}.assistant-message{margin:6px 0;padding:8px 10px;border-radius:10px;overflow-wrap:anywhere}.assistant-message p{margin:0;font-size:12px;line-height:1.5}.assistant-message.bot{background:#eaf2ff}.assistant-message.visitor{background:#fff1e6;margin-left:24px}.assistant-message a{display:inline-block;margin-top:4px;font-size:11px;text-decoration:underline}.assistant-question{display:flex;gap:6px;align-items:flex-end;margin-top:8px}.assistant-question textarea{width:100%;font-size:13px;min-height:46px;resize:vertical;padding:6px;border:1px solid #b8c5d8;border-radius:7px}.assistant-question button{background:#f58220;color:#073786;font-weight:700}.assistant-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:8px;gap:8px}.assistant-bottom a{font-size:12px}.assistant-status{font-size:11px;line-height:1.5;margin:4px 0}.assistant-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(max-width:600px){.public-assistant{right:78px}.assistant-panel{right:-58px}.assistant-question textarea{font-size:16px}.assistant-messages{height:160px}}@media print{.public-assistant{display:none}}

.public-assistant [hidden]{display:none!important}

.assistant-question button{flex:0 0 auto;white-space:nowrap;min-width:72px}.assistant-question textarea{flex:1;min-width:0;width:auto}

