/* MUOG Season 2 — Solo Mi Cuenta, WhatsApp flotante y medallas. */

/* WhatsApp flotante: icono mas reconocible, acabados clasicos. */
.muog-whatsapp-float {
    min-height:58px !important;
    min-width:231px !important;
    padding:8px 18px 8px 12px !important;
    gap:11px !important;
    background:linear-gradient(115deg,#087650 0%,#07543e 52%,#063b31 100%) !important;
    border:1px solid #3ba16e !important;
    border-radius:6px !important;
    font-size:13px !important;
    font-weight:700 !important;
    letter-spacing:.1px;
    box-shadow:0 8px 25px rgba(0,0,0,.49),inset 0 1px 0 rgba(245,255,241,.18) !important;
}
.muog-whatsapp-float .muog-whatsapp-float-icon {
    display:flex !important;
    align-items:center;
    justify-content:center;
    flex:0 0 39px;
    width:39px;
    height:39px;
    border-radius:50%;
    background:#0c9f59;
    border:1px solid rgba(236,255,241,.52);
    font-size:28px !important;
    box-shadow:0 2px 8px rgba(0,0,0,.33);
}
.muog-whatsapp-float .muog-whatsapp-float-arrow {
    margin-left:auto;
    font-size:21px;
}
.muog-whatsapp-float:hover,.muog-whatsapp-float:focus-visible {
    background:linear-gradient(115deg,#099a61,#076547) !important;
    box-shadow:0 8px 25px rgba(0,0,0,.52),0 0 0 2px rgba(40,181,103,.27) !important;
}
/* Distancia visual: trofeo separado del numero, sin tocar datos. */
.muog-module-content table.rankings-table .rankings-table-place .muog-rank-medal {
    margin-right:9px !important;
    font-size:13px !important;
    line-height:1;
}
.muog-module-content table.rankings-table td.rankings-table-place {
    white-space:nowrap;
}

/* Estilos aplicados solo al modulo Mi Cuenta. NO alteran AdminCP real. */
.muog-account-view .muog-module-content > .page-title {
    text-align:center;
    margin:14px 0 18px !important;
    padding:8px 4px 13px !important;
    color:#efd3a0 !important;
    font:bold 26px/1.25 Georgia,'Times New Roman',serif !important;
    text-shadow:0 2px 2px #120a05,0 0 8px rgba(194,129,49,.23);
    border-bottom:1px solid rgba(178,124,49,.5);
    background:radial-gradient(ellipse at 50% 100%, rgba(108,67,30,.22),transparent 75%);
}
.muog-account-view .muog-module-content > .page-title:first-child {
    margin-top:5px !important;
}
.muog-account-view .muog-module-content .myaccount-table {
    width:100%;
    border:1px solid #76532d !important;
    border-collapse:separate;
    border-spacing:0;
    background:linear-gradient(145deg,#241b13,#15130f 60%,#241c13);
    box-shadow:inset 0 0 0 1px rgba(6,5,3,.8),0 4px 15px rgba(0,0,0,.25);
    margin:0 0 18px !important;
    table-layout:fixed;
}
.muog-account-view .muog-module-content .myaccount-table tr td {
    border:0 !important;
    border-bottom:1px solid rgba(138,103,59,.28) !important;
    padding:11px 13px !important;
    vertical-align:middle !important;
    font:12px/1.55 Arial,Helvetica,sans-serif;
    color:#e5d9bd;
    background:transparent !important;
    overflow-wrap:anywhere;
}
.muog-account-view .myaccount-table tr:nth-child(even) td {background:rgba(205,139,57,.035) !important;}
.muog-account-view .myaccount-table tr:last-child td {border-bottom:0 !important;}
.muog-account-view .myaccount-table tr td:first-child {
    width:41%;
    text-align:left;
    color:#cda970 !important;
    font-size:11px !important;
    font-weight:700 !important;
    border-right:1px solid rgba(138,103,59,.18) !important;
}
.muog-account-view .myaccount-table tr td:last-child {
    text-align:left;
    color:#f0e1c7 !important;
}
.muog-account-view .myaccount-table .label {
    display:inline-block;
    font-size:11px;
    font-weight:600;
    color:#dcccaa;
    background:transparent;
    padding:3px 0;
}
.muog-account-view .myaccount-table .label-success {color:#80d979 !important;}
.muog-account-view .myaccount-table .label-danger {color:#f39c82 !important;}
.muog-account-view .myaccount-table a.btn {
    float:none !important;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin:5px 0 0 8px;
    padding:6px 10px !important;
    min-height:27px;
    color:#f3dbb2 !important;
    background:linear-gradient(#743316,#471d0d) !important;
    border:1px solid #a8662c !important;
    border-radius:3px;
    font:bold 11px/1.3 Georgia,'Times New Roman',serif;
}
.muog-account-view .myaccount-table a.btn:hover {background:linear-gradient(#91451c,#5b240d) !important;}
/* Enlaces de opciones dentro de Mi Cuenta, incluido el avatar. */
.muog-account-view .muog-module-content > a.btn,
.muog-account-view .muog-module-content > p > a.btn {
    margin:0 0 14px;
    padding:10px 12px;
    color:#f3d6a1 !important;
    background:linear-gradient(#713018,#411c0d) !important;
    border:1px solid #9a6532 !important;
    border-radius:4px;
    font:bold 12px/1.4 Georgia,'Times New Roman',serif;
    text-decoration:none;
}
/* Cada personaje es una tarjeta compacta; dos por fila en PC. */
.muog-account-view .muog-account-characters {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:13px;
    width:100%;
    margin:0 0 18px !important;
    padding:0 2px !important;
    text-align:center;
}
.muog-account-view .muog-account-characters > .col-xs-3 {
    float:none !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:14px 9px 13px !important;
    display:flex !important;
    flex-direction:column;
    align-items:center;
    gap:0;
    border:1px solid #72502b;
    border-radius:5px;
    background:linear-gradient(155deg,#2d2016,#18150f 74%,#292016);
    box-shadow:inset 0 1px rgba(253,217,149,.09),0 3px 9px rgba(0,0,0,.22);
    box-sizing:border-box;
    overflow:hidden;
}
.muog-account-view .myaccount-character-name {
    order:1;
    margin-bottom:11px;
    line-height:1.25;
    white-space:nowrap;
    max-width:100%;
}
.muog-account-view .myaccount-character-name a {
    color:#edcb89 !important;
    font:bold 15px/1.25 Georgia,'Times New Roman',serif !important;
    text-decoration:none;
}
.muog-account-view .myaccount-character-name img.online-status-indicator {
    width:10px !important;height:10px !important;vertical-align:baseline;
    margin-left:5px;
}
.muog-account-view .myaccount-character-block {
    order:2;
    display:block !important;
    width:128px;
    max-width:100%;
    margin:0 auto 0 !important;
    padding:4px !important;
    border:2px solid #ad8747 !important;
    border-radius:6px !important;
    background:linear-gradient(130deg,#74522b,#25180c);
    box-shadow:inset 0 0 0 1px #34200e,0 3px 10px #080705;
    box-sizing:border-box;
}
.muog-account-view .myaccount-character-block a {display:block;line-height:0;}
.muog-account-view .myaccount-character-block img {
    display:block;
    width:100% !important;
    max-width:100%;
    height:115px !important;
    object-fit:cover;
    border-radius:3px !important;
}
/* El nivel ya no se superpone a la foto: se convierte en placa debajo. */
.muog-account-view .myaccount-character-block-level {
    order:3;
    position:static !important;
    top:auto !important;
    left:auto !important;
    bottom:auto !important;
    transform:none !important;
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    min-height:26px;
    margin:10px auto 0 !important;
    padding:4px 12px !important;
    background:linear-gradient(#51321d,#2c1d12) !important;
    border:1px solid #976d37;
    border-radius:4px !important;
    color:#f5d18a !important;
    font:bold 12px/1.3 Arial,sans-serif !important;
    box-shadow:0 1px 3px #0c0906;
}
.muog-account-view .myaccount-character-block-level::before {content:'Nivel ';margin-right:4px;}
html[lang='en'] .muog-account-view .myaccount-character-block-level::before {content:'Level ';}
.muog-account-view .myaccount-character-block-location {
    order:4;
    width:100%;
    margin:9px 0 0 !important;
    color:#bcae90 !important;
    font:11px/1.5 Arial,Helvetica,sans-serif !important;
}
@media (max-width:600px) {
    .muog-whatsapp-float {
        min-width:0 !important;
        min-height:49px !important;
        padding:6px 11px !important;
        gap:9px !important;
        font-size:11px !important;
    }
    .muog-whatsapp-float .muog-whatsapp-float-icon {
        flex-basis:33px;
        width:33px;
        height:33px;
        font-size:24px !important;
    }
    .muog-account-view .muog-module-content > .page-title {font-size:24px !important;}
    .muog-account-view .muog-account-characters {grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
    .muog-account-view .muog-account-characters > .col-xs-3 {padding:10px 5px !important;}
    .muog-account-view .myaccount-character-name a {font-size:13px !important;}
    .muog-account-view .myaccount-character-block {width:112px;}
    .muog-account-view .myaccount-character-block img {height:102px !important;}
    .muog-account-view .myaccount-table tr td {padding:9px 7px !important;font-size:11px;}
    .muog-account-view .myaccount-table tr td:first-child {width:40%;font-size:10px !important;}
}
@media (max-width:350px) {
    .muog-account-view .muog-account-characters {grid-template-columns:1fr;}
    .muog-whatsapp-float .muog-whatsapp-float-text {font-size:10px;}
}
