﻿

.custom-size-user-icon {
    width: 36px;
    height: 36px;
}


.border-left-primary {
    border-left: 0.25rem solid #4e73df !important;
}

.border-bottom-primary {
    border-bottom: 0.25rem solid #4e73df !important;
}

.border-left-secondary {
    border-left: 0.25rem solid #858796 !important;
}

.border-bottom-secondary {
    border-bottom: 0.25rem solid #858796 !important;
}

.border-left-success {
    border-left: 0.25rem solid #1cc88a !important;
}

.border-bottom-success {
    border-bottom: 0.25rem solid #1cc88a !important;
}

.border-left-info {
    border-left: 0.25rem solid #36b9cc !important;
}

.border-bottom-info {
    border-bottom: 0.25rem solid #36b9cc !important;
}

.border-left-warning {
    border-left: 0.25rem solid #f6c23e !important;
}

.border-bottom-warning {
    border-bottom: 0.25rem solid #f6c23e !important;
}

.border-left-danger {
    border-left: 0.25rem solid #e74a3b !important;
}

.border-bottom-danger {
    border-bottom: 0.25rem solid #e74a3b !important;
}

.border-left-light {
    border-left: 0.25rem solid #f8f9fc !important;
}

.border-bottom-light {
    border-bottom: 0.25rem solid #f8f9fc !important;
}

.border-left-dark {
    border-left: 0.25rem solid #5a5c69 !important;
}

.border-bottom-dark {
    border-bottom: 0.25rem solid #5a5c69 !important;
}




.text-gray-100 {
    color: #f8f9fc !important;
}

.text-gray-200 {
    color: #eaecf4 !important;
}

.text-gray-300 {
    color: #dddfeb !important;
}

.text-gray-400 {
    color: #d1d3e2 !important;
}

.text-gray-500 {
    color: #b7b9cc !important;
}

.text-gray-600 {
    color: #858796 !important;
}

.text-gray-700 {
    color: #6e707e !important;
}

.text-gray-800 {
    color: #5a5c69 !important;
}

.text-gray-900 {
    color: #3a3b45 !important;
}


.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid #e3e6f0;
    border-radius: .35rem
}

    .card > hr {
        margin-right: 0;
        margin-left: 0
    }

    .card > .list-group {
        border-top: inherit;
        border-bottom: inherit
    }

        .card > .list-group:first-child {
            border-top-width: 0;
            border-top-left-radius: calc(.35rem - 1px);
            border-top-right-radius: calc(.35rem - 1px)
        }

        .card > .list-group:last-child {
            border-bottom-width: 0;
            border-bottom-right-radius: calc(.35rem - 1px);
            border-bottom-left-radius: calc(.35rem - 1px)
        }

        .card > .card-header + .list-group, .card > .list-group + .card-footer {
            border-top: 0
        }

.card-body {
    flex: 1 1 auto;
    min-height: 1px;
    padding: 1.25rem
}

.card-title {
    margin-bottom: .75rem
}

.card-subtitle {
    margin-top: -.375rem;
    margin-bottom: 0
}

.card-text:last-child {
    margin-bottom: 0
}

.card-link:hover {
    text-decoration: none
}

.card-link + .card-link {
    margin-left: 1.25rem
}

.card-header {
    padding: .75rem 1.25rem;
    margin-bottom: 0;
    background-color: #f8f9fc;
    border-bottom: 1px solid #e3e6f0
}

    .card-header:first-child {
        border-radius: calc(.35rem - 1px) calc(.35rem - 1px) 0 0
    }

.card-footer {
    padding: .75rem 1.25rem;
    background-color: #f8f9fc;
    border-top: 1px solid #e3e6f0
}

    .card-footer:last-child {
        border-radius: 0 0 calc(.35rem - 1px) calc(.35rem - 1px)
    }

.card-header-tabs {
    margin-right: -.625rem;
    margin-bottom: -.75rem;
    margin-left: -.625rem;
    border-bottom: 0
}

.card-header-pills {
    margin-right: -.625rem;
    margin-left: -.625rem
}

.card-img-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 1.25rem;
    border-radius: calc(.35rem - 1px)
}

.card-img, .card-img-bottom, .card-img-top {
    flex-shrink: 0;
    width: 100%
}

.card-img, .card-img-top {
    border-top-left-radius: calc(.35rem - 1px);
    border-top-right-radius: calc(.35rem - 1px)
}

.card-img, .card-img-bottom {
    border-bottom-right-radius: calc(.35rem - 1px);
    border-bottom-left-radius: calc(.35rem - 1px)
}

.card-deck .card {
    margin-bottom: .75rem
}




.estadistico-icon-excel {
    font-size: 30px; 
}




.filtros-area-cliente {
    position: relative;
  
 
    
    padding: 20px 15px 20px 30px;
 /*   margin-bottom: 24px;*/
    overflow: visible !important;
}



.filtros-area {
    position: relative;
    padding: 20px 15px 20px 30px;
 /*   margin-bottom: 24px;*/
    overflow: hidden;
  
}


/*Sección créditos por usuario*/
.dashboard-metrics .custom-card-metric {
    background: #fff;
    border-radius: .35rem;
    box-shadow: 0 2px 12px rgba(44,62,80,0.07);
    padding: 1.5rem 1.2rem 1.2rem 1.2rem;
    margin-bottom: 1rem;
    border: 1px solid #e3e6f0;
    min-height: 180px;
    position: relative;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.dashboard-metrics .custom-card-metric:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}
    
.custom-metric-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.4rem;
    margin-bottom: 0.7rem;
}

.dashboard-metrics .custom-mini-chart {
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 14px;
    height: 36px;
    z-index: 0;
    opacity: 0.32;
}

.dashboard-metrics .custom-metric-main {
    position: relative;
    z-index: 2;
}

.dashboard-metrics .custom-metric-trend {
    font-size: 1.05rem;
    font-weight: 500;
    margin-left: 0.4rem;
}

.dashboard-metrics .custom-trend-up {
    color: #00ce7d;
}

.dashboard-metrics .custom-trend-down {
    color: #f1416c;
}


.dashboard-metrics .autocomplete-suggestions {
    position: absolute;
    z-index: 1000;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0 0 .5rem .5rem;
    width: 100%;
    max-height: 200px;
    overflow-y: auto;
    box-shadow: 0 4px 12px rgba(44,62,80,0.07);

}

.dashboard-metrics .autocomplete-suggestion {
    padding: 0.6rem 1rem;
    cursor: pointer;
}

    .dashboard-metrics .autocomplete-suggestion.active, .autocomplete-suggestion:hover {
        background-color: #f8f9fa;
    }