/**
 * Theme Dashboard
 *
 */
/* Dashboard design tokens. Every custom property lives here; components read
   them, they never declare their own. */
body {
  /* Color (WP 7.0 "Modern" admin scheme) */
  --sydney-dashboard-primary: var(--wp-admin-theme-color, #3858e9);
  --sydney-dashboard-primary-hover: var(--wp-admin-theme-color-darker-10, #2145e6);
  --sydney-dashboard-primary-tint: #ebeefd;
  --sydney-dashboard-primary-tint-light: #f5f7fe;
  --sydney-dashboard-primary-tint-border: #d3daf9;
  --sydney-dashboard-primary-tint-border-light: #dde3fa;
  --sydney-dashboard-success: #4ab866;
  --sydney-dashboard-success-hover: #3da556;
  --sydney-dashboard-success-tint: #eff9f1;
  /* One red and one tint are authored; the state shades mix off them. */
  --sydney-dashboard-danger: #cc1818;
  --sydney-dashboard-danger-hover: color-mix(in srgb, var(--sydney-dashboard-danger) 80%, #000);
  --sydney-dashboard-danger-tint: #fcf0f0;
  --sydney-dashboard-danger-tint-hover: color-mix(in srgb, var(--sydney-dashboard-danger) 13.5%, #fff);
  --sydney-dashboard-warning: #f6ca45;
  --sydney-dashboard-info: #967be3;
  --sydney-dashboard-gray-900: #1e1e1e;
  --sydney-dashboard-gray-700: #757575;
  --sydney-dashboard-gray-600: #949494;
  --sydney-dashboard-gray-400: #cccccc;
  --sydney-dashboard-gray-300: #dddddd;
  --sydney-dashboard-gray-100: #f0f0f0;

  /* Surface, text and border roles. Components reach for these, not for a gray
     rung, so a palette change lands in one place. */
  --sydney-dashboard-surface: #fff;
  --sydney-dashboard-surface-sunken: #f7f7f7;
  --sydney-dashboard-surface-sunken-light: #fafbfc;
  --sydney-dashboard-on-accent: #fff;
  --sydney-dashboard-border: var(--sydney-dashboard-gray-300);
  --sydney-dashboard-border-subtle: var(--sydney-dashboard-gray-100);
  --sydney-dashboard-border-strong: var(--sydney-dashboard-gray-400);

  /* Scrims */
  --sydney-dashboard-scrim: rgba(0, 0, 0, 0.5);
  --sydney-dashboard-scrim-strong: rgba(0, 0, 0, 0.7);
  --sydney-dashboard-scrim-light: rgba(255, 255, 255, 0.7);
  --sydney-dashboard-veil-dark: rgba(30, 30, 30, 0.9);

  /* Third-party brand */
  --sydney-dashboard-brand-elementor: #92003b;

  /* Radius */
  --sydney-dashboard-radius-sm: 4px;
  --sydney-dashboard-radius-md: 6px;
  --sydney-dashboard-radius-lg: 8px;
  --sydney-dashboard-radius-pill: 999px;
  --sydney-dashboard-radius-circle: 50%;

  /* Elevation. One tinted family - pure-black shadows read as grey haze over
     the admin's off-white background. */
  --sydney-dashboard-shadow-sm: 0 1px 2px rgba(28, 32, 40, 0.15);
  --sydney-dashboard-shadow-md: 0 8px 16px rgba(28, 32, 40, 0.05);
  --sydney-dashboard-shadow-card: 0 1px 2px rgba(28, 32, 40, 0.05), 0 10px 28px -20px rgba(28, 32, 40, 0.28);
  --sydney-dashboard-shadow-popover: 0 18px 44px -14px rgba(28, 32, 40, 0.3), 0 2px 6px rgba(28, 32, 40, 0.06);
  --sydney-dashboard-shadow-modal: 0 12px 48px rgba(28, 32, 40, 0.25);
  --sydney-dashboard-shadow-sidebar: -10px 12px 14px rgba(28, 32, 40, 0.05);

  /* Space (4px scale, index = multiplier) */
  --sydney-dashboard-space-1: 4px;
  --sydney-dashboard-space-2: 8px;
  --sydney-dashboard-space-3: 12px;
  --sydney-dashboard-space-4: 16px;
  --sydney-dashboard-space-5: 20px;
  --sydney-dashboard-space-6: 24px;
  --sydney-dashboard-space-7: 28px;
  --sydney-dashboard-space-8: 32px;
  --sydney-dashboard-space-9: 36px;
  --sydney-dashboard-space-10: 40px;
  --sydney-dashboard-space-12: 48px;
  --sydney-dashboard-space-15: 60px;
  --sydney-dashboard-space-17: 68px;
  --sydney-dashboard-space-26: 104px;
  --sydney-dashboard-space-40: 160px;

  /* Derived so a bleed can't drift from the padding it cancels */
  --sydney-dashboard-space-1-neg: calc(-1 * var(--sydney-dashboard-space-1));
  --sydney-dashboard-space-4-neg: calc(-1 * var(--sydney-dashboard-space-4));
  --sydney-dashboard-space-5-neg: calc(-1 * var(--sydney-dashboard-space-5));
  --sydney-dashboard-space-7-neg: calc(-1 * var(--sydney-dashboard-space-7));
  --sydney-dashboard-space-8-neg: calc(-1 * var(--sydney-dashboard-space-8));
  --sydney-dashboard-space-10-neg: calc(-1 * var(--sydney-dashboard-space-10));

  /* Optical 1px corrections - off the scale on purpose */
  --sydney-dashboard-nudge: 1px;
  --sydney-dashboard-nudge-neg: calc(-1 * var(--sydney-dashboard-nudge));

  /* Type */
  --sydney-dashboard-font-size-xs: 11px;
  --sydney-dashboard-font-size-sm: 12px;
  --sydney-dashboard-font-size-base: 13px;
  --sydney-dashboard-font-size-md: 14px;
  --sydney-dashboard-font-size-lg: 16px;
  --sydney-dashboard-font-size-xl: 18px;
  --sydney-dashboard-font-size-2xl: 20px;
  --sydney-dashboard-font-size-3xl: 24px;
  --sydney-dashboard-font-weight-normal: 400;
  --sydney-dashboard-font-weight-medium: 500;
  --sydney-dashboard-font-weight-semibold: 600;
  --sydney-dashboard-font-weight-bold: 700;
  --sydney-dashboard-line-height-tight: 1.2;
  --sydney-dashboard-line-height-snug: 1.4;

  /* Motion */
  --sydney-dashboard-duration-fast: 150ms;
  --sydney-dashboard-duration-base: 200ms;
  --sydney-dashboard-duration-slow: 300ms;
  --sydney-dashboard-ease-emphasized: cubic-bezier(0.4, 0, 0.2, 1);

  /* Layers. Only the page-level stacking order is tokenised; the 1 and 2 that
     order children inside a component stay local to it. */
  --sydney-dashboard-z-dropdown: 30;
  --sydney-dashboard-z-sidebar: 1000;
  --sydney-dashboard-z-overlay: 9999;
  --sydney-dashboard-z-modal: 999999;

  /* Layout */
  --sydney-dashboard-container-max: 1280px;
  --sydney-dashboard-card-min: 320px;
  --sydney-dashboard-admin-bar-height: 32px;

  /* Template part icon box size, and that size plus the gap to the text, which
     is what .part-icon turns into its right margin. */
  --sydney-dashboard-part-icon-size: 36px;
  --sydney-dashboard-part-icon-offset: 50px;
}
/* Color hooks for inline SVGs that use fill="currentColor" or stroke="currentColor" */
.sydney-svg-accent {
  color: var(--sydney-dashboard-primary);
}
.sydney-svg-muted {
  color: var(--sydney-dashboard-gray-600);
}
/* override atss grid */
.sydney-dashboard .atss-demos {
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)) !important;
}
.sydney-dashboard .atss {
  width: 100%;
}
.sydney-dashboard .atss-demo-name {
  font-size: var(--sydney-dashboard-font-size-lg) !important;
}
.sydney-dashboard .atss-demo-data {
  flex-direction: column;
  align-items: flex-start;
}
.sydney-dashboard .atss-demo-image figure::before {
  display: table;
  width: 0;
  height: 100%;
  padding-bottom: 67%;
  content: '';
}
.sydney-dashboard .atss-demo-badge-pro {
  background-color: var(--sydney-dashboard-primary);
}
.sydney-dashboard .atss-demo-image figure img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}
.sydney-dashboard .atss-demo-item {
  border: 2px solid var(--sydney-dashboard-border-subtle);
  border-radius: var(--sydney-dashboard-radius-lg);
}
/* Restates the plugin's imported outline, which the shorthand above outranks. */
.sydney-dashboard .atss-demo-item-imported {
  border-color: var(--sydney-dashboard-primary);
}
/* Nests inside the 2px border, so it sits a step below the card's radius. */
.sydney-dashboard .atss-demo-image img {
  border-radius: var(--sydney-dashboard-radius-md) var(--sydney-dashboard-radius-md) 0 0;
}

/* Helpers. All !important by design. px-named classes are deprecated aliases. */
.bt-m-0 {
  margin: 0 !important;
}

.bt-mt-0 {
  margin-top: 0 !important;
}

.bt-mt-2 {
  margin-top: var(--sydney-dashboard-space-2) !important;
}

.bt-mt-5,
.bt-mt-20px {
  margin-top: var(--sydney-dashboard-space-5) !important;
}

.bt-mb-0 {
  margin-bottom: 0 !important;
}

.bt-mb-2 {
  margin-bottom: var(--sydney-dashboard-space-2) !important;
}

.bt-mb-5,
.bt-mb-20px {
  margin-bottom: var(--sydney-dashboard-space-5) !important;
}

.bt-pt-0 {
  padding-top: 0 !important;
}

.bt-p-relative {
  position: relative !important;
}

.bt-d-none {
  display: none !important;
}

.bt-d-flex {
  display: flex !important;
}
.bt-d-block {
  display: block !important;
}
.bt-justify-content-between {
          justify-content: space-between !important;
}

.bt-align-items-center {
          align-items: center !important;
}

.bt-align-items-end {
          align-items: flex-end !important;
}

.bt-flex-center {
  display: flex !important;
          align-items: center !important;
}

.bt-inline-flex-center {
  display: inline-flex !important;
          align-items: center !important;
}

.bt-zindex-2 {
  z-index: 2 !important;
}

.bt-font-weight-500 {
  font-weight: var(--sydney-dashboard-font-weight-medium) !important;
}

.bt-border-color-primary {
  border-color: var(--sydney-dashboard-primary) !important;
}

.bt-text-color-grey {
  color: var(--sydney-dashboard-gray-700) !important;
}

/* Animations */
@keyframes sydney-spin {
  100% {
            transform: rotate(360deg);
  }
}

/* Grid */
.sydney-dashboard-row {
  display: flex;
      flex-wrap: wrap;
  gap: var(--sydney-dashboard-space-5);
}

.sydney-dashboard-column {
      flex-basis: 100%;
}

@media (min-width: 768px) {
  .sydney-dashboard-column.sydney-dashboard-column-4 {
        flex-basis: calc( 50% - 10px);
  }
}

@media (min-width: 1025px) {
  .sydney-dashboard-column.sydney-dashboard-column-2 {
        flex-basis: calc( 16.6666% - 10px);
  }
  .sydney-dashboard-column.sydney-dashboard-column-3 {
        flex-basis: calc( 30% - 10px);
  }
  .sydney-dashboard-column.sydney-dashboard-column-4 {
        flex-basis: calc( 33.333333% - 14px);
  }
  .sydney-dashboard-column.sydney-dashboard-column-9 {
        flex-basis: calc( 70% - 10px);
  }
  .sydney-dashboard-column.sydney-dashboard-column-10 {
        flex-basis: calc( 83.333% - 10px);
  }
}

@media (min-width: 1600px) {
  .sydney-dashboard-column.sydney-dashboard-column-3 {
        flex-basis: calc( 25% - 10px);
  }
  .sydney-dashboard-column.sydney-dashboard-column-9 {
        flex-basis: calc( 75% - 10px);
  }
}

/* Hide Notices */
#wpbody-content {
  padding-bottom: var(--sydney-dashboard-space-6);
}

#wpbody-content .notice:not(.sydney-license-notice) {
  display: none !important;
}

/* General */
.sydney-dashboard {
  padding: var(--sydney-dashboard-space-5) var(--sydney-dashboard-space-5) var(--sydney-dashboard-space-5) 0;
          box-sizing: border-box;
}

.sydney-dashboard * {
          box-sizing: border-box;
}

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

.sydney-dashboard figure {
  margin: 0;
}

.sydney-dashboard figure img {
  vertical-align: top;
}

.sydney-dashboard img {
  max-width: 100%;
  height: auto;
}

.sydney-dashboard .button {
  padding: var(--sydney-dashboard-space-3) var(--sydney-dashboard-space-6);
  font-size: var(--sydney-dashboard-font-size-md);
  line-height: 20px;
  margin-bottom: 0;
  display: inline-flex;
  text-align: center;
          align-items: center;
          justify-content: center;
}

.sydney-dashboard .button:focus {
          box-shadow: none;
}

.sydney-dashboard .button .dashicons {
  margin-right: var(--sydney-dashboard-space-1);
}

/* Core's branch-7 rule paints button dashicons with the admin accent. */
body.wp-core-ui .sydney-dashboard .button .dashicons {
  color: inherit;
}

/*
* WP 7.0 sets `line-height: 1.9` on Dashicons inside admin buttons
* (wp-includes/css/buttons.css), a ratio tuned for the icon's native 20px
* font-size. Dashboard icons inherit the button's font-size instead, so 1.9
* yields a line box taller than the button's own text line and the button grows
* when a spinner is injected. Mirror core's selector list so the icon always
* sits on the button's line: same specificity as core, printed later.
*/
.sydney-dashboard .button .dashicons,
.sydney-dashboard .button-primary .dashicons,
.sydney-dashboard .button-secondary .dashicons {
  line-height: inherit;
}

.sydney-dashboard .button-medium {
  padding: var(--sydney-dashboard-space-2) var(--sydney-dashboard-space-4);
}

.sydney-dashboard .button-primary {
  color: var(--sydney-dashboard-on-accent);
  border-color: var(--sydney-dashboard-primary);
  background-color: var(--sydney-dashboard-primary);
}

.sydney-dashboard .button-primary:hover, .sydney-dashboard .button-primary:focus, .sydney-dashboard .button-primary:active {
  color: var(--sydney-dashboard-on-accent);
  border-color: var(--sydney-dashboard-primary-hover);
  background-color: var(--sydney-dashboard-primary-hover);
}

.sydney-dashboard .button-secondary {
  color: var(--sydney-dashboard-primary);
  border-color: var(--sydney-dashboard-primary);
  background-color: var(--sydney-dashboard-surface);
}

.sydney-dashboard .button-secondary:hover, .sydney-dashboard .button-secondary:focus, .sydney-dashboard .button-secondary:active {
  color: var(--sydney-dashboard-primary-hover);
  border-color: var(--sydney-dashboard-primary-hover);
  background-color: var(--sydney-dashboard-primary-tint-light);
}

.sydney-dashboard .button-warning {
  color: var(--sydney-dashboard-on-accent);
  border-color: var(--sydney-dashboard-danger);
  background-color: var(--sydney-dashboard-danger);
}

