.ppc-configurator {
  --ppc-green:#536f62;
  --ppc-green-dark:#40594f;
  --ppc-ink:#2f3740;
  --ppc-muted:#68716f;
  --ppc-line:#d9dfdc;
  --ppc-card:#f6f7f7;
  width:100%;
  margin:24px 0 0;
  color:var(--ppc-ink);
}

.ppc-configurator,
.ppc-configurator * {
  box-sizing:border-box;
}

.ppc-card {
  width:100%;
  padding:20px;
  border:0;
  border-radius:14px;
  background:var(--ppc-card);
}

.ppc-card-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}

.ppc-card h2 {
  margin:0;
  font-size:21px;
  line-height:1.25;
}

.ppc-kicker {
  margin:0 0 3px;
  color:var(--ppc-muted);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.ppc-step-count {
  flex:0 0 auto;
  color:var(--ppc-muted);
  font-size:13px;
}

.ppc-info-links {
  display:flex;
  flex-wrap:wrap;
  gap:8px 12px;
  margin:14px 0 24px;
  padding:12px 0;
  border-top:1px solid var(--ppc-line);
  border-bottom:1px solid var(--ppc-line);
  font-size:13px;
}

.ppc-info-links a {
  color:var(--ppc-green-dark);
  text-decoration:none;
  font-weight:700;
}

.ppc-info-links span {
  color:#adb5b1;
}

.ppc-field-label {
  display:block;
  margin:0 0 10px;
  font-size:14px;
  font-weight:700;
}

.ppc-pet-count,
.ppc-options-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.ppc-pet-count {
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.ppc-options-grid:has(.ppc-option:nth-child(1):last-child) {
  grid-template-columns:1fr;
}

.ppc-options-grid:has(.ppc-option:nth-child(3):last-child),
.ppc-options-grid:has(.ppc-option:nth-child(5):last-child) {
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.ppc-pet-count button,
.ppc-option {
  min-height:54px;
  padding:10px 12px;
  border:1px solid #bcc6c1;
  border-radius:9px;
  background:#fff;
  color:var(--ppc-ink);
  cursor:pointer;
  font:inherit;
  font-weight:700;
}

.ppc-pet-count button.is-selected,
.ppc-option.is-selected {
  border-color:#e7aa45;
  background:#fff8eb;
  box-shadow:inset 0 0 0 1px #e7aa45;
}

.ppc-frame-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.ppc-frame-option {
  position:relative;
  min-width:0;
  padding:0 !important;
  overflow:hidden;
  border:1px solid #bcc6c1 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--ppc-ink) !important;
  cursor:pointer;
  text-align:left;
  transition:border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.ppc-frame-option,
.ppc-frame-option:hover,
.ppc-frame-option:focus,
.ppc-frame-option:focus-visible,
.ppc-frame-option.is-selected,
.ppc-frame-option.is-selected:hover {
  color:var(--ppc-ink) !important;
}

.ppc-frame-option:hover {
  transform:translateY(-1px);
  border-color:var(--ppc-green) !important;
  box-shadow:0 6px 18px rgba(47,55,64,.08) !important;
}

.ppc-frame-option.is-selected {
  border:2px solid var(--ppc-green) !important;
  background:#fff !important;
  box-shadow:0 0 0 3px rgba(83,111,98,.12) !important;
}

.ppc-frame-option.is-selected::after {
  content:"✓";
  position:absolute;
  top:10px;
  right:10px;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border-radius:999px;
  background:var(--ppc-green);
  color:#fff;
  font-size:15px;
  font-weight:900;
  line-height:1;
}

.ppc-frame-media {
  display:flex;
  align-items:center;
  justify-content:center;
  aspect-ratio:1/1;
  overflow:hidden;
  background:#f4f4f1;
}

.ppc-frame-media img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.ppc-frame-print-only {
  display:flex;
  align-items:center;
  justify-content:center;
  width:76%;
  aspect-ratio:1/1;
  border:2px solid #cad1ce;
  border-radius:10px;
  background:#fff;
  color:var(--ppc-ink) !important;
  font-size:16px;
  font-weight:800;
  text-align:center;
}

.ppc-frame-label {
  display:block;
  min-height:54px;
  padding:12px 10px;
  background:#fff;
  color:var(--ppc-ink) !important;
  font-size:13px;
  line-height:1.3;
  font-weight:800;
  text-align:center;
}

.ppc-frame-option:hover .ppc-frame-label,
.ppc-frame-option:focus-visible .ppc-frame-label {
  background:#f7faf8;
  color:var(--ppc-ink) !important;
}

.ppc-frame-option.is-selected .ppc-frame-label,
.ppc-frame-option.is-selected:hover .ppc-frame-label {
  background:#edf4f0;
  color:var(--ppc-green-dark) !important;
}

.ppc-frame-option.is-selected .ppc-frame-media {
  background:#f4f8f6;
}

.ppc-footer {
  margin-top:24px;
  padding-top:22px;
  border-top:1px solid var(--ppc-line);
}

.ppc-price {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  margin-bottom:16px;
  text-align:center;
}

.ppc-price-line {
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}

.ppc-price-line > span {
  font-size:14px;
}

.ppc-price strong {
  font-size:22px;
}

.ppc-price small {
  color:var(--ppc-muted);
  font-size:12px;
  line-height:1.45;
}

.ppc-footer-actions {
  display:grid;
  grid-template-columns:56px minmax(0,1fr);
  gap:12px;
}

.ppc-footer-actions.is-single {
  grid-template-columns:1fr;
}

.ppc-back,
.ppc-next,
.ppc-secondary {
  min-height:56px;
  border-radius:5px;
  font:inherit;
  font-weight:800;
  cursor:pointer;
}

.ppc-back {
  border:1px solid var(--ppc-line);
  background:#fff;
  color:var(--ppc-green-dark);
  font-size:23px;
}

.ppc-next {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 20px;
  border:0;
  background:var(--ppc-green);
  color:#fff !important;
  text-decoration:none !important;
}

.ppc-next:hover {
  background:var(--ppc-green-dark);
}

.ppc-next:disabled,
.ppc-next.is-disabled {
  opacity:.45;
  cursor:not-allowed;
}

.ppc-upload-note {
  margin:-8px 0 18px;
  color:var(--ppc-muted);
  font-size:13px;
  line-height:1.5;
}

.ppc-pets {
  display:grid;
  gap:14px;
}

.ppc-pet-section {
  padding:14px;
  border:1px solid var(--ppc-line);
  border-radius:10px;
  background:#fff;
}

.ppc-pet-section-title {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:14px;
  font-weight:800;
}

.ppc-pet-section-title small {
  color:var(--ppc-muted);
  font-weight:600;
}

.ppc-name-input {
  width:100%;
  min-height:48px;
  margin:0 0 14px;
  padding:10px 13px;
  border:1px solid #cbd2cf;
  border-radius:6px;
  background:#fff !important;
  color:var(--ppc-ink) !important;
  font:inherit;
}

.ppc-name-input::placeholder {
  color:#7b8480 !important;
  opacity:1;
}

.ppc-photo-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}

.ppc-upload-slot,
.ppc-photo-preview {
  position:relative;
  aspect-ratio:1/1;
  min-width:0;
  overflow:hidden;
  border:1px dashed #9dafaa;
  border-radius:8px;
  background:#fafcfb;
}

.ppc-upload-slot {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  padding:8px;
  color:var(--ppc-green-dark);
  text-align:center;
  cursor:pointer;
}

.ppc-upload-slot input {
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
}

.ppc-upload-slot strong {
  font-size:12px;
}

.ppc-upload-slot small {
  color:var(--ppc-muted);
  font-size:10px;
}

.ppc-upload-icon {
  font-size:20px;
}

.ppc-photo-preview img {
  width:100%;
  height:100%;
  object-fit:cover;
}

.ppc-photo-preview button {
  position:absolute;
  top:5px;
  right:5px;
  width:28px;
  height:28px;
  padding:0;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.92);
  color:#7d2525;
  font-size:20px;
  line-height:1;
  cursor:pointer;
}

.ppc-review {
  overflow:hidden;
  border:1px solid var(--ppc-line);
  border-radius:9px;
  background:#fff;
}

.ppc-review > div {
  display:grid;
  grid-template-columns:130px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:13px 14px;
}

.ppc-review > div + div {
  border-top:1px solid var(--ppc-line);
}

.ppc-review span {
  color:var(--ppc-muted);
  font-size:13px;
}

.ppc-review strong {
  font-size:14px;
}

.ppc-review button {
  border:0;
  background:transparent;
  color:var(--ppc-green-dark);
  text-decoration:underline;
  cursor:pointer;
}

.ppc-proof-note {
  margin-top:14px;
  padding:14px;
  border:1px solid #e3ddd1;
  border-radius:9px;
  background:#fbf8f2;
}

.ppc-proof-note strong {
  display:flex;
  justify-content:space-between;
  gap:12px;
}

.ppc-proof-note p {
  margin:8px 0 0;
  color:var(--ppc-muted);
  font-size:13px;
  line-height:1.5;
}

.ppc-progress-row {
  display:flex;
  justify-content:space-between;
  gap:14px;
  margin:20px 0 8px;
}

.ppc-progress {
  height:12px;
  overflow:hidden;
  border-radius:999px;
  background:#dfe5e2;
}

.ppc-progress span {
  display:block;
  height:100%;
  background:var(--ppc-green);
  transition:width .2s ease;
}

.ppc-success-check {
  display:flex;
  align-items:center;
  justify-content:center;
  width:56px;
  height:56px;
  margin:20px auto 12px;
  border-radius:50%;
  background:var(--ppc-green);
  color:#fff;
  font-size:28px;
}

.ppc-success-card > p {
  text-align:center;
}

.ppc-success-summary {
  margin-top:18px;
  padding-top:18px;
  border-top:1px solid var(--ppc-line);
}

.ppc-price-success {
  margin-bottom:0;
}


.ppc-success-actions {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:20px;
}

.ppc-secondary {
  border:1px solid var(--ppc-line);
  background:#fff;
  color:var(--ppc-green-dark);
}

@media (max-width:640px) {
  .ppc-card {
    padding:16px;
    border-radius:12px;
  }

  .ppc-price-line {
    gap:6px;
  }

  .ppc-pet-count {
    grid-template-columns:repeat(4,minmax(0,1fr));
  }

  .ppc-options-grid {
    grid-template-columns:1fr;
  }

  .ppc-frame-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .ppc-frame-label {
    min-height:50px;
    padding:10px 8px;
    font-size:12px;
  }

  .ppc-info-links span {
    display:none;
  }

  .ppc-review > div {
    grid-template-columns:1fr auto;
  }

  .ppc-review span {
    grid-column:1/-1;
  }

  .ppc-success-actions {
    grid-template-columns:1fr;
  }
}


.ppc-field-error {
  border-color:#c73a32 !important;
  box-shadow:0 0 0 1px #c73a32 !important;
}

.ppc-photo-error {
  padding:4px;
  border:2px solid #efb7b3;
  border-radius:12px;
}

.ppc-validation-message {
  margin:-6px 0 12px;
  color:#b42318;
  font-size:13px;
  line-height:1.35;
  font-weight:700;
}

.ppc-photo-error + .ppc-validation-message {
  margin:6px 0 10px;
}

.ppc-photo-help {
  margin:10px 0 0;
  color:var(--ppc-muted);
  font-size:12px;
  line-height:1.45;
}

.ppc-proof-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:18px;
}

.ppc-proof-row > div {
  min-width:0;
}

.ppc-proof-toggle {
  position:relative;
  flex:0 0 auto;
  width:48px;
  height:28px;
  padding:0;
  border:0;
  border-radius:999px;
  background:#c9cfcc;
  cursor:pointer;
  transition:background-color .16s ease;
}

.ppc-proof-toggle span {
  position:absolute;
  top:3px;
  left:3px;
  width:22px;
  height:22px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 1px 4px rgba(0,0,0,.18);
  transition:transform .16s ease;
}

.ppc-proof-toggle.is-on {
  background:var(--ppc-green);
}

.ppc-proof-toggle.is-on span {
  transform:translateX(20px);
}

.ppc-options-grid:has(.ppc-option:only-child) {
  grid-template-columns:1fr;
}

@media (max-width:640px) {
  .ppc-proof-row {
    align-items:flex-start;
    gap:12px;
  }
}


/* v0.2.0 dynamic matrix refinements */
.ppc-pet-count-1 { grid-template-columns:1fr; }
.ppc-pet-count-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.ppc-pet-count-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.ppc-pet-count-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }

@media (max-width:640px) {
  .ppc-pet-count-3,
  .ppc-pet-count-4 {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}




/* v0.2.6 compact frame swatches */
.ppc-frame-grid-compact {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.ppc-frame-option-compact {
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  min-width:0;
  min-height:156px;
  padding:18px 12px 16px !important;
  border:1px solid var(--ppc-line) !important;
  border-radius:16px !important;
  background:#fff !important;
  color:var(--ppc-ink) !important;
  box-shadow:none !important;
  cursor:pointer;
  transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease, background-color .15s ease;
}

.ppc-frame-option-compact:hover,
.ppc-frame-option-compact:focus-visible {
  border-color:#aab5b0 !important;
  box-shadow:0 8px 22px rgba(47,55,64,.06) !important;
  transform:translateY(-1px);
  color:var(--ppc-ink) !important;
}

.ppc-frame-option-compact.is-selected {
  border:2px solid var(--ppc-green) !important;
  box-shadow:0 0 0 3px rgba(83,111,98,.10) !important;
  background:#fcfdfd !important;
  color:var(--ppc-ink) !important;
}

.ppc-frame-option-compact.is-selected::after {
  content:"✓";
  position:absolute;
  top:10px;
  right:10px;
  z-index:2;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:var(--ppc-green);
  color:#fff;
  font-size:16px;
  line-height:1;
  font-weight:800;
}

.ppc-frame-option-compact .ppc-frame-swatch {
  width:96px;
  height:96px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:12px;
  background:#fff;
  flex:0 0 auto;
}

.ppc-frame-option-compact .ppc-frame-swatch img {
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
}

.ppc-frame-option-compact .ppc-frame-swatch.is-print-only {
  border:1px solid #ccd4d0;
  background:#fff;
}

.ppc-frame-option-compact .ppc-frame-swatch.is-print-only span {
  display:block;
  padding:0 8px;
  color:var(--ppc-ink);
  font-size:15px;
  line-height:1.15;
  font-weight:700;
  text-align:center;
}

.ppc-frame-option-compact .ppc-frame-label {
  display:block;
  width:100%;
  padding:0 !important;
  margin-top:2px;
  background:transparent !important;
  color:var(--ppc-ink) !important;
  font-size:14px;
  line-height:1.3;
  font-weight:800;
  text-align:center;
}

.ppc-frame-option-compact:hover .ppc-frame-label,
.ppc-frame-option-compact:focus-visible .ppc-frame-label,
.ppc-frame-option-compact.is-selected .ppc-frame-label {
  color:var(--ppc-ink) !important;
  background:transparent !important;
}

@media (max-width:640px) {
  .ppc-frame-grid-compact {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
  }

  .ppc-frame-option-compact {
    min-height:142px;
    padding:14px 8px 14px !important;
    border-radius:14px !important;
  }

  .ppc-frame-option-compact .ppc-frame-swatch {
    width:74px;
    height:74px;
    border-radius:10px;
  }

  .ppc-frame-option-compact .ppc-frame-label {
    font-size:12px;
  }

  .ppc-frame-option-compact.is-selected::after {
    top:8px;
    right:8px;
    width:24px;
    height:24px;
    font-size:14px;
  }
}


/* v0.2.7 — tighter editorial frame selector */
#ppc-configurator .ppc-frame-grid.ppc-frame-grid-compact {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
}

#ppc-configurator button.ppc-frame-option.ppc-frame-option-compact {
  appearance:none !important;
  -webkit-appearance:none !important;
  position:relative !important;
  display:grid !important;
  grid-template-rows:92px auto !important;
  align-items:center !important;
  justify-items:center !important;
  gap:8px !important;
  width:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  height:auto !important;
  margin:0 !important;
  padding:12px 10px 13px !important;
  overflow:visible !important;
  border:1px solid #d8dedb !important;
  border-radius:14px !important;
  background:#fff !important;
  box-shadow:none !important;
  color:var(--ppc-ink) !important;
  text-align:center !important;
  line-height:1.2 !important;
  transform:none !important;
}

