



/* ------------- 
content start - style
------------- */

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');


/* top offset */

:root {
    --pt: 105px;
}

body:has(.top-menu) {
    padding-top: var(--pt);
}

:has(.top-menu) .modal, 
:has(.top-menu) .modal-banner-close,
body:has(.top-menu) .with-left-menu .gc-into-main-content {
    top: var(--pt);
}

body:has(.top-menu) .notice-top-panel {
    top: var(--pt);
    left: 0;
}

.resp-screen {
    top: var(--pt) !important;
}

body:has(.top-menu) .lite-margined-wrapper {
    margin-top: var(--pt);
}
body:has(.top-menu) .block-editor, 
body:has(.top-menu) .gc-right-active-block {
	top: var(--pt);
    height: calc(100% - var(--pt));
}

/* top offset END */

.top-menu ~ .day-night {
    display: none;
}

.top-menu {
    background-color: #0082FF;
    padding: 10px 52px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: Inter, sans-serif;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 10000;
}

/*  Меню на странице /pl/talks/conversation */

body:has(.gc-user-user) .talks-widget-window {
    padding-top: 7.5vw;
}

body:has(.gc-user-user):has(.talks-widget-window) .top-menu {
    z-index: 10002;
}

/*------------*/

.top-menu-logo {
    cursor: pointer;
}

.top-menu-logo img {
    width: 250px;
    height: auto;
}

.top-menu-right {
    display: flex;
    align-items: center;
    gap: 20px;
    flex: 0 0 71%;
    max-width: 900px;/*1095px*/
}

.top-menu-nav {
    display: flex;
    padding: 0;
    margin: 0;
    list-style: none;
    flex: 1;
}

.top-menu-nav-item {
    flex: 1;
}

.top-menu-nav-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    padding-bottom: 8px;
}

.top-menu-nav-icon-wrapper {
    flex: 1;
    display: flex;
    align-items: center;
}

.top-menu-nav-icon {
    max-width: 35px;
    height: auto;
}

.top-menu-nav-link span {
    color: #FFF;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    border: 1px solid transparent;
    transition: border-color .3s;
}

.top-menu-nav-item-profile .top-menu-nav-icon-wrapper {
    width: 85px;
    height: 85px;
    border-radius: 50%;
    overflow: hidden;
    background-color: #ffffff;
}

.top-menu-nav-item-profile {
    margin-left: 20px;
    cursor: pointer;
}

