.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}}