/* 2SELL ONE 2.0.0 — opt-in materials. Import tokens.css first. No layout reset. */
.one-root {
  color: var(--one-text);
  background-color: var(--one-canvas);
  font-family: var(--one-font-sans);
  font-size: 15px;
  line-height: 1.55;
}

/* A dedicated non-interactive layer, never a ::before covering the content. */
.one-ambient {
  pointer-events: none;
  opacity: var(--one-ambient-strength);
  background:
    radial-gradient(ellipse 94% 58% at 60% 113%, var(--one-ambient-center), transparent 80%),
    radial-gradient(ellipse 54% 36% at -9% 104%, var(--one-ambient-edge), transparent 88%),
    radial-gradient(ellipse 46% 46% at 109% 107%, var(--one-ambient-edge), transparent 90%);
}
.one-stage { position: relative; isolation: isolate; background-color: var(--one-canvas); }
.one-stage > .one-ambient { position: absolute; inset: 0; z-index: -1; }
.one-app { position: relative; isolation: isolate; min-height: 100dvh; background-color: var(--one-canvas); }
.one-app > .one-ambient { position: fixed; inset: 0; z-index: -1; }

.one-surface {
  background-color: var(--one-surface);
  color: var(--one-text);
  border-radius: var(--one-radius-card);
  box-shadow: var(--one-shadow-soft);
}
.one-glass {
  color: var(--one-text);
  background: var(--one-glass-solid);
  border-radius: var(--one-radius-panel);
  box-shadow: var(--one-shadow-elevated);
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .one-glass {
    background: linear-gradient(165deg, var(--one-glass-sheen), transparent 42%), var(--one-glass);
    -webkit-backdrop-filter: blur(var(--one-glass-blur)) saturate(var(--one-glass-saturate));
    backdrop-filter: blur(var(--one-glass-blur)) saturate(var(--one-glass-saturate));
  }
}
.one-popover { background: var(--one-surface); color: var(--one-text); box-shadow: var(--one-shadow-float); }
.one-divider { border-color: var(--one-line); }
.one-focus:focus-visible { outline: 2px solid var(--one-ring); outline-offset: 3px; }
.one-interactive {
  transition: background-color var(--one-duration-fast) var(--one-ease), color var(--one-duration-fast) var(--one-ease);
}
@media (hover: hover) and (pointer: fine) {
  .one-interactive:not(:disabled):not([aria-disabled="true"]):hover { background-color: var(--one-surface-hover); }
}
/* Explicit selection remains distinct from hover. Preserve native semantics. */
.one-interactive[aria-current="page"],
.one-interactive[aria-selected="true"],
.one-interactive[aria-pressed="true"] { background-color: var(--one-selected); color: var(--one-selected-text); }

[data-2sell-effects="reduced"] .one-ambient { display: none; }
[data-2sell-effects="reduced"] .one-glass,
.one-glass[data-2sell-effects="reduced"] {
  background: var(--one-glass-solid);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: var(--one-shadow-soft);
}
@media (prefers-reduced-transparency: reduce) {
  .one-ambient { display: none; }
  .one-glass { background: var(--one-glass-solid); -webkit-backdrop-filter: none; backdrop-filter: none; }
}
@media (prefers-reduced-motion: reduce) {
  .one-interactive { transition: none; }
}
@media (forced-colors: active) {
  .one-ambient { display: none; }
  .one-root, .one-surface, .one-glass, .one-popover {
    background: Canvas; color: CanvasText; box-shadow: none;
    -webkit-backdrop-filter: none; backdrop-filter: none;
  }
  .one-surface, .one-glass, .one-popover { border: 1px solid CanvasText; }
  .one-focus:focus-visible { outline-color: Highlight; }
}
