/* Direction 04 extends the approved porcelain/ink system. Theme-scene rules stay in style.css. */
.logo.dog-only {
  width: 50px;
  min-width: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
}
.logo.dog-only > img {
  width: 42px;
  height: 43px;
  object-fit: contain;
}
.logo.dog-only:after {
  display: none;
}
[data-theme="dark"] .logo.dog-only > img {
  filter: brightness(0) invert(1);
}
.tiny-label {
  line-height: 1.6;
}
.recurring-feature,
.import-feature-v4,
.review-feature,
.installment-feature {
  margin-top: 14px;
}
.import-desk,
.review-inbox,
.installment-studio {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 23px;
  box-shadow: var(--shadow);
  overflow: hidden;
}
.item-icon {
  --icon-color: var(--blue);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 61px;
  position: relative;
  flex-shrink: 0;
  color: color-mix(in srgb, var(--icon-color) 70%, var(--ink));
  border: 1px solid color-mix(in srgb, var(--icon-color) 25%, var(--line));
  border-radius: 18px;
  background: linear-gradient(
    150deg,
    color-mix(in srgb, var(--icon-color) 8%, var(--surface)),
    color-mix(in srgb, var(--icon-color) 19%, var(--surface))
  );
  box-shadow:
    0 1px 1px #ffffffa0 inset,
    0 7px 12px -8px color-mix(in srgb, var(--icon-color) 40%, transparent);
  transition:
    transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.3s;
}
.item-icon:before {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--surface) 70%, transparent);
  pointer-events: none;
}
.icon-bolt,
.icon-home {
  --icon-color: var(--gold);
}
.icon-water,
.icon-wifi {
  --icon-color: var(--blue);
}
.icon-phone,
.icon-laptop {
  --icon-color: var(--violet);
}
.icon-shield,
.icon-washer {
  --icon-color: var(--mint);
}
.item-icon.is-paid {
  --icon-color: var(--mint);
}
.item-icon.small {
  width: 39px;
  height: 41px;
  border-radius: 12px;
}
.item-icon.small:before {
  inset: 3px;
  border-radius: 9px;
}
.icon-paid {
  position: absolute;
  right: -4px;
  bottom: -3px;
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  background: var(--green);
  color: var(--surface);
  border: 3px solid var(--surface);
  border-radius: 50%;
  box-sizing: content-box;
}
[data-theme="dark"] .item-icon {
  box-shadow:
    0 1px 0 #d0eaff20 inset,
    0 0 22px -12px var(--icon-color);
}
[data-theme="dark"] .item-icon:before {
  border-color: #ffffff0b;
}
@media (max-width: 600px) {
  .logo.dog-only {
    width: 40px;
    min-width: 40px;
  }
  .logo.dog-only > img {
    width: 34px;
    height: 35px;
  }
  .recurring-feature,
  .import-feature-v4,
  .review-feature,
  .installment-feature {
    margin-top: 5px;
  }
  .import-desk,
  .review-inbox,
  .installment-studio {
    border-radius: 16px;
  }
  .item-icon {
    width: 51px;
    height: 55px;
    border-radius: 16px;
  }
  .item-icon:before {
    border-radius: 12px;
  }
}