/* ==========================================================
   AP98D - Liquid Glass + menú/caret + banner comunidad
   Se instala encima de AP98C.
   Corrige flechas/caret sobre texto y compacta Comunidad Oficial.
   Añade efecto liquid glass general sin tocar la lógica de módulos.
   ========================================================== */

/* ----------------------------------------------------------
   1) Caret: elimina triángulos/pseudo-elementos que quedan arriba
   ---------------------------------------------------------- */
#main-navbar .navbar-nav > li > a::before,
#main-navbar .navbar-nav > li > a::after,
#main-navbar .ngames-main-menu > li > a::before,
#main-navbar .ngames-main-menu > li > a::after,
#main-navbar .dropdown-toggle::before,
#main-navbar .dropdown-toggle::after {
    content: none !important;
    display: none !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

#main-navbar .dropdown-toggle {
    overflow: visible !important;
}

#main-navbar .dropdown-toggle .caret,
#main-navbar .ngames-main-menu > li.dropdown > a > .caret,
.navbar-default #main-navbar .dropdown-toggle .caret,
.navbar #main-navbar .dropdown-toggle .caret {
    content: "" !important;
    display: inline-block !important;
    position: static !important;
    float: none !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 0 0 5px !important;
    vertical-align: middle !important;
    transform: translateY(1px) !important;
    border-top: 4px dashed currentColor !important;
    border-top: 4px solid currentColor !important;
    border-right: 4px solid transparent !important;
    border-left: 4px solid transparent !important;
    border-bottom: 0 !important;
    opacity: .88 !important;
}

#main-navbar .ngames-main-menu > li.dropdown.open:after {
    display: none !important;
    content: none !important;
}

/* Menú superior: evita glow pegado; solo hover/open/focus */
#main-navbar .ngames-main-menu > li.active > a,
#main-navbar .navbar-nav > li.active > a,
.navbar-default .navbar-nav > li.active > a {
    background: transparent !important;
    box-shadow: none !important;
    color: #f2f2f2 !important;
}

#main-navbar .ngames-main-menu > li > a:hover,
#main-navbar .ngames-main-menu > li > a:focus,
#main-navbar .ngames-main-menu > li.open > a,
#main-navbar .ngames-main-menu > li.open > a:focus,
#main-navbar .ngames-main-menu > li.open > a:hover {
    background: linear-gradient(180deg, rgba(126, 58, 25, .58), rgba(21, 11, 9, .50)) !important;
    box-shadow: inset 0 -2px 0 #d17a21, 0 0 20px rgba(255, 128, 32, .16) !important;
    color: #ffffff !important;
}

/* ----------------------------------------------------------
   2) Comunidad oficial: baja altura y mejor proporción
   ---------------------------------------------------------- */
#mu-extinction-discord,
body.drakion-v042 #mu-extinction-discord {
    min-height: 238px !important;
    margin: 18px auto 18px !important;
    border-color: rgba(255, 139, 24, .32) !important;
    border-radius: 8px !important;
    box-shadow: 0 12px 30px rgba(0,0,0,.34), 0 0 24px rgba(255, 119, 24, .08) !important;
}

#mu-extinction-discord .discord-community-inner,
body.drakion-v042 #mu-extinction-discord .discord-community-inner,
body.drakion-v042 .discord-community-inner {
    min-height: 238px !important;
    padding: 34px 38px !important;
    max-width: 640px !important;
    justify-content: center !important;
}

#mu-extinction-discord .discord-community-kicker,
body.drakion-v042 .discord-community-kicker {
    font-size: 11px !important;
    letter-spacing: 1.8px !important;
    margin-bottom: 6px !important;
}

#mu-extinction-discord .discord-community-title,
body.drakion-v042 .discord-community-title {
    font-size: 28px !important;
    line-height: 1.08 !important;
    margin: 0 0 10px !important;
}

#mu-extinction-discord .discord-community-text,
body.drakion-v042 .discord-community-text {
    max-width: 535px !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    margin: 0 0 18px !important;
}

#mu-extinction-discord .discord-community-button,
body.drakion-v042 .discord-community-button {
    min-width: 170px !important;
    padding: 10px 19px !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
}

#mu-extinction-discord .discord-community-actions,
body.drakion-v042 #mu-extinction-discord .discord-community-actions {
    gap: 10px !important;
}