#ppc-configurator button.ppc-frame-option.ppc-frame-option-compact:hover,
#ppc-configurator button.ppc-frame-option.ppc-frame-option-compact:focus-visible {
  border-color:#aeb9b4 !important;
  background:#fff !important;
  box-shadow:0 5px 14px rgba(47,55,64,.055) !important;
  transform:translateY(-1px) !important;
}

#ppc-configurator button.ppc-frame-option.ppc-frame-option-compact.is-selected {
  border:2px solid var(--ppc-green) !important;
  background:#fbfdfc !important;
  box-shadow:0 0 0 3px rgba(83,111,98,.10) !important;
}

#ppc-configurator button.ppc-frame-option.ppc-frame-option-compact.is-selected::after {
  content:"✓" !important;
  position:absolute !important;
  top:8px !important;
  right:8px !important;
  z-index:5 !important;
  width:25px !important;
  height:25px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:999px !important;
  background:var(--ppc-green) !important;
  color:#fff !important;
  font-size:14px !important;
  font-weight:800 !important;
  line-height:1 !important;
}

#ppc-configurator .ppc-frame-option-compact .ppc-frame-swatch {
  width:92px !important;
  height:92px !important;
  min-width:92px !important;
  min-height:92px !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  border:0 !important;
  border-radius:10px !important;
  background:transparent !important;
}

