/* Корпоративная почта (сессия mail): фирменный цвет и фото-фон для темы «Gmail Фото».
   Тема gmail-photo задаёт переменные --vionet-*; без них каждое правило
   падает на обычные значения Bulwark, поэтому другие темы не меняются.

   Принцип, как в Gmail: фото видно только под боковой панелью, шапкой и списком
   писем. Открытое письмо, настройки, календарь, контакты, файлы — сплошной лист.
   Всплывающие меню и окна никогда не прозрачны. */

/* Фирменный синий и на экране входа, до загрузки темы (тема, подключаемая позже, приоритетнее) */
:root {
  --color-primary: #0373c3;
  --color-ring: #0373c3;
}

/* Фото под интерфейсом: без --vionet-veil закрыто сплошным цветом фона.
   Какое фото — выбирает ящик в «Настройки → Внешний вид → Фон» (--vionet-wallpaper). */
html[data-interface-layout="mountain-view"] body {
  background:
    linear-gradient(var(--vionet-veil, var(--color-background)), var(--vionet-veil, var(--color-background))),
    var(--vionet-wallpaper, url(/vionet-skin/wallpapers/almaty.jpg)) center / cover no-repeat fixed;
}

/* Карточка — сплошной лист; полупрозрачная только пока в ней список писем */
html[data-interface-layout="mountain-view"] [data-mv-card] {
  background-color: var(--color-background);
}
html[data-interface-layout="mountain-view"] [data-mv-card]:has([data-mv-row]):not(:has(.email-content-wrapper)) {
  background-color: var(--vionet-card-bg, var(--color-background));
}

/* Внутри списка прозрачны только неподвижные слои. Всё, что всплывает (absolute/fixed,
   с тенью, меню, окна, списки выбора), и всё внутри таких слоёв остаётся сплошным. */
html[data-interface-layout="mountain-view"] [data-mv-card]:has([data-mv-row]):not(:has(.email-content-wrapper))
  .bg-background:not(.absolute, .fixed, [role], [class*="shadow-"]):not(:is(.absolute, .fixed, [role="menu"], [role="dialog"], [role="listbox"], [role="tooltip"], [class*="shadow-"]) *) {
  background-color: var(--vionet-inner-bg, var(--color-background));
}

/* Строки списка: непрочитанные светлее; под курсором — светлая строка и сплошная подложка кнопок */
html[data-interface-layout="mountain-view"] [data-mv-row][data-unread="true"] {
  background-color: var(--vionet-row-unread, var(--color-background));
}
html[data-interface-layout="mountain-view"] [data-mv-row]:hover {
  background-image: linear-gradient(var(--vionet-row-hover, transparent), var(--vionet-row-hover, transparent));
}
html[data-interface-layout="mountain-view"] [data-mv-row] .bg-background {
  background-color: var(--vionet-row-hover-solid, var(--color-background));
}

/* Навигация и верхняя строка — белым по фото. Только то, что лежит прямо на фото:
   всплывающие меню и окна (они внутри этих же блоков) остаются в обычных цветах. */
html[data-interface-layout="mountain-view"] :is(
  [data-mv-nav-row],
  [data-mv-nav-row] span,
  [data-mv-nav-row] svg,
  [data-section-name],
  [data-section-name] span,
  [data-section-name] svg,
  [data-mv-labels] > :not([data-mv-nav-row]) span,
  [data-mv-labels] > :not([data-mv-nav-row]) svg,
  [data-mv-topbar] > div > a span,
  [data-mv-topbar] > div > :is(a, button) > svg,
  [data-mv-topbar] > div > div > button > svg
):not(:is([role="menu"], [role="dialog"], [role="listbox"], [role="tooltip"], .bg-popover, .bg-card, .bg-background) *) {
  color: var(--vionet-chrome-fg, var(--color-foreground));
  text-shadow: var(--vionet-chrome-shadow, none);
}

/* Кнопки верхней строки: подсветка при наведении и открытом меню — полупрозрачная, белая иконка остаётся видна */
html[data-interface-layout="mountain-view"] [data-mv-topbar] > div > :is(a, button):not(:has([data-vionet-brand-email])):is(:hover, [aria-expanded="true"]),
html[data-interface-layout="mountain-view"] [data-mv-topbar] > div > div > button:is(:hover, [aria-expanded="true"]) {
  background-color: var(--vionet-chrome-hover, var(--color-muted));
}

/* Правая панель (Календарь, Контакты): цветные иконки на светлых кружках, как в Gmail */
html[data-interface-layout="mountain-view"] [data-mv-side-rail] > button {
  background-color: var(--vionet-rail-bg, transparent);
}

/* Окно уведомлений шире: русские подписи кнопок не помещались, заголовок обрезался до «У…» */
[role="dialog"]:has(> [data-notification-panel]) {
  width: 27rem;
}

/* Меню аккаунта и заголовок окна нового письма: в фото-теме сплошная подложка */
html[data-interface-layout="mountain-view"] [data-mv-account-popover],
html[data-interface-layout="mountain-view"] [data-mv-compose-titlebar] {
  background-color: var(--vionet-popover-bg, var(--mv-search-bg));
}

/* Адрес текущего ящика в шапке — главное, что должно читаться: полужирный, а в фото-теме
   верх слегка затемнён (вуаль темы), чтобы белый текст не терялся на светлом небе */
html[data-interface-layout="mountain-view"] [data-mv-topbar] [data-vionet-brand-email] {
  font-weight: 500;
}
html[data-interface-layout="mountain-view"] [data-mv-topbar] {
  background-image: linear-gradient(var(--vionet-veil, transparent), transparent);
}

/* Телефон: так же фото под списком писем (прочитанные — полупрозрачные, непрочитанные светлее).
   Открытое письмо и всё всплывающее — сплошные, как на компьютере. Тень считается только
   безусловная (shadow-*): у колонки списка md:shadow-sm, на телефоне её нет. */
html[data-interface-layout="mountain-view"] .h-dvh.bg-background:has([data-mv-mobile-row]):not(:has(.email-content-wrapper)),
html[data-interface-layout="mountain-view"] .h-dvh:has([data-mv-mobile-row]):not(:has(.email-content-wrapper))
  .bg-background:not(.absolute, .fixed, [role], [class^="shadow-"], [class*=" shadow-"], [data-mv-mobile-row]):not(:is(.absolute, .fixed, [role="menu"], [role="dialog"], [role="listbox"], [role="tooltip"], [class^="shadow-"], [class*=" shadow-"]) *) {
  background-color: var(--vionet-inner-bg, var(--color-background));
}
html[data-interface-layout="mountain-view"] [data-mv-mobile-row] {
  background-color: var(--vionet-card-bg, var(--color-background));
}
html[data-interface-layout="mountain-view"] [data-mv-mobile-row][data-unread="true"] {
  background-image: linear-gradient(var(--vionet-row-unread, transparent), var(--vionet-row-unread, transparent));
}
/* Адрес ящика над поиском лежит прямо на фото — белым, как в шапке на компьютере */
html[data-interface-layout="mountain-view"] [data-vionet-mobile-brand] [data-vionet-brand-email] {
  color: var(--vionet-chrome-fg, var(--color-foreground));
  text-shadow: var(--vionet-chrome-shadow, none);
  font-weight: 500;
}