/*======================================================
HEADER
Ostad Abjad AI
Version 3.1
======================================================*/

#oab-header{

    position:fixed;

    top:0;
    right:0;
    left:0;

    height:60px;

    background:#178245;

    border-bottom:1px solid #E8E2C5;

    display:grid;

    grid-template-columns:1fr auto 1fr;

    align-items:center;

    padding:0 16px;

    z-index:9999;

}


/*======================================================
LEFT / CENTER / RIGHT
======================================================*/

.oab-header-left{

    display:flex;

    justify-content:flex-start;

}


.oab-header-right{

    display:flex;

    justify-content:flex-end;

}


/*======================================================
BUTTON
======================================================*/

.oab-header-btn{

    width:38px;

    height:38px;

    border:none;

    background:transparent;

    display:flex;

    align-items:center;

    justify-content:center;

    cursor:pointer;

    padding:0;

}


/*======================================================
ICON
======================================================*/

.oab-icon{

    width:24px;

    height:24px;

}


/*======================================================
STATUS
======================================================*/

#oab-status{

    display:flex;

    align-items:center;

    gap:6px;

    color:#FFF;

    font-size:14px;

    font-weight:700;

    white-space:nowrap;

}


.oab-status-icon{

    width:15px;

    height:15px;

}


/*======================================================
LOGO
======================================================*/

.oab-logo{

    width:50px;

    height:50px;

    border-radius:50%;

    overflow:hidden;

    background:#FFF;

    border:3px solid #FFF;

}


/*======================================================
MOBILE
======================================================*/

@media(max-width:768px){

    #oab-header{

        height:52px;

        padding:0 10px;

    }


    .oab-header-btn{

        width:34px;

        height:34px;

    }


    .oab-icon{

        width:21px;

        height:21px;

    }


    #oab-status{

        font-size:12px;

        gap:5px;

    }


    .oab-status-icon{

        width:14px;

        height:14px;

    }

}