/*!*********************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./app/globals.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************/
/* App-specific overrides (design system loaded via layout.tsx) */

/* Portal month calendar (leave / attendance registration) */
.nilfish-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-gap: 0.35rem;
  gap: 0.35rem;
}

.nilfish-cal-day {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid color-mix(in srgb, var(--nilfish-fg, #111) 18%, transparent);
  background: color-mix(in srgb, var(--nilfish-bg, #fff) 92%, var(--nilfish-accent, #c45c26) 8%);
  color: inherit;
  border-radius: 0.45rem;
  min-height: 2.75rem;
  padding: 0.35rem;
  cursor: pointer;
  text-align: left;
}

.nilfish-cal-day:hover:not(:disabled) {
  border-color: var(--nilfish-accent, #c45c26);
}

.nilfish-cal-day-outside {
  opacity: 0.45;
}

.nilfish-cal-day-today {
  box-shadow: inset 0 0 0 2px var(--nilfish-accent, #c45c26);
}

.nilfish-cal-day-events {
  font-weight: 600;
}

.nilfish-cal-day-selected {
  background: color-mix(in srgb, var(--nilfish-accent, #c45c26) 22%, transparent);
  border-color: var(--nilfish-accent, #c45c26);
}

.nilfish-cal-day-num {
  font-weight: 700;
  font-size: 0.85rem;
}

.period-attest-cal-day--leave.nilfish-cal-day-events {
  box-shadow: inset 0 -3px 0 var(--nilfish-accent, #c45c26);
}
.period-attest-cal-day--attendance.nilfish-cal-day-events {
  box-shadow: inset 0 -3px 0 #2563eb;
}
.nilfish-cal-grid--page {
  margin-bottom: 0.75rem;
}

/* Storefront AI chat widget */
.nilfish-chat-widget {
  position: fixed;
  right: 2.25rem;
  bottom: 1rem;
  z-index: 80;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.65rem;
  pointer-events: none;
}

.nilfish-chat-widget > * {
  pointer-events: auto;
}

.nilfish-chat-fab {
  width: 4.5rem;
  height: 4.5rem;
  padding: 0.35rem;
  border: none;
  border-radius: 1.1rem;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  position: relative;
  display: grid;
  place-items: center;
  transition: transform 0.15s ease;
}

.nilfish-chat-fab:hover {
  transform: translateY(-2px);
}

.nilfish-chat-fab__icon {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  pointer-events: none;
  filter: drop-shadow(0 8px 18px color-mix(in srgb, #000 28%, transparent));
}

.nilfish-chat-fab__close {
  position: absolute;
  top: -0.15rem;
  right: -0.15rem;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  background: var(--nilfish-primary, #1b3a5c);
  color: #fff;
  font-size: 1rem;
  line-height: 1.25rem;
  text-align: center;
  box-shadow: 0 2px 8px color-mix(in srgb, #000 25%, transparent);
}

.nilfish-chat-fab--open .nilfish-chat-fab__icon {
  opacity: 0.92;
}

.nilfish-chat-panel {
  width: min(22.5rem, calc(100vw - 2rem));
  height: min(32rem, calc(100vh - 6rem));
  display: flex;
  flex-direction: column;
  background: var(--nilfish-bg, #fff);
  color: var(--nilfish-fg, #111);
  border: 1px solid color-mix(in srgb, var(--nilfish-fg, #111) 14%, transparent);
  border-radius: 0.85rem;
  overflow: hidden;
  box-shadow: 0 16px 40px color-mix(in srgb, #000 28%, transparent);
  position: relative;
}

.nilfish-chat-panel--free {
  position: fixed;
  z-index: 81;
  max-width: none;
  max-height: none;
}

.nilfish-chat-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.75rem 0.9rem;
  background: color-mix(in srgb, var(--nilfish-primary, #1b3a5c) 92%, #000);
  color: #fff;
  flex-shrink: 0;
}

.nilfish-chat-panel__header--drag {
  cursor: -webkit-grab;
  cursor: grab;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  touch-action: none;
}

.nilfish-chat-panel__header--drag:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

body.nilfish-chat-dragging {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

body.nilfish-chat-dragging iframe {
  pointer-events: none;
}

.nilfish-chat-panel__close {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.35);
  font-size: 1.25rem;
  line-height: 1;
  min-width: 2rem;
  cursor: pointer;
}

.nilfish-chat-panel__actions {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  flex-shrink: 0;
}

.nilfish-chat-panel__new {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.35);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.2;
  padding: 0.35rem 0.5rem;
  cursor: pointer;
  white-space: nowrap;
  opacity: 0.9;
}

.nilfish-chat-panel__new:hover:not(:disabled) {
  opacity: 1;
  text-decoration: underline;
}

.nilfish-chat-panel__new:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

/* Header sits on navy — keep ghost actions white even when storefront skin
   restyles .nilfish-site .btn-nilfish-ghost to charcoal (Lighthouse). */
.nilfish-chat-panel__header .btn-nilfish-ghost,
html[data-storefront-skin="lighthouse"] .nilfish-chat-panel__header .btn-nilfish-ghost,
html[data-storefront-skin="lighthouse"] .nilfish-site .nilfish-chat-panel__header .btn-nilfish-ghost {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.4);
  background: transparent;
}

.nilfish-chat-panel__header .btn-nilfish-ghost:hover,
.nilfish-chat-panel__header .btn-nilfish-ghost:focus,
html[data-storefront-skin="lighthouse"] .nilfish-chat-panel__header .btn-nilfish-ghost:hover,
html[data-storefront-skin="lighthouse"] .nilfish-chat-panel__header .btn-nilfish-ghost:focus,
html[data-storefront-skin="lighthouse"] .nilfish-site .nilfish-chat-panel__header .btn-nilfish-ghost:hover,
html[data-storefront-skin="lighthouse"] .nilfish-site .nilfish-chat-panel__header .btn-nilfish-ghost:focus {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.7);
  background: rgba(255, 255, 255, 0.1);
}

.nilfish-chat-resize {
  position: absolute;
  z-index: 2;
  touch-action: none;
}

.nilfish-chat-resize--n,
.nilfish-chat-resize--s {
  left: 0.75rem;
  right: 0.75rem;
  height: 0.45rem;
  cursor: ns-resize;
}

.nilfish-chat-resize--n {
  top: 0;
}

.nilfish-chat-resize--s {
  bottom: 0;
}

.nilfish-chat-resize--e,
.nilfish-chat-resize--w {
  top: 0.75rem;
  bottom: 0.75rem;
  width: 0.45rem;
  cursor: ew-resize;
}

.nilfish-chat-resize--e {
  right: 0;
}

.nilfish-chat-resize--w {
  left: 0;
}

.nilfish-chat-resize--ne,
.nilfish-chat-resize--nw,
.nilfish-chat-resize--se,
.nilfish-chat-resize--sw {
  width: 0.85rem;
  height: 0.85rem;
}

.nilfish-chat-resize--ne {
  top: 0;
  right: 0;
  cursor: nesw-resize;
}

.nilfish-chat-resize--nw {
  top: 0;
  left: 0;
  cursor: nwse-resize;
}

.nilfish-chat-resize--se {
  bottom: 0;
  right: 0;
  cursor: nwse-resize;
}

.nilfish-chat-resize--sw {
  bottom: 0;
  left: 0;
  cursor: nesw-resize;
}

.nilfish-chat-panel__body {
  flex: 1 1;
  overflow: auto;
  padding: 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  background: color-mix(in srgb, var(--nilfish-bg, #fff) 92%, var(--nilfish-primary, #1b3a5c) 8%);
  min-height: 0;
}

.nilfish-chat-bubble {
  max-width: 92%;
  padding: 0.65rem 0.75rem;
  border-radius: 0.75rem;
  background: #fff;
  border: 1px solid color-mix(in srgb, var(--nilfish-fg, #111) 10%, transparent);
}

.nilfish-chat-bubble p {
  margin: 0;
  white-space: pre-wrap;
  line-height: 1.4;
}

.nilfish-chat-bubble--user {
  align-self: flex-end;
  background: color-mix(in srgb, var(--nilfish-accent, #c45c26) 18%, #fff);
}

.nilfish-chat-bubble--assistant {
  align-self: flex-start;
}

.nilfish-chat-bubble--staff {
  align-self: flex-start;
  border-color: color-mix(in srgb, var(--nilfish-accent, #c45c26) 35%, transparent);
  background: color-mix(in srgb, var(--nilfish-accent, #c45c26) 10%, #fff);
}

.nilfish-chat-bubble--system {
  align-self: center;
  max-width: 100%;
  background: transparent;
  border-style: dashed;
  font-size: 0.85rem;
  color: color-mix(in srgb, var(--nilfish-fg, #111) 65%, transparent);
}

.nilfish-chat-staff-label {
  display: block;
  font-size: 0.75rem;
  margin-bottom: 0.2rem;
}

.nilfish-chat-panel__identity {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}

.nilfish-chat-panel__avatar {
  border-radius: 999px;
  flex-shrink: 0;
}

.nilfish-chat-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
  margin-top: 0.25rem;
}

.nilfish-chat-card__btn {
  font-size: 0.8rem;
  padding: 0.25rem 0.55rem;
}

.nilfish-chat-handoff {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  padding: 0.75rem;
  border-radius: 0.75rem;
  border: 1px dashed color-mix(in srgb, var(--nilfish-accent, #c45c26) 40%, transparent);
  background: color-mix(in srgb, var(--nilfish-accent, #c45c26) 8%, #fff);
}

.nilfish-chat-handoff p {
  margin: 0;
  font-size: 0.9rem;
}

.nilfish-chat-flash {
  margin: 0;
  font-size: 0.85rem;
  color: color-mix(in srgb, var(--nilfish-fg, #111) 70%, #0a7a3e 30%);
}

.nilfish-chat-bubble--typing {
  opacity: 0.7;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.nilfish-chat-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.55rem;
}

.nilfish-chat-chip {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid color-mix(in srgb, var(--nilfish-ink, #0f172a) 18%, transparent);
  background: #fff;
  border-radius: 999px;
  padding: 0.3rem 0.65rem;
  font: inherit;
  font-size: 0.85rem;
  cursor: pointer;
  color: var(--nilfish-ink, #0f172a);
}

.nilfish-chat-chip:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--nilfish-accent, #c45a12) 45%, transparent);
  background: color-mix(in srgb, var(--nilfish-accent, #c45a12) 8%, #fff);
}

.nilfish-chat-chip:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

html[data-storefront-skin="lighthouse"] .nilfish-chat-chip {
  border-radius: 0;
  background: #fff;
  border-color: var(--nilfish-border, #e2e8f0);
  color: var(--nilfish-ink, #0f172a);
}

html[data-storefront-skin="lighthouse"] .nilfish-chat-chip:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--nilfish-ink, #0f172a) 35%, transparent);
  background: color-mix(in srgb, var(--nilfish-ink, #0f172a) 4%, #fff);
}

html[data-storefront-skin="plasma"] .nilfish-chat-chip {
  background: color-mix(in srgb, var(--nilfish-accent, #c45a12) 28%, #1a1a22);
  border-color: rgba(255, 255, 255, 0.22);
  color: #f4f4f7;
}

html[data-storefront-skin="plasma"] .nilfish-chat-chip:hover:not(:disabled) {
  background: color-mix(in srgb, var(--nilfish-accent, #c45a12) 42%, #1a1a22);
  border-color: rgba(var(--nilfish-accent-rgb, 196, 90, 18), 0.55);
}

html[data-storefront-skin="plasma"] .nilfish-chat-panel__body {
  background: #111116;
  color: #e8e8ed;
}

html[data-storefront-skin="plasma"] .nilfish-chat-bubble--assistant,
html[data-storefront-skin="plasma"] .nilfish-chat-bubble--bot {
  background: #1a1a22;
  color: #f4f4f7;
  border-color: rgba(255, 255, 255, 0.1);
}

/* Light peach bubbles inherit body #e8e8ed otherwise — force dark ink */
html[data-storefront-skin="plasma"] .nilfish-chat-bubble--user,
html[data-storefront-skin="plasma"] .nilfish-chat-bubble--staff {
  color: #111116;
}

.nilfish-chat-cards {
  list-style: none;
  margin: 0.55rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.nilfish-chat-card {
  display: grid;
  grid-template-columns: 3.25rem 1fr;
  grid-gap: 0.55rem;
  gap: 0.55rem;
  padding: 0.45rem;
  border-radius: 0.55rem;
  background: color-mix(in srgb, var(--nilfish-bg, #fff) 94%, #000 6%);
  /* Cards stay light; do not inherit assistant bubble ink (plasma = light-on-dark). */
  color: var(--nilfish-fg, #111);
}

html[data-storefront-skin="plasma"] .nilfish-chat-card {
  background: #f4f4f7;
  color: #111116;
  border: 1px solid rgba(0, 0, 0, 0.08);
}

html[data-storefront-skin="plasma"] .nilfish-chat-card .nilfish-muted {
  color: color-mix(in srgb, #111116 58%, transparent);
}

/* Book/slot chips sit on light cards — use dark ink, not plasma dark-chip style */
html[data-storefront-skin="plasma"] .nilfish-chat-card .nilfish-chat-chip {
  background: #fff;
  border-color: rgba(0, 0, 0, 0.18);
  color: #111116;
}

html[data-storefront-skin="plasma"] .nilfish-chat-card .nilfish-chat-chip:hover:not(:disabled) {
  background: color-mix(in srgb, var(--nilfish-accent, #c45a12) 14%, #fff);
  border-color: color-mix(in srgb, var(--nilfish-accent, #c45a12) 45%, rgba(0, 0, 0, 0.18));
}

.nilfish-chat-card--package,
.nilfish-chat-card--slot {
  grid-template-columns: 1fr;
}

.nilfish-chat-card__img {
  width: 3.25rem;
  height: 3.25rem;
  object-fit: cover;
  border-radius: 0.4rem;
  background: color-mix(in srgb, var(--nilfish-fg, #111) 8%, transparent);
}

.nilfish-chat-card__img--empty {
  display: block;
}

.nilfish-chat-card__meta {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
  font-size: 0.85rem;
}

.nilfish-chat-card__link {
  color: var(--nilfish-accent, #c45c26);
  font-weight: 600;
  text-decoration: none;
}

.nilfish-chat-error {
  color: #b42318;
  margin: 0;
  font-size: 0.85rem;
}

.nilfish-chat-panel__footer {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-gap: 0.45rem;
  gap: 0.45rem;
  padding: 0.65rem;
  border-top: 1px solid color-mix(in srgb, var(--nilfish-fg, #111) 12%, transparent);
  background: var(--nilfish-bg, #fff);
  flex-shrink: 0;
}

.nilfish-chat-input {
  width: 100%;
}

@media (max-width: 480px) {
  .nilfish-chat-widget {
    right: 1.5rem;
    bottom: 0.65rem;
  }

  .nilfish-chat-panel {
    width: calc(100vw - 2.15rem);
    height: min(70vh, calc(100vh - 5rem));
  }
}

/* Store greeter — presence over corner FAB */
.nilfish-greeter--greeting {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: center;
  padding: 1.25rem;
  pointer-events: none;
  animation: nilfish-greeter-fade 0.28s ease;
}

.nilfish-greeter__backdrop {
  position: absolute;
  inset: 0;
  border: none;
  padding: 0;
  margin: 0;
  /* Stronger grey-out so hero/product imagery stays out of focus behind the greeter */
  background: color-mix(in srgb, #0b1a2a 62%, transparent);
  backdrop-filter: blur(8px) grayscale(0.55) saturate(0.35);
  -webkit-backdrop-filter: blur(8px) grayscale(0.55) saturate(0.35);
  cursor: pointer;
  pointer-events: auto;
}

.nilfish-greeter__card {
  position: relative;
  z-index: 1;
  pointer-events: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  max-width: min(28rem, 100%);
  animation: nilfish-greeter-rise 0.32s ease;
}

.nilfish-greeter__stage {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.nilfish-greeter__mascot {
  display: block;
  object-fit: contain;
  pointer-events: none;
  /* Soft contact shadow only — avoid halo that fights PNG edges */
  filter: drop-shadow(0 14px 18px color-mix(in srgb, #000 35%, transparent));
}

.nilfish-greeter__mascot--hero {
  width: min(17rem, 56vw);
  height: auto;
  max-height: min(50vh, 21rem);
  transform-origin: 50% 85%;
  animation: nilfish-greeter-idle 3.6s ease-in-out infinite;
}

.nilfish-greeter__mascot--nudge {
  width: min(13.5rem, 48vw);
  height: auto;
}

.nilfish-greeter__mascot--presence {
  width: 3.75rem;
  height: 3.75rem;
}

.nilfish-greeter__bubble {
  position: relative;
  background: var(--nilfish-bg, #fff);
  color: var(--nilfish-fg, #111);
  border: 1px solid color-mix(in srgb, var(--nilfish-fg, #111) 14%, transparent);
  border-radius: 1rem;
  padding: 0.85rem 1rem;
  box-shadow: 0 12px 28px color-mix(in srgb, #000 22%, transparent);
  max-width: 100%;
}

.nilfish-greeter__bubble--speech {
  margin-top: -0.35rem;
  max-width: min(22rem, 100%);
  border-radius: 1.15rem;
  animation: nilfish-greeter-bubble-in 0.45s ease 0.12s both;
}

/* Tail pointing up toward the mascot */
.nilfish-greeter__bubble--speech::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -0.45rem;
  width: 0.9rem;
  height: 0.9rem;
  background: var(--nilfish-bg, #fff);
  border-left: 1px solid color-mix(in srgb, var(--nilfish-fg, #111) 14%, transparent);
  border-top: 1px solid color-mix(in srgb, var(--nilfish-fg, #111) 14%, transparent);
  transform: translateX(-50%) rotate(45deg);
}

.nilfish-greeter__bubble p {
  margin: 0;
  font-size: 1rem;
  line-height: 1.35;
  font-weight: 600;
}

.nilfish-greeter__bubble--nudge {
  position: absolute;
  right: 0;
  bottom: calc(100% - 0.35rem);
  width: min(16rem, 78vw);
  padding-right: 1.75rem;
}

.nilfish-greeter__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.55rem;
  width: 100%;
}

.nilfish-greeter__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  border: 1.5px solid var(--nilfish-accent, #c45c26);
  background: color-mix(in srgb, #0b1a2a 72%, transparent);
  color: #fff;
  border-radius: 999px;
  padding: 0.55rem 1rem 0.55rem 0.85rem;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  box-shadow: none;
  outline: none;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.nilfish-greeter__chip-icon {
  flex-shrink: 0;
  color: var(--nilfish-accent, #c45c26);
}

.nilfish-greeter__chip:hover {
  background: color-mix(in srgb, var(--nilfish-accent, #c45c26) 22%, #0b1a2a);
  border-color: var(--nilfish-accent-hover, var(--nilfish-accent, #c45c26));
  transform: translateY(-1px);
}

/* Single ring — replace border color, do not stack a second outline outside it */
.nilfish-greeter__chip:focus-visible {
  border-color: var(--nilfish-accent-hover, var(--nilfish-accent, #c45c26));
  background: color-mix(in srgb, var(--nilfish-accent, #c45c26) 28%, #0b1a2a);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--nilfish-accent, #c45c26) 35%, transparent);
}

.nilfish-greeter__chip--browse {
  background: color-mix(in srgb, #0b1a2a 72%, transparent);
}

.nilfish-greeter--presence {
  position: fixed;
  right: 2.25rem;
  bottom: 1rem;
  z-index: 80;
  display: grid;
  place-items: center;
  width: 3.75rem;
  height: 3.75rem;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  cursor: -webkit-grab;
  cursor: grab;
  color: inherit;
  font: inherit;
  touch-action: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: transform 0.15s ease;
  animation: nilfish-greeter-fade 0.25s ease;
}

.nilfish-greeter--presence:hover {
  transform: translateY(-2px);
}

.nilfish-greeter--presence:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
  transform: none;
}

.nilfish-greeter--nudge {
  position: relative;
  pointer-events: none;
  animation: nilfish-greeter-rise 0.35s ease;
}

.nilfish-greeter__nudge-stage {
  position: relative;
  pointer-events: auto;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  width: min(16rem, 78vw);
}

.nilfish-greeter__nudge-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.65rem;
}

.nilfish-greeter__nudge-actions .btn-nilfish-primary,
.nilfish-greeter__nudge-actions .btn-nilfish-secondary {
  font-size: 0.85rem;
  padding: 0.4rem 0.75rem;
}

.nilfish-greeter__nudge-close {
  position: absolute;
  top: 0.35rem;
  right: 0.4rem;
  width: 1.4rem;
  height: 1.4rem;
  border: none;
  border-radius: 999px;
  background: transparent;
  color: var(--nilfish-fg, #111);
  font-size: 1.15rem;
  line-height: 1;
  cursor: pointer;
  opacity: 0.55;
}

.nilfish-greeter__nudge-close:hover {
  opacity: 1;
}

@keyframes nilfish-greeter-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes nilfish-greeter-rise {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes nilfish-greeter-idle {
  0%,
  100% {
    transform: translateY(0) rotate(-1.2deg);
  }
  50% {
    transform: translateY(-0.45rem) rotate(1.2deg);
  }
}

@keyframes nilfish-greeter-bubble-in {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .nilfish-greeter--greeting,
  .nilfish-greeter__card,
  .nilfish-greeter--presence,
  .nilfish-greeter--nudge,
  .nilfish-greeter__mascot--hero,
  .nilfish-greeter__bubble--speech {
    animation: none;
  }
}

/*!*************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!../../packages/ui/src/nilfish.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************/
/**
 * Nilfish design system — ported from c:/Odoo19 SCSS (powersport + master themes).
 * Use data-nilfish-theme on <html>: powersport (default) | master | agency | bookstore
 */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap");

/* ── Design tokens (Powersport / tenant default) ─────────────────────────── */

:root,
[data-nilfish-theme="powersport"] {
  --nilfish-primary: #0d1b2a;
  --nilfish-primary-soft: #1b3a5c;
  --nilfish-primary-hover: #0a1622;
  --nilfish-accent: #c45a12;
  --nilfish-accent-hover: #a84c0f;
  --nilfish-primary-rgb: 13, 27, 42;
  --nilfish-accent-rgb: 196, 90, 18;
  /* Flat mock: navbar = primary (navy), accent only on CTA / active underline */
  --nilfish-navbar: #0d1b2a;
  --nilfish-navbar-text: #ffffff;
  --nilfish-body: #334155;
  --nilfish-muted: #64748b;
  --nilfish-light-gray: #94a3b8;
  --nilfish-bg-light: #f8fafc;
  --nilfish-card-bg: #f1f5f9;
  --nilfish-surface: #f4f6f9;
  --nilfish-border: #e2e8f0;
  --nilfish-border-subtle: rgba(13, 27, 42, 0.08);
  --nilfish-white: #ffffff;
  --nilfish-danger: #dc3545;
  --nilfish-success: #1b7a3d;
  --nilfish-navy: var(--nilfish-primary);
  --nilfish-orange: var(--nilfish-accent);
  --nilfish-heading: var(--nilfish-primary);
  --nilfish-font-sans: "Inter", system-ui, sans-serif;
  --nilfish-radius-md: 0.5rem;
  --nilfish-radius-lg: 0.75rem;
  --nilfish-radius-xl: 1rem;
  --nilfish-radius-pill: 999px;
  /* Flat — border-driven; no soft elevation / glass */
  --nilfish-shadow-card: none;
  --nilfish-shadow-card-hover: none;
  --nilfish-shadow-overlay: none;
  --nilfish-btn-primary-bg: var(--nilfish-primary);
  --nilfish-btn-primary-text: #ffffff;
  --nilfish-btn-primary-hover: var(--nilfish-primary-soft);
}

/* ── Color scheme (surface tokens; brand tokens stay on theme / org) ─────── */

:root,
[data-color-scheme="light"] {
  --nilfish-bg: #f8fafc;
  --nilfish-surface: #f4f6f9;
  --nilfish-surface-elevated: #ffffff;
  --nilfish-text: #334155;
  --nilfish-muted: #64748b;
  --nilfish-border: #e2e8f0;
  /* Titles / chrome text that used navy primary on light */
  --nilfish-heading: var(--nilfish-primary);
  --nilfish-bg-light: var(--nilfish-bg);
  --nilfish-card-bg: var(--nilfish-surface);
  --nilfish-body: var(--nilfish-text);
  --nilfish-white: var(--nilfish-surface-elevated);
  --nilfish-pill-tabs-track: #e8eaee;
  --nilfish-shadow-card: none;
  --nilfish-shadow-card-hover: none;
  --nilfish-shadow-overlay: none;
  /* Scrollbars — navy thumb, accent on hover (graphic profile) */
  --nilfish-scrollbar-size: 8px;
  --nilfish-scrollbar-track: transparent;
  --nilfish-scrollbar-thumb: color-mix(in srgb, var(--nilfish-primary) 32%, transparent);
  --nilfish-scrollbar-thumb-hover: color-mix(in srgb, var(--nilfish-accent) 70%, transparent);
}

[data-color-scheme="dark"] {
  --nilfish-bg: #121212;
  --nilfish-surface: #1a1a1a;
  --nilfish-surface-elevated: #222222;
  --nilfish-text: #e8eaed;
  --nilfish-muted: #9aa0a6;
  --nilfish-border: #2e2e2e;
  /* Navy/black primary is unreadable as title color on charcoal */
  --nilfish-heading: var(--nilfish-text);
  --nilfish-bg-light: var(--nilfish-bg);
  --nilfish-card-bg: var(--nilfish-surface);
  --nilfish-body: var(--nilfish-text);
  --nilfish-white: var(--nilfish-surface-elevated);
  --nilfish-light-gray: #9aa0a6;
  --nilfish-border-subtle: rgba(255, 255, 255, 0.08);
  --nilfish-pill-tabs-track: #2a2a2a;
  --nilfish-navbar: #1a1a1a;
  --nilfish-navbar-text: #e8eaed;
  --nilfish-shadow-card: none;
  --nilfish-shadow-card-hover: none;
  --nilfish-shadow-overlay: none;
  /* Scrollbars — light thumb on charcoal; accent on hover */
  --nilfish-scrollbar-size: 8px;
  --nilfish-scrollbar-track: transparent;
  --nilfish-scrollbar-thumb: color-mix(in srgb, var(--nilfish-text) 32%, transparent);
  --nilfish-scrollbar-thumb-hover: color-mix(in srgb, var(--nilfish-accent) 70%, transparent);
}

/* Theme chrome redefines surfaces — scheme must win when both apply */
html[data-color-scheme="dark"] .nilfish-app-chrome {
  --nilfish-bg: #121212;
  --nilfish-surface: #1a1a1a;
  --nilfish-surface-elevated: #222222;
  --nilfish-text: #e8eaed;
  --nilfish-muted: #9aa0a6;
  --nilfish-border: #2e2e2e;
  --nilfish-heading: var(--nilfish-text);
  --nilfish-navbar: #1a1a1a;
  --nilfish-navbar-text: #e8eaed;
  --nilfish-pill-tabs-track: #2a2a2a;
  --nilfish-bg-light: var(--nilfish-bg);
  --nilfish-card-bg: var(--nilfish-surface);
  --nilfish-body: var(--nilfish-text);
  --nilfish-white: var(--nilfish-surface-elevated);
  --nilfish-light-gray: #9aa0a6;
  --nilfish-border-subtle: rgba(255, 255, 255, 0.08);
  --nilfish-shadow-card: none;
  --nilfish-shadow-card-hover: none;
  --nilfish-shadow-overlay: none;
}

[data-nilfish-theme="master"] {
  /* True near-black — avoid blue-tinted #0a0a0a (reads as Powersport navy) */
  --nilfish-primary: #0a0a0a;
  --nilfish-primary-soft: #141414;
  --nilfish-primary-hover: #000000;
  --nilfish-accent: #a2c609;
  --nilfish-accent-hover: #7a9607;
  --nilfish-primary-rgb: 10, 10, 10;
  --nilfish-accent-rgb: 162, 198, 9;
  --nilfish-navbar: #0a0a0a;
  --nilfish-btn-primary-bg: var(--nilfish-accent);
  --nilfish-btn-primary-text: var(--nilfish-primary);
  --nilfish-btn-primary-hover: var(--nilfish-accent-hover);
}

[data-nilfish-theme="agency"] {
  /* Org branding overrides primary/accent/secondary via inline vars. */
  --nilfish-primary: #000000;
  --nilfish-primary-soft: #1a1a1a;
  --nilfish-primary-hover: #111111;
  --nilfish-primary-rgb: 0, 0, 0;
  --nilfish-accent: #5ac8e3;
  --nilfish-accent-hover: #3db4d4;
  --nilfish-accent-rgb: 90, 200, 227;
  --nilfish-navbar: #000000;
  --nilfish-navbar-text: #ffffff;
  --nilfish-btn-primary-bg: var(--nilfish-accent);
  --nilfish-btn-primary-text: #0a0a0a;
  --nilfish-btn-primary-hover: var(--nilfish-accent-hover);
  /* Light defaults for non-scheme contexts; dark chrome override wins under scheme */
  --nilfish-bg-light: #e5f6fd;
  --nilfish-surface: #ffffff;
  --nilfish-card-bg: #ffffff;
  --nilfish-body: #1e293b;
  --nilfish-muted: #64748b;
  --nilfish-border: #d7e8f0;
  --nilfish-heading: var(--nilfish-primary);
}

[data-nilfish-theme="bookstore"] {
  --nilfish-primary: #0d1b2a;
  --nilfish-primary-soft: #152a45;
  --nilfish-primary-hover: #0a1520;
  --nilfish-primary-rgb: 13, 27, 42;
  --nilfish-accent: #dd3c54;
  --nilfish-accent-hover: #c22f45;
  --nilfish-accent-rgb: 221, 60, 84;
  --nilfish-navbar: #0d1b2a;
  --nilfish-navbar-text: #ffffff;
  --nilfish-btn-primary-bg: #dd3c54;
  --nilfish-btn-primary-text: #ffffff;
  --nilfish-btn-primary-hover: #c22f45;
  --nilfish-bg-light: #fdf6f7;
  --nilfish-surface: #ffffff;
  --nilfish-card-bg: #ffffff;
  --nilfish-body: #1e293b;
  --nilfish-muted: #64748b;
  --nilfish-border: #f0d6db;
  --nilfish-heading: var(--nilfish-primary);
}

/* Under dark scheme, chrome must beat theme light surfaces (higher specificity) */
html[data-color-scheme="dark"] .nilfish-app-chrome[data-nilfish-theme="agency"],
html[data-color-scheme="dark"] .nilfish-app-chrome[data-nilfish-theme="bookstore"] {
  --nilfish-bg: #121212;
  --nilfish-surface: #1a1a1a;
  --nilfish-surface-elevated: #222222;
  --nilfish-text: #e8eaed;
  --nilfish-muted: #9aa0a6;
  --nilfish-border: #2e2e2e;
  --nilfish-heading: var(--nilfish-text);
  --nilfish-navbar: #1a1a1a;
  --nilfish-navbar-text: #e8eaed;
  --nilfish-pill-tabs-track: #2a2a2a;
  --nilfish-bg-light: var(--nilfish-bg);
  --nilfish-card-bg: var(--nilfish-surface);
  --nilfish-body: var(--nilfish-text);
  --nilfish-white: var(--nilfish-surface-elevated);
  --nilfish-light-gray: #9aa0a6;
  --nilfish-border-subtle: rgba(255, 255, 255, 0.08);
}

/* ── Base ────────────────────────────────────────────────────────────────── */

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: var(--nilfish-font-sans);
  color: var(--nilfish-body);
  background: var(--nilfish-bg-light);
  -webkit-font-smoothing: antialiased;
}

/* Hide native number input spinners site-wide (keypad / typed entry only). */
input[type="number"] {
  -moz-appearance: textfield;
  -webkit-appearance: textfield;
          appearance: textfield;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* ── Typography ──────────────────────────────────────────────────────────── */

.nilfish-kicker {
  color: var(--nilfish-accent);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 0.85rem;
}

.nilfish-section-title {
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-size: clamp(1.6rem, 3vw, 2.15rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0;
}

.nilfish-section-lead {
  color: var(--nilfish-muted);
  font-size: 1.05rem;
  max-width: 640px;
  margin: 0;
}

.nilfish-text-accent {
  color: var(--nilfish-accent);
}

.nilfish-link {
  color: var(--nilfish-accent);
  font-weight: 600;
  text-decoration: none;
}

.nilfish-link:hover {
  text-decoration: underline;
}

/* ── Buttons ─────────────────────────────────────────────────────────────── */

.btn-nilfish-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  background-color: var(--nilfish-accent);
  border: 1px solid var(--nilfish-accent);
  border-radius: var(--nilfish-radius-md);
  color: #fff;
  font-family: var(--nilfish-font-sans);
  font-weight: 500;
  font-size: 0.9375rem;
  letter-spacing: 0.02em;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.15s, border-color 0.15s;
}

/* Equal-width primary + Cancel (or similar) in a flex row */
.nilfish-btn-grow {
  flex: 1 1;
  min-width: 0;
}

.btn-nilfish-primary:hover,
.btn-nilfish-primary:focus {
  background-color: var(--nilfish-accent-hover);
  border-color: var(--nilfish-accent-hover);
  color: #fff;
}

.btn-nilfish-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  background-color: var(--nilfish-surface-elevated, var(--nilfish-bg-light));
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-family: var(--nilfish-font-sans);
  font-weight: 500;
  font-size: 0.9375rem;
  letter-spacing: 0.02em;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.15s, border-color 0.15s;
}

.btn-nilfish-secondary:hover,
.btn-nilfish-secondary:focus {
  background-color: var(--nilfish-card-bg);
  border-color: var(--nilfish-muted);
}

.btn-nilfish-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  background-color: var(--nilfish-danger, #dc3545);
  border: 1px solid var(--nilfish-danger, #dc3545);
  border-radius: var(--nilfish-radius-md);
  color: #fff;
  font-family: var(--nilfish-font-sans);
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.15s, border-color 0.15s, opacity 0.15s;
}

.btn-nilfish-danger:hover,
.btn-nilfish-danger:focus {
  background-color: #bb2d3b;
  border-color: #b02a37;
  color: #fff;
}

.btn-nilfish-danger:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

/* Compact text / icon actions — not for primary CTAs or New … */
.btn-nilfish-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0.15rem 0.35rem;
  background: transparent;
  border: none;
  border-radius: var(--nilfish-radius-sm, 4px);
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-family: var(--nilfish-font-sans);
  font-weight: 600;
  font-size: 0.8125rem;
  line-height: 1.3;
  text-decoration: underline;
  text-underline-offset: 0.15em;
  cursor: pointer;
}

.btn-nilfish-ghost:hover,
.btn-nilfish-ghost:focus-visible {
  color: var(--nilfish-accent);
  background: rgba(var(--nilfish-accent-rgb, 232, 93, 4), 0.08);
  outline: none;
}

.btn-nilfish-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--nilfish-radius-sm, 4px);
  color: var(--nilfish-muted, #64748b);
  font-family: var(--nilfish-font-sans);
  font-size: 1.15rem;
  line-height: 1;
  cursor: pointer;
}

.btn-nilfish-icon:hover,
.btn-nilfish-icon:focus-visible {
  color: var(--nilfish-primary);
  background: var(--nilfish-bg-light, #f8fafc);
  border-color: var(--nilfish-border);
  outline: none;
}

/* Dark: primary is near-black — use accent so trash/clear icons stay visible on hover */
html[data-color-scheme="dark"] .btn-nilfish-icon:hover,
html[data-color-scheme="dark"] .btn-nilfish-icon:focus-visible {
  color: var(--nilfish-accent);
  background: rgba(var(--nilfish-accent-rgb, 232, 93, 4), 0.12);
  border-color: transparent;
}

.btn-nilfish-icon--accent {
  color: var(--nilfish-accent, #e85d04);
  border-color: var(--nilfish-accent, #e85d04);
  font-weight: 700;
}

.btn-nilfish-icon--accent:hover,
.btn-nilfish-icon--accent:focus-visible {
  color: #fff;
  background: var(--nilfish-accent, #e85d04);
  border-color: var(--nilfish-accent, #e85d04);
}

/* ERP in-app: compact primary/secondary/danger (forms, cards, page body — not marketing sites) */
.nilfish-app-chrome__content .btn-nilfish-primary,
.nilfish-app-chrome__content .btn-nilfish-secondary,
.nilfish-app-chrome__content .btn-nilfish-danger,
.nilfish-app-chrome .nilfish-modal .btn-nilfish-primary,
.nilfish-app-chrome .nilfish-modal .btn-nilfish-secondary,
.nilfish-app-chrome .nilfish-modal .btn-nilfish-danger {
  padding: 0.35rem 0.75rem;
  font-size: 0.8125rem;
  line-height: 1.25;
}

/* EntitySearch: selected value is the control */
.nilfish-entity-search {
  position: relative;
}

.nilfish-entity-search__label {
  display: block;
  margin-bottom: 0.25rem;
}

.nilfish-entity-search__value-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.25rem 0.35rem;
}

.nilfish-entity-search__value-row > .nilfish-input {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
}

.nilfish-entity-search__value {
  display: inline;
  margin: 0;
  padding: 0.1rem 0.15rem;
  border: none;
  border-radius: 3px;
  background: transparent;
  color: var(--nilfish-body, #334155);
  font: inherit;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.nilfish-entity-search__value:hover,
.nilfish-entity-search__value:focus-visible {
  color: var(--nilfish-accent);
  text-decoration: underline;
  text-underline-offset: 0.12em;
  outline: none;
}

a.nilfish-entity-search__value--link {
  text-decoration: none;
  /* Scheme-aware (navy on light / light on dark) — same role as POS --nilfish-strong */
  color: var(--nilfish-heading, var(--nilfish-body, #334155));
}

a.nilfish-entity-search__value--link:hover,
a.nilfish-entity-search__value--link:focus-visible {
  color: var(--nilfish-accent);
  text-decoration: underline;
}

/* Odoo-like chevron breadcrumbs — active = bold/thicker, no purple accent fill */
.nilfish-erp-breadcrumb {
  margin: 0 0 0.35rem;
  overflow-x: auto;
}

.nilfish-erp-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.nilfish-erp-breadcrumb__item {
  position: relative;
  display: flex;
  align-items: stretch;
  margin-right: -0.55rem;
  max-width: min(20rem, 85vw);
}

.nilfish-erp-breadcrumb__item:last-child {
  margin-right: 0;
  z-index: 1;
}

.nilfish-erp-breadcrumb__link,
.nilfish-erp-breadcrumb__current {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 1.85rem;
  padding: 0.2rem 1.35rem 0.2rem 1.1rem;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  color: var(--nilfish-muted, #64748b);
  font-family: var(--nilfish-font-sans);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.25;
  text-decoration: none;
  -webkit-clip-path: polygon(
    0 0,
    calc(100% - 0.65rem) 0,
    100% 50%,
    calc(100% - 0.65rem) 100%,
    0 100%,
    0.65rem 50%
  );
          clip-path: polygon(
    0 0,
    calc(100% - 0.65rem) 0,
    100% 50%,
    calc(100% - 0.65rem) 100%,
    0 100%,
    0.65rem 50%
  );
}

.nilfish-erp-breadcrumb__item--first .nilfish-erp-breadcrumb__link,
.nilfish-erp-breadcrumb__item--first .nilfish-erp-breadcrumb__current {
  padding-left: 0.85rem;
  -webkit-clip-path: polygon(
    0 0,
    calc(100% - 0.65rem) 0,
    100% 50%,
    calc(100% - 0.65rem) 100%,
    0 100%
  );
          clip-path: polygon(
    0 0,
    calc(100% - 0.65rem) 0,
    100% 50%,
    calc(100% - 0.65rem) 100%,
    0 100%
  );
  border-radius: 3px 0 0 3px;
}

.nilfish-erp-breadcrumb__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 16rem;
}

.nilfish-erp-breadcrumb__link:hover,
.nilfish-erp-breadcrumb__link:focus-visible {
  background: #e2e8f0;
  color: var(--nilfish-primary, #0a0a0a);
  outline: none;
  z-index: 2;
}

.nilfish-erp-breadcrumb__item--current {
  z-index: 3;
}

.nilfish-erp-breadcrumb__item--current .nilfish-erp-breadcrumb__current {
  background: #e2e8f0;
  border-color: #94a3b8;
  border-width: 1.5px;
  color: var(--nilfish-body, #0f172a);
  font-weight: 700;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.04);
}

.nilfish-entity-search__list {
  position: absolute;
  z-index: 20;
  left: 0;
  right: 0;
  margin: 0.15rem 0 0;
  padding: 0.25rem 0;
  list-style: none;
  background: var(--nilfish-surface-elevated, var(--nilfish-surface, #fff));
  border: 1px solid var(--nilfish-border, #ccc);
  border-radius: var(--nilfish-radius-md, 8px);
  box-shadow: var(--nilfish-shadow-overlay, none);
  max-height: min(420px, 50vh);
  overflow: auto;
}

/* Portaled to body so overflow parents (e.g. order line tables) do not clip results. */
.nilfish-entity-search__list--portal {
  position: fixed;
  z-index: 1200;
  left: auto;
  right: auto;
  margin: 0;
}

.nilfish-entity-search__status {
  padding: 0.5rem 0.75rem;
  color: var(--nilfish-muted);
  font-size: 0.875rem;
}

.nilfish-entity-search__option {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0.45rem 0.75rem;
  border: none;
  background: transparent;
  color: var(--nilfish-text, var(--nilfish-body, #334155));
  font: inherit;
  font-size: 0.875rem;
  text-align: left;
  cursor: pointer;
}

.nilfish-entity-search__option:hover,
.nilfish-entity-search__option:focus-visible,
.nilfish-entity-search__option--active {
  background: rgba(var(--nilfish-accent-rgb, 196, 90, 18), 0.1);
  outline: none;
}

/* ── Locale tabs (ERP multilingual forms) ─────────────────────────────────── */

.nilfish-locale-tabs {
  margin-top: 1rem;
}

.nilfish-locale-tabs__list {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem;
  padding: 0.2rem;
  margin-bottom: 1rem;
  background: var(--nilfish-pill-tabs-track, #e8eaee);
  border-radius: 999px;
  border: none;
}

.nilfish-locale-tabs__tab {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: transparent;
  border: none;
  border-radius: 999px;
  padding: 0.4rem 0.95rem;
  font-family: var(--nilfish-font-sans);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--nilfish-muted, #6b7280);
  cursor: pointer;
  line-height: 1.25;
}

.nilfish-locale-tabs__tab:hover {
  color: var(--nilfish-body);
}

.nilfish-locale-tabs__tab--active {
  background: var(--nilfish-surface-elevated, #fff);
  color: var(--nilfish-heading, var(--nilfish-body, #1f2937));
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08), 0 1px 1px rgba(15, 23, 42, 0.04);
}

html[data-color-scheme="dark"] .nilfish-locale-tabs__tab--active {
  box-shadow: 0 0 0 1px var(--nilfish-border);
}

.nilfish-locale-tabs__panel {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  max-width: none;
}

.nilfish-locale-field {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.5rem;
  width: 100%;
}

.nilfish-locale-inherit-hint {
  margin: 0;
  font-size: 0.85rem;
}

.nilfish-locale-field--editor {
  min-width: 0;
}

/* File picker — same look as secondary button (hide native control) */
.nilfish-file-picker {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.nilfish-file-picker__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.nilfish-file-picker__name {
  color: var(--nilfish-muted);
  font-size: 0.875rem;
}

label.btn-nilfish-secondary {
  margin: 0;
}

label.btn-nilfish-secondary.is-disabled,
.btn-nilfish-secondary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}

/* Marketing / public-site ghost (white on dark heroes) — do not use in ERP */
.nilfish-site .btn-nilfish-ghost,
.nilfish-home .btn-nilfish-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  background: transparent;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-radius: var(--nilfish-radius-md);
  color: #fff;
  font-family: var(--nilfish-font-sans);
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}

.nilfish-site .btn-nilfish-ghost:hover,
.nilfish-site .btn-nilfish-ghost:focus,
.nilfish-home .btn-nilfish-ghost:hover,
.nilfish-home .btn-nilfish-ghost:focus {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.6);
  color: #fff;
}

/* ── Cards ───────────────────────────────────────────────────────────────── */

.nilfish-card {
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  padding: 1.5rem;
  box-shadow: var(--nilfish-shadow-card);
  width: 100%;
  max-width: 100%;
  min-width: 0;
  /* Scroll — never clip wide tables/fields without a way to reach them */
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  /* Field rows use @container against this surface (not the viewport). */
  container-type: inline-size;
  container-name: nilfish-form-surface;
}

.nilfish-card__title {
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 0.75rem;
}

.nilfish-feature-card {
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-xl);
  height: 100%;
  padding: 2rem;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-shadow: var(--nilfish-shadow-card);
}

.nilfish-feature-card:hover {
  border-color: rgba(var(--nilfish-accent-rgb), 0.35);
  box-shadow: var(--nilfish-shadow-card-hover);
}

.nilfish-feature-card h3 {
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 0.75rem;
}

.nilfish-feature-card p {
  color: var(--nilfish-muted);
  font-size: 0.95rem;
  margin: 0;
}

/* Icon library — @nilfish/ui NfIcon. Glyphs inherit currentColor, so the badge
   or chrome around them decides the colour per theme. */
.nilfish-icon {
  flex: none;
  vertical-align: middle;
}

/* Phosphor duotone draws a low-opacity underlay path; lift it a little so the
   two-tone shape reads on light surfaces too. */
.nilfish-icon--duotone path[opacity] {
  opacity: 0.28;
}

.nilfish-feature-icon {
  align-items: center;
  background: rgba(var(--nilfish-accent-rgb), 0.12);
  border-radius: var(--nilfish-radius-lg);
  color: var(--nilfish-accent);
  display: inline-flex;
  height: 3rem;
  justify-content: center;
  margin-bottom: 1.25rem;
  width: 3rem;
}

.nilfish-category-card {
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-xl);
  color: inherit;
  display: block;
  height: 100%;
  padding: 2rem 1.5rem;
  text-align: center;
  text-decoration: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-shadow: var(--nilfish-shadow-card);
}

.nilfish-category-card:hover {
  border-color: rgba(var(--nilfish-accent-rgb), 0.4);
  box-shadow: var(--nilfish-shadow-card-hover);
  color: inherit;
}

.nilfish-category-card h3 {
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 0.5rem;
}

.nilfish-category-card p {
  color: var(--nilfish-muted);
  font-size: 0.9rem;
  margin: 0;
}

.nilfish-category-icon {
  align-items: center;
  background: rgba(var(--nilfish-accent-rgb), 0.12);
  border-radius: var(--nilfish-radius-lg);
  color: var(--nilfish-accent);
  display: inline-flex;
  height: 3.25rem;
  justify-content: center;
  margin-bottom: 1.25rem;
  width: 3.25rem;
}

.nilfish-content-card {
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  box-shadow: var(--nilfish-shadow-card);
}

/* ── Site shell (public sites) ───────────────────────────────────────────── */

.nilfish-site {
  color: var(--nilfish-body);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: var(--nilfish-font-sans);
}

.nilfish-site-nav {
  background: var(--nilfish-primary);
  color: var(--nilfish-white);
  padding: 1rem 2rem;
  display: flex;
  gap: 1.5rem;
  align-items: center;
}

.nilfish-site-nav a {
  color: var(--nilfish-white);
  text-decoration: none;
  font-weight: 500;
}

.nilfish-site-nav a:hover {
  opacity: 0.85;
}

.nilfish-site-nav__brand {
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
}

.nilfish-site-nav__links {
  align-items: center;
  display: flex;
  gap: 1.25rem;
}

.nilfish-site-nav__mega-wrap {
  position: relative;
}

.nilfish-site-nav__mega-wrap:hover .nilfish-mega-menu,
.nilfish-site-nav__mega-wrap:focus-within .nilfish-mega-menu {
  display: grid;
}

.nilfish-mega-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 40;
  min-width: 28rem;
  max-width: min(90vw, 48rem);
  grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
  gap: 1rem;
  padding: 1rem 1.25rem;
  background: var(--nilfish-surface, #111);
  border: 1px solid var(--nilfish-border, #333);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}

.nilfish-mega-menu__heading {
  font-weight: 600;
  display: block;
  margin-bottom: 0.35rem;
}

.nilfish-mega-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-gap: 0.25rem;
  gap: 0.25rem;
}

.nilfish-mega-menu__col--cta {
  display: flex;
  align-items: flex-end;
}

.nilfish-site-top-slot,
.nilfish-merch-placement {
  width: 100%;
}

.nilfish-site-top-slot .nilfish-merch-placement--banner,
.nilfish-merch-placement--banner {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  background: var(--nilfish-accent-soft, #222);
  font-size: 0.9rem;
}

.nilfish-trust-bar__row,
.nilfish-usp-strip__grid,
.nilfish-quick-tabs__row,
.nilfish-merch-placement__items {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
}

.nilfish-trust-bar__item {
  opacity: 0.9;
  font-size: 0.9rem;
}

.nilfish-usp-strip__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
}

.nilfish-section--width-full .nilfish-site-main {
  max-width: none;
  width: 100%;
  padding-inline: clamp(1rem, 3vw, 2rem);
}

/* Reading-column blocks (rich_text) must expand when full width is chosen. */
.nilfish-section--width-full .nilfish-legal-doc,
.nilfish-section--width-full .nilfish-design-rich-text .nilfish-legal-doc {
  max-width: none;
  width: 100%;
  margin-inline: 0;
}

@media (max-width: 767px) {
  .nilfish-section--hide-mobile {
    display: none !important;
  }
}

.nilfish-category-showcase__row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: stretch;
  min-height: 18rem;
}

.nilfish-category-showcase__row--first-larger {
  flex-wrap: nowrap;
}

.nilfish-category-showcase__card {
  position: relative;
  flex: 1 1 12rem;
  min-height: 16rem;
  overflow: hidden;
  border-radius: 0.65rem;
  color: #fff;
  text-decoration: none;
  display: block;
  transition: flex 0.35s ease;
}

.nilfish-category-showcase__row--first-larger .nilfish-category-showcase__card--lead {
  flex: 1.65 1;
}

.nilfish-category-showcase__row--first-larger .nilfish-category-showcase__card:not(.nilfish-category-showcase__card--lead) {
  flex: 1 1;
}

@media (hover: hover) and (min-width: 900px) {
  .nilfish-category-showcase__row--first-larger .nilfish-category-showcase__card:not(.nilfish-category-showcase__card--lead):hover {
    flex: 1.55 1;
  }
}

.nilfish-category-showcase__img,
.nilfish-category-showcase__fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.nilfish-category-showcase__fallback {
  background: linear-gradient(145deg, #1e293b, #334155);
}

.nilfish-category-showcase__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 1.1rem 1.15rem;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.65), transparent 55%);
}

.nilfish-category-showcase__title {
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.nilfish-category-showcase__cta {
  align-self: flex-start;
  border: 1px solid rgba(255, 255, 255, 0.85);
  padding: 0.3rem 0.7rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

@media (max-width: 899px) {
  .nilfish-category-showcase__row--first-larger {
    flex-wrap: wrap;
  }

  .nilfish-category-showcase__row--first-larger .nilfish-category-showcase__card,
  .nilfish-category-showcase__row--first-larger .nilfish-category-showcase__card--lead {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: calc(50% - 0.5rem);
    min-width: 10rem;
  }
}

.nilfish-design-image-text__inner,
.nilfish-design-map__inner {
  display: grid;
  grid-gap: 1.5rem;
  gap: 1.5rem;
  align-items: center;
}

@media (min-width: 768px) {
  .nilfish-design-image-text__inner,
  .nilfish-design-map__inner {
    grid-template-columns: 1fr 1fr;
  }

  .nilfish-design-image-text__inner--flip .nilfish-design-image-text__media {
    order: 2;
  }

  .nilfish-design-image-text__inner--flip .nilfish-design-image-text__copy {
    order: 1;
  }
}

.nilfish-design-image-text__media img,
.nilfish-design-map__media img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
  object-fit: cover;
}

.nilfish-design-image-text__copy {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.nilfish-design-quotes__grid {
  display: grid;
  grid-gap: 1.25rem;
  gap: 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}

.nilfish-design-quote {
  margin: 0;
  padding: 1.25rem 1.35rem;
  border-left: 3px solid var(--nilfish-accent, #c45a12);
  background: var(--nilfish-bg-light, #f8fafc);
}

.nilfish-design-quote__text {
  margin: 0 0 0.75rem;
  font-size: 1.05rem;
  line-height: 1.45;
  color: var(--nilfish-heading, var(--nilfish-fg, #0f172a));
}

.nilfish-design-quote__meta {
  font-size: 0.9rem;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-design-logos__row,
.nilfish-design-stats__row {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem 2rem;
  align-items: center;
  justify-content: center;
}

.nilfish-design-logos__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
}

.nilfish-design-logos__img {
  max-height: 2.75rem;
  max-width: 8rem;
  width: auto;
  object-fit: contain;
  filter: grayscale(0.15);
  opacity: 0.9;
}

.nilfish-design-stats__item {
  text-align: center;
  min-width: 7rem;
}

.nilfish-design-stats__value {
  margin: 0;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.1;
  color: var(--nilfish-heading, var(--nilfish-fg, #0f172a));
}

.nilfish-design-stats__label {
  margin: 0.35rem 0 0;
  font-size: 0.9rem;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-promo-banner__inner {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  align-items: center;
}

@media (min-width: 768px) {
  .nilfish-promo-banner__inner {
    grid-template-columns: 1.2fr 1fr;
  }
}

.nilfish-promo-banner__img {
  width: 100%;
  height: auto;
  max-height: 280px;
  object-fit: cover;
}

.nilfish-quick-tabs__tab {
  display: inline-flex;
  padding: 0.4rem 0.85rem;
  border: 1px solid var(--nilfish-border, #444);
  text-decoration: none;
}

.nilfish-sale-countdown__timer {
  text-align: center;
  font-weight: 600;
  margin: 0.5rem 0 1rem;
}

.nilfish-merch-placement--trust,
.nilfish-merch-placement--usp {
  padding: 0.75rem 0;
  margin: 0.5rem 0 1rem;
  border-top: 1px solid var(--nilfish-border, #333);
  border-bottom: 1px solid var(--nilfish-border, #333);
}

.nilfish-site-nav__mobile-menu {
  display: none;
}

.nilfish-site-nav__logo {
  display: block;
  height: 52px;
  width: auto;
  max-width: 200px;
  object-fit: contain;
}

.nilfish-site-nav__end {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 1rem;
  position: relative;
  z-index: 20;
}

/* Odoo demo storefront header (shop_overrides.scss) */
.nilfish-site-nav--storefront {
  padding: 0.9rem 1.5rem;
  gap: 1.25rem;
  position: relative;
  z-index: 30;
  flex-wrap: wrap;
}

.nilfish-site-nav--sticky {
  position: -webkit-sticky;
  position: sticky;
  top: var(--nilfish-staff-bar-height, 0px);
  z-index: 70;
}

.nilfish-site-nav--landing {
  padding-top: 1.1rem;
  padding-bottom: 1.1rem;
}

.nilfish-site-nav--landing .nilfish-site-nav__logo {
  height: 56px;
}

.nilfish-site-nav--landing.is-compact {
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
  box-shadow: 0 10px 28px rgba(13, 27, 42, 0.14);
}

.nilfish-site-nav--landing.is-compact .nilfish-site-nav__logo {
  height: 32px;
}

.nilfish-site-nav--landing.is-compact .nilfish-header-search input {
  height: 2.1rem;
}

.nilfish-site-nav--storefront .nilfish-site-nav__end {
  gap: 0.85rem;
}

.nilfish-site-nav--storefront > .nilfish-site-nav__brand > span {
  display: none;
}

.nilfish-site-nav__second-row {
  display: flex;
  flex: 1 0 100%;
  justify-content: stretch;
  min-width: 0;
  width: 100%;
}

.nilfish-site-nav__second-row .nilfish-header-search {
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.nilfish-header-search {
  --nilfish-header-search-collapsed: 2.75rem;
  --nilfish-header-search-expanded: clamp(14rem, 32vw, 28rem);
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  width: var(--nilfish-header-search-collapsed);
  max-width: var(--nilfish-header-search-collapsed);
  min-width: var(--nilfish-header-search-collapsed);
  height: var(--nilfish-header-search-collapsed);
  transition:
    width 0.34s cubic-bezier(0.22, 1, 0.36, 1),
    max-width 0.34s cubic-bezier(0.22, 1, 0.36, 1),
    min-width 0.34s cubic-bezier(0.22, 1, 0.36, 1);
}

.nilfish-header-search__trigger {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.92);
  cursor: pointer;
  font: inherit;
  height: var(--nilfish-header-search-collapsed);
  width: var(--nilfish-header-search-collapsed);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  box-shadow: none;
  position: absolute;
  inset: 0 auto 0 0;
  z-index: 2;
  opacity: 1;
  transform: scale(1);
  transition:
    opacity 0.18s ease,
    transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
    color 0.15s ease;
}

.nilfish-header-search__trigger:hover,
.nilfish-header-search__trigger:focus-visible {
  color: #fff;
  border: 0;
  box-shadow: none;
  outline: none;
}

.nilfish-header-search.is-expanded .nilfish-header-search__trigger {
  opacity: 0;
  pointer-events: none;
  transform: scale(0.72);
}

.nilfish-header-search__glyph {
  display: block;
}

.nilfish-header-search__field {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 0;
  opacity: 0;
  transform: translateX(0.35rem) scaleX(0.92);
  transform-origin: right center;
  pointer-events: none;
  transition:
    opacity 0.22s ease 0.04s,
    transform 0.34s cubic-bezier(0.22, 1, 0.36, 1);
}

.nilfish-header-search.is-expanded .nilfish-header-search__field {
  opacity: 1;
  transform: translateX(0) scaleX(1);
  pointer-events: auto;
}

.nilfish-header-search__icon {
  color: var(--nilfish-muted);
  left: 0.75rem;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.nilfish-header-search input {
  background: #fff;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 999px;
  color: var(--nilfish-primary);
  font: inherit;
  height: 2.75rem;
  outline: none;
  padding: 0 0.95rem 0 2.15rem;
  box-sizing: border-box;
  width: 100%;
}

.nilfish-header-search input:focus {
  border-color: var(--nilfish-accent);
  box-shadow: none;
}

.nilfish-header-search.is-expanded {
  flex: 1 1 auto;
  width: var(--nilfish-header-search-expanded);
  min-width: 12rem;
  max-width: var(--nilfish-header-search-expanded);
}

.nilfish-header-search__results {
  background: #fff;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  box-shadow: 0 18px 45px rgba(13, 27, 42, 0.2);
  color: var(--nilfish-body);
  left: 0;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: calc(100% + 0.45rem);
  z-index: 50;
}

.nilfish-header-search__results ul {
  list-style: none;
  margin: 0;
  max-height: 22rem;
  overflow-y: auto;
  padding: 0;
}

.nilfish-site-nav .nilfish-header-search__results a {
  align-items: center;
  color: var(--nilfish-primary);
  display: flex;
  gap: 0.65rem;
  padding: 0.6rem 0.7rem;
}

.nilfish-site-nav .nilfish-header-search__results a:hover {
  background: var(--nilfish-bg-light);
  color: var(--nilfish-primary);
}

.nilfish-header-search__results img,
.nilfish-header-search__placeholder {
  background: var(--nilfish-bg-light);
  border-radius: 0.35rem;
  flex: 0 0 42px;
  height: 42px;
  object-fit: cover;
  width: 42px;
}

.nilfish-header-search__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.nilfish-header-search__copy strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nilfish-header-search__copy small {
  color: var(--nilfish-muted);
}

.nilfish-header-search__results button {
  background: var(--nilfish-bg-light);
  border: 0;
  border-top: 1px solid var(--nilfish-border);
  color: var(--nilfish-primary);
  cursor: pointer;
  font: inherit;
  font-weight: 600;
  padding: 0.7rem;
  width: 100%;
}

.nilfish-header-search__empty {
  margin: 0;
  padding: 0.8rem;
}

@media (max-width: 1099.98px) {
  .nilfish-site-nav--storefront {
    display: grid;
    grid-template-columns: minmax(2.5rem, auto) minmax(0, 1fr) minmax(2.5rem, auto);
    grid-template-rows: auto auto;
  }

  .nilfish-site-nav--storefront .nilfish-site-nav__mobile-menu {
    display: block;
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    position: static;
  }

  .nilfish-site-nav__mobile-menu summary {
    align-items: center;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 4px;
    height: 2.25rem;
    justify-content: center;
    list-style: none;
    width: 2.25rem;
  }

  .nilfish-site-nav__mobile-menu summary::-webkit-details-marker {
    display: none;
  }

  .nilfish-site-nav__mobile-menu summary span {
    background: currentColor;
    border-radius: 2px;
    display: block;
    height: 2px;
    width: 22px;
  }

  .nilfish-site-nav__mobile-panel {
    background: var(--nilfish-primary);
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 16px 30px rgba(13, 27, 42, 0.24);
    display: flex;
    flex-direction: column;
    gap: 0;
    left: 0;
    padding: 0.5rem 1rem 0.75rem;
    position: absolute;
    right: 0;
    top: 100%;
  }

  .nilfish-site-nav__mobile-panel .nilfish-site-nav__link {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 1rem;
    padding: 0.75rem 0.25rem;
  }

  .nilfish-site-nav__mobile-footer {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    margin-top: 0.75rem;
    padding: 0.9rem 0.25rem 0.2rem;
  }

  .nilfish-site-nav--storefront > .nilfish-site-nav__brand {
    grid-column: 2;
    grid-row: 1;
    justify-self: center;
    min-width: 0;
  }

  .nilfish-site-nav--storefront > .nilfish-site-nav__brand span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .nilfish-site-nav--storefront > .nilfish-site-nav__links {
    display: none;
  }

  .nilfish-site-nav--storefront > .nilfish-site-nav__end {
    flex: none;
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    margin-left: 0;
    white-space: nowrap;
  }

  .nilfish-site-nav--storefront .nilfish-site-nav__desktop-language {
    display: none;
  }

  .nilfish-site-nav--storefront > .nilfish-site-nav__second-row {
    display: flex;
    grid-column: 1 / -1;
    grid-row: 2;
    justify-content: center;
    min-width: 0;
    width: 100%;
  }
}

.nilfish-site-nav--storefront a:not(.btn-nilfish-primary):not(.o_wsale_cart_flyout__name):not(.o_wsale_cart_flyout__thumb-link):not(.o_wsale_cart_flyout__cta) {
  color: rgba(255, 255, 255, 0.92);
}

.nilfish-site-nav--storefront a:not(.btn-nilfish-primary):hover {
  color: #fff;
  opacity: 1;
}

.nilfish-lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: var(--nilfish-radius-md);
  padding: 0.1rem;
}

.nilfish-lang-switch__btn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 0.25rem 0.45rem;
  border-radius: calc(var(--nilfish-radius-md) - 1px);
  cursor: pointer;
  opacity: 0.75;
}

.nilfish-lang-switch__btn:hover {
  opacity: 1;
}

.nilfish-lang-switch__btn--active {
  background: rgba(255, 255, 255, 0.18);
  opacity: 1;
}

.nilfish-app-chrome__systray .nilfish-lang-switch {
  border-color: rgba(255, 255, 255, 0.28);
  color: inherit;
}

.nilfish-site-main {
  max-width: 1440px;
  margin: 0 auto;
  padding: 2rem;
}

.nilfish-site-body {
  flex: 1 1;
}

.nilfish-site-footer {
  position: relative;
  margin-top: auto;
  overflow: hidden;
  color: #fff;
  /* Theme tokens only — no hardcoded Powersport navy mid-stop */
  background: linear-gradient(
    145deg,
    var(--nilfish-primary) 0%,
    var(--nilfish-primary-soft, var(--nilfish-primary)) 48%,
    var(--nilfish-primary) 100%
  );
  padding: 3.25rem 0 0;
  isolation: isolate;
}

/* Shared accent grid (footer / hero / vehicle banner) — set --nilfish-theme-grid-accent-rgb */
.nilfish-theme-grid-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    linear-gradient(
      90deg,
      rgba(var(--nilfish-theme-grid-accent-rgb, var(--nilfish-accent-rgb, 249, 115, 22)), 0.07) 1px,
      transparent 1px
    ),
    linear-gradient(
      rgba(var(--nilfish-theme-grid-accent-rgb, var(--nilfish-accent-rgb, 249, 115, 22)), 0.07) 1px,
      transparent 1px
    );
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse 85% 80% at 70% 40%, black 18%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 85% 80% at 70% 40%, black 18%, transparent 78%);
}

.nilfish-vehicle-banner {
  --nilfish-theme-grid-accent-rgb: var(--nilfish-vehicle-banner-accent-rgb, var(--nilfish-accent-rgb));
  position: relative;
  overflow: hidden;
  isolation: isolate;
  color: #fff;
  /* Dark band + slight warm orange wash — not solid orange, not navy. */
  background:
    radial-gradient(
      ellipse 80% 140% at 12% 50%,
      rgba(var(--nilfish-vehicle-banner-accent-rgb, var(--nilfish-accent-rgb)), 0.2) 0%,
      transparent 58%
    ),
    linear-gradient(105deg, #1a1612 0%, #221c16 45%, #1c1814 100%);
  border-bottom: 1px solid rgba(var(--nilfish-vehicle-banner-accent-rgb, var(--nilfish-accent-rgb)), 0.28);
  margin: 0 0 1.25rem;
}

.nilfish-vehicle-banner__glow {
  position: absolute;
  top: -60%;
  right: -10%;
  width: 45%;
  height: 200%;
  background: radial-gradient(
    circle,
    rgba(var(--nilfish-vehicle-banner-accent-rgb, var(--nilfish-accent-rgb)), 0.18) 0%,
    transparent 65%
  );
  pointer-events: none;
  z-index: 0;
}

.nilfish-vehicle-banner__inner {
  position: relative;
  z-index: 1;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0.85rem 1.25rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.25rem;
}

.nilfish-vehicle-banner__copy {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}

.nilfish-vehicle-banner__icon {
  display: inline-flex;
  color: var(--nilfish-vehicle-banner-accent, var(--nilfish-accent));
  flex-shrink: 0;
}

.nilfish-vehicle-banner__text {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}

.nilfish-vehicle-banner__lead {
  font-size: 0.8rem;
  color: var(--nilfish-vehicle-banner-accent, var(--nilfish-accent));
  font-weight: 500;
}

.nilfish-vehicle-banner__model {
  font-size: clamp(1rem, 2.2vw, 1.2rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

.nilfish-vehicle-banner__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.nilfish-vehicle-banner__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0.85rem;
  border-radius: 999px;
  border: 2px solid rgba(255, 255, 255, 0.35);
  background: transparent;
  color: #fff;
  font: inherit;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  line-height: 1.2;
}

.nilfish-vehicle-banner__btn:hover,
.nilfish-vehicle-banner__btn:focus-visible {
  border-color: var(--nilfish-vehicle-banner-accent, var(--nilfish-accent));
  color: #fff;
  outline: none;
}

.nilfish-vehicle-banner__btn:focus-visible {
  box-shadow: 0 0 0 2px rgba(var(--nilfish-vehicle-banner-accent-rgb, var(--nilfish-accent-rgb)), 0.45);
}

.nilfish-site-footer__bg {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(var(--nilfish-accent-rgb, 249, 115, 22), 0.04) 1px, transparent 1px),
    linear-gradient(rgba(var(--nilfish-accent-rgb, 249, 115, 22), 0.04) 1px, transparent 1px);
  background-size: 48px 48px;
  /* Soft vertical fade — stronger near top, gone before legal bar */
  mask-image: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.7) 0%,
    rgba(0, 0, 0, 0.35) 42%,
    transparent 78%
  );
  -webkit-mask-image: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.7) 0%,
    rgba(0, 0, 0, 0.35) 42%,
    transparent 78%
  );
  pointer-events: none;
  z-index: 0;
  animation: nilfish-footer-grid-in 1.1s ease-out both;
}

.nilfish-site-footer__glow {
  position: absolute;
  top: -35%;
  left: -15%;
  width: 55%;
  height: 120%;
  background: radial-gradient(circle, rgba(var(--nilfish-accent-rgb, 249, 115, 22), 0.06) 0%, transparent 65%);
  pointer-events: none;
  z-index: 0;
}

.nilfish-site-footer__watermark {
  position: absolute;
  left: 0;
  right: 0;
  top: auto;
  bottom: clamp(3.25rem, 8%, 5.5rem);
  z-index: 1;
  margin: 0;
  padding: 0;
  width: 100%;
  font-size: clamp(4.5rem, 22vw, 22rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 0.78;
  text-align: center;
  text-transform: uppercase;
  /* Soft white on near-black — 1% as requested */
  color: rgba(255, 255, 255, 0.01);
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  white-space: nowrap;
  overflow: hidden;
}

[data-nilfish-theme="master"] .nilfish-site-footer {
  /* True black — not blue-tinted charcoal */
  background: linear-gradient(145deg, #050505 0%, #0a0a0a 45%, #000000 100%);
}

.nilfish-site-footer__inner {
  position: relative;
  z-index: 2;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 2rem 0;
}

.nilfish-site-footer__brand {
  margin-bottom: 2rem;
  animation: nilfish-footer-rise 0.7s ease-out both;
}

.nilfish-site-footer__brand-link {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  color: inherit;
  text-decoration: none;
}

.nilfish-site-footer__logo {
  height: 2.25rem;
  width: auto;
  max-width: 10rem;
  object-fit: contain;
  /* Show brand mark as uploaded — invert made opaque logos a solid white box. */
  filter: none;
}

.nilfish-site-footer__brand-name {
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.nilfish-site-footer__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-gap: 2rem 2.5rem;
  gap: 2rem 2.5rem;
  padding-bottom: clamp(7.5rem, 16vh, 12rem);
}

.nilfish-site-footer__grid:not(:has(.nilfish-site-footer__col--newsletter)) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.nilfish-site-footer__col {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-width: 0;
  animation: nilfish-footer-rise 0.75s ease-out both;
}

.nilfish-site-footer__heading {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--nilfish-accent, #f97316);
}

.nilfish-site-footer__links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.nilfish-site-footer__links a {
  color: rgba(255, 255, 255, 0.88);
  text-decoration: none;
  font-size: 0.95rem;
  line-height: 1.35;
  transition: color 0.15s ease, transform 0.15s ease;
  display: inline-block;
}

.nilfish-site-footer__links a:hover {
  color: #fff;
  transform: translateX(2px);
}

.nilfish-site-footer__lead {
  margin: 0;
  color: var(--nilfish-light-gray, #cbd5e1);
  font-size: 0.9rem;
  line-height: 1.45;
}

.nilfish-site-footer__form {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.nilfish-site-footer__form-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.nilfish-site-footer__input {
  /* Basis is width in a row; never use this under flex-direction:column (see mobile). */
  flex: 1 1 12rem;
  min-width: 0;
  width: auto;
  height: 2.75rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  border-radius: 0.5rem;
  padding: 0 0.85rem;
  font-size: 1rem; /* ≥16px avoids iOS focus zoom */
  line-height: 1.25;
  outline: none;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.nilfish-site-footer__input::placeholder {
  color: rgba(255, 255, 255, 0.45);
}

.nilfish-site-footer__input:focus {
  border-color: rgba(var(--nilfish-accent-rgb, 249, 115, 22), 0.7);
  background: rgba(255, 255, 255, 0.12);
  box-shadow: 0 0 0 3px rgba(var(--nilfish-accent-rgb, 249, 115, 22), 0.2);
}

.nilfish-site-footer__submit {
  flex: 0 0 auto;
  white-space: nowrap;
}

.nilfish-site-footer__success {
  margin: 0;
  color: #bbf7d0;
  font-size: 0.95rem;
  font-weight: 600;
}

.nilfish-site-footer__error {
  margin: 0;
  color: #fecaca;
  font-size: 0.85rem;
}

.nilfish-site-footer__legal {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 1.1rem 0 1.35rem;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.82rem;
}

.nilfish-site-footer__social {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.nilfish-site-footer__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.82);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.nilfish-site-footer__social-link:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.28);
}

.nilfish-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@keyframes nilfish-footer-grid-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes nilfish-footer-rise {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 991px) {
  .nilfish-site-footer__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nilfish-site-footer__col--newsletter {
    grid-column: 1 / -1;
  }
}

@media (max-width: 560px) {
  .nilfish-site-footer {
    padding-top: 2.25rem;
    /* Clear fixed cookie “settings” chip over the legal line */
    padding-bottom: 3.25rem;
  }

  .nilfish-site-footer__inner {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .nilfish-site-footer__watermark {
    display: none;
  }

  .nilfish-site-footer__grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
    padding-bottom: 1.75rem;
  }

  .nilfish-site-footer__form-row {
    flex-direction: column;
    align-items: stretch;
  }

  .nilfish-site-footer__input {
    /* Reset row flex-basis so it cannot become a 10–12rem-tall box */
    flex: 0 0 auto;
    width: 100%;
    height: 2.75rem;
  }

  .nilfish-site-footer__submit {
    width: 100%;
    min-height: 2.75rem;
  }

  .nilfish-site-footer__legal {
    padding-bottom: 0.85rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .nilfish-site-footer__bg,
  .nilfish-site-footer__brand,
  .nilfish-site-footer__col {
    animation: none;
  }

  .nilfish-site-footer__links a:hover {
    transform: none;
  }
}

/* ── Layout utilities ────────────────────────────────────────────────────── */

.min-vh-75 {
  min-height: 75vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.nilfish-container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 2rem;
}

.nilfish-container--narrow {
  max-width: 720px;
}

.nilfish-grid {
  display: grid;
  grid-gap: 1.5rem;
  gap: 1.5rem;
  /* min(…, 100%) prevents fixed minmax floors from overflowing narrow containers */
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
}

.nilfish-grid--products {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1rem;
}

.nilfish-grid--2col {
  grid-template-columns: 2fr 1fr;
  gap: 2rem;
}

.nilfish-grid--2col > .nilfish-grid__col-2 {
  grid-column: 2;
}

/* Equal 50/50 pair (e.g. delivery + workshop summary on vehicle orders) */
.nilfish-grid--halves {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  align-items: start;
  margin: 0 0 1rem;
}

/* Equal cards (Configure hub, similar galleries) — 3 → 2 → 1 by width */
.nilfish-grid--cards {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
  align-items: stretch;
}

.nilfish-configure-hub__toolbar {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin-bottom: 1.5rem;
  max-width: 40rem;
}

.nilfish-configure-hub__search {
  width: 100%;
}

.nilfish-configure-hub {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

.nilfish-configure-hub__group-title {
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  margin: 0 0 0.75rem;
  text-transform: uppercase;
}

.nilfish-configure-hub__card {
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  box-shadow: var(--nilfish-shadow-card);
  color: inherit;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  height: 100%;
  min-width: 0;
  padding: 1.25rem 1.35rem;
  text-decoration: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.nilfish-configure-hub__card:hover,
.nilfish-configure-hub__card:focus-visible {
  border-color: rgba(var(--nilfish-accent-rgb), 0.45);
  box-shadow: var(--nilfish-shadow-card-hover, var(--nilfish-shadow-card));
  outline: none;
}

.nilfish-configure-hub__card--disabled {
  cursor: default;
  opacity: 0.72;
}

.nilfish-configure-hub__icon {
  height: 2.5rem;
  margin-bottom: 0.65rem;
  width: 2.5rem;
}

.nilfish-configure-hub__card-title {
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.25;
}

.nilfish-configure-hub__card-blurb {
  display: -webkit-box;
  font-size: 0.9rem;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  margin: 0;
  overflow: hidden;
}

/* Document | Kontering | PDF preview (manual voucher / vendor bill) */
.nilfish-grid--kontering {
  grid-template-columns: minmax(220px, 0.9fr) minmax(320px, 1.2fr) minmax(280px, 1.1fr);
  gap: 1.25rem;
  align-items: start;
}

.nilfish-inbox-doc-card {
  margin-bottom: 0;
}

.nilfish-inbox-doc-fields {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.nilfish-inbox-doc-fields__row {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(12rem, 100%), 1fr));
  grid-gap: 0.75rem 1rem;
  gap: 0.75rem 1rem;
  align-items: end;
  width: 100%;
  min-width: 0;
}

.nilfish-inbox-doc-fields__row > * {
  min-width: 0;
}

.nilfish-inbox-doc-fields__row--grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(10.5rem, 100%), 1fr));
  align-items: end;
}

.nilfish-inbox-doc-fields__row--grid label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

/* Odoo-inspired key fields (accent wash + left accent bar) */
.nilfish-inbox-highlight {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  padding: 0.75rem 0.85rem 0.75rem 0.9rem;
  background: color-mix(in srgb, var(--nilfish-accent) 14%, var(--nilfish-surface-elevated));
  border-radius: var(--nilfish-radius-md, 8px);
  border-left: 4px solid var(--nilfish-accent, #c45a12);
}

.nilfish-inbox-highlight__row {
  display: grid;
  grid-template-columns: minmax(6.5rem, 38%) 1fr;
  grid-gap: 0.5rem 0.75rem;
  gap: 0.5rem 0.75rem;
  align-items: center;
}

.nilfish-inbox-highlight__label {
  color: var(--nilfish-muted, #64748b);
  font-size: 0.8125rem;
  line-height: 1.3;
}

.nilfish-inbox-highlight__value {
  min-width: 0;
}

.nilfish-inbox-highlight__value .nilfish-entity-search {
  width: auto;
  max-width: 100%;
}

.nilfish-inbox-highlight__value .nilfish-entity-search .nilfish-input {
  width: auto;
  max-width: 14rem;
}

.nilfish-inbox-highlight__value > .nilfish-input {
  width: 100%;
}

.nilfish-inbox-highlight__total {
  font-weight: 700;
  font-size: 1.125rem;
}

.nilfish-payment-details {
  margin-top: 0.75rem;
  border-top: 1px solid color-mix(in srgb, var(--nilfish-border, #ddd) 80%, transparent);
  padding-top: 0.5rem;
}

.nilfish-payment-details__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 0.6rem;
  width: 100%;
  padding: 0.25rem 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
}

.nilfish-payment-details__chevron {
  color: var(--nilfish-accent, #e85d04);
  font-size: 0.85rem;
  line-height: 1;
}

.nilfish-payment-details__title {
  font-weight: 650;
}

.nilfish-payment-details__summary {
  flex: 1 1 12rem;
  font-size: 0.85rem;
}

.nilfish-payment-details__body {
  gap: 0.5rem;
  padding: 0.35rem 0 0.15rem;
}

.nilfish-payment-details__body label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.nilfish-inbox-split {
  display: flex;
  align-items: stretch;
  gap: 0;
  min-height: 32rem;
}

.nilfish-inbox-split__left {
  flex: 0 0 auto;
  min-width: 16rem;
  max-width: 55%;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.nilfish-inbox-split__handle {
  flex: 0 0 8px;
  margin: 0 0.15rem;
  cursor: col-resize;
  border-radius: 4px;
  background: var(--nilfish-border, #d0d0cc);
  align-self: stretch;
  touch-action: none;
}

.nilfish-inbox-split__handle:hover,
.nilfish-inbox-split__handle:active {
  background: var(--nilfish-accent, #e85d04);
}

.nilfish-inbox-split__right {
  flex: 1 1 auto;
  min-width: 0;
  align-self: stretch;
}

.nilfish-inbox-split__right > .nilfish-card {
  height: 100%;
  min-height: 28rem;
  display: flex;
  flex-direction: column;
}

.nilfish-inbox-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding-top: 0.25rem;
}

@media (max-width: 900px) {
  .nilfish-inbox-split {
    flex-direction: column;
  }

  .nilfish-inbox-split__left {
    width: 100% !important;
    max-width: none;
  }

  .nilfish-inbox-split__handle {
    display: none;
  }
}

.nilfish-doc-file-chip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  padding: 0.65rem 0.85rem;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md, 8px);
  background: var(--nilfish-surface-elevated);
  color: var(--nilfish-text);
}

.nilfish-doc-file-chip__name {
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}

.nilfish-doc-file-chip__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.65rem;
  flex-shrink: 0;
}

.nilfish-doc-file-chip .btn-nilfish-ghost {
  color: var(--nilfish-body, #334155);
  border: none;
  background: transparent;
  text-decoration: underline;
  text-underline-offset: 0.15em;
  font-size: 0.8125rem;
  padding: 0.15rem 0.35rem;
}

.nilfish-doc-file-chip .btn-nilfish-ghost:hover,
.nilfish-doc-file-chip .btn-nilfish-ghost:focus-visible {
  color: var(--nilfish-accent, #e85d04);
  background: rgba(var(--nilfish-accent-rgb, 232, 93, 4), 0.08);
}

.btn-nilfish-ghost.is-disabled,
.btn-nilfish-ghost:disabled {
  opacity: 0.55;
  pointer-events: none;
  cursor: not-allowed;
}

.nilfish-doc-viewer {
  display: flex;
  flex-direction: column;
  min-height: min(85vh, 1123px);
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md, 8px);
  overflow: hidden;
  background: #e8e8e6;
}

.nilfish-doc-viewer--empty {
  align-items: center;
  justify-content: center;
  padding: 2rem;
  background: var(--nilfish-white, #fff);
}

/* Upload lives in the same surface as preview (bookkeeping). */
.nilfish-doc-viewer--dropzone {
  padding: 1.25rem;
}

.nilfish-doc-viewer--dropzone > .nilfish-stack {
  flex: 1 1;
  width: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

.nilfish-doc-viewer--dropzone .nilfish-media-dropzone {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: min(70vh, 900px);
  width: 100%;
  box-sizing: border-box;
}

.nilfish-doc-viewer__toolbar > .nilfish-stack {
  flex: 1 1 auto;
  min-width: 0;
  max-width: min(100%, 28rem);
}

.nilfish-doc-viewer__toolbar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  padding: 0.45rem 0.65rem;
  background: var(--nilfish-white, #fff);
  border-bottom: 1px solid var(--nilfish-border);
}

.nilfish-doc-viewer__hint {
  margin-left: auto;
  font-size: 0.8rem;
}

.nilfish-doc-viewer__viewport {
  flex: 1 1;
  min-height: 24rem;
  overflow: hidden;
  position: relative;
}

.nilfish-doc-viewer__viewport--image {
  cursor: -webkit-grab;
  cursor: grab;
  touch-action: none;
}

.nilfish-doc-viewer__viewport--image:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.nilfish-doc-viewer__viewport--pdf {
  display: flex;
  flex-direction: column;
  flex: 1 1;
  min-height: min(80vh, 1050px);
  cursor: default;
  touch-action: auto;
}

.nilfish-doc-viewer__stage {
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
  will-change: transform;
}

.nilfish-doc-viewer__frame {
  flex: 1 1;
  width: 100%;
  min-height: min(80vh, 1050px);
  height: min(80vh, 1050px);
  border: 0;
  background: #fff;
}

.nilfish-doc-viewer__image {
  display: block;
  max-width: 100%;
  height: auto;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
}

.kontering-editor__balanced {
  color: var(--nilfish-success, #1b7a3d);
  font-weight: 600;
}

/* Quick-create supplier (and similar) — keeps PDF preview visible */
.nilfish-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 4rem 1rem 2rem;
  pointer-events: none;
}

/* Confirm sits above other modals (mail, notify, media picker). */
.nilfish-modal--confirm {
  z-index: 90;
  align-items: center;
  padding: 1.5rem 1rem;
}

.nilfish-confirm__panel {
  width: min(24rem, 100%);
}

.nilfish-confirm__message {
  margin: 0;
  font-family: var(--nilfish-font-sans);
  font-size: 0.95rem;
  line-height: 1.45;
  color: var(--nilfish-text);
  white-space: pre-wrap;
}

.nilfish-confirm__panel .nilfish-card__title {
  margin: 0 0 0.65rem;
}

.nilfish-confirm__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-top: 1.15rem;
}

.nilfish-modal__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  margin: 0;
  background: rgba(15, 23, 42, 0.35);
  cursor: pointer;
  pointer-events: auto;
}

.nilfish-modal__panel {
  position: relative;
  z-index: 1;
  width: min(28rem, 100%);
  max-height: calc(100vh - 6rem);
  overflow: auto;
  pointer-events: auto;
  background: var(--nilfish-surface-elevated, var(--nilfish-white, #fff));
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md, 8px);
  box-shadow: var(--nilfish-shadow-overlay, none);
  padding: 1.25rem 1.35rem;
}

.nilfish-modal__panel--wide {
  width: min(40rem, 100%);
}

.nilfish-modal__panel--product-sheet {
  width: min(52rem, calc(100vw - 2rem));
  max-width: calc(100vw - 2rem);
  max-height: calc(100vh - 4rem);
}

.nilfish-modal__section-title {
  margin: 0;
  font-family: var(--nilfish-font-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--nilfish-muted);
  line-height: 1.3;
}

.nilfish-product-sheet-wizard {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 0.25rem 1.5rem;
  gap: 0.25rem 1.5rem;
  margin-top: 0.85rem;
}

.nilfish-product-sheet-wizard__col {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.nilfish-product-sheet-wizard__section {
  margin-top: 0.85rem;
}

.nilfish-product-sheet-wizard__col > .nilfish-product-sheet-wizard__section:first-child {
  margin-top: 0;
}

@media (min-width: 720px) {
  .nilfish-product-sheet-wizard {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }
}

.nilfish-modal__panel--media {
  width: min(56rem, calc(100vw - 2rem));
  max-width: calc(100vw - 2rem);
  max-height: calc(100vh - 4rem);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
}

.nilfish-media-picker__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex: 0 0 auto;
  min-width: 0;
}

.nilfish-media-picker__header h2 {
  min-width: 0;
  overflow-wrap: anywhere;
}

.nilfish-media-picker__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  flex: 0 0 auto;
  min-width: 0;
}

.nilfish-media-picker__toolbar .nilfish-input {
  flex: 1 1 12rem;
  min-width: 0;
  max-width: 100%;
}

.nilfish-media-picker__toolbar .nilfish-file-picker {
  flex: 0 1 auto;
  max-width: 100%;
}

.nilfish-media-picker__folders {
  flex: 1 1 100%;
  min-width: 0;
}

.nilfish-media-picker__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(140px, 100%), 1fr));
  grid-gap: 0.65rem;
  gap: 0.65rem;
  flex: 1 1 auto;
  min-height: 10rem;
  max-height: min(50vh, 28rem);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.15rem;
  width: 100%;
  box-sizing: border-box;
}

.nilfish-media-picker__tile {
  display: flex;
  flex-direction: column;
  position: relative;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  border: 2px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  overflow: hidden;
  background: var(--nilfish-white);
  padding: 0;
  text-align: left;
  color: inherit;
  box-sizing: border-box;
}

.nilfish-media-picker__tile-select {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  text-align: left;
  font: inherit;
}

.nilfish-media-picker__tile.is-selected {
  border-color: var(--nilfish-accent, #e85d04);
  box-shadow: 0 0 0 1px var(--nilfish-accent, #e85d04);
}

.nilfish-media-picker__tile img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 96px;
  max-height: 96px;
  object-fit: cover;
  background: #f3f4f6;
}

.nilfish-media-picker__tile-remove {
  position: absolute;
  top: 0.2rem;
  right: 0.2rem;
  z-index: 1;
  border-radius: var(--nilfish-radius-sm, 4px);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.08);
}

html[data-color-scheme="dark"] .nilfish-media-picker__tile-remove {
  background: rgba(15, 23, 42, 0.78);
}

.nilfish-media-picker__tile-label {
  font-size: 0.7rem;
  padding: 0.3rem 0.4rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.nilfish-media-picker__all-loaded {
  grid-column: 1 / -1;
  text-align: center;
  margin: 0.25rem 0 0;
}

.nilfish-media-picker__status {
  grid-column: 1 / -1;
  margin: 0.5rem 0;
  overflow-wrap: anywhere;
}

.nilfish-media-picker__footer {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.25rem;
  flex: 0 0 auto;
}

@media (max-width: 640px) {
  .nilfish-modal {
    padding: 1rem 0.5rem 1rem;
    align-items: stretch;
  }

  .nilfish-modal__panel--media {
    width: 100%;
    max-width: 100%;
    max-height: calc(100vh - 2rem);
    margin: 0 auto;
  }

  .nilfish-media-picker__grid {
    grid-template-columns: repeat(auto-fill, minmax(min(110px, 100%), 1fr));
    max-height: min(45vh, 22rem);
  }

  .nilfish-media-picker__tile img {
    height: 80px;
    max-height: 80px;
  }
}

.nilfish-modal__panel--pdf {
  width: min(72rem, calc(100vw - 2rem));
  height: calc(100vh - 4rem);
  max-height: calc(100vh - 4rem);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  overflow: hidden;
}

.nilfish-modal__panel--pdf .nilfish-card__title {
  flex: 0 0 auto;
  margin: 0;
}

.nilfish-modal__panel--pdf iframe {
  flex: 1 1 auto;
  width: 100%;
  min-height: 0;
  border: 1px solid var(--nilfish-border);
  border-radius: 4px;
  background: #f8fafc;
}

.nilfish-modal__panel--pdf > .btn-nilfish-secondary {
  flex: 0 0 auto;
  align-self: flex-start;
}

.nilfish-modal:has(.nilfish-modal__panel--pdf) {
  padding: 1.5rem 1rem;
  align-items: center;
}

.nilfish-doc-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

/* Dense document chrome: one row under the orange header */
.nilfish-doc-chrome,
.nilfish-form-chrome {
  margin: 0 0 0.75rem;
}

.nilfish-doc-chrome__row,
.nilfish-form-chrome__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem 0.75rem;
  min-height: 2.25rem;
  padding: 0.15rem 0 0.4rem;
}

/* Save / error status — right cluster, next to the action buttons */
.nilfish-form-chrome__status,
.nilfish-doc-chrome__status {
  flex: 0 1 auto;
  min-width: 0;
  max-width: min(28rem, 55vw);
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

/* ERP toast — docked to 2nd chrome row (subnav / hero-slim), right screen edge */
.nilfish-erp-toast-host {
  position: fixed;
  z-index: 100;
  top: var(--nilfish-navbar-height, 46px);
  right: 0;
  left: auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  max-width: min(22rem, 70vw);
  pointer-events: none;
}

@keyframes nilfish-erp-toast-in {
  from {
    opacity: 0;
    transform: translateX(12px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.nilfish-erp-toast {
  pointer-events: auto;
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  max-width: 100%;
  min-height: var(--nilfish-hero-slim-height, 40px);
  padding: 0 0.65rem 0 0.9rem;
  border-radius: 0;
  font-family: var(--nilfish-font-sans);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: 0.01em;
  border-top: none;
  border-right: none;
  box-shadow: -4px 4px 16px rgba(15, 23, 42, 0.12);
  animation: nilfish-erp-toast-in 160ms ease-out;
}

.nilfish-erp-toast__mark {
  flex: 0 0 auto;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 0;
  background: currentColor;
}

.nilfish-erp-toast__text {
  min-width: 0;
  max-width: 18rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.nilfish-erp-toast__close {
  flex: 0 0 auto;
  margin: 0;
  padding: 0 0.25rem;
  border: none;
  background: transparent;
  color: inherit;
  opacity: 0.55;
  font: inherit;
  font-size: 1.05rem;
  line-height: 1;
  cursor: pointer;
  border-radius: 0;
}

.nilfish-erp-toast__close:hover,
.nilfish-erp-toast__close:focus-visible {
  opacity: 1;
}

.nilfish-erp-toast--success {
  color: var(--nilfish-success, #1b7a3d);
  background: color-mix(in srgb, var(--nilfish-success, #1b7a3d) 14%, var(--nilfish-white, #fff));
  border: 1px solid color-mix(in srgb, var(--nilfish-success, #1b7a3d) 28%, transparent);
  border-top: none;
  border-right: none;
}

.nilfish-erp-toast--error {
  color: var(--nilfish-danger, #dc3545);
  background: color-mix(in srgb, var(--nilfish-danger, #dc3545) 12%, var(--nilfish-white, #fff));
  border: 1px solid color-mix(in srgb, var(--nilfish-danger, #dc3545) 28%, transparent);
  border-top: none;
  border-right: none;
}

.nilfish-erp-toast--neutral {
  color: var(--nilfish-heading, var(--nilfish-body, #1f2937));
  background: color-mix(in srgb, var(--nilfish-muted, #64748b) 10%, var(--nilfish-white, #fff));
  border: 1px solid var(--nilfish-border, #e2e8f0);
  border-top: none;
  border-right: none;
}

html[data-color-scheme="dark"] .nilfish-erp-toast--success {
  color: #7ddea0;
  background: color-mix(in srgb, var(--nilfish-success, #1b7a3d) 55%, #0b1220);
  border-color: color-mix(in srgb, var(--nilfish-success, #1b7a3d) 55%, transparent);
  box-shadow: -4px 4px 18px rgba(0, 0, 0, 0.4);
}

html[data-color-scheme="dark"] .nilfish-erp-toast--error {
  color: #f0a0a8;
  background: color-mix(in srgb, var(--nilfish-danger, #dc3545) 50%, #0b1220);
  border-color: color-mix(in srgb, var(--nilfish-danger, #dc3545) 50%, transparent);
  box-shadow: -4px 4px 18px rgba(0, 0, 0, 0.4);
}

html[data-color-scheme="dark"] .nilfish-erp-toast--neutral {
  color: var(--nilfish-text);
  background: color-mix(in srgb, var(--nilfish-muted, #9aa0a6) 42%, #0b1220);
  border-color: color-mix(in srgb, var(--nilfish-muted, #9aa0a6) 40%, transparent);
  box-shadow: -4px 4px 18px rgba(0, 0, 0, 0.4);
}


@keyframes nilfish-form-feedback-in {
  from {
    opacity: 0;
    transform: translateY(2px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.nilfish-form-feedback {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  max-width: min(36rem, 100%);
  padding: 0.3rem 0.7rem 0.3rem 0.55rem;
  border-radius: 999px;
  font-family: var(--nilfish-font-sans);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: 0.01em;
  animation: nilfish-form-feedback-in 160ms ease-out;
}

.nilfish-form-feedback__mark {
  flex: 0 0 auto;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 18%, transparent);
}

.nilfish-form-feedback__text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nilfish-form-feedback--success {
  color: var(--nilfish-success, #1b7a3d);
  background: color-mix(in srgb, var(--nilfish-success, #1b7a3d) 11%, var(--nilfish-white, #fff));
  border: 1px solid color-mix(in srgb, var(--nilfish-success, #1b7a3d) 22%, transparent);
}

.nilfish-form-feedback--error {
  color: var(--nilfish-danger, #dc3545);
  background: color-mix(in srgb, var(--nilfish-danger, #dc3545) 10%, var(--nilfish-white, #fff));
  border: 1px solid color-mix(in srgb, var(--nilfish-danger, #dc3545) 22%, transparent);
}

.nilfish-form-feedback--neutral {
  color: var(--nilfish-muted, #64748b);
  background: color-mix(in srgb, var(--nilfish-muted, #64748b) 8%, var(--nilfish-white, #fff));
  border: 1px solid color-mix(in srgb, var(--nilfish-border, #e2e8f0) 80%, transparent);
}

html[data-color-scheme="dark"] .nilfish-form-feedback--success {
  background: color-mix(in srgb, var(--nilfish-success, #1b7a3d) 18%, transparent);
}

html[data-color-scheme="dark"] .nilfish-form-feedback--error {
  background: color-mix(in srgb, var(--nilfish-danger, #dc3545) 16%, transparent);
}

html[data-color-scheme="dark"] .nilfish-form-feedback--neutral {
  background: color-mix(in srgb, var(--nilfish-muted, #9aa0a6) 14%, transparent);
}

/* List / filter segmented control (not document pages) */
.nilfish-pill-tabs {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem;
  padding: 0.2rem;
  min-width: 0;
  flex: 0 1 auto;
  background: var(--nilfish-pill-tabs-track, var(--nilfish-border, #e8eaee));
  border-radius: 999px;
}

.nilfish-pill-tabs__tab {
  border: none;
  background: transparent;
  padding: 0.4rem 0.95rem;
  margin: 0;
  font: inherit;
  font-family: var(--nilfish-font-sans);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25;
  color: var(--nilfish-muted);
  cursor: pointer;
  border-radius: 999px;
}

.nilfish-pill-tabs__tab:hover,
.nilfish-pill-tabs__tab:focus-visible {
  color: var(--nilfish-body);
}

.nilfish-pill-tabs__tab.is-active {
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  color: var(--nilfish-heading, var(--nilfish-body, #1f2937));
  font-weight: 600;
  box-shadow: none;
  border: 1px solid transparent;
}

/* Record document sheet — folder tabs attached to the paper */
.nilfish-record-sheet {
  background: var(--nilfish-surface-elevated, var(--nilfish-white, #fff));
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  margin: 0 0 1rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

.nilfish-folder-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.2rem;
  padding: 0.4rem 0.65rem 0;
  margin: 0;
  background: color-mix(in srgb, var(--nilfish-heading, var(--nilfish-primary)) 4%, var(--nilfish-bg, var(--nilfish-bg-light, #f8fafc)));
  border-bottom: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg) var(--nilfish-radius-lg) 0 0;
}

.nilfish-folder-tab {
  position: relative;
  z-index: 0;
  border: 1px solid transparent;
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  padding: 0.45rem 0.95rem;
  margin: 0 0 -1px;
  background: transparent;
  color: var(--nilfish-muted);
  font: inherit;
  font-family: var(--nilfish-font-sans);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25;
  cursor: pointer;
}

.nilfish-folder-tab:hover,
.nilfish-folder-tab:focus-visible {
  color: var(--nilfish-heading, var(--nilfish-body));
}

.nilfish-folder-tab.is-active {
  z-index: 1;
  background: var(--nilfish-surface-elevated, var(--nilfish-white, #fff));
  border-color: var(--nilfish-border);
  border-bottom-color: var(--nilfish-surface-elevated, var(--nilfish-white, #fff));
  color: var(--nilfish-heading, var(--nilfish-primary, #1f2937));
  font-weight: 600;
}

.nilfish-record-sheet__body {
  padding: 1.25rem 1.5rem 1.5rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  container-type: inline-size;
  container-name: nilfish-form-surface;
}

/* Sales document already has its own paper — avoid double frame */
.nilfish-record-sheet__body:has(> .nilfish-sales-doc) {
  padding: 0;
}

.nilfish-record-sheet .nilfish-sales-doc {
  border: none;
  border-radius: 0;
  margin-bottom: 0;
}

.nilfish-record-sheet__body > .nilfish-stack {
  gap: 1rem;
}

.nilfish-record-sheet__body > .nilfish-grid {
  margin: 0;
}

.nilfish-form-chrome__actions,
.nilfish-doc-chrome__actions {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin-left: auto;
  flex: 0 0 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.nilfish-form-chrome__actions .btn-nilfish-primary,
.nilfish-form-chrome__actions .btn-nilfish-secondary,
.nilfish-doc-chrome__actions .btn-nilfish-primary,
.nilfish-doc-chrome__actions .btn-nilfish {
  padding: 0.35rem 0.85rem;
  font-size: 0.8125rem;
  letter-spacing: 0.02em;
}

.nilfish-form-chrome__actions .btn-nilfish-ghost,
.nilfish-doc-chrome__actions .btn-nilfish-ghost {
  padding: 0.35rem 0.55rem;
  text-decoration: none;
}

.nilfish-form-chrome__actions .btn-nilfish-danger,
.nilfish-form-chrome__actions a.btn-nilfish-danger,
.nilfish-doc-chrome__actions .btn-nilfish-danger {
  margin-left: 0.35rem;
}

.nilfish-form-chrome__banner,
.nilfish-doc-chrome__banner {
  margin-top: 0.35rem;
}

/* Legacy class kept so old markup does not break; prefer __status + FormFeedback */
.nilfish-form-chrome__message,
.nilfish-doc-chrome__message {
  margin-top: 0;
}

.nilfish-doc-card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin-bottom: 0.35rem;
}

.nilfish-doc-card-head__title {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--nilfish-primary);
}

.nilfish-doc-chrome__nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  flex: 0 1 auto;
}

.nilfish-doc-chrome__nav .nilfish-erp-breadcrumb {
  margin: 0;
}

.nilfish-doc-chrome__status {
  display: inline-flex;
  align-items: center;
}

.nilfish-doc-actions-menu {
  position: relative;
  /* After Cancel in FormChrome (toolbar sits in extraActions before Cancel). */
  order: 1;
}

.nilfish-doc-actions-toolbar {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.nilfish-doc-actions-menu__trigger {
  min-width: 2rem;
  padding: 0.25rem 0.5rem;
  font-size: 1.25rem;
  line-height: 1;
  letter-spacing: 0.05em;
}

.nilfish-doc-actions-menu__panel {
  position: absolute;
  right: 0;
  top: calc(100% + 0.25rem);
  z-index: 80;
  min-width: 11rem;
  padding: 0.35rem;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  background: var(--nilfish-surface-elevated, var(--nilfish-white, #fff));
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22);
}

.nilfish-doc-actions-menu__panel[hidden] {
  display: none !important;
}

.nilfish-doc-actions-menu__item {
  display: block;
  width: 100%;
  border: none;
  border-radius: var(--nilfish-radius-sm, 4px);
  background: transparent;
  text-align: left;
  padding: 0.45rem 0.65rem;
  font: inherit;
  font-size: 0.875rem;
  color: var(--nilfish-body, var(--nilfish-text));
  cursor: pointer;
}

.nilfish-doc-actions-menu__item[hidden] {
  display: none !important;
}

.nilfish-doc-actions-menu__item:hover,
.nilfish-doc-actions-menu__item:focus-visible {
  background: rgba(128, 128, 128, 0.14);
  outline: none;
}

.nilfish-doc-actions-menu__item:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.nilfish-doc-actions-menu__item--primary {
  font-weight: 600;
  color: var(--nilfish-accent);
}

.nilfish-doc-actions-menu__item--danger {
  color: var(--nilfish-danger, #dc3545);
}

.nilfish-doc-actions-menu__item--danger:hover,
.nilfish-doc-actions-menu__item--danger:focus-visible {
  background: color-mix(in srgb, var(--nilfish-danger, #dc3545) 12%, transparent);
  color: var(--nilfish-danger, #dc3545);
}

.nilfish-doc-actions-menu__sep {
  border: none;
  border-top: 1px solid var(--nilfish-border);
  margin: 0.25rem 0.35rem;
}

.nilfish-doc-actions-menu__extra {
  border-top: 1px solid var(--nilfish-border-subtle, var(--nilfish-border));
  margin-top: 0.15rem;
  padding-top: 0.15rem;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.nilfish-doc-actions-menu__extra .btn-nilfish-primary,
.nilfish-doc-actions-menu__extra .btn-nilfish-secondary,
.nilfish-doc-actions-menu__extra .btn-nilfish {
  display: block;
  width: 100%;
  border: none;
  border-radius: var(--nilfish-radius-sm, 4px);
  background: transparent;
  box-shadow: none;
  text-align: left;
  padding: 0.45rem 0.65rem;
  font-size: 0.875rem;
  color: var(--nilfish-body, var(--nilfish-text));
}

.nilfish-doc-actions-menu__extra .btn-nilfish-primary {
  font-weight: 600;
  color: var(--nilfish-accent);
}

/* FormChrome overflow (⋯): flatten ghost/secondary/danger into menu rows */
.nilfish-form-chrome__overflow-panel .btn-nilfish-ghost,
.nilfish-form-chrome__overflow-panel .btn-nilfish-secondary,
.nilfish-form-chrome__overflow-panel .btn-nilfish-danger,
.nilfish-form-chrome__overflow-panel a.btn-nilfish-ghost,
.nilfish-form-chrome__overflow-panel a.btn-nilfish-secondary,
.nilfish-form-chrome__overflow-panel a.btn-nilfish-danger {
  display: block;
  width: 100%;
  justify-content: flex-start;
  border: none;
  border-radius: var(--nilfish-radius-sm, 4px);
  background: transparent;
  box-shadow: none;
  text-align: left;
  padding: 0.45rem 0.65rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--nilfish-body, var(--nilfish-text));
  text-decoration: none;
}

.nilfish-form-chrome__overflow-panel .btn-nilfish-ghost:hover,
.nilfish-form-chrome__overflow-panel .btn-nilfish-secondary:hover,
.nilfish-form-chrome__overflow-panel a.btn-nilfish-ghost:hover,
.nilfish-form-chrome__overflow-panel a.btn-nilfish-secondary:hover,
.nilfish-form-chrome__overflow-panel .btn-nilfish-ghost:focus-visible,
.nilfish-form-chrome__overflow-panel .btn-nilfish-secondary:focus-visible,
.nilfish-form-chrome__overflow-panel a.btn-nilfish-ghost:focus-visible,
.nilfish-form-chrome__overflow-panel a.btn-nilfish-secondary:focus-visible {
  background: rgba(128, 128, 128, 0.14);
  outline: none;
}

.nilfish-form-chrome__overflow-panel .btn-nilfish-danger,
.nilfish-form-chrome__overflow-panel a.btn-nilfish-danger {
  color: var(--nilfish-danger, #dc3545);
}

.nilfish-form-chrome__overflow-panel .btn-nilfish-danger:hover,
.nilfish-form-chrome__overflow-panel a.btn-nilfish-danger:hover,
.nilfish-form-chrome__overflow-panel .btn-nilfish-danger:focus-visible,
.nilfish-form-chrome__overflow-panel a.btn-nilfish-danger:focus-visible {
  background: color-mix(in srgb, var(--nilfish-danger, #dc3545) 12%, transparent);
  color: var(--nilfish-danger, #dc3545);
}

.nilfish-inbox-meta--in-card {
  margin: 0 0 0.75rem;
  font-size: 0.8125rem;
}

/* Sales party/contact row — stack first; widen only when the card is wide enough */
.nilfish-doc-party {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 0.5rem 1rem;
  gap: 0.5rem 1rem;
  align-items: end;
  margin-bottom: 0.25rem;
  width: 100%;
  min-width: 0;
}

.nilfish-doc-party__field,
.nilfish-doc-party__field--customer {
  min-width: 0;
  max-width: none;
}

/* Customer sits alone on top; contact fields share the fluid columns below */
.nilfish-doc-party__field--customer {
  grid-column: 1 / -1;
}

.nilfish-doc-party__field .nilfish-input {
  padding: 0.4rem 0.6rem;
  font-size: 0.875rem;
  width: 100%;
  max-width: 100%;
}

.nilfish-doc-party__notes {
  width: 100%;
}

.nilfish-doc-party__notes-toggle {
  padding: 0.15rem 0;
  font-size: 0.8125rem;
  font-weight: 600;
}

.nilfish-sales-doc {
  background: #fff;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  padding: 1.5rem 1.75rem;
  margin-bottom: 1rem;
}

/* Paper is always white — keep light-scheme ink under dark UI chrome */
html[data-color-scheme="dark"] .nilfish-sales-doc {
  color: #334155;
  --nilfish-text: #334155;
  --nilfish-body: #334155;
  --nilfish-heading: var(--nilfish-primary, #0d1b2a);
  --nilfish-muted: #64748b;
  --nilfish-light-gray: #94a3b8;
  --nilfish-border: #e2e8f0;
  --nilfish-border-subtle: rgba(13, 27, 42, 0.08);
  --nilfish-surface: #f4f6f9;
  --nilfish-surface-elevated: #ffffff;
  --nilfish-bg: #f8fafc;
  --nilfish-bg-light: #f8fafc;
  --nilfish-white: #ffffff;
}

html[data-color-scheme="dark"] .nilfish-sales-doc .nilfish-status-pill--done {
  color: var(--nilfish-primary, #0d1b2a);
}

.nilfish-sales-doc__top {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
  margin-bottom: 1.25rem;
}

.nilfish-sales-doc__company {
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--nilfish-primary);
}

.nilfish-sales-doc__logo {
  max-height: 48px;
  max-width: 160px;
  object-fit: contain;
}

.nilfish-sales-doc__kind {
  font-size: 1.35rem;
  font-weight: 700;
  margin: 0;
}

.nilfish-sales-doc__status {
  margin: 0.25rem 0 0;
}

.nilfish-sales-doc__addr {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 1.25rem;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}

@media (max-width: 768px) {
  .nilfish-sales-doc__addr {
    grid-template-columns: 1fr;
  }
}

.nilfish-sales-doc__addr h3 {
  margin: 0 0 0.35rem;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-sales-doc__addr p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.4;
}

.nilfish-sales-doc__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  margin-bottom: 1rem;
  font-size: 0.9rem;
}

.nilfish-sales-doc__totals {
  margin-left: auto;
  width: min(18rem, 100%);
  max-width: 100%;
  margin-top: 1rem;
  box-sizing: border-box;
}

.nilfish-sales-doc__totals p {
  display: flex;
  justify-content: space-between;
  margin: 0.2rem 0;
}

.nilfish-sales-doc iframe {
  flex: 1 1;
  width: 100%;
  min-height: 24rem;
  border: 1px solid var(--nilfish-border);
  border-radius: 4px;
}

.nilfish-stack {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

/* Flex/grid children default to min-width:auto and will grow the stack past the card. */
.nilfish-stack > * {
  min-width: 0;
  max-width: 100%;
}

/* Stack stretch must not turn secondary/primary actions into full-width bars */
.nilfish-stack > .btn-nilfish-primary,
.nilfish-stack > .btn-nilfish-secondary,
.nilfish-stack > .btn-nilfish-ghost,
.nilfish-stack > .btn-nilfish-danger {
  align-self: flex-start;
  max-width: none;
}

.nilfish-row {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  align-items: center;
  min-width: 0;
  max-width: 100%;
}

/*
 * Fluid form field row (ERP + public frontends).
 * Default = one column (stack). Opens to 2 / auto-fill when the nearest
 * .nilfish-card / record-sheet body is wide enough (container queries).
 */
.nilfish-field-row {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 0.5rem 1rem;
  gap: 0.5rem 1rem;
  align-items: end;
  width: 100%;
  min-width: 0;
}

.nilfish-field-row > * {
  min-width: 0;
  max-width: 100%;
}

@container nilfish-form-surface (min-width: 36rem) {
  .nilfish-field-row,
  .nilfish-doc-party {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container nilfish-form-surface (min-width: 56rem) {
  .nilfish-field-row,
  .nilfish-doc-party {
    grid-template-columns: repeat(auto-fill, minmax(min(14rem, 100%), 1fr));
  }
}

/* Viewport fallback when a parent still expands (legacy overflow) */
@media (max-width: 56rem) {
  .nilfish-field-row,
  .nilfish-doc-party {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 36rem) {
  .nilfish-field-row,
  .nilfish-doc-party {
    grid-template-columns: 1fr;
  }
}

/* Odoo-style binary setting: pill switch + label + ? */
.nilfish-setting-toggle {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  min-width: 0;
}

.nilfish-setting-toggle--disabled {
  opacity: 0.55;
  pointer-events: none;
}

.nilfish-setting-toggle--locked .nilfish-setting-toggle__switch,
.nilfish-setting-toggle--locked .nilfish-setting-toggle__switch[aria-checked="true"] {
  background: var(--nilfish-muted);
  cursor: not-allowed;
  opacity: 0.7;
}

.nilfish-setting-toggle--locked .nilfish-setting-toggle__label,
.nilfish-setting-toggle--locked .nilfish-setting-toggle__label-btn {
  color: var(--nilfish-muted);
  cursor: not-allowed;
}

.nilfish-setting-toggle__switch {
  flex: 0 0 auto;
  position: relative;
  width: 2rem;
  height: 1.125rem;
  margin-top: 0.2rem;
  padding: 0;
  border: none;
  border-radius: 999px;
  background: var(--nilfish-border, #cbd5e1);
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.nilfish-setting-toggle__switch[aria-checked="true"] {
  background: var(--nilfish-accent);
}

.nilfish-setting-toggle__switch:focus-visible {
  outline: 2px solid var(--nilfish-accent);
  outline-offset: 2px;
}

.nilfish-setting-toggle__knob {
  position: absolute;
  top: 0.125rem;
  left: 0.125rem;
  width: 0.875rem;
  height: 0.875rem;
  border-radius: 50%;
  background: var(--nilfish-surface-elevated, #fff);
  border: 1px solid var(--nilfish-border, #e2e8f0);
  box-shadow: none;
  transition: transform 0.15s ease;
}

.nilfish-setting-toggle__switch[aria-checked="true"] .nilfish-setting-toggle__knob {
  transform: translateX(0.875rem);
}

.nilfish-setting-toggle__body {
  min-width: 0;
  flex: 1 1 auto;
}

.nilfish-setting-toggle__label {
  font-weight: 600;
  font-size: 0.9375rem;
  color: var(--nilfish-body, #334155);
  line-height: 1.35;
}

.nilfish-setting-toggle__label-btn {
  display: inline;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  font: inherit;
  font-weight: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.nilfish-setting-toggle__desc {
  margin: 0.25rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.4;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-setting-toggle--switch {
  align-items: center;
  justify-content: center;
}

.nilfish-setting-toggle--switch .nilfish-setting-toggle__switch {
  margin-top: 0;
}

/* Repeated boolean settings: compact column headers + switch-only cells */
.nilfish-settings-table,
.nilfish-series-table {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.nilfish-settings-table__head,
.nilfish-settings-table__row,
.nilfish-series-table__head,
.nilfish-series-table__row {
  display: grid;
  grid-template-columns: minmax(10rem, 1fr) 5.5rem minmax(7.5rem, 9.5rem);
  grid-gap: 0.75rem 1rem;
  gap: 0.75rem 1rem;
  align-items: center;
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--nilfish-border, #e2e8f0);
}

.nilfish-settings-table__head,
.nilfish-series-table__head {
  padding-top: 0;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-settings-table__row:last-child,
.nilfish-series-table__row:last-child {
  border-bottom: none;
}

.nilfish-settings-table__cell--toggle,
.nilfish-series-table__cell--toggle {
  display: flex;
  justify-content: center;
  text-align: center;
}

.nilfish-settings-table__head .nilfish-settings-table__cell--toggle,
.nilfish-series-table__head .nilfish-series-table__cell--toggle {
  justify-content: center;
}

/* Toggle column inside dense data tables (menu items, etc.) */
.nilfish-data-table thead th.nilfish-settings-col {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--nilfish-muted, #64748b);
  text-align: center;
  white-space: normal;
  vertical-align: bottom;
}

.nilfish-data-table td.nilfish-settings-col {
  text-align: center;
  vertical-align: middle;
}

@media (max-width: 640px) {
  .nilfish-settings-table__head,
  .nilfish-settings-table__row,
  .nilfish-series-table__head,
  .nilfish-series-table__row {
    grid-template-columns: minmax(0, 1fr) 4.5rem minmax(5.5rem, 1fr);
    gap: 0.5rem 0.65rem;
  }

  .nilfish-settings-table__head .nilfish-settings-table__cell--toggle,
  .nilfish-series-table__head .nilfish-series-table__cell--toggle {
    font-size: 0.75rem;
    line-height: 1.25;
  }
}

.nilfish-mb-1 {
  margin-bottom: 1rem;
}

/* ── Forms ───────────────────────────────────────────────────────────────── */

.nilfish-form {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  max-width: 480px;
  width: 100%;
  min-width: 0;
}

/* Document editors / line tables — full card width, never past the card */
.nilfish-form--wide {
  max-width: 100%;
  width: 100%;
  min-width: 0;
}

/* When form + stack share a node, keep both constrained */
.nilfish-form.nilfish-stack,
.nilfish-form--wide.nilfish-stack {
  max-width: 100%;
  width: 100%;
  min-width: 0;
}

.nilfish-form__narrow {
  max-width: 480px;
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.nilfish-input,
.nilfish-textarea {
  width: 100%;
  padding: 0.625rem 0.75rem;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  font-family: var(--nilfish-font-sans);
  font-size: 0.9375rem;
  color: var(--nilfish-body);
  background: var(--nilfish-white);
}

html[data-color-scheme="dark"] .nilfish-input,
html[data-color-scheme="dark"] .nilfish-textarea {
  /* Border must read against elevated fill (#222 on #1a1a) */
  border-color: color-mix(in srgb, var(--nilfish-text) 22%, var(--nilfish-border));
  background: color-mix(in srgb, var(--nilfish-text) 4%, var(--nilfish-surface-elevated));
  color-scheme: dark;
}

/* Native date/time picker: color-scheme:dark already paints a light glyph.
   Do not invert — that turns it dark again against dark input fills (todo form, etc.). */
html[data-color-scheme="dark"] .nilfish-input[type="date"]::-webkit-calendar-picker-indicator,
html[data-color-scheme="dark"] .nilfish-input[type="time"]::-webkit-calendar-picker-indicator,
html[data-color-scheme="dark"] .nilfish-input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  filter: none;
  opacity: 0.85;
}

.nilfish-input:focus,
.nilfish-textarea:focus {
  outline: 2px solid rgba(var(--nilfish-accent-rgb), 0.35);
  border-color: var(--nilfish-accent);
}

.nilfish-checkbox-row {
  display: flex;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  align-items: flex-start;
}

.nilfish-toggle-link {
  margin: 1rem 0;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--nilfish-accent);
  font-weight: 600;
  font-family: var(--nilfish-font-sans);
  font-size: 0.9375rem;
  padding: 0;
}

.nilfish-price-display {
  font-size: 2rem;
  font-weight: 700;
  color: var(--nilfish-heading, var(--nilfish-primary));
  margin: 0 0 1rem;
}

.nilfish-price {
  margin: 0.25rem 0;
  font-weight: 600;
}

.nilfish-stock--in {
  color: #198754;
  font-size: 0.875rem;
}

.nilfish-stock--out {
  color: var(--nilfish-accent);
  font-size: 0.875rem;
}

.nilfish-list-hint-cell {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}

/*
 * List hint “lamp” — intentional exception to the matte ERP chrome:
 * tiny Mac-style traffic lights need a bit of gloss to read at ~10px.
 */
.nilfish-list-hint {
  flex: 0 0 auto;
  width: 0.65rem;
  height: 0.65rem;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
  box-shadow:
    0 0.5px 0.5px rgba(255, 255, 255, 0.45) inset,
    0 1px 2px rgba(0, 0, 0, 0.35),
    0 0 0 0.5px rgba(0, 0, 0, 0.25);
}

.nilfish-list-hint--green {
  background: radial-gradient(
    circle at 32% 28%,
    #7dff9a 0%,
    #34c759 42%,
    #1a9f3e 78%,
    #0f7a2c 100%
  );
}

.nilfish-list-hint--yellow {
  background: radial-gradient(
    circle at 32% 28%,
    #ffe566 0%,
    #ffcc00 42%,
    #d4a800 78%,
    #a67c00 100%
  );
}

.nilfish-list-hint--red {
  background: radial-gradient(
    circle at 32% 28%,
    #ff8a80 0%,
    #ff3b30 42%,
    #d32f2f 78%,
    #9b1c1c 100%
  );
}

/* Legacy aliases */
.nilfish-parts-light-cell {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}

.nilfish-parts-light {
  flex: 0 0 auto;
  width: 0.65rem;
  height: 0.65rem;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
  box-shadow:
    0 0.5px 0.5px rgba(255, 255, 255, 0.45) inset,
    0 1px 2px rgba(0, 0, 0, 0.35),
    0 0 0 0.5px rgba(0, 0, 0, 0.25);
}

.nilfish-parts-light--green {
  background: radial-gradient(
    circle at 32% 28%,
    #7dff9a 0%,
    #34c759 42%,
    #1a9f3e 78%,
    #0f7a2c 100%
  );
}

.nilfish-parts-light--yellow {
  background: radial-gradient(
    circle at 32% 28%,
    #ffe566 0%,
    #ffcc00 42%,
    #d4a800 78%,
    #a67c00 100%
  );
}

.nilfish-parts-light--red {
  background: radial-gradient(
    circle at 32% 28%,
    #ff8a80 0%,
    #ff3b30 42%,
    #d32f2f 78%,
    #9b1c1c 100%
  );
}

.nilfish-tenant-nav {
  display: flex;
  gap: 1rem;
  margin-bottom: 2rem;
  flex-wrap: wrap;
}

.nilfish-tenant-nav a {
  color: var(--nilfish-accent);
  font-weight: 600;
  text-decoration: none;
}

.nilfish-tenant-nav a:hover {
  text-decoration: underline;
}

.nilfish-hero-actions {
  margin-top: 1.5rem;
}

.nilfish-section-header {
  margin-bottom: 2rem;
}

/* ── Hero & sections (storefront) ────────────────────────────────────────── */

.nilfish-home {
  overflow-x: hidden;
}

.nilfish-home-section {
  padding: 5rem 0;
}

/* Contact / hours / team: stack tightly so mid-page gaps do not look like “end of page”.
   Density compact/airy below still override when set. */
.nilfish-home-section.nilfish-home-contact,
.nilfish-home-section.nilfish-home-hours,
.nilfish-home-section.nilfish-home-team {
  padding-block: 2rem;
}

.nilfish-home-section.nilfish-home-contact + .nilfish-home-section:not(.nilfish-section--density-airy),
.nilfish-home-section.nilfish-home-hours + .nilfish-home-section:not(.nilfish-section--density-airy),
.nilfish-home-section.nilfish-home-team + .nilfish-home-section:not(.nilfish-section--density-airy) {
  padding-top: 1.25rem;
}

.nilfish-home-section.nilfish-home-contact .nilfish-section-header,
.nilfish-home-section.nilfish-home-hours .nilfish-section-header,
.nilfish-home-section.nilfish-home-team .nilfish-section-header {
  margin-bottom: 1.15rem;
}

/* Compact / airy must outrank the padding shorthand above (higher specificity). */
.nilfish-home-section.nilfish-section--density-compact {
  padding-block: 1.5rem;
}

.nilfish-home-section.nilfish-section--density-airy {
  padding-block: 8rem;
}

.nilfish-team-grid {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  margin: 0;
}

.nilfish-team-card {
  background: #fff;
  border: 1px solid rgba(13, 27, 42, 0.08);
  border-radius: 1rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
  text-align: left;
}

.nilfish-team-card__media {
  position: relative;
  aspect-ratio: 1 / 1;
  background: linear-gradient(180deg, #eef2f6 0%, #e7edf3 100%);
  overflow: hidden;
}

.nilfish-team-card__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  margin: 0;
  border-radius: 0;
  background: var(--nilfish-surface-muted, #f0f0f0);
}

.nilfish-team-card__photo--empty {
  border: none;
}

.nilfish-team-card__body {
  padding: 0.75rem 0.85rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  flex: 1 1;
}

.nilfish-team-card__name {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--nilfish-ink, #0d1b2a);
}

.nilfish-team-card__title {
  color: var(--nilfish-muted);
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.3;
}

.nilfish-team-card__bio {
  font-size: 0.85rem;
  margin: 0.15rem 0 0;
  line-height: 1.4;
  color: var(--nilfish-body, #334155);
}

.nilfish-hours-channels {
  display: grid;
  grid-gap: 1.5rem;
  gap: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  max-width: 56rem;
  margin: 0 auto;
}

.nilfish-hours-channel.nilfish-feature-card {
  padding: 1.5rem;
}

.nilfish-hours-channel.nilfish-feature-card:hover {
  /* Static info panel — skip marketing hover lift */
  border-color: var(--nilfish-border);
  box-shadow: var(--nilfish-shadow-card);
}

.nilfish-hours-channel__head {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  margin-bottom: 0.25rem;
}

.nilfish-hours-channel__head .nilfish-feature-icon {
  flex: none;
  height: 2.5rem;
  margin-bottom: 0;
  width: 2.5rem;
}

.nilfish-hours-channel__head h3 {
  margin: 0;
}

.nilfish-accordion__list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-width: 42rem;
  margin: 0 auto;
}

.nilfish-accordion__item {
  border: 1px solid var(--nilfish-border, #e2e8f0);
  border-radius: var(--nilfish-radius-md, 0.5rem);
  background: var(--nilfish-surface, #fff);
  overflow: hidden;
}

.nilfish-accordion__heading {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
}

.nilfish-accordion__trigger {
  align-items: center;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: flex;
  font: inherit;
  font-weight: 600;
  gap: 0.75rem;
  justify-content: space-between;
  padding: 0.9rem 1rem;
  text-align: left;
  width: 100%;
}

.nilfish-accordion__trigger:hover {
  background: var(--nilfish-bg-light, #f8fafc);
}

.nilfish-accordion__trigger:focus-visible {
  outline: 2px solid var(--nilfish-accent, #c45a12);
  outline-offset: -2px;
}

.nilfish-accordion__title {
  flex: 1 1;
  min-width: 0;
}

.nilfish-accordion__chevron {
  color: var(--nilfish-muted, #64748b);
  flex: none;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1;
}

.nilfish-accordion__panel {
  border-top: 1px solid var(--nilfish-border, #e2e8f0);
  padding: 0.85rem 1rem 1.1rem;
}

.nilfish-accordion__body {
  margin: 0;
}

.nilfish-accordion__body > :first-child {
  margin-top: 0;
}

.nilfish-accordion__body > :last-child {
  margin-bottom: 0;
}

.nilfish-hours-days {
  margin: 0.75rem 0 0;
}

.nilfish-hours-day {
  display: grid;
  grid-template-columns: minmax(5rem, auto) 1fr;
  grid-gap: 0.5rem 1rem;
  gap: 0.5rem 1rem;
  padding: 0.4rem 0;
  border-bottom: 1px solid var(--nilfish-border-subtle, rgba(0, 0, 0, 0.06));
}

.nilfish-hours-day:last-child {
  border-bottom: 0;
}

.nilfish-hours-day dt {
  margin: 0;
  font-weight: 600;
}

.nilfish-hours-day dd {
  margin: 0;
  text-align: right;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.nilfish-hours-day--closed dd {
  color: var(--nilfish-muted);
}

.nilfish-hours-day--today {
  color: var(--nilfish-heading, var(--nilfish-primary));
}

.nilfish-hours-day--today:not(.nilfish-hours-day--closed) dd {
  font-weight: 600;
}

/* Master dark surfaces: keep open + closed hours equally readable */
[data-nilfish-theme="master"] .nilfish-hours-day,
[data-nilfish-theme="master"] .nilfish-hours-day dt,
[data-nilfish-theme="master"] .nilfish-hours-day dd,
[data-nilfish-theme="master"] .nilfish-hours-day--today,
[data-nilfish-theme="master"] .nilfish-hours-day--today:not(.nilfish-hours-day--closed) dd,
[data-nilfish-theme="master"] .nilfish-hours-day--closed dd {
  color: #e2e8f0;
}

.nilfish-company-contact {
  font-style: normal;
  line-height: 1.6;
  max-width: 28rem;
  margin: 0 auto;
  padding: 1.5rem;
  text-align: left;
}

.nilfish-company-contact.nilfish-feature-card:hover {
  border-color: var(--nilfish-border);
  box-shadow: var(--nilfish-shadow-card);
}

.nilfish-company-contact__name {
  display: block;
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 0.85rem;
}

.nilfish-company-contact__row {
  align-items: flex-start;
  display: flex;
  gap: 0.75rem;
  margin: 0.55rem 0;
}

.nilfish-company-contact__icon {
  align-items: center;
  background: rgba(var(--nilfish-accent-rgb), 0.12);
  border-radius: var(--nilfish-radius-lg);
  color: var(--nilfish-accent);
  display: inline-flex;
  flex: none;
  height: 2rem;
  justify-content: center;
  margin-top: 0.1rem;
  width: 2rem;
}

.nilfish-company-contact__line {
  display: block;
}

.nilfish-company-contact a {
  color: var(--nilfish-accent);
  text-decoration: none;
}

.nilfish-company-contact a:hover {
  text-decoration: underline;
}

.nilfish-home-hero {
  background: linear-gradient(
    145deg,
    var(--nilfish-primary) 0%,
    #152a45 45%,
    var(--nilfish-primary-soft) 100%
  );
  color: #fff;
  position: relative;
  overflow: hidden;
}

.nilfish-home-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(var(--nilfish-accent-rgb), 0.07) 1px, transparent 1px),
    linear-gradient(rgba(var(--nilfish-accent-rgb), 0.07) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 70% 40%, black 20%, transparent 75%);
          mask-image: radial-gradient(ellipse 80% 70% at 70% 40%, black 20%, transparent 75%);
  pointer-events: none;
}

.nilfish-home-title {
  color: #fff;
  font-size: clamp(2rem, 4.5vw, 3.25rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.12;
  margin: 0;
}

.nilfish-home-lead {
  color: var(--nilfish-accent);
  font-size: 1.15rem;
  font-weight: 500;
  margin: 0;
}

.nilfish-home-sub {
  color: var(--nilfish-light-gray);
  font-size: 1.05rem;
  max-width: 520px;
  margin: 0;
}

.nilfish-home-categories {
  background: var(--nilfish-bg-light);
}

.nilfish-home-features {
  background: #fff;
}

.nilfish-cta-block {
  background: var(--nilfish-primary);
  border-radius: var(--nilfish-radius-xl);
  color: #fff;
  padding: 3rem 2rem;
  text-align: center;
}

.nilfish-cta-block h2 {
  color: #fff;
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  margin: 0 0 0.75rem;
}

.nilfish-cta-block p {
  color: var(--nilfish-light-gray);
  font-size: 1.05rem;
  margin: 0 0 1.5rem;
}

/* Slim page header — same density as ErpListView title + description */
.nilfish-page-header {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin: 0 0 0.85rem;
  padding: 0;
  background: transparent;
  border-bottom: none;
}

.nilfish-page-title {
  margin: 0;
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-family: var(--nilfish-font-sans);
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.nilfish-page-subtitle {
  margin: 0;
  color: var(--nilfish-muted);
  font-size: 0.8125rem;
  line-height: 1.35;
  max-width: 42rem;
}

/* Compact ERP list views (erp-admin) — 3-row header: title+actions · description · search/filters */
.nilfish-erp-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
}

.nilfish-erp-list__header {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin: 0 0 0.85rem;
  padding: 0;
  border-bottom: none;
}

.nilfish-erp-list__row1 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 0.75rem;
  min-width: 0;
}

.nilfish-erp-list__row1-actions {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem;
  margin-left: auto;
}

.nilfish-erp-list__header-extra {
  flex: 0 1 auto;
  min-width: 0;
}

.nilfish-erp-list__row1-actions .btn-nilfish-primary,
.nilfish-erp-list__row1-actions .btn-nilfish,
.nilfish-erp-list__row1-actions .btn-nilfish-secondary {
  padding: 0.4rem 0.85rem;
  font-size: 0.8125rem;
  line-height: 1.2;
  border-radius: 999px;
}

/* + marks primary list actions (New / Book / Add) — distinct from navy location pills */
.nilfish-erp-list__row1-actions .btn-nilfish-primary::before,
.nilfish-erp-list__row1-actions .btn-nilfish::before {
  content: "+";
  font-weight: 700;
  font-size: 1.05em;
  line-height: 1;
}

.nilfish-mail-alias {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  max-width: 100%;
  min-width: 0;
}

.nilfish-mail-alias__email {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.8125rem;
  font-weight: 500;
}

.nilfish-erp-list__title {
  margin: 0;
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-family: var(--nilfish-font-sans);
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.nilfish-erp-list__subtitle {
  margin: 0;
  color: var(--nilfish-muted);
  font-size: 0.8125rem;
  line-height: 1.35;
  max-width: 42rem;
}

.nilfish-erp-list__filters {
  --nilfish-list-control-bg: color-mix(
    in srgb,
    var(--nilfish-primary) 5.5%,
    var(--nilfish-bg-light, #f8fafc)
  );
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.55rem;
  margin-top: 0.15rem;
}

.nilfish-erp-list__search {
  box-sizing: border-box;
  min-width: 11rem;
  flex: 1 1 14rem;
  max-width: 28rem;
  width: 100%;
  min-height: 2.15rem;
  height: 2.15rem;
  padding: 0.4rem 0.9rem;
  border: 1px solid transparent;
  border-radius: 999px;
  font-family: var(--nilfish-font-sans);
  font-size: 0.8125rem;
  line-height: 1.3;
  color: var(--nilfish-body);
  background: var(--nilfish-list-control-bg);
  box-shadow: none;
}

.nilfish-erp-list__search::placeholder {
  color: var(--nilfish-muted);
  opacity: 0.9;
}

.nilfish-erp-list__search:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--nilfish-accent) 45%, transparent);
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  box-shadow: 0 0 0 2px rgba(var(--nilfish-accent-rgb), 0.22);
}

/* Date / select / text controls in the list filter row match the search pill */
.nilfish-erp-list__filters .nilfish-input,
.nilfish-erp-list__filters input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.nilfish-erp-list__filters select {
  box-sizing: border-box;
  width: auto;
  min-width: 0;
  min-height: 2.15rem;
  height: 2.15rem;
  margin: 0;
  padding: 0.35rem 0.85rem;
  border: 1px solid transparent;
  border-radius: 999px;
  font-family: var(--nilfish-font-sans);
  font-size: 0.8125rem;
  line-height: 1.3;
  color: var(--nilfish-body);
  background: var(--nilfish-list-control-bg);
  box-shadow: none;
  flex: 0 0 auto;
}

.nilfish-erp-list__filters input[type="date"],
.nilfish-erp-list__filters .nilfish-input[type="date"] {
  min-width: 9.75rem;
  padding-right: 0.55rem;
}

.nilfish-erp-list__filters input[type="number"],
.nilfish-erp-list__filters .nilfish-input[type="number"] {
  min-width: 4.5rem;
  width: 5.5rem;
}

.nilfish-erp-list__filters select,
.nilfish-erp-list__filters .nilfish-input[as="select"] {
  min-width: 7.5rem;
  padding-right: 1.6rem;
  cursor: pointer;
}

.nilfish-erp-list__filters .nilfish-input:focus,
.nilfish-erp-list__filters input:not([type="checkbox"]):not([type="radio"]):focus,
.nilfish-erp-list__filters select:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--nilfish-accent) 45%, transparent);
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  box-shadow: 0 0 0 2px rgba(var(--nilfish-accent-rgb), 0.22);
}

/* Keep label + control on one line so everything lines up with search */
.nilfish-erp-list__filters > .nilfish-row,
.nilfish-erp-list__filters > label,
.nilfish-erp-list__filters > div {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  width: auto;
  max-width: 100%;
}

.nilfish-erp-list__filters .nilfish-field-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--nilfish-muted);
  white-space: nowrap;
  flex: 0 0 auto;
}

.nilfish-erp-list__filters .nilfish-field-help__trigger {
  width: 0.9rem;
  height: 0.9rem;
  font-size: 0.625rem;
}

.nilfish-erp-list__filters .nilfish-muted {
  font-size: 0.8125rem;
  white-space: nowrap;
}

.nilfish-erp-list__filters .nilfish-filter-chips {
  margin: 0;
}

.nilfish-erp-list__filters .btn-nilfish-secondary,
.nilfish-erp-list__filters .btn-nilfish-primary,
.nilfish-erp-list__filters .btn-nilfish {
  min-height: 2.15rem;
  padding: 0.35rem 0.85rem;
  font-size: 0.8125rem;
  border-radius: 999px;
  align-self: center;
}

.nilfish-erp-list__filters .nilfish-pill-tabs {
  flex: 0 0 auto;
  align-self: center;
}

.nilfish-erp-list__filters .nilfish-pill-tabs__tab {
  min-height: 1.75rem;
  height: auto;
  padding: 0.35rem 0.85rem;
}

.nilfish-erp-list__filters .nilfish-segmented {
  flex: 0 0 auto;
  align-self: center;
}

.nilfish-erp-list__filters .nilfish-segmented__option {
  min-height: 2.15rem;
  padding: 0.35rem 0.85rem;
}

.nilfish-erp-list__table-wrap {
  overflow-x: auto;
  margin: 0 -0.25rem;
  padding: 0 0.25rem;
}

/* Server pagination footer — under table/grid, wraps on narrow viewports */
.nilfish-erp-list__pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem 1rem;
  margin: 0.85rem 0 0;
  padding: 0.7rem 0 0.15rem;
  border-top: 1px solid color-mix(in srgb, var(--nilfish-border, #d8dee6) 85%, transparent);
  min-width: 0;
}

.nilfish-erp-list__pagination-range {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.35;
  color: var(--nilfish-muted, #667788);
  min-width: 0;
}

.nilfish-erp-list__pagination-range-compact {
  display: none;
}

.nilfish-erp-list__pagination-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem 0.45rem;
  min-width: 0;
}

.nilfish-erp-list__pagination-btn {
  flex: 0 0 auto;
  min-height: 2.15rem;
  padding: 0.35rem 0.85rem;
  font-size: 0.8125rem;
}

.nilfish-erp-list__pagination-pages {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.2rem;
}

.nilfish-erp-list__pagination-page {
  box-sizing: border-box;
  min-width: 2.15rem;
  min-height: 2.15rem;
  padding: 0.25rem 0.45rem;
  margin: 0;
  border: 1px solid transparent;
  border-radius: var(--nilfish-radius-sm, 6px);
  background: transparent;
  color: var(--nilfish-text, #1a2330);
  font: inherit;
  font-size: 0.8125rem;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
  line-height: 1;
  cursor: pointer;
}

.nilfish-erp-list__pagination-page:hover:not(:disabled) {
  background: color-mix(in srgb, var(--nilfish-accent, #e85d04) 10%, transparent);
  border-color: color-mix(in srgb, var(--nilfish-accent, #e85d04) 28%, transparent);
}

.nilfish-erp-list__pagination-page:focus-visible {
  outline: 2px solid var(--nilfish-accent, #e85d04);
  outline-offset: 2px;
}

.nilfish-erp-list__pagination-page.is-active,
.nilfish-erp-list__pagination-page[aria-current="page"] {
  background: color-mix(in srgb, var(--nilfish-accent, #e85d04) 14%, #fff);
  border-color: color-mix(in srgb, var(--nilfish-accent, #e85d04) 45%, transparent);
  color: var(--nilfish-heading, var(--nilfish-primary, #1a2330));
  font-weight: 600;
  cursor: default;
}

.nilfish-erp-list__pagination-page:disabled:not(.is-active) {
  opacity: 0.45;
  cursor: not-allowed;
}

.nilfish-erp-list__pagination-ellipsis {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.25rem;
  color: var(--nilfish-muted, #667788);
  font-size: 0.8125rem;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

@media (max-width: 640px) {
  .nilfish-erp-list__pagination {
    flex-direction: column;
    align-items: stretch;
    gap: 0.55rem;
  }

  .nilfish-erp-list__pagination-range {
    text-align: center;
  }

  .nilfish-erp-list__pagination-range-full {
    display: none;
  }

  .nilfish-erp-list__pagination-range-compact {
    display: inline;
  }

  .nilfish-erp-list__pagination-controls {
    justify-content: space-between;
    width: 100%;
  }

  .nilfish-erp-list__pagination-btn {
    flex: 1 1 auto;
    max-width: 42%;
  }

  /* Keep prev/next dominant on phones; page numbers stay available but secondary */
  .nilfish-erp-list__pagination-pages {
    order: -1;
    flex: 1 1 100%;
    justify-content: center;
    margin-bottom: 0.15rem;
  }
}

.nilfish-erp-list__empty {
  padding: 1.25rem 0;
}

.nilfish-erp-list__empty-title {
  margin: 0 0 0.35rem;
  font-weight: 600;
  color: var(--nilfish-heading, var(--nilfish-primary));
}

/* Compact ERP record header (product / contact / invoice detail) */
.nilfish-record-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 0.55rem;
  padding: 0;
  border-bottom: none;
}

.nilfish-record-header__main {
  flex: 1 1 auto;
  min-width: 0;
}

.nilfish-record-header__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.25rem;
  flex-wrap: wrap;
  margin-bottom: 0;
}

.nilfish-record-header__title-row {
  display: flex;
  align-items: center;
  gap: 1rem 1.5rem;
  flex-wrap: wrap;
  min-width: 0;
}

.nilfish-record-title {
  margin: 0;
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-family: var(--nilfish-font-sans);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.nilfish-record-meta {
  margin: 0.2rem 0 0;
  color: var(--nilfish-muted);
  font-size: 0.875rem;
  line-height: 1.35;
}

.nilfish-record-header__aside {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.nilfish-record-header__thumb {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: var(--nilfish-radius-md);
  border: 1px solid var(--nilfish-border-subtle);
}

/* Segmented control — flush track, straight internal edges, thin dividers */
.nilfish-segmented {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 0.8125rem;
  min-width: 0;
}

.nilfish-segmented--labeled legend {
  float: left;
  width: auto;
  padding: 0;
  margin: 0;
  font-weight: 500;
  color: var(--nilfish-muted);
}

.nilfish-segmented__track {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0;
  padding: 0;
  margin: 0;
  background: var(--nilfish-pill-tabs-track, #e8eaee);
  border-radius: 999px;
  border: 1px solid var(--nilfish-border-subtle, var(--nilfish-border));
  overflow: hidden;
}

.nilfish-segmented__option {
  position: relative;
  border: none;
  background: transparent;
  padding: 0.32rem 0.85rem;
  margin: 0;
  font: inherit;
  font-family: var(--nilfish-font-sans);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.25;
  color: var(--nilfish-muted);
  cursor: pointer;
  border-radius: 0;
  white-space: nowrap;
}

.nilfish-segmented__option + .nilfish-segmented__option::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--nilfish-border, #d1d5db);
  pointer-events: none;
}

.nilfish-segmented__option:hover:not(:disabled),
.nilfish-segmented__option:focus-visible:not(:disabled) {
  color: var(--nilfish-body);
}

.nilfish-segmented__option.is-active {
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  color: var(--nilfish-heading, var(--nilfish-body, #1f2937));
  font-weight: 600;
  box-shadow: none;
}

.nilfish-segmented__option:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Legacy aliases (product type used these class names) */
.nilfish-record-type {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 0.8125rem;
}

.nilfish-record-type legend {
  float: left;
  width: auto;
  padding: 0;
  margin: 0;
  font-weight: 500;
  color: var(--nilfish-muted);
}

.nilfish-record-type__options {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0;
  padding: 0;
  background: var(--nilfish-pill-tabs-track, #e8eaee);
  border-radius: 999px;
  border: 1px solid var(--nilfish-border-subtle, var(--nilfish-border));
  overflow: hidden;
}

.nilfish-record-type__option {
  position: relative;
  border: none;
  background: transparent;
  padding: 0.32rem 0.85rem;
  margin: 0;
  font: inherit;
  font-family: var(--nilfish-font-sans);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.25;
  color: var(--nilfish-muted);
  cursor: pointer;
  border-radius: 0;
  white-space: nowrap;
}

.nilfish-record-type__option + .nilfish-record-type__option::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--nilfish-border, #d1d5db);
  pointer-events: none;
}

.nilfish-record-type__option:hover,
.nilfish-record-type__option:focus-visible {
  color: var(--nilfish-body);
}

.nilfish-record-type__option.is-active {
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  color: var(--nilfish-heading, var(--nilfish-body, #1f2937));
  font-weight: 600;
  box-shadow: none;
  border: none;
}

/* ── ERP App Chrome (backend shell) ──────────────────────────────────────── */

.nilfish-app-chrome {
  --nilfish-navy: var(--nilfish-primary);
  --nilfish-orange: var(--nilfish-accent);
  --nilfish-navbar-height: 46px;
  --nilfish-hero-slim-height: 40px;
  --nilfish-erp-logo-size: 42px;
  --nilfish-erp-logo-overhang: 5px;
  display: flex;
  flex-direction: column;
  /* Fixed viewport shell — only __content scrolls (no body + content double bars).
     Prefer lvh over dvh so Windows native file dialogs cannot shrink the shell to ~250px. */
  height: 100vh;
  height: 100lvh;
  max-height: 100vh;
  max-height: 100lvh;
  min-height: 100vh;
  overflow: hidden;
  background: var(--nilfish-surface);
}

.nilfish-app-chrome__top {
  position: relative;
  z-index: 3;
  flex: 0 0 auto;
  overflow: visible;
}

.nilfish-app-chrome__navbar {
  background: var(--nilfish-navbar);
  color: var(--nilfish-navbar-text);
  padding: 0 1rem;
  display: flex;
  align-items: center;
  min-height: var(--nilfish-navbar-height);
  gap: 0.25rem;
  overflow: visible;
  position: relative;
  z-index: 4;
}

.nilfish-app-chrome__brand {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.01em;
  margin-right: 0.75rem;
  white-space: nowrap;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  max-width: 12rem;
  flex: 0 0 auto;
  position: relative;
  z-index: 5;
}

/* Odoo-style tile: left brand slot, slight hang into hero subnav. */
.nilfish-app-chrome__brand--logo {
  align-self: flex-end;
  width: var(--nilfish-erp-logo-size);
  height: var(--nilfish-erp-logo-size);
  max-width: none;
  margin: 0 0.85rem calc(-1 * var(--nilfish-erp-logo-overhang)) 0;
  padding: 0;
  border-radius: 6px;
  background: var(--nilfish-navbar);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  overflow: hidden;
  justify-content: center;
  line-height: 0;
}

.nilfish-app-chrome__brand-logo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

a.nilfish-app-chrome__brand:hover {
  color: #fff;
  opacity: 0.92;
}

a.nilfish-app-chrome__brand--logo:hover {
  opacity: 1;
  filter: brightness(1.06);
}

.nilfish-app-chrome__hero {
  /* Flat: same surface as page, not a navy strip */
  background: var(--nilfish-bg, var(--nilfish-bg-light));
  color: var(--nilfish-heading, var(--nilfish-primary));
  border-bottom: 1px solid var(--nilfish-border, rgba(13, 27, 42, 0.08));
  position: relative;
  z-index: 1;
}

.nilfish-app-chrome__hero-slim {
  height: auto;
  min-height: 2.5rem;
  flex: 0 0 auto;
  display: flex;
  align-items: stretch;
  padding: 0 1rem;
  min-width: 0;
}

.nilfish-app-chrome__hero-subnav {
  display: flex;
  align-items: stretch;
  min-width: 0;
  flex: 1 1 auto;
  padding-right: 0;
  overflow: visible;
}

.nilfish-app-chrome__subtabs-wrap {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  display: flex;
  align-items: stretch;
}

.nilfish-app-chrome__subtabs-measure {
  position: absolute;
  left: 0;
  top: 0;
  visibility: hidden;
  pointer-events: none;
  display: flex;
  flex-wrap: nowrap;
  white-space: nowrap;
  height: auto;
  opacity: 0;
  z-index: -1;
  overflow: visible;
}

.nilfish-app-chrome__hero-slim .nilfish-app-chrome__subtabs {
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  gap: 0.15rem;
  flex-wrap: nowrap;
  overflow: visible;
  align-items: stretch;
  width: 100%;
  min-width: 0;
}

.nilfish-app-chrome__subnav-more {
  position: relative;
  display: flex;
  align-items: stretch;
  flex: 0 0 auto;
  margin-left: 0.15rem;
}

.nilfish-app-chrome__subnav-more-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  min-height: 100%;
  margin: 0;
  padding: 0.65rem 0.5rem;
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--nilfish-muted);
  cursor: pointer;
}

.nilfish-app-chrome__subnav-more-btn:hover,
.nilfish-app-chrome__subnav-more.is-open .nilfish-app-chrome__subnav-more-btn {
  background: transparent;
  color: var(--nilfish-heading, var(--nilfish-text));
  border-bottom-color: rgba(var(--nilfish-accent-rgb), 0.45);
}

.nilfish-app-chrome__subnav-more-btn.is-active {
  color: var(--nilfish-heading, var(--nilfish-text));
  border-bottom-color: var(--nilfish-accent);
  font-weight: 600;
}

.nilfish-app-chrome__subnav-more-panel {
  min-width: 12rem;
  max-width: min(20rem, 90vw);
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0.35rem 0;
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  color: var(--nilfish-body);
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  box-shadow: var(--nilfish-shadow-overlay, 0 8px 24px rgba(0, 0, 0, 0.18));
}

.nilfish-app-chrome__subnav-more-panel .nilfish-app-chrome__subtab {
  width: 100%;
  justify-content: flex-start;
  border-bottom: none;
  border-left: 3px solid transparent;
  border-radius: 0;
  padding: 0.55rem 0.85rem;
  white-space: normal;
}

.nilfish-app-chrome__subnav-more-panel .nilfish-app-chrome__subtab:hover {
  background: var(--nilfish-bg-light);
  border-bottom-color: transparent;
  border-left-color: rgba(var(--nilfish-accent-rgb), 0.45);
}

.nilfish-app-chrome__subnav-more-panel .nilfish-app-chrome__subtab.active {
  background: color-mix(in srgb, var(--nilfish-accent) 10%, transparent);
  border-bottom-color: transparent;
  border-left-color: var(--nilfish-accent);
  font-weight: 600;
}

.nilfish-app-chrome__hero-slim .nilfish-app-chrome__subtab {
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  color: var(--nilfish-muted);
  padding: 0.65rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 500;
  white-space: nowrap;
  flex-shrink: 0;
}

.nilfish-app-chrome__hero-slim .nilfish-app-chrome__subtab:hover {
  background: transparent;
  border-color: transparent;
  border-bottom-color: rgba(var(--nilfish-accent-rgb), 0.45);
  color: var(--nilfish-heading, var(--nilfish-text));
}

.nilfish-app-chrome__hero-slim .nilfish-app-chrome__subtab.active {
  background: transparent;
  border-color: transparent;
  border-bottom-color: var(--nilfish-accent);
  color: var(--nilfish-heading, var(--nilfish-text));
  font-weight: 600;
}

.nilfish-app-chrome__tabs-wrap {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: stretch;
}

.nilfish-app-chrome__tabs-measure {
  position: absolute;
  left: 0;
  top: 0;
  visibility: hidden;
  pointer-events: none;
  display: flex;
  flex-wrap: nowrap;
  white-space: nowrap;
  height: auto;
  opacity: 0;
  z-index: -1;
}

.nilfish-app-chrome__tabs-measure .nilfish-app-chrome__tab {
  flex-shrink: 0;
  padding: 0.65rem 0.75rem;
}

.nilfish-app-chrome__tabs {
  background: transparent;
  border-bottom: none;
  padding: 0.25rem 0.5rem 0;
  display: flex;
  gap: 0;
  flex-wrap: nowrap;
  min-width: 0;
  width: 100%;
}

.nilfish-app-chrome__navbar .nilfish-app-chrome__tabs {
  padding: 0;
  flex: 1 1 auto;
  border: none;
  min-width: 0;
}

.nilfish-app-chrome__nav-menu {
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}

.nilfish-app-chrome__nav-menu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: rgba(255, 255, 255, 0.9);
  cursor: pointer;
}

.nilfish-app-chrome__nav-menu-btn:hover,
.nilfish-app-chrome__nav-menu.is-open .nilfish-app-chrome__nav-menu-btn {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}

.nilfish-app-chrome__nav-menu-panel {
  position: absolute;
  left: 0;
  top: calc(100% + 0.35rem);
  min-width: 14rem;
  max-width: min(20rem, 90vw);
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0.35rem 0;
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  color: var(--nilfish-body);
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  box-shadow: var(--nilfish-shadow-overlay, 0 8px 24px rgba(0, 0, 0, 0.18));
  z-index: 90;
}

.nilfish-app-chrome__nav-menu-panel .nilfish-app-chrome__tab {
  width: 100%;
  justify-content: flex-start;
  color: var(--nilfish-heading, var(--nilfish-primary));
  border-bottom: none;
  border-left: 3px solid transparent;
  padding: 0.55rem 0.85rem;
  border-radius: 0;
}

.nilfish-app-chrome__nav-menu-panel .nilfish-app-chrome__tab:hover {
  background: var(--nilfish-bg-light);
  color: var(--nilfish-heading, var(--nilfish-primary));
}

.nilfish-app-chrome__nav-menu-panel .nilfish-app-chrome__tab.active {
  color: var(--nilfish-heading, var(--nilfish-primary));
  border-bottom-color: transparent;
  border-left-color: var(--nilfish-accent);
  font-weight: 600;
  background: color-mix(in srgb, var(--nilfish-accent) 10%, transparent);
}

.nilfish-app-chrome__tab {
  color: #5c6778;
  border: none;
  border-bottom: 2px solid transparent;
  background: transparent;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.45rem 0.75rem;
  font-family: var(--nilfish-font-sans);
  font-size: 0.9375rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s;
}

.nilfish-app-chrome__navbar .nilfish-app-chrome__tab {
  color: rgba(255, 255, 255, 0.82);
  border-bottom-width: 2px;
  padding-top: 0.65rem;
  padding-bottom: 0.65rem;
  flex-shrink: 0;
}

.nilfish-app-chrome__navbar .nilfish-app-chrome__tab:hover {
  color: #fff;
}

.nilfish-app-chrome__navbar .nilfish-app-chrome__tab.active {
  color: #fff;
  border-bottom-color: var(--nilfish-accent);
  font-weight: 600;
}

/* Hamburger dropdown sits inside the dark navbar — override light tab colors */
.nilfish-app-chrome__navbar .nilfish-app-chrome__nav-menu-panel .nilfish-app-chrome__tab {
  color: var(--nilfish-heading, var(--nilfish-primary));
  border-bottom: none;
  border-left: 3px solid transparent;
  padding: 0.55rem 0.85rem;
}

.nilfish-app-chrome__navbar .nilfish-app-chrome__nav-menu-panel .nilfish-app-chrome__tab:hover {
  color: var(--nilfish-heading, var(--nilfish-primary));
  background: var(--nilfish-bg-light);
}

.nilfish-app-chrome__navbar .nilfish-app-chrome__nav-menu-panel .nilfish-app-chrome__tab.active {
  color: var(--nilfish-heading, var(--nilfish-primary));
  border-bottom-color: transparent;
  border-left-color: var(--nilfish-accent);
  font-weight: 600;
  background: color-mix(in srgb, var(--nilfish-accent) 10%, transparent);
}

.nilfish-app-chrome__tab:hover {
  color: var(--nilfish-heading, var(--nilfish-primary));
}

.nilfish-app-chrome__tab.active {
  color: var(--nilfish-heading, var(--nilfish-primary));
  border-bottom-color: var(--nilfish-accent);
  font-weight: 600;
}

.nilfish-app-chrome__subtabs {
  background: transparent;
  border-bottom: 1px solid var(--nilfish-border-subtle);
  padding: 0;
  display: flex;
  gap: 0.15rem;
  flex-wrap: wrap;
  align-items: stretch;
}

.nilfish-app-chrome__subtab {
  border-radius: 0;
  border: none;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--nilfish-muted);
  padding: 0.55rem 0.75rem;
  font-family: var(--nilfish-font-sans);
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
}

.nilfish-app-chrome__subtab:hover {
  border-bottom-color: rgba(var(--nilfish-accent-rgb), 0.45);
  color: var(--nilfish-heading, var(--nilfish-primary));
  background: transparent;
}

.nilfish-app-chrome__subtab.active {
  background: transparent;
  border-color: transparent;
  border-bottom-color: var(--nilfish-accent);
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-weight: 600;
}

.nilfish-page-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0.15rem;
  padding: 0;
  margin-bottom: 0.75rem;
  background: transparent;
  border-radius: 0;
  border: none;
  border-bottom: 1px solid var(--nilfish-border-subtle);
}

.nilfish-page-tabs--actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  flex-wrap: wrap;
  padding: 0;
  background: transparent;
  border-radius: 0;
  border-bottom: none;
}

.nilfish-page-tabs__list {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0.15rem;
  padding: 0;
  min-width: 0;
  background: transparent;
  border-radius: 0;
  border-bottom: 1px solid var(--nilfish-border-subtle);
}

.nilfish-page-tabs__action {
  flex: 0 0 auto;
  margin-left: auto;
  padding: 0.25rem 0.5rem;
  font-size: 0.8125rem;
  white-space: nowrap;
}

/* Detail pages: breadcrumb reuses the leaf-tab row (no pill track). */
.nilfish-page-tabs--crumbs {
  display: flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.15rem 0 0.35rem;
  background: transparent;
  border-radius: 0;
  border-bottom: none;
}

.nilfish-page-tabs--crumbs .nilfish-erp-breadcrumb {
  margin: 0;
  width: 100%;
}

.nilfish-page-tab {
  border: none;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--nilfish-muted);
  padding: 0.55rem 0.85rem;
  font-family: var(--nilfish-font-sans);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25;
  cursor: pointer;
  border-radius: 0;
  margin: 0;
  text-decoration: none;
  display: inline-block;
}

.nilfish-page-tab:hover {
  color: var(--nilfish-heading, var(--nilfish-body));
  border-bottom-color: rgba(var(--nilfish-accent-rgb), 0.45);
}

.nilfish-page-tab.active {
  background: transparent;
  color: var(--nilfish-heading, var(--nilfish-body));
  font-weight: 600;
  box-shadow: none;
  border-bottom-color: var(--nilfish-accent);
}

.nilfish-channel-toggles {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  flex-wrap: wrap;
  margin: 0 0 1rem;
  padding: 0;
  border: 0;
  font-size: 0.9rem;
}

.nilfish-channel-toggles legend {
  padding: 0;
  margin-right: -0.5rem;
  font-weight: 500;
  color: var(--nilfish-muted);
}

.nilfish-data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

.nilfish-data-table th,
.nilfish-data-table td {
  text-align: left;
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid var(--nilfish-border-subtle);
}

.nilfish-data-table th {
  color: var(--nilfish-muted);
  font-weight: 500;
}

.nilfish-data-table__th--sortable {
  white-space: nowrap;
}

.nilfish-data-table__sort {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-align: left;
  cursor: pointer;
}

.nilfish-data-table__sort:hover,
.nilfish-data-table__sort:focus-visible {
  color: var(--nilfish-heading, var(--nilfish-primary));
  outline: none;
}

.nilfish-data-table__sort-indicator {
  font-size: 0.65em;
  line-height: 1;
  opacity: 0.35;
}

.nilfish-data-table__sort:hover .nilfish-data-table__sort-indicator,
.nilfish-data-table__sort:focus-visible .nilfish-data-table__sort-indicator,
.nilfish-data-table__sort-indicator.is-active {
  opacity: 1;
  color: var(--nilfish-accent);
}

.nilfish-muted {
  color: var(--nilfish-muted);
}

/* Read-only Yes/No in ERP list cells (Active, Published) — both states muted */
.nilfish-boolean-text {
  color: var(--nilfish-muted);
  font-size: 0.875rem;
}

/* Scrollable checkbox multiselect (supplier catalog brands / categories) */
.nilfish-facet-list {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  max-height: 14rem;
  overflow-y: auto;
  padding: 0.4rem;
  border: 1px solid var(--nilfish-border, #d8dce3);
  border-radius: 6px;
  background: #fff;
}

.nilfish-facet-list__item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.15rem 0.2rem;
  font-size: 0.9rem;
  cursor: pointer;
}

.nilfish-facet-list__item:hover {
  background: var(--nilfish-hover, #f4f6f8);
}

.nilfish-facet-list__count {
  margin-left: auto;
  color: var(--nilfish-muted);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

/* Dropdown wrapper around facet checkboxes (fitment Excel filters, etc.) */
.nilfish-multi-check {
  position: relative;
  min-width: 0;
}

.nilfish-multi-check.is-disabled {
  opacity: 0.55;
  pointer-events: none;
}

.nilfish-multi-check__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  text-align: left;
  cursor: pointer;
}

.nilfish-multi-check__trigger-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nilfish-multi-check__caret {
  flex-shrink: 0;
  color: var(--nilfish-muted);
  font-size: 0.75rem;
}

.nilfish-multi-check__panel {
  position: absolute;
  z-index: 40;
  top: calc(100% + 0.25rem);
  left: 0;
  right: 0;
  min-width: 14rem;
  background: var(--nilfish-surface, #fff);
  border: 1px solid var(--nilfish-border, #d8dce3);
  border-radius: 6px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
  overflow: hidden;
}

.nilfish-multi-check__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid var(--nilfish-border, #d8dce3);
  background: var(--nilfish-surface-2, #f7f8fa);
  font-size: 0.9rem;
}

.nilfish-multi-check__close {
  border: 0;
  background: transparent;
  color: var(--nilfish-muted);
  cursor: pointer;
  font-size: 0.85rem;
  padding: 0;
  white-space: nowrap;
}

.nilfish-multi-check__close:hover {
  color: var(--nilfish-fg, #111);
}

.nilfish-multi-check__list {
  border: 0;
  border-radius: 0;
  max-height: 16rem;
}

.nilfish-data-table--dense th,
.nilfish-data-table--dense td {
  padding: 0.35rem 0.5rem;
  vertical-align: middle;
}

.nilfish-col-check {
  width: 2.5rem;
  text-align: center;
  white-space: nowrap;
}

.nilfish-col-check input[type="checkbox"] {
  margin: 0;
  vertical-align: middle;
}

.nilfish-col-sku {
  white-space: nowrap;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
  max-width: 14rem;
  overflow: hidden;
  text-overflow: ellipsis;
}

.nilfish-col-sku a {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nilfish-col-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 18rem;
}

.nilfish-col-num {
  white-space: nowrap;
  text-align: right;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
  width: 1%;
}

.nilfish-col-supplier {
  white-space: nowrap;
}

.nilfish-col-actions {
  width: 2.75rem;
  text-align: center;
  white-space: nowrap;
}

.nilfish-po-lines {
  width: 100%;
  table-layout: fixed;
}

.nilfish-po-lines .nilfish-col-sku {
  width: 28%;
  max-width: none;
}

.nilfish-po-lines .nilfish-col-name {
  width: auto;
  max-width: none;
}

.nilfish-po-lines .nilfish-col-num {
  width: 7.5rem;
}

.nilfish-po-lines .nilfish-col-actions {
  width: 3rem;
}

.nilfish-po-lines .nilfish-input--compact {
  width: 100%;
  max-width: 6rem;
  min-width: 0;
  box-sizing: border-box;
  padding: 0.25rem 0.4rem;
}

.nilfish-data-table--dense tbody tr:nth-child(even) {
  background: var(--nilfish-bg-light, #f8fafc);
}

.nilfish-data-table--dense tbody tr:hover {
  background: rgba(var(--nilfish-accent-rgb), 0.06);
}

.nilfish-data-table__row--clickable {
  cursor: pointer;
}

.nilfish-data-table__row--clickable:hover {
  background: rgba(var(--nilfish-accent-rgb), 0.06);
}

.nilfish-data-table__row--clickable:focus-visible {
  outline: 2px solid var(--nilfish-accent);
  outline-offset: -2px;
}

.nilfish-data-table__row--expanded {
  background: rgba(var(--nilfish-accent-rgb), 0.1);
}

.nilfish-data-table__row--expanded:hover,
.nilfish-data-table--dense tbody tr.nilfish-data-table__row--expanded:hover {
  background: rgba(var(--nilfish-accent-rgb), 0.12);
}

.nilfish-data-table__expand > td {
  padding: 0;
  background: var(--nilfish-bg-light, #f8fafc);
  border-bottom: 1px solid var(--nilfish-border, #e2e8f0);
  vertical-align: top;
}

.nilfish-data-table__expand-panel {
  padding: 0.85rem 1rem 1rem;
  max-width: none;
  width: 100%;
  box-sizing: border-box;
}

/* Compact field forms (few inputs) stay readable; wide tables use full row. */
.nilfish-data-table__expand-panel:has(.nilfish-data-table__expand-form):not(:has(.nilfish-po-lines)) {
  max-width: 40rem;
}

.nilfish-data-table__expand-form:has(.nilfish-po-lines),
.nilfish-form--wide.nilfish-data-table__expand-form {
  max-width: 100%;
  width: 100%;
  min-width: 0;
}

.nilfish-data-table__expand-form:has(.nilfish-po-lines) .nilfish-row .nilfish-input[type="date"] {
  max-width: 14rem;
}

.nilfish-data-table__expand-title {
  margin: 0 0 0.65rem;
  font-size: 0.9375rem;
  font-weight: 600;
}

.nilfish-data-table__expand-form .nilfish-grid--2col {
  gap: 0.65rem 1rem;
}

.nilfish-data-table__expand-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-top: 0.25rem;
}

.nilfish-data-table__empty-row td {
  padding: 1rem 0.75rem;
  background: transparent;
}

.nilfish-data-table--dense .btn-nilfish-secondary {
  padding: 0.25rem 0.65rem;
  font-size: 0.8125rem;
}

/* Sales quote/order/invoice line entry — scroll inside card, do not widen the page */
.nilfish-table-scroll,
.nilfish-doc-lines-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

/*
 * Wide tables inside cards/forms: prefer horizontal scroll over crushed columns
 * or silent clipping. Prefer wrapping in .nilfish-table-scroll when authoring new UI.
 */
.nilfish-card table.nilfish-data-table,
.nilfish-record-sheet table.nilfish-data-table,
.nilfish-table-scroll > table,
.nilfish-doc-lines-wrap > table {
  width: max-content;
  min-width: 100%;
}

.nilfish-doc-lines {
  table-layout: auto;
}

.nilfish-doc-lines th,
.nilfish-doc-lines td {
  padding: 0.5rem 0.65rem;
}

.nilfish-doc-lines__sku {
  max-width: 11rem;
  word-break: break-word;
}

.nilfish-doc-lines__product {
  min-width: 10rem;
  width: 28%;
}

.nilfish-doc-lines__qty {
  width: 5.25rem;
  min-width: 5.25rem;
  max-width: 5.25rem;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
  box-sizing: border-box;
}

.nilfish-doc-lines__price {
  width: 8.5rem;
  min-width: 7.5rem;
}

.nilfish-doc-lines__qty .nilfish-input {
  box-sizing: border-box;
  display: block;
  width: 4.5rem;
  min-width: 4.5rem;
  max-width: 4.5rem;
  margin-inline: auto;
  padding-left: 0.45rem;
  padding-right: 0.45rem;
}

.nilfish-doc-lines__price .nilfish-input {
  min-width: 7rem;
  width: 100%;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.nilfish-doc-lines__num {
  white-space: nowrap;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.nilfish-doc-lines__entry td {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  vertical-align: top;
}

.nilfish-data-table__thumb {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-bg-light, #f8fafc);
  display: block;
}

.nilfish-data-table__thumb--empty {
  width: 40px;
  height: 40px;
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-border-subtle);
}

.nilfish-data-table__name {
  font-weight: 600;
  color: var(--nilfish-body);
  text-decoration: none;
}

/* Bare links in dense ERP tables match name style (no browser purple/underline). */
.nilfish-data-table a:not([class]) {
  font-weight: 600;
  color: var(--nilfish-body);
  text-decoration: none;
}

.nilfish-data-table a:not([class]):hover {
  color: var(--nilfish-accent);
}

.nilfish-data-table__name:hover {
  color: var(--nilfish-accent);
}

.nilfish-data-table__sku {
  font-family: ui-monospace, monospace;
  font-size: 0.8125rem;
  color: var(--nilfish-muted);
  white-space: nowrap;
}

.nilfish-data-table__num {
  white-space: nowrap;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.nilfish-data-table__actions {
  white-space: nowrap;
  text-align: right;
}

/* Soft row / cell highlights (Odoo-style list decorations) */
.nilfish-data-table--dense tbody tr.nilfish-row--warning,
.nilfish-data-table--dense tbody tr.nilfish-row--warning:nth-child(even) {
  background: color-mix(in srgb, #eab308 18%, var(--nilfish-surface-elevated, #fff));
}

.nilfish-data-table--dense tbody tr.nilfish-row--warning:hover,
.nilfish-data-table--dense tbody tr.nilfish-row--warning.nilfish-data-table__row--clickable:hover {
  background: color-mix(in srgb, #eab308 28%, var(--nilfish-surface-elevated, #fff));
}

.nilfish-data-table--dense tbody tr.nilfish-row--danger,
.nilfish-data-table--dense tbody tr.nilfish-row--danger:nth-child(even) {
  background: color-mix(in srgb, var(--nilfish-danger, #dc3545) 16%, var(--nilfish-surface-elevated, #fff));
}

.nilfish-data-table--dense tbody tr.nilfish-row--danger:hover,
.nilfish-data-table--dense tbody tr.nilfish-row--danger.nilfish-data-table__row--clickable:hover {
  background: color-mix(in srgb, var(--nilfish-danger, #dc3545) 26%, var(--nilfish-surface-elevated, #fff));
}

.nilfish-data-table--dense tbody tr.nilfish-row--received,
.nilfish-data-table--dense tbody tr.nilfish-row--received:nth-child(even) {
  background: color-mix(in srgb, #22c55e 16%, var(--nilfish-surface-elevated, #fff));
}

.nilfish-data-table--dense tbody tr.nilfish-row--received:hover {
  background: color-mix(in srgb, #22c55e 24%, var(--nilfish-surface-elevated, #fff));
}

.nilfish-data-table--dense tbody tr.nilfish-row--inactive,
.nilfish-data-table--dense tbody tr.nilfish-row--inactive:nth-child(even) {
  background: color-mix(in srgb, #0f172a 22%, var(--nilfish-surface-elevated, #fff));
  color: color-mix(in srgb, currentColor 70%, transparent);
}

.nilfish-data-table--dense tbody tr.nilfish-row--inactive:hover,
.nilfish-data-table--dense tbody tr.nilfish-row--inactive.nilfish-data-table__row--clickable:hover {
  background: color-mix(in srgb, #0f172a 32%, var(--nilfish-surface-elevated, #fff));
}

.nilfish-data-table--dense tbody tr.nilfish-row--inactive a {
  color: inherit;
}

.nilfish-data-table td.nilfish-cell--warning {
  background: color-mix(in srgb, #eab308 18%, var(--nilfish-surface-elevated, #fff));
}

.nilfish-data-table td.nilfish-cell--danger {
  background: color-mix(in srgb, var(--nilfish-danger, #dc3545) 18%, var(--nilfish-surface-elevated, #fff));
  font-weight: 600;
}

.nilfish-alert {
  margin: 0 0 0.5rem;
  padding: 0.45rem 0.75rem;
  border-radius: var(--nilfish-radius-md, 6px);
  border: 1px solid transparent;
  font-size: 0.8125rem;
  line-height: 1.35;
}

.nilfish-inbox-meta {
  margin: 0 0 0.5rem;
  color: var(--nilfish-muted, #64748b);
  font-size: 0.8125rem;
  line-height: 1.35;
}

.nilfish-alert--warning {
  background: #fff8e6;
  border-color: #ffe8a8;
  color: #664d03;
}

.nilfish-alert--danger {
  background: #f8d7da;
  border-color: #f5c2c7;
  color: #842029;
}

.nilfish-alert a {
  color: inherit;
  font-weight: 600;
  text-decoration: underline;
}

.nilfish-workshop-open-requests {
  margin: 0 0 1rem;
  padding: 0.75rem 1rem 0.85rem;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md, 6px);
  background: color-mix(
    in srgb,
    var(--nilfish-accent, #f97316) 10%,
    var(--nilfish-surface-elevated, #fff)
  );
  min-width: 0;
  max-width: 100%;
}

.nilfish-workshop-open-requests__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 0.75rem;
  margin-bottom: 0.5rem;
}

.nilfish-workshop-open-requests__title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--nilfish-text, #0f172a);
}

html[data-color-scheme="dark"] .nilfish-workshop-open-requests {
  background: color-mix(
    in srgb,
    var(--nilfish-accent, #f97316) 14%,
    var(--nilfish-surface-elevated, #1e293b)
  );
}

.nilfish-view-toggle {
  display: inline-flex;
  align-items: stretch;
  gap: 0;
  padding: 0;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  background: transparent;
  overflow: hidden;
}

.nilfish-view-toggle__btn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  background: transparent;
  color: var(--nilfish-muted);
  font-family: var(--nilfish-font-sans);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.35rem 0.65rem;
  cursor: pointer;
  line-height: 1.2;
  border-radius: 0;
}

.nilfish-view-toggle__btn + .nilfish-view-toggle__btn {
  border-left: 1px solid var(--nilfish-border);
}

/* Icon-only variant (list/grid on ErpListView title row). */
.nilfish-view-toggle__btn--icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  padding: 0;
}

.nilfish-view-toggle__btn--icon svg {
  width: 0.95rem;
  height: 0.95rem;
  display: block;
}

.nilfish-view-toggle__btn[aria-pressed="true"] {
  background: var(--nilfish-surface-elevated, var(--nilfish-bg-light, #f1f5f9));
  color: var(--nilfish-heading, var(--nilfish-text, var(--nilfish-primary)));
  box-shadow: none;
}

html[data-color-scheme="dark"] .nilfish-view-toggle__btn[aria-pressed="true"] {
  background: color-mix(in srgb, var(--nilfish-text) 12%, var(--nilfish-surface-elevated, #222));
  color: var(--nilfish-text);
}

/* Odoo-style list filters (order type chips, etc.) */
.nilfish-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin: 0 0 0.75rem;
}

.nilfish-filter-chips__btn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid color-mix(in srgb, var(--nilfish-primary) 12%, transparent);
  background: transparent;
  color: var(--nilfish-body);
  font-family: var(--nilfish-font-sans);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  cursor: pointer;
  line-height: 1.2;
}

.nilfish-filter-chips__btn:hover {
  border-color: var(--nilfish-primary);
  color: var(--nilfish-primary);
}

.nilfish-filter-chips__btn[aria-pressed="true"] {
  background: var(--nilfish-primary);
  border-color: var(--nilfish-primary);
  color: #fff;
}

.nilfish-product-admin-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.nilfish-product-admin-grid__card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.5rem;
  border: 1px solid var(--nilfish-border-subtle);
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-white);
  text-decoration: none;
  color: inherit;
  min-width: 0;
}

.nilfish-product-admin-grid__card:hover {
  border-color: var(--nilfish-accent);
}

.nilfish-product-admin-grid__img,
.nilfish-product-admin-grid__img--empty {
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  object-fit: cover;
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-bg-light, #f8fafc);
}

.nilfish-product-admin-grid__img--empty {
  display: block;
}

.nilfish-product-admin-grid__name {
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.nilfish-product-admin-grid__meta {
  font-size: 0.75rem;
  color: var(--nilfish-muted);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.15rem;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.nilfish-contact-admin-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.nilfish-contact-admin-grid__card {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 0.55rem;
  border: 1px solid var(--nilfish-border-subtle);
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-white);
  text-decoration: none;
  color: inherit;
  min-width: 0;
  position: relative;
}

.nilfish-contact-admin-grid__card--inactive::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: rgba(15, 23, 42, 0.42);
  pointer-events: none;
  z-index: 1;
}

.nilfish-contact-admin-grid__card-wrap {
  display: flex;
  flex-direction: column;
  min-width: 0;
  border: 1px solid var(--nilfish-border-subtle);
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-white);
  overflow: hidden;
}

.nilfish-contact-admin-grid__card-wrap .nilfish-contact-admin-grid__card {
  border: none;
  border-radius: 0;
  flex: 1 1;
}

.nilfish-contact-admin-grid__card-wrap:hover {
  border-color: var(--nilfish-accent);
}

.nilfish-contact-admin-grid__remove {
  align-self: stretch;
  margin: 0;
  border-radius: 0;
  border-top: 1px solid var(--nilfish-border-subtle);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.25rem;
}

.nilfish-contact-admin-grid__card:hover {
  border-color: var(--nilfish-accent);
}

.nilfish-contact-admin-grid__card-wrap .nilfish-contact-admin-grid__card:hover {
  border-color: transparent;
}

.nilfish-contact-admin-grid__img {
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  object-fit: contain;
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-bg-light, #f8fafc);
  flex-shrink: 0;
}

.nilfish-contact-admin-grid__img--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--nilfish-muted);
  line-height: 1;
}

.nilfish-contact-admin-grid__name {
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.nilfish-contact-admin-grid__meta {
  font-size: 0.75rem;
  color: var(--nilfish-muted);
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nilfish-app-chrome__badge {
  background: var(--nilfish-accent);
  color: #fff;
  font-size: 0.75em;
  font-weight: 700;
  line-height: 1.15;
  min-width: 1.35em;
  padding: 0.2em 0.45em;
  border-radius: var(--nilfish-radius-pill);
  vertical-align: text-top;
}

.nilfish-app-chrome__badge--danger {
  background: var(--nilfish-danger);
}

.nilfish-app-chrome__content {
  flex: 1 1 auto;
  min-height: 0; /* allow flex child to shrink so overflow scrolls here only */
  min-width: 0;
  max-width: 100%;
  overflow: auto;
  scrollbar-gutter: stable;
  padding: 0.5rem 1rem 1rem;
  scrollbar-width: thin;
  scrollbar-color: var(--nilfish-scrollbar-thumb) var(--nilfish-scrollbar-track);
}

.nilfish-app-chrome__content::-webkit-scrollbar {
  width: var(--nilfish-scrollbar-size);
  height: var(--nilfish-scrollbar-size);
}

.nilfish-app-chrome__content::-webkit-scrollbar-track {
  background: var(--nilfish-scrollbar-track);
}

.nilfish-app-chrome__content::-webkit-scrollbar-thumb {
  background: var(--nilfish-scrollbar-thumb);
  border-radius: 999px;
}

.nilfish-app-chrome__content::-webkit-scrollbar-thumb:hover {
  background: var(--nilfish-scrollbar-thumb-hover);
}

/* Direct page roots must shrink inside the chrome scroller */
.nilfish-app-chrome__content > * {
  max-width: 100%;
  min-width: 0;
}

.nilfish-app-chrome__systray {
  margin-left: auto;
  display: flex;
  gap: 0.35rem;
  align-items: center;
  font-size: 0.875rem;
  padding-left: 0.5rem;
}

.nilfish-app-chrome__systray-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  background: var(--nilfish-primary);
  border: 1px solid var(--nilfish-primary);
  color: #fff;
  padding: 0.35rem 0.75rem;
  border-radius: var(--nilfish-radius-md);
  font-family: var(--nilfish-font-sans);
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}

.nilfish-app-chrome__systray-btn:hover,
.nilfish-app-chrome__systray-btn:focus {
  background: var(--nilfish-primary-soft, #1b2838);
  border-color: var(--nilfish-primary-soft, #1b2838);
  color: #fff;
}

.nilfish-app-chrome__systray-btn--icon {
  padding: 0.35rem 0.5rem;
  min-width: 2rem;
}

/* Flat mock: systray is quiet chrome on the dark/primary navbar */
.nilfish-app-chrome__navbar .nilfish-app-chrome__systray-btn {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.22);
  color: var(--nilfish-navbar-text, #fff);
}

.nilfish-app-chrome__navbar .nilfish-app-chrome__systray-btn:hover,
.nilfish-app-chrome__navbar .nilfish-app-chrome__systray-btn:focus {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.4);
  color: #fff;
}

.nilfish-agency-switcher {
  display: inline-flex;
  align-items: center;
  margin: 0;
}

.nilfish-agency-switcher__select.nilfish-input {
  width: auto;
  max-width: 14rem;
  min-width: 9rem;
  padding: 0.35rem 2rem 0.35rem 0.65rem;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23334155' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.55rem center;
  background-size: 0.7rem;
}

.nilfish-agency-switcher__select.nilfish-input:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

/* Full-width strip under agency navbar when working in an engagement client. */
.nilfish-agency-client-banner {
  margin: 0;
  padding: 0.4rem 1rem;
  font-size: 0.85rem;
  line-height: 1.35;
  color: #7a2e0a;
  background: #ffe0b2;
  border-bottom: 1px solid #f0a35a;
}

.nilfish-agency-client-banner strong {
  color: #5c2200;
  font-weight: 700;
}

html[data-color-scheme="dark"] .nilfish-agency-client-banner {
  color: #ffd7a8;
  background: #5c2e0a;
  border-bottom-color: #a85a1a;
}

html[data-color-scheme="dark"] .nilfish-agency-client-banner strong {
  color: #ffe8c8;
}

.nilfish-agency-work-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8125rem;
  color: inherit;
  white-space: nowrap;
}

.nilfish-agency-work-chip.is-paused {
  opacity: 0.85;
  font-style: italic;
}

.nilfish-agency-pause-btn {
  background: var(--nilfish-primary, #0a0a0a) !important;
  border-color: var(--nilfish-primary, #0a0a0a) !important;
  color: #fff !important;
}

.nilfish-agency-pause-btn:hover,
.nilfish-agency-pause-btn:focus {
  background: var(--nilfish-primary-soft, #1a1a1a) !important;
  border-color: var(--nilfish-primary-soft, #1a1a1a) !important;
  color: #fff !important;
}

.nilfish-agency-exit-btn {
  background: #c1121f !important;
  border-color: #9b0e18 !important;
  color: #fff !important;
}

.nilfish-agency-exit-btn:hover,
.nilfish-agency-exit-btn:focus {
  background: #9b0e18 !important;
  border-color: #7a0b13 !important;
  color: #fff !important;
}

.nilfish-agency-exit-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.nilfish-systray-menu {
  position: relative;
}

.nilfish-systray-menu__panel {
  position: absolute;
  right: 0;
  top: calc(100% + 0.35rem);
  min-width: 14rem;
  overflow: visible;
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  color: var(--nilfish-body);
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  box-shadow: var(--nilfish-shadow-overlay, none);
  padding: 0.35rem 0;
  z-index: 80;
}

.nilfish-systray-menu__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1;
}

.nilfish-app-chrome__systray-btn--avatar {
  padding: 0.2rem;
  min-width: 2.1rem;
  min-height: 2.1rem;
}

.nilfish-systray-menu__user {
  padding: 0.55rem 0.85rem 0.4rem;
  min-width: 0;
}

.nilfish-systray-menu__user-name {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--nilfish-heading, var(--nilfish-primary));
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nilfish-systray-menu__user-email {
  margin-top: 0.15rem;
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--nilfish-muted);
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nilfish-systray-menu__item {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  width: 100%;
  padding: 0.45rem 0.85rem;
  border: none;
  background: transparent;
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-family: var(--nilfish-font-sans);
  font-size: 0.875rem;
  font-weight: 600;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
}

.nilfish-systray-menu__item:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.nilfish-systray-menu__item:hover,
.nilfish-systray-menu__item:focus {
  background: var(--nilfish-bg-light);
  color: var(--nilfish-primary);
}

.nilfish-systray-menu__hr {
  margin: 0.35rem 0.75rem;
  border: 0;
  border-top: 1px solid var(--nilfish-border);
}

/* Fas 3 — dark content contrast (navy brand must not paint titles/labels) */
html[data-color-scheme="dark"] .nilfish-app-chrome__content {
  color: var(--nilfish-text);
}

html[data-color-scheme="dark"] .nilfish-app-chrome__content :is(
  h1,
  h2,
  h3,
  h4,
  .nilfish-card__title,
  .nilfish-page-title,
  .nilfish-erp-list__title,
  .nilfish-erp-list__empty-title,
  .nilfish-record-title,
  .nilfish-section-title,
  .nilfish-section-heading,
  .nilfish-home-section-title,
  .nilfish-price-display,
  .nilfish-form-chrome__title,
  .nilfish-doc-party__name,
  .nilfish-configure-hub__card-title
) {
  color: var(--nilfish-heading);
}

html[data-color-scheme="dark"] .nilfish-app-chrome .btn-nilfish-secondary,
html[data-color-scheme="dark"] .nilfish-app-chrome .btn-nilfish-ghost,
html[data-color-scheme="dark"] .nilfish-app-chrome .nilfish-systray-menu__item {
  color: var(--nilfish-heading);
}

html[data-color-scheme="dark"] .nilfish-app-chrome__content a:not([class]):not(.btn-nilfish-primary) {
  color: var(--nilfish-text);
}

html[data-color-scheme="dark"] .nilfish-app-chrome__content a:not([class]):hover {
  color: var(--nilfish-accent);
}

/* Dark list surfaces — no navy/primary wash on hover (Fordonsorder chips, table rows) */
html[data-color-scheme="dark"] .nilfish-app-chrome__content .nilfish-data-table--dense tbody tr:nth-child(even) {
  background: color-mix(in srgb, var(--nilfish-text) 3%, var(--nilfish-surface));
}

html[data-color-scheme="dark"] .nilfish-app-chrome__content .nilfish-data-table--dense tbody tr:hover,
html[data-color-scheme="dark"] .nilfish-app-chrome__content .nilfish-data-table__row--clickable:hover {
  background: var(--nilfish-surface-elevated);
}

html[data-color-scheme="dark"] .nilfish-app-chrome__content .nilfish-data-table__row--expanded,
html[data-color-scheme="dark"] .nilfish-app-chrome__content .nilfish-data-table__row--expanded:hover,
html[data-color-scheme="dark"]
  .nilfish-app-chrome__content
  .nilfish-data-table--dense
  tbody
  tr.nilfish-data-table__row--expanded:hover {
  background: color-mix(in srgb, var(--nilfish-accent) 14%, var(--nilfish-surface));
}

html[data-color-scheme="dark"] .nilfish-filter-chips__btn {
  border-color: var(--nilfish-border);
  color: var(--nilfish-muted);
  background: var(--nilfish-surface-elevated, transparent);
}

html[data-color-scheme="dark"] .nilfish-filter-chips__btn:hover {
  border-color: var(--nilfish-muted);
  color: var(--nilfish-heading);
  background: color-mix(in srgb, var(--nilfish-text) 6%, transparent);
}

html[data-color-scheme="dark"] .nilfish-filter-chips__btn[aria-pressed="true"] {
  background: color-mix(in srgb, var(--nilfish-accent) 18%, var(--nilfish-surface-elevated, var(--nilfish-surface)));
  border-color: var(--nilfish-accent);
  color: var(--nilfish-heading, var(--nilfish-text));
}

html[data-color-scheme="dark"] .nilfish-app-chrome__content .nilfish-data-table__expand > td {
  background: var(--nilfish-surface);
}

/* ── Status pills (workshop / vehicle) ───────────────────────────────────── */

.nilfish-status-pill {
  display: inline-block;
  padding: 0.2em 0.65em;
  border-radius: var(--nilfish-radius-pill);
  font-size: 0.8125rem;
  font-weight: 600;
  background: transparent;
  border: 1px solid currentColor;
}

.nilfish-status-pill--draft {
  color: #d39e00;
}

.nilfish-status-pill--confirmed {
  color: #198754;
}

.nilfish-status-pill--done {
  color: var(--nilfish-primary);
}

.nilfish-status-pill--cancelled {
  color: var(--nilfish-danger);
}

/* Dark: "done" used primary navy — unreadable on charcoal; match body/date text */
html[data-color-scheme="dark"] .nilfish-status-pill--done {
  color: var(--nilfish-text);
}

/* ── Responsive ────────────────────────────────────────────────────────────── */

@media (max-width: 1099.98px) {
  .nilfish-grid--cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1199.98px) {
  .nilfish-grid--products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .nilfish-home-section {
    padding: 3.5rem 0;
  }

  .nilfish-home-section.nilfish-home-contact,
  .nilfish-home-section.nilfish-home-hours,
  .nilfish-home-section.nilfish-home-team {
    padding-block: 1.5rem;
  }

  .nilfish-home-section.nilfish-home-contact + .nilfish-home-section:not(.nilfish-section--density-airy),
  .nilfish-home-section.nilfish-home-hours + .nilfish-home-section:not(.nilfish-section--density-airy),
  .nilfish-home-section.nilfish-home-team + .nilfish-home-section:not(.nilfish-section--density-airy) {
    padding-top: 1rem;
  }

  .nilfish-home-section.nilfish-section--density-compact {
    padding-block: 1rem;
  }

  .nilfish-home-section.nilfish-section--density-airy {
    padding-block: 5.5rem;
  }
}

@media (max-width: 767.98px) {
  .nilfish-site-nav {
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
  }

  .nilfish-site-nav--storefront,
  .nilfish-site-nav--landing,
  .nilfish-site-nav--landing.is-compact {
    padding: 0.45rem 0.75rem;
    gap: 0.6rem;
  }

  .nilfish-site-nav--storefront .nilfish-site-nav__brand {
    gap: 0.4rem;
    font-size: 0.9rem;
  }

  .nilfish-site-nav--storefront .nilfish-site-nav__logo,
  .nilfish-site-nav--landing .nilfish-site-nav__logo,
  .nilfish-site-nav--landing.is-compact .nilfish-site-nav__logo {
    height: 26px;
    max-width: 104px;
  }

  .nilfish-site-nav--storefront .nilfish-site-nav__link {
    font-size: 0.85rem;
  }

  .nilfish-site-nav--storefront .nilfish-site-nav__end {
    flex: none;
    flex-wrap: nowrap;
    margin-left: 0;
    gap: 0.5rem;
  }

  .nilfish-header-search {
    --nilfish-header-search-expanded: min(100%, 22rem);
    flex: 1 1 auto;
    width: var(--nilfish-header-search-collapsed);
  }

  .nilfish-header-search.is-expanded {
    width: var(--nilfish-header-search-expanded);
    max-width: var(--nilfish-header-search-expanded);
    min-width: 10rem;
  }

  .nilfish-header-search input {
    height: 2rem;
    padding-left: 1.9rem;
    font-size: 0.92rem;
  }

  .nilfish-lang-switch__btn {
    padding: 0.2rem 0.38rem;
  }

  .nilfish-site-main,
  .nilfish-container {
    padding: 1.25rem;
  }

  .nilfish-grid--2col,
  .nilfish-grid--halves,
  .nilfish-grid--kontering {
    grid-template-columns: 1fr;
  }

  .nilfish-grid--2col > .nilfish-grid__col-2 {
    grid-column: 1;
  }

  .nilfish-grid--cards {
    grid-template-columns: 1fr;
  }

  .nilfish-grid--products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nilfish-home-hero .min-vh-75 {
    min-height: auto;
  }
}

@media (max-width: 479.98px) {
  .nilfish-site-nav--storefront,
  .nilfish-site-nav--landing,
  .nilfish-site-nav--landing.is-compact {
    padding: 0.4rem 0.6rem;
  }

  .nilfish-grid--products {
    grid-template-columns: 1fr;
  }
}

/* ── Media gallery + HTML editor ─────────────────────────────────────────── */

.nilfish-media-dropzone {
  border: 2px dashed var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  padding: 1.5rem;
  text-align: center;
  cursor: pointer;
  background: var(--nilfish-white);
  transition: border-color 0.15s ease, background 0.15s ease;
}

.nilfish-media-dropzone[data-dragging="true"] {
  border-color: var(--nilfish-accent, #e85d04);
  background: color-mix(in srgb, var(--nilfish-accent, #e85d04) 8%, white);
}

.nilfish-media-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.nilfish-media-tile {
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  overflow: hidden;
  background: var(--nilfish-white);
}

.nilfish-media-tile img {
  display: block;
  width: 100%;
  height: 120px;
  object-fit: cover;
}

.nilfish-media-tile__actions {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.5rem;
}

.nilfish-html-editor {
  width: 100%;
  max-width: none;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-white);
  overflow: hidden;
}

.nilfish-html-editor.is-disabled {
  opacity: 0.65;
  pointer-events: none;
}

.nilfish-html-editor__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-bottom: 0;
  padding: 0.5rem;
  align-items: center;
  border-bottom: 1px solid var(--nilfish-border);
  background: color-mix(in srgb, var(--nilfish-border) 40%, var(--nilfish-white));
}

.nilfish-html-editor__toolbar .btn-nilfish-secondary {
  padding: 0.35rem 0.7rem;
  font-size: 0.8125rem;
}

.nilfish-html-editor__toolbar .btn-nilfish-secondary.is-active {
  border-color: var(--nilfish-accent);
  color: var(--nilfish-accent);
  background: color-mix(in srgb, var(--nilfish-accent) 12%, var(--nilfish-white));
}

.nilfish-html-editor .ProseMirror,
.nilfish-html-editor__surface {
  width: 100%;
  max-width: none;
  min-height: 16rem;
  box-sizing: border-box;
  padding: 0.75rem 1rem;
  outline: none;
  white-space: pre-wrap;
}

.nilfish-html-editor .ProseMirror p.is-editor-empty:first-child::before {
  color: var(--nilfish-muted, #9ca3af);
  content: attr(data-placeholder);
  float: left;
  height: 0;
  pointer-events: none;
}

.nilfish-html-editor .ProseMirror img.nilfish-rte-img,
.nilfish-html-editor .ProseMirror img {
  max-width: 100%;
  height: auto;
  border-radius: var(--nilfish-radius-sm, 4px);
}

.nilfish-html-editor__image-size {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.5rem 0.5rem;
  border-bottom: 1px solid var(--nilfish-border);
  background: color-mix(
    in srgb,
    var(--nilfish-accent, #e85d04) 10%,
    var(--nilfish-surface-elevated, var(--nilfish-white, #fff))
  );
  color: var(--nilfish-text, inherit);
}

.nilfish-html-editor__image-px {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin-left: 0.25rem;
}

.nilfish-html-editor__image-px-input {
  width: 4.5rem;
  min-width: 4.5rem;
  padding: 0.25rem 0.4rem;
}

.nilfish-html-editor .ProseMirror img.nilfish-rte-img--custom,
.nilfish-prose img.nilfish-rte-img--custom {
  /* Width comes from the HTML width attribute / inline style — do not set width here. */
  max-width: 100%;
  height: auto;
}

.nilfish-prose img.nilfish-rte-img--custom[width] {
  /* Keep pixel width from the width attribute on the public site (style may be stripped). */
  width: attr(width px);
  max-width: 100%;
  height: auto;
}

.nilfish-html-editor .ProseMirror img.ProseMirror-selectednode,
.nilfish-html-editor .ProseMirror img.nilfish-rte-img.ProseMirror-selectednode {
  outline: 2px solid var(--nilfish-accent, #e85d04);
  outline-offset: 2px;
}

.nilfish-html-editor .ProseMirror img.nilfish-rte-img--sm,
.nilfish-prose img.nilfish-rte-img--sm {
  width: auto;
  max-width: min(25%, 12rem);
  height: auto;
}

.nilfish-html-editor .ProseMirror img.nilfish-rte-img--md,
.nilfish-prose img.nilfish-rte-img--md {
  width: auto;
  max-width: min(50%, 24rem);
  height: auto;
}

.nilfish-html-editor .ProseMirror img.nilfish-rte-img--lg,
.nilfish-prose img.nilfish-rte-img--lg {
  width: auto;
  max-width: min(75%, 36rem);
  height: auto;
}

.nilfish-html-editor .ProseMirror img.nilfish-rte-img--full,
.nilfish-prose img.nilfish-rte-img--full {
  width: 100%;
  max-width: 100%;
  height: auto;
}

/* Default for legacy images without a size class */
.nilfish-prose img.nilfish-rte-img:not([class*="nilfish-rte-img--"]),
.nilfish-html-editor .ProseMirror img.nilfish-rte-img:not([class*="nilfish-rte-img--"]) {
  max-width: min(50%, 24rem);
  height: auto;
}

.nilfish-html-editor .ProseMirror table {
  border-collapse: collapse;
  width: 100%;
  margin: 0.75rem 0;
}

.nilfish-html-editor .ProseMirror th,
.nilfish-html-editor .ProseMirror td {
  border: 1px solid var(--nilfish-border);
  padding: 0.4rem 0.6rem;
  vertical-align: top;
}

.nilfish-html-editor .ProseMirror th {
  background: var(--nilfish-bg-light, #f3f4f6);
  font-weight: 600;
}

.nilfish-html-editor .ProseMirror blockquote {
  margin: 0.75rem 0;
  padding-left: 0.85rem;
  border-left: 3px solid var(--nilfish-border);
  color: var(--nilfish-muted, #6b7280);
}

.nilfish-prose img {
  max-width: 100%;
  height: auto;
}

/* CMS / design-block body links — never browser default purple (esp. plasma dark). */
.nilfish-prose a,
.nilfish-html-editor .ProseMirror a {
  color: var(--nilfish-accent, #e85d04);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.nilfish-prose a:visited,
.nilfish-html-editor .ProseMirror a:visited {
  color: var(--nilfish-accent, #e85d04);
}

.nilfish-prose a:hover,
.nilfish-html-editor .ProseMirror a:hover {
  color: color-mix(in srgb, var(--nilfish-accent, #e85d04) 72%, var(--nilfish-heading, #f4f4f7));
}

.nilfish-prose img.nilfish-rte-img--sm {
  max-width: min(25%, 12rem);
}

.nilfish-prose img.nilfish-rte-img--md {
  max-width: min(50%, 24rem);
}

.nilfish-prose img.nilfish-rte-img--lg {
  max-width: min(75%, 36rem);
}

.nilfish-prose img.nilfish-rte-img--full {
  width: 100%;
  max-width: 100%;
}

.nilfish-prose img.nilfish-rte-img--custom {
  max-width: 100%;
  height: auto;
}

.nilfish-prose img.nilfish-rte-img--custom[width] {
  width: attr(width px);
  max-width: 100%;
  height: auto;
}

.nilfish-public-news-list {
  list-style: none;
  margin: 0 0 1.25rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.nilfish-public-news-item time {
  display: block;
  font-size: 0.85rem;
  margin-bottom: 0.25rem;
}

.nilfish-public-news-item h3 {
  margin: 0 0 0.4rem;
  font-size: 1.15rem;
}

/* News cards — 509 University-style overlapping caption boxes */
.nilfish-home-news--cards .nilfish-home-news__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem 1.5rem;
  margin-bottom: 1.75rem;
  flex-wrap: wrap;
}

.nilfish-home-news--cards .nilfish-home-news__header .nilfish-section-title {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: clamp(1.35rem, 2.4vw, 1.85rem);
}

.nilfish-home-news__more {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: transparent;
  border: 0;
  padding: 0;
  color: var(--nilfish-ink, #0f172a);
  font: inherit;
  font-size: 0.92rem;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 0.2em;
  cursor: pointer;
}

.nilfish-home-news__more:disabled {
  opacity: 0.55;
  cursor: wait;
}

.nilfish-home-news__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 1.75rem;
  gap: 1.75rem;
}

.nilfish-home-news__card {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.nilfish-home-news__media {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #e8eef4;
}

.nilfish-home-news__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.nilfish-home-news__media-fallback {
  width: 100%;
  height: 100%;
  background: linear-gradient(145deg, #e2e8f0 0%, #f8fafc 55%, #cbd5e1 100%);
}

.nilfish-home-news__body {
  position: relative;
  z-index: 1;
  margin: -2.75rem 0.9rem 0;
  padding: 1.15rem 1.2rem 1.25rem;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.nilfish-home-news__date {
  display: block;
  margin: 0 0 0.45rem;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-home-news__title {
  margin: 0 0 0.55rem;
  font-size: 0.98rem;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--nilfish-ink, #0f172a);
}

.nilfish-home-news__excerpt {
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.45;
  color: var(--nilfish-body, #334155);
}

@media (max-width: 991.98px) {
  .nilfish-home-news__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.35rem;
  }
}

@media (max-width: 575.98px) {
  .nilfish-home-news__grid {
    grid-template-columns: 1fr;
  }

  .nilfish-home-news__body {
    margin: -2.25rem 0.65rem 0;
  }
}

.nilfish-product-gallery {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.nilfish-product-gallery__main {
  aspect-ratio: 1 / 1;
  width: 100%;
  max-width: 100%;
  border-radius: var(--nilfish-radius-lg);
  background: linear-gradient(180deg, #eef2f6 0%, #e7edf3 100%);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.nilfish-product-gallery__main img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.nilfish-product-gallery__thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.nilfish-product-gallery__thumbs button {
  border: 2px solid transparent;
  padding: 0;
  border-radius: var(--nilfish-radius-md);
  overflow: hidden;
  cursor: pointer;
  background: none;
}

.nilfish-product-gallery__thumbs button[data-active="true"] {
  border-color: var(--nilfish-accent, #e85d04);
}

.nilfish-product-gallery__thumbs img {
  display: block;
  width: 64px;
  height: 64px;
  object-fit: cover;
}

/* ── Documentation hub (master-site, ported from Odoo docs layout) ───────── */

.nilfish-docs.nilfish-site-main {
  max-width: 1200px;
}

.nilfish-docs-layout {
  display: grid;
  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
  grid-gap: 2rem;
  gap: 2rem;
  align-items: start;
}

.nilfish-docs-sidebar {
  position: -webkit-sticky;
  position: sticky;
  top: 1.5rem;
  background: var(--nilfish-white);
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  padding: 1.25rem;
  box-shadow: 0 8px 24px rgba(13, 27, 42, 0.06);
}

.nilfish-docs-sidebar-title {
  color: var(--nilfish-accent);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 0.75rem;
}

.nilfish-docs-nav-link {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  color: var(--nilfish-accent);
  text-decoration: none;
  padding: 0.45rem 0;
  border-bottom: 1px solid #f1f5f9;
}

.nilfish-docs-nav-icon {
  flex: none;
  color: var(--nilfish-accent);
}

.nilfish-docs-nav-link:hover,
.nilfish-docs-nav-link.is-active {
  color: var(--nilfish-accent-hover);
}

.nilfish-docs-nav-link.is-active {
  font-weight: 600;
}

.nilfish-docs-topic-link {
  display: block;
  color: var(--nilfish-muted);
  text-decoration: none;
  font-size: 0.92rem;
  padding: 0.3rem 0 0.3rem 0.75rem;
}

.nilfish-docs-topic-link:hover,
.nilfish-docs-topic-link.is-active {
  color: var(--nilfish-accent);
}

.nilfish-docs-topic-link.is-active {
  font-weight: 600;
}

.nilfish-docs-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
  margin-bottom: 2.5rem;
}

.nilfish-docs-card {
  display: block;
  background: var(--nilfish-white);
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  padding: 1.25rem;
  text-decoration: none;
  color: inherit;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.nilfish-docs-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(13, 27, 42, 0.08);
}

.nilfish-docs-card h3 {
  color: var(--nilfish-primary);
  font-size: 1.05rem;
  margin: 0 0 0.5rem;
}

.nilfish-docs-card__icon {
  display: flex;
  color: var(--nilfish-accent);
  margin-bottom: 0.65rem;
}

.nilfish-docs-card p {
  color: var(--nilfish-muted);
  margin: 0 0 0.75rem;
}

.nilfish-docs-content {
  background: var(--nilfish-white);
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  padding: 2rem;
  box-shadow: 0 8px 24px rgba(13, 27, 42, 0.05);
}

.nilfish-docs-topic-list-item {
  border-bottom: 1px solid var(--nilfish-border);
  padding: 1rem 0;
}

.nilfish-docs-topic-list-item:last-child {
  border-bottom: 0;
}

.nilfish-docs-topic-list-item h3 {
  font-size: 1.1rem;
  margin: 0 0 0.35rem;
}

.nilfish-docs-topic-list-item p {
  color: var(--nilfish-muted);
  margin: 0;
}

.nilfish-docs-pane + .nilfish-docs-pane {
  margin-top: 2rem;
  padding-top: 1.75rem;
  border-top: 1px solid var(--nilfish-border);
}

.nilfish-docs-pane__label {
  color: var(--nilfish-accent);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 0.85rem;
}

.nilfish-docs-pane--technical {
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  padding: 1.25rem 1.5rem 1.5rem;
}

.nilfish-docs-prose {
  line-height: 1.65;
}

.nilfish-docs-prose h2,
.nilfish-docs-prose h3,
.nilfish-docs-prose h4 {
  color: var(--nilfish-primary);
  margin: 1.25rem 0 0.5rem;
}

.nilfish-docs-prose p,
.nilfish-docs-prose ul,
.nilfish-docs-prose ol {
  margin: 0 0 0.85rem;
}

.nilfish-docs-prose ul,
.nilfish-docs-prose ol {
  padding-left: 1.25rem;
}

.nilfish-docs-prose li {
  margin-bottom: 0.35rem;
}

.nilfish-docs-prose a {
  color: var(--nilfish-accent);
  font-weight: 600;
}

/* Legal / privacy-terms reading layout (CMS body_html) */
.nilfish-legal-doc {
  max-width: 42rem;
  margin: 0 auto 2.5rem;
  padding: 0 0 1rem;
  line-height: 1.7;
  color: var(--nilfish-body, var(--nilfish-text, #334155));
}

.nilfish-legal-doc > .nilfish-pdp__title,
.nilfish-legal-doc > .nilfish-home-title {
  margin: 0 0 1.25rem;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--nilfish-heading, var(--nilfish-primary, #0f172a));
}

.nilfish-legal-intro {
  margin: 0 0 1.75rem;
}

.nilfish-legal-lead {
  margin: 0 0 1rem;
  font-size: 1.05rem;
  color: color-mix(in srgb, var(--nilfish-body, var(--nilfish-text, #334155)) 92%, transparent);
}

.nilfish-legal-notice {
  margin: 0;
  padding: 0.85rem 1rem;
  border-left: 3px solid var(--nilfish-accent, #c45a12);
  background: color-mix(in srgb, var(--nilfish-accent, #c45a12) 10%, var(--nilfish-surface, #f4f6f9));
  border-radius: 0 8px 8px 0;
  font-size: 0.92rem;
  color: var(--nilfish-body, var(--nilfish-text, #334155));
}

.nilfish-legal-section {
  margin: 0 0 1.75rem;
  padding-top: 1.35rem;
  border-top: 1px solid var(--nilfish-border, #e2e8f0);
}

.nilfish-legal-section:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.nilfish-legal-doc h2,
.nilfish-legal-section h2 {
  margin: 0 0 0.65rem;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--nilfish-heading, var(--nilfish-primary, #0f172a));
}

.nilfish-legal-doc h3,
.nilfish-legal-section h3 {
  margin: 1.1rem 0 0.55rem;
  font-size: 0.98rem;
  font-weight: 650;
  color: var(--nilfish-heading, var(--nilfish-primary, #0f172a));
}

.nilfish-legal-doc p,
.nilfish-legal-doc ul,
.nilfish-legal-section p,
.nilfish-legal-section ul {
  margin: 0 0 0.85rem;
}

.nilfish-legal-doc ul,
.nilfish-legal-bases {
  padding-left: 1.2rem;
}

.nilfish-legal-doc li,
.nilfish-legal-bases li {
  margin-bottom: 0.4rem;
}

.nilfish-legal-doc a {
  color: var(--nilfish-accent, #c45a12);
  font-weight: 600;
  text-underline-offset: 2px;
}

.nilfish-legal-cats {
  display: grid;
  grid-gap: 0.65rem;
  gap: 0.65rem;
  margin: 0.75rem 0 1rem;
}

.nilfish-legal-cat {
  padding: 0.75rem 0.9rem;
  border: 1px solid var(--nilfish-border, #e2e8f0);
  border-radius: var(--nilfish-radius-md, 10px);
  background: var(--nilfish-surface-elevated, var(--nilfish-card-bg, #fff));
}

.nilfish-legal-cat__label {
  margin: 0 0 0.25rem !important;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--nilfish-heading, var(--nilfish-primary, #0f172a));
}

.nilfish-legal-cat p:last-child {
  margin-bottom: 0 !important;
  font-size: 0.95rem;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-docs-prose code {
  font-size: 0.88em;
  color: var(--nilfish-accent-hover);
}

.nilfish-docs-prose pre {
  overflow: auto;
  padding: 0.75rem 1rem;
  background: var(--nilfish-bg-light);
  border-radius: 6px;
  font-size: 0.875rem;
}

.nilfish-docs-figure {
  margin: 1.25rem 0 1.75rem;
  padding: 0;
  text-align: center;
}

.nilfish-docs-figure img,
.nilfish-docs-figure video {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
  background: var(--nilfish-bg-light);
}

.nilfish-docs-figure figcaption {
  color: var(--nilfish-muted);
  font-size: 0.9rem;
  margin-top: 0.5rem;
}

.nilfish-docs-flow {
  margin: 1.25rem 0 1.75rem;
  padding: 1.25rem;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-lg);
}

@media (max-width: 991.98px) {
  .nilfish-docs-layout {
    grid-template-columns: 1fr;
  }

  .nilfish-docs-sidebar {
    position: static;
  }
}

/* ── Agency client portal (mobile-first) ─────────────────────────────────── */

.nilfish-portal {
  width: 100%;
  max-width: 56rem;
  margin: 0 auto;
  padding: 1rem 1rem 3rem;
  box-sizing: border-box;
  position: relative;
  z-index: 1;
}

@media (min-width: 768px) {
  .nilfish-portal {
    max-width: 64rem;
    padding: 1.5rem 1.5rem 3rem;
  }
}

@media (min-width: 1100px) {
  .nilfish-portal {
    max-width: 72rem;
    padding: 1.75rem 2rem 3.5rem;
  }
}

/* Portal atmosphere — light hero grid/gradient (shared with storefront language) */
.nilfish-portal-site {
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  background:
    radial-gradient(
      ellipse 85% 55% at 12% -8%,
      rgba(var(--nilfish-accent-rgb), 0.2),
      transparent 58%
    ),
    radial-gradient(
      ellipse 70% 45% at 92% 8%,
      rgba(var(--nilfish-accent-rgb), 0.12),
      transparent 52%
    ),
    linear-gradient(165deg, #e4f1fa 0%, #f3f6fa 40%, #eef2f6 100%);
}

.nilfish-portal-site::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(var(--nilfish-accent-rgb), 0.085) 1px, transparent 1px),
    linear-gradient(rgba(var(--nilfish-accent-rgb), 0.085) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse 90% 70% at 50% 18%, black 12%, transparent 72%);
          mask-image: radial-gradient(ellipse 90% 70% at 50% 18%, black 12%, transparent 72%);
  opacity: 0.95;
}

.nilfish-portal-site > .nilfish-site {
  position: relative;
  z-index: 1;
  background: transparent;
}

.nilfish-portal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.15rem;
  padding: 1rem 1.15rem;
  border-radius: var(--nilfish-radius-md);
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(255, 255, 255, 0.9);
  box-shadow: 0 1px 2px rgba(26, 35, 50, 0.04);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}

.nilfish-portal__header-text {
  min-width: 0;
}

.nilfish-portal__header-logo {
  display: block;
  height: 56px;
  width: auto;
  max-width: 140px;
  object-fit: contain;
  flex-shrink: 0;
}

.nilfish-portal__title {
  margin: 0;
  font-size: 1.75rem;
  line-height: 1.2;
  color: var(--nilfish-primary);
}

.nilfish-portal__company {
  margin: 0.35rem 0 0;
  font-size: 1rem;
}

.nilfish-portal__page-head {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-bottom: 0.25rem;
}

.nilfish-portal__page-title {
  margin: 0;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--nilfish-primary);
}

.nilfish-portal__card {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  padding: 1.1rem 1.15rem;
  border-radius: var(--nilfish-radius-md);
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--nilfish-border);
  box-shadow: 0 1px 2px rgba(26, 35, 50, 0.04);
}

.nilfish-portal__card-title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 650;
  color: var(--nilfish-primary);
}

.nilfish-portal__quick-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.nilfish-portal__home-grid {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.nilfish-portal__home-layout {
  display: grid;
  grid-gap: 1.25rem;
  gap: 1.25rem;
  align-items: start;
}

@media (min-width: 900px) {
  .nilfish-portal__home-layout {
    grid-template-columns: minmax(0, 1.4fr) minmax(16rem, 0.85fr);
  }
}

.nilfish-portal__news {
  min-width: 0;
}

.nilfish-portal__news-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
}

.nilfish-portal__news-item {
  padding: 0.85rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--nilfish-border) 80%, transparent);
}

.nilfish-portal__news-item:last-child {
  border-bottom: 0;
}

.nilfish-portal__news-image {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--nilfish-radius-md);
  margin-bottom: 0.65rem;
}

.nilfish-portal__news-meta {
  margin-bottom: 0.25rem;
}

.nilfish-portal__news-title {
  margin: 0 0 0.35rem;
  font-size: 1.02rem;
  font-weight: 650;
  color: var(--nilfish-primary);
}

.nilfish-portal__news-body {
  font-size: 0.92rem;
  line-height: 1.45;
}

.nilfish-portal__news-body p {
  margin: 0 0 0.5rem;
}

.nilfish-news-cover-preview {
  display: block;
  width: 100%;
  max-width: 22rem;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--nilfish-radius-md);
  margin-bottom: 0.5rem;
}

@media (min-width: 640px) {
  .nilfish-portal__home-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.nilfish-site-nav--portal,
.nilfish-portal-site .nilfish-site-nav {
  position: relative;
  container-type: inline-size;
  flex-wrap: nowrap;
}

.nilfish-site-nav--portal .nilfish-site-nav__brand,
.nilfish-portal-site .nilfish-site-nav__brand {
  flex: 0 1 auto;
  min-width: 0;
}

.nilfish-site-nav--portal .nilfish-site-nav__brand span,
.nilfish-portal-site .nilfish-site-nav__brand span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nilfish-site-nav--portal .nilfish-site-nav__link,
.nilfish-portal-site .nilfish-site-nav > a:not(.nilfish-site-nav__brand) {
  flex: 0 0 auto;
  padding: 0.45rem 0.6rem;
  border-radius: var(--nilfish-radius-md);
}

.nilfish-site-nav--portal .nilfish-site-nav__link.is-active,
.nilfish-site-nav--portal .nilfish-site-nav__dropdown.is-active > .nilfish-site-nav__link {
  background: rgba(255, 255, 255, 0.18);
}

.nilfish-site-nav--portal .nilfish-site-nav__mobile-menu {
  display: none !important;
}

.nilfish-site-nav__dropdown {
  position: relative;
}

.nilfish-site-nav__dropdown > .nilfish-site-nav__link {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  margin: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
}

.nilfish-site-nav__dropdown-panel {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 50;
  min-width: 11rem;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.4rem;
  margin-top: 0.35rem;
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-primary);
  box-shadow: 0 0.75rem 2rem rgba(0, 0, 0, 0.25);
}

/* Invisible bridge so the pointer can cross the visual gap without closing the menu */
.nilfish-site-nav__dropdown-panel::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 100%;
  height: 0.35rem;
}

.nilfish-site-nav__dropdown:hover .nilfish-site-nav__dropdown-panel,
.nilfish-site-nav__dropdown:focus-within .nilfish-site-nav__dropdown-panel {
  display: flex;
}

.nilfish-site-nav__dropdown-panel a {
  padding: 0.65rem 0.85rem;
  border-radius: var(--nilfish-radius-md);
  white-space: nowrap;
  font-weight: 500;
}

.nilfish-site-nav__dropdown-panel a.is-active,
.nilfish-site-nav__dropdown-panel a:hover {
  background: rgba(255, 255, 255, 0.18);
  opacity: 1;
}

.nilfish-site-nav__portal-toggle {
  display: none;
  align-items: center;
  gap: 0.55rem;
  min-height: 2.5rem;
  padding: 0.4rem 0.65rem;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: var(--nilfish-radius-md);
  background: transparent;
  color: var(--nilfish-white);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.nilfish-site-nav__portal-toggle:hover {
  background: rgba(255, 255, 255, 0.12);
}

.nilfish-portal__menu-icon {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  width: 1.15rem;
}

.nilfish-portal__menu-icon span {
  display: block;
  height: 2px;
  width: 100%;
  border-radius: 1px;
  background: currentColor;
}

.nilfish-site-nav__portal-menu {
  position: absolute;
  top: calc(100% + 0.5rem);
  right: 0;
  z-index: 40;
  min-width: min(18rem, calc(100vw - 2rem));
  display: none;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.5rem;
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-primary);
  box-shadow: 0 0.75rem 2rem rgba(0, 0, 0, 0.2);
}

.nilfish-site-nav__portal-menu[hidden] {
  display: none !important;
}

.nilfish-site-nav__portal-menu a {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.75rem 0.9rem;
  border-radius: var(--nilfish-radius-md);
}

.nilfish-site-nav__portal-menu a.is-active {
  background: rgba(255, 255, 255, 0.18);
}

.nilfish-portal__nav-group {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.25rem 0 0.35rem;
}

.nilfish-portal__nav-group-label {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0;
  padding: 0.45rem 0.9rem 0.2rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.65);
}

.nilfish-portal__nav-group a {
  padding-left: 1.25rem;
}

@container (max-width: 55rem) {
  /* Desk links live under __links — hide the whole strip on narrow portal. */
  .nilfish-site-nav--portal .nilfish-site-nav__links,
  .nilfish-portal-site .nilfish-site-nav__links {
    display: none !important;
  }

  .nilfish-site-nav--portal .nilfish-site-nav__portal-toggle,
  .nilfish-portal-site .nilfish-site-nav__portal-toggle {
    display: inline-flex;
  }

  .nilfish-site-nav__portal-menu:not([hidden]) {
    display: flex;
  }
}

.nilfish-portal__stack {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.nilfish-portal__section-title {
  margin: 0;
  font-size: 1.25rem;
  color: var(--nilfish-primary);
}

.nilfish-portal__lead {
  margin: 0;
  color: var(--nilfish-muted);
  line-height: 1.45;
}

.nilfish-portal__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.nilfish-portal__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0 0 1rem;
}

.nilfish-portal__tab {
  border: 1px solid var(--nilfish-border);
  background: transparent;
  color: inherit;
  font: inherit;
  padding: 0.45rem 0.75rem;
  border-radius: var(--nilfish-radius-md);
  cursor: pointer;
}

.nilfish-portal__tab.is-active {
  background: var(--nilfish-accent);
  border-color: var(--nilfish-accent);
  color: #fff;
}

.nilfish-portal__list-btn,
.nilfish-portal__list-static {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 0.2rem;
  gap: 0.2rem;
  width: 100%;
  text-align: left;
  padding: 0.85rem 1rem;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  background: rgba(255, 255, 255, 0.94);
  font: inherit;
  color: inherit;
  cursor: pointer;
}

.nilfish-portal__list-static {
  cursor: default;
}

.nilfish-portal__tap {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 0.85rem;
  width: 100%;
  min-height: 3.25rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  background: rgba(255, 255, 255, 0.94);
  text-align: left;
  text-decoration: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
  position: relative;
  box-shadow: 0 1px 2px rgba(26, 35, 50, 0.04);
}

.nilfish-portal__tap-icon {
  flex-shrink: 0;
  width: 2.35rem;
  height: 2.35rem;
  display: grid;
  place-items: center;
  border-radius: var(--nilfish-radius-md);
  background: rgba(var(--nilfish-accent-rgb), 0.14);
  color: var(--nilfish-primary);
}

.nilfish-portal__tap-body {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
  flex: 1 1;
}

.nilfish-portal__tap--primary {
  background: var(--nilfish-btn-primary-bg);
  color: var(--nilfish-btn-primary-text);
  border-color: transparent;
  font-weight: 600;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  box-shadow: none;
}

.nilfish-portal__tap--primary .nilfish-file-picker__input,
.nilfish-portal__tap .nilfish-file-picker__input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.nilfish-portal__tap.is-disabled {
  opacity: 0.6;
  pointer-events: none;
}

.nilfish-portal__tap-title {
  font-weight: 600;
  font-size: 1.05rem;
}

.nilfish-portal__tap-desc {
  font-size: 0.9rem;
  color: var(--nilfish-muted);
}

.nilfish-portal__tap--primary .nilfish-portal__tap-desc {
  color: inherit;
  opacity: 0.85;
}

.nilfish-portal__list-item {
  padding: 0.85rem 1rem;
  border-radius: var(--nilfish-radius-md);
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid var(--nilfish-border);
}

.nilfish-portal__year-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--nilfish-border);
  padding-bottom: 0.35rem;
}

.nilfish-portal__year-tab {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: none;
  border: 0;
  padding: 0.35rem 0.15rem;
  font: inherit;
  color: var(--nilfish-muted);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}

.nilfish-portal__year-tab.is-active {
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-weight: 600;
  border-bottom-color: var(--nilfish-accent, #c9a227);
}

.nilfish-portal__payslip-head {
  display: grid;
  grid-template-columns: 1fr auto 1.5rem;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  padding: 0 0.25rem 0.5rem;
  font-size: 0.8rem;
  color: var(--nilfish-muted);
}

.nilfish-portal__payslip-head span:nth-child(2) {
  text-align: right;
}

.nilfish-portal__payslip-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.nilfish-portal__payslip-row {
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  background: rgba(255, 255, 255, 0.92);
  overflow: hidden;
}

.nilfish-portal__payslip-toggle {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto 1.5rem;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  align-items: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: none;
  border: 0;
  padding: 0.85rem 1rem;
  font: inherit;
  text-align: left;
  cursor: pointer;
  color: inherit;
}

.nilfish-portal__payslip-date {
  font-weight: 500;
}

.nilfish-portal__payslip-net {
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.nilfish-portal__payslip-chevron {
  color: var(--nilfish-muted);
  text-align: center;
}

.nilfish-portal__payslip-panel {
  padding: 0 1rem 1rem;
  border-top: 1px solid var(--nilfish-border);
}

.nilfish-portal__payslip-summary {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  margin: 0.85rem 0 1rem;
}

@media (min-width: 640px) {
  .nilfish-portal__payslip-summary {
    grid-template-columns: 1.2fr 1fr;
    align-items: start;
  }
}

.nilfish-portal__payslip-after-tax {
  margin: 0;
  font-size: 1.15rem;
}

.nilfish-portal__payslip-meta {
  margin: 0;
  display: grid;
  grid-gap: 0.35rem;
  gap: 0.35rem;
  font-size: 0.9rem;
}

.nilfish-portal__payslip-meta div {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
}

.nilfish-portal__payslip-meta dt {
  color: var(--nilfish-muted);
  font-weight: 400;
}

.nilfish-portal__payslip-meta dd {
  margin: 0;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.nilfish-portal__uploads {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.nilfish-portal__upload-row {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--nilfish-border);
  min-height: 2.75rem;
  align-items: center;
}

.nilfish-portal__upload-name {
  font-weight: 500;
  word-break: break-word;
}

.nilfish-portal__upload-status {
  flex-shrink: 0;
  font-size: 0.85rem;
  color: var(--nilfish-muted);
  text-transform: capitalize;
}

.nilfish-portal__actions {
  display: flex;
  gap: 0.5rem;
}

.nilfish-portal__upload {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.nilfish-portal__mail {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.85rem 1rem;
  border-radius: var(--nilfish-radius-md);
  background: rgba(0, 0, 0, 0.03);
  border: 1px solid var(--nilfish-border, #e2e5ea);
}

.nilfish-portal__mail-lead {
  margin: 0;
  font-size: 0.95rem;
  color: var(--nilfish-body, #222);
}

.nilfish-portal__mail-row {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}

.nilfish-portal__mail-row .nilfish-mail-alias {
  width: 100%;
}

.nilfish-portal__mail-row .nilfish-mail-alias__email {
  font-size: 0.9rem;
}

/* Portal handbook — newspaper-style contents + reader */
.nilfish-handbook {
  display: grid;
  grid-gap: 1.25rem;
  gap: 1.25rem;
  align-items: start;
  min-width: 0;
}

@media (min-width: 860px) {
  .nilfish-handbook {
    grid-template-columns: minmax(12rem, 17rem) minmax(0, 1fr);
    gap: 1.75rem;
  }
}

.nilfish-handbook__toc {
  padding: 1rem 1.1rem;
  border-radius: var(--nilfish-radius-md);
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--nilfish-border);
  box-shadow: 0 1px 2px rgba(26, 35, 50, 0.04);
  min-width: 0;
}

@media (min-width: 860px) {
  .nilfish-handbook__toc {
    position: -webkit-sticky;
    position: sticky;
    top: 1rem;
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
  }
}

.nilfish-handbook__toc-title {
  margin: 0 0 0.85rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--nilfish-muted);
}

.nilfish-handbook__section {
  margin: 0 0 1.1rem;
  padding: 0 0 0.85rem;
  border-bottom: 1px solid var(--nilfish-border);
}

.nilfish-handbook__section:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

.nilfish-handbook__cat {
  margin: 0 0 0.4rem;
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--nilfish-primary);
}

.nilfish-handbook__links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.nilfish-handbook__files {
  list-style: none;
  margin: 0.15rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.nilfish-handbook__files-label {
  margin: 0.65rem 0 0.2rem;
  padding: 0 0.55rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--nilfish-muted);
}

.nilfish-handbook__link {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0.4rem 0.55rem;
  border: 0;
  border-left: 2px solid transparent;
  border-radius: 0 var(--nilfish-radius-sm, 4px) var(--nilfish-radius-sm, 4px) 0;
  background: transparent;
  color: var(--nilfish-body, #222);
  font: inherit;
  font-size: 0.92rem;
  font-weight: 500;
  text-align: left;
  line-height: 1.35;
  cursor: pointer;
}

.nilfish-handbook__link:hover {
  background: rgba(var(--nilfish-accent-rgb), 0.08);
}

.nilfish-handbook__link.is-active {
  border-left-color: var(--nilfish-accent, #e87722);
  background: rgba(var(--nilfish-accent-rgb), 0.12);
  color: var(--nilfish-primary);
  font-weight: 650;
}

.nilfish-handbook__file {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  padding: 0.35rem 0.55rem;
  font-size: 0.88rem;
  color: var(--nilfish-primary);
  text-decoration: none;
  word-break: break-word;
  line-height: 1.35;
}

.nilfish-handbook__file:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.nilfish-handbook__file .nf-icon {
  flex-shrink: 0;
  margin-top: 0.1rem;
  opacity: 0.85;
}

.nilfish-handbook__reader {
  min-width: 0;
}

.nilfish-handbook__article {
  padding: 1.35rem 1.4rem 1.5rem;
  border-radius: var(--nilfish-radius-md);
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid var(--nilfish-border);
  box-shadow: 0 1px 2px rgba(26, 35, 50, 0.04);
}

.nilfish-handbook__eyebrow {
  margin: 0 0 0.35rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--nilfish-muted);
}

.nilfish-handbook__headline {
  margin: 0 0 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid var(--nilfish-primary);
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  font-weight: 750;
  line-height: 1.25;
  color: var(--nilfish-primary);
}

.nilfish-handbook__body {
  max-width: 40rem;
  color: var(--nilfish-body, #334155);
  font-size: 1.02rem;
  line-height: 1.75;
}

.nilfish-handbook__body > *:first-child {
  margin-top: 0;
}

.nilfish-handbook__body > *:last-child {
  margin-bottom: 0;
}

.nilfish-handbook__body p {
  margin: 0 0 1.05rem;
}

.nilfish-handbook__body .nilfish-handbook-lead,
.nilfish-handbook__body > p:first-of-type {
  font-size: 1.08rem;
  line-height: 1.7;
  color: color-mix(in srgb, var(--nilfish-body, #334155) 92%, var(--nilfish-primary, #0f172a));
}

.nilfish-handbook__body h3 {
  margin: 1.65rem 0 0.7rem;
  padding: 0.15rem 0 0.15rem 0.85rem;
  border-left: 3px solid var(--nilfish-accent, #2d6a4f);
  font-size: 1.05rem;
  font-weight: 750;
  letter-spacing: -0.01em;
  line-height: 1.35;
  color: var(--nilfish-primary, #0f172a);
}

.nilfish-handbook__body h3:first-child {
  margin-top: 0.35rem;
}

.nilfish-handbook__body ul,
.nilfish-handbook__body ol {
  margin: 0 0 1.25rem;
  padding: 0.35rem 0 0.35rem 0.15rem;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.nilfish-handbook__body ol {
  counter-reset: hb-step;
}

.nilfish-handbook__body li {
  position: relative;
  margin: 0;
  padding: 0.65rem 0.85rem 0.65rem 2.35rem;
  border-radius: 10px;
  background: color-mix(in srgb, var(--nilfish-primary, #0f172a) 3.5%, #fff);
  border: 1px solid color-mix(in srgb, var(--nilfish-border, #e2e8f0) 80%, transparent);
  line-height: 1.55;
}

.nilfish-handbook__body li::before {
  content: "";
  position: absolute;
  left: 0.85rem;
  top: 0.95rem;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: var(--nilfish-accent, #2d6a4f);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--nilfish-accent, #2d6a4f) 18%, transparent);
}

.nilfish-handbook__body ol li {
  padding-left: 2.55rem;
}

.nilfish-handbook__body ol li::before {
  content: counter(hb-step);
  counter-increment: hb-step;
  top: 0.7rem;
  left: 0.7rem;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 0.72rem;
  font-weight: 750;
  color: #fff;
  background: var(--nilfish-accent, #2d6a4f);
  box-shadow: none;
}

.nilfish-handbook__body li strong:first-child {
  display: inline;
  color: var(--nilfish-primary, #0f172a);
}

.nilfish-handbook__body ul.nilfish-handbook-pillars {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11.5rem, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
  padding: 0.15rem 0;
}

.nilfish-handbook__body ul.nilfish-handbook-pillars li {
  padding: 0.95rem 1rem 1rem;
  background: linear-gradient(
    165deg,
    color-mix(in srgb, var(--nilfish-accent, #2d6a4f) 8%, #fff) 0%,
    #fff 55%
  );
  border-color: color-mix(in srgb, var(--nilfish-accent, #2d6a4f) 22%, var(--nilfish-border, #e2e8f0));
}

.nilfish-handbook__body ul.nilfish-handbook-pillars li::before {
  display: none;
}

.nilfish-handbook__body ul.nilfish-handbook-pillars li strong {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.95rem;
  font-weight: 750;
  color: var(--nilfish-primary, #0f172a);
}

.nilfish-handbook__body blockquote {
  position: relative;
  margin: 1.35rem 0 1.5rem;
  padding: 1.15rem 1.2rem 1.15rem 1.35rem;
  border: 0;
  border-radius: 0 12px 12px 0;
  border-left: 4px solid var(--nilfish-accent, #2d6a4f);
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--nilfish-accent, #2d6a4f) 10%, #fff),
    color-mix(in srgb, var(--nilfish-primary, #0f172a) 3%, #fff)
  );
  font-size: 1.08rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.55;
  color: var(--nilfish-primary, #0f172a);
  quotes: "“" "”" "‘" "’";
}

.nilfish-handbook__body blockquote::before {
  content: open-quote;
  position: absolute;
  top: -0.15rem;
  left: 0.55rem;
  font-size: 2.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
  color: color-mix(in srgb, var(--nilfish-accent, #2d6a4f) 45%, transparent);
  pointer-events: none;
}

.nilfish-handbook__body blockquote p {
  margin: 0;
  position: relative;
  z-index: 1;
}

.nilfish-handbook__body blockquote footer,
.nilfish-handbook__body blockquote cite {
  display: block;
  margin-top: 0.65rem;
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 650;
  letter-spacing: 0.02em;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-handbook__body .nilfish-callout,
.nilfish-handbook__body aside.nilfish-callout {
  display: block;
  margin: 1.25rem 0 1.4rem;
  padding: 0.95rem 1.05rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--nilfish-accent, #2d6a4f) 28%, var(--nilfish-border, #e2e8f0));
  background:
    radial-gradient(
      120% 80% at 0% 0%,
      color-mix(in srgb, var(--nilfish-accent, #2d6a4f) 12%, transparent),
      transparent 55%
    ),
    color-mix(in srgb, var(--nilfish-surface, #f8fafc) 70%, #fff);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.nilfish-handbook__body .nilfish-callout > :first-child {
  margin-top: 0;
}

.nilfish-handbook__body .nilfish-callout > :last-child {
  margin-bottom: 0;
}

.nilfish-handbook__body .nilfish-callout strong:first-child {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.78rem;
  font-weight: 750;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--nilfish-accent, #2d6a4f);
}

.nilfish-handbook__body hr {
  margin: 1.75rem 0;
  border: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    color-mix(in srgb, var(--nilfish-accent, #2d6a4f) 45%, var(--nilfish-border, #e2e8f0)),
    transparent
  );
}

.nilfish-handbook__body a {
  color: var(--nilfish-accent, #2d6a4f);
  font-weight: 600;
  text-underline-offset: 2px;
}

/* Introduction cover */
.nilfish-handbook__intro-hero {
  margin: 0 0 1.35rem;
  padding: 1.15rem 1.2rem 1.2rem;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--nilfish-accent, #2d6a4f) 22%, var(--nilfish-border, #e2e8f0));
  background:
    radial-gradient(
      90% 120% at 100% 0%,
      color-mix(in srgb, var(--nilfish-accent, #2d6a4f) 14%, transparent),
      transparent 50%
    ),
    linear-gradient(160deg, #fff 0%, color-mix(in srgb, var(--nilfish-primary, #0f172a) 4%, #fff) 100%);
}

.nilfish-handbook__intro-kicker {
  margin: 0 0 0.45rem;
  font-size: 0.75rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--nilfish-accent, #2d6a4f);
}

.nilfish-handbook__intro-quote {
  margin: 0;
  font-size: clamp(1.15rem, 2.4vw, 1.4rem);
  font-weight: 650;
  font-style: italic;
  line-height: 1.4;
  color: var(--nilfish-primary, #0f172a);
}

.nilfish-handbook__forewords {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  margin: 0 0 1.75rem;
}

@media (min-width: 700px) {
  .nilfish-handbook__forewords {
    grid-template-columns: 1fr 1fr;
  }
}

.nilfish-handbook__foreword {
  margin: 0;
  padding: 1rem 1.05rem 1.1rem;
  border-radius: 12px;
  background: #fff;
  border: 1px solid var(--nilfish-border, #e2e8f0);
  box-shadow: 0 1px 2px rgba(26, 35, 50, 0.03);
}

.nilfish-handbook__foreword-label {
  margin: 0 0 0.45rem;
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-handbook__foreword p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--nilfish-body, #334155);
}

.nilfish-handbook__foreword-sign {
  display: block;
  margin-top: 0.75rem;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--nilfish-primary, #0f172a);
}

.nilfish-handbook__article .nilfish-handbook-lead {
  margin: 0 0 1.25rem;
  font-size: 1.08rem;
  line-height: 1.7;
  color: color-mix(in srgb, var(--nilfish-body, #334155) 92%, var(--nilfish-primary, #0f172a));
}

.nilfish-handbook__pager {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--nilfish-border);
}

.nilfish-handbook__pager-btn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  max-width: 48%;
  margin: 0;
  padding: 0.35rem 0;
  border: 0;
  background: transparent;
  color: var(--nilfish-primary);
  font: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  text-align: left;
  line-height: 1.35;
  cursor: pointer;
}

.nilfish-handbook__pager-btn--next {
  text-align: right;
  margin-left: auto;
}

.nilfish-handbook__pager-btn:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ── Vehicle garage widget (Odoo vehicle_garage.scss port) ───────────────── */

.o_vehicle_garage {
  position: relative;
  --o-vehicle-garage-theme: #1b3a5c;
  color: inherit;
}

.o_vehicle_garage_toggle {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  white-space: nowrap;
  text-decoration: none;
  color: inherit;
  background: transparent;
  border: 0;
  cursor: pointer;
  padding: 0.25rem 0.35rem;
  text-align: left;
}

.o_vehicle_garage_icon_wrap {
  line-height: 1;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.o_vehicle_garage_icon_svg {
  width: 1.75rem;
  height: 1.75rem;
  display: block;
}

.o_vehicle_garage_quantity {
  font-size: 0.7em;
  font-weight: 600;
  line-height: 1.1;
  min-width: 1.1em;
  padding: 0.2em 0.35em;
  position: absolute;
  top: -0.35rem;
  right: -0.55rem;
  border-radius: 999px;
  background: var(--nilfish-accent, #e85d04);
  color: #fff;
}

.o_vehicle_garage_label_wrap {
  min-width: 0;
  max-width: 14rem;
  margin-left: 0.5rem;
  display: none;
  flex-direction: column;
  text-align: left;
}

@media (min-width: 992px) {
  .o_vehicle_garage_label_wrap {
    display: flex;
  }
}

.o_vehicle_garage_subtitle {
  font-size: 0.7rem;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.o_vehicle_garage_title {
  font-size: 0.95rem;
  font-weight: 700;
  color: inherit;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.o_vehicle_garage_dropdown {
  position: absolute;
  top: calc(100% + 0.35rem);
  right: 0;
  left: auto;
  z-index: 1050;
  display: block;
  width: min(56rem, calc(100vw - 1.5rem));
  max-width: calc(100vw - 1.5rem);
  margin: 0;
  padding: 0;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 0.375rem;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  color: #0f172a;
}

.o_vehicle_garage_dropdown_inner {
  padding: 1.25rem 1.5rem;
}

.o_vehicle_garage_split {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 1rem;
  gap: 1rem;
  min-height: 14rem;
}

@media (min-width: 768px) {
  .o_vehicle_garage_split {
    grid-template-columns: 2fr 1fr;
    gap: 0;
  }
}

.o_vehicle_garage_history_panel {
  padding: 0 1rem 0 0;
}

.o_vehicle_garage_section_header {
  display: flex;
  align-items: center;
  text-align: center;
  margin-bottom: 1.5rem;
}

.o_vehicle_garage_section_header::before,
.o_vehicle_garage_section_header::after {
  content: "";
  flex: 1 1;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}

.o_vehicle_garage_section_title {
  padding: 0 1.25rem;
  font-weight: 700;
  font-size: 1rem;
  color: #000;
  white-space: nowrap;
}

.o_vehicle_garage_history_list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.o_vehicle_garage_history_item {
  display: flex;
  align-items: center;
  padding: 0.85rem 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.o_vehicle_garage_history_item:last-child {
  border-bottom: 0;
}

.o_vehicle_garage_history_item_clickable {
  cursor: pointer;
}

.o_vehicle_garage_history_item_clickable .o_vehicle_garage_history_label:hover {
  color: var(--o-vehicle-garage-theme, #1b3a5c);
}

.o_vehicle_garage_history_select {
  display: flex;
  align-items: center;
  flex: 1 1;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
}

.o_vehicle_garage_history_select:hover .o_vehicle_garage_history_label {
  color: var(--o-vehicle-garage-theme, #1b3a5c);
}

.o_vehicle_garage_radio_icon {
  display: inline-block;
  width: 1.25rem;
  height: 1.25rem;
  border: 2px solid rgba(0, 0, 0, 0.2);
  border-radius: 50%;
  position: relative;
  flex-shrink: 0;
}

.o_vehicle_garage_radio_icon.is-active {
  border-color: var(--o-vehicle-garage-theme, #1b3a5c);
}

.o_vehicle_garage_radio_icon.is-active::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0.55rem;
  height: 0.55rem;
  margin: -0.275rem 0 0 -0.275rem;
  background: var(--o-vehicle-garage-theme, #1b3a5c);
  border-radius: 50%;
}

.o_vehicle_garage_history_label {
  font-weight: 700;
  font-size: 1rem;
  min-width: 0;
  word-break: break-word;
  margin-left: 0.5rem;
  flex: 1 1;
}

.o_vehicle_garage_history_actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-left: 0.75rem;
  flex-shrink: 0;
}

.o_vehicle_garage_btn_primary {
  background-color: var(--o-vehicle-garage-theme, #1b3a5c);
  border: 1px solid var(--o-vehicle-garage-theme, #1b3a5c);
  color: #fff;
  font-weight: 600;
  white-space: nowrap;
  border-radius: 0.25rem;
  padding: 0.35rem 0.75rem;
  font-size: 0.875rem;
  cursor: pointer;
}

.o_vehicle_garage_btn_primary:hover,
.o_vehicle_garage_btn_primary:focus {
  filter: brightness(0.92);
  color: #fff;
}

.o_vehicle_garage_btn_delete {
  background: #fff;
  border: 1px solid var(--o-vehicle-garage-theme, #1b3a5c);
  color: var(--o-vehicle-garage-theme, #1b3a5c);
  width: 2.25rem;
  height: 2.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 0.25rem;
  cursor: pointer;
}

.o_vehicle_garage_btn_delete:hover,
.o_vehicle_garage_btn_delete:focus {
  background-color: rgba(0, 0, 0, 0.04);
}

.o_vehicle_garage_history_empty {
  padding: 1rem 0;
  color: #64748b;
  margin: 0;
}

.o_vehicle_garage_selector_panel {
  padding: 0;
}

.o_vehicle_garage_selector_card {
  border-radius: 0;
  padding: 2rem 1.75rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #fff;
  min-height: 100%;
  background-color: var(--o-vehicle-garage-theme, #1b3a5c);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.o_vehicle_garage_selector_title {
  font-size: 1.05rem;
  font-weight: 700;
  text-align: center;
  margin: 0 0 1.5rem;
  line-height: 1.4;
}

.o_vehicle_garage_selector_form {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.o_vehicle_garage_select {
  border: 0;
  border-radius: 0;
  padding: 0.65rem 0.85rem;
  font-size: 0.95rem;
  color: rgba(0, 0, 0, 0.65);
  width: 100%;
  background: #fff;
}

.o_vehicle_garage_select:disabled {
  opacity: 0.65;
}

.o_vehicle_garage_page .o_vehicle_garage_page_title {
  font-weight: 700;
}

.o_vehicle_garage_page .o_vehicle_garage_page_lead {
  font-size: 1.1rem;
}

.o_vehicle_garage.o_vehicle_garage_page_mode .o_vehicle_garage_panel {
  position: static;
  display: block;
  width: 100%;
  max-width: 56rem;
  margin: 0 auto;
  padding: 0;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 0.375rem;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.08);
}

@media (max-width: 767.98px) {
  .o_vehicle_garage .o_vehicle_garage_dropdown {
    position: fixed !important;
    top: calc(var(--header-height, 56px) + 0.35rem) !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
  }

  .o_vehicle_garage .o_vehicle_garage_dropdown_inner {
    padding: 1rem;
  }

  .o_vehicle_garage .o_vehicle_garage_split {
    min-height: 0;
  }

  .o_vehicle_garage .o_vehicle_garage_history_panel {
    padding: 0 0 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  }

  .o_vehicle_garage .o_vehicle_garage_selector_card {
    padding: 1.5rem 1rem;
  }

  .o_vehicle_garage .o_vehicle_garage_selector_title {
    font-size: 0.95rem;
    margin-bottom: 1rem;
  }

  .o_vehicle_garage .o_vehicle_garage_history_item {
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.75rem 0;
  }

  .o_vehicle_garage .o_vehicle_garage_history_label {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: calc(100% - 2rem);
    font-size: 0.9rem;
  }

  .o_vehicle_garage .o_vehicle_garage_history_actions {
    flex: 1 1 100%;
    justify-content: flex-start;
    margin-left: 1.75rem;
  }
}

/* ── Storefront cart flyout (Odoo website_sale my_cart) ───────────────────── */

.o_wsale_my_cart {
  position: relative;
  display: flex;
  align-items: center;
}

.o_wsale_my_cart__trigger {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.92);
  cursor: pointer;
}

.o_wsale_my_cart__trigger:hover,
.o_wsale_my_cart__trigger:focus-visible {
  color: #fff;
}

.o_wsale_my_cart__icon {
  display: block;
}

.o_wsale_my_cart__badge {
  position: absolute;
  top: -0.15rem;
  right: -0.2rem;
  min-width: 1.05rem;
  height: 1.05rem;
  padding: 0 0.28rem;
  border-radius: 999px;
  background: var(--nilfish-danger, #dc3545);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 700;
  line-height: 1.05rem;
  text-align: center;
}

.o_wsale_cart_flyout {
  position: absolute;
  top: calc(100% + 0.45rem);
  right: 0;
  z-index: 1060;
  width: 20.5rem;
  max-width: calc(100vw - 1.5rem);
  padding: 0.85rem 0.85rem 0.75rem;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 0.5rem;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.16);
  color: var(--nilfish-primary, #0d1b2a);
}

.o_wsale_cart_flyout::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 100%;
  height: 0.6rem;
}

.nilfish-site-nav .o_wsale_cart_flyout a {
  color: var(--nilfish-primary, #0d1b2a);
  font-weight: 500;
  opacity: 1;
}

.nilfish-site-nav .o_wsale_cart_flyout a:hover {
  color: var(--nilfish-accent, #e85d04);
  opacity: 1;
}

.o_wsale_cart_flyout__list {
  list-style: none;
  margin: 0 0 0.75rem;
  padding: 0;
  max-height: 16rem;
  overflow: auto;
}

.o_wsale_cart_flyout__row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.45rem 0;
}

.o_wsale_cart_flyout__row + .o_wsale_cart_flyout__row {
  border-top: 1px solid var(--nilfish-border, #e2e8f0);
}

.o_wsale_cart_flyout__thumb {
  position: relative;
  display: block;
  width: 3.15rem;
  height: 3.15rem;
  flex-shrink: 0;
  border-radius: 0.25rem;
  overflow: hidden;
  background: #eef2f6;
}

.o_wsale_cart_flyout__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.o_wsale_cart_flyout__thumb-empty {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #eef2f6 0%, #e7edf3 100%);
}

.o_wsale_cart_flyout__qty {
  position: absolute;
  top: -0.35rem;
  right: -0.35rem;
  min-width: 1.15rem;
  height: 1.15rem;
  padding: 0 0.28rem;
  border-radius: 999px;
  background: var(--nilfish-primary, #0d1b2a);
  color: #fff;
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1.15rem;
  text-align: center;
}

.o_wsale_cart_flyout__meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.o_wsale_cart_flyout__name {
  font-size: 0.875rem;
  line-height: 1.3;
  text-decoration: none;
  color: var(--nilfish-heading, #111827);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.o_wsale_cart_flyout__price {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--nilfish-heading, #111827);
}

.o_wsale_cart_flyout__empty {
  margin: 0 0 0.75rem;
  color: var(--nilfish-muted, #64748b);
  font-size: 0.9rem;
}

.o_wsale_cart_flyout__cta {
  display: flex;
  width: 100%;
  text-align: center;
}

.nilfish-site-nav .o_wsale_cart_flyout__cta {
  color: #fff;
}

.nilfish-site-nav .o_wsale_cart_flyout__cta:hover {
  color: #fff;
}

/* ── Storefront cart page (Odoo website_sale /shop/cart) ──────────────────── */

.o_wsale_cart {
  padding-block: 1.25rem 3rem;
}

.o_wsale_cart__steps {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem 0.15rem;
  list-style: none;
  margin: 0 0 1.15rem;
  padding: 0;
  font-size: 0.875rem;
  color: var(--nilfish-muted, #94a3b8);
}

.o_wsale_cart__steps li + li::before {
  content: "\203A"; /* › */
  margin: 0 0.55rem 0 0.4rem;
  color: var(--nilfish-muted, #cbd5e1);
  opacity: 0.75;
}

.o_wsale_cart__steps .is-current {
  color: var(--nilfish-heading, #111827);
  font-weight: 600;
}

.o_wsale_cart__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(17.5rem, 22rem);
  grid-gap: 2.5rem;
  gap: 2.5rem;
  align-items: start;
}

.o_wsale_cart__main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.o_wsale_cart__title {
  margin: 0 0 0.35rem;
  font-size: 1.45rem;
  line-height: 1.2;
  font-weight: 700;
  color: var(--nilfish-heading, #111827);
}

.o_wsale_cart__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.o_wsale_cart__row {
  display: grid;
  grid-template-columns: 4.75rem minmax(0, 1fr) auto auto;
  grid-gap: 1rem 1.15rem;
  gap: 1rem 1.15rem;
  align-items: center;
  padding: 1.15rem 0;
  border-top: 1px solid var(--nilfish-border, #e5e7eb);
}

.o_wsale_cart__row:last-child {
  border-bottom: 1px solid var(--nilfish-border, #e5e7eb);
}

.o_wsale_cart__thumb {
  display: block;
  width: 4.75rem;
  height: 4.75rem;
  border-radius: 0.35rem;
  overflow: hidden;
  background: var(--nilfish-surface-elevated, #f3f4f6);
}

.o_wsale_cart__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.o_wsale_cart__thumb-empty {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--nilfish-muted, #94a3b8) 12%, transparent) 0%,
    color-mix(in srgb, var(--nilfish-muted, #94a3b8) 22%, transparent) 100%
  );
}

.o_wsale_cart__info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.4rem;
  min-width: 0;
}

.o_wsale_cart__name {
  font-weight: 600;
  line-height: 1.3;
  text-decoration: none;
  color: var(--nilfish-heading, #111827);
}

.o_wsale_cart__name:hover {
  color: var(--nilfish-accent, #e85d04);
}

.o_wsale_cart__remove {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  align-self: flex-start;
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  font-size: 0.875rem;
  color: #b42318;
  cursor: pointer;
}

.o_wsale_cart__remove:hover {
  text-decoration: underline;
}

.o_wsale_cart__price {
  font-weight: 700;
  color: var(--nilfish-heading, #111827);
  white-space: nowrap;
  min-width: 7rem;
  text-align: right;
}

.o_wsale_cart__qty {
  display: inline-flex;
  align-items: stretch;
  border: 1px solid var(--nilfish-border, #d1d5db);
  border-radius: 0.25rem;
  background: var(--nilfish-surface-elevated, #fff);
  overflow: hidden;
}

.o_wsale_cart__qty-btn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  background: transparent;
  width: 2rem;
  font-size: 1.05rem;
  line-height: 1;
  color: #b42318;
  cursor: pointer;
}

.o_wsale_cart__qty-btn:hover {
  background: color-mix(in srgb, var(--nilfish-muted, #94a3b8) 12%, transparent);
}

.o_wsale_cart__qty-input {
  width: 2.4rem;
  border: 0;
  border-left: 1px solid var(--nilfish-border, #e5e7eb);
  border-right: 1px solid var(--nilfish-border, #e5e7eb);
  text-align: center;
  font: inherit;
  font-weight: 600;
  background: transparent;
  color: var(--nilfish-heading, #111827);
  -moz-appearance: textfield;
}

.o_wsale_cart__qty-input::-webkit-outer-spin-button,
.o_wsale_cart__qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.o_wsale_cart__suggest {
  margin-top: 2rem;
}

.o_wsale_cart__suggest-title {
  margin: 0 0 0.75rem;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--nilfish-heading, #111827);
}

.o_wsale_cart__suggest-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.o_wsale_cart__suggest-row {
  display: grid;
  grid-template-columns: 4.75rem minmax(0, 1fr) auto;
  grid-gap: 1rem 1.15rem;
  gap: 1rem 1.15rem;
  align-items: center;
  padding: 1rem 0;
  border-top: 1px solid var(--nilfish-border, #e5e7eb);
}

.o_wsale_cart__suggest-row:last-child {
  border-bottom: 1px solid var(--nilfish-border, #e5e7eb);
}

.o_wsale_cart__suggest-info {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}

.o_wsale_cart__suggest-price {
  font-weight: 600;
  color: var(--nilfish-heading, #111827);
}

.o_wsale_cart__suggest-add {
  white-space: nowrap;
  min-height: 2.5rem;
  padding-inline: 1.1rem;
}

.o_wsale_cart__summary {
  display: flex;
  flex-direction: column;
  gap: 0.95rem;
  position: -webkit-sticky;
  position: sticky;
  top: 6rem;
  color: var(--nilfish-heading, #111827);
}

.o_wsale_cart__totals {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.o_wsale_cart__total-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.95rem;
  color: var(--nilfish-heading, #111827);
}

.o_wsale_cart__total-row dt,
.o_wsale_cart__total-row dd {
  margin: 0;
}

.o_wsale_cart__total-row--grand {
  margin-top: 0.15rem;
  padding-top: 0.7rem;
  border-top: 1px solid var(--nilfish-border, #e5e7eb);
  font-size: 1.05rem;
  font-weight: 700;
}

.o_wsale_cart__promo {
  display: flex;
  align-items: stretch;
  border: 1px solid var(--nilfish-border, #d1d5db);
  border-radius: 0.25rem;
  overflow: hidden;
  background: var(--nilfish-surface-elevated, #fff);
}

.o_wsale_cart__promo-input {
  flex: 1 1;
  min-width: 0;
  border: 0;
  padding: 0.55rem 0.75rem;
  font: inherit;
  font-size: 0.9rem;
  background: transparent;
  color: var(--nilfish-heading, #111827);
}

.o_wsale_cart__promo-input::placeholder {
  color: var(--nilfish-muted, #94a3b8);
}

.o_wsale_cart__promo-input:focus {
  outline: none;
}

.o_wsale_cart__promo-btn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  border-left: 1px solid var(--nilfish-border, #d1d5db);
  background: color-mix(in srgb, var(--nilfish-muted, #94a3b8) 18%, transparent);
  color: var(--nilfish-heading, #111827);
  padding: 0 0.9rem;
  font: inherit;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.o_wsale_cart__promo-btn:hover {
  background: color-mix(in srgb, var(--nilfish-muted, #94a3b8) 28%, transparent);
}

.o_wsale_cart__promo-msg {
  margin: -0.4rem 0 0;
  font-size: 0.8rem;
  color: var(--nilfish-muted, #64748b);
}

.o_wsale_cart__checkout {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  width: 100%;
  min-height: 2.85rem;
}

.o_wsale_cart__or {
  text-align: center;
  font-size: 0.85rem;
  color: var(--nilfish-muted, #94a3b8);
  position: relative;
}

.o_wsale_cart__or::before,
.o_wsale_cart__or::after {
  content: "";
  position: absolute;
  top: 50%;
  width: calc(50% - 1.6rem);
  border-top: 1px solid #e5e7eb;
}

.o_wsale_cart__or::before {
  left: 0;
}

.o_wsale_cart__or::after {
  right: 0;
}

.o_wsale_cart__back {
  text-align: center;
  font-size: 0.9rem;
  text-decoration: none;
  color: #b42318;
}

.o_wsale_cart__back:hover {
  text-decoration: underline;
}

.o_wsale_cart__blank {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.75rem;
  max-width: 30rem;
}

@media (max-width: 900px) {
  .o_wsale_cart__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .o_wsale_cart__summary {
    position: static;
  }
}

@media (max-width: 640px) {
  .o_wsale_cart__row {
    grid-template-columns: 3.75rem minmax(0, 1fr);
  }

  .o_wsale_cart__thumb {
    width: 3.75rem;
    height: 3.75rem;
  }

  .o_wsale_cart__qty {
    grid-column: 2;
  }

  .o_wsale_cart__price {
    grid-column: 2;
    text-align: left;
    min-width: 0;
  }

  .o_wsale_cart__suggest-row {
    grid-template-columns: 3.75rem minmax(0, 1fr);
  }

  .o_wsale_cart__suggest-add {
    grid-column: 2;
    width: -moz-fit-content;
    width: fit-content;
  }
}

/* Shop product cards */
.nilfish-shop-card {
  background: #fff;
  border: 1px solid rgba(13, 27, 42, 0.08);
  border-radius: 1rem;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.nilfish-shop-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(13, 27, 42, 0.12);
  border-color: rgba(var(--nilfish-accent-rgb), 0.35);
  color: inherit;
}

.nilfish-shop-card__image {
  position: relative;
  aspect-ratio: 1 / 1;
  background: linear-gradient(180deg, #eef2f6 0%, #e7edf3 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem;
  overflow: hidden;
}

.nilfish-shop-card__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.nilfish-shop-card__body {
  padding: 1rem 1.1rem 1.15rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  text-align: left;
}

.nilfish-shop-card__brand {
  color: var(--nilfish-muted);
  font-size: 0.8rem;
}

.nilfish-shop-card__title {
  color: var(--nilfish-primary);
  font-size: 1rem;
  font-weight: 600;
  margin: 0;
  line-height: 1.3;
}

.nilfish-shop-card__price {
  color: var(--nilfish-primary);
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0.35rem 0 0;
}

/* ── Product detail (Odoo website_sale PDP) ──────────────────────────────── */

.nilfish-pdp {
  padding-top: 1.25rem;
  padding-bottom: 3rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.nilfish-pdp__breadcrumbs {
  font-size: 0.875rem;
  margin-bottom: 0;
  color: var(--nilfish-muted);
}

.nilfish-pdp__breadcrumbs a {
  color: var(--nilfish-primary);
  text-decoration: none;
  font-weight: 500;
}

.nilfish-pdp__breadcrumbs a:hover {
  text-decoration: underline;
}

/* Catalog / category + shared storefront panels */
.nilfish-catalog-page {
  padding-top: 1.25rem;
  padding-bottom: 3rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.nilfish-catalog-panel {
  background: var(--nilfish-surface, #fff);
  border: 1px solid color-mix(in srgb, var(--nilfish-muted) 22%, transparent);
  border-radius: var(--nilfish-radius-lg, 1rem);
  padding: 1.35rem 1.5rem 1.5rem;
  box-shadow: 0 1px 2px rgba(13, 27, 42, 0.04);
  min-width: 0;
  max-width: 100%;
}

.nilfish-catalog-panel--intro {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.nilfish-catalog-panel--pdp-main {
  padding: 1.75rem 1.85rem 2rem;
  border-color: color-mix(in srgb, var(--nilfish-muted) 14%, transparent);
  box-shadow: none;
  background: color-mix(in srgb, var(--nilfish-surface, #fff) 92%, var(--nilfish-bg, #f8fafc));
}

.nilfish-catalog-panel--subcats {
  padding: 1.1rem 1.25rem 1.25rem;
}

.nilfish-catalog-panel__title {
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-size: clamp(1.55rem, 2.6vw, 2.05rem);
  font-weight: 700;
  margin: 0;
  letter-spacing: -0.02em;
  line-height: 1.2;
  position: relative;
  padding-bottom: 0.55rem;
}

/* Short accent rule under category / brand H1 (both storefront skins). */
.nilfish-catalog-panel__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 3.25rem;
  height: 3px;
  border-radius: 2px;
  background: var(--nilfish-accent);
}

.nilfish-catalog-panel__body {
  margin: 0.85rem 0 0;
  max-width: 46rem;
  color: var(--nilfish-body);
  line-height: 1.55;
}

.nilfish-catalog-panel__body > :first-child {
  margin-top: 0;
}

.nilfish-catalog-panel__body > :last-child {
  margin-bottom: 0;
}

.nilfish-catalog-panel__body h2,
.nilfish-catalog-panel__body h3 {
  color: var(--nilfish-primary);
  font-size: 1.05rem;
  font-weight: 650;
  margin: 1rem 0 0.4rem;
  line-height: 1.35;
}

.nilfish-catalog-panel__body p {
  margin: 0.4rem 0 0;
}

.nilfish-catalog-panel__heading {
  color: var(--nilfish-primary);
  font-size: 1.05rem;
  font-weight: 700;
  margin: 0 0 1rem;
  letter-spacing: -0.01em;
}

.nilfish-pdp__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  grid-gap: 2rem;
  gap: 2rem;
  align-items: start;
}

@media (max-width: 900px) {
  .nilfish-pdp__grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .nilfish-catalog-panel,
  .nilfish-catalog-panel--pdp-main {
    padding: 1.1rem 1.15rem 1.25rem;
  }
}

.nilfish-pdp__title {
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 700;
  margin: 0 0 0.35rem;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

/* Short accent rule under product/vehicle PDP H1 (both storefront skins). */
.nilfish-pdp__info .nilfish-pdp__title {
  position: relative;
  margin-bottom: 0.65rem;
  padding-bottom: 0.55rem;
}

.nilfish-pdp__info .nilfish-pdp__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 3.25rem;
  height: 3px;
  border-radius: 2px;
  background: var(--nilfish-accent);
}

.nilfish-pdp__brand {
  margin: 0 0 0.35rem;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.nilfish-pdp__brand a {
  color: var(--nilfish-accent);
  text-decoration: none;
}

.nilfish-pdp__brand a:hover {
  text-decoration: underline;
}

.nilfish-brand-page__header {
  display: flex;
  gap: 1.25rem;
  align-items: center;
  flex-wrap: wrap;
}

.nilfish-brand-page__heading {
  flex: 1 1 12rem;
  min-width: 0;
}

.nilfish-brand-page__logo {
  width: 7.5rem;
  height: 7.5rem;
  object-fit: contain;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  flex: 0 0 auto;
}

.nilfish-brand-page__website {
  margin: 0.5rem 0 0;
  font-size: 0.9rem;
}

.nilfish-brand-page__website a {
  color: var(--nilfish-accent);
  text-decoration: none;
  font-weight: 500;
}

.nilfish-brand-page__website a:hover {
  text-decoration: underline;
}

.nilfish-brand-page__desc {
  white-space: pre-wrap;
  max-width: 48rem;
}

.nilfish-pdp__sku {
  color: var(--nilfish-muted);
  font-size: 0.9rem;
  margin: 0 0 0.75rem;
}

.nilfish-pdp__ribbon {
  display: inline-block;
  background: #198754;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.2rem 0.5rem;
  border-radius: 0.25rem;
  margin-bottom: 0.5rem;
}

.nilfish-pdp__desc {
  margin: 0.75rem 0 1.25rem;
  color: var(--nilfish-body);
  line-height: 1.55;
}

.nilfish-pdp__short-desc {
  margin: 0.5rem 0 0.75rem;
  color: var(--nilfish-body);
  line-height: 1.45;
  font-size: 0.95rem;
}

.nilfish-pdp__gallery {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-width: 0;
}

/* Garage fit chip — under gallery (mera FRITID-style) */
.nilfish-pdp__fit-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  max-width: 100%;
  margin: 0;
  padding: 0.45rem 0.75rem;
  border: 1px solid color-mix(in srgb, var(--nilfish-muted) 18%, transparent);
  border-radius: var(--nilfish-radius-md, 0.4rem);
  background: color-mix(in srgb, var(--nilfish-surface, #f1f3f5) 88%, var(--nilfish-border, #dee2e6));
  color: var(--nilfish-ink, #0f172a);
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.3;
}

.nilfish-pdp__fit-chip-icon {
  flex: 0 0 auto;
  color: #16a34a;
}

.nilfish-pdp__fit-chip-text {
  min-width: 0;
  overflow-wrap: anywhere;
}

.nilfish-pdp__info {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-width: 0;
}

.nilfish-pdp__info > .nilfish-pdp__brand,
.nilfish-pdp__info > .nilfish-pdp__title,
.nilfish-pdp__info > .nilfish-pdp__sku,
.nilfish-pdp__info > .nilfish-pdp__ribbon,
.nilfish-pdp__info > .nilfish-pdp__short-desc {
  margin-bottom: 0;
}

.nilfish-pdp__buy {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin: 0.25rem 0 0;
  padding: 1rem 1.1rem 1.15rem;
  border: 1px solid color-mix(in srgb, var(--nilfish-muted) 18%, transparent);
  border-radius: var(--nilfish-radius-md, 0.5rem);
  background: var(--nilfish-bg, #f8fafc);
}

@media (min-width: 901px) {
  .nilfish-pdp__buy {
    position: -webkit-sticky;
    position: sticky;
    top: calc(var(--header-height, 56px) + 0.75rem);
  }
}

.nilfish-pdp__buy .nilfish-pdp__price {
  margin: 0;
}

.nilfish-pdp__buy .nilfish-stock--in,
.nilfish-pdp__buy .nilfish-stock--out {
  margin: 0;
}

.nilfish-pdp__buy .nilfish-pdp__variants {
  margin: 0;
}

.nilfish-pdp__buy .nilfish-pdp__cta {
  margin: 0.15rem 0 0;
}

.nilfish-pdp__buy .nilfish-pdp__qty {
  background: var(--nilfish-surface, #fff);
  border-color: color-mix(in srgb, var(--nilfish-ink, #0f172a) 18%, transparent);
}

.nilfish-pdp__buy .nilfish-pdp__qty-btn:hover {
  background: color-mix(in srgb, var(--nilfish-ink, #0f172a) 6%, transparent);
}

.nilfish-pdp__trust {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1.1rem;
  margin: 0.15rem 0 0;
  padding: 0;
  list-style: none;
  color: var(--nilfish-muted, #64748b);
  font-size: 0.875rem;
}

.nilfish-pdp__trust-item {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
}

.nilfish-pdp__trust-item .nilfish-icon {
  flex: 0 0 auto;
  color: var(--nilfish-ink, #0f172a);
  opacity: 0.72;
}

.nilfish-pdp__key-specs {
  margin: 0.15rem 0 0;
  padding: 0.85rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--nilfish-muted) 16%, transparent);
}

.nilfish-pdp__key-specs-title {
  margin: 0 0 0.55rem;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-pdp__key-specs-list {
  margin: 0;
  display: grid;
  grid-gap: 0.35rem 1rem;
  gap: 0.35rem 1rem;
}

.nilfish-pdp__key-specs-list > div {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  grid-gap: 0.35rem 0.75rem;
  gap: 0.35rem 0.75rem;
  align-items: baseline;
}

.nilfish-pdp__key-specs-list dt {
  margin: 0;
  color: var(--nilfish-muted, #64748b);
  font-size: 0.85rem;
  font-weight: 500;
}

.nilfish-pdp__key-specs-list dd {
  margin: 0;
  color: var(--nilfish-ink, #0f172a);
  font-size: 0.9rem;
  font-weight: 600;
}

.nilfish-pdp__read-more {
  display: inline-flex;
  align-items: center;
  margin: 0.1rem 0 0;
  color: var(--nilfish-ink, #0f172a);
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.nilfish-pdp__read-more:hover {
  color: var(--nilfish-accent);
}

.nilfish-pdp__brand-about {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-gap: 1.15rem 1.5rem;
  gap: 1.15rem 1.5rem;
  align-items: start;
  padding: 1.35rem 1.4rem 1.5rem;
  border: 1px solid color-mix(in srgb, var(--nilfish-muted) 16%, transparent);
  border-radius: var(--nilfish-radius-lg, 0.75rem);
  background: var(--nilfish-surface, #fff);
}

.nilfish-pdp__brand-about--text-only {
  grid-template-columns: minmax(0, 1fr);
}

.nilfish-pdp__brand-about-logo {
  width: 5.5rem;
  height: 5.5rem;
  object-fit: contain;
  flex: 0 0 auto;
}

.nilfish-pdp__brand-about-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.nilfish-pdp__brand-about-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--nilfish-heading, var(--nilfish-ink, #0f172a));
  letter-spacing: -0.01em;
}

.nilfish-pdp__brand-about-text {
  margin: 0;
  color: var(--nilfish-body);
  line-height: 1.5;
  font-size: 0.95rem;
  white-space: pre-wrap;
}

.nilfish-pdp__brand-about-link {
  align-self: start;
  margin-top: 0.15rem;
  color: var(--nilfish-ink, #0f172a);
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.nilfish-pdp__brand-about-link:hover {
  color: var(--nilfish-accent);
}

@media (max-width: 560px) {
  .nilfish-pdp__brand-about {
    grid-template-columns: 1fr;
  }

  .nilfish-pdp__brand-about-logo {
    width: 4.5rem;
    height: 4.5rem;
  }
}

.nilfish-pdp__section {
  margin-top: 0;
}

.nilfish-pdp__section-title {
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 0.75rem;
  color: var(--nilfish-primary);
}

.nilfish-pdp__specs th {
  text-align: left;
  font-weight: 600;
  padding-right: 1.5rem;
  white-space: nowrap;
  width: 40%;
}

.nilfish-pdp__variants {
  margin: 0.75rem 0 1rem;
}

.nilfish-pdp__variant-row {
  margin-bottom: 0.65rem;
}

.nilfish-pdp__variants-label {
  margin: 0 0 0.35rem;
  font-size: 0.85rem;
  font-weight: 600;
}

.nilfish-pdp__variant-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.nilfish-pdp__variant-chip {
  display: inline-block;
  padding: 0.35rem 0.7rem;
  border: 1px solid var(--nilfish-border, #ccc);
  border-radius: var(--nilfish-radius-md, 6px);
  text-decoration: none;
  color: inherit;
  font-size: 0.9rem;
  background: var(--nilfish-surface, #fff);
}

.nilfish-pdp__variant-chip.is-active {
  border-color: var(--nilfish-accent, #e85d04);
  background: var(--nilfish-bg, #f8fafc);
  font-weight: 600;
}

.nilfish-pdp__buy .nilfish-pdp__variant-chip.is-active {
  background: var(--nilfish-bg, #f8fafc);
}

[data-storefront-skin="plasma"] .nilfish-pdp__buy .nilfish-pdp__variant-chip.is-active,
[data-storefront-skin="plasma"] .nilfish-pdp__variant-chip.is-active {
  background: var(--nilfish-surface-elevated, #1a1a22);
}

.nilfish-subcats {
  margin: 0;
}

.nilfish-subcats__title {
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 1rem;
}

.nilfish-subcats__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
  grid-gap: 0.85rem;
  gap: 0.85rem;
}

.nilfish-subcats__card {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  text-align: center;
  text-decoration: none;
  color: inherit;
  padding: 0;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--nilfish-muted) 28%, transparent);
  border-radius: var(--nilfish-radius-md, 8px);
  background: color-mix(in srgb, var(--nilfish-surface, #fff) 88%, var(--nilfish-muted) 12%);
  min-width: 0;
  transition: border-color 0.15s ease;
}

.nilfish-subcats__card:hover {
  border-color: color-mix(in srgb, var(--nilfish-accent, #e85d04) 45%, transparent);
  transform: translateY(-2px);
}

.nilfish-subcats__card--active {
  border-color: var(--nilfish-accent, #e85d04);
  box-shadow: 0 0 0 1px var(--nilfish-accent, #e85d04);
}

.nilfish-subcats__image--all {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--nilfish-muted);
  background: color-mix(in srgb, var(--nilfish-muted) 12%, transparent);
}

.nilfish-subcats__image {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 0;
}

/* Inactive chips: darken image (works on light + plasma; filter alone was too subtle on standard). */
.nilfish-subcats__card:not(.nilfish-subcats__card--active) .nilfish-subcats__image::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: rgba(15, 23, 42, 0.48);
  transition: background 0.15s ease;
}

.nilfish-subcats__card:not(.nilfish-subcats__card--active):hover .nilfish-subcats__image::after {
  background: rgba(15, 23, 42, 0.3);
}

.nilfish-subcats__card:not(.nilfish-subcats__card--active) .nilfish-subcats__image img {
  filter: brightness(0.72) saturate(0.9);
}

.nilfish-subcats__card--active .nilfish-subcats__image img {
  filter: none;
}

.nilfish-subcats__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.nilfish-subcats__name {
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.3;
  padding: 0.65rem 0.5rem 0.75rem;
}

.nilfish-pdp__price {
  color: var(--nilfish-primary);
  font-size: 1.65rem;
  font-weight: 700;
  margin: 0 0 0.25rem;
}

.nilfish-pdp__price-campaign {
  color: var(--nilfish-accent, #e85d04);
}

.nilfish-pdp__price-list {
  font-size: 0.95rem;
  font-weight: 500;
  text-decoration: line-through;
  color: var(--nilfish-muted);
}

.nilfish-pdp__price-hint {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--nilfish-muted);
}

.nilfish-pdp__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: stretch;
  margin: 1rem 0;
}

.nilfish-pdp__qty {
  display: inline-flex;
  align-items: stretch;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  background: #fff;
  overflow: hidden;
  min-width: 8.5rem;
}

.nilfish-pdp__qty-btn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  background: transparent;
  width: 2.5rem;
  cursor: pointer;
  font-size: 1.1rem;
  color: var(--nilfish-primary);
}

.nilfish-pdp__qty-btn:hover {
  background: var(--nilfish-bg-light);
}

.nilfish-pdp__qty-input {
  width: 3rem;
  border: 0;
  border-left: 1px solid var(--nilfish-border);
  border-right: 1px solid var(--nilfish-border);
  text-align: center;
  font: inherit;
  font-weight: 600;
  -moz-appearance: textfield;
}

.nilfish-pdp__qty-input::-webkit-outer-spin-button,
.nilfish-pdp__qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.nilfish-pdp__add {
  flex: 1 1 12rem;
  min-height: 2.75rem;
}

.nilfish-pdp__fitment-link {
  display: inline-block;
  color: var(--nilfish-accent);
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none;
  margin-bottom: 1.25rem;
}

.nilfish-pdp__fitment-link:hover {
  text-decoration: underline;
}

.nilfish-pdp__compat-title {
  color: var(--nilfish-heading, var(--nilfish-primary));
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 0.5rem;
}

.nilfish-pdp__compat-groups {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.nilfish-pdp__compat-group + .nilfish-pdp__compat-group {
  margin-top: 0.85rem;
  padding-top: 0.85rem;
  border-top: 1px solid color-mix(in srgb, var(--nilfish-body, #334) 18%, transparent);
}

.nilfish-pdp__compat-catalog {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0 0 0.35rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--nilfish-heading, var(--nilfish-primary));
  line-height: 1.3;
}

.nilfish-pdp__compat-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  color: var(--nilfish-body);
  font-size: 0.9rem;
  line-height: 1.45;
}

.nilfish-pdp__compat-item {
  display: block;
  padding-left: 0.1rem;
}

.nilfish-pdp__compat-item--fade {
  -webkit-mask-image: linear-gradient(180deg, #000 8%, transparent 92%);
  mask-image: linear-gradient(180deg, #000 8%, transparent 92%);
  opacity: 0.85;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.nilfish-pdp__compat-fade-hit {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.nilfish-pdp__compat-clip {
  position: relative;
}

.nilfish-pdp__compat-more {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15rem;
  width: 100%;
  margin: 0.15rem 0 0;
  padding: 0.55rem 0.75rem 0.35rem;
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--nilfish-accent, #e85d04);
  line-height: 1.3;
}

.nilfish-pdp__compat-more:hover,
.nilfish-pdp__compat-more:focus-visible {
  text-decoration: underline;
  outline: none;
}

.nilfish-pdp__compat-more--collapse {
  margin-top: 0.75rem;
  color: var(--nilfish-body);
  font-weight: 500;
  opacity: 0.85;
}

.nilfish-pdp__compat-more-chevron {
  font-size: 1rem;
  line-height: 1;
  opacity: 0.9;
}

.nilfish-pdp__compat-icon {
  flex: 0 0 auto;
  color: var(--nilfish-heading, var(--nilfish-primary));
  opacity: 0.9;
}

.nilfish-vehicle-pdp__specs {
  margin: 0;
  display: grid;
  grid-gap: 0.35rem 1rem;
  gap: 0.35rem 1rem;
}

.nilfish-vehicle-pdp__spec-row {
  display: grid;
  grid-template-columns: minmax(7rem, 38%) 1fr;
  grid-gap: 0.5rem;
  gap: 0.5rem;
  font-size: 0.9rem;
}

.nilfish-vehicle-pdp__spec-row dt {
  margin: 0;
  font-weight: 600;
  color: var(--nilfish-primary);
}

.nilfish-vehicle-pdp__spec-row dd {
  margin: 0;
}

.nilfish-vehicle-pdp__header-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin: 0.35rem 0 0.85rem;
  font-size: 0.9rem;
}

.nilfish-vehicle-pdp__badge {
  display: inline-block;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--nilfish-primary, #0d1b2a) 12%, #fff);
  color: var(--nilfish-primary, #0d1b2a);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.nilfish-vehicle-pdp__spec-list {
  list-style: none;
  margin: 0.85rem 0 0;
  padding: 0;
  font-size: 0.9rem;
  line-height: 1.55;
}

.nilfish-vehicle-pdp__spec-list li + li {
  margin-top: 0.2rem;
}

.nilfish-vehicle-pdp__equipment {
  margin-top: 1.15rem;
  font-size: 0.9rem;
}

.nilfish-vehicle-pdp__section {
  margin-top: 1.5rem;
}

.nilfish-vehicle-pdp__hint {
  margin: 0.15rem 0 0.45rem;
  font-size: 0.875rem;
}

.nilfish-vehicle-pdp__accessories {
  list-style: none;
  margin: 0.75rem 0 0;
  padding: 0;
  display: grid;
  grid-gap: 0.65rem;
  gap: 0.65rem;
}

.nilfish-vehicle-pdp__accessory {
  display: grid;
  grid-template-columns: 3.5rem 1fr auto;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  align-items: center;
}

.nilfish-vehicle-pdp__accessory-media {
  width: 3.5rem;
  height: 3.5rem;
  overflow: hidden;
  background: var(--nilfish-surface, #f1f5f9);
}

.nilfish-vehicle-pdp__accessory-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.nilfish-vehicle-pdp__accessory-body {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  font-size: 0.9rem;
}

.nilfish-vehicle-pdp__accessory-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

@media (min-width: 640px) {
  .nilfish-vehicle-pdp__accessory-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .nilfish-vehicle-pdp__accessory-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.nilfish-vehicle-pdp__alt-card {
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--nilfish-border, #e2e8f0);
  border-radius: var(--nilfish-radius-md, 0.5rem);
  background: #fff;
  overflow: hidden;
  box-shadow: var(--nilfish-shadow-card, 0 1px 2px rgb(0 0 0 / 0.04));
}

.nilfish-vehicle-pdp__alt-card.is-selected {
  border-color: color-mix(in srgb, var(--nilfish-accent, #e85d04) 55%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--nilfish-accent, #e85d04) 35%, transparent);
}

.nilfish-vehicle-pdp__alt-toggle {
  position: absolute;
  top: 0.4rem;
  right: 0.4rem;
  z-index: 1;
  width: 1.85rem;
  height: 1.85rem;
  border: none;
  border-radius: 999px;
  background: var(--nilfish-accent, #e85d04);
  color: #fff;
  font-size: 1.1rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 3px rgb(0 0 0 / 0.18);
}

.nilfish-vehicle-pdp__alt-card.is-selected .nilfish-vehicle-pdp__alt-toggle {
  background: var(--nilfish-primary, #0d1b2a);
}

.nilfish-vehicle-pdp__alt-media {
  aspect-ratio: 1 / 1;
  background: var(--nilfish-bg-light, #f8fafc);
  overflow: hidden;
}

.nilfish-vehicle-pdp__alt-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.nilfish-vehicle-pdp__alt-body {
  padding: 0.5rem 0.6rem 0.65rem;
  font-size: 0.8rem;
}

.nilfish-vehicle-pdp__alt-name {
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 0.15rem;
}

.nilfish-financing-calculator {
  background: color-mix(in srgb, var(--nilfish-primary, #0d1b2a) 6%, #fff);
  border: 1px solid color-mix(in srgb, var(--nilfish-primary, #0d1b2a) 18%, transparent);
  border-radius: var(--nilfish-radius-md, 0.5rem);
  padding: 0.75rem 0.95rem;
}

.nilfish-financing-calculator__monthly {
  color: var(--nilfish-primary, #0d1b2a);
  line-height: 1.1;
  margin: 0.15rem 0 0.1rem;
}

.nilfish-financing-calculator__monthly-value {
  font-size: clamp(1.75rem, 3vw, 2.35rem);
  font-weight: 700;
}

.nilfish-financing-calculator__accessories-label {
  margin: 0 0 0.45rem;
  font-size: 0.8rem;
  line-height: 1.2;
}

.nilfish-financing-calculator__meta {
  list-style: none;
  margin: 0.4rem 0 0;
  padding: 0;
  font-size: 0.875rem;
  line-height: 1.35;
}

.nilfish-financing-calculator__meta li + li {
  margin-top: 0.08rem;
}

.nilfish-financing-calculator__terms {
  margin-top: 0.5rem;
  padding-top: 0.45rem;
  border-top: 1px solid color-mix(in srgb, currentColor 12%, transparent);
}

.nilfish-financing-calculator__terms-title {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 0.25rem;
}

/* Konsumentverket-style credit warning (mandatory SE consumer finance notice) */
.nilfish-financing-calculator__borrow-warning {
  display: flex;
  gap: 0.4rem;
  align-items: flex-start;
  margin: 0.45rem 0 0;
  font-size: 0.68rem;
  line-height: 1.35;
  color: color-mix(in srgb, currentColor 68%, transparent);
}

.nilfish-financing-calculator__borrow-warning-icon {
  flex-shrink: 0;
  display: inline-flex;
  margin-top: 0.12rem;
  line-height: 0;
}

.nilfish-financing-calculator__borrow-warning strong {
  font-weight: 700;
  color: inherit;
}

.nilfish-vehicle-pdp__field {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
}

.nilfish-vehicle-pdp__field input,
.nilfish-vehicle-pdp__field select,
.nilfish-vehicle-pdp__field textarea {
  font: inherit;
  padding: 0.45rem 0.6rem;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  background: #fff;
}

.nilfish-vehicle-pdp__field input[type="range"] {
  padding: 0;
  border: none;
  background: transparent;
  accent-color: var(--nilfish-accent, #e85d04);
}

.nilfish-vehicle-pdp__check {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0.5rem 0 0.75rem;
  font-size: 0.9rem;
}

.nilfish-vehicle-pdp__trade-in {
  display: grid;
  grid-gap: 0.5rem;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
  padding: 0.75rem;
  background: #f7f9fb;
  border-radius: 6px;
}

@media (min-width: 640px) {
  .nilfish-vehicle-pdp__trade-in,
  .nilfish-vehicle-pdp__quote-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.nilfish-vehicle-pdp__quote-grid {
  display: grid;
  grid-gap: 0.5rem;
  gap: 0.5rem;
}

.nilfish-vehicle-pdp__quote .btn-nilfish-primary {
  margin-top: 0.25rem;
}

.nilfish-vehicle-quote-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(13, 27, 42, 0.45);
}

.nilfish-vehicle-quote-modal {
  width: min(32rem, 100%);
  max-height: min(90vh, 40rem);
  overflow: auto;
  padding: 1.25rem;
  border-radius: 8px;
  background: var(--nilfish-surface, #fff);
  color: var(--nilfish-text, #0d1b2a);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
}

.nilfish-vehicle-quote-modal__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.nilfish-vehicle-quote-modal__head .nilfish-pdp__compat-title {
  margin: 0;
}

.nilfish-vehicle-quote-modal__body {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.nilfish-hp-field {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.nilfish-pdp__related {
  margin-top: 1rem;
}

.nilfish-pdp__related.nilfish-catalog-panel {
  margin-top: 0;
}

.nilfish-pdp__related-title {
  color: var(--nilfish-primary);
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 0.75rem;
}

.nilfish-pdp__related-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
}

.nilfish-pdp__related-card {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  border: 1px solid var(--nilfish-border, #dee2e6);
  border-radius: 4px;
  padding: 0.65rem;
  background: #fff;
}

.nilfish-pdp__related-thumb {
  display: block;
  aspect-ratio: 1;
  overflow: hidden;
  background: #f8f9fa;
}

.nilfish-pdp__related-thumb img,
.nilfish-pdp__related-thumb-empty {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.nilfish-pdp__related-info {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.nilfish-pdp__related-name {
  color: var(--nilfish-primary);
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  line-height: 1.3;
}

.nilfish-pdp__related-name:hover {
  text-decoration: underline;
}

.nilfish-pdp__related-price {
  font-size: 0.875rem;
  font-weight: 600;
}

/* Nop-style “You may also like” — 3 horizontal cards, theme-aware */
.nilfish-pdp__also-like {
  margin-top: 2rem;
  padding: 1.75rem 1.25rem 2rem;
  border-radius: var(--nilfish-radius-lg, 0.75rem);
  background: color-mix(in srgb, var(--nilfish-surface, #f1f3f5) 88%, var(--nilfish-border, #dee2e6));
}

.nilfish-pdp__also-like-title {
  margin: 0 0 1.25rem;
  text-align: center;
  font-size: clamp(1.05rem, 2.2vw, 1.35rem);
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--nilfish-heading, var(--nilfish-primary, #0d1b2a));
}

.nilfish-pdp__also-like-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  grid-template-columns: 1fr;
}

@media (min-width: 720px) {
  .nilfish-pdp__also-like-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.nilfish-pdp__also-like-card {
  display: grid;
  grid-template-columns: minmax(5.5rem, 38%) 1fr;
  grid-gap: 0.85rem;
  gap: 0.85rem;
  min-width: 0;
  padding: 0.85rem;
  border-radius: var(--nilfish-radius-md, 0.5rem);
  border: 1px solid var(--nilfish-border, #dee2e6);
  background: var(--nilfish-card-bg, var(--nilfish-white, #fff));
  box-shadow: var(--nilfish-shadow-card, 0 1px 2px rgba(0, 0, 0, 0.04));
}

.nilfish-pdp__also-like-thumb {
  display: block;
  align-self: center;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: calc(var(--nilfish-radius-md, 0.5rem) - 2px);
  background: color-mix(in srgb, var(--nilfish-surface, #f8f9fa) 70%, transparent);
}

.nilfish-pdp__also-like-thumb img,
.nilfish-pdp__also-like-thumb-empty {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.nilfish-pdp__also-like-body {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
}

.nilfish-pdp__also-like-name {
  color: var(--nilfish-heading, var(--nilfish-primary, #0d1b2a));
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.25;
}

.nilfish-pdp__also-like-name:hover {
  text-decoration: underline;
}

.nilfish-pdp__also-like-price {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--nilfish-accent, #2a9d8f);
}

.nilfish-pdp__also-like-blurb {
  margin: 0;
  flex: 1 1 auto;
  font-size: 0.8rem;
  line-height: 1.4;
  color: var(--nilfish-muted, #6c757d);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.nilfish-pdp__also-like-cta {
  align-self: flex-start;
  margin-top: 0.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.45rem 0.85rem;
  border-radius: 0.35rem;
  background: var(--nilfish-accent, #2a9d8f);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.2;
}

.nilfish-pdp__also-like-cta:hover {
  filter: brightness(1.08);
  color: #fff;
}

[data-storefront-skin="plasma"] .nilfish-pdp__also-like {
  background: color-mix(in srgb, var(--nilfish-surface) 85%, #000);
  border: 1px solid var(--nilfish-border);
}

[data-storefront-skin="plasma"] .nilfish-pdp__also-like-title {
  color: var(--nilfish-heading);
}

[data-storefront-skin="plasma"] .nilfish-pdp__also-like-card {
  background: var(--nilfish-surface-elevated, #1a1a22);
  border-color: var(--nilfish-border);
  box-shadow: var(--nilfish-shadow-card);
}

[data-storefront-skin="plasma"] .nilfish-pdp__also-like-thumb {
  background: rgba(255, 255, 255, 0.04);
}

[data-storefront-skin="plasma"] .nilfish-pdp__also-like-name {
  color: var(--nilfish-heading);
}

[data-storefront-skin="plasma"] .nilfish-pdp__also-like-blurb {
  color: var(--nilfish-muted);
}

[data-storefront-skin="plasma"] .nilfish-pdp__also-like-price {
  color: var(--nilfish-accent, #5eead4);
}

[data-storefront-skin="plasma"] .nilfish-catalog-panel--pdp-main {
  background: color-mix(in srgb, var(--nilfish-surface) 92%, #000);
  border-color: var(--nilfish-border);
  box-shadow: none;
}

[data-storefront-skin="plasma"] .nilfish-pdp__buy {
  background: var(--nilfish-surface-elevated, #1a1a22);
  border-color: var(--nilfish-border);
}

[data-storefront-skin="plasma"] .nilfish-pdp__buy .nilfish-pdp__qty {
  background: color-mix(in srgb, var(--nilfish-surface) 80%, #000);
  border-color: var(--nilfish-border);
}

[data-storefront-skin="plasma"] .nilfish-pdp__buy .nilfish-pdp__qty-btn {
  color: var(--nilfish-heading);
}

[data-storefront-skin="plasma"] .nilfish-pdp__buy .nilfish-pdp__qty-btn:hover {
  background: rgba(255, 255, 255, 0.06);
}

[data-storefront-skin="plasma"] .nilfish-pdp__buy .nilfish-pdp__qty-input {
  color: var(--nilfish-heading);
  background: transparent;
  border-color: var(--nilfish-border);
}

[data-storefront-skin="plasma"] .nilfish-pdp__trust {
  color: var(--nilfish-muted);
}

[data-storefront-skin="plasma"] .nilfish-pdp__trust-item .nilfish-icon {
  color: var(--nilfish-heading);
  opacity: 0.85;
}

[data-storefront-skin="plasma"] .nilfish-pdp__key-specs {
  border-top-color: var(--nilfish-border);
}

[data-storefront-skin="plasma"] .nilfish-pdp__key-specs-title,
[data-storefront-skin="plasma"] .nilfish-pdp__key-specs-list dt {
  color: var(--nilfish-muted);
}

[data-storefront-skin="plasma"] .nilfish-pdp__key-specs-list dd {
  color: var(--nilfish-heading);
}

[data-storefront-skin="plasma"] .nilfish-pdp__read-more {
  color: var(--nilfish-heading);
}

[data-storefront-skin="plasma"] .nilfish-pdp__read-more:hover {
  color: var(--nilfish-accent, #5eead4);
}

[data-storefront-skin="plasma"] .nilfish-pdp__brand-about {
  background: var(--nilfish-surface-elevated, #1a1a22);
  border-color: var(--nilfish-border);
}

[data-storefront-skin="plasma"] .nilfish-pdp__brand-about-title,
[data-storefront-skin="plasma"] .nilfish-pdp__brand-about-link {
  color: var(--nilfish-heading);
}

[data-storefront-skin="plasma"] .nilfish-pdp__brand-about-text {
  color: var(--nilfish-body, var(--nilfish-muted));
}

[data-storefront-skin="plasma"] .nilfish-pdp__brand-about-link:hover {
  color: var(--nilfish-accent, #5eead4);
}

[data-storefront-skin="plasma"] .nilfish-pdp__fit-chip {
  background: var(--nilfish-surface-elevated, #1a1a22);
  border-color: var(--nilfish-border);
  color: var(--nilfish-heading);
}

[data-storefront-skin="plasma"] .nilfish-pdp__fit-chip-icon {
  color: #4ade80;
}

[data-color-scheme="dark"] .nilfish-site .nilfish-pdp__also-like,
html[data-color-scheme="dark"] .nilfish-site .nilfish-pdp__also-like {
  background: color-mix(in srgb, var(--nilfish-surface, #1a1a22) 90%, #000);
}

[data-color-scheme="dark"] .nilfish-site .nilfish-pdp__also-like-card,
html[data-color-scheme="dark"] .nilfish-site .nilfish-pdp__also-like-card {
  background: var(--nilfish-card-bg, var(--nilfish-surface-elevated, #22222c));
  border-color: var(--nilfish-border, rgba(255, 255, 255, 0.12));
}

[data-color-scheme="dark"] .nilfish-site .nilfish-pdp__also-like-name,
html[data-color-scheme="dark"] .nilfish-site .nilfish-pdp__also-like-name,
[data-color-scheme="dark"] .nilfish-site .nilfish-pdp__also-like-title,
html[data-color-scheme="dark"] .nilfish-site .nilfish-pdp__also-like-title {
  color: var(--nilfish-heading, #f4f4f7);
}

/* Staff edit bar (ITID-style) */
.nilfish-staff-bar {
  background: #e9ecef;
  color: #212529;
  font-size: 0.8125rem;
  padding: 0.35rem 1.25rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  border-bottom: 1px solid #dee2e6;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1100;
}

.nilfish-staff-bar a {
  color: #0d6efd;
  text-decoration: none;
  font-weight: 500;
}

.nilfish-staff-bar a:hover {
  text-decoration: underline;
}

/* Unpublished storefront / master site (Configure → Website → Published off) */
.nilfish-storefront-closed {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 1.25rem;
  background: var(--nilfish-bg, #f7f7f5);
  color: var(--nilfish-heading, var(--nilfish-primary, #0d1b2a));
}

.nilfish-storefront-closed__body {
  max-width: 40rem;
  width: 100%;
  text-align: center;
}

/* Homepage slideshow */
.nilfish-slideshow {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: var(--nilfish-primary);
  min-height: clamp(220px, 42vh, 480px);
}

.nilfish-slideshow__track {
  position: relative;
  width: 100%;
  height: clamp(220px, 42vh, 480px);
}

.nilfish-slideshow__slide {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.nilfish-slideshow--fade .nilfish-slideshow__slide {
  opacity: 0;
  transition: opacity 0.45s ease;
}

.nilfish-slideshow--fade .nilfish-slideshow__slide.is-active {
  opacity: 1;
  pointer-events: auto;
  z-index: 1;
}

.nilfish-slideshow--slide .nilfish-slideshow__slide {
  opacity: 1;
  transform: translateX(100%);
  transition: transform 0.45s ease;
}

.nilfish-slideshow--slide .nilfish-slideshow__slide.is-prev {
  transform: translateX(-100%);
}

.nilfish-slideshow--slide .nilfish-slideshow__slide.is-active {
  transform: translateX(0);
  pointer-events: auto;
  z-index: 1;
}

.nilfish-slideshow__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.nilfish-slideshow__caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 1.5rem 2rem;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.55));
  color: #fff;
  z-index: 2;
}

.nilfish-slideshow__caption h2 {
  margin: 0 0 0.25rem;
  font-size: clamp(1.25rem, 3vw, 1.75rem);
}

.nilfish-slideshow__caption p {
  margin: 0;
  opacity: 0.9;
}

.nilfish-slideshow__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  cursor: pointer;
  font-size: 1.25rem;
  line-height: 1;
}

.nilfish-slideshow__nav--prev {
  left: 0.75rem;
}

.nilfish-slideshow__nav--next {
  right: 0.75rem;
}

.nilfish-slideshow__dots {
  position: absolute;
  bottom: 0.75rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  gap: 0.4rem;
}

.nilfish-slideshow__dot {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 999px;
  border: 0;
  background: rgba(255, 255, 255, 0.45);
  cursor: pointer;
  padding: 0;
}

.nilfish-slideshow__dot.is-active {
  background: #fff;
}

.nilfish-custom-css-input {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.8125rem;
  min-height: 12rem;
  width: 100%;
}

/* Configure → Website — homepage section cards (ERP form, not public .nilfish-home) */
.nilfish-home-section-editor {
  border: 1px solid var(--nilfish-border);
  border-radius: 0.75rem;
  padding: 0.75rem 1rem;
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
}

.nilfish-home-section-editor.is-selected {
  border-color: var(--nilfish-accent);
  box-shadow: 0 0 0 1px var(--nilfish-accent);
}

.nilfish-home-section-editor__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.nilfish-drag-handle {
  cursor: -webkit-grab;
  cursor: grab;
  touch-action: none;
  color: var(--nilfish-muted, #6b7280);
}

.nilfish-drag-handle:active:not(:disabled) {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.nilfish-drag-handle:disabled {
  cursor: default;
  opacity: 0.4;
}

[data-dragging="true"] {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

html[data-color-scheme="dark"] [data-dragging="true"] {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}

.nilfish-home-section-editor__title {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  flex: 1 1 8rem;
  min-width: 0;
  margin: 0;
  padding: 0.35rem 0;
  border: none;
  background: transparent;
  color: var(--nilfish-heading, var(--nilfish-primary));
  font: inherit;
  font-weight: 700;
  font-size: 0.95rem;
  text-align: left;
  cursor: pointer;
}

.nilfish-home-section-editor__title:hover,
.nilfish-home-section-editor__title:focus-visible {
  color: var(--nilfish-accent);
  outline: none;
}

.nilfish-home-section-editor__body {
  margin-top: 0.75rem;
}

.nilfish-home-section-editor__body .nilfish-locale-tabs {
  margin-top: 0;
}

/* Website customizer (ERP) */
.nilfish-website-customizer {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-height: calc(100vh - 8rem);
}

.nilfish-website-customizer__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

.nilfish-website-customizer__body {
  display: grid;
  grid-template-columns: minmax(280px, 380px) 1fr;
  grid-gap: 1rem;
  gap: 1rem;
  min-height: 70vh;
  align-items: stretch;
}

@media (max-width: 960px) {
  .nilfish-website-customizer__body {
    grid-template-columns: 1fr;
  }
}

.nilfish-website-customizer__sidebar {
  overflow: auto;
  max-height: calc(100vh - 10rem);
  padding-right: 0.25rem;
}

.nilfish-website-customizer__preview {
  border: 1px solid var(--nilfish-border, #e2e8f0);
  border-radius: 0.75rem;
  overflow: hidden;
  background: #0f172a;
  min-height: 480px;
}

.nilfish-website-customizer__iframe {
  width: 100%;
  height: 100%;
  min-height: 70vh;
  border: 0;
  background: #fff;
}

/* Website visual studio (Fas 1) */
.nilfish-website-studio {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  min-height: calc(100vh - 7.5rem);
  min-width: 0;
}

.nilfish-website-studio__chrome {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.nilfish-website-studio__docs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}

.nilfish-website-studio__doc {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  border: 1px solid var(--nilfish-border, #e2e8f0);
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  color: inherit;
  font-size: 0.78rem;
  text-decoration: none;
  line-height: 1.3;
}

.nilfish-website-studio__doc:hover {
  border-color: color-mix(in srgb, var(--nilfish-accent) 45%, var(--nilfish-border, #e2e8f0));
}

.nilfish-website-studio__doc--on {
  border-color: var(--nilfish-accent);
  background: color-mix(in srgb, var(--nilfish-accent) 12%, transparent);
  font-weight: 600;
}

.nilfish-website-studio__chrome-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.nilfish-website-studio__segment {
  display: inline-flex;
  border: 1px solid var(--nilfish-border, #e2e8f0);
  border-radius: 0.5rem;
  overflow: hidden;
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
}

.nilfish-website-studio__seg {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  background: transparent;
  padding: 0.35rem 0.65rem;
  font: inherit;
  font-size: 0.8125rem;
  color: var(--nilfish-muted, #6b7280);
  cursor: pointer;
}

.nilfish-website-studio__seg--on {
  background: var(--nilfish-accent);
  color: #fff;
}

.nilfish-website-studio__body {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 280px;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  min-height: 70vh;
  min-width: 0;
  align-items: stretch;
}

/* Let library + canvas stay body grid children under DndContext */
.nilfish-website-studio__dnd {
  display: contents;
}

@media (max-width: 1100px) {
  .nilfish-website-studio__body {
    grid-template-columns: 200px minmax(0, 1fr);
  }

  .nilfish-website-studio__inspector {
    grid-column: 1 / -1;
    max-height: 280px;
  }
}

@media (max-width: 720px) {
  .nilfish-website-studio__body {
    grid-template-columns: 1fr;
  }
}

.nilfish-website-studio__library,
.nilfish-website-studio__inspector {
  overflow: auto;
  max-height: calc(100vh - 11rem);
  padding: 0.65rem;
  border: 1px solid var(--nilfish-border, #e2e8f0);
  border-radius: 0.75rem;
  background: var(--nilfish-surface-elevated, var(--nilfish-white));
  min-width: 0;
}

.nilfish-website-studio__inspector-title {
  margin: 0 0 0.65rem;
  font-size: 0.95rem;
}

.nilfish-website-studio__lib-group {
  margin-top: 0.75rem;
}

.nilfish-website-studio__lib-tag {
  margin: 0 0 0.35rem;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--nilfish-muted, #6b7280);
}

.nilfish-website-studio__lib-cards {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.nilfish-website-studio__lib-card {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.1rem;
  width: 100%;
  text-align: left;
  padding: 0.5rem 0.6rem;
  border: 1px solid var(--nilfish-border, #e2e8f0);
  border-radius: 0.5rem;
  background: var(--nilfish-surface, #f8fafc);
  cursor: pointer;
  font: inherit;
}

.nilfish-website-studio__lib-card:hover:not(:disabled) {
  border-color: var(--nilfish-accent);
}

.nilfish-website-studio__lib-card:disabled {
  opacity: 0.5;
  cursor: default;
}

.nilfish-website-studio__lib-card.is-dragging {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.nilfish-website-studio__lib-card--overlay {
  width: 200px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.18);
  cursor: -webkit-grabbing;
  cursor: grabbing;
  pointer-events: none;
}

.nilfish-website-studio__lib-card-title {
  font-weight: 600;
  font-size: 0.85rem;
  color: var(--nilfish-heading, var(--nilfish-primary));
}

.nilfish-website-studio__canvas-wrap {
  min-width: 0;
  overflow: auto;
  max-height: calc(100vh - 11rem);
  padding: 0.75rem;
  border: 1px solid var(--nilfish-border, #e2e8f0);
  border-radius: 0.75rem;
  background: #0f172a;
  display: flex;
  justify-content: center;
  /* Grow with page content so wrap scrolls — do not stretch+clip the canvas */
  align-items: flex-start;
}

.nilfish-website-studio__canvas {
  width: 100%;
  min-height: 60vh;
  background: var(--nilfish-bg-light, #fff);
  color: var(--nilfish-body, #0f172a);
  border-radius: 0.35rem;
  overflow: visible;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
  transition: max-width 0.2s ease;
}

.nilfish-website-studio__empty {
  padding: 2rem 1rem;
  text-align: center;
}

.nilfish-website-studio__block {
  position: relative;
}

.nilfish-website-studio__block.is-selected {
  outline: 2px solid var(--nilfish-accent);
  outline-offset: -2px;
  z-index: 2;
}

.nilfish-website-studio__block.is-disabled {
  opacity: 0.55;
}

.nilfish-website-studio__block--footer {
  margin-top: 0.75rem;
  cursor: pointer;
}

.nilfish-website-studio__block--footer .nilfish-site-footer {
  pointer-events: none;
}

.nilfish-website-studio__block--locked {
  margin-top: 0.5rem;
  outline: 1px dashed color-mix(in srgb, var(--nilfish-muted, #94a3b8) 55%, transparent);
  outline-offset: -1px;
  pointer-events: auto;
}

.nilfish-website-studio__toolbar--locked {
  background: rgba(51, 65, 85, 0.92);
  cursor: default;
}

.nilfish-website-studio__legal-body {
  padding: 1rem 1.25rem 1.5rem;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.nilfish-website-studio__block-hit {
  cursor: pointer;
}

.nilfish-website-studio__toolbar {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.5rem;
  background: rgba(15, 23, 42, 0.92);
  color: #fff;
}

.nilfish-website-studio__toolbar-label {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 0.8rem;
  font-weight: 600;
}

.nilfish-website-studio__toolbar .btn-nilfish-ghost,
.nilfish-website-studio__toolbar .btn-nilfish-icon {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.25);
}

.nilfish-website-studio__insert {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 1.25rem;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: transparent;
  cursor: pointer;
}

.nilfish-website-studio__insert:hover,
.nilfish-website-studio__insert.is-active {
  height: 1.75rem;
  background: color-mix(in srgb, var(--nilfish-accent) 18%, transparent);
  color: var(--nilfish-accent);
  font-weight: 700;
}

.nilfish-website-studio__insert.is-drop-target {
  height: 2rem;
  background: color-mix(in srgb, var(--nilfish-accent) 32%, transparent);
  color: var(--nilfish-accent);
  font-weight: 700;
  outline: 2px dashed var(--nilfish-accent);
  outline-offset: -2px;
}

.nilfish-studio-editable {
  outline: 1px dashed transparent;
  min-width: 0.5rem;
  cursor: text;
}

.nilfish-home--studio .nilfish-studio-editable:hover,
.nilfish-home--studio .nilfish-studio-editable:focus {
  outline-color: var(--nilfish-accent);
  outline-offset: 2px;
}

/* Full-viewport heroes hide sections below in the studio scrollport */
.nilfish-home--studio .nilfish-home-hero .min-vh-75 {
  min-height: 16rem;
}

.nilfish-studio-placeholder,
.nilfish-studio-slot {
  padding: 1.5rem 1rem;
  text-align: center;
}

/* Homepage sections (Shopify-style renderer) */

.nilfish-section--highlight {
  outline: 3px solid var(--nilfish-accent);
  outline-offset: -3px;
}

.nilfish-home-hero-bg {
  position: absolute;
  top: -20%;
  right: -10%;
  width: 55%;
  height: 140%;
  background: radial-gradient(circle, rgba(var(--nilfish-accent-rgb), 0.12) 0%, transparent 65%);
  pointer-events: none;
}

.nilfish-home-hero-inner {
  display: grid;
  grid-gap: 2rem;
  gap: 2rem;
  align-items: center;
  position: relative;
  z-index: 1;
}

.nilfish-home-hero-inner--platform {
  grid-template-columns: 1fr;
}

@media (min-width: 992px) {
  .nilfish-home-hero-inner {
    grid-template-columns: 1.1fr 0.9fr;
  }

  .nilfish-home-hero-inner--platform {
    grid-template-columns: 1fr 1fr;
  }
}

.nilfish-home-hero-aside {
  text-align: center;
}

.nilfish-home-hero-logo {
  max-width: 320px;
  width: 100%;
  height: auto;
  border-radius: var(--nilfish-radius-xl);
  box-shadow: none;
}

.nilfish-home-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.5rem;
  color: var(--nilfish-light-gray, #cbd5e1);
  font-size: 0.9rem;
  margin-top: 1.25rem;
}

.nilfish-home-trust__check {
  color: var(--nilfish-accent);
  margin-right: 0.15rem;
}

.nilfish-site .btn-nilfish-ghost,
.nilfish-home .btn-nilfish-ghost {
  background: transparent;
  border: 2px solid rgba(255, 255, 255, 0.35);
  color: #fff;
  border-radius: var(--nilfish-radius-md);
  padding: 0.65rem 1.25rem;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}

.nilfish-site .btn-nilfish-ghost:hover,
.nilfish-site .btn-nilfish-ghost:focus,
.nilfish-home .btn-nilfish-ghost:hover,
.nilfish-home .btn-nilfish-ghost:focus {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.6);
  color: #fff;
}

.btn-lg {
  padding: 0.75rem 1.5rem;
  font-size: 1.05rem;
}

.nilfish-hero-actions {
  margin-top: 1.25rem;
  gap: 0.75rem;
}

.nilfish-home-visual {
  height: clamp(220px, 42vh, 480px);
  overflow: hidden;
  position: relative;
}

.nilfish-home-visual--height-short {
  height: clamp(180px, 28vh, 360px);
}

.nilfish-home-visual--height-medium {
  height: clamp(240px, 42vh, 480px);
}

.nilfish-home-visual--height-tall {
  height: clamp(340px, 58vh, 720px);
}

.nilfish-home-visual--height-xl {
  /* Full-viewport hero (first homepage visual). Desktop/tablet: fill under sticky nav. */
  height: calc(100svh - 5.75rem);
  min-height: 32rem;
}

@media (max-width: 767.98px) {
  .nilfish-home-visual--height-xl {
    /* Mobile: full-screen hero; min-height 100vw keeps ≥ 1:1 on short landscape. */
    height: 100svh;
    min-height: 100vw;
  }
}

.nilfish-home-visual--sketch {
  height: clamp(280px, 52vh, 560px);
}

.nilfish-home-visual--sketch .nilfish-home-visual-bg {
  background-position: center 35%;
  /* Soften — asset is already a light sketch */
  filter: grayscale(0.15) contrast(1.04) brightness(0.82) saturate(0.7);
}

.nilfish-home-visual--sketch .nilfish-home-visual-overlay {
  background: linear-gradient(
    180deg,
    rgba(7, 9, 12, 0.55) 0%,
    rgba(7, 9, 12, 0.12) 35%,
    rgba(7, 9, 12, 0.18) 65%,
    rgba(7, 9, 12, 0.7) 100%
  );
}

.nilfish-home-visual-bg {
  background-attachment: scroll;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: var(--nilfish-primary);
  inset: 0;
  position: absolute;
  transform: none;
}

.nilfish-home-visual-bg--img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  inset: 0;
  position: absolute;
  transform: none;
  filter: none;
  background: none;
}

.nilfish-home-visual-overlay {
  background: linear-gradient(
    180deg,
    rgba(7, 9, 12, 0.55) 0%,
    rgba(7, 9, 12, 0.12) 35%,
    rgba(7, 9, 12, 0.18) 65%,
    rgba(7, 9, 12, 0.7) 100%
  );
  inset: 0;
  position: absolute;
}

.nilfish-home-visual-content {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  position: relative;
  z-index: 1;
}

.nilfish-home-visual-label {
  color: #fff;
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 800;
  letter-spacing: 0.18em;
  opacity: 0.92;
  position: relative;
  text-shadow: 0 4px 28px rgba(0, 0, 0, 0.45);
  text-transform: uppercase;
}

.nilfish-home-visual-label::after {
  background: var(--nilfish-accent);
  border-radius: 2px;
  bottom: -0.65rem;
  content: "";
  height: 3px;
  left: 50%;
  position: absolute;
  transform: translateX(-50%);
  width: 2.5rem;
}

.nilfish-section-header--center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 40rem;
}

.nilfish-grid--4 {
  grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
}

.nilfish-home-cta {
  padding-bottom: 5rem;
}

[data-nilfish-theme="master"] .nilfish-home-cta {
  /* Sit closer under apps/pricing atmosphere — less empty void */
  padding-top: 2rem;
  padding-bottom: 4rem;
}

.nilfish-platform-visual {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 1rem;
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.25);
  padding: 1.25rem;
}

.nilfish-platform-header {
  align-items: center;
  display: flex;
  gap: 0.4rem;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.nilfish-platform-dot {
  background: rgba(255, 255, 255, 0.25);
  border-radius: 50%;
  height: 8px;
  width: 8px;
}

.nilfish-platform-dot:first-child {
  background: #ef4444;
}

.nilfish-platform-dot:nth-child(2) {
  background: #eab308;
}

.nilfish-platform-dot:nth-child(3) {
  background: #22c55e;
}

.nilfish-platform-label {
  color: var(--nilfish-light-gray, #cbd5e1);
  font-size: 0.8rem;
  margin-left: auto;
}

.nilfish-platform-grid {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  grid-template-columns: repeat(2, 1fr);
}

.nilfish-platform-tile {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 0.65rem;
  padding: 1rem;
}

.nilfish-platform-tile__icon {
  color: var(--nilfish-accent);
  display: flex;
  margin-bottom: 0.5rem;
}

.nilfish-platform-tile strong {
  color: #fff;
  display: block;
  font-size: 0.95rem;
  margin-bottom: 0.2rem;
}

.nilfish-platform-tile span {
  color: var(--nilfish-light-gray, #cbd5e1);
  display: block;
  font-size: 0.75rem;
  line-height: 1.35;
}

.nilfish-platform-tile-wide {
  grid-column: 1 / -1;
}

.nilfish-platform-tagline {
  color: var(--nilfish-accent);
  font-size: 0.9rem;
  font-weight: 600;
  margin-top: 1rem;
  text-align: center;
}

.nilfish-home-problem {
  background: var(--nilfish-bg-light);
}

.nilfish-home-card {
  border-radius: 1rem;
  padding: 2rem;
}

.nilfish-home-card-muted {
  background: #fff;
  border: 1px solid #e2e8f0;
}

.nilfish-home-card-accent {
  background: linear-gradient(160deg, #152a45 0%, var(--nilfish-primary) 100%);
  border: 1px solid rgba(var(--nilfish-accent-rgb), 0.25);
  color: #fff;
}

.nilfish-home-card-accent p {
  color: var(--nilfish-light-gray, #cbd5e1);
}

.nilfish-card-label {
  color: var(--nilfish-accent);
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  margin-bottom: 1rem;
  text-transform: uppercase;
}

.nilfish-home-list {
  color: var(--nilfish-body);
  margin: 0;
  padding-left: 1.2rem;
}

.nilfish-home-list li {
  margin-bottom: 0.65rem;
}

.nilfish-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
}

.nilfish-checklist li {
  color: rgba(255, 255, 255, 0.92);
  margin-bottom: 0.5rem;
  padding-left: 1.25rem;
  position: relative;
}

.nilfish-checklist li::before {
  content: "\2713"; /* ✓ */
  color: var(--nilfish-accent);
  left: 0;
  position: absolute;
}

.nilfish-home-flow {
  background: #fff;
}

.nilfish-flow-panel {
  background: var(--nilfish-bg-light);
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  padding: 2.5rem 2rem;
}

.nilfish-flow-steps {
  align-items: stretch;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
  margin: 1.5rem 0;
}

.nilfish-flow-step-wrap {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.nilfish-flow-step {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  flex: 1 1 160px;
  max-width: 220px;
  padding: 1.25rem;
  text-align: center;
}

.nilfish-flow-step strong {
  color: var(--nilfish-primary);
  display: block;
  font-size: 1rem;
  margin-bottom: 0.35rem;
}

.nilfish-flow-step span {
  color: var(--nilfish-muted);
  display: block;
  font-size: 0.8rem;
  line-height: 1.4;
}

.nilfish-flow-num {
  align-items: center;
  background: var(--nilfish-accent);
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  font-size: 0.85rem;
  font-weight: 700;
  height: 1.75rem;
  justify-content: center;
  margin-bottom: 0.65rem;
  width: 1.75rem;
}

.nilfish-flow-arrow {
  color: var(--nilfish-accent);
  display: none;
  font-size: 1.25rem;
}

@media (min-width: 768px) {
  .nilfish-flow-arrow {
    display: flex;
  }
}

.nilfish-flow-footer {
  color: var(--nilfish-primary);
  font-size: 0.95rem;
  font-weight: 600;
  text-align: center;
  margin: 0;
}

.nilfish-benefits {
  display: grid;
  grid-gap: 0.75rem;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

.nilfish-benefit-pill {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  height: 100%;
  padding: 1rem;
  text-align: center;
}

.nilfish-benefit-pill strong {
  color: var(--nilfish-primary);
  display: block;
  font-size: 0.9rem;
}

.nilfish-benefit-pill span {
  color: var(--nilfish-muted);
  display: block;
  font-size: 0.78rem;
  margin-top: 0.25rem;
}

.nilfish-action-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  color: inherit;
  display: block;
  padding: 2rem;
  text-decoration: none;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
}

.nilfish-action-card:hover {
  border-color: rgba(var(--nilfish-accent-rgb), 0.4);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.1);
  transform: translateY(-4px);
  color: inherit;
}

.nilfish-action-card h3 {
  color: var(--nilfish-primary);
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 0.65rem;
}

.nilfish-action-card p {
  color: var(--nilfish-muted);
  font-size: 0.95rem;
  margin: 0 0 1rem;
}

.nilfish-action-icon {
  align-items: center;
  background: linear-gradient(135deg, var(--nilfish-primary), #152a45);
  border-radius: 0.75rem;
  color: var(--nilfish-accent);
  display: inline-flex;
  height: 2.75rem;
  justify-content: center;
  margin-bottom: 1rem;
  width: 2.75rem;
}

.nilfish-link {
  color: var(--nilfish-accent);
  font-weight: 600;
}

.text-center {
  text-align: center;
}

@media (max-width: 991.98px) {
  /* Compact defaults — do not crush --height-xl (full-screen hero). */
  .nilfish-home-visual:not(.nilfish-home-visual--height-xl) {
    height: clamp(180px, 32vh, 320px);
  }

  .nilfish-home-visual-bg {
    background-attachment: scroll;
    inset: 0;
    transform: none;
  }

  [data-storefront-skin="lighthouse"] .nilfish-home-visual:not(.nilfish-home-visual--height-xl) {
    height: clamp(220px, 38vh, 420px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .nilfish-home-visual-bg {
    background-attachment: scroll;
    transform: none;
  }
}

/* ── Public workshop booking (/book) ── */

.nilfish-workshop-book {
  --nilfish-book-accent: var(--nilfish-accent, #ea580c);
  --nilfish-book-bg: #f7f8fa;
  --nilfish-book-card: #ffffff;
  --nilfish-book-border: #e5e7eb;
  --nilfish-book-text: #1f2937;
  --nilfish-book-muted: #6b7280;
  background: var(--nilfish-book-bg);
  color: var(--nilfish-book-text);
  min-height: 70vh;
  padding: 1.25rem 0 3rem;
}

.nilfish-book-shell {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1rem;
}

.nilfish-book-topbar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  grid-gap: 1rem;
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.nilfish-book-cancel {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--nilfish-book-text);
  text-decoration: none;
  font-weight: 600;
  justify-self: start;
}

.nilfish-book-cancel:hover {
  color: var(--nilfish-book-accent);
}

.nilfish-book-cancel-icon {
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--nilfish-book-border);
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--nilfish-book-card);
  font-size: 0.95rem;
}

.nilfish-book-topbar-title {
  text-align: center;
}

.nilfish-book-topbar-title h1 {
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0;
  line-height: 1.2;
}

.nilfish-book-subtitle {
  margin: 0.25rem 0 0;
  color: var(--nilfish-book-muted);
  font-size: 0.95rem;
}

.nilfish-book-topbar-spacer {
  justify-self: end;
}

.nilfish-book-alert {
  margin-bottom: 1rem;
  color: #b91c1c;
  font-weight: 600;
}

.nilfish-book-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  list-style: none;
  padding: 0;
  margin: 0 0 1.25rem;
  color: var(--nilfish-book-muted);
  font-size: 0.85rem;
  font-weight: 600;
}

.nilfish-book-steps li.is-active {
  color: var(--nilfish-book-accent);
}

.nilfish-book-steps li.is-done {
  color: var(--nilfish-book-text);
}

.nilfish-book-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20rem;
  grid-gap: 1.25rem;
  gap: 1.25rem;
  align-items: start;
}

.nilfish-book-layout.nilfish-book-layout-single {
  grid-template-columns: minmax(0, 1fr);
  max-width: 40rem;
}

.nilfish-book-card {
  background: var(--nilfish-book-card);
  border: 1px solid var(--nilfish-book-border);
  border-radius: 0.5rem;
  padding: 1.25rem 1.35rem;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.nilfish-book-aside {
  position: -webkit-sticky;
  position: sticky;
  top: 1rem;
}

.nilfish-book-summary {
  background: var(--nilfish-book-card);
  border: 1px solid var(--nilfish-book-border);
  border-radius: 0.5rem;
  padding: 1.15rem 1.25rem;
}

.nilfish-book-summary h2,
.nilfish-book-section-title {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 0.85rem;
}

.nilfish-book-summary-item {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  margin-bottom: 0.75rem;
}

.nilfish-book-summary-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--nilfish-book-muted);
  font-weight: 600;
}

.nilfish-book-summary-value {
  font-weight: 600;
}

.nilfish-book-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  margin-top: 1rem;
}

.nilfish-book-package-list {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.nilfish-book-package {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.2rem;
  text-align: left;
  width: 100%;
  padding: 0.85rem 1rem;
  border: 1px solid var(--nilfish-book-border);
  border-radius: 0.45rem;
  background: #fff;
  cursor: pointer;
}

.nilfish-book-package:hover,
.nilfish-book-package:focus {
  border-color: var(--nilfish-book-accent);
}

.nilfish-book-package.is-selected {
  border-color: var(--nilfish-book-accent);
  box-shadow: inset 0 0 0 1px var(--nilfish-book-accent);
}

.nilfish-book-lines {
  margin-top: 1rem;
}

.nilfish-book-lines ul {
  margin: 0;
  padding-left: 1.1rem;
}

.nilfish-book-cal {
  --nilfish-book-accent: var(--nilfish-accent, #ea580c);
  --nilfish-book-border: var(--nilfish-border, #e5e7eb);
  --nilfish-book-text: var(--nilfish-text, #1f2937);
  --nilfish-book-muted: var(--nilfish-muted, #6b7280);
  --nilfish-book-surface: var(--nilfish-surface, #f4f6f9);
  --nilfish-book-card: #ffffff;
  color: var(--nilfish-book-text);
}

.nilfish-book-cal__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.nilfish-book-cal__nav-btn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  background: transparent;
  color: var(--nilfish-book-text);
  font: inherit;
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  padding: 0.25rem 0;
  text-decoration: none;
}

.nilfish-book-cal__nav-btn:hover {
  color: var(--nilfish-book-accent);
}

.nilfish-book-cal__week-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15rem;
  text-align: center;
}

.nilfish-book-cal__week-num {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--nilfish-book-muted);
}

.nilfish-book-cal--with-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(15rem, 17.5rem);
  grid-gap: 1.75rem;
  gap: 1.75rem;
  align-items: start;
  width: 100%;
}

@media (max-width: 900px) {
  .nilfish-book-cal--with-summary {
    grid-template-columns: 1fr;
  }
}

.nilfish-book-cal__aside {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: static;
}

.nilfish-book-cal__summary {
  border: 1px solid var(--nilfish-book-border);
  border-radius: 0.5rem;
  padding: 1rem 1.1rem;
  background: var(--nilfish-book-card);
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.nilfish-book-cal__summary-title {
  margin: 0 0 0.85rem;
  font-size: 0.95rem;
  font-weight: 700;
}

.nilfish-book-cal__summary-list {
  margin: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-gap: 0.45rem 0.85rem;
  gap: 0.45rem 0.85rem;
  font-size: 0.875rem;
}

.nilfish-book-cal__summary-list dt {
  color: var(--nilfish-book-muted);
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.7rem;
  letter-spacing: 0.04em;
  align-self: center;
}

.nilfish-book-cal__summary-list dd {
  margin: 0;
  font-weight: 600;
}

.nilfish-book-cal__mechanics {
  margin: 0;
  padding: 1rem 1.1rem;
  border: 1px solid var(--nilfish-book-border);
  border-radius: 0.5rem;
  background: var(--nilfish-book-card);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.nilfish-book-cal__mechanics-title {
  padding: 0;
  margin: 0 0 0.35rem;
  font-size: 0.95rem;
  font-weight: 700;
}

.nilfish-book-cal__mechanic-option {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  margin: 0;
  padding: 0.65rem 0.75rem;
  border: 1px solid transparent;
  border-radius: 0.45rem;
  cursor: pointer;
  background: transparent;
}

.nilfish-book-cal__mechanic-option:hover {
  background: var(--nilfish-book-surface);
}

.nilfish-book-cal__mechanic-option.is-selected {
  background: color-mix(in srgb, var(--nilfish-book-accent) 8%, var(--nilfish-book-card));
  border-color: color-mix(in srgb, var(--nilfish-book-accent) 35%, var(--nilfish-book-border));
}

.nilfish-book-cal__mechanic-option input {
  margin-top: 0.2rem;
  accent-color: var(--nilfish-book-accent);
  flex-shrink: 0;
}

.nilfish-book-cal__mechanic-copy {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}

.nilfish-book-cal__mechanic-name {
  font-weight: 600;
  font-size: 0.9rem;
  line-height: 1.3;
}

.nilfish-book-cal__mechanic-hint {
  font-size: 0.75rem;
  color: var(--nilfish-book-muted);
  font-weight: 400;
}

.nilfish-book-cal__title {
  text-transform: none;
  font-size: 1rem;
  letter-spacing: 0.02em;
}

.nilfish-book-cal__week {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-gap: 0.5rem;
  gap: 0.5rem;
  width: 100%;
  min-height: 18rem;
  border-top: 1px solid var(--nilfish-book-border);
  padding-top: 0.75rem;
}

.nilfish-book-cal__week-col {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
}

.nilfish-book-cal__week-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15rem;
  position: relative;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--nilfish-book-border);
}

.nilfish-book-cal__week-dow {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: capitalize;
  color: var(--nilfish-book-muted);
}

.nilfish-book-cal__week-date {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--nilfish-book-text);
}

.nilfish-book-cal__week-head.is-today .nilfish-book-cal__week-date {
  color: var(--nilfish-book-accent);
}

.nilfish-book-cal__today-dot {
  width: 0.35rem;
  height: 0.35rem;
  border-radius: 50%;
  background: var(--nilfish-book-text);
  margin-top: 0.1rem;
}

.nilfish-book-cal__week-slots {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  align-items: stretch;
}

.nilfish-book-cal__week-empty {
  display: block;
  text-align: center;
  color: var(--nilfish-book-muted);
  font-size: 0.85rem;
  padding: 0.35rem 0;
}

.nilfish-book-cal__time {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.1rem;
  border: 1px solid color-mix(in srgb, var(--nilfish-book-accent) 45%, var(--nilfish-book-border));
  border-radius: 0.4rem;
  background: color-mix(in srgb, var(--nilfish-book-accent) 6%, var(--nilfish-book-card));
  padding: 0.55rem 0.35rem;
  font: inherit;
  color: var(--nilfish-book-text);
  cursor: pointer;
  min-width: 0;
  width: 100%;
  box-shadow: none;
}

.nilfish-book-cal__time-range {
  font-weight: 700;
  font-size: 0.85rem;
  white-space: nowrap;
}

.nilfish-book-cal__time-mechanic {
  font-size: 0.65rem;
  font-weight: 500;
  color: var(--nilfish-book-muted);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nilfish-book-cal__time:hover {
  border-color: var(--nilfish-book-accent);
  background: color-mix(in srgb, var(--nilfish-book-accent) 12%, var(--nilfish-book-card));
}

.nilfish-book-cal__time.is-selected {
  background: var(--nilfish-book-text);
  border-color: var(--nilfish-book-text);
  color: #fff;
}

.nilfish-book-cal__time.is-selected .nilfish-book-cal__time-mechanic {
  color: rgba(255, 255, 255, 0.75);
}

/* ERP dark: calendar cards/slots used hardcoded white mixes → light-on-light */
html[data-color-scheme="dark"] .nilfish-book-cal {
  --nilfish-book-surface: var(--nilfish-surface);
  --nilfish-book-card: var(--nilfish-surface-elevated);
  --nilfish-book-border: var(--nilfish-border);
  --nilfish-book-text: var(--nilfish-text);
  --nilfish-book-muted: var(--nilfish-muted);
}

html[data-color-scheme="dark"] .nilfish-book-cal__summary,
html[data-color-scheme="dark"] .nilfish-book-cal__mechanics {
  box-shadow: none;
}

html[data-color-scheme="dark"] .nilfish-book-cal__time {
  background: color-mix(in srgb, var(--nilfish-book-accent) 14%, var(--nilfish-book-card));
  border-color: color-mix(in srgb, var(--nilfish-book-accent) 40%, var(--nilfish-book-border));
  color: var(--nilfish-book-text);
}

html[data-color-scheme="dark"] .nilfish-book-cal__time:hover {
  background: color-mix(in srgb, var(--nilfish-book-accent) 22%, var(--nilfish-book-card));
  border-color: var(--nilfish-book-accent);
}

html[data-color-scheme="dark"] .nilfish-book-cal__time.is-selected {
  background: var(--nilfish-book-accent);
  border-color: var(--nilfish-book-accent);
  color: #fff;
}

html[data-color-scheme="dark"] .nilfish-book-cal__time.is-selected .nilfish-book-cal__time-mechanic {
  color: rgba(255, 255, 255, 0.85);
}

html[data-color-scheme="dark"] .nilfish-book-cal__mechanic-option.is-selected {
  background: color-mix(in srgb, var(--nilfish-book-accent) 16%, var(--nilfish-book-card));
  border-color: color-mix(in srgb, var(--nilfish-book-accent) 40%, var(--nilfish-book-border));
}

@media (max-width: 720px) {
  .nilfish-book-cal__week {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.nilfish-workshop-book .nilfish-label {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-weight: 600;
  font-size: 0.9rem;
}

@media (max-width: 800px) {
  .nilfish-book-layout {
    grid-template-columns: 1fr;
  }

  .nilfish-book-aside {
    position: static;
  }

  .nilfish-book-cal__aside {
    position: static;
  }

  .nilfish-book-topbar {
    grid-template-columns: 1fr;
    justify-items: start;
  }

  .nilfish-book-topbar-title {
    text-align: left;
  }

  .nilfish-book-topbar-spacer {
    display: none;
  }
}

/* ── Master product journeys (quiet marketing spine) ─────────────────────── */

.nilfish-master-product {
  --nilfish-master-hero-min: min(88vh, 720px);
}

.nilfish-master-hero {
  background: var(--nilfish-primary, #0a0a0a);
  color: #fff;
  min-height: var(--nilfish-master-hero-min);
  display: flex;
  align-items: center;
  padding: 4.5rem 0 3.5rem;
  position: relative;
  overflow: hidden;
}

.nilfish-master-hero::after {
  content: "";
  position: absolute;
  inset: auto -20% -40% 40%;
  height: 70%;
  background: radial-gradient(
    ellipse at center,
    rgba(var(--nilfish-accent-rgb, 162, 198, 9), 0.14) 0%,
    transparent 65%
  );
  pointer-events: none;
}

.nilfish-master-hero__inner {
  display: grid;
  grid-gap: 2.5rem;
  gap: 2.5rem;
  align-items: center;
  position: relative;
  z-index: 1;
  width: 100%;
}

@media (min-width: 900px) {
  .nilfish-master-hero__inner {
    grid-template-columns: 1.05fr 0.95fr;
    gap: 3rem;
  }
}

.nilfish-master-hero__brand {
  margin: 0 0 0.85rem;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--nilfish-accent, #a2c609);
}

.nilfish-master-hero__headline {
  margin: 0;
  font-size: clamp(2.1rem, 4.8vw, 3.35rem);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.08;
  color: #fff;
  max-width: 14ch;
}

.nilfish-master-hero__lead {
  margin: 1.15rem 0 0;
  font-size: 1.08rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.72);
  max-width: 36rem;
}

.nilfish-master-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.75rem;
}

.nilfish-master-hero__visual {
  display: flex;
  justify-content: center;
}

.nilfish-master-hero__panel {
  width: 100%;
  max-width: 420px;
  min-height: 280px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.03);
  border-radius: 2px;
  padding: 1.5rem 1.35rem;
  animation: nilfish-master-fade-up 0.7s ease-out both;
}

.nilfish-master-hero__panel-label {
  margin: 0 0 1.25rem;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--nilfish-accent, #a2c609);
}

.nilfish-master-hero__panel-lines {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.nilfish-master-hero__panel-lines li {
  padding: 0.85rem 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 0.95rem;
  color: rgba(255, 255, 255, 0.82);
  letter-spacing: -0.01em;
}

.nilfish-master-hero__panel-lines li:last-child {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.nilfish-master-proof {
  padding: 1.35rem 0;
  background: #fff;
  border-bottom: 1px solid var(--nilfish-border, #e2e8f0);
}

.nilfish-master-proof__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1.75rem;
  font-size: 0.9rem;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-master-proof__list li {
  position: relative;
}

.nilfish-master-proof__list li + li::before {
  content: "\00B7"; /* · */
  position: absolute;
  left: -1.05rem;
  color: var(--nilfish-light-gray, #94a3b8);
}

.nilfish-master-modules,
.nilfish-master-compare {
  padding: 4.5rem 0;
  background: #fff;
}

.nilfish-master-compare {
  background: var(--nilfish-bg-light, #f8fafc);
}

.nilfish-master-section-header {
  max-width: 36rem;
  margin-bottom: 2.25rem;
}

.nilfish-master-section-title {
  margin: 0;
  font-size: clamp(1.55rem, 2.8vw, 2rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--nilfish-primary, #0a0a0a);
  line-height: 1.2;
}

.nilfish-master-section-title em,
.nilfish-master-cta__title em {
  font-style: italic;
  font-weight: 600;
  color: inherit;
}

.nilfish-master-section-lead {
  margin: 0.75rem 0 0;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-master-modules__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-gap: 0;
  gap: 0;
  border-top: 1px solid var(--nilfish-border, #e2e8f0);
}

@media (min-width: 768px) {
  .nilfish-master-modules__list {
    grid-template-columns: 1fr 1fr;
  }
}

.nilfish-master-modules__item {
  padding: 1.35rem 0;
  border-bottom: 1px solid var(--nilfish-border, #e2e8f0);
}

@media (min-width: 768px) {
  .nilfish-master-modules__item:nth-child(odd) {
    padding-right: 1.75rem;
  }

  .nilfish-master-modules__item:nth-child(even) {
    padding-left: 1.75rem;
    border-left: 1px solid var(--nilfish-border, #e2e8f0);
  }
}

.nilfish-master-modules__item h3 {
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
  font-weight: 650;
  color: var(--nilfish-primary, #0a0a0a);
  letter-spacing: -0.02em;
}

.nilfish-master-modules__item p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--nilfish-muted, #64748b);
}

.nilfish-master-compare__table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.nilfish-master-compare__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95rem;
  min-width: 520px;
}

.nilfish-master-compare__table th,
.nilfish-master-compare__table td {
  padding: 1rem 1rem 1rem 0;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--nilfish-border, #e2e8f0);
}

.nilfish-master-compare__table thead th {
  font-size: 0.75rem;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--nilfish-muted, #64748b);
  padding-top: 0;
}

.nilfish-master-compare__table thead th:nth-child(2) {
  color: var(--nilfish-primary, #0a0a0a);
}

.nilfish-master-compare__table tbody th {
  font-weight: 600;
  color: var(--nilfish-primary, #0a0a0a);
  width: 28%;
}

.nilfish-master-compare__table tbody td:nth-child(2) {
  color: var(--nilfish-primary, #0a0a0a);
  font-weight: 500;
}

.nilfish-master-compare__table tbody td:nth-child(3) {
  color: var(--nilfish-muted, #64748b);
}

.nilfish-master-cta {
  padding: 4rem 0 5rem;
  background: #fff;
}

.nilfish-master-cta__inner {
  background: var(--nilfish-primary, #0a0a0a);
  color: #fff;
  padding: clamp(2.25rem, 5vw, 3.25rem);
  border-radius: 2px;
  animation: nilfish-master-fade-up 0.6s ease-out both;
}

.nilfish-master-cta__title {
  margin: 0;
  font-size: clamp(1.45rem, 2.6vw, 1.85rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  color: #fff;
  max-width: 22ch;
}

.nilfish-master-cta__lead {
  margin: 0.85rem 0 0;
  font-size: 1.05rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.7);
  max-width: 34rem;
}

.nilfish-master-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.5rem;
}

@keyframes nilfish-master-fade-up {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .nilfish-master-hero__panel,
  .nilfish-master-cta__inner {
    animation: none;
  }
}

/* ── Master marketing home — dark end-to-end (Nilfish platform) ─────────── */

/* Public master-site canvas only. ERP PLATFORM reuses data-nilfish-theme=master
   on <html> and .nilfish-app-chrome for brand tokens — do not paint those dark. */
html[data-nilfish-theme="master"]:not(:has(.nilfish-app-chrome)),
html[data-nilfish-theme="master"]:not(:has(.nilfish-app-chrome)) body {
  background: #0a0a0a;
  color: #e2e8f0;
}

[data-nilfish-theme="master"] .nilfish-home-section {
  background: #0a0a0a;
  color: #e2e8f0;
}

[data-nilfish-theme="master"] .nilfish-home-hero {
  background: linear-gradient(145deg, #0a0a0a 0%, #141414 45%, #000000 100%);
}

[data-nilfish-theme="master"] .nilfish-section-title {
  color: #f8fafc;
}

[data-nilfish-theme="master"] .nilfish-section-lead {
  color: #94a3b8;
}

[data-nilfish-theme="master"] .nilfish-home-categories,
[data-nilfish-theme="master"] .nilfish-home-features,
[data-nilfish-theme="master"] .nilfish-home-problem,
[data-nilfish-theme="master"] .nilfish-home-flow {
  background: #0a0a0a;
}

/* Master home: product boxes — true full-bleed section (edge to edge) */
[data-nilfish-theme="master"] .nilfish-home-visual[data-section-id="product-boxes"] {
  width: 100%;
  max-width: none;
  /* Taller band so lower box art (vehicles) stays visible above the fade */
  height: clamp(520px, calc(60vh + 300px), 1020px);
  background: #0a0a0a;
  overflow: hidden;
}

[data-nilfish-theme="master"] .nilfish-home-visual[data-section-id="product-boxes"] .nilfish-home-visual-bg,
[data-nilfish-theme="master"] .nilfish-home-visual[data-section-id="product-boxes"] .nilfish-home-visual-bg--img {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  border: 0;
  /* Fill viewport band — no letterbox / “pasted photo” frame */
  object-fit: cover;
  object-position: center 42%;
  background-size: cover;
  background-position: center 42%;
  background-repeat: no-repeat;
  background-attachment: scroll;
  transform: none;
  filter: none;
}

[data-nilfish-theme="master"] .nilfish-home-visual[data-section-id="product-boxes"] .nilfish-home-visual-overlay {
  /* Soft top, strong bottom fade into page */
  background: linear-gradient(
    180deg,
    #0a0a0a 0%,
    rgba(10, 10, 10, 0.25) 8%,
    transparent 22%,
    transparent 55%,
    rgba(10, 10, 10, 0.3) 78%,
    rgba(10, 10, 10, 0.8) 90%,
    #0a0a0a 100%
  );
}

[data-nilfish-theme="master"] .nilfish-home-visual[data-section-id="product-boxes"] .nilfish-home-visual-label {
  display: none;
}

@media (max-width: 767.98px) {
  [data-nilfish-theme="master"] .nilfish-home-visual[data-section-id="product-boxes"] {
    height: clamp(380px, calc(52vh + 160px), 640px);
  }

  [data-nilfish-theme="master"] .nilfish-home-visual[data-section-id="product-boxes"] .nilfish-home-visual-bg--img {
    object-position: center 40%;
  }
}

[data-nilfish-theme="master"] .nilfish-feature-card,
[data-nilfish-theme="master"] .nilfish-home-card-muted {
  background: #141414;
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #e2e8f0;
}

[data-nilfish-theme="master"] .nilfish-feature-card h3,
[data-nilfish-theme="master"] .nilfish-home-card-muted h3 {
  color: #f8fafc;
}

[data-nilfish-theme="master"] .nilfish-feature-card p,
[data-nilfish-theme="master"] .nilfish-home-card-muted p {
  color: #94a3b8;
}

[data-nilfish-theme="master"] .nilfish-home-card-accent {
  background: linear-gradient(160deg, #1a1a1a 0%, #0a0a0a 100%);
  border-color: rgba(var(--nilfish-accent-rgb), 0.35);
}

[data-nilfish-theme="master"] .nilfish-home-list {
  color: #cbd5e1;
}

[data-nilfish-theme="master"] .nilfish-flow-panel {
  background: #141414;
  border-color: rgba(255, 255, 255, 0.08);
  color: #e2e8f0;
}

[data-nilfish-theme="master"] .nilfish-benefit-pill,
[data-nilfish-theme="master"] .nilfish-action-card {
  background: #141414;
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #e2e8f0;
}

[data-nilfish-theme="master"] .nilfish-benefit-pill strong,
[data-nilfish-theme="master"] .nilfish-action-card h3,
[data-nilfish-theme="master"] .nilfish-page-title {
  color: #f8fafc;
}

[data-nilfish-theme="master"] .nilfish-benefit-pill span,
[data-nilfish-theme="master"] .nilfish-action-card p,
[data-nilfish-theme="master"] .nilfish-flow-step span,
[data-nilfish-theme="master"] .nilfish-flow-footer {
  color: #94a3b8;
}

[data-nilfish-theme="master"] .nilfish-flow-step {
  background: #141414;
  border-color: rgba(255, 255, 255, 0.1);
}

[data-nilfish-theme="master"] .nilfish-flow-step strong {
  color: #f8fafc;
}

[data-nilfish-theme="master"] .nilfish-flow-num {
  color: #0a0a0a;
}

/* Docs hub — glass cards like platform tiles (not flat white) */
[data-nilfish-theme="master"] .nilfish-docs-sidebar,
[data-nilfish-theme="master"] .nilfish-docs-content,
[data-nilfish-theme="master"] .nilfish-docs-card,
[data-nilfish-theme="master"] .nilfish-docs-pane--technical,
[data-nilfish-theme="master"] .nilfish-docs-flow {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: none;
  color: #e2e8f0;
}

[data-nilfish-theme="master"] .nilfish-docs-card {
  border-radius: 0.75rem;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

[data-nilfish-theme="master"] .nilfish-docs-card:hover {
  background: rgba(255, 255, 255, 0.09);
  border-color: rgba(var(--nilfish-accent-rgb), 0.35);
  box-shadow: none;
  transform: translateY(-2px);
}

[data-nilfish-theme="master"] .nilfish-docs-card h3 {
  color: #f8fafc;
}

[data-nilfish-theme="master"] .nilfish-docs-card p,
[data-nilfish-theme="master"] .nilfish-docs-topic-list-item p,
[data-nilfish-theme="master"] .nilfish-docs-topic-link,
[data-nilfish-theme="master"] .nilfish-docs .nilfish-muted,
[data-nilfish-theme="master"] .nilfish-docs .nilfish-page-subtitle {
  color: #94a3b8;
}

[data-nilfish-theme="master"] .nilfish-docs-nav-link {
  color: #cbd5e1;
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

[data-nilfish-theme="master"] .nilfish-docs-nav-link:hover,
[data-nilfish-theme="master"] .nilfish-docs-nav-link.is-active,
[data-nilfish-theme="master"] .nilfish-docs-topic-link:hover,
[data-nilfish-theme="master"] .nilfish-docs-topic-link.is-active {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="master"] .nilfish-docs-topic-list-item {
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

[data-nilfish-theme="master"] .nilfish-docs-topic-list-item h3 .nilfish-link,
[data-nilfish-theme="master"] .nilfish-docs-card .nilfish-link {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="master"] .nilfish-docs-pane + .nilfish-docs-pane {
  border-top-color: rgba(255, 255, 255, 0.1);
}

[data-nilfish-theme="master"] .nilfish-docs-prose,
[data-nilfish-theme="master"] .nilfish-docs-prose p,
[data-nilfish-theme="master"] .nilfish-docs-prose li {
  color: #cbd5e1;
}

[data-nilfish-theme="master"] .nilfish-docs-prose h2,
[data-nilfish-theme="master"] .nilfish-docs-prose h3,
[data-nilfish-theme="master"] .nilfish-docs-prose h4 {
  color: #f8fafc;
}

[data-nilfish-theme="master"] .nilfish-docs-prose pre,
[data-nilfish-theme="master"] .nilfish-docs-prose code {
  background: rgba(0, 0, 0, 0.35);
  color: #e2e8f0;
}

[data-nilfish-theme="master"] .nilfish-docs-prose a {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="master"] .nilfish-docs-figure img,
[data-nilfish-theme="master"] .nilfish-docs-figure video {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(0, 0, 0, 0.25);
}

[data-nilfish-theme="master"] .nilfish-docs .btn-nilfish-secondary {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.18);
  color: #e2e8f0;
}

[data-nilfish-theme="master"] .nilfish-docs .btn-nilfish-secondary:hover,
[data-nilfish-theme="master"] .nilfish-docs .btn-nilfish-secondary:focus {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(var(--nilfish-accent-rgb), 0.4);
  color: #f8fafc;
}

/* Journey plan builders (/plan/powersport, /plan/byra) — dark glass cards */
[data-nilfish-theme="master"] .nilfish-plan-builder {
  padding-bottom: 3rem;
}

[data-nilfish-theme="master"] .nilfish-plan-builder .nilfish-page-subtitle {
  color: #94a3b8;
}

[data-nilfish-theme="master"] .nilfish-plan-builder .nilfish-card {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: none;
  color: #e2e8f0;
}

[data-nilfish-theme="master"] .nilfish-plan-builder .nilfish-card__title {
  color: #f8fafc;
}

[data-nilfish-theme="master"] .nilfish-plan-builder .nilfish-checkbox-row {
  color: #cbd5e1;
}

[data-nilfish-theme="master"] .nilfish-plan-builder .nilfish-checkbox-row strong {
  color: #f8fafc;
  font-weight: 600;
}

[data-nilfish-theme="master"] .nilfish-plan-builder .nilfish-price-display {
  color: #f8fafc;
}

[data-nilfish-theme="master"] .nilfish-plan-builder .nilfish-input {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.18);
  color: #f8fafc;
}

[data-nilfish-theme="master"] .nilfish-plan-builder .nilfish-input::placeholder {
  color: #64748b;
}

[data-nilfish-theme="master"] .nilfish-plan-builder .nilfish-input:focus {
  border-color: var(--nilfish-accent);
  outline-color: rgba(var(--nilfish-accent-rgb), 0.35);
}

[data-nilfish-theme="master"] .nilfish-plan-builder .btn-nilfish-secondary {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.2);
  color: #e2e8f0;
}

[data-nilfish-theme="master"] .nilfish-plan-builder .btn-nilfish-secondary:hover,
[data-nilfish-theme="master"] .nilfish-plan-builder .btn-nilfish-secondary:focus {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(var(--nilfish-accent-rgb), 0.4);
  color: #f8fafc;
}

[data-nilfish-theme="master"] .nilfish-cta-block {
  background: #141414;
  border: 1px solid rgba(var(--nilfish-accent-rgb), 0.25);
}

[data-nilfish-theme="master"] .nilfish-btn-ghost.btn-lg,
[data-nilfish-theme="master"] a.btn-nilfish-ghost {
  color: #f8fafc;
  border-color: rgba(255, 255, 255, 0.25);
}

/* Powersport journey page — orange accents while master-site stays master-themed */
.nilfish-theme-powersport-page {
  --nilfish-accent: #c45a12;
  --nilfish-accent-hover: #a84c0f;
  --nilfish-accent-rgb: 196, 90, 18;
  --nilfish-btn-primary-bg: #c45a12;
  --nilfish-btn-primary-text: #ffffff;
  --nilfish-btn-primary-hover: #a84c0f;
  --nilfish-orange: #c45a12;
}

.nilfish-theme-powersport-page .nilfish-home-hero {
  background: linear-gradient(145deg, #0d1b2a 0%, #152a45 45%, #0d1b2a 100%);
}

/* Agency journey (/agency) — light presentation using company-style colors */
.nilfish-theme-agency-page {
  --nilfish-primary: #000000;
  --nilfish-primary-soft: #1a1a1a;
  --nilfish-primary-hover: #111111;
  --nilfish-primary-rgb: 0, 0, 0;
  --nilfish-accent: #5ac8e3;
  --nilfish-accent-hover: #3db4d4;
  --nilfish-accent-rgb: 90, 200, 227;
  --nilfish-btn-primary-bg: #5ac8e3;
  --nilfish-btn-primary-text: #0a0a0a;
  --nilfish-btn-primary-hover: #3db4d4;
  --nilfish-bg-light: #e5f6fd;
  --nilfish-surface: #ffffff;
  --nilfish-card-bg: #ffffff;
  --nilfish-body: #1e293b;
  --nilfish-muted: #64748b;
  --nilfish-border: #d7e8f0;
  background: #f7fbfd;
  color: #1e293b;
}

.nilfish-theme-agency-page .nilfish-home-hero {
  background: linear-gradient(
    145deg,
    #ffffff 0%,
    #c5e9f5 42%,
    #8fd4ea 72%,
    #e8f7fc 100%
  );
  color: var(--nilfish-primary);
}

.nilfish-theme-agency-page .nilfish-home-hero::before {
  background:
    linear-gradient(90deg, rgba(45, 140, 170, 0.28) 1px, transparent 1px),
    linear-gradient(rgba(45, 140, 170, 0.28) 1px, transparent 1px);
  background-size: 48px 48px;
  opacity: 1;
  mask-image: radial-gradient(ellipse 85% 75% at 70% 40%, black 25%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 85% 75% at 70% 40%, black 25%, transparent 78%);
}

.nilfish-theme-agency-page .nilfish-home-title,
.nilfish-theme-agency-page .nilfish-section-title {
  color: var(--nilfish-primary);
}

.nilfish-theme-agency-page .nilfish-home-lead {
  color: var(--nilfish-accent-hover);
}

.nilfish-theme-agency-page .nilfish-home-sub,
.nilfish-theme-agency-page .nilfish-section-lead {
  color: var(--nilfish-muted);
}

.nilfish-theme-agency-page .nilfish-home-features,
.nilfish-theme-agency-page .nilfish-home-section {
  background: transparent;
}

.nilfish-theme-agency-page .nilfish-feature-card {
  background: #ffffff;
  border: 1px solid var(--nilfish-border);
  color: var(--nilfish-body);
}

.nilfish-theme-agency-page .nilfish-feature-card h3 {
  color: var(--nilfish-primary);
}

.nilfish-theme-agency-page .nilfish-feature-card p {
  color: var(--nilfish-muted);
}

.nilfish-theme-agency-page .btn-nilfish-secondary {
  background: #ffffff;
  border-color: var(--nilfish-border);
  color: var(--nilfish-primary);
}

.nilfish-theme-agency-page .btn-nilfish-secondary:hover,
.nilfish-theme-agency-page .btn-nilfish-secondary:focus {
  border-color: var(--nilfish-accent);
  color: var(--nilfish-primary);
}

.nilfish-theme-agency-page .nilfish-platform-visual {
  background: #ffffff;
  border: 1px solid var(--nilfish-border);
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.1);
}

.nilfish-theme-agency-page .nilfish-platform-header {
  border-bottom-color: var(--nilfish-border);
}

.nilfish-theme-agency-page .nilfish-platform-label {
  color: var(--nilfish-muted);
}

.nilfish-theme-agency-page .nilfish-platform-tile {
  background: rgba(var(--nilfish-accent-rgb), 0.08);
  border: 1px solid rgba(var(--nilfish-accent-rgb), 0.22);
}

.nilfish-theme-agency-page .nilfish-platform-tile strong {
  color: var(--nilfish-primary);
}

.nilfish-theme-agency-page .nilfish-platform-tile span {
  color: var(--nilfish-muted);
}

.nilfish-theme-agency-page .nilfish-platform-tile__icon {
  color: var(--nilfish-accent-hover, var(--nilfish-accent));
}

.nilfish-theme-agency-page .nilfish-platform-tagline {
  color: var(--nilfish-accent-hover, var(--nilfish-accent));
}

.nilfish-theme-agency-page .nilfish-home-trust {
  color: var(--nilfish-muted);
}

.nilfish-theme-agency-page .nilfish-cta-block {
  background: var(--nilfish-primary);
  border: none;
}

/* Agency tenant site — light surfaces + company colors */
[data-nilfish-theme="agency"] body {
  background: var(--nilfish-bg-light, #e5f6fd);
  color: var(--nilfish-body, #1e293b);
}

[data-nilfish-theme="agency"] .nilfish-home-hero {
  background: linear-gradient(
    160deg,
    #ffffff 0%,
    #c5e9f5 42%,
    #8fd4ea 72%,
    #e8f7fc 100%
  );
  color: var(--nilfish-primary);
}

[data-nilfish-theme="agency"] .nilfish-home-hero::before {
  background:
    linear-gradient(90deg, rgba(45, 140, 170, 0.08) 1px, transparent 1px),
    linear-gradient(rgba(45, 140, 170, 0.08) 1px, transparent 1px);
  background-size: 48px 48px;
  opacity: 0.7;
  mask-image: radial-gradient(ellipse 85% 75% at 70% 40%, black 25%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 85% 75% at 70% 40%, black 25%, transparent 78%);
}

[data-nilfish-theme="agency"] .nilfish-home-title {
  color: var(--nilfish-primary);
}

[data-nilfish-theme="agency"] .nilfish-home-lead {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="agency"] .nilfish-home-sub,
[data-nilfish-theme="agency"] .nilfish-home-trust {
  color: var(--nilfish-muted);
}

[data-nilfish-theme="agency"] .nilfish-home-trust__check {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="agency"] .nilfish-home-section,
[data-nilfish-theme="agency"] .nilfish-home-features,
[data-nilfish-theme="agency"] .nilfish-home-categories {
  background: transparent;
}

[data-nilfish-theme="agency"] .nilfish-section-title {
  color: var(--nilfish-primary);
}

[data-nilfish-theme="agency"] .nilfish-section-lead {
  color: var(--nilfish-muted);
}

[data-nilfish-theme="agency"] .nilfish-feature-card,
[data-nilfish-theme="agency"] .nilfish-home-card-muted,
[data-nilfish-theme="agency"] .nilfish-category-card {
  background: #ffffff;
  border: 1px solid var(--nilfish-border);
  color: var(--nilfish-body);
}

[data-nilfish-theme="agency"] .nilfish-feature-card h3,
[data-nilfish-theme="agency"] .nilfish-category-card h3,
[data-nilfish-theme="agency"] .nilfish-home-card-muted h3 {
  color: var(--nilfish-primary);
}

[data-nilfish-theme="agency"] .nilfish-feature-card p,
[data-nilfish-theme="agency"] .nilfish-category-card p {
  color: var(--nilfish-muted);
}

[data-nilfish-theme="agency"] .nilfish-cta-block {
  background: var(--nilfish-primary);
  border: none;
  color: #fff;
}

[data-nilfish-theme="agency"] .nilfish-cta-block h2 {
  color: #fff;
}

[data-nilfish-theme="agency"] .nilfish-cta-block p {
  color: rgba(255, 255, 255, 0.75);
}

[data-nilfish-theme="agency"] .btn-nilfish-ghost,
[data-nilfish-theme="agency"] a.btn-nilfish-ghost {
  color: var(--nilfish-primary);
  border-color: rgba(var(--nilfish-primary-rgb), 0.25);
}

[data-nilfish-theme="agency"] .nilfish-site-footer {
  background: linear-gradient(
    145deg,
    #000000 0%,
    #0b1c24 48%,
    #111111 100%
  );
}

[data-nilfish-theme="agency"] .nilfish-site-footer__logo {
  /* Keep cyan mark readable on black footer (do not force white silhouette). */
  filter: none;
}

[data-nilfish-theme="agency"] .nilfish-kicker {
  color: var(--nilfish-accent-hover, var(--nilfish-accent));
}

[data-nilfish-theme="agency"] .nilfish-platform-visual {
  background: #ffffff;
  border: 1px solid var(--nilfish-border);
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.1);
}

[data-nilfish-theme="agency"] .nilfish-platform-header {
  border-bottom-color: var(--nilfish-border);
}

[data-nilfish-theme="agency"] .nilfish-platform-label {
  color: var(--nilfish-muted);
}

[data-nilfish-theme="agency"] .nilfish-platform-tile {
  background: rgba(var(--nilfish-accent-rgb), 0.1);
  border: 1px solid rgba(var(--nilfish-accent-rgb), 0.25);
}

[data-nilfish-theme="agency"] .nilfish-platform-tile strong {
  color: var(--nilfish-primary);
}

[data-nilfish-theme="agency"] .nilfish-platform-tile span {
  color: var(--nilfish-muted);
}

[data-nilfish-theme="agency"] .nilfish-platform-tile__icon {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="agency"] .nilfish-platform-tagline {
  color: var(--nilfish-accent-hover, var(--nilfish-accent));
}

[data-nilfish-theme="agency"] .nilfish-home-problem {
  background: transparent;
}

[data-nilfish-theme="agency"] .nilfish-home-card-accent {
  background: linear-gradient(160deg, var(--nilfish-primary) 0%, #1a1a1a 100%);
  border-color: rgba(var(--nilfish-accent-rgb), 0.35);
  color: #fff;
}

[data-nilfish-theme="agency"] .nilfish-home-flow {
  background: transparent;
}

[data-nilfish-theme="agency"] .nilfish-flow-panel {
  background: #ffffff;
  border: 1px solid var(--nilfish-border);
}

[data-nilfish-theme="agency"] .nilfish-flow-step {
  background: rgba(var(--nilfish-accent-rgb), 0.08);
  border-color: rgba(var(--nilfish-accent-rgb), 0.22);
}

[data-nilfish-theme="agency"] .nilfish-flow-step strong {
  color: var(--nilfish-primary);
}

[data-nilfish-theme="agency"] .nilfish-flow-step span,
[data-nilfish-theme="agency"] .nilfish-flow-footer {
  color: var(--nilfish-muted);
}

[data-nilfish-theme="agency"] .nilfish-flow-num {
  color: #0a0a0a;
}

[data-nilfish-theme="agency"] .nilfish-docs-prose figure img,
[data-nilfish-theme="agency"] .nilfish-docs-prose img,
[data-nilfish-theme="agency"] .nilfish-prose figure img,
[data-nilfish-theme="agency"] .nilfish-prose img {
  max-width: 100%;
  height: auto;
  border-radius: 0.75rem;
}

/* Bookstore journey (/bokhandel) — light presentation using company colors */
.nilfish-theme-bookstore-page {
  --nilfish-primary: #0d1b2a;
  --nilfish-primary-soft: #152a45;
  --nilfish-primary-hover: #0a1520;
  --nilfish-primary-rgb: 13, 27, 42;
  --nilfish-accent: #dd3c54;
  --nilfish-accent-hover: #c22f45;
  --nilfish-accent-rgb: 221, 60, 84;
  --nilfish-btn-primary-bg: #dd3c54;
  --nilfish-btn-primary-text: #ffffff;
  --nilfish-btn-primary-hover: #c22f45;
  --nilfish-bg-light: #fdf6f7;
  --nilfish-surface: #ffffff;
  --nilfish-card-bg: #ffffff;
  --nilfish-body: #1e293b;
  --nilfish-muted: #64748b;
  --nilfish-border: #f0d6db;
  background: #fdf8f9;
  color: #1e293b;
}

.nilfish-theme-bookstore-page .nilfish-home-hero {
  background: linear-gradient(
    145deg,
    #ffffff 0%,
    #f8d5dc 42%,
    #f0a8b4 72%,
    #fdf2f4 100%
  );
  color: var(--nilfish-primary);
}

.nilfish-theme-bookstore-page .nilfish-home-hero::before {
  background:
    linear-gradient(90deg, rgba(160, 40, 60, 0.28) 1px, transparent 1px),
    linear-gradient(rgba(160, 40, 60, 0.28) 1px, transparent 1px);
  background-size: 48px 48px;
  opacity: 1;
  mask-image: radial-gradient(ellipse 85% 75% at 70% 40%, black 25%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 85% 75% at 70% 40%, black 25%, transparent 78%);
}

.nilfish-theme-bookstore-page .nilfish-home-title,
.nilfish-theme-bookstore-page .nilfish-section-title {
  color: var(--nilfish-primary);
}

.nilfish-theme-bookstore-page .nilfish-home-lead {
  color: var(--nilfish-accent);
}

.nilfish-theme-bookstore-page .nilfish-home-sub,
.nilfish-theme-bookstore-page .nilfish-section-lead {
  color: var(--nilfish-muted);
}

.nilfish-theme-bookstore-page .nilfish-home-features,
.nilfish-theme-bookstore-page .nilfish-home-section {
  background: transparent;
}

.nilfish-theme-bookstore-page .nilfish-feature-card {
  background: #ffffff;
  border: 1px solid var(--nilfish-border);
  color: var(--nilfish-body);
}

.nilfish-theme-bookstore-page .nilfish-feature-card h3 {
  color: var(--nilfish-primary);
}

.nilfish-theme-bookstore-page .nilfish-feature-card p {
  color: var(--nilfish-muted);
}

.nilfish-theme-bookstore-page .btn-nilfish-secondary {
  background: #ffffff;
  border-color: var(--nilfish-border);
  color: var(--nilfish-primary);
}

.nilfish-theme-bookstore-page .btn-nilfish-secondary:hover,
.nilfish-theme-bookstore-page .btn-nilfish-secondary:focus {
  border-color: var(--nilfish-accent);
  color: var(--nilfish-primary);
}

.nilfish-theme-bookstore-page .nilfish-platform-visual {
  background: #ffffff;
  border: 1px solid var(--nilfish-border);
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.1);
}

.nilfish-theme-bookstore-page .nilfish-platform-header {
  border-bottom-color: var(--nilfish-border);
}

.nilfish-theme-bookstore-page .nilfish-platform-label {
  color: var(--nilfish-muted);
}

.nilfish-theme-bookstore-page .nilfish-platform-tile {
  background: rgba(var(--nilfish-accent-rgb), 0.08);
  border: 1px solid rgba(var(--nilfish-accent-rgb), 0.22);
}

.nilfish-theme-bookstore-page .nilfish-platform-tile strong {
  color: var(--nilfish-primary);
}

.nilfish-theme-bookstore-page .nilfish-platform-tile span {
  color: var(--nilfish-muted);
}

.nilfish-theme-bookstore-page .nilfish-platform-tile__icon {
  color: var(--nilfish-accent);
}

.nilfish-theme-bookstore-page .nilfish-platform-tagline {
  color: var(--nilfish-accent);
}

.nilfish-theme-bookstore-page .nilfish-home-trust {
  color: var(--nilfish-muted);
}

.nilfish-theme-bookstore-page .nilfish-cta-block {
  background: var(--nilfish-primary);
  border: none;
}

/* Bookstore tenant site — light surfaces + company colors */
[data-nilfish-theme="bookstore"] body {
  background: var(--nilfish-bg-light, #fdf6f7);
  color: var(--nilfish-body, #1e293b);
}

[data-nilfish-theme="bookstore"] .nilfish-home-hero {
  background: linear-gradient(
    160deg,
    #ffffff 0%,
    #f8d5dc 42%,
    #f0a8b4 72%,
    #fdf2f4 100%
  );
  color: var(--nilfish-primary);
}

[data-nilfish-theme="bookstore"] .nilfish-home-hero::before {
  background:
    linear-gradient(90deg, rgba(160, 40, 60, 0.08) 1px, transparent 1px),
    linear-gradient(rgba(160, 40, 60, 0.08) 1px, transparent 1px);
  background-size: 48px 48px;
  opacity: 0.7;
  mask-image: radial-gradient(ellipse 85% 75% at 70% 40%, black 25%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 85% 75% at 70% 40%, black 25%, transparent 78%);
}

[data-nilfish-theme="bookstore"] .nilfish-home-title,
[data-nilfish-theme="bookstore"] .nilfish-section-title {
  color: var(--nilfish-primary);
}

[data-nilfish-theme="bookstore"] .nilfish-home-lead {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="bookstore"] .nilfish-home-sub,
[data-nilfish-theme="bookstore"] .nilfish-home-trust,
[data-nilfish-theme="bookstore"] .nilfish-section-lead {
  color: var(--nilfish-muted);
}

[data-nilfish-theme="bookstore"] .nilfish-home-trust__check {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="bookstore"] .nilfish-home-section,
[data-nilfish-theme="bookstore"] .nilfish-home-features,
[data-nilfish-theme="bookstore"] .nilfish-home-categories {
  background: transparent;
}

[data-nilfish-theme="bookstore"] .nilfish-feature-card,
[data-nilfish-theme="bookstore"] .nilfish-home-card-muted,
[data-nilfish-theme="bookstore"] .nilfish-category-card {
  background: #ffffff;
  border: 1px solid var(--nilfish-border);
  color: var(--nilfish-body);
}

[data-nilfish-theme="bookstore"] .nilfish-feature-card h3,
[data-nilfish-theme="bookstore"] .nilfish-category-card h3,
[data-nilfish-theme="bookstore"] .nilfish-home-card-muted h3 {
  color: var(--nilfish-primary);
}

[data-nilfish-theme="bookstore"] .nilfish-feature-card p,
[data-nilfish-theme="bookstore"] .nilfish-category-card p {
  color: var(--nilfish-muted);
}

[data-nilfish-theme="bookstore"] .nilfish-cta-block {
  background: var(--nilfish-primary);
  border: none;
  color: #fff;
}

[data-nilfish-theme="bookstore"] .nilfish-cta-block h2 {
  color: #fff;
}

[data-nilfish-theme="bookstore"] .nilfish-cta-block p {
  color: rgba(255, 255, 255, 0.75);
}

[data-nilfish-theme="bookstore"] .btn-nilfish-ghost,
[data-nilfish-theme="bookstore"] a.btn-nilfish-ghost {
  color: var(--nilfish-primary);
  border-color: rgba(var(--nilfish-primary-rgb), 0.25);
}

[data-nilfish-theme="bookstore"] .nilfish-site-footer {
  background: linear-gradient(
    145deg,
    #0d1b2a 0%,
    #152a45 48%,
    #0d1b2a 100%
  );
}

[data-nilfish-theme="bookstore"] .nilfish-kicker {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="bookstore"] .nilfish-platform-visual {
  background: #ffffff;
  border: 1px solid var(--nilfish-border);
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.1);
}

[data-nilfish-theme="bookstore"] .nilfish-platform-header {
  border-bottom-color: var(--nilfish-border);
}

[data-nilfish-theme="bookstore"] .nilfish-platform-label {
  color: var(--nilfish-muted);
}

[data-nilfish-theme="bookstore"] .nilfish-platform-tile {
  background: rgba(var(--nilfish-accent-rgb), 0.1);
  border: 1px solid rgba(var(--nilfish-accent-rgb), 0.25);
}

[data-nilfish-theme="bookstore"] .nilfish-platform-tile strong {
  color: var(--nilfish-primary);
}

[data-nilfish-theme="bookstore"] .nilfish-platform-tile span {
  color: var(--nilfish-muted);
}

[data-nilfish-theme="bookstore"] .nilfish-platform-tile__icon {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="bookstore"] .nilfish-platform-tagline {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="bookstore"] .nilfish-home-problem {
  background: transparent;
}

[data-nilfish-theme="bookstore"] .nilfish-home-card-accent {
  background: linear-gradient(160deg, var(--nilfish-primary) 0%, #152a45 100%);
  border-color: rgba(var(--nilfish-accent-rgb), 0.35);
  color: #fff;
}

[data-nilfish-theme="bookstore"] .nilfish-home-flow {
  background: transparent;
}

[data-nilfish-theme="bookstore"] .nilfish-flow-panel {
  background: #ffffff;
  border: 1px solid var(--nilfish-border);
}

[data-nilfish-theme="bookstore"] .nilfish-flow-step {
  background: rgba(var(--nilfish-accent-rgb), 0.08);
  border-color: rgba(var(--nilfish-accent-rgb), 0.22);
}

[data-nilfish-theme="bookstore"] .nilfish-flow-step strong {
  color: var(--nilfish-primary);
}

[data-nilfish-theme="bookstore"] .nilfish-flow-step span,
[data-nilfish-theme="bookstore"] .nilfish-flow-footer {
  color: var(--nilfish-muted);
}

[data-nilfish-theme="bookstore"] .nilfish-flow-num {
  color: #0a0a0a;
}

[data-nilfish-theme="bookstore"] .nilfish-prose figure img,
[data-nilfish-theme="bookstore"] .nilfish-prose img {
  max-width: 100%;
  height: auto;
  border-radius: 0.75rem;
}

/* Plan builder — receipt / ticket cards (Meridian ledger inspo) */
.nilfish-plan-receipt {
  background: #0a0a0a;
  color: #e2e8f0;
  min-height: 70vh;
  padding: 3rem 0 4rem;
}

.nilfish-plan-receipt__header {
  text-align: center;
  margin-bottom: 2.5rem;
}

.nilfish-plan-receipt__meta {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #64748b;
  margin: 0 0 0.75rem;
}

.nilfish-plan-receipt__title {
  color: #f8fafc;
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin: 0;
}

.nilfish-plan-receipt__title em {
  font-style: italic;
  font-weight: 500;
  color: #cbd5e1;
}

.nilfish-plan-receipt__grid {
  display: grid;
  grid-gap: 1.25rem;
  gap: 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  align-items: stretch;
}

.nilfish-plan-ticket {
  position: relative;
  display: flex;
  flex-direction: column;
  background: #0a0a0a;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 2px;
  padding: 1.5rem 1.35rem 1.25rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.8rem;
  color: #cbd5e1;
}

.nilfish-plan-ticket--picked {
  background: #f8fafc;
  color: #0a0a0a;
  border-color: #f8fafc;
  box-shadow: 0 0 0 1px rgba(162, 198, 9, 0.35), 0 12px 40px rgba(0, 0, 0, 0.45);
}

.nilfish-plan-ticket__stamp {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  transform: rotate(8deg);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--nilfish-accent, #a2c609);
  border: 1px solid currentColor;
  padding: 0.15rem 0.4rem;
}

.nilfish-plan-ticket__pitch {
  font-family: var(--nilfish-font-sans);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
  color: inherit;
  margin: 0 0 1rem;
  max-width: 18ch;
}

.nilfish-plan-ticket--picked .nilfish-plan-ticket__pitch {
  color: #0a0a0a;
}

.nilfish-plan-ticket__includes {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.35);
  padding-top: 0.85rem;
}

.nilfish-plan-ticket--picked .nilfish-plan-ticket__includes {
  border-top-color: rgba(10, 10, 10, 0.15);
}

.nilfish-plan-ticket__includes li {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.28rem 0;
  border-bottom: 1px dotted rgba(148, 163, 184, 0.35);
}

.nilfish-plan-ticket--picked .nilfish-plan-ticket__includes li {
  border-bottom-color: rgba(10, 10, 10, 0.12);
}

.nilfish-plan-ticket__perf {
  margin: 1rem 0;
  height: 1px;
  border: none;
  border-top: 1px dashed rgba(148, 163, 184, 0.45);
  position: relative;
}

.nilfish-plan-ticket__perf::before,
.nilfish-plan-ticket__perf::after {
  content: "";
  position: absolute;
  top: -6px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #0a0a0a;
}

.nilfish-plan-ticket__perf::before {
  left: -1.6rem;
}

.nilfish-plan-ticket__perf::after {
  right: -1.6rem;
}

.nilfish-plan-ticket--picked .nilfish-plan-ticket__perf::before,
.nilfish-plan-ticket--picked .nilfish-plan-ticket__perf::after {
  background: #0a0a0a;
  box-shadow: 0 0 0 2px #f8fafc;
}

.nilfish-plan-ticket__totals {
  list-style: none;
  margin: 0;
  padding: 0;
}

.nilfish-plan-ticket__totals li {
  display: flex;
  justify-content: space-between;
  padding: 0.2rem 0;
}

.nilfish-plan-ticket__due {
  font-family: var(--nilfish-font-sans);
  font-size: 1.35rem;
  font-weight: 700;
  margin: 0.85rem 0 1rem;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.5rem;
}

.nilfish-plan-ticket__actions {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.nilfish-plan-ticket__barcode {
  margin-top: auto;
  padding-top: 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.45rem;
  color: #e2e8f0;
}

.nilfish-plan-ticket__barcode-svg {
  max-width: 11.5rem;
  height: auto;
  display: block;
}

.nilfish-plan-ticket__thanks {
  margin: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.7rem;
  letter-spacing: 0.04em;
  text-align: center;
  color: #94a3b8;
}

.nilfish-plan-ticket__footer {
  text-align: center;
  margin-top: 2rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}

.nilfish-plan-ticket__form {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

.nilfish-plan-ticket__form .nilfish-input {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.2);
  color: #f8fafc;
}

.nilfish-plan-ticket--picked .nilfish-plan-ticket__form .nilfish-input {
  background: #fff;
  border-color: rgba(10, 10, 10, 0.2);
  color: #0a0a0a;
}

.nilfish-plan-ticket__error {
  color: #f87171;
  font-size: 0.75rem;
  margin: 0;
}

.nilfish-plan-ticket--picked .nilfish-plan-ticket__error {
  color: #b91c1c;
}

/* ── ERP design kitchen sink ─────────────────────────────────────────────── */

.nilfish-design-sink__section {
  margin-bottom: 1.75rem;
}

.nilfish-design-sink__heading {
  margin: 0 0 0.75rem;
  font-size: 1rem;
  font-weight: 700;
  color: var(--nilfish-text, var(--nilfish-body));
}

.nilfish-design-sink__row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.nilfish-design-sink__bars {
  display: flex;
  align-items: flex-end;
  gap: 0.5rem;
  height: 7rem;
  padding: 0.5rem 0;
}

.nilfish-design-sink__bars > span {
  flex: 1 1;
  min-width: 0;
  border-radius: var(--nilfish-radius-md) var(--nilfish-radius-md) 0 0;
  background: var(--nilfish-accent);
  border: 1px solid var(--nilfish-accent);
}

/* Product Sold — compact sold qty by calendar year */
.nilfish-sold-history {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.nilfish-sold-year-bars {
  max-width: 28rem;
}

.nilfish-sold-year-bars__heading {
  margin-bottom: 0.35rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--nilfish-fg);
}

.nilfish-sold-year-bars__chart {
  display: flex;
  align-items: stretch;
  gap: 0.5rem;
  height: 8.5rem;
  padding: 0.15rem 0 0;
}

.nilfish-sold-year-bars__col {
  flex: 1 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
}

.nilfish-sold-year-bars__qty {
  font-size: 0.75rem;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
  color: var(--nilfish-muted);
  line-height: 1.2;
}

.nilfish-sold-year-bars__track {
  flex: 1 1 auto;
  width: 100%;
  display: flex;
  align-items: flex-end;
  min-height: 0;
}

.nilfish-sold-year-bars__bar {
  display: block;
  width: 100%;
  min-height: 0;
  border-radius: var(--nilfish-radius-md) var(--nilfish-radius-md) 0 0;
  background: var(--nilfish-accent);
  border: 1px solid var(--nilfish-accent);
  transition: height 0.2s ease;
}

.nilfish-sold-year-bars__year {
  font-size: 0.75rem;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
  color: var(--nilfish-muted);
  line-height: 1.2;
}

.nilfish-design-sink__donut {
  width: 7rem;
  height: 7rem;
  margin: 0.5rem auto;
  border-radius: 50%;
  background: conic-gradient(
    var(--nilfish-accent) 0 38%,
    var(--nilfish-border) 38% 62%,
    var(--nilfish-muted) 62% 100%
  );
  mask: radial-gradient(farthest-side, transparent calc(100% - 1.15rem), #000 calc(100% - 1.1rem));
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 1.15rem), #000 calc(100% - 1.1rem));
}


/* —— Platform presentation deck (/platform) —— */
.nilfish-platform-deck {
  max-width: 52rem;
  margin: 0 auto;
  padding: 1.5rem 1.25rem 4rem;
  color: var(--nilfish-text, #e8e8e8);
}

.nilfish-platform-deck__toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 1.25rem;
}

.nilfish-platform-deck__page {
  position: relative;
  padding: 2rem 0 3rem;
  border-bottom: 1px solid rgba(162, 198, 9, 0.25);
  page-break-inside: avoid;
  break-inside: avoid;
}

.nilfish-platform-deck__page:last-child {
  border-bottom: none;
}

.nilfish-platform-deck__page--cover {
  padding-top: 1rem;
}

.nilfish-platform-deck__kicker {
  margin: 0 0 0.5rem;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--nilfish-accent, #a2c609);
}

.nilfish-platform-deck__title {
  margin: 0 0 0.75rem;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  line-height: 1.15;
  font-weight: 700;
  color: #fff;
}

.nilfish-platform-deck__lead {
  margin: 0 0 0.75rem;
  font-size: 1.125rem;
  line-height: 1.45;
  max-width: 40rem;
  color: rgba(255, 255, 255, 0.88);
}

.nilfish-platform-deck__sub {
  margin: 0 0 1.5rem;
  font-size: 1rem;
  line-height: 1.45;
  max-width: 36rem;
  color: rgba(255, 255, 255, 0.65);
}

.nilfish-platform-deck__h3 {
  margin: 1.25rem 0 0.75rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--nilfish-accent, #a2c609);
}

.nilfish-platform-deck__art {
  display: block;
  width: 100%;
  max-width: 40rem;
  height: auto;
  margin: 1.5rem 0 0;
  border: 1px solid rgba(162, 198, 9, 0.35);
  border-radius: 4px;
  background: #0a0a0a;
}

.nilfish-platform-deck__art--side {
  max-width: 22rem;
  margin-top: 0;
}

.nilfish-platform-deck__art--compact {
  max-width: 28rem;
  margin-top: 1rem;
}

.nilfish-platform-deck__split {
  display: grid;
  grid-gap: 1.5rem;
  gap: 1.5rem;
  align-items: start;
}

@media (min-width: 720px) {
  .nilfish-platform-deck__split {
    grid-template-columns: 1fr minmax(14rem, 22rem);
  }
}

.nilfish-platform-deck__bullets {
  margin: 0;
  padding-left: 1.15rem;
  max-width: 36rem;
}

.nilfish-platform-deck__bullets li {
  margin-bottom: 0.55rem;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.88);
}

.nilfish-platform-deck__modules {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr));
  grid-gap: 0.5rem;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.nilfish-platform-deck__modules li {
  padding: 0.65rem 0.75rem;
  border: 1px solid rgba(162, 198, 9, 0.4);
  border-radius: 4px;
  background: rgba(162, 198, 9, 0.08);
  font-size: 0.875rem;
  font-weight: 600;
  color: #fff;
}

.nilfish-platform-deck__punch {
  margin: 1.25rem 0 0;
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--nilfish-accent, #a2c609);
}

.nilfish-platform-deck__cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
  margin: 1rem 0 1.25rem;
}

.nilfish-platform-deck__card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.85rem 0.9rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.04);
}

.nilfish-platform-deck__card strong {
  color: var(--nilfish-accent, #a2c609);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.nilfish-platform-deck__card span {
  font-size: 0.875rem;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.8);
}

.nilfish-platform-deck__tree {
  display: grid;
  grid-gap: 1rem;
  gap: 1rem;
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid rgba(162, 198, 9, 0.3);
  border-radius: 4px;
  background: #000000;
}

@media (min-width: 800px) {
  .nilfish-platform-deck__tree {
    grid-template-columns: 1fr auto 11rem;
    align-items: start;
  }
}

.nilfish-platform-deck__tree-divider {
  width: 1px;
  min-height: 100%;
  background: rgba(162, 198, 9, 0.35);
  justify-self: center;
}

.nilfish-platform-deck__tree-label {
  margin: 0 0 0.5rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 0.45);
}

.nilfish-platform-deck__tree-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

.nilfish-platform-deck__tree-node {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 6.5rem;
  padding: 0.5rem 0.6rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.05);
  font-size: 0.75rem;
}

.nilfish-platform-deck__tree-node strong {
  color: #fff;
  font-size: 0.8125rem;
}

.nilfish-platform-deck__tree-node span {
  color: rgba(255, 255, 255, 0.55);
}

.nilfish-platform-deck__tree-node--base {
  border-color: var(--nilfish-accent, #a2c609);
  background: var(--nilfish-accent, #a2c609);
  max-width: 14rem;
}

.nilfish-platform-deck__tree-node--base strong,
.nilfish-platform-deck__tree-node--base span {
  color: #0a0a0a;
}

.nilfish-platform-deck__tree-node--nested {
  background: rgba(255, 255, 255, 0.03);
}

.nilfish-platform-deck__tree-node--pack {
  border-color: var(--nilfish-accent, #a2c609);
  background: rgba(162, 198, 9, 0.12);
  margin-bottom: 0.5rem;
  width: 100%;
}

.nilfish-platform-deck__note {
  margin: 0.75rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.55);
  max-width: 40rem;
}

.nilfish-platform-deck__who {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
  margin: 1rem 0;
}

.nilfish-platform-deck__who-card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.9rem;
  border-left: 3px solid var(--nilfish-accent, #a2c609);
  background: rgba(255, 255, 255, 0.04);
}

.nilfish-platform-deck__who-card strong {
  color: #fff;
}

.nilfish-platform-deck__who-card span {
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.65);
}

.nilfish-platform-deck__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  margin-top: 1.5rem;
}

.nilfish-platform-deck__text-link {
  color: var(--nilfish-accent, #a2c609);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.nilfish-platform-deck__cta-print-only {
  display: none;
}

.nilfish-platform-deck__folio {
  margin: 2rem 0 0;
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.4);
}

@media print {
  .nilfish-no-print,
  .nilfish-site-header,
  .nilfish-site-nav,
  .nilfish-site-footer,
  header,
  footer,
  nav {
    display: none !important;
  }

  body {
    background: #fff !important;
    color: #0a0a0a !important;
  }

  .nilfish-platform-deck {
    max-width: none;
    padding: 0;
    color: #0a0a0a;
  }

  .nilfish-platform-deck__page {
    break-after: page;
    page-break-after: always;
    border-bottom: none;
    padding: 0.5cm 0 1cm;
    min-height: auto;
  }

  .nilfish-platform-deck__page:last-child {
    break-after: auto;
    page-break-after: auto;
  }

  .nilfish-platform-deck__title,
  .nilfish-platform-deck__lead,
  .nilfish-platform-deck__sub,
  .nilfish-platform-deck__bullets li,
  .nilfish-platform-deck__card span,
  .nilfish-platform-deck__who-card strong,
  .nilfish-platform-deck__modules li,
  .nilfish-platform-deck__tree-node strong {
    color: #0a0a0a !important;
  }

  .nilfish-platform-deck__kicker,
  .nilfish-platform-deck__punch,
  .nilfish-platform-deck__h3,
  .nilfish-platform-deck__card strong {
    color: #7a9607 !important;
  }

  .nilfish-platform-deck__art {
    border-color: #ccc;
    max-height: 9cm;
    object-fit: contain;
  }

  .nilfish-platform-deck__tree {
    background: #f5f5f5;
    border-color: #ccc;
  }

  .nilfish-platform-deck__tree-node--base {
    background: #a2c609 !important;
  }

  .nilfish-platform-deck__cta-print-only {
    display: block;
    margin-top: 1.5rem;
    font-weight: 600;
    color: #0a0a0a;
  }

  .nilfish-platform-deck__folio {
    color: #666 !important;
  }
}

/* Storefront chat handoff inbox (ERP) */
.nilfish-chat-thread {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  max-height: 28rem;
  overflow: auto;
  padding: 0.5rem 0;
}
.nilfish-chat-thread__msg {
  padding: 0.65rem 0.75rem;
  border-radius: 0.5rem;
  border: 1px solid var(--nilfish-border, #ddd);
  background: var(--nilfish-surface, #fff);
}
.nilfish-chat-thread__msg--user {
  border-color: color-mix(in srgb, var(--nilfish-accent, #c45c26) 35%, transparent);
}
.nilfish-chat-thread__msg--staff {
  background: color-mix(in srgb, var(--nilfish-accent, #c45c26) 8%, transparent);
}
.nilfish-chat-thread__msg--system {
  border-style: dashed;
  opacity: 0.85;
  font-size: 0.9rem;
}
.nilfish-chat-thread__meta {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.35rem;
  font-size: 0.8rem;
}
.nilfish-chat-thread__msg p {
  margin: 0;
  white-space: pre-wrap;
}
.nilfish-chat-thread__compose {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--nilfish-border, #ddd);
}
.nilfish-dl {
  display: grid;
  grid-template-columns: 8rem 1fr;
  grid-gap: 0.35rem 0.75rem;
  gap: 0.35rem 0.75rem;
  margin: 0;
}
.nilfish-dl dt {
  margin: 0;
  color: var(--nilfish-muted, #666);
  font-size: 0.85rem;
}
.nilfish-dl dd {
  margin: 0;
}

/* ── Storefront skin: Plasma (dark SaaS; inspo plasma-nextjs-template) ──
   Attribute on <html> (live) or studio canvas. Org Graphic design colors still tint accent/CTAs via inline vars. */
[data-storefront-skin="plasma"] {
  --nilfish-bg-light: #07070a;
  --nilfish-surface: #111116;
  --nilfish-surface-elevated: #1a1a22;
  --nilfish-card-bg: #16161d;
  --nilfish-body: #e8e8ed;
  --nilfish-muted: #9b9ba8;
  --nilfish-border: rgba(255, 255, 255, 0.14);
  --nilfish-heading: #f4f4f7;
  /* Light ink for dark chrome (nav). Forms use surface-elevated below — not this. */
  --nilfish-white: #f4f4f7;
  --nilfish-radius-md: 0.85rem;
  --nilfish-radius-lg: 1.15rem;
  --nilfish-shadow-card: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 18px 40px rgba(0, 0, 0, 0.45);
  color-scheme: dark;
}

[data-storefront-skin="plasma"] body {
  background: var(--nilfish-bg-light);
  color: var(--nilfish-body);
}

[data-storefront-skin="plasma"] .nilfish-site {
  background: var(--nilfish-bg-light);
  color: var(--nilfish-body);
}

[data-storefront-skin="plasma"] .nilfish-site-nav {
  background: rgba(10, 10, 14, 0.78);
  color: var(--nilfish-heading);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

[data-storefront-skin="plasma"] .nilfish-site-nav a {
  color: rgba(244, 244, 247, 0.88);
}

[data-storefront-skin="plasma"] .nilfish-site-nav--landing.is-compact {
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
}

/* Plasma: charcoal + slight warm orange (same intent as standard). */
[data-storefront-skin="plasma"] .nilfish-vehicle-banner {
  background:
    radial-gradient(
      ellipse 80% 140% at 12% 50%,
      rgba(var(--nilfish-vehicle-banner-accent-rgb, var(--nilfish-accent-rgb)), 0.22) 0%,
      transparent 58%
    ),
    linear-gradient(165deg, #161410 0%, #1c1814 48%, #12100e 100%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

[data-storefront-skin="plasma"] .nilfish-vehicle-banner__glow {
  background: radial-gradient(
    circle,
    rgba(var(--nilfish-vehicle-banner-accent-rgb, var(--nilfish-accent-rgb)), 0.16) 0%,
    transparent 65%
  );
}

/* Plasma: dropdown — full-bleed hover, square edges, orange left edge marker */
[data-storefront-skin="plasma"] .nilfish-site-nav__dropdown-panel {
  background: #111116;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5);
  padding: 0;
  gap: 0;
  border-radius: 0;
}

[data-storefront-skin="plasma"] .nilfish-mega-menu {
  background: #111116;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5);
}

[data-storefront-skin="plasma"] .nilfish-site-nav__dropdown-panel a,
[data-storefront-skin="plasma"] .nilfish-mega-menu a {
  position: relative;
  border-radius: 0;
  transition: background 0.15s ease, color 0.15s ease;
}

/* NOP-style: accent line expands from center on hover */
[data-storefront-skin="plasma"] .nilfish-site-nav__dropdown-panel a::before,
[data-storefront-skin="plasma"] .nilfish-mega-menu a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--nilfish-accent);
  transform: scaleY(0);
  transform-origin: center;
  transition: transform 0.22s ease;
  pointer-events: none;
}

[data-storefront-skin="plasma"] .nilfish-site-nav__dropdown-panel a.is-active,
[data-storefront-skin="plasma"] .nilfish-site-nav__dropdown-panel a:hover,
[data-storefront-skin="plasma"] .nilfish-mega-menu a:hover {
  background: #000000;
  color: #fff;
  opacity: 1;
  border-radius: 0;
  box-shadow: none;
}

[data-storefront-skin="plasma"] .nilfish-site-nav__dropdown-panel a.is-active::before,
[data-storefront-skin="plasma"] .nilfish-site-nav__dropdown-panel a:hover::before,
[data-storefront-skin="plasma"] .nilfish-mega-menu a:hover::before {
  transform: scaleY(1);
}

[data-storefront-skin="plasma"] .nilfish-site-nav__mobile-panel a:hover,
[data-storefront-skin="plasma"] .nilfish-site-nav__mobile-panel a.is-active {
  background: #000000;
  box-shadow: none;
  color: #fff;
}

[data-storefront-skin="plasma"] .nilfish-site-nav__mobile-panel a {
  position: relative;
}

[data-storefront-skin="plasma"] .nilfish-site-nav__mobile-panel a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--nilfish-accent);
  transform: scaleY(0);
  transform-origin: center;
  transition: transform 0.22s ease;
  pointer-events: none;
}

[data-storefront-skin="plasma"] .nilfish-site-nav__mobile-panel a:hover::before,
[data-storefront-skin="plasma"] .nilfish-site-nav__mobile-panel a.is-active::before {
  transform: scaleY(1);
}

[data-storefront-skin="plasma"] .nilfish-site-nav--storefront > .nilfish-site-nav__links > .nilfish-site-nav__link:hover,
[data-storefront-skin="plasma"] .nilfish-site-nav--storefront > .nilfish-site-nav__links > .nilfish-site-nav__dropdown:hover > .nilfish-site-nav__link,
[data-storefront-skin="plasma"] .nilfish-site-nav--storefront > .nilfish-site-nav__links > .nilfish-site-nav__mega-wrap:hover > a {
  color: #fff;
  opacity: 1;
  text-decoration: none;
  box-shadow: none;
}

[data-storefront-skin="plasma"] .nilfish-home-hero {
  background:
    radial-gradient(ellipse 70% 55% at 75% 15%, rgba(var(--nilfish-accent-rgb), 0.28), transparent 58%),
    radial-gradient(ellipse 50% 40% at 15% 80%, rgba(var(--nilfish-primary-rgb), 0.35), transparent 55%),
    linear-gradient(165deg, #0a0a10 0%, #101018 48%, #07070a 100%);
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-home-hero::before {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px);
  background-size: 56px 56px;
  opacity: 0.85;
  mask-image: radial-gradient(ellipse 75% 65% at 72% 35%, black 15%, transparent 72%);
  -webkit-mask-image: radial-gradient(ellipse 75% 65% at 72% 35%, black 15%, transparent 72%);
}

[data-storefront-skin="plasma"] .nilfish-home-title,
[data-storefront-skin="plasma"] .nilfish-section-title {
  color: #f4f4f7;
  letter-spacing: -0.035em;
}

[data-storefront-skin="plasma"] .nilfish-home-lead {
  color: var(--nilfish-accent);
}

[data-storefront-skin="plasma"] .nilfish-home-sub,
[data-storefront-skin="plasma"] .nilfish-home-trust,
[data-storefront-skin="plasma"] .nilfish-section-lead {
  color: var(--nilfish-muted);
}

[data-storefront-skin="plasma"] .nilfish-home-section,
[data-storefront-skin="plasma"] .nilfish-home-features,
[data-storefront-skin="plasma"] .nilfish-home-categories {
  background: transparent;
}

[data-storefront-skin="plasma"] .nilfish-section--highlight {
  background: rgba(255, 255, 255, 0.03);
  border-block: 1px solid rgba(255, 255, 255, 0.06);
}

[data-storefront-skin="plasma"] .nilfish-feature-card,
[data-storefront-skin="plasma"] .nilfish-category-card,
[data-storefront-skin="plasma"] .nilfish-home-card,
[data-storefront-skin="plasma"] .nilfish-home-card-muted,
[data-storefront-skin="plasma"] .nilfish-action-card,
[data-storefront-skin="plasma"] .nilfish-platform-visual {
  background: rgba(22, 22, 29, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--nilfish-radius-lg);
  box-shadow: var(--nilfish-shadow-card);
  color: var(--nilfish-body);
}

[data-storefront-skin="plasma"] .nilfish-feature-card:hover,
[data-storefront-skin="plasma"] .nilfish-category-card:hover,
[data-storefront-skin="plasma"] .nilfish-action-card:hover {
  border-color: rgba(var(--nilfish-accent-rgb), 0.45);
  transform: translateY(-2px);
}

[data-storefront-skin="plasma"] .nilfish-feature-card h3,
[data-storefront-skin="plasma"] .nilfish-category-card h3,
[data-storefront-skin="plasma"] .nilfish-home-card h3,
[data-storefront-skin="plasma"] .nilfish-home-card-muted h3 {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-feature-card p,
[data-storefront-skin="plasma"] .nilfish-category-card p {
  color: var(--nilfish-muted);
}

/* Plasma: legal / privacy reading column */
[data-storefront-skin="plasma"] .nilfish-legal-doc {
  color: var(--nilfish-body);
}

[data-storefront-skin="plasma"] .nilfish-legal-doc > .nilfish-pdp__title,
[data-storefront-skin="plasma"] .nilfish-legal-doc > .nilfish-home-title,
[data-storefront-skin="plasma"] .nilfish-legal-doc h2,
[data-storefront-skin="plasma"] .nilfish-legal-doc h3,
[data-storefront-skin="plasma"] .nilfish-legal-section h2,
[data-storefront-skin="plasma"] .nilfish-legal-section h3,
[data-storefront-skin="plasma"] .nilfish-legal-cat__label {
  color: var(--nilfish-heading);
}

[data-storefront-skin="plasma"] .nilfish-legal-lead {
  color: rgba(232, 232, 237, 0.9);
}

[data-storefront-skin="plasma"] .nilfish-legal-notice {
  background: rgba(var(--nilfish-accent-rgb), 0.12);
  border-left-color: var(--nilfish-accent);
  color: var(--nilfish-body);
}

[data-storefront-skin="plasma"] .nilfish-legal-section {
  border-top-color: rgba(255, 255, 255, 0.1);
}

[data-storefront-skin="plasma"] .nilfish-legal-cat {
  background: rgba(22, 22, 29, 0.92);
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: var(--nilfish-shadow-card);
}

[data-storefront-skin="plasma"] .nilfish-legal-cat p:last-child {
  color: var(--nilfish-muted);
}

[data-storefront-skin="plasma"] .nilfish-cta-block {
  background:
    radial-gradient(ellipse 80% 70% at 50% 0%, rgba(var(--nilfish-accent-rgb), 0.22), transparent 60%),
    linear-gradient(160deg, #12121a 0%, #0a0a10 100%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-cta-block h2 {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-cta-block p {
  color: rgba(244, 244, 247, 0.7);
}

[data-storefront-skin="plasma"] .nilfish-site .btn-nilfish-ghost,
[data-storefront-skin="plasma"] .nilfish-site a.btn-nilfish-ghost {
  color: #f4f4f7;
  border-color: rgba(255, 255, 255, 0.22);
  background: transparent;
}

[data-storefront-skin="plasma"] .nilfish-site .btn-nilfish-ghost:hover,
[data-storefront-skin="plasma"] .nilfish-site a.btn-nilfish-ghost:hover {
  border-color: rgba(var(--nilfish-accent-rgb), 0.55);
  background: rgba(255, 255, 255, 0.04);
}

[data-storefront-skin="plasma"] .nilfish-site-footer {
  background:
    radial-gradient(ellipse 60% 50% at 50% 0%, rgba(var(--nilfish-accent-rgb), 0.12), transparent 55%),
    linear-gradient(180deg, #0a0a10 0%, #050508 100%);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

[data-storefront-skin="plasma"] .nilfish-site-footer__heading {
  color: var(--nilfish-accent);
}

[data-storefront-skin="plasma"] .nilfish-site-footer__links a,
[data-storefront-skin="plasma"] .nilfish-site-footer__lead,
[data-storefront-skin="plasma"] .nilfish-site-footer__legal {
  color: rgba(244, 244, 247, 0.72);
}

[data-storefront-skin="plasma"] .nilfish-site-footer__input {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.12);
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-shop-card {
  background: rgba(22, 22, 29, 0.95);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--nilfish-body);
  box-shadow: none;
}

[data-storefront-skin="plasma"] .nilfish-shop-card:hover {
  border-color: rgba(var(--nilfish-accent-rgb), 0.4);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.4);
}

/* Dark wells so product cards match plasma panels (no bright white boxes) */
[data-storefront-skin="plasma"] .nilfish-shop-card__image,
[data-storefront-skin="plasma"] .o_wsale_cart__thumb,
[data-storefront-skin="plasma"] .nilfish-product-gallery__main,
[data-storefront-skin="plasma"] .nilfish-product-gallery__thumbs button {
  background: #16161d;
}

[data-storefront-skin="plasma"] .nilfish-shop-card__image img,
[data-storefront-skin="plasma"] .o_wsale_cart__thumb img,
[data-storefront-skin="plasma"] .nilfish-product-gallery__main img,
[data-storefront-skin="plasma"] .nilfish-product-gallery__thumbs img {
  object-fit: contain;
}

[data-storefront-skin="plasma"] .nilfish-shop-card__brand {
  color: var(--nilfish-muted);
}

[data-storefront-skin="plasma"] .nilfish-shop-card__title {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-shop-card__price {
  color: var(--nilfish-accent);
}

[data-storefront-skin="plasma"] .nilfish-catalog-panel {
  background: rgba(22, 22, 29, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
}

/* Storefront Card = same gray panel as catalog (no white islands) */
[data-storefront-skin="plasma"] .nilfish-site .nilfish-card {
  background: rgba(22, 22, 29, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
  color: #e8e8ed;
}

[data-storefront-skin="plasma"] .nilfish-site .nilfish-card__title {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-site .nilfish-card.nilfish-catalog-panel {
  /* Avoid double padding when both classes are used */
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
}

[data-storefront-skin="plasma"] .nilfish-catalog-panel__title,
[data-storefront-skin="plasma"] .nilfish-catalog-panel__heading,
[data-storefront-skin="plasma"] .nilfish-catalog-panel__body h2,
[data-storefront-skin="plasma"] .nilfish-catalog-panel__body h3,
[data-storefront-skin="plasma"] .nilfish-pdp__section-title {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-catalog-panel__body,
[data-storefront-skin="plasma"] .nilfish-catalog-panel__body p,
[data-storefront-skin="plasma"] .nilfish-catalog-panel__body.nilfish-prose {
  color: #d4d4dc;
}

[data-storefront-skin="plasma"] .nilfish-subcats__card {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.1);
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-subcats__card:hover {
  border-color: rgba(var(--nilfish-accent-rgb), 0.45);
  background: rgba(255, 255, 255, 0.07);
}

[data-storefront-skin="plasma"] .nilfish-pdp__title,
[data-storefront-skin="plasma"] .nilfish-pdp__compat-title,
[data-storefront-skin="plasma"] .nilfish-pdp__compat-catalog,
[data-storefront-skin="plasma"] .nilfish-pdp__compat-icon {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-pdp__price {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-pdp__price-campaign {
  color: var(--nilfish-accent);
}

[data-storefront-skin="plasma"] .nilfish-pdp__brand,
[data-storefront-skin="plasma"] .nilfish-pdp__sku,
[data-storefront-skin="plasma"] .nilfish-pdp__desc,
[data-storefront-skin="plasma"] .nilfish-pdp__short-desc,
[data-storefront-skin="plasma"] .nilfish-pdp__price-hint,
[data-storefront-skin="plasma"] .nilfish-pdp__price-list {
  color: var(--nilfish-muted);
}

[data-storefront-skin="plasma"] .nilfish-pdp__specs th,
[data-storefront-skin="plasma"] .nilfish-pdp__specs td {
  color: #e8e8ed;
  border-color: rgba(255, 255, 255, 0.1);
}

/* Vehicle financing: dark panel (not primary-tinted white) so labels stay readable */
[data-storefront-skin="plasma"] .nilfish-financing-calculator {
  background: rgba(22, 22, 29, 0.96);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: var(--nilfish-shadow-card);
  color: var(--nilfish-body);
}

[data-storefront-skin="plasma"] .nilfish-financing-calculator .nilfish-pdp__compat-title {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-financing-calculator__monthly {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-financing-calculator__monthly .nilfish-muted,
[data-storefront-skin="plasma"] .nilfish-financing-calculator .nilfish-muted,
[data-storefront-skin="plasma"] .nilfish-financing-calculator .nilfish-vehicle-pdp__hint {
  color: #b0b0bc;
}

[data-storefront-skin="plasma"] .nilfish-financing-calculator__meta,
[data-storefront-skin="plasma"] .nilfish-financing-calculator__meta strong {
  color: #e8e8ed;
}

[data-storefront-skin="plasma"] .nilfish-financing-calculator__terms {
  border-top-color: rgba(255, 255, 255, 0.12);
}

[data-storefront-skin="plasma"] .nilfish-financing-calculator__terms-title {
  color: var(--nilfish-accent);
}

[data-storefront-skin="plasma"] .nilfish-financing-calculator__borrow-warning {
  color: #b0b0bc;
}

[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__field {
  color: #e8e8ed;
}

[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__field > span:first-child,
[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__field strong {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__field input:not([type="range"]),
[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__field select,
[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__field textarea {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.16);
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__field select option {
  background: #16161d;
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__spec-row dt,
[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__hint {
  color: #b0b0bc;
}

[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__spec-row dd {
  color: #f4f4f7;
}

/* Accessory / alt cards: dark panels (not white) so name + price stay readable */
[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__alt-card {
  background: rgba(22, 22, 29, 0.95);
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: none;
  color: var(--nilfish-body);
}

[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__alt-card.is-selected {
  border-color: color-mix(in srgb, var(--nilfish-accent, #e85d04) 55%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--nilfish-accent, #e85d04) 35%, transparent);
}

[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__alt-media {
  background: linear-gradient(180deg, #1a1a24 0%, #121218 100%);
}

[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__alt-name {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-vehicle-pdp__alt-body .nilfish-muted {
  color: #c4c4d0;
}

[data-storefront-skin="plasma"] .nilfish-pdp__related-card {
  background: rgba(22, 22, 29, 0.95);
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--nilfish-body);
}

[data-storefront-skin="plasma"] .nilfish-pdp__related-thumb {
  background: linear-gradient(180deg, #1a1a24 0%, #121218 100%);
}

[data-storefront-skin="plasma"] .nilfish-pdp__related-name {
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-pdp__related-price {
  color: #c4c4d0;
}

[data-storefront-skin="plasma"] .nilfish-header-search__results,
[data-storefront-skin="plasma"] .o_wsale_cart_flyout {
  background: #16161d;
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--nilfish-body);
}

/* Plasma motion (respect reduced-motion) */
@keyframes nilfish-plasma-fade-up {
  from {
    opacity: 0;
    transform: translateY(1.1rem);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes nilfish-plasma-hero-glow {
  0%,
  100% {
    opacity: 0.7;
  }
  50% {
    opacity: 1;
  }
}

[data-storefront-skin="plasma"] .nilfish-home-hero-copy {
  animation: nilfish-plasma-fade-up 0.75s ease-out both;
}

[data-storefront-skin="plasma"] .nilfish-home-hero-aside {
  animation: nilfish-plasma-fade-up 0.85s 0.12s ease-out both;
}

[data-storefront-skin="plasma"] .nilfish-home-hero::before {
  animation: nilfish-plasma-hero-glow 8s ease-in-out infinite;
}

[data-storefront-skin="plasma"] .nilfish-feature-card,
[data-storefront-skin="plasma"] .nilfish-category-card,
[data-storefront-skin="plasma"] .nilfish-action-card {
  transition:
    transform 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease;
}

[data-storefront-skin="plasma"] .nilfish-home-visual,
[data-storefront-skin="plasma"] .nilfish-home-visual__bg {
  transition: transform 0.7s ease;
}

[data-storefront-skin="plasma"] .nilfish-home-visual:hover .nilfish-home-visual__bg {
  transform: scale(1.03);
}

[data-storefront-skin="plasma"] .nilfish-cta-block {
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

[data-storefront-skin="plasma"] .nilfish-cta-block:hover {
  box-shadow: 0 0 0 1px rgba(var(--nilfish-accent-rgb), 0.35), 0 20px 48px rgba(0, 0, 0, 0.35);
}

@media (prefers-reduced-motion: reduce) {
  [data-storefront-skin="plasma"] .nilfish-home-hero-copy,
  [data-storefront-skin="plasma"] .nilfish-home-hero-aside,
  [data-storefront-skin="plasma"] .nilfish-home-hero::before {
    animation: none;
  }

  [data-storefront-skin="plasma"] .nilfish-home-visual:hover .nilfish-home-visual__bg {
    transform: none;
  }
}

/* Plasma: dark form controls (shop filters, selects, secondary buttons) */
[data-storefront-skin="plasma"] .nilfish-site .nilfish-input,
[data-storefront-skin="plasma"] .nilfish-site .nilfish-textarea,
[data-storefront-skin="plasma"] .nilfish-workshop-book .nilfish-input,
[data-storefront-skin="plasma"] .nilfish-workshop-book .nilfish-textarea,
[data-storefront-skin="plasma"] .nilfish-workshop-book select {
  background: #121218;
  border-color: rgba(255, 255, 255, 0.22);
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-site .nilfish-input::placeholder,
[data-storefront-skin="plasma"] .nilfish-workshop-book .nilfish-input::placeholder {
  color: #c4c4d0;
  opacity: 1;
}

[data-storefront-skin="plasma"] .nilfish-site .nilfish-input option,
[data-storefront-skin="plasma"] .nilfish-workshop-book .nilfish-input option,
[data-storefront-skin="plasma"] .nilfish-workshop-book select option {
  background: #16161d;
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-site .btn-nilfish-secondary,
[data-storefront-skin="plasma"] .nilfish-workshop-book .btn-nilfish-secondary {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-site .btn-nilfish-secondary:hover,
[data-storefront-skin="plasma"] .nilfish-site .btn-nilfish-secondary:focus,
[data-storefront-skin="plasma"] .nilfish-workshop-book .btn-nilfish-secondary:hover,
[data-storefront-skin="plasma"] .nilfish-workshop-book .btn-nilfish-secondary:focus {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(var(--nilfish-accent-rgb), 0.55);
  color: #f4f4f7;
}

/* Plasma: workshop booking shell */
[data-storefront-skin="plasma"] .nilfish-workshop-book {
  --nilfish-book-bg: #07070a;
  --nilfish-book-card: #16161d;
  --nilfish-book-border: rgba(255, 255, 255, 0.12);
  --nilfish-book-text: #f4f4f7;
  --nilfish-book-muted: #b0b0bc;
  --nilfish-book-accent: var(--nilfish-accent, #c45a12);
  background: var(--nilfish-book-bg);
  color: var(--nilfish-book-text);
}

[data-storefront-skin="plasma"] .nilfish-book-card,
[data-storefront-skin="plasma"] .nilfish-book-summary {
  background: var(--nilfish-book-card);
  border-color: var(--nilfish-book-border);
  box-shadow: var(--nilfish-shadow-card);
}

[data-storefront-skin="plasma"] .nilfish-book-cancel-icon {
  background: var(--nilfish-surface-elevated);
  border-color: var(--nilfish-book-border);
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-book-package {
  background: rgba(255, 255, 255, 0.04);
  border-color: var(--nilfish-book-border);
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-book-package:hover,
[data-storefront-skin="plasma"] .nilfish-book-package:focus,
[data-storefront-skin="plasma"] .nilfish-book-package.is-selected {
  border-color: var(--nilfish-book-accent);
  background: color-mix(in srgb, var(--nilfish-book-accent) 12%, #16161d);
}

[data-storefront-skin="plasma"] .nilfish-book-cal {
  --nilfish-book-surface: #111116;
  --nilfish-book-card: #16161d;
  --nilfish-book-border: rgba(255, 255, 255, 0.12);
  --nilfish-book-text: #f4f4f7;
  --nilfish-book-muted: #b0b0bc;
}

[data-storefront-skin="plasma"] .nilfish-book-cal__time {
  background: var(--nilfish-surface-elevated);
  border-color: var(--nilfish-book-border);
  color: #f4f4f7;
}

[data-storefront-skin="plasma"] .nilfish-book-cal__time:hover {
  background: color-mix(in srgb, var(--nilfish-book-accent) 18%, #1a1a22);
  border-color: var(--nilfish-book-accent);
}

[data-storefront-skin="plasma"] .nilfish-book-cal__time.is-selected {
  background: var(--nilfish-book-accent);
  border-color: var(--nilfish-book-accent);
  color: #fff;
}

[data-storefront-skin="plasma"] .nilfish-book-cal__time.is-selected .nilfish-book-cal__time-mechanic {
  color: rgba(255, 255, 255, 0.85);
}

[data-storefront-skin="plasma"] .nilfish-book-cal__mechanic-option.is-selected {
  background: color-mix(in srgb, var(--nilfish-book-accent) 16%, var(--nilfish-book-card));
  border-color: color-mix(in srgb, var(--nilfish-book-accent) 40%, var(--nilfish-book-border));
}

[data-storefront-skin="plasma"] .nilfish-page-header h1,
[data-storefront-skin="plasma"] .nilfish-site-main > h1 {
  color: #f4f4f7;
}


/* --- POS PWA shell (shared via @nilfish/ui - do not duplicate in pos/pwa) --- */

html.nilfish-pos {
  --nilfish-pos-panel: var(--nilfish-surface);
  --nilfish-pos-input-bg: var(--nilfish-surface-elevated);
  --nilfish-warn: #d39e00;
  --nilfish-ok: #1b7a3d;
  --nilfish-navbar-height: 46px;
  /* Match ERP .btn-nilfish-primary (accent), not powersport navy --nilfish-btn-primary-bg */
  --nilfish-btn-primary-bg: var(--nilfish-accent);
  --nilfish-btn-primary-text: #ffffff;
  --nilfish-btn-primary-hover: var(--nilfish-accent-hover);
}

html.nilfish-pos * { box-sizing: border-box; }

html.nilfish-pos,
html.nilfish-pos body {
  margin: 0;
  min-height: 100%;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  background: var(--nilfish-bg);
  color: var(--nilfish-text);
  font-family: var(--nilfish-font-sans);
  -webkit-font-smoothing: antialiased;
}

html.nilfish-pos button,
html.nilfish-pos input,
html.nilfish-pos select { font: inherit; }

html.nilfish-pos button { cursor: pointer; }

html.nilfish-pos .app {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
  width: 100%;
  max-width: min(1400px, 100%);
  margin: 0 auto;
  min-width: 0;
}

html.nilfish-pos .session-chrome {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  min-width: 0;
  max-width: 100%;
}

html.nilfish-pos .session-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.85rem;
  align-items: center;
  padding: 0.35rem 1rem;
  min-height: var(--nilfish-navbar-height);
  height: auto;
  background: var(--nilfish-primary);
  color: var(--nilfish-navbar-text, #fff);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  overflow: hidden;
  min-width: 0;
  max-width: 100%;
}

html.nilfish-pos .session-bar strong {
  color: var(--nilfish-navbar-text, #fff);
  font-size: 0.9375rem;
  font-weight: 700;
  white-space: nowrap;
  flex: 0 0 auto;
}

html.nilfish-pos .session-bar .muted {
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.8rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

html.nilfish-pos .session-bar .cashier-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex: 0 0 auto;
}

html.nilfish-pos .session-bar .cashier-wrap[hidden] { display: none !important; }

html.nilfish-pos .session-bar .cashier-wrap label {
  font-size: 0.75rem;
  white-space: nowrap;
  color: rgba(255, 255, 255, 0.72);
}

html.nilfish-pos .session-bar .cashier-wrap select {
  min-width: 8rem;
  max-width: 11rem;
  width: auto;
  height: 1.75rem;
  padding: 0.15rem 0.45rem;
  font-size: 0.8rem;
  line-height: 1.2;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  color-scheme: dark;
}

html.nilfish-pos .session-bar .cashier-wrap select:focus {
  outline: 2px solid var(--nilfish-accent);
  outline-offset: 0;
}

html.nilfish-pos .session-bar .cashier-wrap select option {
  background-color: #1a1a1a;
  color: #e8eaed;
}

html.nilfish-pos[data-color-scheme="light"] .session-bar .cashier-wrap select { color-scheme: light; }
html.nilfish-pos[data-color-scheme="light"] .session-bar .cashier-wrap select option {
  background-color: #ffffff;
  color: #0d1b2a;
}

html.nilfish-pos .session-bar .badge {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.15);
  color: #fff;
  font-size: 0.7rem;
  padding: 0.1rem 0.4rem;
}

html.nilfish-pos .session-bar .session-bar__link {
  height: 1.75rem;
  padding: 0 0.55rem;
  font-size: 0.8rem;
  border: none;
  background: transparent;
  color: rgba(255, 255, 255, 0.85);
  border-radius: 6px;
  text-decoration: none;
  font-weight: 500;
}

html.nilfish-pos .session-bar .session-bar__link:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border-color: transparent;
}

html.nilfish-pos .session-bar__systray {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex: 0 0 auto;
  margin-left: 0.25rem;
}

/* font: inherit on POS buttons would blow past shared .nilfish-lang-switch__btn size */
html.nilfish-pos .session-bar__systray .nilfish-lang-switch__btn {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.2;
  padding: 0.25rem 0.45rem;
}

html.nilfish-pos .session-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
  padding: 0.4rem 1rem;
  background: var(--nilfish-surface);
  border-bottom: 1px solid var(--nilfish-border);
  min-width: 0;
  max-width: 100%;
}

html.nilfish-pos .session-toolbar .btn-nilfish-primary,
html.nilfish-pos .session-toolbar .btn-nilfish-secondary,
html.nilfish-pos .session-toolbar .btn-nilfish-danger {
  flex: 0 1 auto;
  min-width: 0;
  padding: 0.35rem 0.7rem;
  font-size: 0.8125rem;
}

html.nilfish-pos .session-toolbar .btn-nilfish-primary[hidden],
html.nilfish-pos .session-toolbar .btn-nilfish-secondary[hidden],
html.nilfish-pos .session-toolbar .btn-nilfish-danger[hidden] {
  display: none !important;
}

html.nilfish-pos .session-lamp {
  width: 0.65rem;
  height: 0.65rem;
  border-radius: 50%;
  flex: 0 0 auto;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.12);
}

html.nilfish-pos .session-lamp--on {
  background: #22c55e;
  box-shadow: 0 0 8px rgba(34, 197, 94, 0.55), 0 0 0 2px rgba(255, 255, 255, 0.12);
}

html.nilfish-pos .session-lamp--off {
  background: #ef4444;
  box-shadow: 0 0 8px rgba(239, 68, 68, 0.45), 0 0 0 2px rgba(255, 255, 255, 0.12);
}

html.nilfish-pos .session-toolbar .nilfish-doc-actions-menu {
  flex: 0 0 auto;
  margin-left: auto;
  order: 0;
}

html.nilfish-pos .session-toolbar .nilfish-doc-actions-menu__trigger {
  min-width: 2.25rem;
  letter-spacing: 0.08em;
  font-weight: 700;
  text-decoration: none;
}

html.nilfish-pos .badge {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-pos-input-bg);
  border: 1px solid var(--nilfish-border);
  font-size: 0.8rem;
  letter-spacing: 0.02em;
}

html.nilfish-pos .badge--practice {
  background: var(--nilfish-warn);
  border-color: var(--nilfish-warn);
  color: #1a1a1a;
}

html.nilfish-pos .badge--vmb {
  background: #2a5a8a;
  border-color: #2a5a8a;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  vertical-align: middle;
  margin-left: 0.25rem;
}

html.nilfish-pos .main {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  grid-gap: 0;
  gap: 0;
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  align-items: stretch;
}

@media (max-width: 960px) {
  html.nilfish-pos .main { grid-template-columns: minmax(0, 1fr); }
  html.nilfish-pos .panel {
    border-right: none;
    border-bottom: 1px solid var(--nilfish-border);
  }
  html.nilfish-pos .panel:last-child { border-bottom: none; }
}

html.nilfish-pos .panel {
  padding: 1rem;
  border-right: 1px solid var(--nilfish-border);
  overflow: visible;
  min-width: 0;
  max-width: 100%;
}

html.nilfish-pos .panel:last-child {
  border-right: none;
  background: var(--nilfish-pos-panel);
}

html.nilfish-pos #cartPanel.panel--cart {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

html.nilfish-pos #cartPanel .lines-scroll {
  flex: 1 1 auto;
}

html.nilfish-pos .cart-pay {
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--nilfish-border);
  flex: 0 0 auto;
}

html.nilfish-pos .cart-pay__title {
  margin: 0 0 0.5rem;
  font-size: 1rem;
  font-weight: 600;
}

html.nilfish-pos #btnPay {
  width: 100%;
  margin-top: 0.75rem;
  padding: 0.85rem;
  max-width: 100%;
  box-sizing: border-box;
}

html.nilfish-pos .panel--browse {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  min-height: 0;
  background: var(--nilfish-pos-panel);
}

html.nilfish-pos .browse-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

html.nilfish-pos .browse-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
}

html.nilfish-pos .browse-search {
  flex: 0 0 auto;
}

html.nilfish-pos .browse-filters {
  margin: 0;
  min-width: 0;
}

html.nilfish-pos .browse-hint {
  margin: 0;
  font-size: 0.75rem;
}

html.nilfish-pos .browse-results {
  flex: 1 1 auto;
  min-height: 8rem;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

html.nilfish-pos .browse-results--grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
  grid-gap: 0.5rem;
  gap: 0.5rem;
  align-content: start;
}

html.nilfish-pos .browse-results--list {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

html.nilfish-pos .browse-tile {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 0.5rem;
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  background: var(--nilfish-pos-input-bg);
  color: inherit;
  text-align: left;
  cursor: pointer;
  min-width: 0;
  transition: border-color 0.12s, background-color 0.12s;
}

html.nilfish-pos .browse-tile:hover,
html.nilfish-pos .browse-tile:focus-visible {
  border-color: var(--nilfish-accent);
  outline: none;
}

html.nilfish-pos .browse-tile:active {
  background: color-mix(in srgb, var(--nilfish-accent) 14%, var(--nilfish-pos-input-bg));
}

html.nilfish-pos .browse-tile__img {
  aspect-ratio: 1;
  width: 100%;
  border-radius: calc(var(--nilfish-radius-md) - 2px);
  background: var(--nilfish-surface);
  object-fit: cover;
  display: block;
}

html.nilfish-pos .browse-tile__img--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--nilfish-muted);
  font-size: 0.7rem;
}

html.nilfish-pos .browse-tile__name {
  font-size: 0.8rem;
  font-weight: 550;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

html.nilfish-pos .browse-tile__meta {
  display: flex;
  justify-content: space-between;
  gap: 0.35rem;
  font-size: 0.7rem;
  color: var(--nilfish-muted);
}

html.nilfish-pos .browse-tile__price {
  color: var(--nilfish-text);
  font-weight: 600;
}

html.nilfish-pos .browse-results--list .browse-tile {
  flex-direction: row;
  align-items: center;
  gap: 0.65rem;
  padding: 0.45rem 0.55rem;
}

html.nilfish-pos .browse-results--list .browse-tile__img,
html.nilfish-pos .browse-results--list .browse-tile__img--empty {
  width: 2.75rem;
  height: 2.75rem;
  aspect-ratio: auto;
  flex: 0 0 auto;
}

html.nilfish-pos .browse-results--list .browse-tile__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

html.nilfish-pos .browse-results--list .browse-tile__name {
  -webkit-line-clamp: 1;
}

html.nilfish-pos .browse-empty {
  margin: 0.5rem 0 0;
  font-size: 0.85rem;
}

html.nilfish-pos .row {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 0.75rem;
  min-width: 0;
  max-width: 100%;
}

html.nilfish-pos .row > .btn-nilfish-primary,
html.nilfish-pos .row > .btn-nilfish-secondary,
html.nilfish-pos .row > .btn-nilfish-danger {
  flex: 1 1 auto;
  min-width: min(100%, 7.5rem);
  max-width: 100%;
}

html.nilfish-pos .row--customer {
  position: relative;
  z-index: 40;
  overflow: visible;
}

html.nilfish-pos .grow { flex: 1 1 8rem; min-width: 0; }

html.nilfish-pos label.field {
  display: block;
  font-size: 0.8rem;
  color: var(--nilfish-muted);
  margin-bottom: 0.25rem;
}

/* Compact controls in POS shell (same tokens as ERP chrome). */
html.nilfish-pos .btn-nilfish-primary,
html.nilfish-pos .btn-nilfish-secondary,
html.nilfish-pos .btn-nilfish-danger {
  padding: 0.5rem 1rem;
  font-size: 0.9375rem;
}

html.nilfish-pos .nilfish-input,
html.nilfish-pos .nilfish-textarea,
html.nilfish-pos select.nilfish-input {
  background: var(--nilfish-pos-input-bg);
  color: var(--nilfish-text);
}

html.nilfish-pos .lines-scroll {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  margin-bottom: 0.5rem;
}

html.nilfish-pos table.lines {
  width: 100%;
  min-width: 28rem;
  border-collapse: collapse;
  font-size: 0.95rem;
  table-layout: fixed;
}

html.nilfish-pos table.lines th,
html.nilfish-pos table.lines td {
  text-align: left;
  padding: 0.4rem 0.35rem;
  border-bottom: 1px solid var(--nilfish-border);
  vertical-align: top;
}

html.nilfish-pos table.lines th {
  color: var(--nilfish-muted);
  font-weight: 500;
  font-size: 0.8rem;
}

html.nilfish-pos table.lines td:nth-child(2) {
  overflow-wrap: anywhere;
  word-break: break-word;
}

html.nilfish-pos .warn { color: var(--nilfish-warn); font-size: 0.8rem; }
html.nilfish-pos .stock-note { color: var(--nilfish-muted); font-size: 0.8rem; }
html.nilfish-pos .error { color: var(--nilfish-danger); }
html.nilfish-pos .muted { color: var(--nilfish-muted); }

html.nilfish-pos .nilfish-entity-search__list--portal[hidden] {
  display: none !important;
}

html.nilfish-pos .nilfish-entity-search__option {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.15rem;
}

html.nilfish-pos .nilfish-entity-search__option .suggest-title { font-weight: 600; }
html.nilfish-pos .nilfish-entity-search__option .suggest-sub {
  font-size: 0.85em;
  color: var(--nilfish-muted);
}

html.nilfish-pos .customer-value-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.15rem;
}

html.nilfish-pos .customer-value-row .customer-value-btn {
  border: none;
  background: transparent;
  color: var(--nilfish-heading, var(--nilfish-text));
  font-weight: 700;
  font-size: 1rem;
  padding: 0.25rem 0.1rem;
  text-align: left;
  cursor: pointer;
}

html.nilfish-pos .customer-value-row .customer-value-btn:hover { color: var(--nilfish-accent); }

html.nilfish-pos .customer-search-wrap[hidden],
html.nilfish-pos .customer-value-row[hidden] { display: none !important; }

html.nilfish-pos .customer-search-row {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

html.nilfish-pos .customer-search-row .nilfish-input {
  flex: 1 1;
  min-width: 0;
}

html.nilfish-pos .sku-wrap,
html.nilfish-pos .customer-wrap {
  position: relative;
  overflow: visible;
}

html.nilfish-pos .totals {
  margin-top: 0.35rem;
  font-size: 1.35rem;
  font-weight: 600;
}

html.nilfish-pos .tenders {
  display: grid;
  grid-gap: 0.5rem;
  gap: 0.5rem;
  min-width: 0;
  max-width: 100%;
}

html.nilfish-pos .tender-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-gap: 0.4rem;
  gap: 0.4rem;
  align-items: center;
  min-width: 0;
  max-width: 100%;
}

@media (min-width: 420px) {
  html.nilfish-pos .tender-row {
    grid-template-columns: minmax(5.5rem, 7rem) minmax(0, 1fr) auto;
  }
}

html.nilfish-pos .footer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  border-top: 1px solid var(--nilfish-border);
  background: var(--nilfish-surface);
}

html.nilfish-pos .modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.55);
  padding: 1rem;
}

html.nilfish-pos .modal[hidden] { display: none; }

html.nilfish-pos .modal__panel {
  background: var(--nilfish-pos-panel);
  border: 1px solid var(--nilfish-border);
  border-radius: var(--nilfish-radius-md);
  padding: 1.25rem;
  width: min(480px, 100%);
  max-height: 90vh;
  overflow: auto;
}

html.nilfish-pos .modal__panel h2 {
  margin: 0 0 0.5rem;
  font-size: 1.15rem;
  color: var(--nilfish-heading, var(--nilfish-text));
}

html.nilfish-pos .modal--block .modal__panel { border-color: var(--nilfish-danger); }

html.nilfish-pos .stack > * + * { margin-top: 0.65rem; }

html.nilfish-pos .mark-large {
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--nilfish-warn);
  text-align: center;
  margin: 0.5rem 0;
}

html.nilfish-pos .pending-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

html.nilfish-pos .pending-count {
  background: var(--nilfish-accent);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  min-width: 1.25rem;
  text-align: center;
  border-radius: 999px;
  padding: 0.05rem 0.35rem;
}

html.nilfish-pos .receipt-view {
  font-family: "Consolas", "Courier New", monospace;
  font-size: 0.9rem;
  line-height: 1.35;
  background: #fff;
  color: #111;
  padding: 1rem;
  border-radius: 4px;
}

html.nilfish-pos .receipt-view .mark-print {
  font-size: 2.8rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-align: center;
  margin: 0.5rem 0 0.15rem;
  text-transform: uppercase;
  line-height: 1.1;
  color: #000;
}

html.nilfish-pos .receipt-view .mark-print-sub {
  font-size: 1.1rem;
  font-weight: 700;
  text-align: center;
  margin: 0 0 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

html.nilfish-pos .receipt-view .receipt-total {
  font-size: 1.35rem;
  font-weight: 700;
  margin-top: 0.75rem;
}

html.nilfish-pos .receipt-view table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.5rem 0;
}

html.nilfish-pos .receipt-view td,
html.nilfish-pos .receipt-view th {
  padding: 0.2rem 0;
  border-bottom: 1px dotted #ccc;
  text-align: left;
}

html.nilfish-pos .receipt-view .right { text-align: right; }
html.nilfish-pos .receipt-view .meta {
  font-size: 0.8rem;
  color: #444;
  margin-top: 0.75rem;
}

html.nilfish-pos .cart-summary {
  margin-top: 0.75rem;
  padding-top: 0.25rem;
}

html.nilfish-pos .cart-summary__breakdown { margin-bottom: 0.35rem; }

html.nilfish-pos .cart-summary__row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: var(--nilfish-muted);
  font-size: 0.95rem;
}

html.nilfish-pos .modal__panel--receipt { width: min(480px, 100%); }

html.nilfish-pos .already-open {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100%;
  padding: 2rem;
  text-align: center;
  font-size: 1.1rem;
}

@media print {
  html.nilfish-pos body * { visibility: hidden !important; }
  html.nilfish-pos #modalReceipt,
  html.nilfish-pos #modalReceipt * { visibility: visible !important; }
  html.nilfish-pos #modalReceipt {
    position: absolute;
    inset: 0;
    background: #fff;
    display: block !important;
    padding: 0;
    margin: 0;
  }
  html.nilfish-pos #modalReceipt .modal__panel {
    border: 0;
    box-shadow: none;
    width: 100%;
    max-height: none;
    padding: 0;
    background: #fff;
    color: #000;
  }
  html.nilfish-pos #modalReceipt .no-print { display: none !important; }
  html.nilfish-pos .receipt-view .mark-print { font-size: 32pt; font-weight: 900; }
  html.nilfish-pos .receipt-view .mark-print-sub { font-size: 14pt; font-weight: 700; }
  html.nilfish-pos .receipt-view .receipt-total { font-size: 14pt; }
}

/* �� Public cookie consent (EU ePrivacy / GDPR) �� */
.nilfish-cookie-consent {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 10050;
  pointer-events: none;
  padding: 1rem;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.nilfish-cookie-consent--settled {
  inset: auto auto 1rem 1rem;
  padding: 0;
  justify-content: flex-start;
}

@media (max-width: 560px) {
  .nilfish-cookie-consent--settled {
    /* Sit above footer legal / home indicator; footer adds matching bottom pad */
    inset: auto auto max(0.75rem, env(safe-area-inset-bottom, 0px)) 0.75rem;
  }
}

.nilfish-cookie-consent__panel {
  pointer-events: auto;
  width: min(40rem, 100%);
  background: #141820;
  color: #f2f4f7;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  padding: 1.1rem 1.2rem 1.15rem;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
}

.nilfish-cookie-consent__title {
  margin: 0 0 0.4rem;
  font-size: 1.05rem;
  font-weight: 650;
  letter-spacing: -0.01em;
}

.nilfish-cookie-consent__lead {
  margin: 0 0 0.9rem;
  font-size: 0.9rem;
  line-height: 1.45;
  color: rgba(242, 244, 247, 0.88);
}

.nilfish-cookie-consent__link {
  color: #9ec5ff;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.nilfish-cookie-consent__cats {
  margin: 0 0 0.9rem;
  padding: 0;
  border: 0;
  display: grid;
  grid-gap: 0.65rem;
  gap: 0.65rem;
}

.nilfish-cookie-consent__legend {
  padding: 0;
  margin: 0 0 0.25rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: rgba(242, 244, 247, 0.7);
}

.nilfish-cookie-consent__cat {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-gap: 0.65rem;
  gap: 0.65rem;
  align-items: start;
  font-size: 0.88rem;
  line-height: 1.35;
  cursor: pointer;
}

.nilfish-cookie-consent__cat input {
  margin-top: 0.2rem;
}

.nilfish-cookie-consent__cat-help {
  display: block;
  margin-top: 0.15rem;
  color: rgba(242, 244, 247, 0.65);
  font-size: 0.8rem;
  font-weight: 400;
}

.nilfish-cookie-consent__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.nilfish-cookie-consent__btn {
  pointer-events: auto;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border-radius: 8px;
  border: 1px solid transparent;
  padding: 0.55rem 0.9rem;
  font: inherit;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  min-height: 2.4rem;
}

.nilfish-cookie-consent__btn--reject,
.nilfish-cookie-consent__btn--accept {
  flex: 1 1 8rem;
}

.nilfish-cookie-consent__btn--reject {
  background: transparent;
  color: #f2f4f7;
  border-color: rgba(255, 255, 255, 0.35);
}

.nilfish-cookie-consent__btn--accept {
  background: #f2f4f7;
  color: #141820;
}

.nilfish-cookie-consent__btn--ghost {
  background: transparent;
  color: rgba(242, 244, 247, 0.9);
  border-color: transparent;
  text-decoration: underline;
  text-underline-offset: 2px;
  font-weight: 500;
}

.nilfish-cookie-consent__reopen {
  pointer-events: auto;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid rgba(20, 24, 32, 0.18);
  background: #fff;
  color: #141820;
  border-radius: 999px;
  padding: 0.45rem 0.85rem;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

@media (max-width: 520px) {
  .nilfish-cookie-consent__actions {
    flex-direction: column;
  }
  .nilfish-cookie-consent__btn--reject,
  .nilfish-cookie-consent__btn--accept,
  .nilfish-cookie-consent__btn--ghost {
    flex: 1 1 auto;
    width: 100%;
  }
}

/* Master-site journey demo showcase — full-bleed dark band + DEMO watermark */
.nilfish-demo-showcase {
  --nilfish-demo-fg: #f4f6f8;
  --nilfish-demo-muted: rgba(244, 246, 248, 0.72);
  position: relative;
  display: flex;
  align-items: center;
  isolate: isolate;
  overflow: hidden;
  min-height: clamp(28rem, 72vh, 56rem);
  color: var(--nilfish-demo-fg);
  background: #07090c;
}

.nilfish-demo-showcase__media {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.nilfish-demo-showcase__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Soft sketch wash — assets are already lightly sketched */
  filter: brightness(0.5) contrast(1.06) saturate(0.7);
  transform: scale(1.04);
}

.nilfish-demo-showcase__shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(105deg, rgba(7, 9, 12, 0.88) 0%, rgba(7, 9, 12, 0.55) 42%, rgba(7, 9, 12, 0.72) 100%),
    linear-gradient(180deg, rgba(7, 9, 12, 0.55) 0%, transparent 28%, transparent 68%, rgba(7, 9, 12, 0.75) 100%);
  pointer-events: none;
}

.nilfish-demo-showcase__watermark {
  position: absolute;
  left: auto;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin: 0;
  padding: 0 clamp(1rem, 4vw, 3rem) 0 0;
  max-width: min(72%, 48rem);
  font-size: clamp(4.5rem, 18vw, 13rem);
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 0.85;
  text-align: right;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.07);
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  white-space: nowrap;
  overflow: hidden;
}

.nilfish-demo-showcase__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-block: clamp(3rem, 8vh, 5.5rem);
}

.nilfish-demo-showcase__card {
  max-width: 28rem;
  padding: clamp(1.35rem, 3vw, 2rem);
  border-radius: 1.1rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(10, 13, 18, 0.72);
  box-shadow:
    0 24px 64px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(18px) saturate(1.1);
  -webkit-backdrop-filter: blur(18px) saturate(1.1);
}

.nilfish-demo-showcase__kicker {
  margin: 0 0 0.55rem;
  font-size: 0.78rem;
  font-weight: 650;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(var(--nilfish-accent-rgb, 196, 255, 0), 0.95);
}

.nilfish-demo-showcase__title {
  margin: 0 0 0.65rem;
  font-size: clamp(1.55rem, 2.6vw, 2rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: var(--nilfish-demo-fg);
}

.nilfish-demo-showcase__lead {
  margin: 0 0 1.35rem;
  font-size: 1rem;
  line-height: 1.55;
  color: var(--nilfish-demo-muted);
}

.nilfish-demo-showcase__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.nilfish-demo-showcase__hint {
  margin: 1.1rem 0 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: rgba(244, 246, 248, 0.55);
}

/* Keep demo band dark even on light agency/bookstore journey pages */
.nilfish-theme-agency-page .nilfish-demo-showcase,
.nilfish-theme-bookstore-page .nilfish-demo-showcase,
.nilfish-theme-powersport-page .nilfish-demo-showcase {
  background: #07090c;
  color: var(--nilfish-demo-fg);
}

.nilfish-theme-agency-page .nilfish-demo-showcase__title,
.nilfish-theme-bookstore-page .nilfish-demo-showcase__title {
  color: var(--nilfish-demo-fg);
}

@media (max-width: 640px) {
  .nilfish-demo-showcase {
    min-height: clamp(24rem, 78vh, 40rem);
  }

  .nilfish-demo-showcase__card {
    max-width: none;
  }

  .nilfish-demo-showcase__actions {
    flex-direction: column;
  }

  .nilfish-demo-showcase__actions a,
  .nilfish-demo-showcase__actions .btn-nilfish-primary,
  .nilfish-demo-showcase__actions .btn-nilfish-secondary {
    width: 100%;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .nilfish-demo-showcase__card {
    animation: nilfish-demo-card-in 0.7s ease both;
  }

  .nilfish-demo-showcase__watermark {
    animation: nilfish-demo-mark-in 1.1s ease both;
  }
}

@keyframes nilfish-demo-card-in {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes nilfish-demo-mark-in {
  from {
    opacity: 0;
    letter-spacing: 0.22em;
  }
  to {
    opacity: 1;
    letter-spacing: 0.1em;
  }
}



/* ── Storefront skin: Lighthouse (light catalog; same structure, new design) ──
   Attribute on <html>. Flat, zero-radius, large imagery, minimal padding.
   Brand accent/primary from Graphic design apply as usual — except Add to cart
   (light green, skin-owned). */
[data-storefront-skin="lighthouse"] {
  --nilfish-ink: #0f172a;
  --nilfish-heading: var(--nilfish-ink);
  --nilfish-bg-light: #f8fafc;
  --nilfish-surface: #ffffff;
  --nilfish-surface-elevated: #ffffff;
  --nilfish-card-bg: #ffffff;
  --nilfish-body: #334155;
  --nilfish-muted: #64748b;
  --nilfish-border: #e2e8f0;
  --nilfish-navbar: #ffffff;
  --nilfish-navbar-text: #0f172a;
  --nilfish-radius-md: 0;
  --nilfish-radius-lg: 0;
  --nilfish-radius-xl: 0;
  --nilfish-radius-pill: 0;
  --nilfish-shadow-card: none;
  --nilfish-shadow-card-hover: none;
  --nilfish-shadow-overlay: none;
}

[data-storefront-skin="lighthouse"] body {
  background: var(--nilfish-bg-light);
  color: var(--nilfish-body);
}

[data-storefront-skin="lighthouse"] .nilfish-site {
  background: var(--nilfish-bg-light);
  color: var(--nilfish-body);
}

/* Zero radius on panels, media, cards, buttons, chips */
[data-storefront-skin="lighthouse"] .nilfish-card,
[data-storefront-skin="lighthouse"] .nilfish-catalog-panel,
[data-storefront-skin="lighthouse"] .nilfish-feature-card,
[data-storefront-skin="lighthouse"] .nilfish-category-card,
[data-storefront-skin="lighthouse"] .nilfish-home-card,
[data-storefront-skin="lighthouse"] .nilfish-home-card-muted,
[data-storefront-skin="lighthouse"] .nilfish-action-card,
[data-storefront-skin="lighthouse"] .nilfish-shop-card,
[data-storefront-skin="lighthouse"] .nilfish-team-card,
[data-storefront-skin="lighthouse"] .nilfish-subcats__card,
[data-storefront-skin="lighthouse"] .nilfish-category-showcase__card,
[data-storefront-skin="lighthouse"] .nilfish-cta-block,
[data-storefront-skin="lighthouse"] .nilfish-site-nav__dropdown-panel,
[data-storefront-skin="lighthouse"] .nilfish-mega-menu,
[data-storefront-skin="lighthouse"] .nilfish-home-hero-logo,
[data-storefront-skin="lighthouse"] .nilfish-pdp__also-like-card,
[data-storefront-skin="lighthouse"] .nilfish-pdp__buy,
[data-storefront-skin="lighthouse"] .nilfish-pdp__brand-about,
[data-storefront-skin="lighthouse"] .nilfish-pdp__fit-chip,
[data-storefront-skin="lighthouse"] .btn-nilfish-primary,
[data-storefront-skin="lighthouse"] .btn-nilfish-secondary,
[data-storefront-skin="lighthouse"] .nilfish-site .btn-nilfish-ghost,
[data-storefront-skin="lighthouse"] .nilfish-home .btn-nilfish-ghost,
[data-storefront-skin="lighthouse"] img,
[data-storefront-skin="lighthouse"] .nilfish-shop-card__image,
[data-storefront-skin="lighthouse"] .nilfish-team-card__media,
[data-storefront-skin="lighthouse"] .nilfish-team-card__photo,
[data-storefront-skin="lighthouse"] .nilfish-subcats__image,
[data-storefront-skin="lighthouse"] .nilfish-category-showcase__img,
[data-storefront-skin="lighthouse"] .nilfish-home-visual,
[data-storefront-skin="lighthouse"] .nilfish-header-search__trigger,
[data-storefront-skin="lighthouse"] .nilfish-header-search input,
[data-storefront-skin="lighthouse"] .nilfish-badge,
[data-storefront-skin="lighthouse"] .nilfish-chip {
  border-radius: 0 !important;
}

/* Only Add to cart — light green (beats brand accent .btn-nilfish-primary) */
[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.nilfish-pdp__add,
[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.nilfish-add-to-cart,
[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.o_wsale_cart__suggest-add,
[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.nilfish-chat-card__btn,
[data-storefront-skin="lighthouse"] .nilfish-pdp__add,
[data-storefront-skin="lighthouse"] .nilfish-add-to-cart,
[data-storefront-skin="lighthouse"] .o_wsale_cart__suggest-add,
[data-storefront-skin="lighthouse"] .nilfish-chat-card__btn {
  background-color: #22c55e !important;
  border-color: #22c55e !important;
  color: #fff !important;
}

[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.nilfish-pdp__add:hover,
[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.nilfish-pdp__add:focus,
[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.nilfish-add-to-cart:hover,
[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.nilfish-add-to-cart:focus,
[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.o_wsale_cart__suggest-add:hover,
[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.o_wsale_cart__suggest-add:focus,
[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.nilfish-chat-card__btn:hover,
[data-storefront-skin="lighthouse"] button.btn-nilfish-primary.nilfish-chat-card__btn:focus,
[data-storefront-skin="lighthouse"] .nilfish-pdp__add:hover,
[data-storefront-skin="lighthouse"] .nilfish-pdp__add:focus,
[data-storefront-skin="lighthouse"] .nilfish-add-to-cart:hover,
[data-storefront-skin="lighthouse"] .nilfish-add-to-cart:focus,
[data-storefront-skin="lighthouse"] .o_wsale_cart__suggest-add:hover,
[data-storefront-skin="lighthouse"] .o_wsale_cart__suggest-add:focus,
[data-storefront-skin="lighthouse"] .nilfish-chat-card__btn:hover,
[data-storefront-skin="lighthouse"] .nilfish-chat-card__btn:focus {
  background-color: #16a34a !important;
  border-color: #16a34a !important;
  color: #fff !important;
}

/* Nav — light bar, charcoal links/icons (beat storefront white-on-navy rules) */
[data-storefront-skin="lighthouse"] .nilfish-site-nav {
  background: #ffffff;
  color: var(--nilfish-ink);
  border-bottom: 1px solid var(--nilfish-border);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav a,
[data-storefront-skin="lighthouse"] .nilfish-site-nav--storefront a:not(.btn-nilfish-primary):not(.o_wsale_cart_flyout__name):not(.o_wsale_cart_flyout__thumb-link):not(.o_wsale_cart_flyout__cta),
[data-storefront-skin="lighthouse"] .nilfish-site-nav--storefront > .nilfish-site-nav__brand > span,
[data-storefront-skin="lighthouse"] .nilfish-mega-menu,
[data-storefront-skin="lighthouse"] .nilfish-mega-menu__heading,
[data-storefront-skin="lighthouse"] .nilfish-site-nav__dropdown-panel {
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav--storefront a:not(.btn-nilfish-primary):hover {
  color: var(--nilfish-ink);
  opacity: 1;
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav--landing.is-compact {
  box-shadow: none;
  border-bottom: 1px solid var(--nilfish-border);
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav__dropdown-panel,
[data-storefront-skin="lighthouse"] .nilfish-mega-menu {
  background: #ffffff;
  border: 1px solid var(--nilfish-border);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
  border-radius: 0;
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav__dropdown-panel a,
[data-storefront-skin="lighthouse"] .nilfish-mega-menu a {
  position: relative;
  color: var(--nilfish-ink);
  border-radius: 0;
  transition: background 0.15s ease, color 0.15s ease;
}

/* NOP-style: accent line expands from center on hover (keep; no top-nav underline) */
[data-storefront-skin="lighthouse"] .nilfish-site-nav__dropdown-panel a::before,
[data-storefront-skin="lighthouse"] .nilfish-mega-menu a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--nilfish-accent);
  transform: scaleY(0);
  transform-origin: center;
  transition: transform 0.22s ease;
  pointer-events: none;
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav__dropdown-panel a.is-active,
[data-storefront-skin="lighthouse"] .nilfish-site-nav__dropdown-panel a:hover,
[data-storefront-skin="lighthouse"] .nilfish-mega-menu a:hover {
  background: color-mix(in srgb, var(--nilfish-ink) 5%, transparent);
  color: var(--nilfish-ink);
  box-shadow: none;
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav__dropdown-panel a.is-active::before,
[data-storefront-skin="lighthouse"] .nilfish-site-nav__dropdown-panel a:hover::before,
[data-storefront-skin="lighthouse"] .nilfish-mega-menu a:hover::before {
  transform: scaleY(1);
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav__mobile-panel a {
  position: relative;
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav__mobile-panel a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--nilfish-accent);
  transform: scaleY(0);
  transform-origin: center;
  transition: transform 0.22s ease;
  pointer-events: none;
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav__mobile-panel a:hover::before,
[data-storefront-skin="lighthouse"] .nilfish-site-nav__mobile-panel a.is-active::before {
  transform: scaleY(1);
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav--storefront > .nilfish-site-nav__links > .nilfish-site-nav__link:hover,
[data-storefront-skin="lighthouse"] .nilfish-site-nav--storefront > .nilfish-site-nav__links > .nilfish-site-nav__dropdown:hover > .nilfish-site-nav__link,
[data-storefront-skin="lighthouse"] .nilfish-site-nav--storefront > .nilfish-site-nav__links > .nilfish-site-nav__mega-wrap:hover > a {
  color: var(--nilfish-ink);
  opacity: 1;
  text-decoration: none;
  box-shadow: none;
}

/* Systray icons — search, cart, garage (were white for dark navbar) */
[data-storefront-skin="lighthouse"] .nilfish-header-search__trigger,
[data-storefront-skin="lighthouse"] .nilfish-header-search__trigger:hover,
[data-storefront-skin="lighthouse"] .nilfish-header-search__trigger:focus-visible,
[data-storefront-skin="lighthouse"] .o_wsale_my_cart__trigger,
[data-storefront-skin="lighthouse"] .o_wsale_my_cart__trigger:hover,
[data-storefront-skin="lighthouse"] .o_wsale_my_cart__trigger:focus-visible,
[data-storefront-skin="lighthouse"] .o_vehicle_garage,
[data-storefront-skin="lighthouse"] .o_vehicle_garage_toggle,
[data-storefront-skin="lighthouse"] .o_vehicle_garage_title {
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .o_vehicle_garage_subtitle {
  color: color-mix(in srgb, var(--nilfish-ink) 55%, transparent);
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav .nilfish-lang-switch {
  border-color: color-mix(in srgb, var(--nilfish-ink) 22%, transparent);
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav .nilfish-lang-switch__btn--active {
  background: color-mix(in srgb, var(--nilfish-ink) 8%, transparent);
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav__mobile-menu summary span {
  background: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav__mobile-panel a,
[data-storefront-skin="lighthouse"] .nilfish-site-nav__mobile-panel .nilfish-site-nav__link {
  color: var(--nilfish-ink);
}

/* Cart flyout on light nav — readable text (not inherit white) */
[data-storefront-skin="lighthouse"] .nilfish-site-nav .o_wsale_cart_flyout,
[data-storefront-skin="lighthouse"] .nilfish-site-nav .o_wsale_cart_flyout a,
[data-storefront-skin="lighthouse"] .nilfish-site-nav .o_wsale_cart_flyout__name,
[data-storefront-skin="lighthouse"] .nilfish-site-nav .o_wsale_cart_flyout__price,
[data-storefront-skin="lighthouse"] .nilfish-site-nav .nilfish-header-search__results,
[data-storefront-skin="lighthouse"] .nilfish-site-nav .nilfish-header-search__results a,
[data-storefront-skin="lighthouse"] .nilfish-site-nav .nilfish-header-search__copy strong {
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-site-nav .nilfish-header-search__copy small,
[data-storefront-skin="lighthouse"] .nilfish-site-nav .o_wsale_cart_flyout__empty {
  color: var(--nilfish-muted);
}

/* Footer — light */
[data-storefront-skin="lighthouse"] .nilfish-site-footer {
  background: #ffffff;
  color: var(--nilfish-body);
  border-top: 1px solid var(--nilfish-border);
}

[data-storefront-skin="lighthouse"] .nilfish-site-footer__heading,
[data-storefront-skin="lighthouse"] .nilfish-site-footer a {
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-site-footer p,
[data-storefront-skin="lighthouse"] .nilfish-site-footer__muted {
  color: var(--nilfish-muted);
}

/* Hero — light canvas + quiet accent grid */
[data-storefront-skin="lighthouse"] .nilfish-home-hero {
  background: linear-gradient(
    145deg,
    #ffffff 0%,
    var(--nilfish-bg-light, #f8fafc) 48%,
    #eef2f7 100%
  );
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-home-hero::before {
  background:
    linear-gradient(90deg, rgba(var(--nilfish-accent-rgb), 0.035) 1px, transparent 1px),
    linear-gradient(rgba(var(--nilfish-accent-rgb), 0.035) 1px, transparent 1px);
  background-size: 48px 48px;
  opacity: 1;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 70% 40%, black 20%, transparent 75%);
          mask-image: radial-gradient(ellipse 80% 70% at 70% 40%, black 20%, transparent 75%);
}

[data-storefront-skin="lighthouse"] .nilfish-home-hero-bg {
  background: radial-gradient(circle, rgba(var(--nilfish-accent-rgb), 0.06) 0%, transparent 65%);
}

[data-storefront-skin="lighthouse"] .nilfish-home-title,
[data-storefront-skin="lighthouse"] .nilfish-section-title {
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-home-lead {
  color: var(--nilfish-body);
}

[data-storefront-skin="lighthouse"] .nilfish-home-sub,
[data-storefront-skin="lighthouse"] .nilfish-home-trust,
[data-storefront-skin="lighthouse"] .nilfish-section-lead {
  color: var(--nilfish-muted);
}

[data-storefront-skin="lighthouse"] .nilfish-home-section,
[data-storefront-skin="lighthouse"] .nilfish-home-features,
[data-storefront-skin="lighthouse"] .nilfish-home-categories {
  background: transparent;
}

[data-storefront-skin="lighthouse"] .nilfish-link {
  color: var(--nilfish-ink);
}

/* Ghost buttons on light heroes */
[data-storefront-skin="lighthouse"] .nilfish-site .btn-nilfish-ghost,
[data-storefront-skin="lighthouse"] .nilfish-home .btn-nilfish-ghost,
[data-storefront-skin="lighthouse"] .nilfish-site a.btn-nilfish-ghost {
  border: 2px solid color-mix(in srgb, var(--nilfish-ink) 28%, transparent);
  color: var(--nilfish-ink);
  border-radius: 0;
}

[data-storefront-skin="lighthouse"] .nilfish-site .btn-nilfish-ghost:hover,
[data-storefront-skin="lighthouse"] .nilfish-home .btn-nilfish-ghost:hover,
[data-storefront-skin="lighthouse"] .nilfish-site a.btn-nilfish-ghost:hover {
  background: color-mix(in srgb, var(--nilfish-ink) 6%, transparent);
  border-color: color-mix(in srgb, var(--nilfish-ink) 45%, transparent);
  color: var(--nilfish-ink);
}

/* Product cards — square, flat, larger tiles, 5px gutters, tight body */
[data-storefront-skin="lighthouse"] .nilfish-grid--products {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
}

@media (max-width: 1199.98px) {
  [data-storefront-skin="lighthouse"] .nilfish-grid--products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  [data-storefront-skin="lighthouse"] .nilfish-grid--products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

[data-storefront-skin="lighthouse"] .nilfish-shop-card {
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 0;
  box-shadow: none;
  transform: none;
  transition: none;
}

[data-storefront-skin="lighthouse"] .nilfish-shop-card:hover {
  transform: none;
  box-shadow: none;
  border-color: rgba(15, 23, 42, 0.08);
  color: inherit;
}

[data-storefront-skin="lighthouse"] .nilfish-shop-card:hover .nilfish-shop-card__title {
  text-decoration: none;
}

[data-storefront-skin="lighthouse"] .nilfish-shop-card__image {
  aspect-ratio: 1 / 1;
  background: #f8fafc;
  padding: 0;
  border-radius: 0;
}

[data-storefront-skin="lighthouse"] .nilfish-shop-card__image img {
  object-fit: contain;
  border-radius: 0;
}

[data-storefront-skin="lighthouse"] .nilfish-shop-card__body {
  padding: 0.4rem 0.5rem 0.5rem;
  gap: 0.1rem;
}

[data-storefront-skin="lighthouse"] .nilfish-shop-card__title,
[data-storefront-skin="lighthouse"] .nilfish-shop-card__price {
  color: var(--nilfish-ink);
}

/* Team contact cards — same language as product cards */
[data-storefront-skin="lighthouse"] .nilfish-team-grid {
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fill, minmax(13.5rem, 1fr));
}

[data-storefront-skin="lighthouse"] .nilfish-team-card {
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 0;
  box-shadow: none;
}

[data-storefront-skin="lighthouse"] .nilfish-team-card__media {
  aspect-ratio: 1 / 1;
  background: #f8fafc;
  border-radius: 0;
}

[data-storefront-skin="lighthouse"] .nilfish-team-card__photo {
  object-fit: cover;
  border-radius: 0;
}

[data-storefront-skin="lighthouse"] .nilfish-team-card__body {
  padding: 0.55rem 0.65rem 0.7rem;
  gap: 0.1rem;
}

[data-storefront-skin="lighthouse"] .nilfish-team-card__name {
  font-size: 0.95rem;
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-team-card__title {
  font-size: 0.82rem;
}

[data-storefront-skin="lighthouse"] .nilfish-team-card__bio {
  font-size: 0.8rem;
  margin-top: 0.1rem;
}

/* Category / subcats — no expand hover, square, tight */
[data-storefront-skin="lighthouse"] .nilfish-category-card {
  border-radius: 0;
  padding: 1rem 0.85rem;
  box-shadow: none;
}

[data-storefront-skin="lighthouse"] .nilfish-category-card:hover,
[data-storefront-skin="lighthouse"] .nilfish-feature-card:hover,
[data-storefront-skin="lighthouse"] .nilfish-action-card:hover {
  transform: none;
  box-shadow: none;
  border-color: var(--nilfish-border);
}

[data-storefront-skin="lighthouse"] .nilfish-category-card h3 {
  color: var(--nilfish-ink);
}

/* Subcats — unframed: image + bold name only (no card chrome) */
[data-storefront-skin="lighthouse"] .nilfish-subcats__grid {
  gap: 5px;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
}

[data-storefront-skin="lighthouse"] .nilfish-subcats__card {
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  text-align: left;
  transition: none;
}

[data-storefront-skin="lighthouse"] .nilfish-subcats__card:hover,
[data-storefront-skin="lighthouse"] .nilfish-subcats__card--active {
  transform: none;
  border: none;
  box-shadow: none;
  background: transparent;
}

[data-storefront-skin="lighthouse"] .nilfish-subcats__image {
  aspect-ratio: 16 / 10;
  background: #f1f5f9;
}

[data-storefront-skin="lighthouse"] .nilfish-subcats__image--all {
  background: #e8eef4;
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-subcats__card:not(.nilfish-subcats__card--active) .nilfish-subcats__image::after {
  display: none;
}

[data-storefront-skin="lighthouse"] .nilfish-subcats__card:not(.nilfish-subcats__card--active) .nilfish-subcats__image img,
[data-storefront-skin="lighthouse"] .nilfish-subcats__card--active .nilfish-subcats__image img {
  filter: none;
}

[data-storefront-skin="lighthouse"] .nilfish-subcats__name {
  padding: 0.55rem 0 0;
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--nilfish-ink);
  text-align: left;
}

[data-storefront-skin="lighthouse"] .nilfish-subcats__card--active .nilfish-subcats__name {
  text-decoration: underline;
  text-underline-offset: 0.18em;
  text-decoration-thickness: 1.5px;
}

[data-storefront-skin="lighthouse"] .nilfish-category-showcase__card {
  border-radius: 0;
}

@media (hover: hover) and (min-width: 900px) {
  [data-storefront-skin="lighthouse"] .nilfish-category-showcase__row--first-larger .nilfish-category-showcase__card:not(.nilfish-category-showcase__card--lead):hover {
    flex: 1 1;
  }
}

/* Catalog panels — square + tighter padding (intro / PDP / checkout keep surface) */
[data-storefront-skin="lighthouse"] .nilfish-catalog-panel {
  border-radius: 0;
  padding: 0.85rem 1rem 1rem;
  box-shadow: none;
}

/* Product + subcategory grids: flush to container edges (match intro panel outer width).
   Keep white panel only for title + category/brand description (--intro). */
[data-storefront-skin="lighthouse"] .nilfish-catalog-panel--subcats,
[data-storefront-skin="lighthouse"] .nilfish-catalog-panel--products {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  margin-top: 0.75rem;
}

[data-storefront-skin="lighthouse"] .nilfish-catalog-panel--products .nilfish-catalog-panel__heading {
  margin: 0 0 0.55rem;
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-catalog-panel--intro {
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
}

/* Visual break — full-bleed width; height via --height-* (seed default xl) */
[data-storefront-skin="lighthouse"] .nilfish-home-visual {
  width: 100%;
  height: clamp(420px, 68vh, 860px);
  border-radius: 0;
  margin-block: 0;
}

[data-storefront-skin="lighthouse"] .nilfish-home-visual--height-short {
  height: clamp(180px, 28vh, 360px);
}

[data-storefront-skin="lighthouse"] .nilfish-home-visual--height-medium {
  height: clamp(240px, 42vh, 480px);
}

[data-storefront-skin="lighthouse"] .nilfish-home-visual--height-tall {
  height: clamp(340px, 58vh, 720px);
}

[data-storefront-skin="lighthouse"] .nilfish-home-visual--height-xl {
  height: calc(100svh - 5.75rem);
  min-height: 32rem;
}

@media (max-width: 767.98px) {
  [data-storefront-skin="lighthouse"] .nilfish-home-visual--height-xl {
    height: 100svh;
    min-height: 100vw;
  }
}

[data-storefront-skin="lighthouse"] .nilfish-home-visual-bg--img {
  image-rendering: auto;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

[data-storefront-skin="lighthouse"] .nilfish-home-visual-overlay {
  background: linear-gradient(
    180deg,
    rgba(15, 23, 42, 0.04) 0%,
    transparent 30%,
    transparent 70%,
    rgba(15, 23, 42, 0.06) 100%
  );
}

[data-storefront-skin="lighthouse"] .nilfish-home-visual:has(.nilfish-home-visual-label) .nilfish-home-visual-overlay {
  background: linear-gradient(
    180deg,
    rgba(15, 23, 42, 0.35) 0%,
    rgba(15, 23, 42, 0.08) 40%,
    rgba(15, 23, 42, 0.08) 60%,
    rgba(15, 23, 42, 0.4) 100%
  );
}

[data-storefront-skin="lighthouse"] .nilfish-home-visual-content {
  justify-content: center;
  align-items: center;
  padding: 0 clamp(1rem, 4vw, 3rem);
}

[data-storefront-skin="lighthouse"] .nilfish-home-visual-label {
  max-width: min(20ch, 90%);
  font-size: clamp(1.75rem, 4vw, 3rem);
  font-weight: 800;
  font-style: normal;
  letter-spacing: 0.06em;
  line-height: 1.15;
  text-transform: uppercase;
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.35);
  opacity: 0.95;
}

[data-storefront-skin="lighthouse"] .nilfish-home-visual-label::before {
  content: none;
}

[data-storefront-skin="lighthouse"] .nilfish-home-visual-label::after {
  background: var(--nilfish-accent);
  border-radius: 2px;
  bottom: -0.65rem;
  content: "";
  height: 3px;
  left: 50%;
  position: absolute;
  transform: translateX(-50%);
  width: 2.5rem;
  margin: 0;
}

/* Tight catalog rhythm — less white between blocks */
[data-storefront-skin="lighthouse"] .nilfish-home-section {
  padding-block: 2rem;
}

[data-storefront-skin="lighthouse"] .nilfish-home-section.nilfish-section--density-airy {
  padding-block: 2.25rem;
}

[data-storefront-skin="lighthouse"] .nilfish-home-section.nilfish-section--density-compact {
  padding-block: 1.25rem;
}

[data-storefront-skin="lighthouse"] .nilfish-home-section .nilfish-section-header {
  margin-bottom: 1.15rem;
}

[data-storefront-skin="lighthouse"] .nilfish-home-section .nilfish-site-main {
  padding-block: 0;
  padding-inline: clamp(1rem, 2.5vw, 1.75rem);
}

[data-storefront-skin="lighthouse"] .nilfish-home-news__body {
  border-radius: 0;
  box-shadow: none;
  border: 1px solid rgba(15, 23, 42, 0.1);
  margin-top: -2rem;
  padding: 0.9rem 1rem 1rem;
}

[data-storefront-skin="lighthouse"] .nilfish-home-news__grid {
  gap: 1.15rem;
}

[data-storefront-skin="lighthouse"] .nilfish-home-news--cards .nilfish-home-news__header {
  margin-bottom: 1.1rem;
}

[data-storefront-skin="lighthouse"] .nilfish-home-categories .nilfish-site-main {
  max-width: 1280px;
}

/* Atmosphere hero on Lighthouse: light wash */
[data-storefront-skin="lighthouse"] .nilfish-section-atmosphere--hero .nilfish-section-atmosphere__img {
  filter: brightness(0.98) contrast(1.02) saturate(0.95);
}

[data-storefront-skin="lighthouse"] .nilfish-section-atmosphere--hero .nilfish-section-atmosphere__shade {
  background:
    linear-gradient(
      105deg,
      rgba(248, 250, 252, 0.88) 0%,
      rgba(248, 250, 252, 0.72) 28%,
      rgba(248, 250, 252, 0.28) 52%,
      rgba(248, 250, 252, 0.08) 78%,
      transparent 100%
    ),
    linear-gradient(
      180deg,
      rgba(248, 250, 252, 0.35) 0%,
      transparent 28%,
      transparent 72%,
      rgba(248, 250, 252, 0.45) 100%
    );
}

[data-storefront-skin="lighthouse"] .nilfish-section-atmosphere--hero .nilfish-home-hero::before {
  opacity: 0.35;
  background:
    linear-gradient(90deg, rgba(var(--nilfish-accent-rgb), 0.05) 1px, transparent 1px),
    linear-gradient(rgba(var(--nilfish-accent-rgb), 0.05) 1px, transparent 1px);
  background-size: 48px 48px;
}

[data-storefront-skin="lighthouse"] .nilfish-section-atmosphere--hero .nilfish-home-hero-bg {
  opacity: 0.4;
}

/* PDP / catalog ink */
[data-storefront-skin="lighthouse"] .nilfish-pdp__breadcrumbs a,
[data-storefront-skin="lighthouse"] .nilfish-pdp__price,
[data-storefront-skin="lighthouse"] .nilfish-pdp__title,
[data-storefront-skin="lighthouse"] .nilfish-subcats__name {
  color: var(--nilfish-ink);
}

[data-storefront-skin="lighthouse"] .nilfish-pdp__price-campaign {
  color: var(--nilfish-accent);
}

/* Full-bleed atmosphere behind home sections (e.g. master glance + benefits) */
.nilfish-section-atmosphere {
  position: relative;
  isolate: isolate;
  overflow: hidden;
  min-height: clamp(32rem, 78vh, 58rem);
  background: #07090c;
  color: #f4f6f8;
}

.nilfish-section-atmosphere__media {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.nilfish-section-atmosphere__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  /* Soft sketch wash — images are already lightly sketched */
  filter: brightness(0.55) contrast(1.06) saturate(0.7);
  transform: scale(1.03);
}

.nilfish-section-atmosphere__shade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(105deg, rgba(7, 9, 12, 0.92) 0%, rgba(7, 9, 12, 0.72) 38%, rgba(7, 9, 12, 0.45) 70%, rgba(7, 9, 12, 0.7) 100%),
    linear-gradient(180deg, rgba(7, 9, 12, 0.55) 0%, transparent 22%, transparent 78%, rgba(7, 9, 12, 0.8) 100%);
}

.nilfish-section-atmosphere__watermark {
  position: absolute;
  left: 0;
  right: 0;
  top: auto;
  bottom: clamp(4rem, 14%, 7rem);
  z-index: 1;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: clamp(4.25rem, 19.5vw, 22rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 0.78;
  text-align: center;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.07);
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  white-space: nowrap;
  overflow: hidden;
}

.nilfish-section-atmosphere__body {
  position: relative;
  z-index: 2;
  padding-block: clamp(2.5rem, 6vh, 4.5rem);
}

/* Portrait band (apps + pricing): clear space above cards so the subject reads */
.nilfish-section-atmosphere--reveal {
  min-height: clamp(42rem, 96vh, 72rem);
}

.nilfish-section-atmosphere--reveal .nilfish-section-atmosphere__img {
  object-position: center 8%;
  filter: brightness(0.62) contrast(1.05) saturate(0.75);
}

.nilfish-section-atmosphere--reveal .nilfish-section-atmosphere__shade {
  background:
    linear-gradient(105deg, rgba(7, 9, 12, 0.78) 0%, rgba(7, 9, 12, 0.28) 48%, rgba(7, 9, 12, 0.55) 100%),
    linear-gradient(180deg, rgba(7, 9, 12, 0.2) 0%, transparent 28%, transparent 62%, rgba(7, 9, 12, 0.82) 100%);
}

.nilfish-section-atmosphere--reveal .nilfish-section-atmosphere__body {
  padding-top: clamp(11rem, 32vh, 20rem);
  padding-bottom: clamp(2.5rem, 6vh, 4rem);
}

.nilfish-section-atmosphere--reveal .nilfish-home-section {
  padding-block: clamp(1.25rem, 3vh, 2rem);
}

.nilfish-section-atmosphere--reveal .nilfish-section-header {
  margin-bottom: 1.25rem;
}

.nilfish-section-atmosphere .nilfish-home-section,
.nilfish-section-atmosphere .nilfish-home-features,
[data-nilfish-theme="master"] .nilfish-section-atmosphere .nilfish-home-section,
[data-nilfish-theme="master"] .nilfish-section-atmosphere .nilfish-home-features {
  background: transparent;
}

.nilfish-section-atmosphere .nilfish-feature-card {
  background: rgba(10, 13, 18, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(14px) saturate(1.05);
  -webkit-backdrop-filter: blur(14px) saturate(1.05);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.28);
}

.nilfish-section-atmosphere .nilfish-feature-card:hover {
  border-color: rgba(var(--nilfish-accent-rgb, 196, 255, 0), 0.35);
}

.nilfish-section-atmosphere .nilfish-benefit-pill {
  background: rgba(10, 13, 18, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: #f4f6f8;
}

.nilfish-section-atmosphere .nilfish-benefit-pill strong {
  color: #f8fafc;
}

.nilfish-section-atmosphere .nilfish-benefit-pill span {
  color: rgba(244, 246, 248, 0.65);
}

.nilfish-section-atmosphere .nilfish-action-card {
  background: rgba(10, 13, 18, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(14px) saturate(1.05);
  -webkit-backdrop-filter: blur(14px) saturate(1.05);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.28);
  color: #e2e8f0;
}

.nilfish-section-atmosphere .nilfish-action-card:hover {
  border-color: rgba(var(--nilfish-accent-rgb, 196, 255, 0), 0.35);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.35);
}

.nilfish-section-atmosphere .nilfish-action-card h3 {
  color: #f8fafc;
}

.nilfish-section-atmosphere .nilfish-action-card p {
  color: rgba(244, 246, 248, 0.7);
}

.nilfish-section-atmosphere .nilfish-home-hours {
  background: transparent;
}

.nilfish-section-atmosphere .nilfish-hours-channel.nilfish-feature-card {
  background: rgba(10, 13, 18, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(14px) saturate(1.05);
  -webkit-backdrop-filter: blur(14px) saturate(1.05);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.28);
  color: #e2e8f0;
}

.nilfish-section-atmosphere .nilfish-hours-channel.nilfish-feature-card h3,
.nilfish-section-atmosphere .nilfish-home-hours .nilfish-section-title {
  color: #f8fafc;
}

.nilfish-section-atmosphere .nilfish-home-hours .nilfish-section-lead {
  color: rgba(226, 232, 240, 0.78);
}

.nilfish-section-atmosphere .nilfish-hours-day {
  color: #e2e8f0;
  border-bottom-color: rgba(255, 255, 255, 0.1);
}

.nilfish-section-atmosphere .nilfish-hours-day dt,
.nilfish-section-atmosphere .nilfish-hours-day dd {
  color: inherit;
}

.nilfish-section-atmosphere .nilfish-company-contact.nilfish-feature-card {
  background: rgba(10, 13, 18, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(14px) saturate(1.05);
  -webkit-backdrop-filter: blur(14px) saturate(1.05);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.28);
  color: #e2e8f0;
}

.nilfish-section-atmosphere .nilfish-company-contact__name,
.nilfish-section-atmosphere .nilfish-company-contact .nilfish-section-title {
  color: #f8fafc;
}

.nilfish-section-atmosphere .nilfish-company-contact a {
  color: rgba(var(--nilfish-accent-rgb, 196, 255, 0), 0.95);
}

.nilfish-section-atmosphere .nilfish-hours-day--today {
  color: #e2e8f0;
}

.nilfish-section-atmosphere .nilfish-hours-day--today:not(.nilfish-hours-day--closed) dd {
  color: #e2e8f0;
  font-weight: 600;
}

.nilfish-section-atmosphere .nilfish-hours-day--closed dd {
  color: #e2e8f0;
}

.nilfish-section-atmosphere .nilfish-home-cta {
  padding-top: 0;
  padding-bottom: 0;
}

.nilfish-section-atmosphere .nilfish-cta-block,
[data-nilfish-theme="master"] .nilfish-section-atmosphere .nilfish-cta-block {
  background: rgba(10, 13, 18, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(14px) saturate(1.05);
  -webkit-backdrop-filter: blur(14px) saturate(1.05);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.28);
}

.nilfish-section-atmosphere--hero {
  min-height: clamp(28rem, 72vh, 52rem);
}

.nilfish-section-atmosphere--hero .nilfish-section-atmosphere__img {
  filter: brightness(0.55) contrast(1.08) saturate(0.7);
  object-position: center 42%;
}

.nilfish-section-atmosphere--hero .nilfish-section-atmosphere__shade {
  background:
    linear-gradient(
      105deg,
      rgba(7, 9, 12, 0.98) 0%,
      rgba(7, 9, 12, 0.94) 22%,
      rgba(7, 9, 12, 0.78) 40%,
      rgba(7, 9, 12, 0.4) 62%,
      rgba(7, 9, 12, 0.16) 82%,
      rgba(7, 9, 12, 0.32) 100%
    ),
    linear-gradient(
      180deg,
      rgba(7, 9, 12, 0.6) 0%,
      transparent 32%,
      transparent 68%,
      rgba(7, 9, 12, 0.8) 100%
    );
}

.nilfish-section-atmosphere--hero .nilfish-section-atmosphere__body {
  padding-block: 0;
  display: flex;
  flex-direction: column;
  min-height: inherit;
}

.nilfish-section-atmosphere--hero .nilfish-home-hero,
[data-nilfish-theme="master"] .nilfish-section-atmosphere--hero .nilfish-home-hero {
  background: transparent;
  min-height: inherit;
  flex: 1 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Keep the hero accent grid over the photo — quieter than default */
.nilfish-section-atmosphere--hero .nilfish-home-hero::before {
  display: block;
  z-index: 1;
  opacity: 0.45;
  background:
    linear-gradient(90deg, rgba(var(--nilfish-accent-rgb), 0.08) 1px, transparent 1px),
    linear-gradient(rgba(var(--nilfish-accent-rgb), 0.08) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse 85% 75% at 68% 42%, black 18%, transparent 78%);
          mask-image: radial-gradient(ellipse 85% 75% at 68% 42%, black 18%, transparent 78%);
}

.nilfish-section-atmosphere--hero .nilfish-home-hero-bg {
  display: block;
  z-index: 0;
  opacity: 0.85;
}

.nilfish-section-atmosphere--hero .nilfish-home-hero-inner {
  z-index: 2;
}

.nilfish-section-atmosphere--hero .nilfish-home-hero .min-vh-75 {
  min-height: clamp(22rem, 58vh, 40rem);
  padding-block: clamp(2.5rem, 7vh, 4.5rem);
}


[data-nilfish-theme="master"] .nilfish-home-title,
[data-nilfish-theme="master"] .nilfish-home-lead,
[data-nilfish-theme="master"] .nilfish-home-sub,
[data-nilfish-theme="master"] .nilfish-home-trust {
  color: #f8fafc;
}

[data-nilfish-theme="master"] .nilfish-home-lead {
  color: var(--nilfish-accent);
}

[data-nilfish-theme="master"] .nilfish-home-sub,
[data-nilfish-theme="master"] .nilfish-home-trust {
  color: #94a3b8;
}

[data-nilfish-theme="master"] .nilfish-site .btn-nilfish-ghost,
[data-nilfish-theme="master"] .nilfish-home .btn-nilfish-ghost,
[data-nilfish-theme="master"] .nilfish-site a.btn-nilfish-ghost {
  color: #f8fafc;
  border-color: rgba(255, 255, 255, 0.35);
}

[data-nilfish-theme="master"] .nilfish-site .btn-nilfish-ghost:hover,
[data-nilfish-theme="master"] .nilfish-home .btn-nilfish-ghost:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.6);
  color: #f8fafc;
}

@media (prefers-reduced-motion: no-preference) {
  .nilfish-section-atmosphere__watermark {
    animation: nilfish-demo-mark-in 1.1s ease both;
  }
}

/* --- HR organisation chart --- */

.nilfish-org-chart {
  --nilfish-org-line: var(--nilfish-muted, #6b7785);
  overflow-x: auto;
  max-width: 100%;
  padding: 0.5rem 0 1rem;
}

.nilfish-org-chart__forest,
.nilfish-org-chart__children {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
}

/* Multiple roots may wrap; child rows stay one line so connectors join. */
.nilfish-org-chart__forest {
  flex-wrap: wrap;
  gap: 1.25rem 1.5rem;
}

.nilfish-org-chart__node {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  min-width: 0;
}

.nilfish-org-chart__children {
  flex-wrap: nowrap;
  /* No margin — padding carries the stem so the line is continuous. */
  padding-top: 1.25rem;
  position: relative;
}

/* Vertical stem from parent card down to the sibling crossbar. */
.nilfish-org-chart__children::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 1.25rem;
  background: var(--nilfish-org-line);
}

.nilfish-org-chart__children > .nilfish-org-chart__node {
  position: relative;
  /* Top = stub height; sides = spacing (replaces flex gap so bars meet). */
  padding: 1rem 0.75rem 0;
}

/* Horizontal half-bars that meet between siblings. */
.nilfish-org-chart__children > .nilfish-org-chart__node::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  border-top: 1px solid var(--nilfish-org-line);
}

/* Vertical stub from crossbar down to each card. */
.nilfish-org-chart__children > .nilfish-org-chart__node::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 1rem;
  background: var(--nilfish-org-line);
}

.nilfish-org-chart__children > .nilfish-org-chart__node:first-child::before {
  left: 50%;
}

.nilfish-org-chart__children > .nilfish-org-chart__node:last-child::before {
  right: 50%;
}

.nilfish-org-chart__children > .nilfish-org-chart__node:only-child::before {
  display: none;
}

.nilfish-org-chart__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  width: min(11.5rem, 72vw);
  padding: 0.75rem 0.65rem;
  text-align: center;
  text-decoration: none;
  color: inherit;
  background: var(--nilfish-surface, #fff);
  border: 1px solid var(--nilfish-border, #c5d0dc);
  border-radius: 0.5rem;
  box-shadow: 0 1px 2px rgba(26, 35, 50, 0.04);
}

.nilfish-org-chart__card--link:hover,
.nilfish-org-chart__card--link:focus-visible {
  border-color: var(--nilfish-accent, #1f6feb);
  outline: none;
}

.nilfish-org-chart__photo {
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 50%;
  overflow: hidden;
  background: var(--nilfish-surface-muted, #e8eef5);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.nilfish-org-chart__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.nilfish-org-chart__photo-fallback {
  font-size: 0.7rem;
  color: var(--nilfish-muted, #6b7785);
  padding: 0.25rem;
  line-height: 1.2;
}

.nilfish-org-chart__meta {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
  width: 100%;
}

.nilfish-org-chart__name {
  font-weight: 600;
  font-size: 0.92rem;
  line-height: 1.25;
  word-break: break-word;
}

.nilfish-org-chart__title {
  font-size: 0.8rem;
  color: var(--nilfish-text, #1a2332);
  line-height: 1.25;
  word-break: break-word;
}

.nilfish-org-chart__unit {
  font-size: 0.72rem;
  color: var(--nilfish-muted, #6b7785);
}

.nilfish-org-chart__contact {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  margin-top: 0.25rem;
  font-size: 0.72rem;
  color: var(--nilfish-muted, #6b7785);
  word-break: break-word;
}

.nilfish-org-chart-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}