/******************************************************************
 *
 * LeadBuilder Enterprise ERP
 *
 * Dashboard Enterprise v3
 *
 * dashboard_v2.css
 *
 ******************************************************************/

/*************************************************************
    VARIABLES
*************************************************************/

:root{

    --lb-primary:#2563eb;
    --lb-primary-dark:#1d4ed8;

    --lb-success:#16a34a;
    --lb-warning:#f59e0b;
    --lb-danger:#dc2626;
    --lb-info:#0ea5e9;

    --lb-background:#f4f7fb;

    --lb-card:#ffffff;

    --lb-border:#e7edf4;

    --lb-title:#0f172a;

    --lb-text:#475569;

    --lb-muted:#94a3b8;

    --lb-radius:22px;

    --lb-shadow:

        0 12px 35px rgba(15,23,42,.08);

    --lb-transition:.25s ease;

}

/*************************************************************
    GENERAL
*************************************************************/

.lb-dashboard{

    padding:20px;

    background:var(--lb-background);

}

.lb-dashboard *{

    box-sizing:border-box;

}

.lb-dashboard h1,

.lb-dashboard h2,

.lb-dashboard h3,

.lb-dashboard h4,

.lb-dashboard h5{

    margin:0;

    color:var(--lb-title);

}

.lb-dashboard p{

    color:var(--lb-text);

}

/*************************************************************
    HERO
*************************************************************/

.lb-hero{

    position:relative;

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:60px;

    overflow:hidden;

    border-radius:28px;

    padding:24px 36px;

    margin-bottom:18px;

    background:

        linear-gradient(

            135deg,

            #2563eb,

            #1d4ed8,

            #1e3a8a

        );

    color:#fff;

    box-shadow:

        0 30px 60px rgba(37,99,235,.25);

}

.lb-hero:before{

    content:"";

    position:absolute;

    width:420px;

    height:420px;

    border-radius:50%;

    background:

        rgba(255,255,255,.06);

    right:-140px;

    top:-140px;

}

.lb-hero-left{

    position:relative;

    z-index:2;

    flex:1;

}

.lb-hero-right{

    position:relative;

    z-index:2;

    display:flex;

    justify-content:flex-end;

    align-items:center;

}

.lb-badge-premium{

    display:inline-flex;

    align-items:center;

    padding:8px 16px;

    border-radius:30px;

    background:

        rgba(255,255,255,.14);

    color:#fff;

    font-size:12px;

    font-weight:700;

    letter-spacing:2px;

    margin-bottom:18px;

}

.lb-hero-title{

    font-size:42px;

    font-weight:800;

    color:#fff;

}

.lb-hero-subtitle{

    margin-top:10px;

    color:

        rgba(255,255,255,.82);

    font-size:17px;

    line-height:1.7;

}

.lb-hero-number{

    margin-top:30px;

    font-size:46px;

    font-weight:800;

    line-height:1;

    color:#fff;

}

.lb-hero-caption{

    margin-top:10px;

    font-size:18px;

    color:

        rgba(255,255,255,.82);

}

/*************************************************************
    PROGRESS
*************************************************************/

.lb-progress{

    width:320px;

    height:10px;

    margin-top:28px;

    border-radius:50px;

    overflow:hidden;

    background:

        rgba(255,255,255,.18);

}

.lb-progress-bar{

    height:100%;

    border-radius:50px;

    background:#fff;

}

/*************************************************************
    HERO RIGHT
*************************************************************/

.lb-circle-card{

    width:150px;

    height:150px;

    border-radius:50%;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    border:

        8px solid rgba(255,255,255,.12);

    background:

        rgba(255,255,255,.10);

    backdrop-filter:blur(12px);

}

.lb-circle-value{

    font-size:30px;

    font-weight:800;

    color:#fff;

}

.lb-circle-text{

    margin-top:8px;

    font-size:15px;

    color:

        rgba(255,255,255,.80);

    text-align:center;

}
/******************************************************************
    KPI
******************************************************************/

.lb-stat-card{

    position:relative;

    display:flex;

    align-items:center;

    gap:22px;

    background:#fff;

    border-radius:22px;

    padding:28px;

    box-shadow:var(--lb-shadow);

    transition:var(--lb-transition);

    overflow:hidden;

    height:100%;

}

.lb-stat-card:hover{

    transform:translateY(-4px);

    box-shadow:

        0 22px 55px rgba(15,23,42,.12);

}