#ppc-configurator .ppc-frame-option-compact .ppc-frame-swatch img {
  display:block !important;
  width:92px !important;
  height:92px !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  object-fit:contain !important;
  object-position:center !important;
}

#ppc-configurator .ppc-frame-option-compact .ppc-frame-swatch.is-print-only {
  width:78px !important;
  height:78px !important;
  min-width:78px !important;
  min-height:78px !important;
  align-self:center !important;
  border:1px solid #d4dbd7 !important;
  border-radius:10px !important;
  background:#fff !important;
}

#ppc-configurator .ppc-frame-option-compact .ppc-frame-swatch.is-print-only span {
  display:block !important;
  padding:0 8px !important;
  color:var(--ppc-ink) !important;
  font-size:15px !important;
  line-height:1.1 !important;
  font-weight:500 !important;
  text-align:center !important;
}

#ppc-configurator .ppc-frame-option-compact .ppc-frame-label {
  display:block !important;
  width:100% !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  color:var(--ppc-ink) !important;
  font-size:13px !important;
  line-height:1.25 !important;
  font-weight:800 !important;
  text-align:center !important;
}

#ppc-configurator .ppc-frame-option-compact.is-selected .ppc-frame-label,
#ppc-configurator .ppc-frame-option-compact:hover .ppc-frame-label,
#ppc-configurator .ppc-frame-option-compact:focus-visible .ppc-frame-label {
  background:transparent !important;
  color:var(--ppc-ink) !important;
}

