/* Ajustes del menu del sitio publico.
 *
 * Van en esta hoja y no en menustyle.css porque esa se sirve desde el almacenamiento de Azure
 * (imagenes.inmobiliaticaweb.com) y no viaja en el despliegue: tocarla ahi es un tramite aparte y
 * queda fuera del repositorio. Esta se sirve desde el propio sitio, se publica con todo lo demas y
 * se carga despues, asi que gana.
 */

/* El menu iba pegado a la izquierda porque cada opcion flota a la izquierda. Centrado queda
   equilibrado con el logo, y cuando no entra en una linea la segunda tambien queda centrada en vez
   de dejar una opcion suelta contra el margen. */
header.navbar #menu-main-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    float: none;
}

header.navbar #menu-main-menu > li {
    float: none;
}

/* Site.css le pone al encabezado una altura fija de 30px, y cada opcion del menu mide 50px de alto.
   Mientras el menu entra en una linea no se nota, pero si se parte -una inmobiliaria con muchas
   operaciones, o una pantalla un poco mas angosta- la segunda linea cae afuera de la franja del
   encabezado y queda escrita encima de la foto de portada.
   Se comprobo que con el menu en una linea no cambia absolutamente nada. */
header.navbar#MenuPrincipal {
    height: auto;
    min-height: 30px;
}

/* ---------------------------------------------------------------- datos de contacto
 *
 * WhatsApp y los telefonos son lo que usa alguien a punto de consultar, asi que se ven mas que el
 * resto. Antes eran lo mas chico del encabezado y estaban debajo de los iconos de redes. */
.DatosTop li.contactoPrincipal {
    font-size: 1.12em;
    font-weight: 700;
}

.DatosTop li.contactoPrincipal a {
    text-decoration: none;
    color: inherit;
}

.DatosTop li.contactoPrincipal a:hover {
    text-decoration: underline;
}

.DatosTop li.contactoPrincipal .fab.fa-whatsapp {
    color: #25D366;
}

/* El correo va en un escalon abajo: sigue estando, pero no compite con el telefono. */
.DatosTop li.contactoSecundario {
    font-size: 0.9em;
    opacity: .75;
}

.DatosTop li.contactoSecundario a {
    text-decoration: none;
    color: inherit;
}

.DatosTop li.contactoSecundario a:hover {
    text-decoration: underline;
}

/* La letra queda en su tamano de siempre: achicarla la dejaba mas chica que el resto del
   encabezado. Lo que se achica es el aire entre opciones.
 *
 * Medido en el navegador sobre la inmobiliaria de 5 operaciones -el maximo, que solo tienen 15 de
 * las 343- en una pantalla de 1280: con los 12px de cada lado que habia, el menu pide 1177px y
 * solo hay 1140, o sea que se pasa por 37px y la ultima opcion cae sola a un segundo renglon. Con
 * 8px pide 1105px y entra con 35px de sobra. */
header.navbar #menu-main-menu > li > a {
    padding-left: 8px;
    padding-right: 8px;
}

/* Las opciones con submenu llevan una flechita que menustyle.css pone en position:absolute a 6px
   del borde derecho. Con 8px de relleno se le montaba encima a la ultima letra. Con 20px queda un
   espacio de verdad entre la palabra y la flechita: con 16px entraba, pero seguia pegada. */
header.navbar #menu-main-menu > li.menu-item-has-children > a {
    padding-right: 20px;
}

/* ---------------------------------------------------------------- los submenus
 *
 * Cada opcion del submenu media 50px de alto. Con un submenu de diez opciones -Venta suele tenerlas-
 * son 500px, y en una pantalla de notebook el final del submenu se va abajo del borde y no hay forma
 * de llegar a las ultimas opciones. A 34px las mismas diez entran en 340px, y siguen siendo un
 * blanco comodo para el mouse. */
header.navbar .navbar-nav > ul > li .sub-menu li a,
header.navbar nav > div > ul > li .sub-menu li a {
    line-height: 34px;
}

@media (min-width: 768px) {
    header.navbar .navbar-nav > ul > li .sub-menu li a,
    header.navbar nav > div > ul > li .sub-menu li a {
        padding: 0 20px;
    }

    /* Y un techo, para que no dependa de cuantas opciones tenga la inmobiliaria: si no entran en lo
       que queda de pantalla, el submenu se desplaza en vez de seguir de largo hasta perderse abajo
       del borde. Contreras Gonzalez tiene 17 en Venta. */
    header.navbar .navbar-nav > ul > li .sub-menu,
    header.navbar nav > div > ul > li .sub-menu {
        max-height: calc(100vh - 200px);
        overflow-y: auto;
    }
}