.sydney-dashboard .button-warning:hover, .sydney-dashboard .button-warning:focus, .sydney-dashboard .button-warning:active {
  color: var(--sydney-dashboard-on-accent);
  border-color: var(--sydney-dashboard-danger-hover);
  background-color: var(--sydney-dashboard-danger-hover);
}

.sydney-dashboard .button-simple {
  color: var(--sydney-dashboard-primary);
  text-decoration: none;
  display: flex;
  gap: var(--sydney-dashboard-space-1);
          align-items: center;
}

.sydney-dashboard .button-simple:focus {
          box-shadow: none;
}

.sydney-dashboard .button-simple span {
  font-weight: var(--sydney-dashboard-font-weight-medium);
  text-decoration: underline;
}

.sydney-dashboard .button-simple i {
  font-size: var(--sydney-dashboard-font-size-md);
}

.sydney-dashboard .button-text {
  color: var(--sydney-dashboard-primary);
  text-decoration: none;
  display: inline-block;
  vertical-align: top;
}

.sydney-dashboard .button-text i {
  font-size: var(--sydney-dashboard-font-size-xl);
  line-height: 24px;
}

.sydney-dashboard .button-text:focus {
          box-shadow: none;
}

.sydney-dashboard .button-info {
  color: var(--sydney-dashboard-gray-400);
  text-decoration: none;
  display: inline-block;
  vertical-align: top;
}

.sydney-dashboard .button-info i {
  font-size: var(--sydney-dashboard-font-size-xl);
  line-height: 24px;
}

.sydney-dashboard .button-info:hover {
  color: var(--sydney-dashboard-gray-700);
}

.sydney-dashboard .button-info:focus {
          box-shadow: none;
}

.sydney-dashboard .button-disabled {
  -webkit-user-select: none;
          user-select: none;
  pointer-events: none;
}

.sydney-dashboard .button-pro-support {
  color: var(--sydney-dashboard-on-accent);
  border-color: var(--sydney-dashboard-success);
  background-color: var(--sydney-dashboard-success);
}

.sydney-dashboard .button-pro-support:hover, .sydney-dashboard .button-pro-support:focus, .sydney-dashboard .button-pro-support:active {
  color: var(--sydney-dashboard-on-accent);
  border-color: var(--sydney-dashboard-success-hover);
  background-color: var(--sydney-dashboard-success-hover);
}

.sydney-dashboard .button-outline {
  color: var(--sydney-dashboard-primary);
  border-color: var(--sydney-dashboard-primary);
  background: transparent;
}

.sydney-dashboard .dashicons {
  width: auto;
  height: auto;
  font-size: inherit;
}

/*
* Same class of bug as the button mirror rule above, but the trigger here is
* core's own `.dashicons { line-height: 1; }` (wp-includes/css/dashicons.css),
* not the WP 7.0 button rule. `.sydney-dashboard-link` sets its own font-size
* /line-height pair per context (e.g. 13px/20px on feature-card actions); the
* icon's font-size already inherits that via the rule above, but with no
* line-height declared here the icon falls back to core's 1, collapsing the
* row when a spinner replaces the link's text. Inherit the link's own
* line-height instead so swapping text for an icon never changes row height.
*/
.sydney-dashboard .sydney-dashboard-link .dashicons {
  line-height: inherit;
}

.sydney-dashboard .dashicons-update-alt {
          animation: sydney-spin 4s linear infinite;
  margin-right: var(--sydney-dashboard-space-1);
}

.sydney-ajax-progress {
  -webkit-user-select: none;
          user-select: none;
  pointer-events: none;
}

.sydney-dashboard-badge {
  color: var(--sydney-dashboard-gray-600);
  padding: var(--sydney-dashboard-space-1) var(--sydney-dashboard-space-1);
  border: 1px solid var(--sydney-dashboard-border);
  border-radius: var(--sydney-dashboard-radius-sm);
  font-weight: var(--sydney-dashboard-font-weight-bold);
}

.sydney-dashboard-badge.sydney-dashboard-badge-pro {
  color: var(--sydney-dashboard-primary);
  border-color: var(--sydney-dashboard-primary);
}

.sydney-dashboard-link {
  display: inline-flex;
          align-items: center;
  text-decoration: none;
  transition: ease color var(--sydney-dashboard-duration-slow), ease opacity var(--sydney-dashboard-duration-slow);
}

.sydney-dashboard-link.sydney-dashboard-link-danger {
  color: var(--sydney-dashboard-danger) !important;
}

.sydney-dashboard-link.sydney-dashboard-link-info {
  color: var(--sydney-dashboard-primary) !important;
}

.sydney-dashboard-link:hover, .sydney-dashboard-link:focus, .sydney-dashboard-link:active {
  color: var(--sydney-dashboard-primary);
  opacity: 0.7;
}

/* Doubled class + !important to beat .sydney-dashboard-link-info. */
.sydney-dashboard-link.sydney-dashboard-customize-link {
  color: var(--sydney-dashboard-gray-700) !important;
}

.sydney-dashboard-link.sydney-dashboard-customize-link:hover,
.sydney-dashboard-link.sydney-dashboard-customize-link:focus,
.sydney-dashboard-link.sydney-dashboard-customize-link:active {
  color: var(--sydney-dashboard-primary) !important;
}

.sydney-dashboard-link.loading {
  outline: none;
  text-decoration: none;
          box-shadow: none;
}

.sydney-dashboard-external-link {
  display: inline-flex;
  gap: var(--sydney-dashboard-space-2);
  font-size: var(--sydney-dashboard-font-size-base);
  line-height: 13px;
  font-weight: var(--sydney-dashboard-font-weight-medium);
  color: var(--sydney-dashboard-primary);
  white-space: nowrap;
  text-decoration: none;
  transition: ease opacity var(--sydney-dashboard-duration-slow);
}

.sydney-dashboard-external-link svg {
  position: relative;
  top: -1px;
}

.sydney-dashboard-external-link:hover, .sydney-dashboard-external-link:focus, .sydney-dashboard-external-link:active {
  color: var(--sydney-dashboard-primary);
  text-decoration: none;
  opacity: 0.7;
}

.sydney-dashboard-pro-tooltip {
  position: relative;
}

.sydney-dashboard-pro-tooltip:before {
  content: attr(data-tooltip-message);
  position: absolute;
  bottom: calc( 100% + 11px);
  left: 50%;
  color: var(--sydney-dashboard-on-accent);
  font-size: var(--sydney-dashboard-font-size-xs);
  line-height: 16px;
  padding: var(--sydney-dashboard-space-1) var(--sydney-dashboard-space-1);
  background-color: var(--sydney-dashboard-gray-900);
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
          transform: translate3d(-50%, 6px, 0);
  transition: ease opacity var(--sydney-dashboard-duration-slow), ease transform var(--sydney-dashboard-duration-slow);
  z-index: 2;
}

.sydney-dashboard-pro-tooltip:after {
  content: '';
  position: absolute;
  bottom: calc( 100% + 3px);
  left: 50%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 4px 4px 4px;
  border-color: var(--sydney-dashboard-gray-900) transparent transparent transparent;
  opacity: 0;
  visibility: hidden;
          transform: translate3d(-50%, 6px, 0);
  transition: ease opacity var(--sydney-dashboard-duration-slow), ease transform var(--sydney-dashboard-duration-slow);
  z-index: 2;
}

.sydney-dashboard-pro-tooltip:hover:before, .sydney-dashboard-pro-tooltip:hover:after {
  opacity: 1;
  visibility: visible;
          transform: translate3d(-50%, 0, 0);
}

.sydney-dashboard-activate-button,
.sydney-dashboard-deactivate-button {
  display: inline-flex;
          align-items: center;
}

.sydney-dashboard-activate-button i,
.sydney-dashboard-deactivate-button i {
  text-decoration: none;
}

.sydney-dashboard-activate-button.loading,
.sydney-dashboard-deactivate-button.loading {
  text-decoration: none;
}

.sydney-dahsboard-modules-global-actions {
  display: flex;
  gap: var(--sydney-dashboard-space-2);
}

.sydney-dahsboard-modules-global-actions .sydney-dashboard-module-activation-all {
  padding: var(--sydney-dashboard-space-1) var(--sydney-dashboard-space-3);
  font-size: var(--sydney-dashboard-font-size-md);
  font-weight: var(--sydney-dashboard-font-weight-normal);
  line-height: 20px;
  border: 1px solid var(--sydney-dashboard-border-strong);
  border-radius: var(--sydney-dashboard-radius-sm);
  text-decoration: none;
  transition: ease color var(--sydney-dashboard-duration-slow), ease background-color var(--sydney-dashboard-duration-slow);
}

.sydney-dahsboard-modules-global-actions .sydney-dashboard-module-activation-all.sydney-dahsboard-modules-activate-all {
  color: var(--sydney-dashboard-on-accent);
  background-color: var(--sydney-dashboard-success);
  border-color: var(--sydney-dashboard-success);
}

.sydney-dahsboard-modules-global-actions .sydney-dashboard-module-activation-all.sydney-dahsboard-modules-activate-all:hover, .sydney-dahsboard-modules-global-actions .sydney-dashboard-module-activation-all.sydney-dahsboard-modules-activate-all:focus, .sydney-dahsboard-modules-global-actions .sydney-dashboard-module-activation-all.sydney-dahsboard-modules-activate-all:active {
  background-color: var(--sydney-dashboard-success-hover);
}

.sydney-dahsboard-modules-global-actions .sydney-dashboard-module-activation-all.sydney-dahsboard-modules-deactivate-all {
  color: var(--sydney-dashboard-danger);
  background-color: var(--sydney-dashboard-danger-tint);
  border-color: var(--sydney-dashboard-danger);
}

.sydney-dahsboard-modules-global-actions .sydney-dashboard-module-activation-all.sydney-dahsboard-modules-deactivate-all:hover, .sydney-dahsboard-modules-global-actions .sydney-dashboard-module-activation-all.sydney-dahsboard-modules-deactivate-all:focus, .sydney-dahsboard-modules-global-actions .sydney-dashboard-module-activation-all.sydney-dahsboard-modules-deactivate-all:active {
  background-color: var(--sydney-dashboard-danger-tint-hover);
}

/* sydney Dashboard Top Bar */
.sydney-dashboard-top-bar {
  display: flex;
          align-items: center;
          justify-content: space-between;
  background-color: var(--sydney-dashboard-surface);
  margin: var(--sydney-dashboard-space-5-neg) var(--sydney-dashboard-space-5-neg) var(--sydney-dashboard-space-5) var(--sydney-dashboard-space-5-neg);
  padding: var(--sydney-dashboard-space-4) var(--sydney-dashboard-space-5);
}

.sydney-dashboard-top-bar .sydney-dashboard-top-bar-infos .sydney-dashboard-top-bar-info-item {
  padding: 0 var(--sydney-dashboard-space-2);
}

.sydney-dashboard-top-bar .sydney-dashboard-top-bar-infos .sydney-dashboard-top-bar-info-item + .sydney-dashboard-top-bar-info-item {
  border-left: 1px solid var(--sydney-dashboard-border-subtle);
}

.sydney-dashboard-top-bar .sydney-dashboard-theme-version {
  font-size: var(--sydney-dashboard-font-size-base);
  line-height: 13px;
  color: var(--sydney-dashboard-gray-600);
}

.sydney-dashboard-top-bar .sydney-dashboard-theme-version .sydney-dashboard-badge {
  display: inline-flex;
  margin-left: var(--sydney-dashboard-space-1);
  font-size: 9px;
  line-height: 10px;
}

.sydney-dashboard-top-bar .sydney-dashboard-theme-notifications {
  position: relative;
  display: inline-flex;
          align-items: center;
          justify-content: center;
  width: 27px;
  height: 27px;
  border: 1px solid var(--sydney-dashboard-border);
  border-radius: var(--sydney-dashboard-radius-pill);
}

.sydney-dashboard-top-bar .sydney-dashboard-theme-notifications .sydney-dashboard-notifications-count {
  position: absolute;
  top: -8px;
  right: -7px;
  display: flex;
          align-items: center;
          justify-content: center;
  width: 16px;
  height: 16px;
  color: var(--sydney-dashboard-on-accent);
  background-color: var(--sydney-dashboard-danger);
  border-radius: var(--sydney-dashboard-radius-pill);
  font-size: var(--sydney-dashboard-font-size-xs);
  line-height: 1;
}

.sydney-dashboard-top-bar .sydney-dashboard-theme-notifications.read .sydney-dashboard-notifications-count {
  display: none;
}

.sydney-dashboard-top-bar .sydney-dashboard-theme-website {
  display: flex;
          align-items: center;
  gap: var(--sydney-dashboard-space-2);
  font-size: var(--sydney-dashboard-font-size-base);
  line-height: 16px;
  color: var(--sydney-dashboard-primary);
  text-decoration: none;
}

/* sydney Dashboard Tabs Nav Items */
.sydney-dashboard-tabs-nav {
  padding: 0 var(--sydney-dashboard-space-5);
  margin-bottom: -100%;
          transform: translate3d(0, 100%, 0);
}

/* sydney-dashboard.js sets --sydney-dashboard-tabs-nav-growth on .sydney-dashboard-container to the height the wrapped rows add. */
.sydney-dashboard-tabs-nav[data-tab-wrapper-id="main"] {
          transform: translate3d(0, calc(100% - var(--sydney-dashboard-tabs-nav-growth, 0px)), 0);
}

.sydney-dashboard-tabs-nav[data-tab-wrapper-id="main"] ul {
  flex-wrap: wrap;
  row-gap: var(--sydney-dashboard-space-6);
}

.sydney-dashboard-tabs-nav[data-tab-wrapper-id="main"] .sydney-dashboard-tabs-nav-link {
  white-space: nowrap;
}

.sydney-dashboard-tabs-nav ul {
  position: relative;
  display: flex;
  padding: 0;
}

/* Top, offset and width are measured from the active link by sydney-dashboard.js, so the bar sits under it.
   On the last row it lands on .sydney-dashboard-card-tabs-divider, so both stay 2px. On an upper row it sits under its own label. */