.lb-stat-card::after{

    content:"";

    position:absolute;

    top:0;

    right:0;

    width:6px;

    height:100%;

    background:linear-gradient(

        to bottom,

        var(--lb-primary),

        var(--lb-primary-dark)

    );

}

.lb-stat-icon{

    width:52px;

    height:52px;

    min-width:52px;

    border-radius:20px;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#fff;

    font-size:22px;

    box-shadow:

        inset 0 0 0 1px rgba(255,255,255,.15);

}

.lb-stat-info{

    flex:1;

}

.lb-stat-title{

    color:#64748b;

    font-size:12px;

    font-weight:600;

    text-transform:uppercase;

    letter-spacing:.6px;

}

.lb-stat-value{

    margin-top:6px;

    font-size:28px;

    font-weight:800;

    color:#0f172a;

    line-height:1;

}

.lb-stat-growth{

    margin-top:8px;

    color:#16a34a;

    font-size:13px;

    font-weight:600;

}

/******************************************************************
    TARJETAS
******************************************************************/

.lb-card{

    background:#fff;

    border:none;

    border-radius:22px;

    box-shadow:var(--lb-shadow);

    overflow:hidden;

    transition:var(--lb-transition);

    height:100%;

}

.lb-card:hover{

    transform:translateY(-2px);

}

.lb-card-header{

    padding:22px 28px;

    border-bottom:1px solid var(--lb-border);

    font-size:18px;

    font-weight:700;

    color:var(--lb-title);

    background:#fff;

}

.lb-card-body{

    padding:28px;

}

/******************************************************************
    BOTONES
******************************************************************/

.lb-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    padding:12px 22px;

    border:none;

    border-radius:14px;

    cursor:pointer;

    font-size:14px;

    font-weight:700;

    transition:.25s;

    text-decoration:none;

}

.lb-btn-primary{

    background:

        linear-gradient(

            135deg,

            var(--lb-primary),

            var(--lb-primary-dark)

        );

    color:#fff;

}

.lb-btn-primary:hover{

    transform:translateY(-2px);

    box-shadow:

        0 12px 25px rgba(37,99,235,.25);

}

.lb-btn-light{

    background:#fff;

    border:1px solid var(--lb-border);

    color:#334155;

}

.lb-btn-light:hover{

    background:#f8fafc;

}

/******************************************************************
    IA
******************************************************************/

.lb-ai-item{

    display:flex;

    align-items:flex-start;

    gap:18px;

    padding:18px;

    border-radius:18px;

    margin-bottom:18px;

}

.lb-ai-item:last-child{

    margin-bottom:0;

}

.lb-ai-item i{

    width:46px;

    height:46px;

    min-width:46px;

    border-radius:14px;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#fff;

    font-size:20px;

}

.lb-ai-item strong{

    display:block;

    margin-bottom:5px;

    color:#0f172a;

    font-size:15px;

}

.lb-ai-item small{

    display:block;

    color:#64748b;

    line-height:1.6;

}

.lb-ai-item.success{

    background:#ecfdf5;

}

.lb-ai-item.success i{

    background:#16a34a;

}

.lb-ai-item.warning{

    background:#fff8e8;

}

.lb-ai-item.warning i{

    background:#f59e0b;

}

.lb-ai-item.primary{

    background:#eff6ff;

}

.lb-ai-item.primary i{

    background:#2563eb;

}

.lb-ai-item.danger{

    background:#fef2f2;

}

.lb-ai-item.danger i{

    background:#dc2626;

}
/******************************************************************
    TABLAS PREMIUM
******************************************************************/

.table{

    margin:0;

    border-collapse:separate;

    border-spacing:0;

}

.table thead th{

    background:#f8fafc;

    color:#64748b;

    font-size:13px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.7px;

    border:none;

    padding:18px 22px;

}

.table tbody td{

    padding:18px 22px;

    border-top:1px solid #eef2f7;

    vertical-align:middle;

    color:#334155;

    background:#fff;

}

.table-hover tbody tr{

    transition:.25s;

}

.table-hover tbody tr:hover{

    background:#f8fbff;

}

.table-hover tbody tr:hover td{

    background:#f8fbff;

}

.table tbody strong{

    color:#0f172a;

    font-weight:700;

}

.table-responsive{

    overflow-x:auto;

}

/******************************************************************
    LISTAS
******************************************************************/

.lb-list{

    display:flex;

    flex-direction:column;

}

.lb-list-item{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    padding:18px 0;

    border-bottom:1px solid #eef2f7;

}

.lb-list-item:last-child{

    border-bottom:none;

}

.lb-list-item strong{

    display:block;

    color:#0f172a;

    margin-bottom:5px;

}

