/* ============================================================================
   PSR Chevrons — стрелки вниз в селектах/дропдаунах красные везде.
   Эталон: акцент #F01A26 (как вертикальная полоска SEND TO / SHIPMENT TYPE).
   ========================================================================== */

:root{
	--psr-chevron: #F01A26;
}

/* Главная / checkout: флаги стран + shipment type */
.input-flag .chev,
.bi-chevron-down.chev,
.select-chev,
.bi-chevron-down.select-chev,
#psrCF .select-chev,
#psrCF .bi-chevron-down{
	color: var(--psr-chevron) !important;
}

/* Legacy custom-select (уже красный через border, дублируем на всякий) */
.custom-arrow,
.custom-arrow.relative-arrow{
	border-right-color: var(--psr-chevron) !important;
	border-bottom-color: var(--psr-chevron) !important;
}

/* Шапка: Services / язык */
.services-header i.arrow,
#chevron.arrow,
.bi-chevron-down.arrow{
	color: var(--psr-chevron) !important;
}

/* Дашборд: Newest First / Filters / Any Sender / … */
.modern-btn .chevron,
.bi-chevron-down.chevron,
.premium-dropdown-btn .arrow-right,
.bi-chevron-down.arrow-right{
	color: var(--psr-chevron) !important;
}

.modern-btn[aria-expanded="true"] .chevron,
.premium-dropdown-btn[aria-expanded="true"] .arrow-right{
	color: var(--psr-chevron) !important;
}

/* Checkout: сортировка Delivery type */
.psr-sort-chev,
.bi-chevron-down.psr-sort-chev{
	color: var(--psr-chevron) !important;
}

/* Auth-модалка: select страны и прочие нативные стрелки через Bootstrap Icons */
.psr-auth-overlay .bi-chevron-down{
	color: var(--psr-chevron) !important;
}

/* ============================================================================
   2026-09-08 — стрелка разворачивается, когда список открыт (как у профиля в шапке).
   Почему через :has(), а не классом на элементе:
     * у страны класс .open получает ТОЛЬКО сам список .country-list, а он лежит
       СОСЕДОМ от .input-shell внутри колонки — concept-bridge.js переносит его туда
       из .input-shell{overflow:hidden}, иначе дропдаун обрезался;
     * шеврон при этом сидит внутри .input-flag, то есть в соседнем поддереве —
       обычным селектором до него не дотянуться;
     * вешать класс на .input-flag нельзя: concept-native.js при выборе страны
       перерисовывает её innerHTML целиком, и класс бы терялся.
   Если браузер не знает :has(), стрелка просто не поворачивается — ничего не ломается.
   ========================================================================== */
#psrCF .input-flag .chev,
#psrCF .select-chev{
	transition: transform .2s ease;
}

/* страна: открыт список в этой же колонке */
#psrCF *:has(> .country-list.open) .input-flag .chev{
	transform: rotate(180deg);
}

/* тип отправления: класс .open висит на самом .select-shell */
#psrCF .select-shell.open .select-chev{
	transform: rotate(180deg);
}