@media (max-width: 767px) {
    #mu-extinction-discord,
    body.drakion-v042 #mu-extinction-discord {
        min-height: 300px !important;
        margin: 16px auto !important;
    }
    #mu-extinction-discord .discord-community-inner,
    body.drakion-v042 #mu-extinction-discord .discord-community-inner,
    body.drakion-v042 .discord-community-inner {
        min-height: 300px !important;
        padding: 30px 22px !important;
        max-width: 100% !important;
        text-align: center !important;
        align-items: center !important;
    }
}

/* ----------------------------------------------------------
   3) Liquid Glass general, seguro y progresivo
   ---------------------------------------------------------- */
:root {
    --ng-glass-bg: rgba(21, 27, 34, .66);
    --ng-glass-bg-strong: rgba(20, 26, 33, .78);
    --ng-glass-border: rgba(255, 255, 255, .105);
    --ng-glass-orange: rgba(239, 139, 24, .28);
    --ng-glass-shadow: 0 16px 44px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255,255,255,.055);
}

/* Backdrop solo donde el navegador lo soporte; si no, queda degradado normal */
@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
    .content-box,
    .content-box > section,
    .main-content,
    #content,
    #sidebar .panel,
    .panel,
    .panel-default,
    .quick-link-home-panel,
    .server-info-home-panel,
    .news-list,
    .news-single,
    .mu-home-ranking-panel,
    .table-responsive,
    .ng-about-public-card,
    .ng-about-public-hero,
    .ngc-section,
    .ngc-card,
    .ng-donation-panel,
    .ng-donation-shell,
    .ng-donation-gateway,
    .ng-exp-calculator,
    .exp-calculator,
    .character-sale-panel,
    .ap-card,
    .discord-community-inner {
        -webkit-backdrop-filter: blur(13px) saturate(132%) !important;
        backdrop-filter: blur(13px) saturate(132%) !important;
    }
}

.content-box,
.content-box > section,
.main-content,
#content,
#sidebar .panel,
.panel,
.panel-default,
.quick-link-home-panel,
.server-info-home-panel,
.news-list,
.news-single,
.mu-home-ranking-panel,
.table-responsive,
.ng-about-public-card,
.ng-about-public-hero,
.ngc-section,
.ngc-card,
.ng-donation-panel,
.ng-donation-shell,
.ng-donation-gateway,
.ng-exp-calculator,
.exp-calculator,
.character-sale-panel,
.ap-card {
    background-color: var(--ng-glass-bg) !important;
    background-image:
        radial-gradient(circle at 18% 0%, rgba(255, 176, 64, .075), transparent 34%),
        linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.012) 42%, rgba(0,0,0,.16)) !important;
    border-color: var(--ng-glass-border) !important;
    box-shadow: var(--ng-glass-shadow) !important;
}

#sidebar .panel,
.quick-link-home-panel,
.server-info-home-panel {
    background-color: var(--ng-glass-bg-strong) !important;
}

.panel-heading,
h3,
h5,
body.drakion-v042 .panel-heading,
body.drakion-v042 h3,
body.drakion-v042 h5 {
    background-image:
        linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.012)),
        linear-gradient(90deg, rgba(239,139,24,.14), rgba(18,25,32,.72)) !important;
    border-bottom-color: rgba(239,139,24,.42) !important;
}

/* Bordes premium suaves en módulos principales */
.content-box,
#content,
#sidebar .panel,
.panel,
.quick-link-home-panel,
.server-info-home-panel,
.news-list,
.news-single {
    border-radius: 8px !important;
}

/* Botones con cristal y glow moderado */
.btn,
.btn-simple,
button,
input[type="submit"],
.discord-community-button {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 8px 18px rgba(0,0,0,.18) !important;
}

.btn:hover,
.btn-simple:hover,
button:hover,
input[type="submit"]:hover,
.discord-community-button:hover {
    filter: brightness(1.08);
}

/* Inputs y selects más consistentes con liquid glass */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
textarea,
select,
.form-control {
    background-color: rgba(11, 15, 20, .62) !important;
    border-color: rgba(255,255,255,.12) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 0 0 1px rgba(0,0,0,.12) !important;
}

/* Evita que el glass arruine paneles blancos internos de pasarelas externas simuladas */
.paypal-card,
.ng-paypal-card,
.payment-white-card,
[class*="paypal"] .white-card {
    background-color: #fff !important;
    background-image: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}