.lb-list-item small{

    color:#64748b;

}

/******************************************************************
    ACTIVIDAD
******************************************************************/

.lb-feed{

    display:flex;

    align-items:center;

    gap:18px;

    padding:16px 0;

    border-bottom:1px solid #eef2f7;

}

.lb-feed:last-child{

    border-bottom:none;

}

.lb-feed i{

    width:42px;

    height:42px;

    min-width:42px;

    border-radius:12px;

    display:flex;

    justify-content:center;

    align-items:center;

    background:#f8fafc;

    font-size:18px;

}

.lb-feed span{

    flex:1;

}

.lb-feed strong{

    display:block;

    color:#0f172a;

    margin-bottom:4px;

}

.lb-feed small{

    color:#64748b;

}

/******************************************************************
    EMPTY
******************************************************************/

.lb-empty{

    padding:70px 30px;

    text-align:center;

    color:#94a3b8;

}

.lb-empty i{

    margin-bottom:25px;

    opacity:.85;

}

.lb-empty h4,

.lb-empty h5{

    margin-bottom:12px;

    color:#0f172a;

}

.lb-empty p{

    max-width:420px;

    margin:0 auto 25px;

    color:#64748b;

    line-height:1.7;

}

/******************************************************************
    BADGES
******************************************************************/

.lb-badge{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    border-radius:30px;

    padding:8px 14px;

    font-size:12px;

    font-weight:700;

}

.badge{

    border-radius:30px;

    padding:8px 14px;

    font-size:12px;

    font-weight:700;

}

/******************************************************************
    NÚMEROS
******************************************************************/

.lb-big-number{

    font-size:44px;

    font-weight:800;

    color:#2563eb;

    line-height:1;

}

.lb-mini-number{

    font-size:30px;

    font-weight:800;

    color:#0f172a;

}

/******************************************************************
    ICONOS
******************************************************************/

.fa-building{

    color:inherit;

}

.fa-robot{

    color:inherit;

}

.fa-gavel{

    color:inherit;

}

.fa-chart-line{

    color:inherit;

}

/******************************************************************
    ANIMACIÓN TARJETAS
******************************************************************/

.lb-card{

    animation:fadeCard .35s ease;

}

@keyframes fadeCard{

    from{

        opacity:0;

        transform:translateY(15px);

    }

    to{

        opacity:1;

        transform:none;

    }

}
/******************************************************************
    CHART.JS
******************************************************************/

#pipelineChart{

    width:100% !important;

    height:340px !important;

}

/******************************************************************
    BOOTSTRAP
******************************************************************/

.lb-dashboard .row{

    --bs-gutter-x:24px;

    --bs-gutter-y:24px;

}

.lb-dashboard [class*="col-"]{



    margin-bottom:24px;



}



.lb-dashboard .col-xl-3{

    

display:block;



}

.lb-dashboard .col-xl-3>.lb-stat-card,
.lb-dashboard .col-xl-4>.lb-card,
.lb-dashboard .col-xl-5>.lb-card,
.lb-dashboard .col-xl-6>.lb-card,
.lb-dashboard .col-xl-7>.lb-card,
.lb-dashboard .col-xl-8>.lb-card{

    width:100%;

}

/******************************************************************
    BOTONES TABLAS
******************************************************************/

.table .btn{

    border-radius:12px;

    padding:8px 16px;

    font-size:13px;

    font-weight:600;

}

/******************************************************************
    SCROLL
******************************************************************/

.lb-card-body::-webkit-scrollbar{

    width:8px;

}

.lb-card-body::-webkit-scrollbar-thumb{

    background:#dbe4ef;

    border-radius:20px;

}

.lb-card-body::-webkit-scrollbar-track{

    background:transparent;

}

/******************************************************************
    FOCUS
******************************************************************/

button:focus,
.btn:focus{

    outline:none;

    box-shadow:none;

}

/******************************************************************
    LINKS
******************************************************************/

.lb-dashboard a{

    color:var(--lb-primary);

    text-decoration:none;

}

.lb-dashboard a:hover{

    color:var(--lb-primary-dark);

}

/******************************************************************
    TRANSICIONES
******************************************************************/

.lb-btn,
.lb-card,
.lb-stat-card,
.table tbody tr,
.lb-list-item,
.lb-feed{

    transition:.25s ease;

}

/******************************************************************
    RESPONSIVE
******************************************************************/

@media(max-width:1400px){

    .lb-hero{

        padding:34px;

    }

    .lb-hero-title{

        font-size:36px;

    }

}

