{"version":3,"file":"src_Components_Pages_WidgetPage_jsx.css","mappings":"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","sources":["webpack://servv-plugin/./src/Components/Pages/PageWrapper.module.scss","webpack://servv-plugin/./src/styles/_tokens.scss","webpack://servv-plugin/./src/styles/_motion.scss","webpack://servv-plugin/./src/Components/Containers/PageContent.module.scss","webpack://servv-plugin/./src/Components/Containers/PageHeader.module.scss","webpack://servv-plugin/./src/styles/_mixins.scss","webpack://servv-plugin/./src/Components/Controls/PageActionButton.module.scss","webpack://servv-plugin/./src/Components/Pages/WidgetPage.module.scss"],"sourcesContent":["@use \"../../styles/tokens\" as t;\n@use \"../../styles/mixins\" as m;\n\n@include m.scoped {\n  // The grey canvas behind a page that asks for one.\n  .backdrop {\n    position: fixed;\n    inset: 0;\n    background: t.$canvas;\n  }\n\n  .root {\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    width: var(--servv-page-width, 100%);\n    height: var(--servv-page-height, 100%);\n    min-height: 0;\n    flex: 1 1 auto;\n  }\n\n  // Pages that do not frame themselves with <PageContent> keep the old gutter.\n  .gutterLeft {\n    padding-left: t.$space-8;\n  }\n\n  .gutterRight {\n    padding-right: t.$space-8;\n  }\n\n  .spinner {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    pointer-events: none;\n  }\n\n  .content {\n    display: flex;\n    flex: 1 1 auto;\n    flex-direction: column;\n    width: var(--servv-page-width, 100%);\n    height: var(--servv-page-height, 100%);\n    max-width: 100%;\n    min-width: 0;\n    min-height: 0;\n    overflow: visible;\n  }\n}\n","// ---------------------------------------------------------------------------\n// WPSE design tokens — single source of truth for the admin UI.\n// Values come from the \"Servv Admin Unified v2\" design export: a soft-UI\n// (neumorphic) system on a white canvas with a violet brand ramp.\n//\n// Usage from a component module:\n//   @use \"../../styles/tokens\" as t;\n//   .button { border-radius: t.$radius-lg; color: t.$text-strong; }\n// ---------------------------------------------------------------------------\n\n// --- Brand -----------------------------------------------------------------\n$primary: #6436c9;\n$primary-strong: #4d2aa3;\n$primary-grad-from: #7b4fdb;\n$primary-grad-to: #5730b4;\n$primary-surface: #eae2fb; // tinted chip / icon tile background\n$primary-border: #d7c8f7;\n$primary-border-strong: #c3a8f3; // focus border\n$primary-border-soft: #dfd6f3;\n$primary-ring: rgba(234, 226, 251, 0.85); // focus halo\n\n// --- Text ------------------------------------------------------------------\n$text: #151b2b; // headings, primary copy\n$text-strong: #39415a; // control labels, button faces\n$text-secondary: #414b63; // body copy\n$text-soft: #5b6680; // meta, captions\n$text-placeholder: #8e97ab;\n$text-on-primary: #ffffff;\n\n// --- Surfaces --------------------------------------------------------------\n$surface: #ffffff;\n$canvas: var(--servv-admin-canvas, #ffffff);\n$hover-surface: var(--servv-hover-surface, #fafbfd);\n$hover-border: var(--servv-hover-border, #c3a8f3);\n$surface-subtle: #fafbfd; // table row hover\n$surface-raised-tint: #fcfdfe;\n\n// --- Borders ---------------------------------------------------------------\n$border: #edf1f7; // cards, dividers\n$border-soft: #eff2f8; // secondary buttons\n$border-field: #e8edf5; // inputs, selects, textareas\n$border-hairline: rgba(21, 27, 43, 0.09); // segmented tracks, inner rules\n\n// --- Neumorphic shadow pigments -------------------------------------------\n$shade: #dce2ec; // dark side\n$shade-strong: #d4dbe8; // dark side, lifted states\n$light: #fbfcfe; // light side\n$light-alt: #fcfdfe;\n\n// --- Status ----------------------------------------------------------------\n$success: #17b26a;\n$success-strong: #079455;\n$success-surface: #ecfdf3;\n$success-border: #abefc6;\n$success-text: #067647;\n\n$warning: #f79009;\n$warning-strong: #dc6803;\n$warning-surface: #fffaeb;\n$warning-border: #fedf89;\n$warning-text: #b54708;\n\n$danger: #f04438;\n$danger-strong: #d92d20;\n$danger-grad-from: #e8554a;\n$danger-grad-to: #c12b1f;\n$danger-surface: #fef3f2;\n$danger-border: #fecdca;\n$danger-border-strong: #fda29b;\n$danger-text: #b42318;\n$danger-shade: #f1dbd9; // inset pigment on an errored field\n$danger-ring: rgba(254, 243, 242, 0.9);\n\n$info: #175cd3;\n$info-surface: #eff8ff;\n$info-border: #b2ddff;\n\n// --- WordPress admin chrome (sidebar / adminbar adjacency) -----------------\n$wp-chrome: #1d2327;\n$wp-chrome-deep: #15191c;\n$wp-chrome-line: #2c3338;\n$wp-chrome-text: #c3c4c7;\n$wp-chrome-muted: #a7aaad;\n\n// --- Typography ------------------------------------------------------------\n$font-sans: \"Plus Jakarta Sans\", system-ui, -apple-system, \"Segoe UI\", sans-serif;\n\n$text-11: 11px;\n$text-12: 12px;\n$text-13: 13px;\n$text-14: 14px;\n$text-15: 15px;\n$text-16: 16px;\n$text-18: 18px;\n$text-20: 20px;\n$text-24: 24px;\n$text-32: 32px;\n\n$leading-11: 16px;\n$leading-12: 18px;\n$leading-13: 19px;\n$leading-14: 20px;\n$leading-15: 23px;\n$leading-16: 24px;\n$leading-18: 24px;\n$leading-20: 28px;\n$leading-24: 32px;\n$leading-32: 40px;\n\n$weight-regular: 400;\n$weight-medium: 500;\n$weight-semibold: 600;\n$weight-bold: 700;\n$weight-extrabold: 800;\n\n$tracking-tight: -0.03em;\n$tracking-wide: 0.08em;\n$tracking-wider: 0.1em;\n\n// --- Spacing ---------------------------------------------------------------\n$space-1: 2px;\n$space-2: 4px;\n$space-3: 6px;\n$space-4: 8px;\n$space-5: 10px;\n$space-6: 12px;\n$space-7: 14px;\n$space-8: 16px;\n$space-9: 18px;\n$space-10: 20px;\n$space-12: 24px;\n$space-14: 28px;\n$space-16: 32px;\n\n// --- Radii -----------------------------------------------------------------\n$radius-sm: 7px;\n$radius-md: 9px;\n$radius-lg: 12px; // buttons, fields\n$radius-xl: 14px;\n$radius-2xl: 18px; // cards, modals\n$radius-pill: 99px;\n\n// --- Control heights -------------------------------------------------------\n$control-xs: 28px;\n$control-sm: 34px;\n$control-md: 38px;\n$control-lg: 40px;\n$control-xl: 46px;\n\n// --- Segmented control geometry --------------------------------------------\n// A segmented track is a box around chips, so its numbers are derived, not\n// picked: the radius has to clear the inner chip by the gutter (outer = inner\n// + padding) or the chip's corner pokes through, and the chip's height has to\n// leave room for the gutter and the 1px border so the whole track ends up the\n// same $control-lg as the buttons beside it in a toolbar.\n$segment-gutter: 3px; // track padding\n$radius-segment: 10px; // the chip itself\n$radius-segment-track: $radius-segment + $segment-gutter; // 13px\n$control-segment: $control-lg - 2 * $segment-gutter - 2px; // 32px\n\n// --- Elevation (soft-UI pairs) --------------------------------------------\n$shadow-raised-sm: 3px 3px 7px $shade, -2px -2px 5px $light;\n$shadow-raised-chip: 4px 4px 9px $shade, -2px -2px 6px $light; // chips, tabs\n$shadow-chip-pressed: inset 4px 4px 9px $primary-border-soft,\n  inset -2px -2px 6px $light; // a selected (pressed) brand chip\n$shadow-raised: 5px 5px 12px $shade, -2px -2px 8px $light;\n$shadow-raised-hover: 7px 7px 16px $shade, -3px -3px 10px $light;\n$shadow-raised-active: 4px 4px 10px $shade, -2px -2px 7px $light;\n// A filled button sits at exactly the same elevation as a raised white one —\n// only the inner gloss tells them apart — so a toolbar of mixed controls reads\n// as one row. Derived from the raised pair so the two can never drift.\n$shadow-brand: $shadow-raised, inset 0 1px 0 rgba(255, 255, 255, 0.2);\n$shadow-brand-hover: $shadow-raised-hover,\n  inset 0 1px 0 rgba(255, 255, 255, 0.24);\n$shadow-danger: $shadow-raised, inset 0 1px 0 rgba(255, 255, 255, 0.18);\n$shadow-card: 9px 9px 22px $shade, -4px -4px 12px $light;\n$shadow-card-hover: 14px 14px 30px $shade-strong, -6px -6px 16px $light;\n$shadow-modal: 18px 18px 44px $shade-strong, -6px -6px 18px rgba($light, 0.25);\n$shadow-field: inset 4px 4px 9px $shade, inset -2px -2px 6px $light;\n$shadow-field-focus: inset 4px 4px 10px $shade, inset -2px -2px 7px $light;\n$shadow-well: inset 6px 6px 14px $shade, inset -3px -3px 9px $light;\n$shadow-track: inset 2px 2px 4px $shade, inset -1px -1px 3px $light-alt;\n$shadow-popover: 0 12px 32px rgba(16, 24, 40, 0.14);\n$shadow-row-hover: inset 0 0 0 1px $border;\n\n// --- Motion ----------------------------------------------------------------\n$ease: cubic-bezier(0.22, 1, 0.36, 1);\n$ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);\n$duration-fast: 0.18s;\n$duration: 0.22s;\n$duration-slow: 0.42s;\n\n// --- Layers ----------------------------------------------------------------\n// The admin chrome WordPress paints around us: #adminmenuback 9990,\n// #adminmenuwrap 9999, the collapse button 10000, #wpadminbar 99999.\n// An overlay has to clear the menu while staying under the admin bar.\n$z-sticky: 20;\n$z-dropdown: 40;\n$z-overlay: 10001;\n","// ---------------------------------------------------------------------------\n// Keyframes from the design export, emitted as mixins.\n//\n// A `*.module.scss` hashes its own `@keyframes` names, and an animation-name\n// that points at keyframes declared elsewhere would not be rewritten — so each\n// module that animates emits the keyframes it needs, at the top level of the\n// file (outside `m.scoped`).\n// ---------------------------------------------------------------------------\n\n@use \"tokens\" as t;\n\n@mixin fade {\n  @keyframes svFade {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n}\n\n@mixin fade-out {\n  @keyframes svFadeOut {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n}\n\n// The dialog entrance: a short rise with a touch of scale.\n@mixin pop {\n  @keyframes svPop {\n    from {\n      opacity: 0;\n      transform: translateY(8px) scale(0.98);\n    }\n    to {\n      opacity: 1;\n      transform: none;\n    }\n  }\n}\n\n@mixin pop-out {\n  @keyframes svPopOut {\n    from {\n      opacity: 1;\n      transform: none;\n    }\n    to {\n      opacity: 0;\n      transform: translateY(8px) scale(0.98);\n    }\n  }\n}\n\n// Side drawer.\n@mixin slide {\n  @keyframes svSlide {\n    from {\n      transform: translateX(100%);\n    }\n    to {\n      transform: none;\n    }\n  }\n}\n\n// Page / section entrance.\n@mixin rise {\n  @keyframes svRise {\n    from {\n      opacity: 0;\n      transform: translateY(14px);\n    }\n    to {\n      opacity: 1;\n      transform: none;\n    }\n  }\n}\n","@use \"../../styles/tokens\" as t;\n@use \"../../styles/mixins\" as m;\n@use \"../../styles/motion\" as motion;\n\n@include motion.rise;\n\n@include m.scoped {\n  // Reference: <main style=\"flex:1;min-width:0;padding:28px 32px 64px\">\n  .shell {\n    display: flex;\n    flex-direction: column;\n    flex: 1 1 auto;\n    min-width: 0;\n    width: var(--servv-page-width, 100%);\n    height: var(--servv-page-height, 100%);\n    padding: t.$space-14 t.$space-16 64px;\n  }\n\n  .flush {\n    padding: 0;\n  }\n\n  // Full-size content column with responsive gutters.\n  .container {\n    display: flex;\n    flex-direction: column;\n    gap: t.$space-12;\n    width: var(--servv-page-width, 100%);\n    height: var(--servv-page-height, 100%);\n    max-width: 100%;\n    flex: 1 1 auto;\n    min-width: 0;\n    margin: 0;\n    // `backwards`, not `both`: a filled-forwards transform keeps computing as a\n    // matrix, which would make this column the containing block for every\n    // position:fixed overlay inside it (the filters drawer, modals).\n    animation: svRise t.$duration-slow t.$ease backwards;\n  }\n\n  @media (max-width: 782px) {\n    .shell {\n      padding: t.$space-8 t.$space-7 t.$space-16;\n    }\n  }\n}\n","@use \"../../styles/tokens\" as t;\n@use \"../../styles/mixins\" as m;\n\n@include m.scoped {\n  // Reference: <header style=\"display:flex;flex-direction:column;gap:16px\">\n  .header {\n    display: flex;\n    flex-direction: column;\n    gap: t.$space-8;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n  }\n\n  .bottomLine {\n    padding-bottom: t.$space-8;\n    border-bottom: 1px solid t.$border;\n  }\n\n  // The title/actions row: actions sit on the text baseline and wrap under it\n  // when the viewport runs out of room.\n  .row {\n    display: flex;\n    align-items: flex-end;\n    justify-content: space-between;\n    gap: t.$space-12;\n    flex-wrap: wrap;\n    width: 100%;\n  }\n\n  .text {\n    min-width: 0;\n  }\n\n  .eyebrow {\n    @include m.eyebrow;\n    margin-bottom: t.$space-4;\n    color: t.$primary;\n  }\n\n  .title {\n    margin: 0;\n    @include m.text(32, t.$weight-extrabold);\n  }\n\n  // One line, next to the actions — it ellipsises rather than wrapping under\n  // them and pushing the row's height around. `.text` already carries the\n  // `min-width: 0` that lets it shrink instead of forcing the actions to wrap.\n  .description {\n    @include m.truncate;\n    margin: t.$space-3 0 0;\n    @include m.text(15, t.$weight-medium);\n    color: t.$text-secondary;\n  }\n\n  .actions {\n    display: flex;\n    align-items: center;\n    gap: t.$space-5;\n  }\n\n  @media (max-width: 735px) {\n    .title {\n      @include m.text(24, t.$weight-extrabold);\n    }\n\n    // On a phone the actions sit on their own row, so the description has the\n    // full width and is better off wrapping than being cut.\n    .text {\n      width: 100%;\n    }\n\n    .description {\n      overflow: visible;\n      white-space: normal;\n    }\n\n    .actions {\n      width: 100%;\n    }\n  }\n}\n","// ---------------------------------------------------------------------------\n// Shared style recipes. Every mixin here is pure output — importing this file\n// emits nothing on its own, so modules can @use it freely.\n// ---------------------------------------------------------------------------\n\n@use \"sass:color\";\n@use \"tokens\" as t;\n\n// Reset a <button> down to a styleable box.\n@mixin button-reset {\n  margin: 0;\n  padding: 0;\n  border: 0;\n  background: none;\n  font: inherit;\n  color: inherit;\n  text-align: inherit;\n  cursor: pointer;\n  appearance: none;\n}\n\n// The shared geometry of every control that reads as a button.\n@mixin control-base($height: t.$control-lg, $padding: 0 t.$space-7) {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: t.$space-3;\n  box-sizing: border-box;\n  height: $height;\n  padding: $padding;\n  border-radius: t.$radius-lg;\n  font-family: t.$font-sans;\n  font-size: t.$text-14;\n  font-weight: t.$weight-semibold;\n  // Not 1: these labels sit in a truncating (overflow:hidden) span, which\n  // would clip the descenders of \"Upcoming\", \"Page\" and the like. The control\n  // keeps its explicit height either way.\n  line-height: 1.4;\n  white-space: nowrap;\n  cursor: pointer;\n  transition: background t.$duration t.$ease, color t.$duration-fast t.$ease, border-color t.$duration-fast t.$ease;\n\n  &:active:not(:disabled) {\n    border-color: t.$primary-border-strong;\n  }\n\n  &:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n    transform: none;\n  }\n}\n\n// A raised white surface — secondary buttons, icon buttons, chips.\n@mixin raised($hoverable: true) {\n  border: 1px solid t.$border-soft;\n  background: t.$surface;\n  color: t.$text-strong;\n  box-shadow: t.$shadow-raised;\n\n  @if $hoverable {\n    &:hover:not(:disabled) {\n      background-color: t.$hover-surface;\n      border-color: t.$hover-border;\n    }\n  }\n}\n\n// The brand gradient fill — primary buttons.\n@mixin brand-fill {\n  border: 1px solid t.$primary-strong;\n  background-color: t.$primary;\n  color: t.$text-on-primary;\n  box-shadow: t.$shadow-brand;\n\n  &:hover:not(:disabled) {\n      background-color: t.$primary-strong;\n    }\n}\n\n// A toolbar trigger — the date button and the Filters button on a list screen.\n// Reference: padding:0 12px;border-radius:12px;border:1px solid #EFF2F8;\n// background:#FFFFFF;box-shadow:5px 5px 12px/-2px -2px 8px, with a 16px\n// brand-stroked icon. Height and type come from $control-lg / control-base so\n// the trigger matches the PageActionButton and the segmented control it shares\n// a toolbar with — the reference's 38px/13px left them a step short.\n@mixin toolbar-trigger {\n  @include button-reset;\n  @include wp-reset-button;\n  @include control-base(t.$control-lg, 0 t.$space-6);\n  @include raised;\n  gap: t.$space-4;\n  justify-content: flex-start;\n\n  &:focus-visible {\n    @include focus-ring-raised;\n  }\n}\n\n// The 16px icon inside a toolbar trigger: brand-stroked, never shrinking.\n@mixin toolbar-trigger-icon {\n  width: 16px;\n  height: 16px;\n  flex: 0 0 16px;\n  color: t.$primary;\n}\n\n// A card / panel surface.\n@mixin card-surface($radius: t.$radius-2xl) {\n  border: 1px solid t.$border;\n  border-radius: $radius;\n  background: t.$surface;\n  box-shadow: t.$shadow-card;\n}\n\n// A recessed surface — inputs, selects, textareas, wells.\n@mixin field-surface {\n  border: 1px solid t.$border-field;\n  border-radius: t.$radius-lg;\n  background: t.$surface;\n  box-shadow: t.$shadow-field;\n  transition: border-color t.$duration-fast t.$ease, background-color t.$duration t.$ease, color t.$duration-fast t.$ease;\n}\n\n// Keyboard focus. Applied to the element that carries the field chrome.\n@mixin focus-ring {\n  outline: none;\n  border-color: t.$primary-border-strong;\n  box-shadow: t.$shadow-field-focus, 0 0 0 3px t.$primary-ring;\n}\n\n// Focus for a raised (non-recessed) control.\n@mixin focus-ring-raised {\n  outline: none;\n  box-shadow: t.$shadow-raised, 0 0 0 3px t.$primary-ring;\n}\n\n@mixin field-error {\n  border-color: t.$danger-border-strong;\n  box-shadow: inset 4px 4px 9px t.$danger-shade, inset -2px -2px 6px t.$light,\n    0 0 0 3px t.$danger-ring;\n}\n\n// Type scale helper: @include text(14) → size + matching line-height.\n@mixin text($size, $weight: null) {\n  @if $size == 11 {\n    font-size: t.$text-11;\n    line-height: t.$leading-11;\n  } @else if $size == 12 {\n    font-size: t.$text-12;\n    line-height: t.$leading-12;\n  } @else if $size == 13 {\n    font-size: t.$text-13;\n    line-height: t.$leading-13;\n  } @else if $size == 14 {\n    font-size: t.$text-14;\n    line-height: t.$leading-14;\n  } @else if $size == 15 {\n    font-size: t.$text-15;\n    line-height: t.$leading-15;\n  } @else if $size == 16 {\n    font-size: t.$text-16;\n    line-height: t.$leading-16;\n  } @else if $size == 18 {\n    font-size: t.$text-18;\n    line-height: t.$leading-18;\n  } @else if $size == 20 {\n    font-size: t.$text-20;\n    line-height: t.$leading-20;\n  } @else if $size == 24 {\n    font-size: t.$text-24;\n    line-height: t.$leading-24;\n  } @else if $size == 32 {\n    font-size: t.$text-32;\n    line-height: t.$leading-32;\n    letter-spacing: t.$tracking-tight;\n  } @else {\n    @error \"text(): unsupported size #{$size}\";\n  }\n\n  @if $weight {\n    font-weight: $weight;\n  }\n}\n\n// An all-caps eyebrow label.\n@mixin eyebrow {\n  @include text(11, t.$weight-bold);\n  letter-spacing: t.$tracking-wider;\n  text-transform: uppercase;\n}\n\n@mixin truncate {\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n// Honour the reduced-motion preference for decorative movement.\n@mixin reduced-motion {\n  @media (prefers-reduced-motion: reduce) {\n    @content;\n  }\n}\n\n// --- Form furniture --------------------------------------------------------\n\n// The label above a field.\n@mixin field-label {\n  display: block;\n  margin: 0;\n  @include text(13, t.$weight-semibold);\n  color: t.$text-strong;\n}\n\n// Helper copy under a field.\n@mixin field-hint {\n  @include text(12, t.$weight-medium);\n  color: t.$text-soft;\n}\n\n// Validation copy under a field.\n@mixin field-error-text {\n  display: flex;\n  align-items: center;\n  gap: t.$space-3;\n  @include text(12, t.$weight-semibold);\n  color: t.$danger-text;\n}\n\n// Vertical stack of label + control + message.\n@mixin field-stack {\n  display: flex;\n  flex-direction: column;\n  gap: t.$space-3;\n}\n\n// --- Isolation from the WordPress admin stylesheets -------------------------\n//\n// WordPress styles form controls with selectors like `input[type=\"text\"]`\n// (0,1,1) and `.wp-admin p input[type=\"checkbox\"]` (0,2,1). A bare CSS-module\n// class is only (0,1,0), so core would win. Wrapping a module's rules in\n// `:is(#servv-wrap, .servv-ui)` adds an id to the specificity — (1,1,0) — which\n// outranks every core admin selector that reaches into our subtree, without\n// `!important` anywhere.\n//\n// `.servv-ui` is the same hook for the public widget, where themes misbehave in\n// the same way; add the class to the widget root when those views migrate.\n//\n//   @include m.scoped {\n//     .button { ... }\n//   }\n// `:global()` is required: inside a *.module.scss, css-loader would otherwise\n// hash `#servv-wrap` and `.servv-ui` as local names.\n@mixin scoped {\n  :is(:global(#servv-wrap), :global(.servv-ui)) {\n    @content;\n  }\n}\n\n// Neutralise the properties WordPress' forms.css sets on a native control.\n// Surgical on purpose: a blanket `all: revert` would also strip the inline\n// chrome that react-select, Quill and MUI give their own inputs.\n@mixin wp-reset-control {\n  box-sizing: border-box;\n  min-height: 0;\n  margin: 0;\n  border: 0;\n  border-radius: 0;\n  background: transparent;\n  box-shadow: none;\n  color: inherit;\n  font-family: inherit;\n  line-height: normal;\n  outline: 0;\n  appearance: none;\n\n  &:focus,\n  &:focus-visible {\n    border-color: transparent;\n    box-shadow: none;\n    outline: 0;\n  }\n}\n\n// Same, for an element rendered as a button.\n@mixin wp-reset-button {\n  box-sizing: border-box;\n  min-height: 0;\n  margin: 0;\n  background: none;\n  box-shadow: none;\n  text-decoration: none;\n  text-shadow: none;\n  vertical-align: baseline;\n  appearance: none;\n\n  &:focus {\n    outline: 0;\n  }\n}\n","@use \"../../styles/tokens\" as t;\n@use \"../../styles/mixins\" as m;\n\n@include m.scoped {\n  .button {\n    @include m.button-reset;\n    @include m.wp-reset-button;\n    @include m.control-base;\n\n    &:focus-visible {\n      @include m.focus-ring-raised;\n    }\n  }\n\n  // --- Variants --------------------------------------------------------------\n\n  .primary {\n    @include m.brand-fill;\n\n    &:focus-visible {\n      outline: none;\n      box-shadow: t.$shadow-brand, 0 0 0 3px t.$primary-ring;\n    }\n  }\n\n  .secondary {\n    @include m.raised;\n  }\n\n  .danger {\n    border: 1px solid t.$danger-text;\n    background-color: t.$danger-strong;\n    color: t.$text-on-primary;\n    box-shadow: t.$shadow-danger;\n\n    &:hover:not(:disabled) {\n      background-color: t.$danger-text;\n    }\n\n    &:focus-visible {\n      outline: none;\n      box-shadow: t.$shadow-danger, 0 0 0 3px t.$danger-ring;\n    }\n  }\n\n  // White surface, destructive intent — \"Remove\", \"Disconnect\".\n  .dangerSecondary {\n    border: 1px solid rgba(253, 162, 155, 0.9);\n    background: t.$surface;\n    color: t.$danger-text;\n    box-shadow: t.$shadow-raised;\n\n    &:hover:not(:disabled) {\n      background: t.$danger-surface;\n    }\n  }\n\n  // Chromeless — menu rows and inline links.\n  .ghost {\n    border: 0;\n    background: transparent;\n    border-radius: t.$radius-sm;\n    color: t.$text-strong;\n    box-shadow: none;\n\n    &:hover:not(:disabled) {\n      background: t.$primary-surface;\n    }\n  }\n\n  .dangerGhost {\n    border: 0;\n    background: transparent;\n    border-radius: t.$radius-sm;\n    color: t.$danger-text;\n    box-shadow: none;\n\n    &:hover:not(:disabled) {\n      background: t.$danger-surface;\n    }\n  }\n\n  // --- Sizes -----------------------------------------------------------------\n\n  .md {\n    height: t.$control-lg;\n    padding: 0 t.$space-8;\n    font-size: t.$text-14;\n  }\n\n  .sm {\n    height: t.$control-md;\n    padding: 0 t.$space-6;\n    font-size: t.$text-13;\n  }\n\n  .xs {\n    height: t.$control-xs;\n    padding: 0 t.$space-5;\n    font-size: t.$text-12;\n    border-radius: t.$radius-md;\n  }\n\n  // Secondary buttons sit one step tighter than the brand fill in the design.\n  .secondary.md,\n  .dangerSecondary.md {\n    padding: 0 t.$space-7;\n  }\n\n  // --- Parts -----------------------------------------------------------------\n\n  .fullWidth {\n    width: 100%;\n  }\n\n  // Square icon button — the design pairs one with the primary action.\n  .iconOnly {\n    padding: 0;\n    gap: 0;\n\n    &.md {\n      width: t.$control-lg;\n    }\n\n    &.sm {\n      width: t.$control-md;\n    }\n\n    &.xs {\n      width: t.$control-xs;\n    }\n  }\n\n  .icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: 0 0 auto;\n\n    svg {\n      display: block;\n      width: 16px;\n      height: 16px;\n      transition: background-color t.$duration t.$ease, color t.$duration-fast t.$ease, border-color t.$duration-fast t.$ease;\n    }\n  }\n\n  .button:hover:not(:disabled) .icon svg {\n    color: inherit;\n  }\n\n  .label {\n    @include m.truncate;\n  }\n}\n","@use \"../../styles/tokens\" as t;\n@use \"../../styles/mixins\" as m;\n\n@include m.scoped {\n  .page { color: t.$text; padding-bottom: 32px; min-width: 0; }\n  .headerActions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }\n  .dirty { @include m.text(13, t.$weight-medium); color: t.$text-soft; display: flex; align-items: center; gap: 8px;\n    &::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: t.$warning; }\n  }\n  .divider { height: 3px; margin-top: 20px; border-radius: t.$radius-pill; background: t.$surface; box-shadow: t.$shadow-track; }\n  .layout { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 20px; margin-top: 20px; align-items: start; }\n  .sections { display: flex; flex-direction: column; gap: 16px; min-width: 0; }\n  .card, .preview, .navigation { background: t.$surface; border: 1px solid t.$border; border-radius: t.$radius-2xl; box-shadow: t.$shadow-card; overflow: hidden; min-width: 0; }\n  .card[hidden] { display: none; }\n  .navigation { display: flex; flex-direction: column; gap: 3px; padding: 8px;\n    button { @include m.button-reset; @include m.wp-reset-button; border: 1px solid transparent; transition: background-color t.$duration t.$ease, border-color t.$duration-fast t.$ease; display: flex; align-items: center; gap: 10px; padding: 9px 10px; width: 100%; border-radius: t.$radius-lg; color: t.$text-soft; @include m.text(13, t.$weight-semibold); text-align: left;\n      > span:nth-child(2) { flex: 1; }\n      small { @include m.text(11, t.$weight-semibold); padding: 2px 6px; border-radius: t.$radius-pill; background: t.$surface-subtle; }\n      &:hover { background: t.$hover-surface; border-color: t.$hover-border; }\n      &:focus-visible { @include m.focus-ring; }\n      &.active { color: t.$primary-strong; background: t.$primary-surface; box-shadow: t.$shadow-chip-pressed; }\n    }\n  }\n  .navIcon { display: flex; padding: 5px; border-radius: t.$radius-sm; background: t.$surface; svg { width: 16px; height: 16px; } }\n  .card header { padding: 16px; border-bottom: 1px solid t.$border-hairline; }\n  .card h2 { margin: 0; @include m.text(15, t.$weight-bold); }\n  .card p, .hint { color: t.$text-soft; @include m.text(12, t.$weight-medium); line-height: 1.6; }\n  .fields { display: flex; flex-direction: column; gap: 16px; padding: 16px; }\n  .field { display: flex; flex-direction: column; gap: 7px; min-width: 0; @include m.text(13, t.$weight-semibold);\n    input, select { @include m.wp-reset-control; @include m.field-surface; width: 100%; min-width: 0; height: 40px; padding: 0 10px; color: t.$text; @include m.text(13, t.$weight-medium); &:focus { @include m.focus-ring; } }\n    select { appearance: auto; }\n    input[type=color] { padding: 4px; }\n  }\n  .field small, .toggle small { display: block; color: t.$text-soft; @include m.text(12, t.$weight-medium); line-height: 1.5; }\n  .toggle { display: flex; align-items: flex-start; gap: 11px; padding: 4px 0 12px; @include m.text(13, t.$weight-semibold); border-bottom: 1px solid t.$border-hairline;\n    input[type=checkbox] { @include m.wp-reset-control; position: relative; flex: 0 0 36px; width: 36px; height: 22px; padding: 0; border-radius: t.$radius-pill; background: t.$border; box-shadow: t.$shadow-track; cursor: pointer;\n      &::before { content: ''; display: block; position: absolute; box-sizing: border-box; width: 16px; height: 16px; margin: 0; padding: 0; mask: none; float: none; left: 3px; top: 3px; border-radius: 50%; background: t.$surface; box-shadow: none; transition: transform .15s ease; }\n      &:checked { background: t.$primary; box-shadow: inset 0 1px 2px rgba(0, 0, 0, .08); &::before { content: ''; transform: translateX(14px); } &::after { display: none; } }\n      &:focus-visible { outline: 2px solid t.$primary-border-strong; outline-offset: 2px; }\n    }\n  }\n  .modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px;\n    label { @include m.field-surface; display: flex; align-items: center; gap: 7px; padding: 12px 8px; cursor: pointer; @include m.text(12, t.$weight-semibold); }\n    .selected { border-color: t.$primary-border; background: t.$primary-surface; color: t.$primary-strong; }\n    input[type=radio] { @include m.wp-reset-control; position: relative; flex: 0 0 16px; width: 16px; height: 16px; min-width: 16px; padding: 0; border: 1px solid t.$border-field; border-radius: 50%; background: t.$surface; cursor: pointer;\n      &::before { content: none; }\n      &:checked::before { content: ''; display: block; position: absolute; width: 8px; height: 8px; margin: 0; float: none; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%; background: t.$primary; }\n      &:focus { border-color: t.$border-field; }\n      &:focus-visible { @include m.focus-ring; }\n    }\n  }\n  .preview { position: sticky; top: var(--wp-admin--admin-bar--height, 32px); align-self: start; display: flex; flex-direction: column; height: calc(100vh - var(--wp-admin--admin-bar--height, 32px) - 16px); height: calc(100dvh - var(--wp-admin--admin-bar--height, 32px) - 16px); }\n  .previewHead { display: flex; flex-shrink: 0; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; padding: 16px; border-bottom: 1px solid t.$border-hairline; }\n  .live { display: flex; align-items: center; gap: 8px; @include m.text(14, t.$weight-bold); &::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: t.$success; } }\n  .previewMeta { display: block; padding-left: 15px; margin-top: 3px; color: t.$text-soft; @include m.text(12, t.$weight-medium); }\n  .preview > p { flex-shrink: 0; margin: 12px 16px; }\n  .frame { display: block; flex: 1; min-height: 0; border: 0; width: 100%; height: auto; background: t.$surface; }\n  .embed textarea { @include m.field-surface; display: block; width: calc(100% - 32px); box-sizing: border-box; margin: 16px; padding: 12px; color: t.$text-soft; font-family: ui-monospace, monospace; font-size: 12px; resize: vertical; &:focus { @include m.focus-ring; } }\n  .embedActions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 0 16px; @include m.text(12, t.$weight-medium); color: t.$text-soft; }\n  .embed .hint { padding: 0 16px 10px; }\n  .error, .notice { padding: 12px; border-radius: t.$radius-md; @include m.text(13, t.$weight-medium); }\n  .error { color: t.$danger-text; background: t.$danger-surface; }\n  .notice { color: t.$success-text; background: t.$success-surface; }\n  .colorControl { display: flex; gap: 8px; input[type=color] { width: 44px; flex-shrink: 0; } }\n  @media (max-width: 900px) { .layout { grid-template-columns: minmax(0, 1fr); } .preview { position: static; } .navigation { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } }\n  @media (max-width: 480px) { .navigation { grid-template-columns: 1fr; } }\n}\n"],"names":[],"sourceRoot":""}