.top-menu-nav-icon.icon-profile {
    max-width: none;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.top-menu-nav-link:hover {
    text-decoration: none;
}

.top-menu-nav-link:hover span {
    border-bottom: 1px solid;
}

/* Submenu */
.with-submenu {
    position: relative;
}

.top-menu-submenu {
    width: 270px;
    padding-top: 22px;
    position: absolute;
    top: 100%;
    left: calc(50% + 30px);
    transform: translateX(-50%);
    display: none;
}

.top-menu-submenu:before {
    content: '';
    border: 14px solid transparent;
    border-bottom-color: #0082ff;
    position: absolute;
    bottom: calc(100% - 28px);
    left: 50px;
}

.top-menu-submenu ul {
    border-radius: 5px;
    background: #0082FF;
    padding: 16px 0;
    list-style: none;
}

.top-menu-nav-item-profile .top-menu-submenu {
    left: auto;
    right: -50px;
    transform: none;
}

.top-menu-nav-item-profile .top-menu-submenu:before {
    left: auto;
    right: 75px;
}

.top-menu-submenu li a {
    display: block;
    padding: 8px 30px;
    color: #FFF;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    transition: .4s;
    position: relative;
}

.top-menu-submenu li a:hover {
    background: #6CB2F5;
    text-decoration: none;
}

.top-menu-submenu li a:before {
    content: '';
    --s: 15px;
    width: var(--s);
    height: var(--s);
    position: absolute;
    right: 35px;
    top: 50%;
    transform: translateY(-50%);
    background-image: url("data:image/svg+xml,%3Csvg width='15' height='16' viewBox='0 0 15 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 7C0.447715 7 4.82823e-08 7.44772 0 8C-4.82823e-08 8.55228 0.447715 9 1 9L1 7ZM14.7071 8.70711C15.0976 8.31658 15.0976 7.68342 14.7071 7.29289L8.34315 0.928933C7.95262 0.538408 7.31946 0.538408 6.92893 0.928933C6.53841 1.31946 6.53841 1.95262 6.92893 2.34315L12.5858 8L6.92893 13.6569C6.53841 14.0474 6.53841 14.6805 6.92893 15.0711C7.31946 15.4616 7.95262 15.4616 8.34315 15.0711L14.7071 8.70711ZM1 9L14 9L14 7L1 7L1 9Z' fill='white'/%3E%3C/svg%3E%0A");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0;
    transition: opacity .4s, right .6s;
}

.top-menu-submenu li a:hover:before {
    opacity: 1;
    right: 20px;
}


/* Theme toggler */
.top-menu-switch-theme {
    width: 26px;
    height: 85px;
    border-radius: 30px;
    background-color: #E2F1FF;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 3px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.switch-theme-icon {
    flex: 1;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 1;
    position: relative;
}

.switch-theme-icon--day {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.0001 14.092C12.2594 14.092 14.091 12.2604 14.091 10.0011C14.091 7.74172 12.2594 5.91016 10.0001 5.91016C7.74074 5.91016 5.90918 7.74172 5.90918 10.0011C5.90918 12.2604 7.74074 14.092 10.0001 14.092Z' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10 1V2.63636' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10 17.3633V18.9996' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M3.63452 3.63477L4.79634 4.79658' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M15.2036 15.2031L16.3654 16.3649' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M1 10H2.63636' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M17.3635 10H18.9999' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M3.63452 16.3649L4.79634 15.2031' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M15.2036 4.79658L16.3654 3.63477' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.switch-theme-icon--night {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19 10.8108C18.8424 12.5166 18.2022 14.1423 17.1543 15.4975C16.1065 16.8528 14.6944 17.8816 13.0832 18.4636C11.4719 19.0456 9.72832 19.1566 8.05629 18.7838C6.38426 18.411 4.85298 17.5697 3.64164 16.3584C2.43031 15.147 1.589 13.6157 1.21618 11.9437C0.843359 10.2717 0.954435 8.52805 1.53641 6.91685C2.11839 5.30564 3.1472 3.8935 4.50246 2.84567C5.85772 1.79783 7.48337 1.15764 9.18919 1C8.19048 2.35113 7.7099 4.01585 7.83485 5.69137C7.95979 7.36689 8.68197 8.94191 9.87003 10.13C11.0581 11.318 12.6331 12.0402 14.3086 12.1652C15.9842 12.2901 17.6489 11.8095 19 10.8108Z' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    background-position: bottom;
}

.top-menu-switch-theme:before {
    content: '';
    position: absolute;
    top: calc(-100% + 27px);
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    background: #A6D3FF;
    transition: top .5s ease-in-out;
}

.night-mode .top-menu-switch-theme:before {
    top: calc(100% - 27px);
}

@media (max-width: 1399px) {
    :root {
        --pt: 84px;
    }

    .top-menu {
        padding: 8px 42px;
    }

    .top-menu-logo img {
        width: 200px;
    }

    .top-menu-right {
        gap: 16px;
    }

    .top-menu-nav-link {
        padding-bottom: 6px;
    }

    .top-menu-nav-icon {
        max-width: 28px;
    }

    .top-menu-nav-link span {
        font-size: 14px;
    }

    .top-menu-nav-item-profile .top-menu-nav-icon-wrapper {
        width: 68px;
        height: 68px;
    }

    .top-menu-nav-item-profile {
        margin-left: 16px;
    }

    /* Submenu */

    .top-menu-submenu {
        width: 216px;
        padding-top: 18px;
        left: calc(50% + 26px);
    }

    .top-menu-submenu:before {
        border-width: 11px;
        bottom: calc(100% - 22px);
        left: 40px;
    }

    .top-menu-submenu ul {
        border-radius: 5px;
        padding: 12px 0;
    }

    .top-menu-nav-item-profile .top-menu-submenu {
        right: -40px;
    }

    .top-menu-nav-item-profile .top-menu-submenu:before {
        right: 60px;
    }

    .top-menu-submenu li a {
        padding: 6px 24px;
        font-size: 16px;
    }

    .top-menu-submenu li a:before {
        --s: 12px;
        right: 28px;
    }

    .top-menu-submenu li a:hover:before {
        right: 16px;
    }

    /* Theme toggler */
    .top-menu-switch-theme {
        width: 21px;
        height: 68px;
        border-radius: 30px;
        padding: 2px;
    }

    .top-menu-switch-theme:before {
        top: calc(-100% + 22px);
    }

    .night-mode .top-menu-switch-theme:before {
        top: calc(100% - 22px);
    }
}

@media (max-width: 999px) {
    :root {
        --pt: 71px;
    }

    .top-menu {
        padding: 8px 16px;
    }

    .top-menu-left {
        display: none;
    }

    .top-menu-right {
        flex: auto;
    }

    .top-menu-nav-icon {
        max-width: 20px;
    }

    .top-menu-nav-item-profile .top-menu-nav-icon-wrapper {
        width: 50px;
        height: 50px;
    }

    .top-menu-switch-theme {
        width: 20px;
        height: 55px;
        border-radius: 30px;
        padding: 2px;
    }

    .top-menu-submenu {
        width: 160px;
        padding-top: 18px;
        left: calc(50% + 28px);
    }

    .top-menu-submenu li a {
        padding: 6px 16px;
        font-size: 14px;
    }
}

@media (min-width: 769px) {
    :has(.gc-user-user) #gcAccountUserMenu {
        display: none;
    }

    .gc-main-content:not(.gc-user-user) .top-menu {
        left: 70px;
    }

    .gc-main-content.with-left-menu.gc-user-user {
        margin: 0;
    }
}

