/* ======================================================
   DELLANNO ERP
   HEADER
   api/static/css/layout/header.css
====================================================== */

/* ======================================================
   HEADER
====================================================== */

.erp-header{

    height:78px;

    background:#1a2028;

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

    padding:0 24px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    flex-shrink:0;

}

/* ======================================================
   HEADER LEFT
====================================================== */

.header-left{

    display:flex;

    align-items:center;

    gap:16px;

}

/* ======================================================
   HEADER RIGHT
====================================================== */

.header-right{

    display:flex;

    align-items:center;

    gap:12px;

}

/* ======================================================
   USER CARD
====================================================== */

.user-card{

    min-height:48px;

    padding:0 20px;

    border-radius:16px;

    background:linear-gradient(
        90deg,
        var(--gold) 0%,
        var(--gold-hover) 100%
    );

    color:#11161d;

    font-size:13px;

    font-weight:900;

    display:flex;

    align-items:center;

    gap:8px;

    box-shadow:
        0 6px 16px rgba(197,160,89,.25);

}

/* ======================================================
   LOGOUT
====================================================== */

.logout-btn{

    width:48px;

    height:48px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:16px;

    background:#dc2626;

    color:#fff;

    transition:
        background .2s,
        transform .2s;

}

.logout-btn:hover{

    background:#b91c1c;

    transform:translateY(-1px);

}

/* ======================================================
   SIDEBAR TOGGLE
====================================================== */

.sidebar-toggle{

    width:42px;

    height:42px;

    border:none;

    border-radius:12px;

    background:#232b36;

    color:var(--text);

    cursor:pointer;

    transition:
        background .2s,
        color .2s,
        transform .2s;

}

.sidebar-toggle:hover{

    background:var(--gold);

    color:#11161d;

    transform:translateY(-1px);

}

/* ======================================================
   BREADCRUMB
====================================================== */

.erp-breadcrumb{

    font-size:15px;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.5px;

    color:var(--text);

}

.erp-breadcrumb span{

    color:var(--gold);

}

/* ======================================================
   RESPONSIVO
====================================================== */

@media(max-width:768px){

    .erp-header{

        height:auto;

        padding:16px;

        flex-direction:column;

        align-items:flex-start;

        gap:12px;

    }

    .header-right{

        width:100%;

        justify-content:space-between;

    }

    .user-card{

        flex:1;

    }

}