@media (max-width:640px) {
  #ppc-configurator .ppc-frame-grid.ppc-frame-grid-compact {
    gap:9px !important;
  }

  #ppc-configurator button.ppc-frame-option.ppc-frame-option-compact {
    grid-template-rows:72px auto !important;
    gap:7px !important;
    padding:10px 5px 11px !important;
    border-radius:12px !important;
  }

  #ppc-configurator .ppc-frame-option-compact .ppc-frame-swatch {
    width:72px !important;
    height:72px !important;
    min-width:72px !important;
    min-height:72px !important;
  }

  #ppc-configurator .ppc-frame-option-compact .ppc-frame-swatch img {
    width:72px !important;
    height:72px !important;
  }

  #ppc-configurator .ppc-frame-option-compact .ppc-frame-swatch.is-print-only {
    width:62px !important;
    height:62px !important;
    min-width:62px !important;
    min-height:62px !important;
  }

  #ppc-configurator .ppc-frame-option-compact .ppc-frame-label {
    font-size:11px !important;
  }
}


/* =========================================================
   v0.2.8 — desired frame-card layout
   Matches the earlier large frame preview cards:
   3 columns, image area + separate bottom label strip.
   ========================================================= */

#ppc-configurator .ppc-frame-grid-desired {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:14px !important;
  width:100% !important;
}

