/* Import Modern Google Font */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap');

/* ============================================
   MISTS OF PANDARIA - REBALANCED JADE THEME
   ============================================ */

:root {
    /* =========================
       BACKGROUNDS (Pure Dark Charcoal)
    ========================== */
    --bg-dark: #0a0c0c;       /* Fundalul principal al site-ului, extrem de închis */
    --bg-dark2: #0f1212;      /* Secțiuni secundare */

    /* Fundaluri interioare pentru carduri/iconițe (Negru mat pentru contrast maxim) */
    --bg-card: #111414;       
    --bg-card2: #0d0f0f;      
    --bg-card3: #080a0a;      

    /* =========================
       JADE PALETTE (Accente & Iconițe)
    ========================== */
    --accent: #26e6a4;        /* Jadul vibrant principal pentru margini și iconițe active */
    --accent-soft: #1ec289;   /* Jad temperat pentru stări normale */
    --accent-dim: #149468;    /* Jad întunecat pentru elemente secundare */
    --accent-deep: #0b543b;   /* Nuanță profundă pentru umbre și fundaluri mici */

    /* Secondary cyan tint (Turcoazul mistic) */
    --accent2: #4ce3ff;

    /* =========================
       TEXT & GLOW EFFECTS
    ========================== */
    --text: #ffffff;          /* Alb curat pentru contrast și lizibilitate */
    --text-muted: #8fa39d;    /* Text secundar șters */
    --text-dark: #050a08;

    /* Alb mistic cu strălucire (White Glow cu tentă de jad/turcoaz) */
    --text-glow-white: 0 0 10px rgba(255, 255, 255, 0.75), 0 0 20px rgba(38, 230, 164, 0.35);
    --text-glow-subtle: 0 0 8px rgba(255, 255, 255, 0.5);

    /* =========================
       BORDERS
    ========================== */
    --border: #1a2220;
    --border-light: #24302d;
    --border-accent: rgba(38, 230, 164, 0.25);

    /* =========================
       GLOWS
    ========================== */
    --accent-glow: rgba(38, 230, 164, 0.25);
    --accent-glow-strong: rgba(38, 230, 164, 0.55);
    --cyan-glow: rgba(76, 227, 255, 0.3);

    /* =========================
       STATUS
    ========================== */
    --red: #ff4d6d;
}

/* General Body */
body {
    background-color: var(--bg-dark);
    color: var(--text);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding-top: 80px;
    font-family: 'Outfit', sans-serif;
    -webkit-font-smoothing: antialiased;
    position: relative;
    z-index: 0;
}

/* Premium CSS background (Orbs animate discret pe fundal închis) */
body::before, body::after {
    content: '';
    position: fixed;
    width: 60vw;
    height: 60vw;
    max-width: 800px;
    max-height: 800px;
    border-radius: 50%;
    z-index: -1;
    filter: blur(160px);
    opacity: 0.06; /* Scăzut intensitatea ca să nu mai fie prea verde fundalul */
    animation: floatBg 25s infinite alternate ease-in-out;
    pointer-events: none;
}

body::before {
    top: -10%;
    left: -10%;
    background: var(--accent);
}

body::after {
    bottom: -10%;
    right: -10%;
    background: #149468; 
    animation-delay: -12.5s;
    animation-duration: 28s;
}

@keyframes floatBg {
    0% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(5vw, 5vh) scale(1.1); }
    66% { transform: translate(-5vw, 10vh) scale(0.9); }
    100% { transform: translate(0, 0) scale(1); }
}

main {
    flex: 1;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    color: var(--text);
}

/* ── Accent text & Glows ── */
.text-accent {
    color: var(--accent) !important;
    text-shadow: var(--text-glow-subtle);
}

.text-accent-dim {
    color: var(--accent-soft);
}

/* ── Section title decoration ── */
.section-title h2 {
    color: var(--text);
    font-size: 2rem;
    letter-spacing: 1px;
    position: relative;
    display: inline-block;
    padding-bottom: .75rem;
    text-shadow: var(--text-glow-white); /* Efectul de White Glow solicitat */
}

.section-title h2::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background: var(--accent);
    border-radius: 2px;
    box-shadow: 0 0 8px var(--accent-glow-strong);
}

/* ============================================
   GAMING CARD (Contrast întunecat cu margini Jad)
   ============================================ */
.game-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-top: 3px solid var(--accent);
    border-radius: 8px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    overflow: hidden;
    box-shadow: 0 6px 25px rgba(0, 0, 0, .75);
}

.game-card:hover {
    transform: translateY(-6px);
    border-color: var(--accent);
    box-shadow: 0 12px 40px rgba(0, 0, 0, .9), 0 0 20px var(--accent-glow);
}

.game-card .card-body {
    padding: 1.75rem;
}

.game-card .card-img-top {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-bottom: 2px solid var(--border);
    mask-image: linear-gradient(to bottom, #000 65%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, #000 65%, transparent 100%);
}

.game-card .card-title {
    color: var(--text);
    font-size: 1.2rem;
    margin-bottom: .5rem;
    text-shadow: var(--text-glow-subtle);
}

.game-card .card-text {
    color: var(--text-muted);
    font-size: .9rem;
}

/* ── Step icon container (Interior Negru, Iconiță Jad) ── */
.step-icon {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: var(--bg-card3); /* Fundal foarte închis în interior */
    border: 2px solid var(--accent-soft); /* Contur Jad */
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.2rem;
    box-shadow: 0 0 14px var(--accent-glow);
    transition: all .25s ease;
}

.step-icon i {
    font-size: 1.8rem;
    color: var(--accent); /* Iconița în sine este Jad pentru contrast maxim */
    text-shadow: 0 0 10px var(--accent-glow-strong);
}

.game-card:hover .step-icon {
    border-color: var(--accent);
    background: #000000;
    box-shadow: 0 0 20px var(--accent-glow-strong);
}

/* ── Realmlist badge ── */
.realmlist-badge {
    background: #000000;
    border: 1px solid var(--accent-dim);
    border-radius: 6px;
    padding: .5rem 1rem;
    color: var(--accent);
    font-family: monospace;
    font-size: .95rem;
    letter-spacing: .5px;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
}

/* ============================================
   VIDEO HERO
   ============================================ */
.video-container {
    position: relative;
    height: 100vh;
    min-height: 600px;
    overflow: hidden;
    margin-top: -80px;
}

#bg-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    object-fit: cover;
    opacity: 0.4; /* Scăzută opacitatea ca să nu domine interfața */
}

