/* ==========================================================
   topbar — الشريط العلوي (أرقام + سوشيال + رسالة التوصيل)
   ========================================================== */

:root {
    --ebmnt1-topbar-background: var(--ebmnt1-color-helper-purple-deep);
    --ebmnt1-topbar-text-color: var(--ebmnt1-color-white);
    --ebmnt1-topbar-icon-color: var(--ebmnt1-color-helper-yellow);
    --ebmnt1-topbar-social-icon-color: var(--ebmnt1-color-white);
    --ebmnt1-topbar-social-background: rgba(255, 255, 255, 0.12);
    --ebmnt1-topbar-social-background-hover: var(--ebmnt1-color-primary);
    --ebmnt1-topbar-divider-color: rgba(255, 255, 255, 0.25);
    --ebmnt1-topbar-font-size: clamp(0.72rem, 0.66rem + 0.3vw, 0.9rem);
}

.ebmnt1-topbar {
    width: 100%;
    display: flex;
    background-color: var(--ebmnt1-topbar-background);
    color: var(--ebmnt1-topbar-text-color);
    font-size: var(--ebmnt1-topbar-font-size);
}

.ebmnt1-topbar__inner {
    width: calc(100% - 1.5em);
    max-width: var(--ebmnt1-layout-max-width);
    margin-inline: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.4em 1em;
    min-height: 2.4rem;
}

.ebmnt1-topbar__message {
    display: none;
    align-items: center;
    gap: 0.5em;
}

.ebmnt1-topbar__message i,
.ebmnt1-topbar__phone i {
    color: var(--ebmnt1-topbar-icon-color);
}

.ebmnt1-topbar__contacts {
    display: flex;
    align-items: center;
    gap: 0.9em;
    flex-wrap: wrap;
}

.ebmnt1-topbar__phone {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    font-weight: 600;
    direction: ltr;
}

.ebmnt1-topbar__phone:hover {
    color: var(--ebmnt1-topbar-icon-color);
}

.ebmnt1-topbar__socials {
    display: flex;
    align-items: center;
    gap: 0.4em;
}

.ebmnt1-topbar__social {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.9em;
    height: 1.9em;
    border-radius: 50%;
    background-color: var(--ebmnt1-topbar-social-background);
    color: var(--ebmnt1-topbar-social-icon-color);
    transition: transform 0.25s ease, background-color 0.25s ease;
}

.ebmnt1-topbar__social:hover {
    background-color: var(--ebmnt1-topbar-social-background-hover);
    transform: translateY(-0.15em) scale(1.1);
}

.ebmnt1-topbar__inner {
    justify-content: center;
}

@media (min-width: 425px) {
    .ebmnt1-topbar__inner {
        justify-content: space-between;
    }
}

@media (min-width: 768px) {
    .ebmnt1-topbar__message {
        display: inline-flex;
    }
}