#ppc-configurator button.ppc-frame-card {
  appearance:none !important;
  -webkit-appearance:none !important;
  position:relative !important;
  display:grid !important;
  grid-template-rows:minmax(0,1fr) auto !important;
  width:100% !important;
  min-width:0 !important;
  height:210px !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  border:1px solid #cfd7d3 !important;
  border-radius:13px !important;
  background:#fff !important;
  box-shadow:none !important;
  color:var(--ppc-ink) !important;
  cursor:pointer !important;
  text-align:center !important;
  transform:none !important;
  transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease !important;
}

#ppc-configurator button.ppc-frame-card:hover,
#ppc-configurator button.ppc-frame-card:focus-visible {
  border-color:#9eaaa4 !important;
  box-shadow:0 5px 16px rgba(47,55,64,.06) !important;
  transform:translateY(-1px) !important;
  background:#fff !important;
  color:var(--ppc-ink) !important;
}

#ppc-configurator button.ppc-frame-card.is-selected {
  border:2px solid #eca82c !important;
  box-shadow:none !important;
  background:#fff !important;
}

#ppc-configurator button.ppc-frame-card.is-selected::after {
  display:none !important;
  content:none !important;
}

#ppc-configurator .ppc-frame-card-media {
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  padding:20px 16px 8px !important;
  overflow:hidden !important;
  background:#fff !important;
  border:0 !important;
  border-radius:0 !important;
}

#ppc-configurator .ppc-frame-card-media img {
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:180px !important;
  max-height:150px !important;
  margin:0 auto !important;
  object-fit:contain !important;
  object-position:center !important;
}

#ppc-configurator .ppc-frame-card-media.is-print-only {
  padding:18px !important;
}

#ppc-configurator .ppc-frame-print-box {
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:118px !important;
  height:118px !important;
  border:2px solid #cfd7d3 !important;
  border-radius:10px !important;
  background:#fff !important;
  color:var(--ppc-ink) !important;
  font-size:16px !important;
  font-weight:800 !important;
  line-height:1.15 !important;
  text-align:center !important;
}

#ppc-configurator .ppc-frame-card-label {
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-height:52px !important;
  padding:12px 10px !important;
  border-top:0 !important;
  background:#fff !important;
  color:var(--ppc-ink) !important;
  font-size:13px !important;
  line-height:1.25 !important;
  font-weight:800 !important;
  text-align:center !important;
}

#ppc-configurator button.ppc-frame-card.is-selected .ppc-frame-card-label {
  background:#fff8e9 !important;
  color:var(--ppc-ink) !important;
}

#ppc-configurator button.ppc-frame-card:hover .ppc-frame-card-label,
#ppc-configurator button.ppc-frame-card:focus-visible .ppc-frame-card-label {
  color:var(--ppc-ink) !important;
}

@media (max-width:640px) {
  #ppc-configurator .ppc-frame-grid-desired {
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  #ppc-configurator button.ppc-frame-card {
    height:172px !important;
    border-radius:11px !important;
  }

  #ppc-configurator .ppc-frame-card-media {
    padding:13px 7px 5px !important;
  }

  #ppc-configurator .ppc-frame-card-media img {
    max-width:110px !important;
    max-height:110px !important;
  }

  #ppc-configurator .ppc-frame-print-box {
    width:82px !important;
    height:82px !important;
    font-size:13px !important;
  }

  #ppc-configurator .ppc-frame-card-label {
    min-height:48px !important;
    padding:9px 4px !important;
    font-size:11px !important;
  }
}