.video-container::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom,
            rgba(10, 12, 12, .2) 0%,
            rgba(10, 12, 12, .6) 50%,
            rgba(10, 12, 12, 1) 100%);
    z-index: 1;
}

.video-header {
    position: relative;
    height: 100vh;
    min-height: 600px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    z-index: 2;
}

.overlay-content {
    max-width: 900px;
    margin: 0 auto;
    padding: 2rem;
}

/* Logo */
.logo-container {
    margin-bottom: 2rem;
}

.logo-container img {
    max-height: 320px;
    max-width: 90%;
    filter: drop-shadow(0 0 30px rgba(38, 230, 164, 0.45));
    transition: transform .35s ease;
}

.logo-container img:hover {
    transform: scale(1.04);
}

/* Hero text */
.hero-title {
    font-size: clamp(2rem, 5vw, 3.5rem);
    font-weight: 800;
    color: #ffffff;
    text-shadow: var(--text-glow-white); /* White Glow aplicat pe Titlul principal */
    letter-spacing: 1px;
}

.hero-lead {
    font-size: 1.15rem;
    color: rgba(255, 255, 255, .8);
    font-weight: 300;
}

/* ============================================
   BUTTONS (Rescrise complet din Gold în Magic Jade/White Glow)
   ============================================ */
.btn-gold, .btn-primary {
    background: linear-gradient(135deg, var(--accent), var(--accent-soft));
    color: var(--text-dark) !important;
    font-weight: 700;
    letter-spacing: .5px;
    border: none;
    border-radius: 6px;
    padding: .75rem 2.2rem;
    text-transform: uppercase;
    font-size: .95rem;
    transition: all .25s ease;
    box-shadow: 0 4px 15px rgba(38, 230, 164, .3);
}

.btn-gold:hover, .btn-primary:hover {
    background: #ffffff; /* Butonul devine complet alb pe hover */
    color: #000000 !important;
    box-shadow: 0 6px 25px rgba(255, 255, 255, 0.8), 0 0 15px var(--accent-glow-strong);
    transform: translateY(-2px);
}

.btn-outline-gold {
    background: transparent;
    color: #ffffff;
    border: 1px solid var(--accent);
    border-radius: 6px;
    padding: .75rem 2.2rem;
    font-weight: 600;
    font-size: .95rem;
    text-transform: uppercase;
    transition: all .25s ease;
    text-shadow: var(--text-glow-subtle);
}

.btn-outline-gold:hover {
    background: var(--accent);
    color: var(--text-dark);
    box-shadow: 0 4px 20px var(--accent-glow-strong);
    transform: translateY(-2px);
}

.btn-game-green {
    background: linear-gradient(135deg, var(--accent-soft), var(--accent-dim));
    color: #fff;
    border: none;
    border-radius: 6px;
    font-weight: 700;
    text-transform: uppercase;
    padding: .65rem 1.6rem;
    transition: all .25s ease;
    box-shadow: 0 3px 14px rgba(38, 230, 164, .2);
}

.btn-game-green:hover {
    background: linear-gradient(135deg, var(--accent), var(--accent-soft));
    box-shadow: 0 5px 20px var(--accent-glow-strong);
    transform: translateY(-2px);
}

.btn-secondary {
    background: var(--bg-card2);
    border: 1px solid var(--border);
    color: var(--text);
    font-weight: 600;
    text-transform: uppercase;
    border-radius: 6px;
    padding: .75rem 2rem;
    transition: all .25s ease;
}

.btn-secondary:hover {
    background: #161c1a;
    border-color: var(--accent);
    color: var(--accent);
    transform: translateY(-2px);
}

/* ============================================
   NAVBAR
   ============================================ */
#mainNavbar {
    z-index: 1030;
    background: transparent;
    transition: background .35s ease, box-shadow .35s ease, padding .35s ease;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

#mainNavbar.navbar-scrolled {
    background: rgba(10, 12, 12, .96) !important;
    box-shadow: 0 4px 25px rgba(0, 0, 0, .8);
    border-bottom: 1px solid var(--border);
    padding-top: .5rem;
    padding-bottom: .5rem;
}

.dropdown-menu.game-dropdown {
    background: #0d0f0f;
    border: 1px solid var(--border);
    border-radius: 8px;
    min-width: 200px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.8);
}

.dropdown-menu.game-dropdown .dropdown-item {
    color: var(--text-muted);
    padding: .6rem 1.2rem;
    transition: background .2s, color .2s;
}

.dropdown-menu.game-dropdown .dropdown-item:hover,
.dropdown-menu.game-dropdown .dropdown-item.active {
    background: var(--bg-card);
    color: var(--accent);
}

.dropdown-menu.game-dropdown .dropdown-divider {
    border-color: var(--border);
}

/* Main nav links — Jad hover + underline */
#mainNavbar .nav-main {
    gap: .15rem;
}
#mainNavbar .nav-main .nav-link {
    color: rgba(255, 255, 255, .8);
    font-weight: 500;
    letter-spacing: .5px;
    padding: .5rem 1rem;
    border-radius: 8px;
    position: relative;
    transition: color .2s ease, background .2s ease, transform .2s ease;
}
#mainNavbar .nav-main .nav-link:hover {
    color: var(--accent);
    background: rgba(38, 230, 164, 0.06);
}
#mainNavbar .nav-main .nav-link:hover i {
    transform: translateY(-1px);
}
#mainNavbar .nav-main .nav-link i {
    opacity: .85;
    transition: transform .2s ease, opacity .2s ease;
}
#mainNavbar .nav-main .nav-link.active {
    color: var(--accent);
    background: rgba(38, 230, 164, .04);
}
#mainNavbar .nav-main .nav-link.active i {
    opacity: 1;
}
#mainNavbar .nav-main .nav-link.active::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: .15rem;
    width: 24px;
    height: 2px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, transparent, var(--accent), transparent);
    border-radius: 2px;
}

/* User dropdown trigger */
#mainNavbar .nav-user {
    background: rgba(255, 255, 255, .03);
    border: 1px solid var(--border);
    border-radius: 50px;
    padding: .35rem .9rem !important;
    font-weight: 600;
    letter-spacing: .4px;
    transition: background .2s ease, border-color .2s ease, color .2s ease;
}
#mainNavbar .nav-user:hover,
#mainNavbar .nav-user[aria-expanded="true"] {
    background: rgba(38, 230, 164, .08);
    border-color: var(--accent-soft);
    color: var(--accent) !important;
}
#mainNavbar .nav-user .nav-user-name {
    font-size: .88rem;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 991.98px) {
    #mainNavbar .nav-main {
        margin-top: .75rem;
        padding-top: .75rem;
        border-top: 1px solid var(--border);
    }
    #mainNavbar .nav-main .nav-link.active::after {
        display: none;
    }
    #mainNavbar .nav-user {
        border-radius: 8px;
        margin-top: .25rem;
    }
}

