/*
   TAMCA-THEME.CSS - Identidad Corporativa TAMCA
   Paleta: Amarillo (#F6CD2E) + Negro (#1A2224)
   Reemplaza el tema azul por defecto de AdminLTE
*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');

:root {
    --tamca-yellow: #F6CD2E;
    --tamca-yellow-80: #F7D75A;
    --tamca-yellow-60: #F9E18A;
    --tamca-yellow-40: #FAEBB8;
    --tamca-yellow-20: #FCF5E6;
    --tamca-yellow-dark: #E6B800;
    --tamca-black: #1A2224;
    --tamca-blue: #335AFF;
    --tamca-gold: #FFA023;
    --tamca-green: #19D43F;
    --tamca-gray: #989BA7;
    --tamca-light: #F6F8FA;
    --tamca-border: #EFEFEF;

    --primary: var(--tamca-yellow);
    --primary-dark: var(--tamca-yellow-dark);
    --dark: var(--tamca-black);
    --info: var(--tamca-blue);
    --success: var(--tamca-green);
    --warning: var(--tamca-gold);
}

/* ==============================
   TIPOGRAFÍA GLOBAL
   ============================== */
body, .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-family: 'Poppins', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* ==============================
   TOP NAVBAR - Fondo amarillo
   ============================== */
.main-header.navbar {
    background: var(--tamca-yellow) !important;
    border-bottom: 2px solid var(--tamca-yellow-dark);
}

.main-header.navbar .nav-link {
    color: var(--tamca-black) !important;
}

.main-header.navbar .nav-link:hover {
    color: #000 !important;
    opacity: 0.8;
}

.main-header.navbar .navbar-brand {
    color: var(--tamca-black) !important;
}

/* User menu text */
.main-header .user-menu .nav-link {
    color: var(--tamca-black) !important;
}

/* Search button in navbar */
.main-header .navbar-search-block .btn {
    color: var(--tamca-black);
}

/* ==============================
   SIDEBAR - Negro (#1A2224)
   ============================== */
.main-sidebar, .main-sidebar::before {
    background-color: var(--tamca-black) !important;
}

.sidebar-dark-primary {
    background-color: var(--tamca-black) !important;
}