/* v0.2.9 pet accordions + review refinements */
#ppc-configurator .ppc-pets.is-accordion {
  gap:10px;
}

#ppc-configurator .ppc-pets.is-accordion .ppc-pet-section {
  padding:0;
  overflow:hidden;
}

#ppc-configurator .ppc-pet-dropdown-head {
  width:100%;
  min-height:62px;
  display:grid;
  grid-template-columns:auto auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  border:0;
  background:#fff;
  color:var(--ppc-ink);
  text-align:left;
  cursor:pointer;
  font:inherit;
}

#ppc-configurator .ppc-pet-dropdown-head:hover,
#ppc-configurator .ppc-pet-dropdown-head:focus-visible {
  background:#fbfcfb;
  color:var(--ppc-ink);
}

#ppc-configurator .ppc-pet-dot {
  width:10px;
  height:10px;
  border-radius:50%;
  background:#c9d0cd;
}

#ppc-configurator .ppc-pet-dot.is-ready {
  background:#38845f;
}

#ppc-configurator .ppc-pet-status {
  min-width:0;
  overflow:hidden;
  color:var(--ppc-muted);
  font-size:12px;
  white-space:nowrap;
  text-overflow:ellipsis;
}

#ppc-configurator .ppc-pet-chevron {
  color:var(--ppc-ink);
  font-size:18px;
  line-height:1;
}

#ppc-configurator .ppc-pet-dropdown-body {
  padding:2px 16px 16px;
  border-top:1px solid var(--ppc-line);
}

#ppc-configurator .ppc-pet-dropdown-body[hidden] {
  display:none !important;
}

/* Slightly smaller Edit links on review. */
#ppc-configurator .ppc-review button {
  font-size:12px;
  line-height:1.2;
}

/* Combined pet-details review value can wrap cleanly. */
#ppc-configurator .ppc-review strong {
  min-width:0;
  line-height:1.45;
}

@media (max-width:640px) {
  #ppc-configurator .ppc-pet-dropdown-head {
    grid-template-columns:auto auto minmax(0,1fr) auto;
    padding:13px 12px;
  }

  #ppc-configurator .ppc-pet-dropdown-body {
    padding:2px 12px 14px;
  }
}


/* v0.2.16 unified upload/checkout state */
.ppc-upload-progress-card {
  margin-top:4px;
  padding:16px;
  border:1px solid var(--ppc-line);
  border-radius:12px;
  background:#fff;
}

.ppc-upload-progress-card .ppc-progress-row {
  margin:0 0 10px;
}

.ppc-upload-progress-card > p {
  margin:14px 0 0;
  color:var(--ppc-muted);
  font-size:13px;
  line-height:1.5;
  text-align:left;
}

.ppc-upload-progress-card.is-complete .ppc-progress span {
  width:100%;
}

.ppc-success-actions-disabled {
  opacity:.55;
  pointer-events:none;
}

.ppc-success-actions-disabled .ppc-secondary,
.ppc-success-actions-disabled .ppc-next {
  cursor:not-allowed;
}

/* =========================================
   SINGLE-PET DISCLOSURE
========================================= */

#ppc-configurator .ppc-single-pet-notice {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: 0 0 20px;
  padding: 13px 16px;
  border: 1px solid #ddd8cd;
  border-radius: 10px;
  background: #f2f0eb;
  color: var(--ppc-ink);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
}

#ppc-configurator .ppc-single-pet-notice__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 19px;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: #b4aa8e;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

/* =========================================
   CONFIGURATOR INFO LIGHTBOX
========================================= */

body.ppc-info-modal-open {
  overflow: hidden;
}

dialog.ppc-info-modal {
  width: min(920px, calc(100vw - 48px));
  max-width: 920px;
  height: min(82vh, 820px);
  max-height: 820px;
  margin: auto;
  padding: 0;
  border: 0;
  border-radius: 14px;
  background: #fff;
  color: #193b32;
  overflow: hidden;
  box-shadow: 0 24px 70px rgba(0,0,0,.22);
}

dialog.ppc-info-modal::backdrop {
  background: rgba(18, 24, 22, .58);
}