@media(max-width:1200px){

    .lb-hero{

        flex-direction:column;

        text-align:center;

    }

    .lb-hero-left{

        width:100%;

    }

    .lb-hero-right{

        justify-content:center;

        width:100%;

    }

    .lb-progress{

        margin-left:auto;

        margin-right:auto;

    }

}

@media(max-width:992px){

    .lb-dashboard{

        padding:18px;

    }

    .lb-stat-card{

        padding:20px;

    }

    .lb-card-header{

        padding:18px 20px;

    }

    .lb-card-body{

        padding:20px;

    }

}

@media(max-width:768px){

    .lb-hero{

        padding:28px;

        border-radius:20px;

    }

    .lb-hero-title{

        font-size:30px;

    }

    .lb-hero-number{

        font-size:40px;

    }

    .lb-circle-card{

        width:150px;

        height:150px;

    }

    .lb-progress{

        width:100%;

    }

    .table thead{

        display:none;

    }

    .table tbody tr{

        display:block;

        margin-bottom:18px;

        border-radius:18px;

        overflow:hidden;

        box-shadow:

            0 10px 30px rgba(15,23,42,.05);

    }

    .table tbody td{

        display:flex;

        justify-content:space-between;

        border:none;

        padding:14px 18px;

    }

}

@media(max-width:576px){

    .lb-dashboard{

        padding:12px;

    }

    .lb-stat-card{

        flex-direction:column;

        text-align:center;

    }

    .lb-stat-icon{

        margin-bottom:10px;

    }

    .lb-list-item{

        flex-direction:column;

        align-items:flex-start;

    }

    .lb-feed{

        align-items:flex-start;

    }

    .lb-btn{

        width:100%;

        justify-content:center;

    }

}
/******************************************************************
    EFECTOS PREMIUM
******************************************************************/

.lb-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:4px;

    background:linear-gradient(
        90deg,
        #2563eb,
        #60a5fa
    );

    opacity:0;

    transition:.30s;

}

.lb-card{

    position:relative;

}

.lb-card:hover::before{

    opacity:1;

}

/******************************************************************
    SOMBRAS
******************************************************************/

.lb-card:hover{

    box-shadow:

        0 25px 60px rgba(15,23,42,.14);

}

.lb-stat-card:hover{

    box-shadow:

        0 30px 65px rgba(15,23,42,.16);

}

/******************************************************************
    ICONOS KPI
******************************************************************/

.bg-primary{

    background:linear-gradient(
        135deg,
        #2563eb,
        #1d4ed8
    ) !important;

}

.bg-success{

    background:linear-gradient(
        135deg,
        #16a34a,
        #15803d
    ) !important;

}

.bg-warning{

    background:linear-gradient(
        135deg,
        #f59e0b,
        #d97706
    ) !important;

}

.bg-danger{

    background:linear-gradient(
        135deg,
        #dc2626,
        #b91c1c
    ) !important;

}

.bg-info{

    background:linear-gradient(
        135deg,
        #0ea5e9,
        #0284c7
    ) !important;

}

/******************************************************************
    TABLAS
******************************************************************/

.table tbody tr{

    transition:.20s;

}

.table tbody tr:hover{

    transform:scale(1.01);

}

.table tbody td{

    white-space:nowrap;

}

/******************************************************************
    BOTONES
******************************************************************/

.lb-btn-primary{

    box-shadow:

        0 10px 25px rgba(37,99,235,.22);

}

.lb-btn-primary:hover{

    box-shadow:

        0 18px 35px rgba(37,99,235,.35);

}

.lb-btn-light:hover{

    border-color:#2563eb;

    color:#2563eb;

}

/******************************************************************
    HERO
******************************************************************/

.lb-hero{

    min-height:190px;

}

.lb-hero-right{

    min-width:220px;

}

/******************************************************************
    KPI
******************************************************************/

.lb-stat-value{

    letter-spacing:-1px;

}

.lb-stat-title{

    margin-bottom:4px;

}

/******************************************************************
    CARD HEADER
******************************************************************/

.lb-card-header i{

    width:24px;

    text-align:center;

}

/******************************************************************
    BADGES
******************************************************************/

.badge{

    font-weight:700;

    letter-spacing:.3px;

}

/******************************************************************
    LIST ITEM
******************************************************************/

.lb-list-item:hover{

    padding-left:10px;

}

/******************************************************************
    FEED
******************************************************************/

.lb-feed:hover{

    padding-left:10px;

}