.sydney-dashboard-tabs-nav ul:after {
  content: '';
  position: absolute;
  top: var(--sydney-dashboard-tabs-indicator-top, 100%);
  left: 0;
  width: var(--sydney-dashboard-tabs-indicator-width, 0);
  height: 2px;
  background-color: var(--sydney-dashboard-primary);
          transform: translate3d(var(--sydney-dashboard-tabs-indicator-offset, 0), 0, 0);
  opacity: 0;
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-indicator-ready ul:after {
  opacity: 1;
  transition: ease transform var(--sydney-dashboard-duration-base), ease width var(--sydney-dashboard-duration-base), ease opacity var(--sydney-dashboard-duration-base);
}

.sydney-dashboard-tabs-nav .sydney-dashboard-tabs-nav-item .sydney-dashboard-tabs-nav-link {
  position: relative;
  font-size: var(--sydney-dashboard-font-size-md);
  line-height: 20px;
  padding: var(--sydney-dashboard-space-4);
  color: var(--sydney-dashboard-gray-700);
  text-decoration: none;
  transition: ease color var(--sydney-dashboard-duration-slow);
  outline: none;
          box-shadow: none;
}

.sydney-dashboard-tabs-nav .sydney-dashboard-tabs-nav-item.active .sydney-dashboard-tabs-nav-link {
  color: var(--sydney-dashboard-primary);
}

/* Stands in for the sliding bar until the script has measured it. */
.sydney-dashboard-tabs-nav .sydney-dashboard-tabs-nav-item.active .sydney-dashboard-tabs-nav-link:after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: var(--sydney-dashboard-primary);
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-indicator-ready .sydney-dashboard-tabs-nav-item.active .sydney-dashboard-tabs-nav-link:after {
  content: none;
}

.sydney-dashboard-tabs-nav .sydney-dashboard-tabs-nav-item:hover .sydney-dashboard-tabs-nav-link, .sydney-dashboard-tabs-nav .sydney-dashboard-tabs-nav-item:focus .sydney-dashboard-tabs-nav-link, .sydney-dashboard-tabs-nav .sydney-dashboard-tabs-nav-item:active .sydney-dashboard-tabs-nav-link {
  color: var(--sydney-dashboard-primary);
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item .sydney-dashboard-tabs-nav-link {
  position: relative;
  display: flex;
          align-items: center;
  font-size: var(--sydney-dashboard-font-size-xl);
  font-weight: var(--sydney-dashboard-font-weight-semibold);
  line-height: 26px;
  padding: var(--sydney-dashboard-space-1) var(--sydney-dashboard-space-4);
  border-bottom: 0;
  color: var(--sydney-dashboard-gray-900);
  transition: ease color var(--sydney-dashboard-duration-base);
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item .sydney-dashboard-tabs-nav-link svg {
  margin-right: var(--sydney-dashboard-space-2);
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item .sydney-dashboard-tabs-nav-link svg path {
  transition: ease fill var(--sydney-dashboard-duration-base);
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons ul:after, .sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item.active .sydney-dashboard-tabs-nav-link:after {
  content: none;
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item .sydney-dashboard-tabs-nav-link:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  background-color: transparent;
  width: 4px;
  height: 100%;
  border-radius: 0 var(--sydney-dashboard-radius-sm) var(--sydney-dashboard-radius-sm) 0;
  opacity: 0;
  visibility: hidden;
  transition: ease opacity var(--sydney-dashboard-duration-base);
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item.active .sydney-dashboard-tabs-nav-link, .sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item:hover .sydney-dashboard-tabs-nav-link, .sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item:focus .sydney-dashboard-tabs-nav-link, .sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item:active .sydney-dashboard-tabs-nav-link {
  color: var(--sydney-dashboard-primary);
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item.active .sydney-dashboard-tabs-nav-link svg path, .sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item:hover .sydney-dashboard-tabs-nav-link svg path, .sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item:focus .sydney-dashboard-tabs-nav-link svg path, .sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item:active .sydney-dashboard-tabs-nav-link svg path {
  fill: var(--sydney-dashboard-primary);
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item.active .sydney-dashboard-tabs-nav-link:before, .sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item:hover .sydney-dashboard-tabs-nav-link:before, .sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item:focus .sydney-dashboard-tabs-nav-link:before, .sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-with-icons .sydney-dashboard-tabs-nav-item:active .sydney-dashboard-tabs-nav-link:before {
  background-color: var(--sydney-dashboard-primary);
  opacity: 1;
  visibility: visible;
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-vertical {
  padding: 0;
  margin-left: var(--sydney-dashboard-space-5-neg);
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-vertical ul {
          flex-direction: column;
  margin: 0;
}

.sydney-dashboard-tabs-nav.sydney-dashboard-tabs-nav-no-negative-margin {
  margin-bottom: 0;
          transform: none;
}

/* sydney Tabs Content */
.sydney-dashboard-tab-content {
  display: none;
}

.sydney-dashboard-tab-content.active {
  display: block;
}

/* sydney Dashboard Card */
.sydney-dashboard-card {
  display: flex;
          flex-direction: column;
  gap: var(--sydney-dashboard-space-3);
  background-color: var(--sydney-dashboard-surface);
  padding: var(--sydney-dashboard-space-5);
  border-radius: var(--sydney-dashboard-radius-md);
          box-shadow: var(--sydney-dashboard-shadow-sm);
}

.sydney-dashboard-card .sydney-dashboard-card-header h2,
.sydney-dashboard-card-section h2,
.sydney-dashboard-module-card h2 {
  font-size: var(--sydney-dashboard-font-size-lg);
  line-height: 30px;
  margin: 0;
}

.sydney-dashboard-card .sydney-dashboard-card-body p {
  margin: 0;
  max-width: 740px;
}

.sydney-dashboard-card .sydney-dashboard-card-body p + p {
  margin-top: var(--sydney-dashboard-space-4);
}

.sydney-dashboard-card .sydney-dashboard-card-body p + a {
  margin-top: var(--sydney-dashboard-space-5);
}

.sydney-dashboard-card .sydney-dashboard-card-body.sydney-dashboard-card-body-content-with-dividers > div + div {
  padding-top: var(--sydney-dashboard-space-6);
  margin-top: var(--sydney-dashboard-space-6);
  border-top: 1px solid var(--sydney-dashboard-border);
}

.sydney-dashboard-card + .sydney-dashboard-card {
  margin-top: var(--sydney-dashboard-space-5);
}

.sydney-dashboard-card.sydney-dashboard-card-top-spacing {
  padding: calc(var(--sydney-dashboard-space-26) + var(--sydney-dashboard-tabs-nav-growth, 0px)) var(--sydney-dashboard-space-5) var(--sydney-dashboard-space-5) var(--sydney-dashboard-space-5);
}

.sydney-dashboard-card.sydney-dashboard-card-no-box-shadow {
          box-shadow: none;
}

.sydney-dashboard-card.sydney-dashboard-card-tabs-divider {
  position: relative;
}

.sydney-dashboard-card.sydney-dashboard-card-tabs-divider:before {
  content: '';
  position: absolute;
  /* Sits under the last tab row: the script measures the height the wrapped tab rows add and moves the line down by it. */
  top: calc(73px + var(--sydney-dashboard-tabs-nav-growth, 0px));
  left: 20px;
  width: calc( 100% - 40px);
  border-bottom: 2px solid var(--sydney-dashboard-border-subtle);
}

/* sydney Dashboard Notice */
.sydney-dashboard-notice {
  display: none;
  position: relative;
  margin-bottom: var(--sydney-dashboard-space-5);
}

.sydney-dashboard-notice.show {
  display: block;
}

.sydney-dashboard-hero .sydney-dashboard-dismissable {
  cursor: pointer;
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  display: flex;
          justify-content: center;
          align-items: center;
  width: 38px;
  height: 38px;
  font-size: var(--sydney-dashboard-font-size-lg);
  line-height: 1em;
  color: var(--sydney-dashboard-gray-600);
}

.sydney-dashboard-hero .sydney-dashboard-dismissable:hover {
  color: var(--sydney-dashboard-danger);
}

/* Notifications Sidebar */
.sydney-dashboard-notifications-sidebar {
  position: fixed;
  top: calc(var(--sydney-dashboard-admin-bar-height) + 64px);
  right: 0;
  width: 100%;
  max-width: 500px;
  height: calc( 100vh - 92px);
  background-color: var(--sydney-dashboard-surface);
          box-shadow: var(--sydney-dashboard-shadow-sidebar);
  opacity: 0;
  visibility: hidden;
          transform: translate3d(100%, 0, 0);
  transition: ease transform var(--sydney-dashboard-duration-slow), ease opacity var(--sydney-dashboard-duration-slow);
  z-index: var(--sydney-dashboard-z-sidebar);
  transition: all var(--sydney-dashboard-duration-slow);
}

.sydney-dashboard-notifications-sidebar.scrolled {
  top: var(--sydney-dashboard-admin-bar-height) !important;
  height: 100%;
}

.sydney-dashboard-notifications-sidebar.opened {
  opacity: 1;
  visibility: visible;
          transform: none;
}

.sydney-dashboard-notifications-sidebar.closing {
  opacity: 0;
          transform: translate3d(100%, 0, 0);
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-close {
  position: absolute;
  top: 15px;
  right: 15px;
  transition: ease opacity var(--sydney-dashboard-duration-slow);
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-close:hover {
  opacity: 0.7;
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-header {
  display: flex;
          align-items: center;
  gap: var(--sydney-dashboard-space-2);
  background-color: var(--sydney-dashboard-primary-tint);
  padding: var(--sydney-dashboard-space-5) var(--sydney-dashboard-space-5);
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-header .sydney-dashboard-notifications-sidebar-header-icon {
  display: flex;
          align-items: center;
          justify-content: center;
  width: 40px;
  height: 40px;
  background-color: var(--sydney-dashboard-surface);
  border: 1px solid var(--sydney-dashboard-border);
  border-radius: var(--sydney-dashboard-radius-pill);
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-header .sydney-dashboard-notifications-sidebar-header-icon svg {
  position: relative;
  top: -2px;
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-header .sydney-dashboard-notifications-sidebar-header-content h3 {
  font-size: var(--sydney-dashboard-font-size-lg);
  line-height: 26px;
  font-weight: var(--sydney-dashboard-font-weight-semibold);
  margin: 0;
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-header .sydney-dashboard-notifications-sidebar-header-content p {
  font-size: var(--sydney-dashboard-font-size-base);
  line-height: 18px;
  color: var(--sydney-dashboard-gray-700);
  margin: 0;
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-tabs {
  position: relative;
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-tabs:after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 20px;
  width: calc( 100% - 40px);
  border-bottom: 1px solid var(--sydney-dashboard-border-subtle);
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-tabs + .sydney-dashboard-notifications-sidebar-body {
  max-height: calc( 100vh - 232px);
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-body {
  padding: var(--sydney-dashboard-space-5);
  overflow-y: auto;
  max-height: calc( 100vh - 180px);
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-body::-webkit-scrollbar {
  width: 5px;
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-body::-webkit-scrollbar-track {
  background: var(--sydney-dashboard-gray-300);
}

.sydney-dashboard-notifications-sidebar .sydney-dashboard-notifications-sidebar-body::-webkit-scrollbar-thumb {
  background-color: var(--sydney-dashboard-gray-400);
}

/* Notifications (card) */
.sydney-dashboard-notification .sydney-dashboard-notification-date {
  display: block;
  font-size: var(--sydney-dashboard-font-size-base);
  line-height: 18px;
  color: var(--sydney-dashboard-gray-700);
}

.sydney-dashboard-notification .sydney-dashboard-notification-date + .sydney-dashboard-notification-content {
  margin-top: var(--sydney-dashboard-space-5);
}

.sydney-dashboard-notification .changelog-tag {
  display: inline-block;
  font-size: var(--sydney-dashboard-font-size-xs);
  line-height: 18px;
  color: var(--sydney-dashboard-on-accent);
  padding: 0 var(--sydney-dashboard-space-2);
  background-color: var(--sydney-dashboard-gray-400);
  border-radius: var(--sydney-dashboard-radius-sm);
  text-transform: uppercase;
  font-weight: var(--sydney-dashboard-font-weight-semibold);
  margin: var(--sydney-dashboard-space-1) var(--sydney-dashboard-space-2) 0 0;
  min-width: 70px;
  text-align: center;
}

.sydney-dashboard-notification .changelog-tag.changelog-added {
  background-color: var(--sydney-dashboard-success);
}

.sydney-dashboard-notification .changelog-tag.changelog-changed {
  background-color: var(--sydney-dashboard-warning);
}

.sydney-dashboard-notification .changelog-tag.changelog-fixed {
  background-color: var(--sydney-dashboard-info);
}

.sydney-dashboard-notification .sydney-dashboard-notification-content li:has(.changelog-fixed) {
  display: none;
}

.sydney-dashboard-notification .changelog-description {
  display: block;
  font-size: var(--sydney-dashboard-font-size-base);
  line-height: 21px;
  font-weight: var(--sydney-dashboard-font-weight-normal);
  color: var(--sydney-dashboard-gray-700);
  margin-top: var(--sydney-dashboard-space-1);
}

.sydney-dashboard-notification .sydney-dashboard-notification-content ul {
  margin: 0;
}

.sydney-dashboard-notification .sydney-dashboard-notification-content ul li {
  display: flex;
          align-items: flex-start;
  font-size: var(--sydney-dashboard-font-size-lg);
  line-height: 26px;
  color: var(--sydney-dashboard-gray-900);
}

.sydney-dashboard-notification .sydney-dashboard-notification-content ul li + li {
  margin-top: var(--sydney-dashboard-space-4);
  padding-top: var(--sydney-dashboard-space-4);
  border-top: 1px solid var(--sydney-dashboard-border);
}

.sydney-dashboard-notification + .sydney-dashboard-notification {
  margin: var(--sydney-dashboard-space-5) var(--sydney-dashboard-space-5-neg) 0;
  padding: var(--sydney-dashboard-space-5) var(--sydney-dashboard-space-5) 0;
  border-top: 1px solid var(--sydney-dashboard-border);
}

/* sydney Dashboard Hero */
.sydney-dashboard-hero {
  position: relative;
  display: flex;
          justify-content: space-between;
  background-color: var(--sydney-dashboard-surface);
  border-radius: var(--sydney-dashboard-radius-sm);
  margin-bottom: var(--sydney-dashboard-space-5);
}

.sydney-dashboard-hero .sydney-dashboard-hero-content {
          flex: 1;
  display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: flex-start;
  padding: var(--sydney-dashboard-space-7) var(--sydney-dashboard-space-6);
}

.sydney-dashboard-hero .sydney-dashboard-hero-hello {
  font-size: 1rem;
  font-weight: var(--sydney-dashboard-font-weight-semibold);
  color: var(--sydney-dashboard-gray-900);
}

.sydney-dashboard-hero .sydney-dashboard-hero-title {
  font-size: 2rem;
  font-weight: var(--sydney-dashboard-font-weight-semibold);
  line-height: var(--sydney-dashboard-line-height-tight);
  color: var(--sydney-dashboard-gray-900);
  margin-top: var(--sydney-dashboard-space-4);
}

.sydney-dashboard-hero-badge {
  font-size: var(--sydney-dashboard-font-size-sm);
  line-height: 1em;
  font-weight: var(--sydney-dashboard-font-weight-medium);
  padding: var(--sydney-dashboard-space-1) var(--sydney-dashboard-space-2);
  border-radius: var(--sydney-dashboard-radius-pill);
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.sydney-dashboard-hero-badge-free {
  color: var(--sydney-dashboard-success);
  background-color: var(--sydney-dashboard-success-tint);
}

.sydney-dashboard-hero-badge-pro {
  color: var(--sydney-dashboard-on-accent);
  background-color: var(--sydney-dashboard-primary);
}

.sydney-dashboard-hero .sydney-dashboard-hero-desc {
  color: var(--sydney-dashboard-gray-900);
  margin-top: var(--sydney-dashboard-space-3);
}

.sydney-dashboard-hero .sydney-dashboard-hero-customize-button {
  margin-top: var(--sydney-dashboard-space-6);
}

.sydney-dashboard-hero .sydney-dashboard-hero-actions {
  display: flex;
  gap: var(--sydney-dashboard-space-2);
  margin-top: var(--sydney-dashboard-space-6);
}

.sydney-dashboard-hero .sydney-dashboard-hero-actions .button {
  display: flex;
  gap: var(--sydney-dashboard-space-1);
          align-items: center;
          justify-content: center;
  padding: var(--sydney-dashboard-space-3) var(--sydney-dashboard-space-4);
  line-height: 1em;
}

.sydney-dashboard-hero .sydney-dashboard-hero-button {
  text-decoration: none;
  padding: var(--sydney-dashboard-space-3) var(--sydney-dashboard-space-4);
  border-radius: var(--sydney-dashboard-radius-sm);
}

.sydney-dashboard-hero .sydney-dashboard-hero-warning {
  color: var(--sydney-dashboard-danger);
  margin-top: var(--sydney-dashboard-space-2);
}

.sydney-dashboard-hero .sydney-dashboard-hero-image {
  display: flex;
          justify-content: flex-end;
          align-items: flex-end;
  margin: var(--sydney-dashboard-space-4) var(--sydney-dashboard-space-9) 0 var(--sydney-dashboard-space-9);
}

.sydney-dashboard-hero .sydney-dashboard-hero-image img {
  max-width: 450px;
}

@media screen and (max-width: 991px) {
  .sydney-dashboard-hero .sydney-dashboard-hero-image {
    display: none;
  }
}

/* sydney Dashboard Feature Card */
.sydney-dashboard-feature-card {
  display: flex;
          flex-direction: column;
  position: relative;
  padding: var(--sydney-dashboard-space-4);
  border: 2px solid var(--sydney-dashboard-border-subtle);
  border-radius: var(--sydney-dashboard-radius-lg);
  height: 100%;
  transition: ease box-shadow var(--sydney-dashboard-duration-slow);
}
.sydney-dashboard-feature-card:hover {
  box-shadow: var(--sydney-dashboard-shadow-md);
}
.sydney-dashboard-feature-card .sydney-dashboard-feature-card-image {
  max-width: 40px;
  height: auto;
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-image img {
  max-width: 100%;
  height: auto;
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-image.sydney-dashboard-feature-card-image-rounded {
  border-radius: var(--sydney-dashboard-radius-circle);
  overflow: hidden;
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-image + div {
  margin-top: var(--sydney-dashboard-space-2);
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-title {
  padding-right: var(--sydney-dashboard-space-8);
  margin-bottom: var(--sydney-dashboard-space-1);
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-title h3 {
  font-size: var(--sydney-dashboard-font-size-md);
  font-weight: var(--sydney-dashboard-font-weight-medium);
  line-height: var(--sydney-dashboard-line-height-snug);
  margin: 0;
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-title + .sydney-dashboard-feature-card-actions {
  margin-top: auto;
}

/* Info icon after a Pro card's title. The title is inline so the icon follows its last word when it wraps, and nowrap keeps the icon on that word's line. Its tooltip holds the card's description, so it wraps. */
.sydney-dashboard-feature-card .sydney-dashboard-feature-card-title:has(.sydney-dashboard-feature-card-info) {
  padding-right: calc(var(--sydney-dashboard-space-8) + var(--sydney-dashboard-space-1));
  white-space: nowrap;
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-title:has(.sydney-dashboard-feature-card-info) h3 {
  display: inline;
  white-space: normal;
}

.sydney-dashboard-feature-card-info {
  display: inline-flex;
  vertical-align: -3px;
  color: var(--sydney-dashboard-gray-700);
  cursor: help;
}

.sydney-dashboard-feature-card-info.sydney-dashboard-pro-tooltip:before {
  width: 220px;
  padding: var(--sydney-dashboard-space-2);
  white-space: normal;
  text-align: left;
}

.sydney-dashboard-feature-card-info:focus-visible:before, .sydney-dashboard-feature-card-info:focus-visible:after {
  opacity: 1;
  visibility: visible;
          transform: translate3d(-50%, 0, 0);
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-actions {
  display: flex;
  gap: var(--sydney-dashboard-space-4);
}

.sydney-dashboard-feature-card .sydney-dashboard-link {
  font-size: var(--sydney-dashboard-font-size-base);
  line-height: 20px;
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-link-icon {
  position: absolute;
  top: 23px;
  right: 20px;
  opacity: 0;
  visibility: hidden;
  transition: ease opacity var(--sydney-dashboard-duration-slow);
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-link-icon svg {
  transition: ease color var(--sydney-dashboard-duration-slow);
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-link-icon.sydney-dashboard-feature-card-link-icon-always-visible {
  opacity: 1 !important;
  visibility: visible !important;
}

.sydney-dashboard-feature-card .sydney-dashboard-feature-card-link-icon:hover svg {
  color: var(--sydney-dashboard-primary);
}


.sydney-dashboard-feature-card:hover .sydney-dashboard-feature-card-link-icon {
  opacity: 1;
  visibility: visible;
}

.sydney-dashboard-feature-card:hover .sydney-dashboard-feature-card-link {
  color: var(--sydney-dashboard-primary);
  text-decoration: underline;
}

/* Starter Sites */
.sydney-dashboard-starter-sites {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sydney-dashboard-space-5);
}

.sydney-dashboard-starter-sites .button {
  padding-top: var(--sydney-dashboard-space-2);
  padding-bottom: var(--sydney-dashboard-space-2);
}

.sydney-dashboard-starter-sites-locked {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
          justify-content: center;
          align-items: flex-start;
}

.sydney-dashboard-starter-sites-locked:before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: var(--sydney-dashboard-surface);
  opacity: 0.9;
}

.sydney-dashboard-starter-sites-locked .button {
  padding: var(--sydney-dashboard-space-2) var(--sydney-dashboard-space-7);
}

.sydney-dashboard-starter-sites-notice {
  position: relative;
  z-index: 2;
  top: 125px;
  width: 80%;
  min-height: 275px;
  border: 1px solid var(--sydney-dashboard-border);
  background-color: var(--sydney-dashboard-surface);
          box-shadow: var(--sydney-dashboard-shadow-md);
  border-radius: var(--sydney-dashboard-radius-sm);
  padding: var(--sydney-dashboard-space-17);
  display: flex;
  gap: var(--sydney-dashboard-space-7);
          align-items: center;
          justify-content: center;
          flex-direction: column;
}

.sydney-dashboard-starter-sites-notice-text {
  font-weight: var(--sydney-dashboard-font-weight-bold);
  font-size: var(--sydney-dashboard-font-size-3xl);
  line-height: 34px;
  text-align: center;
  color: var(--sydney-dashboard-gray-900);
}

@media screen and (max-width: 991px) {
  .sydney-dashboard-starter-sites .sydney-dashboard-box {
    display: none;
  }
  .sydney-dashboard-starter-sites-locked {
    position: relative;
  }
  .sydney-dashboard-starter-sites-notice {
    padding: var(--sydney-dashboard-space-12);
    top: auto;
    width: 100%;
  }
  .sydney-dashboard-starter-sites-notice-text {
    font-size: var(--sydney-dashboard-font-size-2xl);
  }
  .sydney-dashboard-starter-sites {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}

/* sydney License Field */
.sydney-dashboard-license-form {
  margin-top: var(--sydney-dashboard-space-2);
}

.sydney-dashboard-license-form form {
  display: flex;
      flex-wrap: wrap;
  gap: var(--sydney-dashboard-space-2);
}

.sydney-dashboard-license-form form input {
  width: 400px;
  max-width: 100%;
  padding-left: var(--sydney-dashboard-space-9);
  min-height: 36px;
}
.sydney-dashboard-license-form form input::placeholder {
  opacity: 0.75;
}

.sydney-dashboard-license-form form button {
  position: relative;
  display: flex;
  gap: var(--sydney-dashboard-space-1);
          align-items: center;
  line-height: 1em;
  min-height: 36px;
  padding: var(--sydney-dashboard-space-2) var(--sydney-dashboard-space-10) !important;
}

.sydney-license-key-input {
  position: relative;
  display: flex;
}

.sydney-license-key-input i {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 10px;
          transform: translateY(-50%);
  margin-top: var(--sydney-dashboard-nudge-neg);
  font-size: var(--sydney-dashboard-font-size-2xl) !important;
  color: var(--sydney-dashboard-gray-700);
}

.sydney-dashboard-license-success {
  margin-top: var(--sydney-dashboard-space-2);
  display: flex;
  gap: var(--sydney-dashboard-space-1);
}

.sydney-dashboard-license-success span {
  color: var(--sydney-dashboard-success);
}

.sydney-dashboard-license-error {
  margin-top: var(--sydney-dashboard-space-2);
  color: var(--sydney-dashboard-danger);
}

/* sydney Dashboard Module Card */
.sydney-dashboard-module-card .sydney-dashboard-module-card-header {
  display: flex;
          justify-content: space-between;
  gap: var(--sydney-dashboard-space-9);
}

.sydney-dashboard-module-card .sydney-dashboard-module-card-header .sydney-dashboard-module-card-header-actions {
  padding-top: var(--sydney-dashboard-space-7);
}

/* Sydney Dashboard Well
   A sunken inset for a secondary row inside a card, so it reads as an aside to
   the card's main control rather than a second control of equal weight. Same
   surface, border and radius as .template-builder-pro-notice, minus that one's
   typography, which is scoped to the builder tab. */
.sydney-dashboard-well {
  padding: var(--sydney-dashboard-space-3) var(--sydney-dashboard-space-5);
  border: 1px solid var(--sydney-dashboard-border-subtle);
  border-radius: var(--sydney-dashboard-radius-md);
  background-color: var(--sydney-dashboard-surface-sunken-light);
}

/* Brand mark sitting in a run of text. The offset is in em so it tracks the
   font size of whatever line it lands in, rather than only the one it was
   measured against. */
.sydney-dashboard-brand-icon {
  vertical-align: -0.1em;
  margin-left: 1px;
  margin-right: 2px;
}
.sydney-dashboard-container {
  width: 100%;
  margin: 0 auto
}

@media (min-width: 1280px) {
  .sydney-dashboard-container {
      max-width: var(--sydney-dashboard-container-max)
  }
}
/* Sydney Dashboard Disclosure */
.sydney-dashboard-disclosure {
  max-width: 700px;
}

.sydney-dashboard-disclosure-summary {
  display: inline-flex;
  align-items: center;
  gap: var(--sydney-dashboard-space-1);
  color: var(--sydney-dashboard-primary);
  font-size: var(--sydney-dashboard-font-size-md);
  cursor: pointer;
  /* Both halves of hiding the native triangle. */
  list-style: none;
}

.sydney-dashboard-disclosure-summary::-webkit-details-marker {
  display: none;
}

.sydney-dashboard-disclosure-summary:hover {
  color: var(--sydney-dashboard-primary-hover);
}

.sydney-dashboard-disclosure-summary:focus-visible {
  outline: 2px solid var(--sydney-dashboard-primary);
  outline-offset: 2px;
  border-radius: var(--sydney-dashboard-radius-sm);
}

.sydney-dashboard-disclosure-chevron {
  transform: rotate(-90deg);
  transition: transform var(--sydney-dashboard-duration-base) ease;
}

.sydney-dashboard-disclosure[open] .sydney-dashboard-disclosure-chevron {
  transform: none;
}

.sydney-dashboard-disclosure-content {
  margin-top: var(--sydney-dashboard-space-2);
  padding: var(--sydney-dashboard-space-4);
  background-color: var(--sydney-dashboard-surface-sunken-light);
  border: 1px solid var(--sydney-dashboard-border-subtle);
  border-radius: var(--sydney-dashboard-radius-md);
  color: var(--sydney-dashboard-gray-700);
}

.sydney-dashboard-disclosure-content p {
  margin: 0;
}

/* Free Vs Pro Table */
.sydney-dashboard-freevspro-table__item {
  border: 1px solid var(--sydney-dashboard-border);
  border-radius: var(--sydney-dashboard-radius-md);
  background: var(--sydney-dashboard-surface);
  margin-bottom: var(--sydney-dashboard-space-5);
}

.sydney-dashboard-freevspro-table__header {
  position: sticky;
  top: 50px;
  z-index: 1;
  border-radius: var(--sydney-dashboard-radius-md) var(--sydney-dashboard-radius-md) 0 0;
  background-color: var(--sydney-dashboard-surface-sunken);
  border-bottom: 1px solid var(--sydney-dashboard-border-subtle);
}

.sydney-dashboard-freevspro-table__header .sydney-dashboard-freevspro-table__column {
  border-bottom: 0;
}

.sydney-dashboard-freevspro-table__header strong {
  font-size: var(--sydney-dashboard-font-size-2xl);
  font-weight: var(--sydney-dashboard-font-weight-medium);
  line-height: 23px;
  letter-spacing: 0em;
  color: var(--sydney-dashboard-gray-900);
  margin: 0;
}

.sydney-dashboard-freevspro-table__body .sydney-dashboard-freevspro-table__column strong {
  font-size: var(--sydney-dashboard-font-size-md);
  font-weight: var(--sydney-dashboard-font-weight-normal);
  line-height: 20px;
  letter-spacing: 0em;
}

.sydney-dashboard-freevspro-table__body .sydney-dashboard-freevspro-table__column a {
  color: var(--sydney-dashboard-gray-900);
  display: inline-flex;
          align-items: center;
  text-decoration: none;
  transition: none;
}

.sydney-dashboard-freevspro-table__body .sydney-dashboard-freevspro-table__column a:hover {
  color: var(--sydney-dashboard-primary);
}

.sydney-dashboard-freevspro-table__body .sydney-dashboard-freevspro-table__column a:focus, .sydney-dashboard-freevspro-table__body .sydney-dashboard-freevspro-table__column a:active {
          box-shadow: none;
}

.sydney-dashboard-freevspro-table__body .dashicons-external {
  width: auto;
  height: auto;
  font-size: var(--sydney-dashboard-font-size-lg);
  margin-left: var(--sydney-dashboard-space-1);
  transition: none;
}

.sydney-dashboard-freevspro-table__row {
  display: flex;
}

.sydney-dashboard-freevspro-table__column {
  display: flex;
          align-items: center;
          justify-content: flex-start;
  width: 100%;
  max-width: 275px;
  padding: var(--sydney-dashboard-space-4) var(--sydney-dashboard-space-6);
  text-align: center;
  border-bottom: 1px solid var(--sydney-dashboard-border-subtle);
}

.sydney-dashboard-freevspro-table__column strong {
  font-weight: var(--sydney-dashboard-font-weight-medium);
  text-align: left;
  color: var(--sydney-dashboard-gray-900);
}

.sydney-dashboard-freevspro-table__column .sydney-dashboard-freevspro-table__icon {
  text-align: center;
  width: 30px;
  height: 30px;
  border-radius: var(--sydney-dashboard-radius-circle);
  font-size: var(--sydney-dashboard-font-size-2xl);
  line-height: 30px;
}

.sydney-dashboard-freevspro-table__column .sydney-dashboard-freevspro-table__icon_break {
  text-align: center;
  width: 20px;
  height: 20px;
  font-size: var(--sydney-dashboard-font-size-2xl);
  line-height: 20px;
  opacity: 0.3;
          transform: scaleX(-1);
}

.sydney-dashboard-freevspro-table__column .dashicons-saved {
  text-indent: -2px;
  color: var(--sydney-dashboard-success);
  background-color: var(--sydney-dashboard-success-tint);
}

.sydney-dashboard-freevspro-table__column .dashicons-no-alt {
  color: var(--sydney-dashboard-danger);
  background-color: var(--sydney-dashboard-danger-tint);
}

.sydney-dashboard-freevspro-table__column.sydney-dashboard-freevspro-table__column--feature {
  font-size: var(--sydney-dashboard-font-size-lg);
  font-weight: var(--sydney-dashboard-font-weight-normal);
  line-height: 20px;
  letter-spacing: 0em;
  max-width: none;
  text-align: left;
      flex-wrap: wrap;
  gap: var(--sydney-dashboard-space-1);
}

.sydney-dashboard-freevspro-table__spacing {
  margin-left: var(--sydney-dashboard-space-2);
}

.sydney-dashboard-freevspro-table__desc {
  font-size: var(--sydney-dashboard-font-size-sm);
  font-style: italic;
  width: 100%;
  opacity: 0.5;
}

.sydney-dashboard-freevspro-table__row + .sydney-dashboard-freevspro-table__row .sydney-dashboard-freevspro-table__column,
.sydney-dashboard-freevspro-table__body .sydney-dashboard-freevspro-table__row:first-child .sydney-dashboard-freevspro-table__column {
  border-top-width: 0;
}

.sydney-dashboard-freevspro-table__body .sydney-dashboard-freevspro-table__row:last-child .sydney-dashboard-freevspro-table__column {
  border-bottom: 0;
}

@media screen and (max-width: 991px) {
  .sydney-dashboard-freevspro-table__header {
    position: relative;
    top: auto;
  }
  .sydney-dashboard-freevspro-table__header strong {
    font-size: var(--sydney-dashboard-font-size-lg);
  }
  .sydney-dashboard-freevspro-table-responsive {
    max-width: 100%;
    overflow-x: auto;
  }
  .sydney-dashboard-freevspro-table__column--feature:first-child {
    text-align: left;
            justify-content: flex-start;
  }
  .sydney-dashboard-freevspro-table__column {
    padding: var(--sydney-dashboard-space-4) var(--sydney-dashboard-space-2);
    text-align: center;
            justify-content: center;
    max-width: 100px;
  }
  .sydney-dashboard-freevspro-table__column:not(:first-child) strong {
    margin-left: 0;
    text-align: center;
  }
}
.sydney-dashboard-notification-version {
  margin: var(--sydney-dashboard-space-2) var(--sydney-dashboard-space-1) 0 0;
  display: inline-block;
}

/* Templates Builder */
.template-builder-wrapper {
  padding: var(--sydney-dashboard-space-7) var(--sydney-dashboard-space-5) 0;
  margin: var(--sydney-dashboard-space-8-neg) var(--sydney-dashboard-space-5-neg) 0;
}
.template-builder-header {
  gap: var(--sydney-dashboard-space-7);
  margin-bottom: var(--sydney-dashboard-space-6);
}
.template-builder-footer {
  display: flex;
  justify-content: flex-end;
  gap: var(--sydney-dashboard-space-3);
  /* Side margin must stay the inverse of .template-builder-wrapper's side padding. */
  margin: 0 var(--sydney-dashboard-space-5-neg);
  padding: 0 var(--sydney-dashboard-space-5) var(--sydney-dashboard-space-4);
  background-color: var(--sydney-dashboard-surface);
}
/* The heading above it is screen-reader-only, so the description leads the
   block and drops the admin default top margin along with the h2's spacing. */
.template-builder-header p {
  margin: 0;
  font-size: var(--sydney-dashboard-font-size-md);
}
.template-builder-tutorial {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: var(--sydney-dashboard-space-2);
  padding: var(--sydney-dashboard-space-2) var(--sydney-dashboard-space-4);
  border: 1px solid var(--sydney-dashboard-border);
  /* Box of .wp-core-ui .button - radius, border-box and the 40px floor that
     decides that button's height - so this stands level with one anywhere. */
  border-radius: 2px;
  box-sizing: border-box;
  min-height: 40px;
  background-color: var(--sydney-dashboard-surface);
  color: var(--sydney-dashboard-gray-700);
  font-size: var(--sydney-dashboard-font-size-md);
  line-height: 20px;
  font-weight: var(--sydney-dashboard-font-weight-semibold);
  text-decoration: none;
  transition: ease border-color var(--sydney-dashboard-duration-slow), ease color var(--sydney-dashboard-duration-slow);
}
.template-builder-tutorial svg {
  border: 1px solid var(--sydney-dashboard-border);
  border-radius: var(--sydney-dashboard-radius-circle);
  /* Border inside the 20px, so the icon does not outgrow the text line. */
  box-sizing: border-box;
  transition: ease border-color var(--sydney-dashboard-duration-slow);
}
.template-builder-tutorial:hover,
.template-builder-tutorial:focus,
.template-builder-tutorial:active {
  border-color: var(--sydney-dashboard-gray-600);
  color: var(--sydney-dashboard-gray-900);
  text-decoration: none;
}
.template-builder-tutorial:hover svg,
.template-builder-tutorial:focus svg,
.template-builder-tutorial:active svg {
  border-color: var(--sydney-dashboard-gray-600);
}
/* Shared confirm dialog for destructive actions. Native <dialog>, so the
   backdrop, focus trapping and Esc handling come from the browser. */
.sydney-confirm-dialog {
  position: fixed;
  width: calc(100% - 40px);
  max-width: 400px;
  padding: var(--sydney-dashboard-space-8) var(--sydney-dashboard-space-7) var(--sydney-dashboard-space-7);
  border: 0;
  border-radius: var(--sydney-dashboard-radius-lg);
  background-color: var(--sydney-dashboard-surface);
  box-shadow: var(--sydney-dashboard-shadow-modal);
  text-align: center;
  box-sizing: border-box;
  animation: sydney-confirm-dialog-in var(--sydney-dashboard-duration-fast) ease-out;
}
/* Belt and braces for browsers without <dialog>, where the UA
   `dialog:not([open])` rule is missing and the box would show inline. */
.sydney-confirm-dialog:not([open]) {
  display: none;
}
.sydney-confirm-dialog::backdrop {
  background-color: var(--sydney-dashboard-scrim);
}
@keyframes sydney-confirm-dialog-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
}
.sydney-confirm-dialog .sydney-confirm-dialog-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 var(--sydney-dashboard-space-3);
  color: var(--sydney-dashboard-danger);
}
.sydney-confirm-dialog .sydney-confirm-dialog-title {
  margin: 0 0 var(--sydney-dashboard-space-2);
  padding: 0;
  font-size: var(--sydney-dashboard-font-size-lg);
  font-weight: var(--sydney-dashboard-font-weight-semibold);
  line-height: var(--sydney-dashboard-line-height-snug);
  color: var(--sydney-dashboard-gray-900);
}
.sydney-confirm-dialog .sydney-confirm-dialog-message {
  max-width: 90%;
  margin: 0 auto;
  font-size: 15px;
  color: var(--sydney-dashboard-gray-700);
}
.sydney-confirm-dialog .sydney-confirm-dialog-actions {
  display: flex;
  justify-content: center;
  gap: var(--sydney-dashboard-space-3);
  margin-top: var(--sydney-dashboard-space-5);
}
.sydney-confirm-dialog .sydney-confirm-dialog-actions .button {
  min-width: 83px;
  border-radius: var(--sydney-dashboard-radius-sm);
  text-align: center;
}
/* Same box as the confirm dialog, minus the destructive framing: settings are
   read left to right, so the title and the fields both align left. */
.sydney-options-dialog {
  text-align: start;
  padding-top: var(--sydney-dashboard-space-7);
}
.sydney-options-dialog .sydney-options-dialog-fields {
  display: flex;
  flex-direction: column;
  gap: var(--sydney-dashboard-space-3);
  margin-top: var(--sydney-dashboard-space-5);
}
.sydney-options-dialog .sydney-options-dialog-field {
  display: flex;
  align-items: center;
  gap: var(--sydney-dashboard-space-2);
  margin: 0;
  cursor: pointer;
  color: var(--sydney-dashboard-gray-700);
}
.sydney-options-dialog .sydney-options-dialog-field input {
  margin: 0;
  flex-shrink: 0;
}
.sydney-options-dialog .sydney-confirm-dialog-actions {
  justify-content: flex-end;
}
.sydney-video-dialog {
  /* Sized by the video, not the confirm copy. The header and the frame run to
     the edges, so the dialog clips them to its own radius. */
  max-width: 800px;
  padding: 0;
  overflow: hidden;
}
/* Header, close box and hover all match .sydney-display-conditions-modal-header. */
.sydney-video-dialog-header {
  position: relative;
  height: 50px;
  border-bottom: 1px solid var(--sydney-dashboard-border-subtle);
  background-color: var(--sydney-dashboard-surface);
}
.sydney-video-dialog-close {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: var(--sydney-dashboard-gray-700);
  cursor: pointer;
  opacity: 0.5;
  transition: opacity var(--sydney-dashboard-duration-base);
}
.sydney-video-dialog-close:hover,
.sydney-video-dialog-close:focus {
  opacity: 1;
}
.sydney-video-dialog-body {
  padding: var(--sydney-dashboard-space-5);
}
.sydney-video-dialog-iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: var(--sydney-dashboard-radius-md);
  background-color: #000;
}
.template-builder-wrapper .template-builder-pro-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sydney-dashboard-space-5);
  background-color: var(--sydney-dashboard-surface-sunken-light);
  /* Matches the #template-builder well below it, so the two read as one set. */
  border: 1px solid var(--sydney-dashboard-border-subtle);
  border-radius: var(--sydney-dashboard-radius-md);
  padding: var(--sydney-dashboard-space-3) var(--sydney-dashboard-space-5);
  /* Leads the panel, so the wrapper's own top padding is the only space above it. */
  margin: 0 0 var(--sydney-dashboard-space-5);
}
.template-builder-pro-notice p {
  margin: 0;
  /* Sized up to lg; keeps the h4's weight and line-height so the notice reads
     at the same level as the card titles it introduces. 600 is wp-admin's own
     weight for h4. */
  font-size: var(--sydney-dashboard-font-size-lg);
  line-height: var(--sydney-dashboard-line-height-snug);
  font-weight: var(--sydney-dashboard-font-weight-semibold);
}
.template-builder-pro-notice-actions {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: var(--sydney-dashboard-space-3);
}
#template-builder {
  display: grid;
  /* 320px is the narrowest a card can be before its action icons wrap, so below
     the breakpoint fit as many columns as that allows. Capped at 3 above it,
     otherwise very wide screens would keep adding columns. */
  grid-template-columns: repeat(auto-fit, minmax(var(--sydney-dashboard-card-min), 1fr));
  gap: var(--sydney-dashboard-space-5);
  /* Inset matches the gap, so the cards sit evenly inside the well. */
  padding: var(--sydney-dashboard-space-5);
  margin-bottom: var(--sydney-dashboard-space-6);
  background-color: var(--sydney-dashboard-surface-sunken-light);
  border: 1px solid var(--sydney-dashboard-border-subtle);
  border-radius: var(--sydney-dashboard-radius-md);
}
@media (min-width: 1366px) {
  #template-builder {
    grid-template-columns: repeat(3, 1fr);
  }
}
#template-builder[data-pro="false"] .template-item,
#template-builder[data-pro="false"] .add-new-template-wrapper {
  position: relative;
}
#template-builder .tb-upgrade-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  background-color: var(--sydney-dashboard-veil-dark);
  color: var(--sydney-dashboard-on-accent);
  /* Covers .template-item edge to edge, so it follows that radius. */
  border-radius: var(--sydney-dashboard-radius-lg);
  transition: all var(--sydney-dashboard-duration-slow);
}
/* The veil spans the card's padding too, so the gutter is put back here. */
#template-builder .tb-upgrade-overlay > div {
  padding: 0 var(--sydney-dashboard-space-5);
}
#template-builder .tb-upgrade-overlay p {
  /* Caps the measure short of the card's inner width, so the copy keeps a
     readable line length instead of running edge to edge. */
  max-width: 36ch;
  margin: var(--sydney-dashboard-space-3) auto var(--sydney-dashboard-space-4);
  color: inherit;
  /* Add Template's wrapper is semibold for its label; the caption must not inherit it. */
  font-weight: var(--sydney-dashboard-font-weight-normal);
}
#template-builder[data-pro="false"] .template-item:hover .tb-upgrade-overlay,
#template-builder[data-pro="false"] .add-new-template-wrapper:hover .tb-upgrade-overlay {
  opacity: 1;
}
.template-name {
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* Matches the action icons, which are the tallest thing in this row. Without
     it the Global card - whose actions are hidden - sits a pixel higher. */
  min-height: 20px;
  margin-bottom: var(--sydney-dashboard-space-3);
}
/* Both title branches share a line-height, so a card with the editable name
   is exactly as tall as the Global card that renders plain text. */
.template-name h4,
.template-name input {
  line-height: var(--sydney-dashboard-line-height-snug);
}
.template-name h4 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.07em;
}
.template-name input {
  padding: 0;
  margin: 0;
  border: none;
  border-radius: 0;
  min-height: auto;
  height: auto;
  font-size: 1.07em;
}
.template-name input::placeholder {
  font-weight: var(--sydney-dashboard-font-weight-normal);
}
.template-name input:focus,
.template-name input:active {
  border: none;
  box-shadow: none;
  outline: none;
}
.template-name input:focus {
  /* First shadow masks the gap in the card's own background. */
  box-shadow: 0 4px 0 0 var(--sydney-dashboard-surface), 0 6px 0 0 var(--sydney-dashboard-primary);
}
.template-options {
  display: flex;
}
.template-options a {
  display: flex;
  align-items: center;
  text-decoration: none;
  margin-right: var(--sydney-dashboard-space-3);
  color: var(--sydney-dashboard-gray-700);
  position: relative;
}
.template-options a:last-child {
  margin-right: 0;
}
.template-options a:hover {
  color: var(--sydney-dashboard-primary-hover);
}
.template-item {
  /* Grid items default to min-width:auto, which would let long names widen the column. */
  min-width: 0;
  background-color: var(--sydney-dashboard-surface);
  padding: var(--sydney-dashboard-space-7);
  border: 2px solid var(--sydney-dashboard-border-subtle);
  border-radius: var(--sydney-dashboard-radius-lg);
}
.template-part {
  border-bottom: 1px solid var(--sydney-dashboard-border-subtle);
  padding: var(--sydney-dashboard-space-4) 0;
  display:flex;
  justify-content:space-between;
  align-items: center;
  position: relative;
  color: var(--sydney-dashboard-gray-700);
}
.part-icon {
  position: relative;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--sydney-dashboard-part-icon-size);
  height: var(--sydney-dashboard-part-icon-size);
  margin-right: calc(var(--sydney-dashboard-part-icon-offset) - var(--sydney-dashboard-part-icon-size));
  border-radius: var(--sydney-dashboard-radius-md);
  background-color: var(--sydney-dashboard-primary-tint-light);
  border: 1px solid var(--sydney-dashboard-primary-tint-border-light);
  color: var(--sydney-dashboard-gray-600);
}
/* Direct child only - .part-icon-check nests inside .part-icon, and a descendant
   selector would size its checkmark to the part glyph too. */
.part-icon > svg {
  display: block;
}
.part-icon-check {
  position: absolute;
  top: -7px;
  right: -7px;
  display: none;
  align-items: center;
  justify-content: center;
  width: 17px;
  height: 17px;
  border-radius: var(--sydney-dashboard-radius-circle);
  background-color: var(--sydney-dashboard-primary);
  border: 2px solid var(--sydney-dashboard-surface);
  color: var(--sydney-dashboard-on-accent);
}
.template-part[data-part-active="active"] .part-icon {
  background-color: var(--sydney-dashboard-primary-tint);
  border-color: var(--sydney-dashboard-primary-tint-border);
  color: var(--sydney-dashboard-primary);
}
.template-part[data-part-active="active"] .part-icon-check {
  display: flex;
}
/* Class, not :last-of-type - the free upsell overlay is the card's last div. */
.template-part.footer {
  border-bottom: none;
}
.template-part.header {
  border-top: 1px solid var(--sydney-dashboard-border-subtle);
}
.template-part[data-part-active="active"] {
  color: var(--sydney-dashboard-gray-900);
}

/* Options are stored on the assigned part, so there is nothing to open until
   one is set. */
.template-part .header-options {
  display: none;
}
.template-part[data-part-active="active"] .header-options {
  display: flex;
}
.template-part .edit-part {
  display: none;
}
.template-part .edit-part i {
  position: relative;
  top: 3px;
}
/* flex, not inline - the row is a .part-menu-item and has to keep laying its
   icon and label out. */
.template-part[data-part-active="active"] .edit-part {
  display: flex;
}
.template-part-inner {
  width: 100%;
  /* Lets the title and sub-label truncate instead of widening the row. */
  min-width: 0;
  position: relative;
}
.delete-template:hover {
  color: var(--sydney-dashboard-danger) !important;
}
.part-options-toggle {
  cursor:pointer;
  /* Anchors the open menu's arrow. */
  position: relative;
  /* Stretches to the row instead of hardcoding a height, so it keeps spanning
     the full row as the icon size or a second title line changes it. The
     negative margins reach back over .template-part's vertical padding. */
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  margin: var(--sydney-dashboard-space-4-neg) 0;
  text-align: center;
  border-top-right-radius: var(--sydney-dashboard-radius-lg);
  border-bottom-right-radius: var(--sydney-dashboard-radius-lg);
}
/* Part menu: one popover per row, anchored under it, sliding between the
   top-level menu, the existing-parts list and the builder choice. Only the
   panel in view is measurable as a height, which is why the JS sets it. */
/* Arrow pointing back at the ellipsis the menu opened from. Drawn by the toggle
   rather than by .part-menu, which clips its own overflow, and hung off the
   toggle rather than off the row so it stays centred on the icon - the toggle is
   a flex item and gives up part of its width when the row is tight. Above the
   menu, so its fill hides the length of border-top it crosses. */
.template-part.part-menu-open .part-options-toggle::after {
  content: "";
  position: absolute;
  top: calc(100% - 6px);
  left: 50%;
  z-index: calc(var(--sydney-dashboard-z-dropdown) + 1);
  width: 11px;
  height: 11px;
  background-color: var(--sydney-dashboard-surface);
  border-top: 1px solid var(--sydney-dashboard-border-subtle);
  border-left: 1px solid var(--sydney-dashboard-border-subtle);
  border-radius: 2px 0 0 0;
  transform: translateX(-50%) rotate(45deg);
}
.part-menu {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  z-index: var(--sydney-dashboard-z-dropdown);
  width: 220px;
  overflow: hidden;
  background-color: var(--sydney-dashboard-surface);
  border: 1px solid var(--sydney-dashboard-border-subtle);
  border-radius: var(--sydney-dashboard-radius-lg);
  box-shadow: var(--sydney-dashboard-shadow-popover);
  transition: height var(--sydney-dashboard-duration-slow) var(--sydney-dashboard-ease-emphasized);
}
.part-menu.open {
  display: block;
}
.part-menu-track {
  display: flex;
  /* flex-start, so a short panel is not stretched to the tallest one and the
     height the JS reads off it stays the height it will be shown at. */
  align-items: flex-start;
  width: 300%;
  transition: transform var(--sydney-dashboard-duration-slow) var(--sydney-dashboard-ease-emphasized);
}
.part-menu-panel {
  box-sizing: border-box;
  width: 33.3333%;
  padding: var(--sydney-dashboard-space-1);
}
.part-menu[data-view="list"] .part-menu-track {
  transform: translateX(-33.3333%);
}
.part-menu[data-view="builder"] .part-menu-track {
  transform: translateX(-66.6666%);
}
.part-menu-item {
  display: flex;
  align-items: center;
  gap: var(--sydney-dashboard-space-2);
  padding: var(--sydney-dashboard-space-2) var(--sydney-dashboard-space-3);
  border-radius: var(--sydney-dashboard-radius-lg);
  color: var(--sydney-dashboard-gray-700);
  font-size: var(--sydney-dashboard-font-size-base);
  font-weight: var(--sydney-dashboard-font-weight-semibold);
  cursor: pointer;
}
.part-menu-item:hover {
  background-color: var(--sydney-dashboard-primary-tint-light);
  color: var(--sydney-dashboard-gray-900);
}
/* Direct child only - the trailing chevron keeps its own colour, and the
   builder rows carry a brand-coloured icon. */
.part-menu-item > svg {
  flex: 0 0 auto;
  color: var(--sydney-dashboard-gray-600);
}
/* Registry icons carry their own width/height; these two come from the theme
   sprite, which ships a viewBox only. */
.part-menu-item.create-new > svg {
  width: 16px;
  height: 16px;
}
/* Reversed: the cloned reset icon's arrowhead points counter-clockwise. */
.part-menu-item .part-menu-spinner {
  animation: sydney-spin 1.5s linear infinite reverse;
}
.part-menu-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* Colour alone sets it apart from the rows it sits above - it keeps their size. */
.part-menu-back {
  color: var(--sydney-dashboard-gray-600);
}
.part-menu-divider {
  height: 1px;
  margin: var(--sydney-dashboard-space-1) var(--sydney-dashboard-space-2);
  background-color: var(--sydney-dashboard-gray-100);
}
.part-menu-empty {
  padding: var(--sydney-dashboard-space-2) var(--sydney-dashboard-space-3);
  color: var(--sydney-dashboard-gray-600);
  font-size: var(--sydney-dashboard-font-size-base);
}
.part-options .reset,
.part-options .reset > svg {
  color: var(--sydney-dashboard-danger);
}
.part-options .reset:hover {
  background-color: var(--sydney-dashboard-danger-tint);
  color: var(--sydney-dashboard-danger);
}
/* Caps the list instead of the popover, so the panel the JS measures already
   accounts for the scroll. */
.existing-parts-list {
  max-height: 146px;
  overflow-x: hidden;
  overflow-y: auto;
}
/* Block rather than flex: these rows carry no icon, and a generated part name
   is long enough that it has to truncate instead of wrapping the row. */
.existing-parts-item {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.existing-parts-list::-webkit-scrollbar {
  width: 8px;
}
.existing-parts-list::-webkit-scrollbar-thumb {
  background-color: var(--sydney-dashboard-gray-300);
  border: 2px solid var(--sydney-dashboard-surface);
  border-radius: var(--sydney-dashboard-radius-lg);
}
.existing-parts-list::-webkit-scrollbar-track {
  background: transparent;
}
/* Same quiet secondary text as .part-sub-label. The padding is alignment with
   the item rows below it, not type. */
.page-builder-wrapper .page-builder-title {
  padding: var(--sydney-dashboard-space-1) var(--sydney-dashboard-space-3) var(--sydney-dashboard-space-2);
  color: var(--sydney-dashboard-gray-600);
  font-size: 11.5px;
  line-height: var(--sydney-dashboard-line-height-snug);
}
.page-builder-wrapper .elementor svg {
  fill: var(--sydney-dashboard-brand-elementor);
}
/* Separates the card's heading block from the part rows below it. */
.template-applies {
  display: flex;
  align-items: center;
  gap: var(--sydney-dashboard-space-2);
  margin: var(--sydney-dashboard-space-4) 0;
  font-size: var(--sydney-dashboard-font-size-base);
}
/* Long condition lists ellipsise instead of squeezing the Edit Rules link. */
.template-applies-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.template-applies-text.sydney-display-conditions-modal-toggle {
  cursor: pointer;
}
/* Same colours as the duplicate and delete icons in .template-options. */
.template-applies-edit {
  display: inline-flex;
          align-items: center;
      flex-shrink: 0;
  color: var(--sydney-dashboard-gray-700);
  text-decoration: none;
}
.template-applies-edit:hover,
.template-applies-edit:focus {
  color: var(--sydney-dashboard-primary-hover);
}
.template-applies-label {
  color: var(--sydney-dashboard-gray-700);
}
.template-applies-value {
  color: var(--sydney-dashboard-gray-900);
}
/* Global states its scope as a sentence, with no label to contrast against. */
.template-item[data-id="global"] .template-applies-value {
  color: var(--sydney-dashboard-gray-700);
}
/* No Edit Rules link on Global, so nothing to protect by ellipsising. */
.template-item[data-id="global"] .template-applies-text {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}
.part-title {
  display: block;
  overflow: hidden;
  font-size: var(--sydney-dashboard-font-size-md);
  font-weight: var(--sydney-dashboard-font-weight-normal);
  white-space: nowrap;
  text-overflow: ellipsis;
}
/* What renders in this slot while nothing is assigned here. A set part signals
   itself through the icon treatment, so it drops the sub-label instead. */
.part-sub-label {
  display: flex;
  align-items: center;
  gap: var(--sydney-dashboard-space-1);
  margin-top: var(--sydney-dashboard-nudge);
  overflow: hidden;
  color: var(--sydney-dashboard-gray-600);
  font-size: 11.5px;
  /* Admin-wide line-height is a length (18.2px), which would push the two-line
     title block past the icon and make unset rows taller than set ones. */
  line-height: var(--sydney-dashboard-line-height-snug);
  white-space: nowrap;
}
.part-sub-label svg {
  flex: 0 0 auto;
  transform: translateY(-2px);
}
.part-sub-label-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: var(--sydney-dashboard-font-size-base);
}
/* The arrow means "falls through from somewhere else", so an assigned template
   name - which is the slot's own value - is shown without it. */
.part-sub-label--assigned svg {
  display: none;
}
/* Clicking a part opens its options, as the old "Select ..." label did. */
.template-part .part-title,
.template-part .part-sub-label {
  cursor: pointer;
}
.sydney-display-conditions-control {
  display: inline;
}
.sydney-display-conditions-control-buttons {
  display: flex;
}

.sydney-display-conditions-modal-button {
  width: 100%;
  text-align: center;
}

.sydney-display-conditions-modal {
  -webkit-user-select: none;
          user-select: none;
  display: none;
          align-items: center;
          justify-content: center;
  position: fixed;
  z-index: var(--sydney-dashboard-z-modal);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--sydney-dashboard-scrim);
}
.sydney-display-conditions-modal .sydney-button-close {
  top: 15px;
  right: 15px;
}
.select2-container {
  z-index: var(--sydney-dashboard-z-modal) !important;
}
.sydney-display-conditions-modal.open {
  display: flex;
}

.sydney-display-conditions-modal .select2-container--default .select2-selection--single {
  padding: 0;
  height: 32px;
  border-color: var(--sydney-dashboard-border-strong);
}

.sydney-display-conditions-modal .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 32px;
}

.sydney-display-conditions-modal .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 32px;
}

.sydney-display-conditions-modal .select2-container--default .select2-selection--single .select2-selection__clear {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  top: -1px;
  height: 100%;
  padding: 0;
}

.sydney-display-conditions-modal .select2-container--default .select2-selection--single .select2-selection__clear span {
  display: flex;
          align-items: center;
          justify-content: center;
  width: 14px;
  height: 14px;
  font-size: var(--sydney-dashboard-font-size-md);
  border-radius: var(--sydney-dashboard-radius-circle);
  font-weight: var(--sydney-dashboard-font-weight-normal);
  color: var(--sydney-dashboard-gray-700);
  background-color: var(--sydney-dashboard-gray-100);
}

.sydney-display-conditions-modal-outer {
  position: relative;
  overflow: hidden;
  display: flex;
          flex-direction: column;
  width: 600px;
  max-height: 80vh;
  background-color: var(--sydney-dashboard-surface);
  border-radius: var(--sydney-dashboard-radius-lg);
          box-shadow: var(--sydney-dashboard-shadow-modal);
  animation: sydney-confirm-dialog-in var(--sydney-dashboard-duration-fast) ease-out;
}

.sydney-display-conditions-modal-header {
  position: relative;
      flex-shrink: 0;
  display: flex;
          flex-direction: column;
          justify-content: center;
  padding-left: var(--sydney-dashboard-space-5);
  padding-right: var(--sydney-dashboard-space-17);
  height: 50px;
  border-bottom: 1px solid var(--sydney-dashboard-border-subtle);
  background-color: var(--sydney-dashboard-surface);
}

.sydney-display-conditions-modal-header h3 {
  font-size: var(--sydney-dashboard-font-size-md);
  margin: 0;
}

.sydney-display-conditions-modal-header .sydney-button-close {
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
  width: 50px;
  height: 100%;
  display: flex;
          justify-content: center;
          align-items: center;
  opacity: 0.5;
  transition: opacity var(--sydney-dashboard-duration-base);
}

.sydney-display-conditions-modal-header .sydney-button-close:hover {
  opacity: 1;
}

.sydney-display-conditions-modal-content {
          flex: 1;
  display: flex;
          flex-direction: column;
  max-height: 80vh;
  overflow: auto;
  padding: var(--sydney-dashboard-space-6);
}

.sydney-display-conditions-modal-content ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
          flex-direction: column;
}

.sydney-display-conditions-modal-content ul li {
          flex: 1;
  display: flex;
  margin-bottom: var(--sydney-dashboard-space-5);
}

.sydney-display-conditions-modal-content ul li.hidden {
  display: none;
}

.sydney-display-conditions-select2-type {
  width: 125px;
      flex-shrink: 0;
      flex-basis: 125px;
}

.sydney-display-conditions-select2-type .select2-selection:before {
  content: "+";
  position: absolute;
  left: 6px;
  top: 50%;
  transform: translateY(-50%);
  font-size: var(--sydney-dashboard-font-size-sm);
  line-height: 1;
  width: 14px;
  height: 14px;
  border-radius: var(--sydney-dashboard-radius-sm);
  display: flex;
          justify-content: center;
  background-color: var(--sydney-dashboard-gray-300);
}

.sydney-display-conditions-select2-type[data-type="exclude"] .select2-selection:before {
  content: "-";
}

.sydney-display-conditions-select2-type .select2-container .select2-selection--single .select2-selection__rendered {
  padding-left: var(--sydney-dashboard-space-7);
  padding-right: var(--sydney-dashboard-space-5);
}

.sydney-display-conditions-select2-groupped {
  width: calc(100% - 125px - 10px - 32px);
  flex-basis: calc(100% - 125px - 10px - 24px);
  display: flex;
  gap: var(--sydney-dashboard-space-2);
  margin-left: var(--sydney-dashboard-space-2);
}

.sydney-display-conditions-select2-condition {
  width: 100%;
}

.sydney-display-conditions-select2-id {
          flex: 1 0 50%;
  max-width: 50%;
}

/* Dropdown is appended to body, so it is matched by its own class, not the modal. */
.select2-dropdown.sydney-dc-dropdown .select2-results > .select2-results__options {
  max-height: 340px;
}

/* Takes the id select's slot - the two are mutually exclusive per condition. */
.sydney-display-conditions-schedule {
          flex: 1 0 50%;
  max-width: 50%;
  display: flex;
          flex-direction: column;
  gap: var(--sydney-dashboard-space-1);
}

/* Outranks core's .hidden, which the display above would otherwise beat. */
.sydney-display-conditions-schedule.hidden {
  display: none;
}

.sydney-display-conditions-schedule-field {
  display: flex;
          flex-direction: column;
}

.sydney-display-conditions-schedule-field span {
  font-size: var(--sydney-dashboard-font-size-sm);
  color: var(--sydney-dashboard-gray-700);
}

.sydney-display-conditions-schedule-field input[type=datetime-local] {
  width: 100%;
  min-height: 32px;
}

.sydney-display-conditions-schedule-note {
  font-size: var(--sydney-dashboard-font-size-xs);
  color: var(--sydney-dashboard-gray-700);
}

.sydney-display-conditions-modal-hint {
  margin: 0 0 var(--sydney-dashboard-space-4);
  font-size: var(--sydney-dashboard-font-size-sm);
  color: var(--sydney-dashboard-gray-700);
}

.sydney-display-conditions-modal-remove {
  flex-shrink: 0;
  cursor: pointer;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 32px;
  opacity: 0.5;
  transition: opacity var(--sydney-dashboard-duration-base);
}

.sydney-display-conditions-modal-remove:hover {
  opacity: 1;
}

.sydney-display-conditions-modal-remove svg {
  color: var(--sydney-dashboard-danger);
}

.sydney-display-conditions-modal-content-footer {
  display: flex;
  gap: var(--sydney-dashboard-space-4);
          justify-content: center;
}

.sydney-display-conditions-modal-content-footer .button {
  width: 100%;
  text-align: center;
}

.sydney-display-conditions-modal-footer {
      flex-shrink: 0;
  display: flex;
          align-items: center;
          justify-content: center;
  height: 80px;
  padding-left: var(--sydney-dashboard-space-5);
  padding-right: var(--sydney-dashboard-space-5);
  border-top: 1px solid var(--sydney-dashboard-border-subtle);
  background-color: var(--sydney-dashboard-surface-sunken-light);
}

.sydney-display-conditions-modal-footer .sydney-button-save {
  padding-left: var(--sydney-dashboard-space-5);
  padding-right: var(--sydney-dashboard-space-5);
}

.template-options .tooltip {
  visibility: hidden;
  width: 80px;
  font-size: var(--sydney-dashboard-font-size-base);
  background-color: var(--sydney-dashboard-gray-900);
  color: var(--sydney-dashboard-on-accent);
  text-align: center;
  border-radius: var(--sydney-dashboard-radius-md);
  padding: var(--sydney-dashboard-space-1) 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: var(--sydney-dashboard-space-10-neg);
  opacity: 0;
  transition: opacity var(--sydney-dashboard-duration-slow);
}

.template-options .tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: var(--sydney-dashboard-space-1-neg);
  border-width: 5px;
  border-style: solid;
  border-color: var(--sydney-dashboard-gray-900) transparent transparent transparent;
}

.template-options a:hover .tooltip {
  visibility: visible;
  opacity: 1;
}

.add-new-template-wrapper {
  order: 99;
  min-width: 0;
  text-align: center;
  font-weight: var(--sydney-dashboard-font-weight-semibold);
}
#add-new-template {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sydney-dashboard-space-3);
  /* Fills the grid row alongside the template cards; the floor is for when it
     wraps onto a row of its own. */
  height: 100%;
  min-height: 220px;
  padding: var(--sydney-dashboard-space-6);
  border-radius: var(--sydney-dashboard-radius-lg);
  border: 2px dashed var(--sydney-dashboard-border);
  cursor: pointer;
  color: var(--sydney-dashboard-gray-700);
  transition: all var(--sydney-dashboard-duration-base) ease;
}
#add-new-template:hover {
  border: 2px dashed var(--sydney-dashboard-primary);
  color: var(--sydney-dashboard-primary);
  background-color: var(--sydney-dashboard-primary-tint-light);
}
#add-new-template .add-new-template-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: var(--sydney-dashboard-radius-circle);
  background-color: var(--sydney-dashboard-surface);
  border: 1px solid var(--sydney-dashboard-border-subtle);
}

.sydney-elementor-iframe-wrapper {
  position: fixed;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  z-index: var(--sydney-dashboard-z-overlay);
  background-color: var(--sydney-dashboard-scrim-strong);
  display: grid;
  place-items: center;
}

.sydney-elementor-iframe-wrapper iframe {
  width: 94%;
  height: 88%;
}

.sydney-elementor-iframe-wrapper .sydney-editor-close {
  position: absolute;
  top: 5%;
  right: 3%;
  z-index: var(--sydney-dashboard-z-overlay);
  margin-right: var(--sydney-dashboard-space-7-neg)
}

.sydney-elementor-iframe-wrapper .sydney-editor-close svg {
  fill: var(--sydney-dashboard-on-accent);
  width: 20px;
  height: 20px
}

.sydney-dashboard-feature-card.sydney-dashboard-feature-card-plugin {
  gap: var(--sydney-dashboard-space-2);
  height: 100%;
}

.sydney-dashboard-feature-card.sydney-dashboard-feature-card-plugin a {
  margin-top: auto;
}

/* Setup Checklist */
.sydney-setup-checklist-intro {
	margin-bottom: var(--sydney-dashboard-space-6);
}
.sydney-setup-checklist-intro h2 {
	font-size: var(--sydney-dashboard-font-size-2xl);
	line-height: 30px;
	margin: 0 0 var(--sydney-dashboard-space-2);
}
.sydney-setup-checklist-intro p {
	margin: 0;
	max-width: 70ch;
}
/* Benefit list on the Home sidebar's Sydney Pro card. */
.sydney-dashboard-pro-benefits {
	margin: 0 0 var(--sydney-dashboard-space-3);
	padding: 0;
	list-style: none;
}
.sydney-dashboard-pro-benefits li {
	display: flex;
	gap: var(--sydney-dashboard-space-2);
	align-items: flex-start;
	margin: 0 0 var(--sydney-dashboard-space-2);
}
.sydney-dashboard-pro-benefits svg {
	flex-shrink: 0;
	margin-top: 2px;
}
/* The Pro row above the Starter Sites grid. */
.sydney-dashboard-starter-sites-pro-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--sydney-dashboard-space-4);
	margin-bottom: var(--sydney-dashboard-space-5);
	padding: var(--sydney-dashboard-space-2) var(--sydney-dashboard-space-5);
	border: 1px solid var(--sydney-dashboard-border-subtle);
	border-radius: var(--sydney-dashboard-radius-md);
	background-color: var(--sydney-dashboard-surface-sunken-light);
}
.sydney-dashboard-starter-sites-pro-row p {
	margin: 0;
	max-width: 80ch;
}
/* Cancels the card body's "p + a" top margin, which pushed the link below the text. */
.sydney-dashboard-card .sydney-dashboard-starter-sites-pro-row .sydney-dashboard-external-link {
	margin-top: 0;
}
/* The card that follows a finished setup checklist. */
.sydney-dashboard-next-step-card {
	position: relative;
	padding: var(--sydney-dashboard-space-6);
	border: 1px solid var(--sydney-dashboard-primary-tint-border);
	border-radius: var(--sydney-dashboard-radius-lg);
	background: var(--sydney-dashboard-primary-tint-light);
}
.sydney-dashboard-next-step-card h2 {
	font-size: var(--sydney-dashboard-font-size-2xl);
	line-height: 30px;
	margin: 0 0 var(--sydney-dashboard-space-2);
}
.sydney-dashboard-next-step-card p {
	margin: 0 0 var(--sydney-dashboard-space-4);
	max-width: 70ch;
}
.sydney-setup-checklist-category-box {
	border: 1px solid var(--sydney-dashboard-border);
	border-radius: var(--sydney-dashboard-radius-md);
	background: var(--sydney-dashboard-surface);
	overflow: hidden;
}
.sydney-setup-checklist-category.is-fully-done.is-collapsed .sydney-setup-checklist-category-box {
	background: var(--sydney-dashboard-success-tint);
	border-color: var(--sydney-dashboard-success-tint);
}
.sydney-setup-checklist-category-header {
	display: flex;
	align-items: center;
	gap: var(--sydney-dashboard-space-3);
	padding: var(--sydney-dashboard-space-3) var(--sydney-dashboard-space-5);
	margin: 0;
	border-bottom: 1px solid var(--sydney-dashboard-border-subtle);
}
.sydney-setup-checklist-category.is-fully-done.is-collapsed .sydney-setup-checklist-category-header {
	border-bottom: 0;
}
.sydney-setup-checklist-category.is-collapsed .sydney-setup-checklist-category-header {
	cursor: pointer;
}
.sydney-setup-checklist-category-label {
	font-size: var(--sydney-dashboard-font-size-lg);
	line-height: var(--sydney-dashboard-line-height-snug);
	margin: 0;
}
.sydney-setup-checklist-category-progress {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: var(--sydney-dashboard-radius-circle);
	flex-shrink: 0;
	font-size: var(--sydney-dashboard-font-size-xs);
	font-weight: var(--sydney-dashboard-font-weight-medium);
	line-height: 1;
	font-variant-numeric: tabular-nums;
	box-sizing: border-box;
}
.sydney-setup-checklist-category-progress.is-state-empty,
.sydney-setup-checklist-category-progress.is-state-partial {
	background: var(--sydney-dashboard-surface-sunken);
}
.sydney-setup-checklist-category-progress.is-state-done {
	background: var(--sydney-dashboard-success);
	border: 1.5px solid var(--sydney-dashboard-success);
	color: var(--sydney-dashboard-on-accent);
}
.sydney-setup-checklist-category-progress-fraction {
	display: inline;
}
.sydney-setup-checklist-category-progress-check {
	display: none;
}
.sydney-setup-checklist-category-progress.is-state-done .sydney-setup-checklist-category-progress-fraction {
	display: none;
}
.sydney-setup-checklist-category-progress.is-state-done .sydney-setup-checklist-category-progress-check {
	display: inline-block;
}
.sydney-setup-checklist-category-toggle {
	display: none;
	margin-left: auto;
	background: transparent;
	border: 0;
	padding: var(--sydney-dashboard-space-1);
	cursor: pointer;
	line-height: 0;
	border-radius: var(--sydney-dashboard-radius-sm);
}
.sydney-setup-checklist-category-toggle:focus-visible {
	outline: 2px solid var(--sydney-dashboard-primary);
	outline-offset: 2px;
}
.sydney-setup-checklist-category-toggle svg {
	transition: transform var(--sydney-dashboard-duration-base) ease;
}
.sydney-setup-checklist-category.is-fully-done .sydney-setup-checklist-category-toggle {
	display: inline-flex;
}
.sydney-setup-checklist-category.is-fully-done:not(.is-collapsed) .sydney-setup-checklist-category-toggle svg {
	transform: rotate(180deg);
}
.sydney-setup-checklist-category.is-fully-done.is-collapsed .sydney-setup-checklist-items {
	display: none;
}
.sydney-setup-checklist-items {
	list-style: none;
	margin: 0;
	padding: 0;
}
.sydney-setup-checklist-item {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding: var(--sydney-dashboard-space-4) var(--sydney-dashboard-space-5);
	border-bottom: 1px solid var(--sydney-dashboard-border-subtle);
	column-gap: var(--sydney-dashboard-space-3);
	row-gap: 0;
}
.sydney-setup-checklist-item:last-child {
	border-bottom: 0;
}
.sydney-setup-checklist-item-status {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	color: var(--sydney-dashboard-gray-400);
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0;
	line-height: 0;
	cursor: pointer;
	border-radius: var(--sydney-dashboard-radius-circle);
	transition: color var(--sydney-dashboard-duration-fast) ease;
}
.sydney-setup-checklist-item-status:hover:not([disabled]) {
	color: var(--sydney-dashboard-primary);
}
.sydney-setup-checklist-item-status:focus-visible {
	outline: 2px solid var(--sydney-dashboard-primary);
	outline-offset: 2px;
}
.sydney-setup-checklist-item-status[disabled] {
	cursor: default;
}
.sydney-setup-checklist-item-status.is-loading {
	opacity: 0.5;
}
.sydney-setup-checklist-item-status .check {
	display: none;
}
.sydney-setup-checklist-item.is-done .sydney-setup-checklist-item-status .ring {
	fill: var(--sydney-dashboard-success);
	stroke: var(--sydney-dashboard-success);
}
.sydney-setup-checklist-item.is-done .sydney-setup-checklist-item-status .check {
	display: inline;
	stroke: var(--sydney-dashboard-on-accent);
}
.sydney-setup-checklist-item.is-done .sydney-setup-checklist-item-status:hover:not([disabled]) .ring {
	fill: var(--sydney-dashboard-success-hover);
	stroke: var(--sydney-dashboard-success-hover);
}
.sydney-setup-checklist-item-text {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}
.sydney-setup-checklist-item.is-done .sydney-setup-checklist-item-title {
	text-decoration: line-through;
}
.sydney-setup-checklist-item.is-done .sydney-setup-checklist-item-text,
.sydney-setup-checklist-item.is-done .sydney-setup-checklist-item-actions {
	opacity: 0.5;
}
.sydney-setup-checklist-item-desc {
	font-size: var(--sydney-dashboard-font-size-base);
	margin-top: var(--sydney-dashboard-space-1);
}
.sydney-setup-checklist-item-actions {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: var(--sydney-dashboard-space-3);
}
.sydney-setup-checklist-item-actions .button,
.sydney-setup-checklist-item-actions .button-primary,
.sydney-setup-checklist-item-actions .button-secondary {
	min-width: 115px;
	text-align: center;
}
.sydney-setup-checklist-item-actions svg {
	vertical-align: middle;
	margin-right: var(--sydney-dashboard-space-1);
}
.sydney-setup-checklist-help {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	margin: 0;
	background: transparent;
	border: 0;
	border-radius: var(--sydney-dashboard-radius-circle);
	color: var(--sydney-dashboard-gray-700);
	cursor: pointer;
	line-height: 0;
	transition: color var(--sydney-dashboard-duration-fast) ease, background var(--sydney-dashboard-duration-fast) ease;
}
.sydney-setup-checklist-help:hover {
	color: var(--sydney-dashboard-primary);
	background: var(--sydney-dashboard-primary-tint-light);
}
.sydney-setup-checklist-help:focus-visible {
	outline: 2px solid var(--sydney-dashboard-primary);
	outline-offset: 2px;
}
.sydney-setup-checklist-help svg {
	margin: 0;
}
.sydney-setup-checklist-help-dialog {
	position: fixed;
	padding: 0;
	border: 0;
	border-radius: var(--sydney-dashboard-radius-lg);
	background: var(--sydney-dashboard-surface);
	box-shadow: var(--sydney-dashboard-shadow-modal);
	max-width: min(960px, 92vw);
	max-height: 92vh;
	overflow: visible;
}
.sydney-setup-checklist-help-dialog::backdrop {
	background: var(--sydney-dashboard-scrim);
}
.sydney-setup-checklist-help-dialog-image {
	display: block;
	width: 100%;
	height: auto;
	max-height: 92vh;
	border-radius: var(--sydney-dashboard-radius-lg);
}
.sydney-setup-checklist-help-dialog-close {
	position: absolute;
	top: -14px;
	right: -14px;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	border-radius: var(--sydney-dashboard-radius-circle);
	background: var(--sydney-dashboard-gray-900);
	color: var(--sydney-dashboard-on-accent);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-shadow: var(--sydney-dashboard-shadow-sm);
}
.sydney-setup-checklist-help-dialog-close:hover {
	background: var(--sydney-dashboard-gray-900);
}
.sydney-setup-checklist-help-dialog-close:focus-visible {
	outline: 2px solid var(--sydney-dashboard-primary);
	outline-offset: 2px;
}
@media (max-width: 720px) {
	.sydney-setup-checklist-item-actions {
		width: 100%;
		justify-content: flex-end;
	}
}
.sydney-dashboard-upgrade-reassurance {
	margin: 0;
	font-size: var(--sydney-dashboard-font-size-sm);
	color: var(--sydney-dashboard-gray-700);
}

/* Get Sydney Pro: upgrade from a license key (free edition, Settings tab) */
.sydney-pro-upgrade-reveal,
.sydney-pro-upgrade-cancel {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  text-decoration: underline;
  cursor: pointer;
}
.sydney-pro-upgrade-reveal {
  color: var(--sydney-dashboard-primary);
}
.sydney-pro-upgrade-cancel {
  align-self: center;
  color: var(--sydney-dashboard-gray-900);
}
.sydney-pro-upgrade-prompt {
  margin-top: var(--sydney-dashboard-space-2);
}
.sydney-pro-upgrade-prompt[hidden],
.sydney-pro-upgrade-form[hidden],
.sydney-pro-upgrade-error[hidden] {
  display: none;
}
.sydney-pro-upgrade-form {
  margin-top: var(--sydney-dashboard-space-4);
}
.sydney-pro-upgrade-row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: var(--sydney-dashboard-space-3);
}
.sydney-pro-upgrade-row .sydney-license-key-input input {
  width: 340px;
  max-width: 100%;
  min-height: 36px;
  padding-left: var(--sydney-dashboard-space-9);
}
/* Same box as Sydney Pro's license form button. The element in the selector
   keeps this padding over license.css's loading padding, as Pro's does. */
button.sydney-pro-upgrade-start {
  position: relative;
  display: flex;
  gap: var(--sydney-dashboard-space-1);
  align-items: center;
  line-height: 1em;
  min-height: 36px;
  padding: var(--sydney-dashboard-space-2) var(--sydney-dashboard-space-10) !important;
}
.sydney-pro-upgrade-error {
  margin-top: var(--sydney-dashboard-space-2);
  color: var(--sydney-dashboard-danger);
}
.sydney-dashboard-card .sydney-dashboard-card-body p.sydney-pro-upgrade-note {
  margin-top: 5px;
}

/* Sydney Pro upgrade progress popup */
.sydney-pro-upgrade-modal-overlay {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(30, 30, 30, 0.6);
  z-index: 100000;
}
.sydney-pro-upgrade-modal-overlay[hidden] {
  display: none;
}
.sydney-pro-upgrade-modal {
  width: 400px;
  max-width: calc(100% - 40px);
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 10px 40px rgba(30, 30, 30, 0.25);
  padding: 32px 28px;
  box-sizing: border-box;
  animation: sydney-pro-upgrade-modal-in 0.15s ease-out;
}
@keyframes sydney-pro-upgrade-modal-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
}
@keyframes sydney-pro-upgrade-pop {
  0% { transform: scale(0); }
  70% { transform: scale(1.12); }
  100% { transform: scale(1); }
}
.sydney-pro-upgrade-modal__running,
.sydney-pro-upgrade-modal__success,
.sydney-pro-upgrade-modal__error {
  display: none;
}
.sydney-pro-upgrade-modal.is-running .sydney-pro-upgrade-modal__running {
  display: flex;
}
.sydney-pro-upgrade-modal.is-success .sydney-pro-upgrade-modal__success,
.sydney-pro-upgrade-modal.is-error .sydney-pro-upgrade-modal__error {
  display: block;
}
.sydney-pro-upgrade-modal__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.sydney-pro-upgrade-modal__running {
  align-items: center;
  gap: 16px;
}
.sydney-pro-upgrade-modal__spinner {
  flex: none;
  width: 28px;
  height: 28px;
  color: var(--sydney-dashboard-primary);
  animation: sydney-spin 1s linear infinite;
}
.sydney-pro-upgrade-modal__running-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--sydney-dashboard-gray-900);
}
.sydney-pro-upgrade-modal__running-sub {
  font-size: 12px;
  color: var(--sydney-dashboard-gray-700);
}
.sydney-pro-upgrade-modal__success {
  text-align: center;
}
.sydney-pro-upgrade-modal__check {
  position: relative;
  width: 60px;
  height: 60px;
  margin: 0 auto;
  border-radius: 50%;
  background: var(--sydney-dashboard-success);
  animation: sydney-pro-upgrade-pop 1s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}
.sydney-pro-upgrade-modal__check::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 14px;
  height: 26px;
  border-right: 4px solid #fff;
  border-bottom: 4px solid #fff;
  border-radius: 1px;
  transform: translate(-50%, -62%) rotate(45deg);
}
.sydney-pro-upgrade-modal__title {
  margin: 18px 0 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--sydney-dashboard-gray-900);
}
.sydney-pro-upgrade-modal__desc {
  margin: 8px 0 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--sydney-dashboard-gray-700);
}
.sydney-pro-upgrade-modal__links {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 20px;
  text-align: left;
}
.sydney-pro-upgrade-modal__link {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  height: auto;
  text-decoration: none;
}
.sydney-pro-upgrade-modal__link:hover,
.sydney-pro-upgrade-modal__link:focus {
  border-color: #e1e1e1;
  box-shadow: none;
  text-decoration: none;
}
.sydney-pro-upgrade-modal__link-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.sydney-pro-upgrade-modal__link-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--sydney-dashboard-gray-900);
}
.sydney-pro-upgrade-modal__link-sub {
  font-size: 12px;
  color: var(--sydney-dashboard-gray-700);
}
.sydney-pro-upgrade-modal__link-arrow {
  position: relative;
  flex: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #f5f5f5;
}
.sydney-pro-upgrade-modal__link-arrow::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 6px;
  height: 6px;
  border-top: 2px solid var(--sydney-dashboard-primary);
  border-right: 2px solid var(--sydney-dashboard-primary);
  transform: translate(-65%, -50%) rotate(45deg);
}
.sydney-pro-upgrade-modal__link-spinner {
  display: none;
  flex: none;
  width: 24px;
  height: 24px;
  color: var(--sydney-dashboard-primary);
  animation: sydney-spin 1s linear infinite;
}
.sydney-pro-upgrade-modal__link.is-installing {
  pointer-events: none;
}
.sydney-pro-upgrade-modal__link.is-installing .sydney-pro-upgrade-modal__link-arrow {
  display: none;
}
.sydney-pro-upgrade-modal__link.is-installing .sydney-pro-upgrade-modal__link-spinner {
  display: block;
}
.sydney-pro-upgrade-modal__link-error {
  display: none;
  margin-top: 4px;
  font-size: 12px;
  color: var(--sydney-dashboard-danger);
}
.sydney-pro-upgrade-modal__link-error.is-visible {
  display: block;
}
.sydney-pro-upgrade-modal__error-line {
  display: flex;
  align-items: center;
  gap: 16px;
}
.sydney-pro-upgrade-modal__x {
  position: relative;
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--sydney-dashboard-danger);
}
.sydney-pro-upgrade-modal__x::before,
.sydney-pro-upgrade-modal__x::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 13px;
  height: 2px;
  border-radius: 1px;
  background: #fff;
}
.sydney-pro-upgrade-modal__x::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.sydney-pro-upgrade-modal__x::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.sydney-pro-upgrade-modal__error-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--sydney-dashboard-gray-900);
}
.sydney-pro-upgrade-modal__error-sub {
  font-size: 12px;
  color: var(--sydney-dashboard-gray-700);
}
.sydney-pro-upgrade-modal__message {
  margin-top: 18px;
  padding: 12px 14px;
  border: 1px solid var(--sydney-dashboard-danger-tint-hover);
  border-radius: 6px;
  background: var(--sydney-dashboard-danger-tint);
  font-size: 13px;
  line-height: 1.5;
  color: var(--sydney-dashboard-danger);
}
.sydney-pro-upgrade-modal__message a {
  color: inherit;
  text-decoration: underline;
}
.sydney-pro-upgrade-modal__actions {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}
.sydney-pro-upgrade-modal__ok {
  min-width: 120px;
}
.sydney-pro-upgrade-modal__actions--split {
  justify-content: flex-end;
  gap: 10px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--sydney-dashboard-gray-100);
}

