/* ========================================================================== 
   SDB — Design System v5.8.0
   Admin Layouts, Module Blocks & Microcomponents
   Additive, scoped and non-functional contracts for SDB/admin product pages.
   ========================================================================== */

:root {
  --sdb-layout-gap-sm: var(--sdb-space-sm, .75rem);
  --sdb-layout-gap-md: var(--sdb-space-md, 1.25rem);
  --sdb-layout-gap-lg: var(--sdb-space-lg, 2rem);
  --sdb-layout-gap: var(--sdb-layout-gap-md);
  --sdb-layout-aside-width: 320px;
  --sdb-layout-main-min-width: 0;
  --sdb-space-2: .5rem;
  --sdb-space-3: .75rem;
  --sdb-space-4: 1rem;
  --sdb-space-6: 1.5rem;
  --sdb-space-8: 2rem;
  --sdb-space-12: 3rem;
  --sdb-space-16: 4rem;
  --sdb-space-20: 5rem;
  --sdb-space-24: 6rem;
  --sdb-space-32: 8rem;
  --sdb-module-block-bg: var(--sdb-color-surface, #fff);
  --sdb-module-block-border: var(--sdb-color-border, #e6eef7);
  --sdb-module-block-radius: var(--sdb-radius-lg, 18px);
  --sdb-module-block-padding: var(--sdb-space-6, 1.5rem);
  --sdb-module-block-header-padding: var(--sdb-space-4, 1rem) var(--sdb-space-6, 1.5rem);
  --sdb-module-block-footer-padding: var(--sdb-space-4, 1rem) var(--sdb-space-6, 1.5rem);
  --sdb-module-block-min-height: 0;
  --sdb-day-agenda-time-width: 4.75rem;
  --sdb-day-agenda-slot-height: 3.5rem;
  --sdb-day-agenda-event-bg: color-mix(in srgb, var(--sdb-color-primary, #0058b7) 12%, #fff);
  --sdb-day-agenda-event-border: color-mix(in srgb, var(--sdb-color-primary, #0058b7) 26%, var(--sdb-color-border, #e6eef7));
  --sdb-day-agenda-event-active-bg: color-mix(in srgb, var(--sdb-color-primary, #0058b7) 18%, #fff);
}

body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) :where(.sdb-layout-grid,.sdb-layout-split,.sdb-layout-stack,.sdb-layout-cluster) { box-sizing: border-box; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-layout-grid { display: grid; gap: var(--sdb-layout-gap); grid-template-columns: 1fr; min-width: 0; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-layout-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-layout-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-layout-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-layout-split { display: grid; gap: var(--sdb-layout-gap); grid-template-columns: minmax(var(--sdb-layout-main-min-width), 1fr) var(--sdb-layout-aside-width); align-items: start; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-layout-split--1-2,
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-layout-split--aside-main { grid-template-columns: var(--sdb-layout-aside-width) minmax(var(--sdb-layout-main-min-width), 1fr); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-layout-split--2-1,
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-layout-split--main-aside { grid-template-columns: minmax(0, 2fr) minmax(240px, 1fr); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-layout-stack { display: flex; flex-direction: column; gap: var(--sdb-layout-gap); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-layout-cluster { display: flex; flex-wrap: wrap; gap: var(--sdb-layout-gap-sm); align-items: center; }

body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block { min-height: var(--sdb-module-block-min-height); background: var(--sdb-module-block-bg); border: 1px solid var(--sdb-module-block-border); border-radius: var(--sdb-module-block-radius); box-shadow: var(--sdb-shadow-card, 0 14px 34px rgba(15,23,42,.06)); overflow: clip; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block__header,
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block__footer { display: flex; align-items: center; justify-content: space-between; gap: var(--sdb-space-4); padding: var(--sdb-module-block-header-padding); border-block-end: 1px solid var(--sdb-module-block-border); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block__footer { border-block-start: 1px solid var(--sdb-module-block-border); border-block-end: 0; padding: var(--sdb-module-block-footer-padding); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block__body { padding: var(--sdb-module-block-padding); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block__title { margin: 0; color: var(--sdb-color-title, #1f2937); font-size: 1rem; font-weight: var(--sdb-font-weight-bold, 700); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block__subtitle { margin: .25rem 0 0; color: var(--sdb-color-muted, #6b7785); font-size: .875rem; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block--compact { --sdb-module-block-padding: var(--sdb-space-4); --sdb-module-block-header-padding: .85rem 1rem; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block--tall { --sdb-module-block-min-height: 24rem; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block--empty .sdb-module-block__body { display: grid; min-height: 10rem; place-items: center; color: var(--sdb-color-muted, #6b7785); text-align: center; }

body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-info-block { display: grid; gap: .35rem; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-info-block__label,
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-info-block__meta { color: var(--sdb-color-muted, #6b7785); font-size: .8rem; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-info-block__value { color: var(--sdb-color-title, #1f2937); font-size: clamp(1.75rem, 3vw, 2.75rem); font-weight: var(--sdb-font-weight-bold, 700); line-height: 1; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-info-block--horizontal { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sdb-space-4); }

body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) :where(.sdb-task-list-block,.sdb-message-list,.sdb-activity-feed,.sdb-menu-list) { display: grid; gap: var(--sdb-space-3); margin: 0; padding: 0; list-style: none; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) :where(.sdb-task-list-item,.sdb-message-item,.sdb-activity-item,.sdb-menu-list__item,.sdb-kanban-block__card) { display: grid; gap: .35rem; padding: .9rem 1rem; border: 1px solid var(--sdb-color-border, #e6eef7); border-radius: var(--sdb-radius-md, 14px); background: var(--sdb-color-surface, #fff); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-task-list-item { grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) :where(.sdb-task-list-item__title,.sdb-message-item__title,.sdb-menu-list__link) { color: var(--sdb-color-title, #1f2937); font-weight: var(--sdb-font-weight-semibold, 600); text-decoration: none; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) :where(.sdb-task-list-item__description,.sdb-message-item__excerpt,.sdb-message-item__meta,.sdb-activity-item,.sdb-message-item__time,.sdb-menu-list__meta) { color: var(--sdb-color-muted, #6b7785); font-size: .875rem; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-task-card { display: grid; gap: var(--sdb-space-4); padding: var(--sdb-space-5, 1.25rem); border: 1px solid var(--sdb-color-border, #e6eef7); border-radius: var(--sdb-radius-lg, 18px); background: var(--sdb-color-surface, #fff); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-task-card__footer { display: flex; align-items: center; justify-content: space-between; gap: var(--sdb-space-3); border-block-start: 1px solid var(--sdb-color-border, #e6eef7); padding-block-start: var(--sdb-space-3); }

body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-calendar-block__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .35rem; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-calendar-block__day { min-height: 4.5rem; padding: .65rem; border: 1px solid var(--sdb-color-border, #e6eef7); border-radius: var(--sdb-radius-sm, 10px); background: var(--sdb-color-surface, #fff); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-day-agenda { display: grid; gap: 0; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-day-agenda__slot { display: grid; grid-template-columns: var(--sdb-day-agenda-time-width) minmax(0, 1fr); min-height: var(--sdb-day-agenda-slot-height); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-day-agenda__time { color: var(--sdb-color-muted, #6b7785); font-size: .8rem; padding-block: .75rem; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-day-agenda__event { align-self: stretch; padding: .75rem 1rem; border-inline-start: 3px solid var(--sdb-day-agenda-event-border); border-radius: var(--sdb-radius-sm, 10px); background: var(--sdb-day-agenda-event-bg); color: var(--sdb-color-title, #1f2937); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-day-agenda__event--selected { background: var(--sdb-day-agenda-event-active-bg); border-inline-start-color: var(--sdb-color-primary, #0058b7); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-day-agenda__event--muted { opacity: .72; }

body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-tab-list-block__tabs { border-block-end: 1px solid var(--sdb-color-border, #e6eef7); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-tab-list-block__panel { padding-block-start: var(--sdb-space-4); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-kanban-block { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--sdb-layout-gap); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-kanban-block__column { display: grid; align-content: start; gap: var(--sdb-space-3); padding: var(--sdb-space-4); border: 1px solid var(--sdb-color-border, #e6eef7); border-radius: var(--sdb-radius-lg, 18px); background: var(--sdb-color-background, #f5f8fb); }

body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-dropdown { position: relative; display: inline-grid; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-dropdown-menu { min-width: 12rem; margin-block-start: .35rem; padding: .35rem; border: 1px solid var(--sdb-color-border, #e6eef7); border-radius: var(--sdb-radius-md, 14px); background: var(--sdb-color-surface, #fff); box-shadow: var(--sdb-shadow-element, 0 10px 24px rgba(15,23,42,.08)); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-dropdown-item { display: flex; gap: .5rem; align-items: center; min-height: 2.25rem; padding: .45rem .6rem; border-radius: var(--sdb-radius-sm, 10px); color: var(--sdb-color-title, #1f2937); text-decoration: none; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-dropdown-item:is(:hover,:focus-visible) { background: var(--sdb-color-background, #f5f8fb); outline: 2px solid transparent; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-toggle,
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-switch { --sdb-toggle-size: 1.35rem; display: inline-flex; align-items: center; gap: .55rem; color: var(--sdb-color-title, #1f2937); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-toggle__control,
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-switch__control { width: calc(var(--sdb-toggle-size) * 1.9); height: var(--sdb-toggle-size); border-radius: 999px; background: var(--sdb-color-border, #e6eef7); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--sdb-color-text, #6b7785) 20%, transparent); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) :where(.sdb-toggle[aria-checked="true"] .sdb-toggle__control,.sdb-switch[aria-checked="true"] .sdb-switch__control) { background: var(--sdb-color-primary, #0058b7); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-notification-bar { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sdb-space-3); padding: var(--sdb-space-4); border: 1px solid var(--sdb-admin-accent-surface-border, var(--sdb-color-border)); border-inline-start: 3px solid var(--sdb-color-primary, #0058b7); border-radius: var(--sdb-radius-md, 14px); background: var(--sdb-color-surface, #fff); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-icon-card { display: grid; gap: var(--sdb-space-3); padding: var(--sdb-space-6); border: 1px solid var(--sdb-color-border, #e6eef7); border-radius: var(--sdb-radius-lg, 18px); background: var(--sdb-color-surface, #fff); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-card--with-footer-actions .sdb-card__footer { display: flex; align-items: center; justify-content: flex-end; gap: var(--sdb-space-3); border-block-start: 1px solid var(--sdb-color-border, #e6eef7); padding-block-start: var(--sdb-space-4); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-card--floating-media { position: relative; overflow: hidden; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-card--floating-media .sdb-card__body { margin: -3rem var(--sdb-space-4) var(--sdb-space-4); position: relative; border-radius: var(--sdb-radius-md, 14px); background: var(--sdb-color-surface, #fff); box-shadow: var(--sdb-shadow-element, 0 10px 24px rgba(15,23,42,.08)); }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-textarea-field { display: grid; gap: .45rem; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-admin-data-table--users .sdb-admin-table-user-cell { display: flex; align-items: center; gap: .75rem; min-width: 12rem; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-admin-table-status-cell { white-space: nowrap; }
body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-admin-table-actions-cell { text-align: end; white-space: nowrap; }

@media (max-width: 1024px) {
  body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) :where(.sdb-layout-grid--4,.sdb-layout-grid--3) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) :where(.sdb-layout-split,.sdb-layout-split--1-2,.sdb-layout-split--2-1,.sdb-layout-split--main-aside,.sdb-layout-split--aside-main) { grid-template-columns: 1fr; }
}
@media (max-width: 782px) {
  body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) :where(.sdb-layout-grid--4,.sdb-layout-grid--3,.sdb-layout-grid--2) { grid-template-columns: 1fr; }
  body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block__header,
  body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-module-block__footer { align-items: flex-start; flex-direction: column; }
  body.wp-admin :where(.wrap.sdb-admin-page,.sdb-admin-page,.sdb-plugin-shell,.sdb-admin-dashboard) .sdb-day-agenda__slot { grid-template-columns: 1fr; }
}

/* ========================================================================== 
   SDB DS v5.8.2 — Visual Map consolidation and defensive previews
   ========================================================================== */
body.wp-admin .sdb-stylebook-page {
  --sdb-vm-card-min: 218px;
  --sdb-vm-card-preview-bg: #f5f8fb;
  --sdb-vm-card-preview-border: #e6eef7;
  --sdb-vm-status-ready-bg: #e9f6ee;
  --sdb-vm-status-ready-fg: #1e5f34;
  --sdb-vm-status-watch-bg: #fff5e1;
  --sdb-vm-status-watch-fg: #8a4b00;
}
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--sdb-vm-card-min)), 1fr));
  gap: clamp(14px, 1.5vw, 20px);
  align-items: stretch;
}
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card {
  display: grid;
  grid-template-rows: minmax(132px, auto) 1fr;
  min-width: 0;
  overflow: hidden;
  box-sizing: border-box;
}
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card[hidden] {
  display: none !important;
}
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card__preview {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 132px;
  padding: 14px;
  overflow: hidden;
  background: var(--sdb-vm-card-preview-bg);
  border-radius: var(--sdb-radius-md, 12px);
  box-sizing: border-box;
}
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card__preview > * {
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card__meta {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
}
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card__meta > code,
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-family-list code,
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card pre code {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  line-height: 1.35;
}
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card__meta p,
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card__meta span,
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card__meta small,
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card__meta a {
  min-width: 0;
  overflow-wrap: anywhere;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-status span,
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-status em,
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-governance span {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.2;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-status span {
  color: var(--sdb-vm-status-ready-fg);
  background: var(--sdb-vm-status-ready-bg);
}
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card--experimental .sdb-stylebook-vm-status span,
body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card--watch .sdb-stylebook-vm-status span {
  color: var(--sdb-vm-status-watch-fg);
  background: var(--sdb-vm-status-watch-bg);
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-status em {
  color: var(--sdb-color-muted, #6b7785);
  background: #f1f5f9;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-family-list {
  margin-block-start: 6px;
  padding-block-start: 8px;
  border-block-start: 1px solid var(--sdb-color-border, #e6eef7);
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-family-list summary {
  color: var(--sdb-color-primary, #0058b7);
  cursor: pointer;
  font-weight: 700;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-family-list > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-block-start: 8px;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-family-list code {
  display: inline-flex;
  padding: 4px 6px;
  background: #eef3f8;
  border-radius: 6px;
  font-size: 11px;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-governance {
  margin: 0 0 22px;
  padding: clamp(16px, 1.8vw, 22px);
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-governance h2 {
  margin: 0 0 8px;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-governance p {
  max-width: 920px;
  margin: 0 0 12px;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-governance > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-governance span {
  color: #0b4a8f;
  background: #e4f1ff;
}
body.wp-admin .sdb-stylebook-page :where(.sdb-stylebook-vm-actions,.sdb-stylebook-vm-feedback,.sdb-stylebook-vm-nav,.sdb-stylebook-vm-people) {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: center;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-actions .sdb-btn {
  max-width: 100%;
  white-space: normal;
}
body.wp-admin .sdb-stylebook-page :where(.sdb-stylebook-vm-form,.sdb-stylebook-vm-primitive,.sdb-stylebook-vm-placeholder) {
  display: grid;
  gap: 8px;
  width: min(100%, 180px);
  padding: 12px;
  border: 1px dashed var(--sdb-vm-card-preview-border);
  border-radius: var(--sdb-radius-md, 12px);
  background: #fff;
  text-align: left;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-form label {
  display: grid;
  gap: 5px;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-form input[type="text"] {
  width: 100%;
  min-height: 34px;
  border: 1px solid #dbe5f0;
  border-radius: 10px;
}
body.wp-admin .sdb-stylebook-page :where(.sdb-stylebook-vm-editorial,.sdb-stylebook-vm-cause) {
  display: grid;
  gap: 8px;
  width: min(100%, 168px);
  padding: 12px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(15, 35, 60, .08);
}
body.wp-admin .sdb-stylebook-page :where(.sdb-stylebook-vm-editorial,.sdb-stylebook-vm-cause) figure {
  position: relative;
  height: 86px;
  margin: 0;
  border-radius: 12px;
  background: linear-gradient(135deg, #2b66c7, #66bee7);
}
body.wp-admin .sdb-stylebook-page :where(.sdb-stylebook-vm-editorial,.sdb-stylebook-vm-cause) figure span {
  position: absolute;
  inset-block-start: 8px;
  inset-inline-start: 8px;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}
body.wp-admin .sdb-stylebook-page :where(.sdb-stylebook-vm-editorial,.sdb-stylebook-vm-cause) strong {
  color: #061532;
  font-size: 16px;
  line-height: 1.1;
}
body.wp-admin .sdb-stylebook-page :where(.sdb-stylebook-vm-editorial,.sdb-stylebook-vm-cause) p,
body.wp-admin .sdb-stylebook-page :where(.sdb-stylebook-vm-editorial,.sdb-stylebook-vm-cause) time,
body.wp-admin .sdb-stylebook-page :where(.sdb-stylebook-vm-editorial,.sdb-stylebook-vm-cause) small {
  margin: 0;
  color: var(--sdb-color-muted, #6b7785);
  font-size: 12px;
  line-height: 1.35;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-cause > div {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #ffe7d8;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-cause > div span {
  display: block;
  height: 100%;
  background: #f26722;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-file,
body.wp-admin .sdb-stylebook-page .sdb-stylebook-preview-list {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  width: min(100%, 190px);
  padding: 12px;
  border: 1px solid #dbe5f0;
  border-radius: 12px;
  background: #fff;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-file a,
body.wp-admin .sdb-stylebook-page .sdb-stylebook-preview-list a {
  grid-column: 1 / -1;
  justify-self: start;
  max-width: 100%;
  overflow-wrap: anywhere;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-table {
  width: min(100%, 180px);
  border-collapse: collapse;
  background: #fff;
  border: 1px solid #ccd8e5;
  border-radius: 10px;
  overflow: hidden;
  font-size: 12px;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-table th,
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-table td {
  padding: 7px 8px;
  border-bottom: 1px solid #e6eef7;
  text-align: left;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-event {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  width: min(100%, 190px);
  padding: 12px;
  border: 1px solid #dbe5f0;
  border-radius: 12px;
  background: #fff;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-event > span {
  display: grid;
  place-items: center;
  width: 48px;
  min-height: 54px;
  border-radius: 12px;
  background: #1f5fbc;
  color: #fff;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-overlay {
  width: min(100%, 190px);
  padding: 12px;
  border-radius: 14px;
  background: linear-gradient(135deg, #eef3f8, #fff);
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-overlay aside {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid #dbe5f0;
  border-radius: 12px;
  background: #fff;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-vm-people > span {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  background: #e4f1ff;
  color: #0b4a8f;
  font-weight: 800;
}
body.wp-admin .sdb-stylebook-page .sdb-stylebook-media {
  width: 100%;
  min-height: 120px;
}
body.wp-admin .sdb-stylebook-page .sdb-editorial-card,
body.wp-admin .sdb-stylebook-page .sdb-catalog-card,
body.wp-admin .sdb-stylebook-page .ed-card {
  width: min(100%, 176px);
  max-width: 100%;
  overflow: hidden;
}
body.wp-admin .sdb-stylebook-page .sdb-editorial-title {
  overflow-wrap: anywhere;
  hyphens: auto;
}
@media (max-width: 782px) {
  body.wp-admin .sdb-stylebook-page .sdb-component-inspector-card {
    grid-template-rows: auto 1fr;
  }
}