/* Panel #LP (LPU / LPD) */

#LP {
    width: 100%;
    min-width: 0;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-sizing: border-box;
}

#LPU {
    flex: 0 0 auto;
    width: calc(100% - 40px);
    margin: 20px;
    position: relative;
}

#LPU_call_incoming {
    position: absolute;
    top: -3px;
    right: -3px;
    z-index: 2;
    width: 40%;
    min-width: 15px;
    aspect-ratio: 1;
    border-radius: 50%;
    border: none;
    padding: 0;
    background-color: #8d87fb;
    background-image: url('../../ico/bt/call-white.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 72%;
    box-shadow: 0 0 0 1px #b7b2ff;
    cursor: pointer;
}

#LPU_call_incoming[hidden] {
    display: none !important;
}

#LPU_call_incoming[data-kind="voice"] {
    background-image: url('../../ico/bt/volume-up-white.svg');
}

#LPU_call_incoming[data-kind="camera"] {
    background-image: url('../../ico/bt/videocam-white.svg');
}

#LPU_call_incoming[data-kind="screen"] {
    background-image: url('../../ico/bt/screen-share-white.svg');
}

#LPU_call_incoming[data-kind="incoming"] {
    background-image: url('../../ico/bt/call-white.svg');
    animation: lpu_call_pulse 1.25s ease-out infinite;
}

#LPU_call_incoming:hover {
    filter: brightness(1.08);
}

@keyframes lpu_call_pulse {
    0% {
        box-shadow: 0 0 0 1px #b7b2ff, 0 0 0 0 rgba(141, 135, 251, 0.55);
        transform: scale(1);
    }
    70% {
        box-shadow: 0 0 0 1px #b7b2ff, 0 0 0 10px rgba(141, 135, 251, 0);
        transform: scale(1.06);
    }
    100% {
        box-shadow: 0 0 0 1px #b7b2ff, 0 0 0 0 rgba(141, 135, 251, 0);
        transform: scale(1);
    }
}

#LPU_logo {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: var(--color-null-element-bg);
    background-image: url('../../ico/logo.svg');
    border: 1px solid var(--color-null-element-border);
    --btn-icon-size: 100%;
    background-size: var(--btn-icon-size);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    border-radius: 100%;
    cursor: pointer;
    overflow: hidden;
    transition: background-size 0.06s ease;
}

#LPU_logo.has-unread,
#LPU_logo.is-waiting {
    overflow: visible;
}

#LPU_logo > .lac_unread_badge {
    top: -2px;
    right: -2px;
    z-index: 4;
}

#LPU_logo:before {
    content: '';
    padding-top: 100%;
    display: block;
    pointer-events: none;
}

/* Ожидание ответа Go: четверть обводки вокруг лого */
#LPU_logo.is-waiting::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #ffffffad;
    box-sizing: border-box;
    pointer-events: none;
    animation: ifm_lpu_wait_spin 0.85s linear infinite;
}

@keyframes ifm_lpu_wait_spin {
    to {
        transform: rotate(360deg);
    }
}

#LPD {
    flex: 0 1 auto;
    min-height: 0;
    padding: 0 20px;
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

#LPD::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

#LPD_list,
#LPD_list_p,
#LPD_actions,
#LPD_news {
    width: 100%;
    height: auto;
    margin-bottom: 20px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    overflow: visible;
    border: 2px dashed var(--color-null-element-border);
    border-radius: 100px;
    box-sizing: border-box;
}

#LPD_list[hidden],
#LPD_list_p[hidden],
#LPD_list_p[have_items="0"],
#LPD_news[hidden],
#LPD_news[have_items="0"] {
    display: none !important;
}

#LPD_list_content,
#LPD_list_p_content,
#LPD_news_content {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    overflow: visible;
}

#LPD_list_content[have_items="0"] {
    display: none;
}

#LPD_search,
#LPD_create,
#LPD_favorites,
#LPD_feed,
.LPD_action {
    flex: 0 0 auto;
    width: 100%;
    border-radius: 100%;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-null-element-bg);
    background-repeat: no-repeat;
    background-position: center;
    --btn-icon-size: 48%;
    background-size: var(--btn-icon-size);
    cursor: pointer;
    box-sizing: border-box;
    transition: background-size 0.06s ease;
}