/* Coming Soon settings section. The markup is the AI Abilities section's:
   heading, description, then a grey well with the status and the controls.
   These rules cover the controls - neutral buttons, a split Edit page button
   and three dropdowns - and the Create page popover, which is the part menu
   with a second panel for the designs. Printed last so the popover's
   two-panel track wins over the three-panel one it is built on. */
.sydney-coming-soon-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--sydney-dashboard-space-2);
}
/* Anchors its dropdown, and the design menu on the page control. */
.sydney-coming-soon-control {
  position: relative;
  display: inline-flex;
}
/* Neutral beside the one primary action, Create page. */
.sydney-dashboard .button.sydney-coming-soon-button {
  gap: var(--sydney-dashboard-space-2);
  color: var(--sydney-dashboard-gray-900);
  border-color: var(--sydney-dashboard-border);
  background-color: var(--sydney-dashboard-surface);
  white-space: nowrap;
}
.sydney-dashboard .button.sydney-coming-soon-button:hover,
.sydney-dashboard .button.sydney-coming-soon-button[aria-expanded="true"] {
  color: var(--sydney-dashboard-gray-900);
  border-color: var(--sydney-dashboard-border-strong);
  background-color: var(--sydney-dashboard-surface-sunken-light);
}
.sydney-dashboard .button.sydney-coming-soon-button:focus-visible,
.sydney-coming-soon-dropdown-item:focus-visible {
  outline: 2px solid var(--sydney-dashboard-primary);
  outline-offset: 1px;
}
.sydney-dashboard .button.sydney-coming-soon-button:disabled {
  color: var(--sydney-dashboard-gray-600) !important;
  border-color: var(--sydney-dashboard-border) !important;
  background-color: var(--sydney-dashboard-surface) !important;
  cursor: not-allowed;
}
.sydney-coming-soon-button svg {
  flex-shrink: 0;
  margin-right: var(--sydney-dashboard-space-1-neg);
  fill: currentColor;
}
/* Its own display rule rather than .bt-flex-center, whose !important would
   outrank .bt-d-none when there is no page yet. */