.ppc-info-modal__dialog {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 0;
  background: #fff;
}

.ppc-info-modal__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 0 auto;
  min-height: 58px;
  padding: 12px 14px 12px 22px;
  border-bottom: 1px solid #e3e7e5;
  color: var(--ppc-green-dark, #193b32);
  background: #fff;
}

.ppc-info-modal__bar strong {
  font-size: 16px;
  font-weight: 700;
}

.ppc-info-modal__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #193b32;
  font: 400 30px/1 Arial, sans-serif;
  cursor: pointer;
}

.ppc-info-modal__close:hover {
  background: #f3f5f4;
}

.ppc-info-modal__content {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 28px;
  background: #fff;
  -webkit-overflow-scrolling: touch;
}

.ppc-info-modal__content > :first-child {
  margin-top: 0 !important;
}

.ppc-info-modal__content > :last-child {
  margin-bottom: 0 !important;
}

.ppc-info-modal__loading {
  padding: 36px 0;
  text-align: center;
  color: #66706e;
  font-size: 14px;
}

@media (max-width: 700px) {
  dialog.ppc-info-modal {
    width: 100vw;
    max-width: none;
    height: 88vh;
    max-height: 88vh;
    margin: auto 0 0;
    border-radius: 14px 14px 0 0;
  }

  .ppc-info-modal__bar {
    min-height: 56px;
    padding-left: 18px;
  }

  .ppc-info-modal__content {
    padding: 20px 16px 28px;
  }
}

/* =========================================
   FAQ ACCORDION INSIDE INFO LIGHTBOX
   The fetched FAQ page markup is static, so the configurator
   provides its own lightweight expand/collapse behavior.
========================================= */

.ppc-info-modal__content--faqs .wp-block-accordion {
  display: block;
  width: 100%;
}

.ppc-info-modal__content--faqs .wp-block-accordion-item {
  margin: 0;
  padding: 0;
  border-bottom: 1px solid #e3e7e5;
}

.ppc-info-modal__content--faqs .wp-block-accordion-heading {
  margin: 0 !important;
  padding: 0 !important;
}

.ppc-info-modal__content--faqs .wp-block-accordion-heading__toggle {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  width: 100%;
  margin: 0 !important;
  padding: 20px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #193b32 !important;
  font: inherit;
  text-align: left;
  box-shadow: none !important;
  cursor: pointer;
}

.ppc-info-modal__content--faqs .wp-block-accordion-heading__toggle:hover,
.ppc-info-modal__content--faqs .wp-block-accordion-heading__toggle:focus {
  background: transparent !important;
  color: #193b32 !important;
  box-shadow: none !important;
}

.ppc-info-modal__content--faqs .wp-block-accordion-heading__toggle:focus-visible {
  outline: 2px solid #587867 !important;
  outline-offset: 3px;
}

.ppc-info-modal__content--faqs .wp-block-accordion-heading__toggle-title {
  flex: 1 1 auto;
  color: inherit;
  font-weight: 700;
  line-height: 1.35;
}

.ppc-info-modal__content--faqs .wp-block-accordion-heading__toggle-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  color: #587867;
  font-family: Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1;
}

.ppc-info-modal__content--faqs .wp-block-accordion-panel {
  margin: 0 !important;
  padding: 0 0 20px !important;
  color: #525b57;
}

.ppc-info-modal__content--faqs .wp-block-accordion-panel[hidden] {
  display: none !important;
}

.ppc-info-modal__content--faqs .wp-block-accordion-panel > :first-child {
  margin-top: 0 !important;
}

.ppc-info-modal__content--faqs .wp-block-accordion-panel > :last-child {
  margin-bottom: 0 !important;
}

@media (max-width: 700px) {
  .ppc-info-modal__content--faqs .wp-block-accordion-heading__toggle {
    gap: 14px;
    padding: 18px 0 !important;
  }

  .ppc-info-modal__content--faqs .wp-block-accordion-heading__toggle-icon {
    flex-basis: 26px;
    width: 26px;
    height: 26px;
    font-size: 22px;
  }
}