/**
 * Movingenia Custom Color Palette
 * Based on logo colors
 */

:root {
    /* Colores principales del logo */
    --color-primary: #2B5B88;           /* Azul principal */
    --color-primary-variant: #25598B;   /* Azul variante */
    --color-secondary: #82CA6F;         /* Verde */
    
    /* Colores neutrales */
    --color-text: #111827;              /* Texto principal */
    --color-text-secondary: #6B7280;    /* Texto secundario */
    --color-background: #F8FAFC;        /* Fondo */
    --color-border: #E5E7EB;            /* Bordes */
    
    /* Call to Action */
    --color-cta: #F59E0B;               /* Naranja técnico */
    --color-cta-hover: #D97706;         /* Naranja oscuro para hover */
    
    /* Colores adicionales */
    --color-white: #ffffff;
    --color-black: #000000;
    --color-gray-light: #f5f5f5;
    --color-gray-dark: #333333;
}

/* Aplicación de colores principales */
body {
    color: var(--color-text);
    background-color: var(--color-white);
}

h2 {
    color: var(--color-text);
}

h4 {
    color: var(--color-text);
}

p {
    color: var(--color-text-secondary);
}

a {
    color: var(--color-primary);
}

a:hover {
    color: var(--color-primary-variant);
}

/* Botones CTA con color naranja */
.btn-cta {
    background-color: var(--color-cta) !important;
    border-color: var(--color-cta) !important;
    color: var(--color-white) !important;
    transition: all 0.3s ease;
}

.btn-cta:hover,
.btn-cta:focus {
    background-color: var(--color-cta-hover) !important;
    border-color: var(--color-cta-hover) !important;
    color: var(--color-white) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}

/* Botones primarios con azul */
.btn-primary {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--color-primary-variant) !important;
    border-color: var(--color-primary-variant) !important;
}

/* Botones secundarios con verde */
.btn-secondary {
    background-color: var(--color-secondary) !important;
    border-color: var(--color-secondary) !important;
    color: var(--color-white) !important;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: #6FB85D !important;
    border-color: #6FB85D !important;
}

/* Fondos */
.bg-primary {
    background-color: var(--color-primary) !important;
}

.bg-secondary {
    background-color: var(--color-secondary) !important;
}

.bg-light {
    background-color: var(--color-background) !important;
}

/* Bordes */
.border-primary {
    border-color: var(--color-primary) !important;
}

.border-secondary {
    border-color: var(--color-secondary) !important;
}

.border-light {
    border-color: var(--color-border) !important;
}

/* Textos de colores */
.text-primary {
    color: var(--color-primary) !important;
}

.text-secondary {
    color: var(--color-secondary) !important;
}

.text-muted {
    color: var(--color-text-secondary) !important;
}

/* Destacados y acentos */
.accent-primary {
    color: var(--color-primary);
}

.accent-secondary {
    color: var(--color-secondary);
}

.accent-cta {
    color: var(--color-cta);
}

/* Links especiales */
a.cta-link {
    color: var(--color-cta);
    font-weight: 600;
}

a.cta-link:hover {
    color: var(--color-cta-hover);
    text-decoration: underline;
}