/**
 * RB Core — Header Contact shortcodes
 * Источник: inc/header-contact.php
 *
 * Стилистика:
 *   color, font-family — от темы (inherit).
 *   Dropdown зеркалит Blocksy submenu через переменные --rb-hc-*,
 *   которые инжектятся inline на основе theme_mod('header_placements')
 *   (раздел Customizer → Header → Menu → Dropdown).
 *   Любые правки в Customizer подхватываются без правки кода.
 *
 * Брейкпоинты совпадают с Blocksy default (mobile 768, tablet 1200).
 */

.rb-hc {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: inherit;
    text-decoration: none;
    line-height: 1.2;
    vertical-align: middle;
}

.rb-hc:hover,
.rb-hc:focus-visible {
    color: inherit;
}

.rb-hc__trigger {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: inherit;
    text-decoration: none;
}

.rb-hc__icon {
    flex: none;
    display: inline-flex;
    width: 1.25em;
    height: 1.25em;
}

.rb-hc__icon svg,
.rb-hc__icon-svg {
    width: 100%;
    height: 100%;
}

.rb-hc__text {
    white-space: nowrap;
}

/* ── Dropdown — реплика Blocksy submenu ─────────────────────────────────
   Значения --rb-hc-* выставляются inline'ом из theme_mod('header_placements').
   Дефолты — на случай если настроек ещё нет. */

.rb-hc__dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    display: grid;
    min-width: var(--rb-hc-min-width, 240px);
    margin-top: 8px;
    background-color: var(--rb-hc-bg, #fff);
    color: var(--rb-hc-color, inherit);
    font-size: var(--rb-hc-font-size, inherit);
    line-height: var(--rb-hc-line-height, 1.4);
    font-weight: var(--rb-hc-font-weight, inherit);
    border-radius: var(--rb-hc-radius, 4px);
    box-shadow: var(--rb-hc-shadow, 0 8px 24px rgba(0, 0, 0, 0.08));
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(0, 8px, 0);
    transition:
        opacity 0.2s ease,
        visibility 0.2s ease,
        transform 0.2s ease;
}

/* drop-down bridge — закрывает gap между триггером и попапом, тот же приём
   что в Blocksy: курсор может пересечь отступ не теряя hover */
.rb-hc__dropdown::before {
    content: "";
    position: absolute;
    top: -8px;
    left: 0;
    width: 100%;
    height: 8px;
}

.rb-hc--address:hover .rb-hc__dropdown,
.rb-hc--address:focus-within .rb-hc__dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate3d(0, 0, 0);
}

.rb-hc__row,
.rb-hc__link {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: var(--rb-hc-pad-y, 12px) var(--rb-hc-pad-x, 18px);
}

.rb-hc__row + .rb-hc__row,
.rb-hc__row + .rb-hc__link {
    border-top: var(--rb-hc-divider, none);
}

.rb-hc__row-text {
    flex: 1 1 auto;
    min-width: 0;
}

.rb-hc__row-icon {
    flex: none;
    display: inline-flex;
    width: 1em;
    height: 1em;
    margin-top: 0.15em;
}

.rb-hc__row-icon svg {
    width: 100%;
    height: 100%;
}

/* «На карте» — компактная inline-ссылка справа от адреса в той же строке */
.rb-hc__map-link {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 8px;
    padding-left: 8px;
    border-left: 1px solid currentColor;
    color: inherit;
    text-decoration: none;
    white-space: nowrap;
    opacity: 0.85;
}

.rb-hc__map-link:hover,
.rb-hc__map-link:focus-visible {
    color: var(--rb-hc-color-hover, inherit);
    opacity: 1;
    text-decoration: underline;
}

.rb-hc__link {
    color: inherit;
    text-decoration: none;
    align-items: center;
}

.rb-hc__link:hover,
.rb-hc__link:focus-visible {
    color: var(--rb-hc-color-hover, inherit);
    text-decoration: underline;
}

/* Trigger без href — курсор подсказывает что элемент даёт всплывающую справку */
.rb-hc__trigger {
    cursor: help;
    outline: none;
}

.rb-hc__trigger:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* ── Адаптив ──────────────────────────────────────────────────────────── */

/* ≥1400 — для адреса показываем `field=` (full), city скрываем */
@media (min-width: 1400px) {
    .rb-hc--address .rb-hc__text--city {
        display: none;
    }
}

/* 768–1399 — для адреса всегда только город, full скрываем (на 1200 уже city) */
@media (max-width: 1399.98px) {
    .rb-hc--address .rb-hc__text--full {
        display: none;
    }
}

/* <768 — все три шорткода схлопываются до иконки, dropdown отключаем */
@media (max-width: 767.98px) {
    .rb-hc__text {
        display: none;
    }

    .rb-hc__dropdown {
        display: none;
    }
}