/* 
 * TICWorks Brand Colors for Landing Page
 * Centralized from docs/manual-de-marca-ticworks.md 
 */

:root {
    /* Brand Primary Colors */
    --color-brand-primary: #F1AC33; /* Naranja cálido */
    --color-brand-secondary: #078487; /* Azul verdoso oscuro */

    /* Brand Neutral/Background Colors */
    --color-text-main: #353A40; /* Gris oscuro neutro */
    --color-bg-soft: #CADDFF; /* Azul claro */

    /* Brand State/Alert Colors */
    --color-state-danger: #D97941; /* Terracota */
    --color-state-warning: #FCD581; /* Naranja claro */
}

/* SOBRESCRITURA DE CLASES BOOTSTRAP PARA LA LANDING PAGE */

/* --- Primary (Asignado a Naranja cálido #F1AC33) --- */
.bg-primary { background-color: var(--color-brand-primary) !important; }
.text-primary { color: var(--color-brand-primary) !important; }
.border-primary { border-color: var(--color-brand-primary) !important; }
.btn-primary { 
    background-color: var(--color-brand-primary) !important; 
    border-color: var(--color-brand-primary) !important;
    color: #fff !important;
}
.btn-primary:hover { filter: brightness(0.9); }
.btn-outline-primary {
    color: var(--color-brand-primary) !important;
    border-color: var(--color-brand-primary) !important;
}
.btn-outline-primary:hover {
    background-color: var(--color-brand-primary) !important;
    color: #fff !important;
}

/* --- Secondary (Asignado a Azul verdoso oscuro #078487) --- */
.bg-secondary { background-color: var(--color-brand-secondary) !important; }
.text-secondary { color: var(--color-brand-secondary) !important; }
.border-secondary { border-color: var(--color-brand-secondary) !important; }
.btn-secondary { 
    background-color: var(--color-brand-secondary) !important; 
    border-color: var(--color-brand-secondary) !important;
    color: #fff !important;
}
.btn-secondary:hover { filter: brightness(0.9); }
.btn-outline-secondary {
    color: var(--color-brand-secondary) !important;
    border-color: var(--color-brand-secondary) !important;
}
.btn-outline-secondary:hover {
    background-color: var(--color-brand-secondary) !important;
    color: #fff !important;
}

/* --- Dark (Asignado a Gris oscuro neutro #353A40) --- */
.bg-dark { background-color: var(--color-text-main) !important; }
.text-dark { color: var(--color-text-main) !important; }
.border-dark { border-color: var(--color-text-main) !important; }
.btn-dark { 
    background-color: var(--color-text-main) !important; 
    border-color: var(--color-text-main) !important;
    color: #fff !important;
}
.btn-dark:hover { filter: brightness(0.9); }

/* --- Info (Asignado a Azul claro #CADDFF) --- */
.bg-info { background-color: var(--color-bg-soft) !important; }
.text-info { color: var(--color-bg-soft) !important; }
.border-info { border-color: var(--color-bg-soft) !important; }

/* --- Danger (Asignado a Terracota #D97941) --- */
.bg-danger { background-color: var(--color-state-danger) !important; }
.text-danger { color: var(--color-state-danger) !important; }
.border-danger { border-color: var(--color-state-danger) !important; }

/* --- Warning (Asignado a Naranja claro #FCD581) --- */
.bg-warning { background-color: var(--color-state-warning) !important; }
.text-warning { color: var(--color-state-warning) !important; }
.border-warning { border-color: var(--color-state-warning) !important; }

/* Estilos adicionales para componentes de landing (Paginación) */
.pagination {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin: 20px 0;
}

.pagination a, .pagination span {
    text-decoration: none;
    color: var(--color-brand-primary); /* Color del texto */
    background: var(--color-text-main); /* Color de fondo de los enlaces */
    border-radius: 5px;
    padding: 10px 15px;
    margin: 0 5px;
    font-size: 12px;
    transition: background 0.3s ease, color 0.3s ease;
}

.pagination a:hover {
    background: var(--color-brand-primary); /* Color de fondo al pasar el mouse */
    color: var(--color-text-main); /* Color del texto al pasar el mouse */
}

.pagination .active, .pagination .current {
    background: var(--color-brand-primary); /* Color de fondo del enlace activo */
    color: var(--color-text-main); /* Color del texto del enlace activo */
    font-weight: bold;
}

.pagination a:disabled, .pagination .disabled {
    background: #b0b0b0; /* Color de fondo para enlaces deshabilitados */
    color: #666666; /* Color del texto para enlaces deshabilitados */
    cursor: not-allowed;
}

.pagination a:disabled:hover, .pagination .disabled:hover {
    background: #b0b0b0; /* Color de fondo para enlaces deshabilitados en hover */
    color: #666666;
}

/* Correcciones para Blog de Noticias y Formulario de Contacto en Landing Page */
.bg-menu-bar { 
    background-color: var(--color-brand-primary) !important; 
    color: var(--color-text-main) !important;
}

.input-form, .textarea-form, .btn-form {
    background-color: var(--color-brand-primary) !important;
    color: var(--color-text-main) !important;
    border-color: var(--color-brand-primary) !important;
}

.input-form::placeholder, .textarea-form::placeholder {
    color: var(--color-text-main) !important;
    opacity: 0.7;
}

.btn-form:hover {
    filter: brightness(0.9);
}

/* --- Vacancies Section Redesign --- */
.vacancy-header-container {
    padding: 3rem 0 1rem;
    position: relative;
    text-align: center;
}

.vacancy-badge-apply {
    background-color: var(--color-brand-primary);
    color: #ffffff !important;
    padding: 8px 30px;
    border-radius: 40px;
    font-weight: 500;
    font-size: 24px;
    display: inline-block;
    margin-bottom: 0.5rem;
}

.vacancy-title-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.vacancy-title-container h2 {
    font-size: 42px;
    font-weight: 300;
    color: var(--color-text-main);
    margin: 0;
}

/* Specificity boost to override Bootstrap defaults */
div.vacancy-card.card-job {
    background-color: #ffffff !important;
    border: 2px solid var(--color-brand-secondary) !important;
    border-radius: 2rem !important;
    margin-bottom: 1rem !important;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}

div.vacancy-card.card-job:hover {
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    border-color: var(--color-brand-primary) !important;
}

div.vacancy-card.card-job .card-body {
    padding: 1.5rem;
}

div.vacancy-detail-container, #details_job.vacancy-detail-container {
    border: 2px solid var(--color-brand-secondary) !important;
    border-radius: 2rem !important;
    padding: 2.5rem;
    height: 100%;
    background-color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

.vacancy-person-img {
    max-height: 180px;
    width: auto;
    border-radius: 50%;
}

.vacancy-person-container {
    position: absolute;
    right: 5%;
    top: -20px;
    z-index: 5;
}

.vacancy-briefcase-img {
    height: 70px;
    width: auto;
}

@media (max-width: 767px) {
    .vacancy-badge-apply {
        font-size: 16px;
        padding: 8px 22px;
    }

    .vacancy-title-container {
        flex-direction: column;
        gap: 0.75rem;
        text-align: center;
    }

    .vacancy-title-container h2 {
        font-size: 26px;
        line-height: 1.15;
        text-align: center;
        max-width: 260px;
    }

    .vacancy-briefcase-img {
        height: 48px;
    }
}