/* Estilos globales para Nexo Barrial */
:root {
    --bg-color-base: #cfc9c2;
}

/* Paleta de colores oficiales del proyecto (Clases Semánticas) */
/* Color 1: Pizarrón Gris/Negro Rústico */
.bg-pizarron-gris {
    background-color: #2F2F2F !important;
}

.text-pizarron-gris {
    color: #2F2F2F !important;
}

/* Color 2: Verde Pizarrón */
.bg-pizarron-verde {
    background-color: #4F8A5B !important;
}

.text-pizarron-verde {
    color: #4F8A5B !important;
}

/* Color 3: Azul Pizarrón */
.bg-pizarron-azul {
    background-color: #3D6F8E !important;
}

.text-pizarron-azul {
    color: #3D6F8E !important;
}

/* Color 4: Naranja Pizarrón */
.bg-pizarron-naranja {
    background-color: #D97732 !important;
}

.text-pizarron-naranja {
    color: #D97732 !important;
}

/* Color 5: Arena/Papel Base */
.bg-papel-arena {
    background-color: #CFC9C2 !important;
}

.text-papel-arena {
    color: #CFC9C2 !important;
}

/* Color 6: Papel Claro Crema */
.bg-papel-crema {
    background-color: #F7F3EC !important;
}

.text-papel-crema {
    color: #F7F3EC !important;
}

/* Color 7: Papel Claro Tiza */
.bg-papel-tiza {
    background-color: #f6f3ed !important;
}

.text-papel-tiza {
    color: #f6f3ed !important;
}

/* Color 8: Verde Claro Menta */
.bg-tiza-menta {
    background-color: #87dbb9 !important;
}

.text-tiza-menta {
    color: #87dbb9 !important;
}

/* Color 9: Amarillo Tiza */
.bg-tiza-amarillo {
    background-color: #fcc60c !important;
}

.text-tiza-amarillo {
    color: #fcc60c !important;
}

/* Color 10: Naranja Tiza/Salmón */
.bg-tiza-salmon {
    background-color: #fc8e76 !important;
}

.text-tiza-salmon {
    color: #fc8e76 !important;
}

/* Compatibilidad de clases antiguas
.color1 { background-color: #2F2F2F !important; color: #ffffff; }
.color2 { background-color: #4F8A5B !important; color: #ffffff; }
.color3 { background-color: #3D6F8E !important; color: #ffffff; }
.color4 { background-color: #D97732 !important; color: #ffffff; }
.color5 { background-color: #CFC9C2 !important; }
.color6 { background-color: #F7F3EC !important; }
.color7 { background-color: #f6f3ed !important; }
.color8 { background-color: #87dbb9 !important; }
.color9 { background-color: #fcc60c !important; }
.color10 { background-color: #fc8e76 !important; }

/* Color de Bienvenida y Contacto Público */
.bg-papel-calido {
    background-color: #EFE7D4 !important;
}

.text-papel-calido {
    color: #EFE7D4 !important;
}

/* Verde Oscuro de Marca para alto contraste */
.text-nb-verde-oscuro {
    color: #034f34 !important;
}

body {
    background-color: var(--bg-color-base) !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

[x-cloak] {
    display: none !important;
}

/* Estilo global de la barra de navegación tradicional */
.home-navbar {
    background-color: #2b1e16 !important;
    /* Tono rústico Madera / Café Oscuro */
    border-bottom: 2px solid #1d140e;
    padding-top: 0.2rem !important;
    padding-bottom: 0.2rem !important;
}

/* Logotipo Tradicional "OFERTA Barrial" */
.logo-tradicional {
    font-family: 'Outfit', sans-serif;
    font-weight: 800;
    /* Extra Bold */
    color: #1a2f22 !important;
    /* Verde bosque */
    font-size: 1.45rem;
    letter-spacing: -0.5px;
    line-height: 1;
    text-transform: uppercase;
}

.logo-texto-barrial {
    font-family: 'Caveat', cursive;
    color: #e36a28;
    /* Naranja teja */
    font-size: 1.85rem;
    font-weight: 700;
    margin-left: 2px;
    text-transform: none;
    /* Conserva la cursiva original */
    display: inline-block;
    transform: rotate(-2deg);
}

.logo-texto-marca {
    position: relative;
    padding-bottom: 5px;
}

.logo-texto-marca::after {
    content: "";
    position: absolute;
    left: 2%;
    bottom: -1px;
    width: 96%;
    height: 6px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 10' preserveAspectRatio='none'><path d='M 1 5 C 30 2, 70 8, 99 5 C 70 8, 30 9, 1 6 Z' fill='%231a2f22'/></svg>");
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

/* Footer global */
.footer-global {
    background-color: #2b1e16;
    border-top: 2px solid #1d140e;
}

.footer-copy {
    color: #a89880;
    font-size: 0.8rem;
}

/* Ajuste de escala para el logo completo en formularios */
.form-logo-completo {
    height: 40px;
    width: auto;
    max-width: 220px;
    object-fit: contain;
}

/* Clases utilitarias del sistema */
.cursor-pointer {
    cursor: pointer !important;
}

/* Medio corazón lleno (recorta visualmente el 50% derecho del corazón) */
.fa-heart-half {
    display: inline-block;
    clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%);
}