/* KONECTA CRYPTOS UI NORMALIZADA V1 */

/* ==================================================
   HEADER: MISMO TAMAÑO Y POSICION EN TODAS
   ================================================== */

.header{
    min-height:58px !important;
    height:58px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    position:relative !important;

    overflow:visible !important;

    box-sizing:border-box !important;
}

.header > div:first-child{
    min-width:0;
}

.header h1{
    margin:0 !important;
}

.header .subtitle{
    margin-top:3px !important;
}


/* ==================================================
   PERFIL SIMPLE DE PAGINAS INTERNAS
   ================================================== */

.header .account.kc-unified-account{
    position:relative !important;

    display:flex !important;
    align-items:center !important;

    gap:8px !important;

    margin-left:auto !important;

    padding:5px 7px !important;

    min-width:150px !important;

    cursor:pointer !important;

    overflow:visible !important;

    border-radius:8px !important;

    box-sizing:border-box !important;

    z-index:5000 !important;
}

.header .account.kc-unified-account:hover{
    background:rgba(255,255,255,.04) !important;
}

.header .account.kc-unified-account .avatar{
    width:30px !important;
    height:30px !important;

    min-width:30px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border-radius:50% !important;
}

.kc-account-copy{
    min-width:90px;

    display:flex;
    flex-direction:column;

    text-align:left;
}

.kc-account-copy strong{
    display:block !important;

    color:#e7f0f8 !important;

    font-size:11px !important;
    line-height:1.2 !important;

    white-space:nowrap;
}

.kc-account-copy small{
    display:block !important;

    margin-top:2px !important;

    color:#8295a8 !important;

    font-size:9px !important;
    line-height:1.2 !important;

    white-space:nowrap;
}

.kc-account-arrow{
    margin-left:auto;

    width:16px;

    color:#8fa2b5;

    font-size:13px;

    text-align:center;

    transition:transform .15s ease;
}

.kc-unified-account.open .kc-account-arrow{
    transform:rotate(180deg);
}


/* ==================================================
   DROPDOWN - ABSOLUTO, NO MUEVE EL HEADER
   ================================================== */

.kc-account-dropdown{
    position:absolute !important;

    top:calc(100% + 7px) !important;
    right:0 !important;

    width:220px !important;

    display:none !important;

    padding:6px !important;

    margin:0 !important;

    background:#091520 !important;

    border:
      1px solid rgba(255,255,255,.09) !important;

    border-radius:9px !important;

    box-shadow:
      0 18px 45px rgba(0,0,0,.50) !important;

    box-sizing:border-box !important;

    z-index:999999 !important;
}

.kc-unified-account.open
.kc-account-dropdown{
    display:block !important;
}

.kc-account-dropdown-head{
    padding:8px 9px 9px;

    border-bottom:
      1px solid rgba(255,255,255,.07);

    margin-bottom:4px;
}

.kc-account-dropdown-head strong{
    color:#fff !important;
    font-size:11px !important;
}

.kc-account-dropdown-head small{
    display:block;

    margin-top:3px;

    color:#72879a !important;

    font-size:9px !important;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.kc-account-menu-link{
    display:block !important;

    width:100% !important;

    padding:7px 9px !important;

    border:0 !important;
    border-radius:5px !important;

    box-sizing:border-box !important;

    background:transparent !important;

    color:#becbd7 !important;

    text-align:left !important;
    text-decoration:none !important;

    font:inherit !important;
    font-size:10px !important;

    cursor:pointer !important;
}

.kc-account-menu-link:hover{
    background:rgba(255,255,255,.06) !important;
    color:#fff !important;
}

.kc-account-separator{
    height:1px;

    margin:4px 3px;

    background:rgba(255,255,255,.07);
}


/* ==================================================
   DASHBOARD: NORMALIZAR SU PERFIL ORIGINAL
   ================================================== */

.header #kcAccountMount{
    margin-left:auto !important;
    overflow:visible !important;
}

.header .kc-account{
    position:relative !important;

    margin:0 !important;

    overflow:visible !important;
}

.header .kc-account-trigger{
    min-height:40px !important;

    display:flex !important;
    align-items:center !important;

    gap:8px !important;

    padding:5px 7px !important;
}

.header .kc-avatar{
    width:30px !important;
    height:30px !important;

    min-width:30px !important;
}

.header .kc-account-name{
    font-size:11px !important;
}

.header .kc-account-role{
    font-size:9px !important;
}

.header .kc-account-arrow{
    display:flex !important;

    width:16px !important;

    align-items:center !important;
    justify-content:center !important;

    opacity:1 !important;
}

.header .kc-account-menu{
    position:absolute !important;

    top:calc(100% + 7px) !important;
    right:0 !important;

    z-index:999999 !important;
}


/* El status nunca altera el header */
#systemStatus{
    display:none !important;
}


/* =========================================================
   KONECTA - FIX ANCHO GENERAL V1
   NO CAMBIA CONTENIDO, SOLO GEOMETRIA DEL AREA PRINCIPAL
   ========================================================= */

html,
body{
    width:100% !important;
    max-width:none !important;
}

.layout{
    width:100% !important;
    max-width:none !important;
}

main{
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;

    box-sizing:border-box !important;
}

.header{
    width:100% !important;
    max-width:none !important;

    box-sizing:border-box !important;
}


/* perfil siempre pegado al borde derecho REAL del header */

.header .account,
.header #kcAccountMount{
    margin-left:auto !important;
}

.header #kcAccountMount{
    flex:0 0 auto !important;
}


/* evitar que el titulo empuje o limite la cuenta */

.header > div:first-child{
    min-width:0 !important;
    flex:1 1 auto !important;
}


/* la cuenta nunca debe ocupar espacio extra */

.header .kc-account{
    flex:0 0 auto !important;
}


/* evitar anchos heredados de parches viejos */

.header,
.header > div,
.header #kcAccountMount{
    max-width:none !important;
}