/* ==========================================================
   CASA MIXTECO
   CMX-11C · HEADER PC · DISEÑO Y MEDIDAS

   CONTROLA:
   - Fondo del header PC
   - Altura
   - Ancho máximo
   - Distribución izquierda / centro / derecha
   - Segunda fila de navegación

   NO CONTROLA:
   - Logo
   - Buscador
   - Cuenta
   - Carrito
   - Categorías
   - Header móvil
   ========================================================== */


/* ==========================================================
   HEADER COMPLETO
   ========================================================== */

.cmx-header-pc {
    position: relative;
    z-index: var(--cmx-z-header, 1000);

    width: 100%;

    background-color: var(--cmx-azul, #0000A6);
    color: var(--cmx-blanco, #FFFFFF);
}


/* ==========================================================
   PRIMERA FILA
   ========================================================== */

.cmx-header-pc__main {
    width: 100%;
    background-color: var(--cmx-azul, #0000A6);
}


/* ==========================================================
   CONTENEDOR INTERIOR
   ========================================================== */

.cmx-header-pc__inner {
    width: 100%;
    max-width: 1200px;

    min-height: 68px;

    margin: 0 auto;
    padding: 10px 16px;

    display: grid;

    grid-template-columns:
        180px
        minmax(400px, 1fr)
        180px;

    align-items: center;

    column-gap: 24px;

    box-sizing: border-box;
}


/* ==========================================================
   ZONA IZQUIERDA
   FUTURO: LOGO
   ========================================================== */

.cmx-header-pc__left {
    min-width: 0;

    display: flex;
    align-items: center;
    justify-content: flex-start;
}


/* ==========================================================
   ZONA CENTRAL
   FUTURO: BUSCADOR
   ========================================================== */

.cmx-header-pc__center {
    width: 100%;
    min-width: 0;

    display: flex;
    align-items: center;
}


/* ==========================================================
   ZONA DERECHA
   FUTURO: CUENTA + CARRITO
   ========================================================== */

.cmx-header-pc__right {
    min-width: 0;

    display: flex;
    align-items: center;
    justify-content: flex-end;
}


/* ==========================================================
   SEGUNDA FILA
   FUTURO: CATEGORÍAS
   ========================================================== */

.cmx-header-pc__nav {
    width: 100%;
    min-height: 32px;

    background-color: #000080;
}


/* ==========================================================
   NO MOSTRAR HEADER PC EN MÓVIL
   El header móvil se construirá después por separado.
   ========================================================== */

@media (max-width: 768px) {

    .cmx-header-pc {
        display: none;
    }

}