/* ============================================================
   DISEÑO FINAL MEDIC PIEL - COMPACTO Y PROFESIONAL
   ============================================================ */

/* --- 1. CABECERA (Header) --- */
header {
    background-color: #ffffff !important;
    padding-top: 10px !important;    /* Reducimos espacio superior */
    padding-bottom: 5px !important;  /* Reducimos espacio inferior */
    border-bottom: 1px solid #f2f2f2;
}

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

#logo img {
    max-height: 100px !important;    /* Mantenemos tu tamaño ajustado que se ve bien */
    width: auto;
    display: inline-block;
    transition: transform 0.3s ease;
}

/* Alineación de buscador y carrito con el nuevo tamaño del logo */
#search {
    margin-top: 30px !important;
}

#cart {
    margin-top: 30px !important;
}

/* --- 2. MENÚ DE NAVEGACIÓN (Pegado al logo) --- */
#menu {
    background-color: #ffffff !important;
    background-image: none !important;
    border-top: 1px solid #f0f0f0 !important;
    border-bottom: 3px solid #E089B3 !important; /* Rosa Medic Piel */
    border-left: none !important;
    border-right: none !important;
    min-height: 40px !important;
    margin-top: 5px !important; /* Espacio mínimo entre logo y menú */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.03);
}

#menu .nav > li > a {
    color: #423d3d !important; 
    font-weight: 600;
    text-shadow: none !important;
    padding: 10px 20px !important;
}

#menu .nav > li > a:hover {
    color: #E089B3 !important; 
    background: transparent !important;
}

/* --- 3. BOTONES (Rosa Medic Piel) --- */
.btn-primary {
    background-color: #E089B3 !important;
    border-color: #d479a4 !important;
    color: #ffffff !important;
    text-shadow: none !important;
    font-weight: bold;
    text-transform: uppercase;
}

.btn-primary:hover {
    background-color: #423d3d !important;
}

/* --- 4. PIE DE PÁGINA (Footer) --- */
footer {
    background-color: #423d3d !important;
    color: #ffffff !important;
    border-top: 5px solid #E089B3;
    padding-top: 30px;
}

footer h5 {
    color: #E089B3 !important;
    text-transform: uppercase;
}

footer a { color: #ccc !important; }
footer a:hover { color: #E089B3 !important; }

/* --- 5. AJUSTE PARA MÓVILES --- */
@media (max-width: 767px) {
    #logo img { max-height: 70px !important; }
    #search, #cart { margin-top: 10px !important; }
}

/* --- Eliminar el texto de "Sin IVA" en toda la tienda --- */
.price-tax {
    display: none !important;
}