/* ============================================
   STATUS INDICATORS
   ============================================ */
.status-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 6px;
}

.status-online {
    background: #2ecc71;
    box-shadow: 0 0 10px #2ecc71;
}

.status-offline {
    background: var(--red);
    box-shadow: 0 0 10px var(--red);
}

/* Status bar */
.server-status-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.5rem;
    padding: 1.2rem 2rem;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-top: 2rem;
    box-shadow: 0 6px 20px rgba(0,0,0,0.6);
}

.server-status-bar .stat-item {
    font-size: .95rem;
}

.server-status-bar .stat-label {
    color: var(--text-muted);
    margin-right: 4px;
}

.server-status-bar .stat-value {
    color: var(--text);
    font-weight: 600;
}

/* ============================================
   FORM STYLING (Interior Negru Mat pentru contrast complet)
   ============================================ */
.form-container {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-top: 3px solid var(--accent);
    padding: 2.5rem;
    border-radius: 10px;
    margin: 2rem auto;
    max-width: 500px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .6);
}

.form-control {
    background: #080a0a; /* Interiorul input-ului devine negru */
    color: var(--text);
    border: 1px solid var(--border-light);
    border-radius: 6px;
    padding: .75rem 1rem;
    transition: border-color .2s, box-shadow .2s;
}

.form-control:focus {
    background: #000000;
    color: var(--text);
    border-color: var(--accent);
    box-shadow: 0 0 12px rgba(38, 230, 164, .35) !important;
}

.form-control::placeholder {
    color: #44524e;
}

.form-label {
    color: #cbdad5;
    font-weight: 500;
    margin-bottom: .4rem;
}

/* ============================================
   FOOTER
   ============================================ */
footer.footer {
    flex-shrink: 0;
    background-color: transparent !important;
    border-top: 1px solid var(--border);
}

/* ============================================
   CONTENT SECTIONS
   ============================================ */
.content-section {
    padding: 4rem 0;
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 768px) {
    .hero-title {
        font-size: 2.2rem;
    }
    .hero-lead {
        font-size: 1rem;
    }
    .logo-container img {
        max-height: 140px;
    }
}

@media (max-width: 576px) {
    .btn-gold, .btn-primary, .btn-outline-gold {
        width: 100%;
        margin-bottom: .5rem;
    }
}

/* ============================================
   WoW CLASS COLORS
   ============================================ */
