/* Код кожи v5.27 — primary pill CTAs, shared across home, service directions,
   contacts, specialist and equipment cards. Does not affect circular carousel,
   accordion toggles, the header menu, or video playback controls. */
:root {
  --kk-cta-green: #173D33;
  --kk-cta-gold: #C7A160;
  --kk-cta-green-icon: #69867D;
  --kk-cta-gold-icon: #E2C58C;
}

/* The same visual rhythm as the approved "Все услуги" screenshots:
   56px high, 24px left inset, 4px right inset, 46px circular arrow. */
.kk-direction .kkd-pill-cta,
section.contacts.kk-contact-unified .contacts__info .kkd-home-booking,
html body section.services:has(.portfolio__link) .portfolio__link,
.kk-sp-doctor .kk-sp-doctor__more,
.kk-equipment-page .kk-equipment__more,
.kk-direction .kkd-accordion__body .kkd-accordion__more {
  box-sizing: border-box !important;
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 56px !important;
  height: 56px !important;
  margin-bottom: 0 !important;
  padding: 5px 5px 5px 24px !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  background-image: none !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font: 600 16px/1.3 "Onest", Arial, sans-serif !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-transform: none !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  cursor: pointer;
  transform: none !important;
  transition: background-color .2s ease !important;
}

/* Green is the default for booking and "Подробнее" on cards. */
.kk-direction .kkd-pill-cta,
section.contacts.kk-contact-unified .contacts__info .kkd-home-booking,
.kk-sp-doctor .kk-sp-doctor__more,
.kk-equipment-page .kk-equipment__more {
  background: var(--kk-cta-green) !important;
}
.kk-direction .kkd-pill-cta:hover,
section.contacts.kk-contact-unified .contacts__info .kkd-home-booking:hover,
.kk-sp-doctor:hover .kk-sp-doctor__more,
.kk-sp-doctor__whole:hover .kk-sp-doctor__more,
.kk-equipment-page .kk-equipment__link:hover .kk-equipment__more {
  background: var(--kk-cta-gold) !important;
  transform: none !important;
}

/* Gold is the default for "Все услуги" and expanded-accordion links. */
html body section.services:has(.portfolio__link) .portfolio__link,
.kk-direction .kkd-accordion__body .kkd-accordion__more {
  background: var(--kk-cta-gold) !important;
}
html body section.services:has(.portfolio__link) .portfolio__link:hover,
.kk-direction .kkd-accordion__body .kkd-accordion__more:hover {
  background: var(--kk-cta-green) !important;
  transform: none !important;
}

/* Text: stable left alignment, no theme-added offsets or font scaling. */
.kk-direction .kkd-pill-cta > .kkd-pill-cta__text,
section.contacts.kk-contact-unified .contacts__info .kkd-home-booking > .kkd-pill-cta__text,
html body section.services:has(.portfolio__link) .portfolio__link > .kk-cta__label,
.kk-sp-doctor .kk-sp-doctor__more > .kk-sp-doctor__more-text,
.kk-equipment-page .kk-equipment__more > span:first-child,
.kk-direction .kkd-accordion__body .kkd-accordion__more > .kkd-pill-cta__text {
  box-sizing: border-box !important;
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font: inherit !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  text-align: left !important;
  overflow: visible !important;
  transform: none !important;
}

/* Arrow is its own circle, never flexes, scales or drifts to the next line. */
.kk-direction .kkd-pill-cta > .kkd-pill-cta__icon,
section.contacts.kk-contact-unified .contacts__info .kkd-home-booking > .kkd-pill-cta__icon,
html body section.services:has(.portfolio__link) .portfolio__link > .kk-cta__icon,
.kk-sp-doctor .kk-sp-doctor__more > .kk-sp-doctor__arrow,
.kk-equipment-page .kk-equipment__more > .kk-equipment__arrow,
.kk-direction .kkd-accordion__body .kkd-accordion__more > .kkd-pill-cta__icon {
  box-sizing: border-box !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 46px !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  max-width: 46px !important;
  max-height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: var(--kk-cta-green-icon) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  transform: none !important;
  transition: background-color .2s ease !important;
}
.kk-direction .kkd-pill-cta:hover > .kkd-pill-cta__icon,
section.contacts.kk-contact-unified .contacts__info .kkd-home-booking:hover > .kkd-pill-cta__icon,
.kk-sp-doctor:hover .kk-sp-doctor__more > .kk-sp-doctor__arrow,
.kk-sp-doctor__whole:hover .kk-sp-doctor__more > .kk-sp-doctor__arrow,
.kk-equipment-page .kk-equipment__link:hover .kk-equipment__more > .kk-equipment__arrow {
  background: var(--kk-cta-gold-icon) !important;
}
html body section.services:has(.portfolio__link) .portfolio__link > .kk-cta__icon,
.kk-direction .kkd-accordion__body .kkd-accordion__more > .kkd-pill-cta__icon {
  background: var(--kk-cta-gold-icon) !important;
}
html body section.services:has(.portfolio__link) .portfolio__link:hover > .kk-cta__icon,
.kk-direction .kkd-accordion__body .kkd-accordion__more:hover > .kkd-pill-cta__icon {
  background: var(--kk-cta-green-icon) !important;
}
.kk-direction .kkd-pill-cta__icon svg,
section.contacts.kk-contact-unified .kkd-home-booking .kkd-pill-cta__icon svg,
html body section.services .portfolio__link .kk-cta__icon svg,
.kk-sp-doctor__arrow svg,
.kk-equipment__arrow svg,
.kk-direction .kkd-accordion__more .kkd-pill-cta__icon svg {
  display: block !important;
  flex: none !important;
  width: 20px !important;
  height: 20px !important;
  fill: none !important;
  stroke: #fff !important;
  stroke-width: 2.2 !important;
  transform: none !important;
}