/******************************************************************
    EMPTY
******************************************************************/

.lb-empty{

    opacity:.92;

}

/******************************************************************
    CANVAS
******************************************************************/

canvas{

    max-width:100%;

}

/******************************************************************
    ANIMACIONES
******************************************************************/

@keyframes floatCard{

    0%{

        transform:translateY(0px);

    }

    50%{

        transform:translateY(-3px);

    }

    100%{

        transform:translateY(0px);

    }

}

.lb-circle-card{

    animation:floatCard 4s ease-in-out infinite;

}

/******************************************************************
    IMPRESIÓN
******************************************************************/

@media print{

    .lb-btn,

    .btn,

    .lb-hero{

        box-shadow:none !important;

    }

}

/******************************************************************
    FIN
******************************************************************/

/******************************************************************
 V106.83 — DASHBOARD PC: ANCHO REAL DEL AREA DE TRABAJO
******************************************************************/
@media (min-width:1201px){
    html, body{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        overflow-x:hidden!important;
    }

    body.lb-body .lb-wrapper{
        width:100vw!important;
        max-width:100vw!important;
        min-width:0!important;
        overflow-x:hidden!important;
        display:block!important;
        position:relative!important;
    }

    body.lb-body .lb-main,
    body.lb-body.lb-sidebar-hidden .lb-main{
        display:block!important;
        position:relative!important;
        width:calc(100vw - 210px)!important;
        max-width:calc(100vw - 210px)!important;
        min-width:0!important;
        margin-left:210px!important;
        margin-right:0!important;
        padding:0!important;
        box-sizing:border-box!important;
        overflow-x:hidden!important;
        overflow-y:visible!important;
        transform:none!important;
    }

    body.lb-body .lb-main > .lb-topbar{
        display:flex!important;
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        margin:0!important;
        box-sizing:border-box!important;
    }

    body.lb-body .lb-main > .lb-dashboard{
        display:block!important;
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        margin:0!important;
        padding:20px!important;
        box-sizing:border-box!important;
        overflow-x:hidden!important;
        overflow-y:visible!important;
    }

    body.lb-body .lb-dashboard .lb-hero{
        display:flex!important;
        width:100%!important;
        max-width:none!important;
        min-width:0!important;
        margin-left:0!important;
        margin-right:0!important;
        box-sizing:border-box!important;
        flex:0 0 auto!important;
    }

    body.lb-body .lb-dashboard .row{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        margin-left:0!important;
        margin-right:0!important;
        box-sizing:border-box!important;
    }

    body.lb-body .lb-dashboard [class*="col-"]{
        min-width:0!important;
        box-sizing:border-box!important;
    }
}

/* V106.84 — corrección de solapamiento vertical en Dashboard PC.
   Las filas Bootstrap deben conservar su altura real; las columnas no deben
   flotar ni quedar posicionadas unas sobre otras. */
@media (min-width:1201px){
    body.lb-body .lb-dashboard > .row{
        display:flex!important;
        flex-direction:row!important;
        flex-wrap:wrap!important;
        align-items:stretch!important;
        position:relative!important;
        float:none!important;
        clear:both!important;
        height:auto!important;
        min-height:0!important;
        overflow:visible!important;
        box-sizing:border-box!important;
    }

    body.lb-body .lb-dashboard > .row + .row{
        clear:both!important;
        position:relative!important;
        margin-top:24px!important;
    }

    body.lb-body .lb-dashboard > .row > [class*="col-"]{
        position:relative!important;
        float:none!important;
        display:block!important;
        height:auto!important;
        min-height:0!important;
        align-self:stretch!important;
        box-sizing:border-box!important;
    }

    body.lb-body .lb-dashboard > .row > [class*="col-"] > .lb-card{
        position:relative!important;
        top:auto!important;
        bottom:auto!important;
        left:auto!important;
        right:auto!important;
        height:auto!important;
        min-height:0!important;
        transform:none!important;
        clear:both!important;
        box-sizing:border-box!important;
    }

    body.lb-body .lb-dashboard .lb-card + .lb-card{
        margin-top:24px!important;
    }

    /* La columna que contiene Actividad + Acciones debe crecer con ambas tarjetas. */
    body.lb-body .lb-dashboard > .row:first-of-type > [class*="col-xl-5"]{
        display:flex!important;
        flex-direction:column!important;
        align-items:stretch!important;
        height:auto!important;
    }

    body.lb-body .lb-dashboard > .row:first-of-type > [class*="col-xl-5"] > .lb-card{
        flex:0 0 auto!important;
    }
}