.class-warrior { color: #C79C6E; }
.class-paladin { color: #F58CBA; }
.class-hunter { color: #ABD473; }
.class-rogue { color: #FFF569; }
.class-priest { color: #FFFFFF; }
.class-deathknight { color: #C41F3B; }
.class-shaman { color: #0070DE; }
.class-mage { color: #69CCF0; }
.class-warlock { color: #9482C9; }
.class-monk { color: #00FF96; }
.class-druid { color: #FF7D0A; }
.class-default { color: #CCCCCC; }

/* ============================================
   LEGACY COMPAT
   ============================================ */
.glass-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-top: 3px solid var(--accent);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, .6);
    transition: transform .25s ease, box-shadow .25s ease;
}

.glass-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 35px rgba(0, 0, 0, .7), 0 0 20px var(--accent-glow);
}

/* REMOVE ALL DEFAULT FOCUS GLOWS EXCEPT CUSTOM JADE */
*:focus, *:active, .btn:focus, .btn:active, .form-control:focus, .form-control:active {
    outline: none !important;
}

.game-card:hover, .game-card:focus, .game-card:active {
    border-color: var(--accent) !important;
    box-shadow: 0 0 20px var(--accent-glow) !important;
}
/* ==========================================================================
   FIX DISCORDANȚE PAGINA DE ȘTIRI (FĂRĂ AFECTAREA CENTRĂRII)
   ========================================================================== */

/* Înlocuim fundalul gradient vechi al cercului pentru iconițe cu stilul nou */
div[style*="background:linear-gradient(145deg,#1a1a2e,#12121f)"] {
    background: var(--bg-card3) !important;
    border-color: var(--border-accent) !important;
    box-shadow: 0 0 12px var(--accent-glow) !important;
    transition: all 0.25s ease-in-out;
}

/* Efect de hover pe cercul iconiței când trecem peste card */
.news-card-wrapper:hover div[style*="background:linear-gradient(145deg,#1a1a2e,#12121f)"],
a[style*="text-decoration:none;color:inherit"]:hover div[style*="background:linear-gradient(145deg,#1a1a2e,#12121f)"] {
    border-color: var(--accent) !important;
    background: #000000 !important;
    box-shadow: 0 0 15px var(--accent-glow-strong) !important;
}

/* Suprascriem vechile margini maro din PHP (rgba(139,69,19,...)) */
div[style*="border:1px solid rgba(139,69,19"],
hr[style*="border-color:rgba(139,69,19"] {
    border-color: var(--border) !important;
}

/* Reparăm butonul de Edit Post (Admin) care avea fundal maro fixat inline */
a[style*="background:#8B4513"] {
    background: var(--bg-card) !important;
    border-color: var(--border-light) !important;
    color: var(--text) !important;
    transition: all 0.2s ease !important;
}
a[style*="background:#8B4513"]:hover {
    border-color: var(--accent) !important;
    color: var(--accent) !important;
    box-shadow: 0 0 10px var(--accent-glow) !important;
}

/* Modificări pentru Paginare (news-pager) - forțăm tema Jade */
.news-pager .page-link {
    background: var(--bg-card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
    transition: all 0.2s ease-in-out !important;
}

.news-pager .page-link:hover {
    background: var(--bg-dark2) !important;
    color: #ffffff !important;
    border-color: var(--accent) !important;
    text-shadow: 0 0 8px var(--accent) !important;
}

.news-pager .page-item.active .page-link {
    background: #121615 !important;
    border-color: var(--accent) !important;
    color: var(--accent) !important;
    font-weight: 700 !important;
    text-shadow: 0 0 10px var(--accent-glow-strong) !important;
}

.news-pager .page-item.disabled .page-link {
    background: var(--bg-card3) !important;
    color: #33403c !important;
    border-color: rgba(255, 255, 255, 0.01) !important;
}

/* Glow elegant la hover pe titlurile cardurilor din listă */
.news-card-wrapper:hover h5, 
a[style*="text-decoration:none;color:inherit"]:hover h5 {
    text-shadow: 0 0 8px rgba(255, 255, 255, 0.85) !important;
}

/* Culoarea textului pentru dată (schimbăm griul șters în ceva mai vizibil) */
span[style*="color:#4a5568"] {
    color: var(--text-muted) !important;
    font-weight: 500;
}
/* ==========================================================================
   TITLURI ALBE CU GLOW & ICONIȚĂ JAD REZOLUȚIE MAXIMĂ (NEWS)
   ========================================================================= */

/* Țintim titlul principal ca să fie alb curat cu reflexie elegantă */
main.container header.text-center h1,
main.container header.mb-5 h1 {
    color: #ffffff !important;
    text-shadow: var(--text-glow-white) !important;
}

/* Țintim iconița bi-newspaper: Jad clar, cu o aură foarte fină în spate */
main.container header.text-center h1 i.bi-newspaper,
main.container header.mb-5 h1 i.bi-newspaper {
    color: var(--accent) !important; /* Jadul tău curat */
    /* Folosim o singură umbră fină, foarte transparentă, ca să nu mai „înghită” detaliile ziarului */
    filter: drop-shadow(0 0 5px rgba(38, 230, 164, 0.45)) !important;
}
/* ==========================================================================
   ALINIERE MODUL FORUM — STIL PREMIUM MAGIC JADE & CHARCOAL
   ========================================================================== */

/* 1. Titlul Principal și Breadcrumbs */
main.container h1 .bi-chats,
main.container h1 i {
    color: var(--accent) !important;
    filter: drop-shadow(0 0 5px rgba(38, 230, 164, 0.45)) !important;
}

.forum-breadcrumbs,
.forum-breadcrumbs a {
    color: var(--text-muted) !important;
    text-decoration: none !important;
    font-size: 0.9rem !important;
    font-weight: 500;
    transition: all 0.2s ease;
}
.forum-breadcrumbs a:hover {
    color: var(--accent2) !important;
    text-shadow: 0 0 8px var(--accent2);
}

/* 2. Cardurile de Categorii (.fo-cat-card) */
.fo-cat-card {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 1.25rem !important;
    margin-bottom: 1rem !important;
    text-decoration: none !important;
    transition: all 0.25s ease-in-out !important;
}

.fo-cat-card:hover {
    transform: translateY(-2px) !important;
    background: var(--bg-dark2) !important;
    border-color: var(--accent-soft) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5) !important;
}

/* 3. Iconițele Forumului (Exact ca pe Index/News) */
.fo-cat-icon {
    width: 46px !important;
    height: 46px !important;
    border-radius: 50% !important;
    background: var(--bg-card3) !important;
    border: 1px solid var(--border-accent) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 0 8px var(--accent-glow) !important;
    transition: all 0.25s ease !important;
}

.fo-cat-icon i {
    color: var(--accent) !important;
    font-size: 1.1rem !important;
    filter: drop-shadow(0 0 4px var(--accent-glow-strong)) !important;
}

.fo-cat-card:hover .fo-cat-icon {
    border-color: var(--accent) !important;
    background: #000000 !important;
    box-shadow: 0 0 14px var(--accent-glow-strong) !important;
}

/* 4. Textul din interiorul Categoriilor */
.fo-cat-name {
    color: var(--text) !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
    transition: all 0.2s ease;
}
.fo-cat-card:hover .fo-cat-name {
    text-shadow: 0 0 8px rgba(255, 255, 255, 0.85) !important;
}

.fo-cat-desc {
    color: rgba(255, 255, 255, 0.6) !important;
    font-size: 0.9rem !important;
    margin-top: 0.25rem;
}

/* 5. Zona de Statistici / Ultimul Mesaj */
.fo-cat-stats {
    color: var(--text-muted) !important;
    font-size: 0.85rem !important;
    border-left: 1px solid var(--border-light) !important;
}

.fo-stat-count {
    color: var(--accent2) !important; /* Accentul Turcoaz pentru numere */
    font-weight: 700 !important;
}

.latest-title {
    color: var(--text) !important;
    font-weight: 600 !important;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Corectăm vechiul gri șters scris inline în PHP (#4a5568) pentru autori și timp relativ */
.fo-cat-stats div[style*="color:#4a5568"],
.fo-cat-stats span[style*="color:#4a5568"],
div[style*="font-size:.74rem;color:#4a5568"],
div[style*="color:#4a5568;font-size:.78rem"] {
    color: #556864 !important; /* Un gri-verzui închis, mult mai curat și lizibil în tema întunecată */
    font-weight: 500 !important;
}

/* 6. Stiluri pentru Postări interioare (Thread View) și Markdown */
.forum-post {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    margin-bottom: 1.5rem !important;
}

.forum-post-author {
    background: var(--bg-card2) !important;
    border-right: 1px solid var(--border-light) !important;
}

.forum-author-name {
    color: var(--text) !important;
    font-weight: 700 !important;
}

.forum-post-body {
    color: rgba(255, 255, 255, 0.85) !important;
    line-height: 1.7 !important;
}

/* Suport pentru linkuri, citate și cod în interiorul mesajelor din forum */
.forum-post-body a { color: var(--accent2) !important; text-decoration: none; }
.forum-post-body a:hover { text-shadow: 0 0 8px var(--accent2); color: #fff !important; }
.forum-post-body blockquote {
    border-left: 3px solid var(--accent) !important;
    background: rgba(38, 230, 164, 0.02) !important;
    padding: 0.5rem 1rem !important;
    color: var(--text-muted) !important;
}

/* 7. Alerte și Mesaje informative (ex: Forum Disabled) */
.alert-info, 
div[style*="background:#1a1a2e;border:1px solid rgba(139,69,19,.2)"] {
    background: var(--bg-card2) !important;
    border: 1px solid var(--border-accent) !important;
    color: var(--text) !important;
    box-shadow: 0 0 15px rgba(38, 230, 164, 0.05) !important;
}
/* ==========================================================================
   REPARARE BANNER FORUM (.FO-HERO) - TEMA MAGIC JADE
   ========================================================================== */
.fo-hero {
    /* Înlocuim gradientul maroniu cu un degrade elegant de Cărbune și elemente întunecate */
    background: linear-gradient(135deg, rgba(20, 20, 28, 0.9) 0%, rgba(10, 10, 15, 0.95) 100%) !important;
    
    /* Schimbăm bordura maro într-o bordură fină specifică temei tale */
    border: 1px solid var(--border) !important;
    
    /* Adăugăm o umbră adâncă și o strălucire discretă de jad în fundal */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5), inset 0 0 15px rgba(38, 230, 164, 0.03) !important;
    border-radius: 12px;
    padding: 1.5rem 1.75rem;
    margin-bottom: 1.5rem;
}

/* Forțăm textul mare (titlul) din interior să fie Alb cu strălucire discretă */
.fo-hero h1, .fo-hero h2 {
    color: #ffffff !important;
    font-weight: 800 !important;
    text-shadow: var(--text-glow-white) !important;
}

/* Forțăm iconița (cea cu mesajul sau ce iconiță ai acolo) să devină Jad mistic */
.fo-hero i, .fo-hero .bi {
    color: var(--accent) !important;
    filter: drop-shadow(0 0 8px rgba(38, 230, 164, 0.6)) !important;
}

/* Descrierea sau textul mic de sub titlu */
.fo-hero p, .fo-hero small, .fo-hero text {
    color: var(--text-muted) !important;
}
/* ==========================================================================
   REPARARE BUTOANE MODERATOR (.FO-MOD-BTN) - MAGIC JADE TO WHITE GLOW
   ========================================================================== */
.fo-mod-btn {
    background: rgba(38, 230, 164, 0.03) !important; /* Fundal foarte discret, semi-transparent */
    color: var(--accent) !important; /* Butonul stă pe culoarea de Jad în repaus */
    border: 1px solid rgba(38, 230, 164, 0.25) !important; /* O bordură fină tot din nuanța de jad */
    border-radius: 4px;
    padding: .35rem .75rem;
    font-size: .8rem;
    cursor: pointer;
    font-family: inherit;
    transition: all .2s ease-in-out !important;
    text-shadow: 0 0 5px rgba(38, 230, 164, 0.3) !important;
}

/* Efectul când GM-ul pune mouse-ul pe buton (Hover) */
.fo-mod-btn:hover {
    background: rgba(255, 255, 255, 0.08) !important; /* Fundalul primește o reflexie fină albă */
    color: #ffffff !important; /* Textul se aprinde în alb curat */
    border-color: #ffffff !important; /* Bordura devine și ea albă */
    
    /* Explozie combinată de glow: alb intens aproape de litere și aura ta de jad în fundal */
    box-shadow: 0 0 8px rgba(255, 255, 255, 0.6), 0 0 15px rgba(38, 230, 164, 0.4) !important;
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.8) !important;
    
    font-weight: 600;
}
/* ==========================================================================
   REPARARE CONTAINER ACTIVITATE RECENTĂ (.FO-RECENT)
   ========================================================================== */
.fo-recent {
    /* Păstrăm baza întunecată, dar îi dăm un gradient fin, modern */
    background: linear-gradient(145deg, var(--bg-card) 0%, var(--bg-card2) 100%) !important;
    
    /* Schimbăm bordura maro urâtă cu bordura standard din tema Magic Jade */
    border: 1px solid var(--border) !important;
    
    /* Adăugăm o umbră discretă și un glow interior de jad extrem de fin */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4), inset 0 0 10px rgba(38, 230, 164, 0.02) !important;
    border-radius: 10px;
    padding: 1rem 1.2rem;
    margin-bottom: 1.6rem;
}
/* ==========================================================================
   REPARARE TITLURI RECENTE (.FO-RECENT-H) - WHITE GLOW EFFECT
   ========================================================================== */
.fo-recent-h {
    color: #ffffff !important; /* Transformăm textul în alb curat */
    font-weight: 700 !important;
    font-size: 1rem;
    margin-bottom: .5rem;
    
    /* Adăugăm efectul de strălucire (glow) bazat pe Jadul mistic */
    text-shadow: 0 0 4px rgba(38, 230, 164, 0.6), 0 0 10px rgba(38, 230, 164, 0.3) !important;
    
    transition: all 0.2s ease-in-out !important;
}

/* Efect opțional: Când cineva trece cu mouse-ul peste titlu (dacă e link), strălucirea devine mai intensă */
.fo-recent-h:hover {
    color: var(--accent) !important; /* La hover, textul face tranziție fină spre Jad complet */
    text-shadow: 0 0 8px var(--accent-glow) !important;
}
/* ==========================================================================
   EFECT HOVER TITLURI RECENTE (.FO-RECENT-H:HOVER) - ELIMINARE VERDE
   ========================================================================== */
.fo-recent-h:hover,
a:has(.fo-recent-h):hover,
.fo-recent-h a:hover {
    /* Forțăm textul să rămână Alb sau să treacă în Jadul tău premium, NU în verdele vechi */
    color: var(--accent) !important; 
    
    /* Intensificăm efectul de neon când mouse-ul este deasupra */
    text-shadow: 0 0 6px var(--accent-glow), 0 0 15px rgba(38, 230, 164, 0.6) !important;
    
    text-decoration: none !important; /* Scoate sublinierea dacă e link */
}
/* ==========================================================================
   REPARARE ICONIȚE ACTIVITATE RECENTĂ (.FO-RECENT-IC) - MAGIC JADE
   ========================================================================== */
.fo-recent-ic {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    
    /* Păstrăm fundalul întunecat rotund, dar îl corelam cu nuanțele de cărbune */
    background: linear-gradient(145deg, var(--bg-card2), var(--bg-card3)) !important;
    
    /* Înlocuim bordura maro cu bordura standard, elegantă */
    border: 1px solid var(--border) !important;
    
    /* Schimbăm verdele vechi în Jadul tău premium și îi dăm o strălucire mistică */
    color: var(--accent) !important;
    filter: drop-shadow(0 0 4px rgba(38, 230, 164, 0.55)) !important;
    
    font-size: .9rem;
    transition: all 0.2s ease-in-out;
}

/* Efect când se trece cu mouse-ul peste rândul activității respective (opțional, pentru dinamică) */
a:hover .fo-recent-ic,
.fo-recent:hover .fo-recent-ic {
    border-color: var(--accent-soft) !important;
    filter: drop-shadow(0 0 7px var(--accent-glow)) !important;
    background: var(--bg-card3) !important;
}
/* ==========================================================================
   REPARARE NUME AUTOR POSTARE (.FO-POST-AUTHOR) - EFECT JAD MISTIC
   ========================================================================== */
.fo-post-author,
.fo-post-author a {
    /* Folosim Jadul tău premium ca bază pentru text */
    color: var(--accent) !important; 
    font-weight: 700 !important;
    font-size: .9rem;
    word-break: break-word;
    
    /* Efect de intensificare mistică: o aură fină în jurul literelor verzi */
    text-shadow: 0 0 3px rgba(38, 230, 164, 0.6), 0 0 8px rgba(38, 230, 164, 0.25) !important;
    
    transition: all 0.2s ease-in-out !important;
    text-decoration: none !important;
}

/* Efect când pui mouse-ul pe nume (Hover) - devine o reflexie intensă */
.fo-post-author:hover,
.fo-post-author a:hover {
    /* La hover, numele se aprinde puternic spre alb-jad (lumina maximă a cristalului) */
    color: #ffffff !important; 
    
    /* Schimbăm aura într-una mult mai puternică și concentrată */
    text-shadow: 0 0 6px var(--accent-glow), 0 0 15px rgba(38, 230, 164, 0.7) !important;
}
/* ==========================================================================
   DETURNARE FUNDAL DEFAUT BOOTSTRAP (.BG-DARK / --BS-DARK-RGB)
   ========================================================================== */
/* Suprascriem comportamentul când Bootstrap încearcă să aplice clasa de fundal închis */
.bg-dark, 
[class*="bg-dark"],
div[style*="background-color: rgba(var(--bs-dark-rgb)"] {
    /* Înlocuim culoarea RGB nativă a Bootstrap cu nuanța ta pură de Cărbune (Charcoal) */
    --bs-dark-rgb: 15, 15, 22 !important; 
    
    /* Forțăm fundalul să folosească variabila ta principală de card/fundal */
    background-color: rgba(15, 15, 22, var(--bs-bg-opacity, 1)) !important;
}

/* Dacă elementul este un card sau un panou din forum care folosea acel fundal */
.fo-card, .forum-post-card, .fo-cat-card {
    background-color: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
}
/* ==========================================================================
   TITLURI TOPICURI / DISCUȚII - JAD GLOW CU HOVER ÎN ALB STRĂLUCITOR
   ========================================================================== */
/* Selector extins pentru a prinde clasa exactă de titlu din forum */
.fo-thread-title,
.forum-post-card a[style*="color: #00ff9d"],
a:has(> [style*="color: #00ff9d"]),
div[style*="white-space: nowrap"] > a {
    color: var(--accent) !important; /* Baza: Jadul tău premium */
    font-weight: 600 !important;
    text-decoration: none !important;
    font-size: 1rem;
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    
    /* Glow discret de jad pentru starea de repaus */
    text-shadow: 0 0 4px rgba(38, 230, 164, 0.5), 0 0 10px rgba(38, 230, 164, 0.2) !important;
    transition: all 0.2s ease-in-out !important;
}

/* Efectul spectaculos de trecere cu mouse-ul (Hover) */
.fo-thread-title:hover,
.forum-post-card a[style*="color: #00ff9d"]:hover,
div[style*="white-space: nowrap"] > a:hover {
    color: #ffffff !important; /* Se aprinde instant în alb imaculat */
    text-decoration: none !important;
    
    /* Explozie de lumină: alb curat pe litere și aura ta de jad în fundal */
    text-shadow: 0 0 6px rgba(255, 255, 255, 0.95), 0 0 15px var(--accent-glow) !important;
    
    /* Un efect fin de deplasare la hover (opțional, dă o senzație foarte profi) */
    transform: translateX(3px);
}
/* ==========================================================================
   MIGRARE RÂNDURI PRINCIPALE FORUM (PEȘTELE MARE) - PREMIUM JADE
   ========================================================================== */
.fo-category-row,
.fo-thread-row,
.forum-list-item,
div[style*="background: #19192d"],
div[style*="background:#19192d"] {
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
    
    /* Schimbăm fundalul vechi violet cu fundalul tău curat de cărbune (card) */
    background: var(--bg-card) !important;
    
    /* Stergem bordura maro și punem bordura discretă din tema Magic Jade */
    border: 1px solid var(--border) !important;
    
    border-radius: 8px !important;
    padding: .85rem 1.1rem !important;
    margin-bottom: .55rem !important;
    
    /* Mărim puțin timpul de tranziție ca efectul de hover să fie super fluid */
    transition: all 0.25s ease-in-out !important;
    
    /* Adăugăm o umbră foarte fină dedesubt pentru profunzime */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

/* Efectul spectaculos când mouse-ul trece peste tot rândul (Hover) */
.fo-category-row:hover,
.fo-thread-row:hover,
.forum-list-item:hover,
div[style*="background: #19192d"]:hover,
div[style*="background:#19192d"]:hover {
    /* Fundalul devine o idee mai deschis la hover pentru feedback vizual */
    background: var(--bg-card2) !important;
    
    /* Bordura se aprinde instant în Jadul tău premium */
    border-color: var(--accent-soft) !important;
    
    /* Îi dăm un glow fin de jad pe toată lungimea rândului */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4), 0 0 8px rgba(38, 230, 164, 0.15) !important;
    
    /* Împingem rândul foarte discret 2 pixeli în sus (efect 3D de plutire) */
    transform: translateY(-2px);
}
/* ==========================================================================
   REPARARE CASĂ POSTARE (.FO-POST) - CHARCOAL & JADE BORDER
   ========================================================================== */
.fo-post {
    display: flex !important;
    gap: 1.2rem !important;
    
    /* Trecem fundalul pe gradientul tău premium de cărbune */
    background: linear-gradient(145deg, var(--bg-card) 0%, var(--bg-card2) 100%) !important;
    
    /* Ștergem bordura maro și punem bordura standard, curată, din temă */
    border: 1px solid var(--border) !important;
    
    border-radius: 10px !important;
    padding: 1.4rem !important;
    margin-bottom: 1rem !important;
    
    /* Adăugăm o umbră fină pentru adâncime și o reflexie discretă în interior */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.45), inset 0 0 12px rgba(38, 230, 164, 0.01) !important;
    
    transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out !important;
}

/* Efect discret când cineva citește sau ține mouse-ul pe o anumită postare */
.fo-post:hover {
    /* Bordura capătă o foarte fină tentă de jad, fără să fie stridentă */
    border-color: rgba(38, 230, 164, 0.2) !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5), 0 0 10px rgba(38, 230, 164, 0.05) !important;
}
/* ==========================================================================
   REPARARE FINALĂ: LINIE SEPARATOARE ȘI ALINIERE BUTOANE MODERARE
   ========================================================================== */
.fo-post-footer,
.fo-signature-separator,
div[style*="border-top: 1px solid rgba(139, 69, 19"],
div[style*="border-top:1px solid rgba(139,69,19"],
hr[style*="rgba(139, 69, 19"] {
    /* PĂSTRĂM STRUCTURA: Nu mai forțăm height 0 sau background transparent */
    margin-top: .85rem !important;
    padding-top: .75rem !important;
    
    /* Ne asigurăm că elementele din interior (butoanele) rămân frumos aliniate */
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important; 
    gap: 0.75rem !important;
    
    /* SCHIMBĂM STRICT LINIA: Punem o bordură de fix 1px din tema ta, fără dreptunghiuri */
    border-top: 1px solid var(--border) !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    
    /* Adăugăm o reflexie mistică fină exact sub linie */
    box-shadow: none !important;
    filter: drop-shadow(0 -1px 2px rgba(38, 230, 164, 0.15)) !important;
}
/* ==========================================================================
   PANOU ȘTIRI ADMIN (.NEWS-ADMIN-CARD) - STATUS PREMIUM JADE
   ========================================================================= */
.news-admin-card {
    /* Păstrăm structura și dimensiunile originale */
    padding: 1.5rem !important;
    margin-bottom: 1.5rem !important;
    border-radius: 8px !important;
    
    /* Înlocuim fundalul vechi cu gradientul tău tăios de cărbune */
    background: linear-gradient(145deg, var(--bg-card) 0%, var(--bg-card2) 100%) !important;
    
    /* Schimbăm bordura maro cu o dungă fină de jad stins pentru autoritate vizuală */
    border: 1px solid rgba(38, 230, 164, 0.25) !important;
    
    /* Îi dăm o umbră puternică de adâncime și un glow de fundal fin, fiind panou de admin */
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5), inset 0 0 15px rgba(38, 230, 164, 0.02) !important;
    
    transition: border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out !important;
}

/* Efect când jucătorii trec cu mouse-ul peste panoul tău de știri */
.news-admin-card:hover {
    /* Bordura de jad se aprinde mai intens */
    border-color: var(--accent-soft) !important;
    
    /* Aura din spatele panoului se extinde elegant */
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6), 0 0 15px rgba(38, 230, 164, 0.1) !important;
}
/* ==========================================================================
   CELULE TABEL ȘTIRI (.NEWS-TBL TD) - SEPARATOARE DISCRETE
   ========================================================================== */
.news-tbl td {
    padding: .7rem .8rem !important;
    vertical-align: middle !important;
    
    /* Înlocuim dunga maro cu o linie fină, stinsă, din tema cărbune */
    border-bottom: 1px solid var(--border) !important;
}

/* Opțional: Să scoatem linia de sub ultima celulă ca să nu se bată cap în cap cu bordura cardului */
.news-tbl tr:last-child td {
    border-bottom: none !important;
}
/* ==========================================================================
   BARĂ UNELTE EDITOR (.EDITOR-TOOLBAR) - MODERN CHARCOAL
   ========================================================================== */
.EasyMDEContainer .editor-toolbar {
    /* Păstrăm fundalul închis nuanțat */
    background: var(--bg-card) !important;
    
    /* Înlocuim bordura maro cu cea din tema ta cărbune/jad */
    border: 1px solid var(--border) !important;
    border-bottom: none !important; /* Lăsăm partea de jos liberă pentru editare */
    
    border-top-left-radius: 4px !important;
    border-top-right-radius: 4px !important;
    opacity: 1 !important;
    padding: 0.6rem !important;
}

/* OPTIMIZARE BUTOANE: Forțăm iconițele din bară să fie luminate fin și să reacționeze la hover */
.EasyMDEContainer .editor-toolbar button {
    color: rgba(255, 255, 255, 0.7) !important;
    transition: all 0.2s ease-in-out !important;
    border-radius: 4px !important;
}

/* Efect când treci cu mouse-ul peste butoanele de Bold, Italic etc. */
.EasyMDEContainer .editor-toolbar button:hover,
.EasyMDEContainer .editor-toolbar button.active {
    background: var(--bg-card2) !important;
    color: var(--accent) !important; /* Iconița se aprinde în jad */
    text-shadow: 0 0 5px var(--accent-glow) !important;
}
/* ==========================================================================
   BARĂ STATUS JOS EDITOR (.EDITOR-STATUSBAR) - COMPLETĂRI TEMĂ
   ========================================================================== */
.EasyMDEContainer .editor-statusbar {
    /* Schimbăm fundalul pe cărbunele tău profund */
    background: var(--bg-card) !important;
    
    /* Înlocuim dunga maro cu bordura curată a temei */
    border: 1px solid var(--border) !important;
    border-top: none !important; /* Lăsăm partea de sus liberă să se lipească de caseta de text */
    
    /* Trecem textul mic (număr cuvinte/linii) pe un argintiu curat și lizibil */
    color: rgba(255, 255, 255, 0.5) !important;
    
    padding: .35rem .8rem !important;
    font-size: .75rem !important;
    border-bottom-left-radius: 4px !important;
    border-bottom-right-radius: 4px !important;
}

/* Dacă există cifre sau indicatori speciali în bara de status, le dăm un strop de jad */
.EasyMDEContainer .editor-statusbar span,
.EasyMDEContainer .editor-statusbar .lines,
.EasyMDEContainer .editor-statusbar .words {
    color: var(--accent) !important;
}
/* ==========================================================================
   BUTON PRINCIPAL ADMIN ȘTIRI (.NEWS-ADMIN-BTN-PRIMARY)
   ========================================================================== */
.news-admin-btn-primary {
    /* Înlocuim maroul cu un fundal închis, elegant */
    background: var(--bg-card2) !important;
    color: #ffffff !important;
    
    /* Schimbăm bordura cărămizie cu o linie discretă din tema ta */
    border: 1px solid var(--border) !important;
    
    padding: 0.5rem 1.2rem !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.5px !important;
    transition: all 0.2rem ease-in-out !important;
    cursor: pointer !important;
}

/* Efectul când adminul trece cu mouse-ul peste buton (Hover) */
.news-admin-btn-primary:hover {
    /* Fundalul capătă o nuanță fină de jad stins */
    background: rgba(38, 230, 164, 0.1) !important;
    
    /* Bordura se aprinde în Jadul mistic complet */
    border-color: var(--accent) !important;
    
    /* Textul primește o strălucire fină și curată */
    color: #ffffff !important;
    text-shadow: 0 0 5px var(--accent-glow) !important;
    box-shadow: 0 0 12px rgba(38, 230, 164, 0.2) !important;
}
/* ==========================================================================
   BUTON SECUNDAR ADMIN ȘTIRI (.NEWS-ADMIN-BTN-GHOST)
   ========================================================================== */
.news-admin-btn-ghost {
    background: transparent !important;
    
    /* Text gri-argintiu discret în repaus */
    color: rgba(255, 255, 255, 0.6) !important;
    
    /* Înlocuim bordura maro cu linia fină a temei cărbune */
    border: 1px solid var(--border) !important;
    
    padding: 0.5rem 1.2rem !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.5px !important;
    transition: all 0.2s ease-in-out !important;
    cursor: pointer !important;
}

/* Efectul la hover pentru butonul secundar */
.news-admin-btn-ghost:hover {
    /* Păstrăm transparența, dar îi dăm o idee de fundal foarte întunecat */
    background: rgba(0, 0, 0, 0.2) !important;
    
    /* Bordura se aprinde fin în Jad mistic */
    border-color: rgba(38, 230, 164, 0.6) !important;
    
    /* Textul devine alb pur și capătă un glow discret */
    color: #ffffff !important;
    text-shadow: 0 0 5px var(--accent-glow) !important;
    box-shadow: inset 0 0 8px rgba(38, 230, 164, 0.05) !important;
}
/* ==========================================================================
   CASETA PRINCIPALĂ DE SCRIS (.CODEMIRROR) - COMPLEMENTARĂ JAD
   ========================================================================== */
.EasyMDEContainer .CodeMirror {
    /* Păstrăm fundalul excelent și fontul de programare */
    background: #0a0a0f !important;
    color: #dee2e6 !important;
    font-family: 'SFMono-Regular', Consolas, monospace !important;
    font-size: .9rem !important;
    line-height: 1.55 !important;
    min-height: 420px !important;
    
    /* Înlocuim bordura maro cu cea din tema ta cărbune */
    border: 1px solid var(--border) !important;
    
    /* Îmbinare perfectă: scoatem rotunjirea dacă se leagă direct de bara de status */
    border-radius: 0px !important; 
    
    /* Adăugăm o umbră interioară fină pentru adâncime, să pară o casetă profi de cod */
    box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.8) !important;
    transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out !important;
}

/* Efect când dai click în interiorul casetei și începi să scrii (Focus) */
.EasyMDEContainer .CodeMirror-focused {
    /* Bordura se aprinde fin în Jad mistic */
    border-color: rgba(38, 230, 164, 0.4) !important;
    
    /* O aură discretă de jad pe exterior și adâncime pe interior */
    box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.8), 0 0 10px rgba(38, 230, 164, 0.05) !important;
}
/* ==========================================================================
   EXTERMINARE CĂRĂMIZIU DIN SEPARATOARE ȘI ICONIȚE EDITOR
   ========================================================================== */
.EasyMDEContainer .editor-toolbar .separator,
.EasyMDEContainer .editor-toolbar i.separator,
.editor-toolbar i.separator,
.editor-toolbar .separator {
    display: inline-block !important;
    width: 0 !important;
    height: 18px !important; /* Forțăm o înălțime fixă ca să nu se lungească */
    margin: 0 8px !important;
    vertical-align: middle !important;
    
    /* Îngropăm definitiv cărămiziul: punem linia fină cărbune */
    border-left: 1px solid var(--border) !important;
    
    /* Eliminăm reflexia deschisă sau maro de pe dreapta */
    border-right: 1px solid rgba(0, 0, 0, 0.4) !important;
    background: transparent !important;
}

/* În caz că programatorul a pus culoarea cărămiziu direct pe caracterele iconițelor */
.EasyMDEContainer .editor-toolbar button i,
.EasyMDEContainer .editor-toolbar button::before {
    /* Forțăm iconițele din interior să fie argintii în repaus, NU cărămizii */
    color: rgba(255, 255, 255, 0.6) !important;
    text-shadow: none !important;
}

/* Ne asigurăm că la hover se aprind în Jadul tău, fără nicio urmă de maro */
.EasyMDEContainer .editor-toolbar button:hover i,
.EasyMDEContainer .editor-toolbar button.active i {
    color: #ffffff !important;
    filter: drop-shadow(0 0 4px var(--accent-glow)) !important;
}
/* ==========================================================================
   ANCHILOSARE FINALĂ: HOVER PE SUCURSA DE ICONIȚE GĂSITĂ
   ========================================================================== */

/* Țintim direct structura pe care ai găsit-o, dar în starea de HOVER */
.EasyMDEContainer .editor-toolbar button:hover i, 
.EasyMDEContainer .editor-toolbar button:hover::before {
    /* Forțăm iconița să devină alb pur la hover și îi dăm glow-ul tău de Jad */
    color: #ffffff !important;
    text-shadow: 0 0 5px var(--accent-glow) !important;
}

/* Forțăm și fundalul + chenarul butonului parinte în momentul hover-ului */
.EasyMDEContainer .editor-toolbar button:hover {
    background: rgba(38, 230, 164, 0.12) !important;
    background-color: rgba(38, 230, 164, 0.12) !important;
    border: 1px solid var(--accent) !important;
    border-color: var(--accent) !important;
}
/* ==========================================================================
   BUTOANE EDITOR EASYMDE - CURĂȚARE ȘI REFRESH JAD
   ========================================================================== */

/* 1. Starea de repaus (Când nu atingi butonul) */
.EasyMDEContainer .editor-toolbar button {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 1px solid transparent !important;
    box-shadow: none !important;
}
.EasyMDEContainer .editor-toolbar button i {
    color: rgba(255, 255, 255, 0.6) !important;
    text-shadow: none !important;
}

/* 2. Starea de HOVER (Când pui mouse-ul pe el) */
.EasyMDEContainer .editor-toolbar button:hover {
    background: rgba(38, 230, 164, 0.12) !important;
    background-color: rgba(38, 230, 164, 0.12) !important;
    background-image: none !important;
    
    /* Chenarul pe care îl facem Jad */
    border: 1px solid var(--accent) !important;
    border-color: var(--accent) !important;
    box-shadow: none !important;
}
.EasyMDEContainer .editor-toolbar button:hover i {
    color: #ffffff !important;
    text-shadow: 0 0 5px var(--accent-glow) !important;
}

/* 3. Starea ACTIVE (Când butonul e deja selectat) */
.EasyMDEContainer .editor-toolbar button.active {
    background: rgba(38, 230, 164, 0.25) !important;
    background-color: rgba(38, 230, 164, 0.25) !important;
    background-image: none !important;
    border: 1px solid var(--accent) !important;
    border-color: var(--accent) !important;
}
.EasyMDEContainer .editor-toolbar button.active i {
    color: #ffffff !important;
}