.sydney-coming-soon-split {
  position: relative;
  display: inline-flex;
}
.sydney-dashboard .sydney-coming-soon-split .sydney-coming-soon-edit {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.sydney-dashboard .sydney-coming-soon-split .sydney-coming-soon-dropdown-toggle {
  margin-left: var(--sydney-dashboard-nudge-neg);
  padding-right: var(--sydney-dashboard-space-2);
  padding-left: var(--sydney-dashboard-space-2);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.sydney-dashboard .sydney-coming-soon-split .sydney-coming-soon-dropdown-toggle svg {
  margin-right: 0;
}
.sydney-coming-soon-mode-prefix {
  color: var(--sydney-dashboard-gray-700);
}
.sydney-coming-soon-button:disabled .sydney-coming-soon-mode-prefix {
  color: inherit;
}
/* The menus are the Template Builder's part menu and rows, opening upward:
   the card ends the page in Pro, so there is no room below it. */
.part-menu.sydney-coming-soon-dropdown {
  top: auto;
  bottom: 100%;
  width: auto;
  min-width: 220px;
  margin-bottom: var(--sydney-dashboard-space-2);
  padding: var(--sydney-dashboard-space-1);
  text-align: left;
}
/* Under Edit page, left edges lined up. */
.part-menu.sydney-coming-soon-page-menu {
  right: auto;
  left: 0;
}
.part-menu.sydney-coming-soon-mode-menu {
  width: 320px;
}
/* The rows are links and buttons here, not the spans the builder uses. */
.sydney-coming-soon-dropdown-item {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  border: 0;
  background: none;
  font-family: inherit;
  line-height: var(--sydney-dashboard-line-height-snug);
  text-align: left;
  text-decoration: none;
  white-space: nowrap;
}
.sydney-coming-soon-dropdown-item:focus {
  color: var(--sydney-dashboard-gray-900);
  box-shadow: none;
}
.sydney-coming-soon-dropdown-item:focus-visible {
  background-color: var(--sydney-dashboard-primary-tint-light);
}
/* The mode descriptions wrap inside the menu's fixed width. */
.sydney-coming-soon-mode-option {
  align-items: flex-start;
  white-space: normal;
}
.sydney-coming-soon-mode-check {
  display: inline-flex;
  flex-shrink: 0;
  margin-top: 3px;
  color: var(--sydney-dashboard-primary);
  visibility: hidden;
}
.sydney-coming-soon-mode-check svg {
  fill: currentColor;
}
.sydney-coming-soon-mode-option[aria-checked="true"] .sydney-coming-soon-mode-check {
  visibility: visible;
}
.sydney-coming-soon-mode-option-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.sydney-coming-soon-mode-option-description {
  color: var(--sydney-dashboard-gray-700);
  font-weight: var(--sydney-dashboard-font-weight-normal);
}
.sydney-coming-soon-advanced .sydney-dashboard-badge {
  padding: 0 var(--sydney-dashboard-space-1);
  font-size: var(--sydney-dashboard-font-size-xs);
  line-height: 16px;
}
.part-menu.sydney-coming-soon-menu {
  top: auto;
  bottom: 100%;
  width: 320px;
  margin-bottom: var(--sydney-dashboard-space-2);
  text-align: left;
}
.sydney-coming-soon-menu .part-menu-track {
  width: 200%;
}
.sydney-coming-soon-menu .part-menu-panel {
  width: 50%;
  padding: var(--sydney-dashboard-space-2);
}
.sydney-coming-soon-menu[data-view="builder"] .part-menu-track {
  transform: none;
}
.sydney-coming-soon-menu[data-view="designs"] .part-menu-track {
  transform: translateX(-50%);
}
.sydney-coming-soon-design-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sydney-dashboard-space-2);
  padding: 0 var(--sydney-dashboard-space-2) var(--sydney-dashboard-space-2);
}
.sydney-coming-soon-design {
  position: relative;
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: var(--sydney-dashboard-space-1);
  border: 1px solid var(--sydney-dashboard-border-subtle);
  border-radius: var(--sydney-dashboard-radius-md);
  background-color: var(--sydney-dashboard-surface);
  color: var(--sydney-dashboard-gray-700);
  font: inherit;
  font-size: var(--sydney-dashboard-font-size-sm);
  font-weight: var(--sydney-dashboard-font-weight-semibold);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: border-color var(--sydney-dashboard-duration-fast), background-color var(--sydney-dashboard-duration-fast);
}
.sydney-coming-soon-design:hover,
.sydney-coming-soon-design:focus-visible {
  border-color: var(--sydney-dashboard-primary-tint-border);
  background-color: var(--sydney-dashboard-primary-tint-light);
  color: var(--sydney-dashboard-gray-900);
}
.sydney-coming-soon-design img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 14 / 9;
  border-radius: var(--sydney-dashboard-radius-sm);
}
.sydney-coming-soon-design-lock {
  position: absolute;
  top: var(--sydney-dashboard-space-2);
  right: var(--sydney-dashboard-space-2);
  display: inline-flex;
  padding: var(--sydney-dashboard-space-1);
  border-radius: 999px;
  background-color: var(--sydney-dashboard-surface);
  box-shadow: var(--sydney-dashboard-shadow-sm);
}
.sydney-coming-soon-design.is-locked {
  color: var(--sydney-dashboard-gray-600);
}
.sydney-coming-soon-design.is-locked img {
  opacity: 0.6;
}
/* Pro's Advanced options dialogs, on the Header Options dialog's box. */
.sydney-coming-soon-dialog .sydney-coming-soon-dialog-field {
  display: flex;
  flex-direction: column;
  gap: var(--sydney-dashboard-space-1);
  margin: 0;
  color: var(--sydney-dashboard-gray-700);
}
.sydney-coming-soon-dialog input[type="text"],
.sydney-coming-soon-dialog select,
.sydney-coming-soon-dialog textarea {
  width: 100%;
  max-width: none;
}
.sydney-coming-soon-dialog .sydney-coming-soon-link-new {
  display: flex;
  gap: var(--sydney-dashboard-space-2);
}