.__json-pretty__{line-height:1.3;color:#66d9ef;background:#272822;overflow:auto;}.__json-pretty__ .__json-key__{color:#f92672}.__json-pretty__ .__json-value__{color:#a6e22e}.__json-pretty__ .__json-string__{color:#fd971f}.__json-pretty__ .__json-boolean__{color:#ac81fe}.__json-pretty-error__{line-height:1.3;color:#66d9ef;background:#272822;overflow:auto}

.__json-pretty__ {
    font-size: 0.85rem;
}

.__json-pretty__ .__json-key__ {
    color: purple;
}

.__json-pretty__ .__json-string__ {
    color: red;
}

.__json-pretty__ .__json-value__ {
    color: blue;
}
/* ----------------------------------------------
 * Generated by Animista on 2020-6-24 13:11:32
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */
/**
 * ----------------------------------------
 * animation shake-horizontal
 * ----------------------------------------
 */

.shakehorizontal {
  -webkit-animation: shakehorizontal 0.8s
    cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
  animation: shakehorizontal 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
}

@-webkit-keyframes shakehorizontal {
  0%,
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }
  20%,
  40%,
  60% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }
  80% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  90% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
  }
}
@keyframes shakehorizontal {
  0%,
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }
  20%,
  40%,
  60% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }
  80% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  90% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
  }
}

/**
 * ----------------------------------------
 * animation shake-vertical
 * ----------------------------------------
 */

.shakevertical {
  -webkit-animation: shakevertical 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955)
    both;
  animation: shakevertical 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
}

@-webkit-keyframes shakevertical {
  0%,
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  20%,
  40%,
  60% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  80% {
    -webkit-transform: translateY(6.4px);
    transform: translateY(6.4px);
  }
  90% {
    -webkit-transform: translateY(-6.4px);
    transform: translateY(-6.4px);
  }
}
@keyframes shakevertical {
  0%,
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  20%,
  40%,
  60% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  80% {
    -webkit-transform: translateY(6.4px);
    transform: translateY(6.4px);
  }
  90% {
    -webkit-transform: translateY(-6.4px);
    transform: translateY(-6.4px);
  }
}

/**
 * ----------------------------------------
 * animation rotate-center
 * ----------------------------------------
 */

.rotatecenter {
  -webkit-animation: rotatecenter 1s ease-in-out both;
  animation: rotatecenter 1s ease-in-out both;
}

