/* MedDESA — светлая тема. Коралл + бирюза, палитра клиники.
   Наследует всю раскладку от styles.css, переопределяет только цвет. */

@import url("styles.css");

:root{
  /* Коралл #FF8562 взят из CSS текущего сайта, бирюза #12B3A0 — из фирменных фото врачей */
  --coral:#FF8562;
  --coral-dk:#D9542F;
  --coral-wash:#FDEFEB;

  --ink:#241A18;          /* тёплый почти-чёрный */
  --ink-2:#3A2B28;
  --paper:#FBF7F5;
  --paper-2:#FBF4F2;
  --white:#FFFFFF;

  --teal:#009F9B;
  --teal-mid:#047D7B;     /* заливка кнопок, белый текст 4,97:1 */
  --teal-dk:#04605E;      /* текст и ссылки на белом, 7,39:1 */
  --teal-wash:#E7F3F2;

  --muted:#6E5C58;
  --muted-lt:#9A8884;
  --line:rgba(36,26,24,.12);
  --line-dk:rgba(255,255,255,.18);
}

body{background:var(--paper);color:var(--ink)}

/* ---------- шапка ---------- */
.hdr{
  background:rgba(255,255,255,.92);
  border-bottom:1px solid var(--line);
  color:var(--ink);
}
.logo b{color:var(--ink)}
.nav a{color:var(--muted)}
.nav a.nav__cta{color:#fff}
.nav a.nav__cta:hover{color:#fff}
.nav a.nav__msg-link{color:var(--teal-dk)}
.nav a:hover{color:var(--ink)}
.burger{color:var(--ink)}
@media(max-width:720px){.burger{border-color:var(--line);color:var(--ink)}}
@media(max-width:1080px){
  .nav{background:var(--white);border-bottom:1px solid var(--line)}
  .nav a{border-bottom:1px solid var(--line)}
}

/* ---------- кнопки ---------- */
.btn--primary{background:var(--teal-mid);color:#fff;border-color:var(--teal-mid)}
.btn--primary:hover{background:#04605E;border-color:#04605E}
.btn--ghost{border-color:var(--line);color:var(--ink)}
.btn--ghost:hover{border-color:var(--ink);background:rgba(36,26,24,.04)}

/* ---------- эйбрау: коралл как структурный цвет ---------- */
.eyebrow{color:var(--coral-dk)}

/* ---------- герой: коралловое поле, тёмный текст ---------- */
.tile--main .eyebrow{background:rgba(255,255,255,.64);color:#432017}
.hero__note{color:#8A5A4B}
.trust{border-top-color:rgba(36,26,24,.18)}
.scrollhint{color:#9E6553}
.hero__photo img{filter:drop-shadow(0 26px 46px rgba(120,50,35,.32))}

/* ---------- полоса фактов: глубокая бирюза ---------- */
.facts{background:transparent;border-top:0}
.facts__panel{background:#03514F;color:#fff;box-shadow:0 24px 60px rgba(3,81,79,.24)}
.fact{border-right-color:rgba(255,255,255,.17)}
.fact .ic{color:#7FD9CE}
.fact__s{color:rgba(255,255,255,.62)}
.fact__stars .st{fill:#FFC078}
a.fact::after{background:#7FD9CE}
@media(max-width:860px){.fact{border-bottom-color:rgba(255,255,255,.17)}}

/* ---------- каталог услуг ---------- */
.srv:hover{background:var(--coral-wash)}

/* ---------- оборудование: белый лист, «научная страница» ---------- */

/* ---------- врачи: мягкая бирюза, чтобы шестиугольники на фото не висели в пустоте ---------- */
#doctors.sec--dark{background:transparent}
#doctors.sec--dark > .wrap{background:var(--teal-wash);color:var(--ink)}
#doctors .eyebrow{color:var(--coral-dk)}
#doctors .lead{color:var(--muted)}
#doctors .doc{background:var(--white);box-shadow:0 1px 3px rgba(36,26,24,.06)}
#doctors .doc{border-color:rgba(4,96,94,.12);box-shadow:0 2px 10px rgba(4,96,94,.06)}

@supports selector(::scroll-marker-group){
  #doctors .doc::scroll-marker{background:rgba(36,26,24,.18)}
  #doctors .doc::scroll-marker:target-current{background:var(--teal-dk)}
}
/* Стрелки ленты врачей. В базовой теме рамка задана через --line-dk —
   это белая линия для тёмного фона, а здесь секция светлая, и кнопки
   пропадали. Задаём тёмную рамку, как у соседней кнопки .btn--ghost. */
.strip-nav__b{border-color:rgba(36,26,24,.24);color:var(--ink)}
.strip-nav__b:hover:not(:disabled){
  background:rgba(255,255,255,.7);border-color:var(--ink);color:var(--ink);
}
#doctors .doc__n{color:var(--ink)}
#doctors .doc__r{color:var(--teal-dk)}
#doctors .doc__m{color:var(--muted-lt);border-top-color:var(--line)}
#doctors .btn--ghost{border-color:rgba(36,26,24,.2);color:var(--ink)}
#doctors .btn--ghost:hover{border-color:var(--ink);background:rgba(255,255,255,.6)}

/* ---------- результаты и отзывы ---------- */
.res figure{border-color:transparent}
.ptable{border:0}
.rev{border-color:transparent;background:var(--white)}
.rev__top{background:var(--coral-wash);border:0}
.stars{color:var(--coral)}
.rev p{color:#463734}

/* ---------- контакты: глубокая бирюза ---------- */
#contact.sec--dark,#book.sec--dark{background:transparent}
#contact.sec--dark > .wrap,#book.sec--dark > .wrap{background:#03514F}
#contact .eyebrow{color:#FFC9A6}
#contact #contact #contact #contact .consent{color:rgba(255,255,255,.64)}
#contact .info dt{color:rgba(255,255,255,.55)}
#contact #contact #contact .btn--primary{background:#fff;color:#03514F;border-color:#fff}
#contact .btn--primary:hover{background:#EAF7F5;border-color:#EAF7F5}
#contact .btn--ghost{border-color:rgba(255,255,255,.34);color:#fff}
#contact .btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.12)}

/* ---------- липкая панель ---------- */
.dock{background:rgba(251,247,245,.95);border-top-color:var(--line)}
.dock__tel{border-color:var(--line);color:var(--ink)}

/* ---------- подвал ---------- */

/* ---------- прайс ---------- */
.pfilter{background:var(--paper);border-bottom-color:var(--line)}
.pfilter input{border-color:var(--line)}
.tag{border-color:var(--line)}
.tag.on{background:var(--teal-mid);color:#fff;border-color:var(--teal-mid)}
.pgroup__sub{color:var(--coral-dk)}
.ptable{background:var(--white)}
.prow{border-bottom-color:var(--line)}

/* ---------- модальное окно записи ---------- */
.bk{background:rgba(36,26,24,.55)}
.bk__head{border-bottom-color:var(--line)}
.bk__fb{border-top-color:var(--line)}

/* ---------- акции ---------- */
.promo__c{border-color:transparent}
.promo__n{color:var(--coral-dk)}
.promo__cond{border-top-color:var(--line)}

/* ---------- документы ---------- */
.doc-card{border-color:transparent;background:var(--white)}
.doc-card__tag{color:var(--coral-dk)}
.doc-card__thumb{background:var(--paper-2)}

/* ---------- телемедицина ---------- */
.tele{background:var(--teal-wash);border-color:transparent}
.tele__steps li{border-bottom-color:rgba(36,26,24,.1)}
.tele__steps li::before{color:var(--coral-dk);border-color:rgba(217,84,47,.32);background:#fff}
.tele__steps span{color:var(--muted)}

/* ---------- FAQ ---------- */
.faq,.faq details{border-color:var(--line)}
.faq summary::after{color:var(--coral-dk)}

/* ---------- фокус ---------- */
:focus-visible{outline-color:var(--teal-dk)}

/* логотип в светлой шапке — вектор наследует цвет */
.logo{color:var(--ink)}
.logo__sub,.logo__tag{color:var(--teal-dk)}

/* Подбор услуги — тёмная панель. Берём тот же глубокий бирюзовый, что
   у панелей записи: --ink-2 в светлой теме тёплый коричневый, и виджет
   на нём выглядел чужеродно. */
#quiz .quiz{background:#03514F}
#quiz .quiz__opt{color:var(--ink)}
#quiz .quiz__hint{color:rgba(255,255,255,.66)}
#quiz .quiz__seg{background:rgba(255,255,255,.22)}
#quiz .quiz__seg.on{background:var(--teal)}

/* Экран результата верстался под светлую карточку — на тёмной панели
   его текст и разделители пропадали. */
#quiz .quiz__lead{color:rgba(255,255,255,.72)}
#quiz .quiz__row{border-bottom-color:rgba(255,255,255,.14);color:#fff}
#quiz .quiz__row i{color:rgba(255,255,255,.66)}
#quiz .quiz__sum{border-top-color:rgba(255,255,255,.2)}
#quiz .quiz__sum span{color:rgba(255,255,255,.7)}
#quiz .quiz__sum b{color:#FFB08C}
#quiz .quiz__note{color:rgba(255,255,255,.52)}
#quiz .quiz__tag{background:rgba(255,255,255,.12);color:#7ED9CF}
#quiz .btn--ghost{border-color:rgba(255,255,255,.34);color:#fff}
#quiz .btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
#quiz .quiz__row:hover{background:rgba(255,255,255,.08)}
