/*
Theme Name: Uncode Child
Description: Child theme for Uncode theme
Author: Undsgn™
Author URI: http://www.undsgn.com
Template: uncode
Version: 1.0.0
Text Domain: uncode
*/
/* 1. Estilo del círculo y color de fondo original */
.menu-smart .social-icon a.social-menu-link {
    background-color: rgb(184, 222, 226) !important;
    color: #ffffff !important; /* El logo (la f o la cámara) en blanco */
    width: 32px !important;    /* Tamaño del círculo igual a la original */
    height: 32px !important;
    line-height: 32px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 50% !important;
    margin-left: 8px !important; /* Espacio entre los iconos */
    transition: background-color 0.4s ease-in-out !important; /* Transición suave */
    padding: 0 !important; /* Limpia paddings del menú */
}

/* 2. Quitar cualquier borde o sombra que Uncode ponga por defecto */
.menu-smart .social-icon a.social-menu-link i {
    font-size: 16px !important; /* Ajusta el tamaño del logo interior */
    line-height: 1 !important;
}

/* 3. EFECTO HOVER: Transición a negro al pasar el ratón */
.menu-smart .social-icon a.social-menu-link:hover {
    background-color: #000000 !important;
    color: #ffffff !important;
}

/* 4. Ajuste para que el texto de la lista no moleste */
.menu-smart .social-icon {
    display: inline-flex !important;
    vertical-align: middle;
}

/*Modificación del footer, el apartado de "Política de privacidad, ...." modficando
el espaciado entre los elementos además de subrayándolos*/
.site-footer .menu a {
    padding-left: 3px !important;
    padding-right: 3px !important;
    text-decoration: underline;
}

/* =========================================================
   1. OCULTAR LAS FLECHAS ("PIQUITOS") DE DESPLIEGUE E IDIOMA
   ========================================================= */
.menu-smart li.menu-item-has-children > a::after,
.menu-smart li.menu-item-language > a::after,
.menu-smart li > a i.fa-angle-down,
.menu-smart li > a i.fa-angle-right,
.menu-smart i.fa-angle-down,
.menu-smart .arrow-icon {
    display: none !important;
    content: "" !important;
}

/* =========================================================
   2. MENÚ PRINCIPAL: TAMAÑO DE LETRA Y COLOR AL PASAR EL RATÓN
   ========================================================= */
.menu-smart > li > a {
    font-size: 13px !important; 
    letter-spacing: 1.5px !important; 
    text-transform: uppercase !important; 
    transition: color 0.3s ease-in-out !important; 
}

.menu-smart > li > a:hover {
    color: rgb(184, 222, 226) !important;
}

/* =========================================================
   3. SUBMENÚ: CORRECCIÓN (GRIS INICIAL -> BLANCO AL PASAR EL RATÓN)
   ========================================================= */
/* Fondo del contenedor del submenú (ajustalo si lo quieres más o menos oscuro) */
.menu-smart ul.sub-menu, 
.menu-smart ul.dropdown-menu {
    background-color: #1a1a1a !important; /* Fondo oscuro para que el blanco resalte */
}

/* Estado INICIAL del texto (Gris) */
.submenu-dark .menu-smart ul a:not(.block-wrapper-parent *), .submenu-dark .overlay-search {
    color: #888888;
}

/* Estado HOVER del texto (Blanco) */
.submenu-dark .menu-horizontal:not(.menu-sub-enhanced) .menu-smart ul a:not(.block-wrapper-parent *):hover, .submenu-dark .menu-horizontal:not(.menu-sub-enhanced) .menu-smart ul a:not(.block-wrapper-parent *):focus {
color: rgb(255 255 255) !important;
background-color: rgba(255, 255, 255, 0.03) !important;
transition: color 0.3s ease-in-out !important;
}


/* =========================================================
   4. ICONOS DE REDES SOCIALES (Instagram y Facebook)
   ========================================================= */
.menu-smart .social-icon a.social-menu-link {
    background-color: rgb(184, 222, 226) !important; 
    color: #ffffff !important; 
    width: 32px !important;
    height: 32px !important;
    line-height: 32px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 50% !important;
    margin-left: 8px !important;
    transition: background-color 0.4s ease-in-out !important;
    padding: 3px !important;
}

.menu-smart .social-icon a.social-menu-link:hover {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.menu-smart .social-icon a.social-menu-link i {
    font-size: 16px !important;
    line-height: 1 !important;
    margin: 0 !important;
}


.btn-color-negro {
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out !important;
}

.btn-color-negro-btn:not(.btn-hover-nobg):not(.icon-animated):hover{
    background-color: #ffffff !important;
    border-color: #ffffff !important;
    color: #000000 !important; /* Cambiamos el texto a negro para que se vea sobre el fondo blanco */
}

.btn-color-reservar-plz{
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out !important;
}


.btn-color-reservar-plz:not(.btn-hover-nobg):not(.icon-animated):hover{
    background-color: #000000 !important;
    border-color: #000000 !important;
    
}

.btn-color-reservar-plz:not(.btn-flat):not(.btn-hover-nobg):not(.icon-animated):not(.btn-text-skin):hover{
    color: #ffffff !important;
}
@media (max-width: 959px) {
  div#logo-container-mobile {
    display: flex !important;
}
}



/*

-----------------------------------------------
*/
/* FLECHAS DE NAVEGACIÓN TIPO PORTAFOLIO */
.post-navigation {
    display: block !important;
    border-top: 1px solid #ddd !important;
    padding: 40px 0 !important;
}

.nav-links {
    display: flex;
    justify-content: space-between;
}

.nav-previous a, .nav-next a {
    font-family: serif; /* O la fuente que uses */
    font-size: 12px;
    text-transform: uppercase;
    color: #000 !important;
    text-decoration: none !important;
    letter-spacing: 2px;
}

.nav-previous a::before { content: "PREVIOUS PIECE"; display: block; font-size: 10px; color: #999; }
.nav-next a::after { content: "NEXT PIECE"; display: block; font-size: 10px; color: #999; }

ul.menu-smart.menu-mini.sm.top-enhanced-inner.top-enhanced-right li {
    padding: 9px 0px;
}

.top-menu.top-menu-enhanced .row-menu-inner.top-enhanced-between {
    justify-content: space-between;
    align-items: center;
}