@-webkit-keyframes rotatecenter {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotatecenter {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/**
 * ----------------------------------------
 * animation fade-in
 * ----------------------------------------
 */

.fadein {
  -webkit-animation: fadein 1.2s cubic-bezier(0.39, 0.575, 0.565, 1) both;
  animation: fadein 1.2s cubic-bezier(0.39, 0.575, 0.565, 1) both;
}

@-webkit-keyframes fadein {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadein {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/**
 * ----------------------------------------
 * animation blink-2
 * ----------------------------------------
 */

.blink {
  -webkit-animation: blink 0.9s both;
  animation: blink 0.9s both;
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}

/**
 * ----------------------------------------
 * padding for animation rotate-center
 * ----------------------------------------
 */

.rotatecenterpadding {
  padding-top: 7%;
  padding-bottom: 40%;
}

.wh-admin-dashboard-top-cards .Polaris-Grid-Cell {
    >div {
        height: 100%;
    }
}

.wh-admin-dashboard-top-cards .Polaris-LegacyCard {
    border-top: rgb(90, 77, 165) solid 4px;
    border-radius: 0px;
    height: 100%;
    display: flex;
    flex-direction: column;
    .Polaris-LegacyCard__Section {
        &:nth-child(2) {
            flex: 1;
        }
    }
}

.wh-admin-dashboard-email-rates .Polaris-Icon__Svg {
    fill: rgb(90, 77, 165);
}

.wh-admin-product-button-type-selection .Polaris-RadioButton {
    top: 10px;
}


.wh-kalviyo-events-list .Polaris-LegacyCard__SectionHeader,
.wh-gtag-events-list .Polaris-LegacyCard__SectionHeader {
    padding-bottom: 0px;
}

.wh-kalviyo-events-list .Polaris-LegacyCard__SectionHeader .Polaris-ButtonGroup,
.wh-gtag-events-list .Polaris-LegacyCard__SectionHeader .Polaris-ButtonGroup {
    margin-top: -16px;
}
.button_REV {
  background-color: rgba(0, 255, 0, 1);
  margin-left: 0;
  opacity: 0.9;
  color: #fff;
  margin: 0;
  border: none;
  font: inherit;
  line-height: normal;
  height: 40px;
  display: block;
  color: #fff;
  padding: 0 20px;
  text-transform: uppercase;
  font-size: 14px;
  text-align: center;
  overflow: hidden;
  outline: none;
  position: relative;
  cursor: pointer;
}
.plain_btn_rev {
  margin-left: 0;
  color: rgba(0, 255, 0, 1);
  border: none !important;
  background: none;
  margin: 0;
  font: inherit;
  line-height: normal;
  height: 40px;
  display: block;
  padding: 0 20px;
  text-transform: uppercase;
  font-size: 14px;
  text-align: center;
  overflow: hidden;
  outline: none;
  position: relative;
  cursor: pointer;
}

.MuiRating-sizeLarge {
  font-size: 2.5rem !important;
}

.rev-resource-list
  .Polaris-LegacyStack--distributionFillEvenly
  > .Polaris-LegacyStack__Item {
  width: 20% !important;
  min-width: 20% !important;
  /* margin-left: 0; */
  overflow-wrap: break-word;
  white-space: normal;
  /* margin: 0 10px; */
}

.rev-resource-list.activities-list
  .Polaris-LegacyStack--distributionFillEvenly
  > .Polaris-LegacyStack__Item:nth-child(4) {
  width: 14% !important;
  min-width: 14% !important;
}
.rev-resource-list.activities-list
  .Polaris-LegacyStack--distributionFillEvenly
  > .Polaris-LegacyStack__Item:nth-child(5) {
  width: 5% !important;
  min-width: 5% !important;
}

/* Customers List */
.rev-resource-list.customers-list
  .Polaris-LegacyStack--distributionFillEvenly
  > .Polaris-LegacyStack__Item:nth-child(1) {
  width: 24% !important;
  min-width: 24% !important;
}
.rev-resource-list.customers-list
  .Polaris-LegacyStack--distributionFillEvenly
  > .Polaris-LegacyStack__Item:nth-child(2) {
  width: 16% !important;
  min-width: 16% !important;
}
.rev-resource-list.customers-list
  .Polaris-LegacyStack--distributionFillEvenly
  > .Polaris-LegacyStack__Item:nth-child(4) {
  width: 14% !important;
  min-width: 14% !important;
}
.rev-resource-list.customers-list
  .Polaris-LegacyStack--distributionFillEvenly
  > .Polaris-LegacyStack__Item:nth-child(5) {
  width: 5% !important;
  min-width: 5% !important;
}

/* Products */
.rev-resource-list.products-list
  .Polaris-LegacyStack--distributionFillEvenly
  > .Polaris-LegacyStack__Item:nth-child(1) {
  width: 30% !important;
  min-width: 30% !important;
}
.rev-resource-list.customers-list
  .Polaris-LegacyStack--distributionFillEvenly
  > .Polaris-LegacyStack__Item:nth-child(2) {
  width: 10% !important;
  min-width: 10% !important;
}
.rev-resource-list.customers-list
  .Polaris-LegacyStack--distributionFillEvenly
  > .Polaris-LegacyStack__Item:nth-child(4) {
  width: 12% !important;
  min-width: 12% !important;
}
.rev-resource-list.customers-list
  .Polaris-LegacyStack--distributionFillEvenly
  > .Polaris-LegacyStack__Item:nth-child(5) {
  width: 5% !important;
  min-width: 5% !important;
}

/* ============================================================
   Orders (Attributed Orders) — Polaris-token design system
   All surfaces/text/borders use Polaris CSS custom properties so
   the page renders natively in light AND dark Shopify admin.
   ============================================================ */

/* ---- Shared 5-column grid (header + rows) ---- */
.wlh-orders-grid {
  display: grid;
  grid-template-columns:
    minmax(120px, 1.1fr) minmax(120px, 1fr) minmax(180px, 1.6fr)
    minmax(100px, 0.9fr) minmax(130px, 1fr);
  column-gap: 16px;
  align-items: center;
}

/* ---- Sticky table header ---- */
.wlh-orders-header {
  position: sticky;
  top: 0;
  z-index: 20;
  padding: 10px 20px;
  background: var(--p-surface, #ffffff);
  border-bottom: 1px solid var(--p-border-subdued, #e3e5e8);
}
.wlh-orders-header-cell {
  font-size: 11px;
  font-weight: 600;
  color: var(--p-text-subdued, #6d7175);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  white-space: nowrap;
}
.wlh-orders-header-cell.is-numeric {
  text-align: right;
}

/* ---- Rows ---- */
.wlh-order-row {
  padding: 12px 20px;
  border-bottom: 1px solid var(--p-border-subdued, #e3e5e8);
  transition: background 0.12s ease;
}
.wlh-order-row:hover {
  background: var(--p-surface-hovered, #f9fafb);
}
.wlh-order-row .wlh-order-id {
  font-weight: 600;
  color: var(--p-text, #202223);
}
.wlh-order-row .wlh-order-name {
  font-size: 11px;
  color: var(--p-text-subdued, #8c9196);
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wlh-order-date-primary {
  font-size: 13px;
  color: var(--p-text, #202223);
  white-space: nowrap;
}
.wlh-order-date-sub {
  font-size: 11px;
  color: var(--p-text-subdued, #8c9196);
  margin-top: 1px;
}
.wlh-order-value {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  text-align: right;
  color: var(--p-text, #202223);
  white-space: nowrap;
}

/* ---- Customer cell: monogram avatar + two-line identity ---- */
.wlh-order-customer {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.wlh-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #ffffff;
}
.wlh-order-customer-main {
  font-size: 13px;
  color: var(--p-text, #202223);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wlh-order-customer-sub {
  font-size: 11px;
  color: var(--p-text-subdued, #8c9196);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---- ResourceList shell: neutralize item chrome around our rows ---- */
.rev-resource-list.orders-list ul.Polaris-ResourceList__List,
.rev-resource-list.orders-list .Polaris-ResourceList__ItemWrapper {
  background: transparent;
}
.rev-resource-list.orders-list .Polaris-ResourceList__Item {
  background: var(--p-surface, #ffffff);
  border-radius: 0;
  box-shadow: none;
}
.rev-resource-list.orders-list .Polaris-ResourceList__ListItem {
  padding: 0;
  border-radius: 0;
}

/* ---- Empty state ---- */
.wlh-orders-empty {
  padding: 48px 20px;
  text-align: center;
}
.wlh-orders-empty-icon {
  width: 44px;
  height: 44px;
  margin: 0 auto 12px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--p-surface-neutral, #f1f1f2);
  color: var(--p-icon, #5c5f62);
}
.wlh-orders-empty-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--p-text, #202223);
  margin-bottom: 4px;
}
.wlh-orders-empty-hint {
  font-size: 12.5px;
  color: var(--p-text-subdued, #8c9196);
}

/* ---- KPI cards ---- */
.wlh-orders-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
@media only screen and (max-width: 900px) {
  .wlh-orders-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.wlh-orders-kpi-card {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  padding: 18px 20px 16px;
  background: var(--p-surface, #ffffff);
  border: 1px solid var(--p-border-subdued, #e3e5e8);
  box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.03),
    0 6px 18px rgba(0, 0, 0, 0.025);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}
.wlh-orders-kpi-card:hover {
  transform: translateY(-2px);
  box-shadow:
    0 4px 10px rgba(0, 0, 0, 0.04),
    0 16px 32px rgba(0, 0, 0, 0.06);
}
.wlh-kpi-glow {
  position: absolute;
  top: -34px;
  right: -34px;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  opacity: 0.1;
  filter: blur(28px);
  pointer-events: none;
}
.wlh-kpi-accent {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  border-radius: 14px 0 0 14px;
  opacity: 0.85;
}
.wlh-kpi-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.wlh-kpi-icon-wrap {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.wlh-kpi-label {
  font-size: 10.5px;
  font-weight: 700;
  color: var(--p-text-subdued, #6d7175);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.wlh-kpi-value {
  font-size: 26px;
  font-weight: 800;
  color: var(--p-text, #1a1a1a);
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  word-break: break-word;
}
.wlh-kpi-sub {
  font-size: 12px;
  color: var(--p-text-subdued, #8c9196);
  margin-top: 5px;
}

/* ---- Source breakdown ---- */
.wlh-source-breakdown {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.wlh-source-header {
  display: flex;
  align-items: center;
  gap: 12px;
}
.wlh-source-header-lead {
  width: 181px; /* dot (9) + gap (12) + label (160) — aligns with data rows */
  flex-shrink: 0;
}
.wlh-source-header-fill {
  flex: 1;
}
.wlh-source-colhead {
  font-size: 10.5px;
  font-weight: 700;
  color: var(--p-text-subdued, #6d7175);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.wlh-source-total {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  color: var(--p-text-subdued, #6d7175);
  background: var(--p-surface-neutral, #f1f1f1);
  border-radius: 999px;
  padding: 3px 10px;
  white-space: nowrap;
}
.wlh-source-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 5px 8px;
  margin: 0 -8px;
  border-radius: 10px;
  transition: background 0.15s ease;
}
.wlh-source-row:hover {
  background: var(--p-surface-neutral-subdued, #f6f6f7);
}
.wlh-source-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  flex-shrink: 0;
  transition: transform 0.15s ease;
}
.wlh-source-row:hover .wlh-source-dot {
  transform: scale(1.25);
}
.wlh-source-label {
  width: 160px;
  font-size: 13px;
  color: var(--p-text, #202223);
  font-weight: 500;
  white-space: nowrap;
}
.wlh-source-bar-track {
  flex: 1;
  height: 10px;
  background: var(--p-surface-neutral, #eef0f3);
  border-radius: 999px;
  overflow: hidden;
}
.wlh-source-bar-fill {
  height: 100%;
  border-radius: 999px;
  transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  transform-origin: left;
  animation: wlh-bar-in 0.6s cubic-bezier(0.4, 0, 0.2, 1) backwards;
}
.wlh-source-row:hover .wlh-source-bar-fill {
  filter: brightness(1.08);
}
@keyframes wlh-bar-in {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}
.wlh-source-count {
  font-size: 13px;
  color: var(--p-text, #202223);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  width: 48px;
  text-align: right;
}
.wlh-source-pct {
  font-size: 12px;
  color: var(--p-text-subdued, #8c9196);
  width: 40px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.wlh-source-revenue {
  font-size: 12px;
  color: var(--p-text-subdued, #8c9196);
  width: 86px;
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* ---- Dashboard ROI orders hero card ---- */
.wlh-roi-hero {
  border-radius: 12px;
}
.wlh-roi-hero .wlh-roi-revenue {
  font-size: 30px;
  font-weight: 800;
  color: var(--p-text, #1a1a1a);
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.wlh-roi-hero .wlh-roi-count {
  font-size: 13px;
  color: var(--p-text-subdued, #6d7175);
  margin-top: 2px;
}
.wlh-roi-hero .wlh-roi-conversion {
  font-size: 12px;
  color: var(--p-text-subdued, #6d7175);
  margin-top: 1px;
}
.wlh-roi-hero .wlh-roi-chip {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  color: #ffffff;
  background: #5c8d56;
  border-radius: 999px;
  padding: 2px 10px;
  margin-top: 8px;
  letter-spacing: 0.03em;
}

.wlh-orders-pager {
  padding-block: 32px;
}

/* ============================================================
   Responsive — /orders page. All changes behind media queries;
   desktop layouts are untouched.
   ============================================================ */

/* ---- ≤768px: stack each order row into 3 lines ----
   grid-template-areas reflow: order+value / customer+badge / date.
   Header and data rows share the same child order (verified against
   renderItem in pages/orders.js), so :nth-child assigns both. */
@media only screen and (max-width: 768px) {
  .wlh-orders-grid {
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "order value"
      "customer customer "
      "date badge";
    column-gap: 8px;
    row-gap: 4px;
  }
  .wlh-orders-grid > :nth-child(1) {
    grid-area: order;
  }
  .wlh-orders-grid > :nth-child(2) {
    grid-area: date;
  }
  .wlh-orders-grid > :nth-child(3) {
    grid-area: customer;
  }
  .wlh-orders-grid > :nth-child(4) {
    grid-area: value;
  }
  .wlh-orders-grid > :nth-child(5) {
    grid-area: badge;
    justify-self: end;
  }
  /* Rows are self-describing when stacked — the column header only
     helps the 5-column layout. */
  .wlh-orders-header {
    display: none;
  }
  .wlh-order-row {
    padding: 12px 14px;
  }

  /* Breakdown: label stops hogging a fixed 160px so the bar keeps room. */
  .wlh-source-label {
    width: auto;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .wlh-source-header {
    display: none;
  }

  .wlh-orders-pager {
    padding-block: 20px;
  }
}

/* ---- ≤480px: single-column KPIs; hide breakdown revenue (count + % remain) ---- */
@media only screen and (max-width: 480px) {
  .wlh-orders-kpi-grid {
    grid-template-columns: 1fr;
  }
  .wlh-source-revenue {
    display: none;
  }
}

.ql-editor {
  background-color: #fff;
}