#LPD_feed[hidden] {
    display: none !important;
}

#LPD_search::before,
#LPD_create::before,
#LPD_favorites::before,
#LPD_feed::before,
.LPD_action::before {
    content: '';
    display: block;
    padding-top: 100%;
    pointer-events: none;
}

#LPD_search {
    background-image: url('../../ico/bt/search.svg');
}

#LPD_create {
    background-image: url('../../ico/bt/add.svg');
}

#LPD_favorites {
    background-image: url('../../ico/bt/bookmark-white.svg');
}

#LPD_feed {
    background-image: url('../../ico/bt/article.svg');
}

.LPD_project,
.LPD_pin,
.LPD_news_item {
    position: relative;
    flex: 0 0 auto;
    width: 100%;
    border-radius: 100%;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-null-element-bg);
    background-repeat: no-repeat;
    background-position: center;
    --btn-icon-size: 48%;
    background-size: var(--btn-icon-size);
    cursor: pointer;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-radius 0.12s ease;
}

.LPD_project::before,
.LPD_pin::before,
.LPD_news_item::before {
    content: '';
    display: block;
    padding-top: 100%;
    pointer-events: none;
}

.LPD_project-letter,
.LPD_pin-letter,
.LPD_news_item-letter {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 90%;
    font-weight: 600;
    line-height: 1;
    color: var(--color-ui-text);
    opacity: 0.85;
    pointer-events: none;
    user-select: none;
}

.LPD_project:hover,
.LPD_pin:hover,
.LPD_news_item:hover,
#LPD_favorites:hover,
#LPD_feed:hover,
#LPD_search:hover,
#LPD_create:hover {
    border-color: var(--color-lpd-hover-border);
    border-width: 2px;
}

.LPD_project[have_img="1"],
.LPD_pin[have_img="1"],
.LPD_news_item[have_img="1"] {
    background-size: cover;
    background-position: center;
}

.LPD_project[have_img="1"] .LPD_project-letter,
.LPD_pin[have_img="1"] .LPD_pin-letter,
.LPD_news_item[have_img="1"] .LPD_news_item-letter {
    display: none;
}

.LPD_project[active="1"],
.LPD_pin[active="1"],
.LPD_news_item[active="1"] {
    border-color: var(--color-lpd-active-border);
    border-width: 2px;
}

.LPD_pin.is-favorites {
    background-color: #867fcd;
    background-image: url('../../ico/bt/bookmark-white.svg');
    background-size: 58%;
    border-color: rgba(183, 178, 255, 0.55);
}

.LPD_pin.is-favorites .LPD_pin-letter {
    display: none;
}

.LPD_project-voice {
    position: absolute;
    top: -3px;
    right: -3px;
    z-index: 2;
    width: 40%;
    min-width: 15px;
    aspect-ratio: 1;
    border-radius: 50%;
    background-color: #8d87fb;
    background-image: url(../../ico/bt/volume-up-white.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 72%;
    pointer-events: none;
    box-shadow: 0 0 0 1px #b7b2ff;
}

.LPD_project-voice[hidden] {
    display: none !important;
}

.LPD_project > .lac_unread_badge,
.LPD_pin > .lac_unread_badge {
    top: -4px;
    right: -4px;
    z-index: 3;
}

.LPD_pin > .user_panel-status-dot {
    position: absolute;
    right: 1px;
    bottom: 1px;
    width: 15px;
    height: 15px;
    z-index: 2;
    pointer-events: none;
    border: 3px solid var(--color-ui-bg);
    box-shadow: none;
}

.LPD_project[data-voice="1"] > .lac_unread_badge {
    top: auto;
    bottom: -4px;
    right: -4px;
}

.LPD_project_tooltip {
    position: fixed;
    z-index: 1200;
    max-width: 220px;
    padding: 8px 10px;
    border-radius: 6px;
    background: rgba(20, 20, 24, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
    pointer-events: none;
    transform: translateY(-50%);
}

.LPD_project_tooltip[hidden] {
    display: none !important;
}

.LPD_project_tooltip-name {
    font-weight: 600;
    font-size: 92%;
}
