/**
 * TQ AGRO - Estilos Personalizados
 * =====================================
 * Archivo para estilos CSS personalizados del proyecto
 * No modificar los archivos CSS base del tema Cuba
 * 
 * @project TQ AGRO E-Learning
 * @version 1.0.0
 * @date 2025-01-14
 */

/* ===========================================
   Variables Personalizadas
   =========================================== */

:root {
    /* Color Principal TQ Agro - Azul */
    --theme-deafult: #105ba9 !important;
    --theme-default: #105ba9 !important;
    
    /* Colores del proyecto TQ AGRO */
    --tq-primary: #105ba9;
    --tq-primary-dark: #0a3d6e;
    --tq-primary-light: #1a7fd4;
    --tq-secondary: #f73164;
    --tq-success: #54ba4a;
    --tq-warning: #ffaa05;
    --tq-info: #16c7f9;
    --tq-danger: #fc4438;
    
    /* Fondos */
    --tq-bg-light: #f8f9fa;
    --tq-bg-card: #ffffff;
    
    /* Texto */
    --tq-text-dark: #2c323f;
    --tq-text-muted: #6c757d;
}

/* ===========================================
   Sobrescribir Color Principal del Tema
   =========================================== */

/* Sidebar */
.page-wrapper .sidebar-main-title h6,
.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-list .sidebar-link.active,
.page-wrapper.horizontal-wrapper .page-body-wrapper .sidebar-wrapper .sidebar-main .sidebar-links > li .sidebar-link:hover,
.page-wrapper.compact-wrapper .page-body-wrapper .sidebar-wrapper .sidebar-main .sidebar-links > li .sidebar-link:hover {
    color: #105ba9 !important;
}

.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-list .sidebar-link.active svg,
.page-wrapper.horizontal-wrapper .page-body-wrapper .sidebar-wrapper .sidebar-main .sidebar-links > li .sidebar-link:hover svg,
.page-wrapper.compact-wrapper .page-body-wrapper .sidebar-wrapper .sidebar-main .sidebar-links > li .sidebar-link:hover svg {
    stroke: #105ba9 !important;
}

/* Botones Primary */
.btn-primary {
    background-color: #105ba9 !important;
    border-color: #105ba9 !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: #0a3d6e !important;
    border-color: #0a3d6e !important;
}

.btn-outline-primary {
    color: #105ba9 !important;
    border-color: #105ba9 !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    background-color: #105ba9 !important;
    border-color: #105ba9 !important;
    color: #fff !important;
}

/* Links */
a {
    color: #105ba9;
}

a:hover {
    color: #0a3d6e;
}

/* Textos */
.txt-primary,
.text-primary {
    color: #105ba9 !important;
}

/* Backgrounds */
.bg-primary {
    background-color: #105ba9 !important;
}

/* Badges */
.badge-primary,
.badge.bg-primary {
    background-color: #105ba9 !important;
}

/* Progress bars */
.progress-bar {
    background-color: #105ba9;
}

/* Form controls focus */
.form-control:focus,
.form-select:focus {
    border-color: #105ba9;
    box-shadow: 0 0 0 0.2rem rgba(16, 91, 169, 0.25);
}

/* Checkbox y Radio */
.checkbox-primary input[type="checkbox"]:checked + label::before,
.radio-primary input[type="radio"]:checked + label::before {
    background-color: #105ba9;
    border-color: #105ba9;
}

/* Nav tabs activos */
.nav-tabs .nav-link.active,
.nav-pills .nav-link.active {
    background-color: #105ba9;
    border-color: #105ba9;
}

/* Pagination */
.page-item.active .page-link {
    background-color: #105ba9;
    border-color: #105ba9;
}

.page-link {
    color: #105ba9;
}

/* Cards con bordes primarios */
.card.border-primary {
    border-color: #105ba9 !important;
}

/* Switches */
.form-switch .form-check-input:checked {
    background-color: #105ba9;
    border-color: #105ba9;
}

/* Header */
.page-header .header-wrapper .nav-right .mode svg {
    stroke: #105ba9;
}

/* Loader */
.loader-wrapper .loader {
    border-top-color: #105ba9;
}

/* ===========================================
   Estilos Generales
   =========================================== */

.alert i,
.alert svg {
    width: 18px;
    height: 18px;
    margin-right: 8px;
    vertical-align: middle;
}

/* ===========================================
   Login Personalizado
   =========================================== */

.login-card {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-card .login-main {
    max-width: 450px;
    width: 100%;
}

.login-card .login-main h4 {
    color: var(--fc-text-dark);
    font-weight: 600;
    margin-bottom: 5px;
}

.login-card .login-main p {
    color: var(--fc-text-muted);
    margin-bottom: 25px;
}

.login-card .login-main .form-group {
    margin-bottom: 20px;
}

.login-card .login-main .link {
    color: var(--fc-primary);
    font-size: 14px;
    float: right;
    margin-top: 10px;
}

.login-card .login-main .link:hover {
    text-decoration: underline;
}

.login-card .logo img {
    max-height: 80px;
    margin-bottom: 0px;
}

/* Imagen lateral del login */
.bg-img-cover {
    background-size: cover;
    background-position: center;
    min-height: 100vh;
    width: 100%;
    object-fit: cover;
}

/* ===========================================
   Header Personalizado
   =========================================== */


/* ===========================================
   Sidebar Personalizado
   =========================================== */


/* ===========================================
   Cards Personalizadas
   =========================================== */


/* ===========================================
   Tablas Personalizadas
   =========================================== */


/* ===========================================
   Formularios Personalizados
   =========================================== */


/* ===========================================
   Responsive
   =========================================== */