/* The homepage link has a stable 266×56 CSS-pixel footprint even at
   175/200/250% browser zoom; never use vw to size its text or arrow. */
html body section.services:has(.portfolio__link) .portfolio__link {
  position: relative !important;
  /* Keep the existing vertical spacing/top offset from the theme. */
  width: 266px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  font-size: 17px !important;
}
html body section.services:has(.portfolio__link) .portfolio__link::before,
html body section.services:has(.portfolio__link) .portfolio__link::after { display: none !important; }
html body section.services:has(.portfolio__link) .portfolio__link > img { display: none !important; }

/* Other primary buttons retain the right width for their context. */
.kk-direction .kkd-hero__book { width: 266px !important; }
/* v5.26: doctor cards on /services/.../ use the SAME 16px type, 24px
   text inset and 46px arrow as the approved sitewide pill buttons.
   v5.25 incorrectly reduced the type to 13px and the inset to 14px. */
.kk-direction .kkd-doctor__book {
  width: 100% !important;
  margin-top: auto !important;
  gap: 12px !important;
  padding-left: 24px !important;
  font-size: 16px !important;
}
section.contacts.kk-contact-unified .contacts__info .kkd-home-booking {
  align-self: stretch !important;
  width: 100% !important;
  margin-top: 0 !important;
}
.kk-sp-doctor .kk-sp-doctor__more,
.kk-equipment-page .kk-equipment__more {
  width: 100% !important;
  margin-top: auto !important;
}
.kk-direction .kkd-accordion__body .kkd-accordion__more {
  width: max-content !important;
  max-width: 100% !important;
  height: auto !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  white-space: normal !important;
}
.kk-direction .kkd-accordion__body .kkd-accordion__more > .kkd-pill-cta__text {
  white-space: normal !important;
}

/* Keyboard users see focus without a geometry or layout change. */
.kk-direction .kkd-pill-cta:focus-visible,
section.contacts.kk-contact-unified .contacts__info .kkd-home-booking:focus-visible,
html body section.services .portfolio__link:focus-visible,
.kk-sp-doctor__whole:focus-visible,
.kk-equipment__link:focus-visible,
.kk-direction .kkd-accordion__more:focus-visible {
  outline: 3px solid var(--kk-cta-gold) !important;
  outline-offset: 3px !important;
}

/* Very narrow phones: preserve the SAME text-left/arrow-right geometry
   without clipping the full booking label. Standard sizes resume >360px. */
@media (max-width: 360px) {
  .kk-direction .kkd-doctor__book {
    gap: 8px !important;
    padding-left: 16px !important;
    font-size: 14px !important;
  }
  .kk-direction .kkd-doctor__book > .kkd-pill-cta__icon {
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
  }
  section.contacts.kk-contact-unified .contacts__info .kkd-home-booking {
    gap: 8px !important;
    padding-left: 16px !important;
    font-size: 14px !important;
  }
  .kk-sp-doctor .kk-sp-doctor__more,
  .kk-equipment-page .kk-equipment__more { padding-left: 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .kk-direction .kkd-pill-cta,
  section.contacts.kk-contact-unified .kkd-home-booking,
  html body section.services .portfolio__link,
  .kk-sp-doctor__more,
  .kk-equipment__more,
  .kk-direction .kkd-accordion__more { transition: none !important; }
}

/* 320px-class screens: recover 12px inside the card without altering its width. */
@media (max-width: 340px) {
  .kk-direction .kkd-doctor__body { padding-left: 16px; padding-right: 16px; }
}

/* v5.27: Contact CTA is content-sized, not a full-column button.
   This final rule deliberately wins over v5.24's width:100% !important.
   The same selector works with the original homepage and older service markup. */
:is(section.contacts.kk-contact-unified, .kk-direction section.contacts, body.home section.contacts, body.front-page section.contacts)
  .contacts__info .kkd-home-booking {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-self: flex-start !important;
  width: 266px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 56px !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 5px 5px 5px 24px !important;
  gap: 12px !important;
  font: 600 16px/1.3 "Onest", Arial, sans-serif !important;
  white-space: nowrap !important;
  background: #173D33 !important;
  color: #fff !important;
}
:is(section.contacts.kk-contact-unified, .kk-direction section.contacts, body.home section.contacts, body.front-page section.contacts)
  .contacts__info .kkd-home-booking:hover {
  background: #C7A160 !important;
}
:is(section.contacts.kk-contact-unified, .kk-direction section.contacts, body.home section.contacts, body.front-page section.contacts)
  .contacts__info .kkd-home-booking > .kkd-pill-cta__icon {
  flex: 0 0 46px !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  max-width: 46px !important;
  max-height: 46px !important;
  background: #69867D !important;
}
:is(section.contacts.kk-contact-unified, .kk-direction section.contacts, body.home section.contacts, body.front-page section.contacts)
  .contacts__info .kkd-home-booking:hover > .kkd-pill-cta__icon {
  background: #E2C58C !important;
}
@media (max-width: 768px) {
  :is(section.contacts.kk-contact-unified, .kk-direction section.contacts, body.home section.contacts, body.front-page section.contacts)
    .contacts__info .kkd-home-booking {
    align-self: center !important;
    width: min(266px, 100%) !important;
    max-width: 100% !important;
  }
}
@media (max-width: 360px) {
  :is(section.contacts.kk-contact-unified, .kk-direction section.contacts, body.home section.contacts, body.front-page section.contacts)
    .contacts__info .kkd-home-booking {
    padding-left: 16px !important;
    font-size: 14px !important;
  }
}