@media (max-width: 768px) {
    :root {
        --pt: 0;
    }

    .top-menu {
        display: none;
    }
}



/*скрываем меню покупки*/
.top-menu-nav-item.menu_purchase {
display: none;
}

.global-xdget-editor,
.gc-page-nav-items-menu.lt-page-edit-link {
padding-top: var(--pt);
}
/* ------------- 
content finish - style
------------- */

/* ------------- 
content start - css скрипт для счётчика
------------- */

/* иконка остаётся якорем */
.top-menu .top-menu-nav-icon-wrapper {
  position: relative;
}

/* бейдж у правого НИЖНЕГО угла конверта */
.top-menu .conversations-counter--in-menu {
  position: absolute;
  top: auto;        /* сбрасываем верхнюю привязку */
  left: auto;
  right: 0;         /* прижимаем к правому-нижнему углу */
  bottom: 0;

  /* лёгкий вынос наружу, чтобы бейдж «сидел на углу» */
  transform: translate(40%, 0%); /* подстрой: 25–45% */

  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #E53935;
  color: #fff;
  font-size: 12px;
  line-height: 18px;
  font-weight: 700;
  text-align: center;
  box-shadow: 0 0 0 2px #fff;
  pointer-events: none;
  z-index: 2;
}

@media (max-width: 420px) {
  .top-menu .conversations-counter--in-menu {
    min-width: 16px;
    height: 16px;
    font-size: 11px;
    line-height: 16px;
    transform: translate(30%, 30%); /* чуть ближе на маленьких экранах */
  }
}

/* ------------- 
content finish - css скрипт для счётчика
------------- */
