/* --------------------------------- */
/* ESTILOS GENERALES */
/* --------------------------------- */
.phone-banner {
    display: block;
    margin: auto;
}

.link-phone-banner-movil {
    display: none; /* oculto por defecto */
    text-decoration: none;
}

/* --------------------------------- */
/* DESKTOP (>1200px) */
/* --------------------------------- */
@media (min-width: 1200px) {
    #header .user-info {
        -ms-flex-preferred-size: 25%;
        flex-basis: 12%;
    }

    /* Imagen grande desktop */
    .link-phone-banner {
        display: block;
        width: 25%;
    }

    /* Móvil oculto en desktop */
    .link-phone-banner-movil {
        display: none;
    }
}

/* --------------------------------- */
/* MOBILE (<=1199px) */
/* --------------------------------- */
@media (max-width: 1199px) {

    /* Ocultar versión desktop */
    .link-phone-banner {
        display: none;
    }

    /* Mostrar versión móvil */
    .link-phone-banner-movil {
        display: inline-flex;       /* flex horizontal */
        align-items: center;        /* centrado vertical */
        gap: 8px;                   /* espacio entre icono y número */
        background-color: #f28b2e;  /* fondo naranja */
        padding: 5px 10px;
        border-radius: 10px;        /* borde redondeado del <a> */
        color: #fff;                /* texto blanco */
        font-weight: bold;
        font-size: 16px;
        text-decoration: none;
    }

    .link-phone-banner-movil img.phone-banner-icon {
        width: 24px;    /* tamaño del icono */
        height: 24px;
        display: block;
    }

    .link-phone-banner-movil strong {
        display: block;
    }

    /* ---------------------- */
    /* HEADER MÓVIL */
    /* ---------------------- */
    #header .mobile-header .shop-logo {
        margin-bottom: 0px;
    }

    #header .header-nav {
        border-bottom: none !important;
        padding: 0 !important;
    }

    .phone-banner {
        width: 100%;
    }

    .parent-logo-phone {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between; /* o center si quieres */
        gap:20px;
    }

    .parent-logo-phone .shop-logo,
    .parent-logo-phone .phone-parent {
        display: flex;
        align-items: center;
        width:100%;
    }

    #header .mobile-header .mobile-header-top {
        padding: 5px;
    }

    #_mobile_shop-logo {
        margin: 0 !important;
        padding: 0 !important;
    }
}