.brand-link {
    background-color: rgba(0, 0, 0, 0.2) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.brand-link .brand-image {
    opacity: 1 !important;
}

.nav-sidebar .nav-item > .nav-link {
    color: rgba(255, 255, 255, 0.7) !important;
}

.nav-sidebar .nav-item > .nav-link:hover {
    color: var(--tamca-yellow) !important;
    background-color: rgba(255, 255, 255, 0.05);
}

.nav-sidebar .nav-item > .nav-link.active {
    color: var(--tamca-black) !important;
    background-color: var(--tamca-yellow) !important;
}

.nav-sidebar .nav-item > .nav-link.active i {
    color: var(--tamca-black) !important;
}

.nav-sidebar .nav-item > .nav-link .right-side {
    color: rgba(255, 255, 255, 0.6);
}

.nav-sidebar .nav-treeview > .nav-item > .nav-link {
    color: rgba(255, 255, 255, 0.6) !important;
}

.nav-sidebar .nav-treeview > .nav-item > .nav-link:hover {
    color: var(--tamca-yellow) !important;
}

.nav-sidebar .nav-header {
    color: rgba(255, 255, 255, 0.4) !important;
}

.sidebar .nav-link p {
    font-family: 'Poppins', sans-serif;
}

/* Sidebar user panel */
.sidebar .user-panel {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* ==============================
   BOTONES PRIMARY
   ============================== */
.btn-primary {
    background-color: var(--tamca-yellow) !important;
    border-color: var(--tamca-yellow-dark) !important;
    color: var(--tamca-black) !important;
    font-weight: 700;
    box-shadow: 0 3px 10px rgba(246, 205, 46, 0.3);
}

.btn-primary:hover {
    background-color: var(--tamca-yellow-dark) !important;
    border-color: var(--tamca-yellow-dark) !important;
    color: var(--tamca-black) !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(246, 205, 46, 0.4);
}

.btn-primary:active, .btn-primary:focus {
    background-color: var(--tamca-yellow-dark) !important;
    border-color: var(--tamca-yellow-dark) !important;
    color: var(--tamca-black) !important;
}

.btn-outline-primary {
    border-color: var(--tamca-yellow) !important;
    color: var(--tamca-yellow) !important;
}

.btn-outline-primary:hover {
    background-color: var(--tamca-yellow) !important;
    border-color: var(--tamca-yellow-dark) !important;
    color: var(--tamca-black) !important;
}

/* ==============================
   CARDS
   ============================== */
.card {
    border-radius: 12px !important;
    border: 1px solid rgba(0, 0, 0, 0.04) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
}

.card.card-outline.card-primary {
    border-top: 3px solid var(--tamca-yellow) !important;
}

.card-header {
    border-bottom: 1px solid var(--tamca-border);
}

.card-header h1, .card-header h2, .card-header h3,
.card-header h4, .card-header h5 {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    color: var(--tamca-black);
}

/* ==============================
   AUTH CARD (Login/Register)
   ============================== */
.card-outline.card-primary {
    border-top: 3px solid var(--tamca-yellow) !important;
}

/* ==============================
   LINKS
   ============================== */
a {
    color: var(--tamca-blue);
}

a:hover {
    color: #1a3fcc;
}

/* ==============================
   CONTENT HEADER
   ============================== */
.content-header h1 {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    color: var(--tamca-black);
}

/* ==============================
   DATATABLES
   ============================== */
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: var(--tamca-yellow) !important;
    border-color: var(--tamca-yellow-dark) !important;
    color: var(--tamca-black) !important;
}

table.dataTable thead th {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
}

/* ==============================
   SWEETALERT
   ============================== */
.swal2-popup .swal2-title {
    font-family: 'Poppins', sans-serif;
}

.swal2-popup .swal2-styled.swal2-confirm {
    background-color: var(--tamca-yellow) !important;
    color: var(--tamca-black) !important;
    box-shadow: 0 3px 10px rgba(246, 205, 46, 0.3);
}

/* ==============================
   PRELOADER
   ============================== */
.preloader {
    background-color: var(--tamca-yellow) !important;
}

/* ==============================
   NAV TABS
   ============================== */
.nav-tabs .nav-link.active {
    color: var(--tamca-black) !important;
    border-bottom: 2px solid var(--tamca-yellow) !important;
}

.nav-tabs .nav-link:hover {
    color: var(--tamca-yellow-dark) !important;
}

/* ==============================
   FORM ELEMENTS
   ============================== */
.form-control:focus {
    border-color: var(--tamca-yellow) !important;
    box-shadow: 0 0 0 3px rgba(246, 205, 46, 0.15) !important;
}

/* Custom checkbox */
.custom-control-input:checked ~ .custom-control-label::before {
    border-color: var(--tamca-yellow) !important;
    background-color: var(--tamca-yellow) !important;
}

/* ==============================
   PAGINATION
   ============================== */
.page-item.active .page-link {
    background-color: var(--tamca-yellow) !important;
    border-color: var(--tamca-yellow-dark) !important;
    color: var(--tamca-black) !important;
}

.page-link {
    color: var(--tamca-black);
}

.page-link:hover {
    color: var(--tamca-yellow-dark);
}

/* ==============================
   PROGRESS BARS
   ============================== */
.progress-bar {
    background-color: var(--tamca-yellow) !important;
}

/* ==============================
   BADGE PRIMARY
   ============================== */
.badge-primary {
    background-color: var(--tamca-yellow) !important;
    color: var(--tamca-black) !important;
}

/* ==============================
   LOGIN PAGE CUSTOM
   ============================== */
.login-page-custom .login-sidebar {
    background: linear-gradient(135deg, var(--tamca-yellow) 0%, var(--tamca-yellow-dark) 100%) !important;
}

.login-page-custom .btn-login {
    background: linear-gradient(to right, var(--tamca-yellow), var(--tamca-yellow-dark)) !important;
    color: var(--tamca-black) !important;
    font-weight: 700;
}

.login-page-custom .btn-login:hover {
    box-shadow: 0 10px 20px rgba(246, 205, 46, 0.4) !important;
}

.login-page-custom .form-control-custom:focus {
    border-color: var(--tamca-yellow) !important;
    box-shadow: 0 0 0 0.25rem rgba(246, 205, 46, 0.15) !important;
}

.login-page-custom .has-icon .form-control-custom:focus + .input-icon,
.login-page-custom .has-icon:focus-within .input-icon {
    color: var(--tamca-yellow-dark) !important;
}