/*
Theme Name: Astra Child Custom
Template: astra
Version: 1.0.1
*/

/* ==========================================================================
   1. VARIABLE GLOBALE & THEME TOKENS (:root)
   ========================================================================== */
:root {
    /* Culori globale și Home Page */
    --bg-main: #0a0a0a;
    --bg-card: #0d1412;
    --border-color: #262420;
    --accent-neon: #00C9A7;
    --accent-hover: #00C9A7;
    --text-light: #ffffff;
    --text-muted: #96928a;
    --red-alert: #FF3B3B;
    --green-alert: #00C9A7;

    /* Culori specifice Pagina Testimoniale */
    --vasika-bg: #0a0a0a;
    --vasika-card-bg: #111111;
    --vasika-border: #1f1d16;
    --vasika-neon: #00C9A7;
    --vasika-text-main: #ffffff;
    --vasika-text-muted: #9c9990;
}

/* ==========================================================================
   2. RESETURI ȘI STILURI DE BAZĂ (Implicit Mobile)
   ========================================================================== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    height: auto !important;
    min-height: 100% !important;
    overflow-y: visible !important;
}

body {
    background-color: var(--bg-main);
    background-attachment: fixed;
    color: var(--text-light);
    font-family: 'Inter', sans-serif, system-ui;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--text-light) !important;
}

a {
    text-decoration: none;
    color: inherit;
}

/* ==========================================================================
   3. UTILITIES & CONTAINERE GLOBALE
   ========================================================================== */
.container {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}

.vasika-container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

.text-accent {
    color: var(--accent-neon);
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
}

.text-red {
    color: var(--red-alert);
}

/* Folosește înălțimea calculată dinamic pentru a împinge conținutul în jos pe orice ecran */
body {
    padding-top: var(--header-height, 64px) !important; 
}

/* Header-ul principal */
header {
    position: fixed;
    top: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0.2) !important; 
    backdrop-filter: blur(12px); 
    -webkit-backdrop-filter: blur(12px); 
    z-index: 1000; 
    border-bottom: 1px solid rgba(255, 255, 255, 0.08); 
    padding: 12px 0;
}

/* Container Flexbox pentru o distribuție perfectă (Stânga - Centru - Dreapta) */
.nav-container {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    position: relative;
    width: 100%;
}

/* Aliniere și comportament corect pentru Logo */
.logo-wrap {
    display: flex !important;
    align-items: center !important;
    z-index: 101;
}

.logo-wrap .logo-link {
    display: inline-block !important;
    line-height: 0 !important;
    width: 40px !important;
    height: 40px !important;
    transition: transform 0.2s ease;
}

.logo-wrap .logo-link:hover {
    transform: scale(1.05);
}

.logo-wrap .logo-link img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    border-radius: 50%;
}

/* Meniu Mobil Dropdown */
.main-menu {
    display: none;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: rgba(13, 20, 18, 0.98); 
    border-bottom: 1px solid var(--border-color);
    padding: 25px 20px;
    gap: 15px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.6);
    z-index: 99;
    max-height: calc(100vh - 70px);
    overflow-y: auto;
}

.main-menu.active {
    display: flex;
}

.main-menu a {
    color: var(--text-muted);
    font-size: 1.05rem;
    width: 100%;
    padding: 12px 0;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    transition: color .3s;
}

.main-menu a:hover {
    color: var(--accent-neon);
}

.menu-toggle {
    display: block;
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
    z-index: 101;
}

.menu-toggle svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: var(--text-light);
    stroke-width: 2;
    stroke-linecap: round;
}

.social-icons {
    display: none;
}

.main-menu .mobile-social-wrap {
    display: flex;
    justify-content: center;
    gap: 20px;
    padding-top: 20px;
    margin-top: 10px;
    width: 100%;
    border-top: 1px solid rgba(255,255,255,0.1);
}

.main-menu .mobile-social-wrap a svg {
    width: 24px;
    height: 24px;
    fill: var(--text-muted);
    transition: fill .3s;
}

.main-menu .mobile-social-wrap a:hover svg {
    fill: var(--accent-neon);
}


/* ==========================================================================
   5. PAGINA ACASA (Sectiuni specifice) - Mobile First
   ========================================================================== */
.hero {
    padding: 110px 0 40px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.hero h1 {
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 20px;
}

.hero p {
    font-size: .95rem;
    color: var(--text-muted);
    max-width: 700px;
    margin: 0 auto 40px;
}

.badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(229, 177, 0, 0.08);
    border: 1px solid rgba(229, 177, 0, 0.25);
    color: var(--accent-neon);
    padding: 6px 16px;
    border-radius: 20px;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 30px;
    text-transform: uppercase;
}

.smart-video-wrapper {
    width: 100%;
    /* Mărim limita maximă la 800px pentru a permite clipurilor landscape să se vadă mari pe desktop */
    max-width: 800px; 
    margin: 0 auto 40px;
    border-radius: 16px;
    overflow: hidden;
    position: relative; 
    background: #0d1412;
    
    /* Împiedică un video portret (vertical) să devină uriaș pe desktop */
    max-height: 75vh; 
    
    /* Aliniere pe centru în caz că videoul este mai îngust decât wrapper-ul */
    display: flex;
    justify-content: center;
    align-items: center;
}

.smart-video-wrapper video {
    width: 100%;
    height: auto; 
    display: block;
    
    /* Asigură încadrarea perfectă: dacă videoul e prea înalt (portret), se micșorează elegant fără să iasă din cadru */
    max-height: 75vh; 
    object-fit: contain; 
}

/* --- OPTIMIZĂRI SPECIFICE PENTRU MOBIL ȘI TIPURI DE CLIPURI --- */

/* Pe mobil (ecrane sub 768px), vrem ca videoul portret să ocupe aproape toată lățimea disponibilă */
@media (max-width: 768px) {
    .smart-video-wrapper {
        max-width: 100%; /* Ocupă tot spațiul pe telefon */
        max-height: 80vh; /* Îi dăm puțin mai mult spațiu pe verticală pe mobil */
        border-radius: 12px; /* Marginile puțin mai fine pe ecrane mici */
    }
    
    .smart-video-wrapper video {
        max-height: 80vh;
    }
}

/* Pe desktop-uri foarte mari, dacă videoul este portret, wrapper-ul s-ar putea lăbărța pe lateral. 
   Acest mic truc detectează dacă wrapper-ul conține un video de tip portret (folosind un standard modern) */
@media (min-width: 769px) {
    /* Dacă știi că folosești doar clipuri verticale într-o anumită secțiune, poți adăuga clasa .is-portrait pe wrapper */
    .smart-video-wrapper.is-portrait {
        max-width: 400px; 
    }
}

.video-overlay-btn {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,.2);
    cursor: pointer;
    transition: opacity .3s;
    border: none;
    width: 100%;
    padding: 0;
    z-index: 2;
}

.video-overlay-btn.hidden {
    opacity: 0;
    pointer-events: none;
}

.custom-btn-container {
    background: rgba(0, 0, 0, 1);
    padding: 12px 24px;
    border-radius: 30px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--accent-neon);
    color: #fff;
    font-size: .95rem;
    font-weight: 700;
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 15px rgba(0,0,0,.5);
}

.btn-main {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: var(--accent-neon);
    color: #0a0a0a;
    padding: 15px 24px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 1rem;
    transition: all .3s ease;
    width: 100%;
    max-width: 400px;
    box-shadow: 0 4px 15px rgba(0,0,0,.7);
}

.btn-main:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 201, 167, 0.25);
    background: var(--accent-hover);
}

.trust-badges {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 30px;
    font-size: .8rem;
    color: var(--text-muted);
}

.trust-badges span {
    display: flex;
    align-items: center;
    gap: 6px;
}

.trust-badges svg {
    width: 16px;
    height: 16px;
    stroke: var(--accent-neon);
    fill: none;
}

.section-wrapper {
    padding: 50px 0;
    border-top: 1px solid var(--border-color);
}

.section-title {
    text-align: center;
    font-size: 1.6rem;
    font-weight: 800;
    margin-bottom: 50px;
}

/* Toate grilele sunt pe o singură coloană implicit pe mobil */
.features-grid, .comparison-grid, .testimonials-grid, .pricing-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.feature-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    padding: 24px;
    border-radius: 12px;
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.feature-icon {
    background: rgba(255, 211, 0, 0.05);
    padding: 12px;
    border-radius: 8px;
    color: var(--accent-neon);
    flex-shrink: 0;
}

.feature-card h4 {
    font-size: 1.1rem;
    margin-bottom: 5px;
}

.feature-card p {
    font-size: .85rem;
    color: var(--text-muted);
}

.comp-box {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    padding: 30px;
    border-radius: 16px;
}

.comp-box.red-box {
    border-top: 3px solid var(--red-alert);
}

.comp-box.green-box {
    border-top: 3px solid var(--green-alert);
    background: rgba(0, 201, 167, 0.05);
}

.comp-box h3 {
    margin-bottom: 20px;
    font-size: 1.2rem;
    display: flex;
    align-items: center;
    gap: 10px;
}

.comp-list {
    list-style: none;
}

.comp-list li {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .95rem;
    color: var(--text-muted);
}

.comp-list.red-list li::before { content: '✕'; color: var(--red-alert); font-weight: bold; }
.comp-list.green-list li::before { content: '✓'; color: var(--green-alert); font-weight: bold; }

.testimonial-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 15px 10px;
    text-align: center;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

.testimonial-card .smart-video-wrapper {
    max-width: 100%;
    margin-bottom: 15px;
}

.testimonial-media {
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: 15px;
    border: 1px solid var(--border-color);
    aspect-ratio: 16/9;
    object-fit: cover;
    display: block;
}

.btn-view-testimonials {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 40px auto 0;
    padding: 10px 24px;
    background: transparent;
    color: var(--text-light);
    font-size: .95rem;
    font-weight: 700;
    border: none;
    border-bottom: 1px solid var(--text-light);
    cursor: pointer;
    transition: all .3s ease;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.btn-view-testimonials:hover {
    color: var(--accent-neon);
    border-bottom-color: var(--accent-neon);
}

.btn-view-testimonials svg {
    transition: transform .3s ease;
}

.btn-view-testimonials:hover svg {
    transform: translateX(5px);
}

.pricing-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 40px 30px;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    transition: all .3s;
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.pricing-card:hover {
    border-color: var(--accent-neon);
    box-shadow: 0 10px 30px rgba(0,0,0,.7);
}

.pricing-card.vip-card {
    border-color: rgba(0, 201, 167, 0.5);
}

.pricing-card.vip-card::before {
    content: 'OFERTĂ LIMITATĂ';
    position: absolute;
    top: 24px;
    right: -40px;
    background: var(--red-alert);
    color: #fff;
    font-size: .7rem;
    font-weight: bold;
    padding: 4px 40px;
    transform: rotate(45deg);
    transform-origin: center;
    z-index: 1;
}

.price-title {
    font-size: 1.3rem;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.price-amount {
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 20px;
}

.price-amount span {
    font-size: 1rem;
    color: var(--text-muted);
    font-weight: 400;
}

.pricing-features {
    list-style: none;
    margin-bottom: 30px;
    flex-grow: 1;
}

.pricing-features li {
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .9rem;
    color: var(--text-muted);
}

.pricing-features li svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    stroke: var(--accent-neon);
    fill: none;
}

.btn-pricing {
    width: 100%;
    padding: 14px;
    background: transparent;
    border: 1px solid var(--accent-neon);
    color: var(--accent-neon);
    border-radius: 8px;
    font-weight: bold;
    cursor: pointer;
    transition: .3s;
    text-align: center;
}

.pricing-card:hover .btn-pricing {
    background: var(--accent-neon);
    color: #060908;
}

footer {
    border-top: 1px solid var(--border-color);
    padding: 40px 20px;
    font-size: .8rem;
    color: var(--text-muted);
    text-align: center;
}

/* ==========================================================================
   6. PAGINA TESTIMONIALE - Mobile First
   ========================================================================== */
body.page-template-default, 
.site {
    background-color: #ffffff;
}

.vasika-testimonials-page {
    background-color: #0a0a0a !important;
    background-attachment: fixed;
    min-height: 100vh;
    padding: 100px 20px 100px 20px !important; /* Padding ajustat pentru mobil */
    box-sizing: border-box;
    overflow: visible;
}

.site-content {
    padding: 0 !important;
    background-color: #0a0a0a !important;
}

#primary {
    margin: 0 !important;
    padding: 0 !important;
}

.site-content > .ast-container,
.ast-container {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

header.site-header {
    background-color: #ffffff !important;
    position: relative;
    z-index: 99;
}

#masthead, .main-header-bar {
    margin-bottom: 0 !important;
    border-bottom: none !important;
}

.vasika-header {
    text-align: center;
    margin-bottom: 60px;
}

.vasika-header h1 {
    color: var(--vasika-text-main);
    font-size: 2.2rem; 
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 15px;
}

.vasika-header span.neon-text {
    color: var(--vasika-neon);
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
}

.vasika-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
}

.vasika-card {
    background-color: var(--vasika-card-bg);
    border: 1px solid var(--vasika-border);
    border-radius: 12px;
    padding: 25px;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.vasika-card:hover {
    transform: translateY(-5px);
    border-color: var(--vasika-neon);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.8);
}

.vasika-content-wrapper {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.vasika-content-wrapper img,
.vasika-content-wrapper video,
.vasika-content-wrapper iframe,
.vasika-content-wrapper .wp-video {
    width: 100% !important;
    height: auto !important;
    border-radius: 8px;
    margin-bottom: 20px;
    border: 1px solid var(--vasika-border);
}

.vasika-content-wrapper p {
    font-size: 1.05rem;
    line-height: 1.6;
    color: var(--vasika-text-muted);
    font-style: italic;
    margin-bottom: 20px;
}

.vasika-author {
    font-weight: 600;
    color: var(--vasika-text-main);
    font-size: 1.1rem;
    text-align: right;
    margin-top: auto;
}

/* ==========================================================================
   7. PAGINA COMUNITATE - Mobile First (REPARATĂ)
   ========================================================================== */
.vasika-comunitate-wrapper {
    background-color: #0a0a0a !important;
    background-attachment: fixed;
    color: #ffffff;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    
    /* MODIFICARE CRUCIALĂ: Am crescut padding-ul de jos de la 50px la 150px. 
       Astfel, conținutul scapă de sub gradientul de 100px al footer-ului global. */
    padding: 100px 0 150px 0; 
    
    min-height: 80vh;
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    box-sizing: border-box;
    display: inline-block; /* Ajută la calcularea corectă a înălțimii în raport cu footer-ul */
}

.vasika-header-sectiune {
    text-align: center;
    margin-bottom: 60px;
}

.vasika-insigna {
    background: rgba(0, 201, 167, 0.08);
    color: #00C9A7;
    border: 1px solid rgba(0, 201, 167, 0.25);
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    display: inline-block;
    margin-bottom: 20px;
}

.vasika-header-sectiune h1 {
    font-size: 32px;
    font-weight: 800;
    margin: 0 0 15px 0;
    color: #ffffff;
    letter-spacing: -0.5px;
    text-transform: none;
}

.vasika-header-sectiune h1 span,
.vasika-header-sectiune h1 strong {
    color: #00C9A7;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
}

.vasika-header-sectiune p {
    color: #96928a;
    font-size: 16px;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

.vasika-grila-canale {
    display: grid;
    grid-template-columns: 1fr;
    gap: 25px;
    margin-top: 40px;
}

.vasika-card-canal {
    background: #0d1412;
    border: 1px solid #262420;
    border-radius: 12px;
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
}

.vasika-card-canal:hover {
    transform: translateY(-5px);
    border-color: #00C9A7;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.7);
}

.card-interior {
    padding: 30px;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.card-sus {
    margin-bottom: 20px;
}

.badge-platforma {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: #1f262e;
    color: #a0aec0;
    padding: 4px 10px;
    border-radius: 4px;
    display: inline-block;
    margin-bottom: 12px;
}

.platforma-discord .badge-platforma { background: rgba(88, 101, 242, 0.15); color: #5865f2; }
.platforma-telegram .badge-platforma { background: rgba(0, 136, 204, 0.15); color: #0088cc; }

.titlu-canal {
    font-size: 22px;
    font-weight: 700;
    margin: 0;
    color: #ffffff;
}

.descriere-canal {
    color: #00C9A7;
    font-size: 14px;
    line-height: 1.6;
    flex-grow: 1;
}

.descriere-canal ul {
    margin: 10px 0 0 0;
    padding-left: 20px;
}

.descriere-canal li {
    margin-bottom: 6px;
    color: #96928a;
}

.card-jos {
    margin-top: 25px;
}

.buton-join {
    display: block;
    text-align: center;
    background: #00C9A7;
    color: #000000;
    text-decoration: none;
    font-weight: 700;
    font-size: 15px;
    padding: 12px 20px;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
    transition: background 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease;
}

.buton-join span {
    display: inline-block;
    margin-left: 5px;
    transition: transform 0.2s ease;
}

.buton-join:hover {
    background: #00C9A7;
    box-shadow: 0 6px 20px rgba(0, 201, 167, 0.15);
}

.buton-join:hover span {
    transform: translateX(3px);
}

.fara-canale {
    text-align: center;
    color: #96928a;
    grid-column: 1 / -1;
    padding: 40px;
    font-size: 15px;
}

/* ==========================================================================
   8. PROGRESIVE MEDIA QUERIES (SCALARE PENTRU DESKTOP / TABLETE)
   ========================================================================== */

/* --- Ecrane Medii (De la Phablets/Tablete în sus) --- */
@media (min-width: 481px) {
    .price-amount { font-size: 2.5rem; }
    .logo-wrap { font-size: 1.2rem; }
    .testimonial-card { padding: 20px; }
}

/* --- Ecrane Desktop și Tablete Landscape (De la 769px în sus) --- */
@media (min-width: 769px) {
    header { padding: 15px 0; }
    .hero { padding: 140px 0 60px; }
    .hero h1 { font-size: 2.8rem; }
    .hero p { font-size: 1.1rem; }
    .btn-main { font-size: 1.1rem; padding: 18px 36px; }
    .trust-badges { gap: 20px; font-size: .85rem; }
    .section-title { font-size: 2rem; }

    /* Scalare text și grilă Testimoniale - PADDING AJUSTAT PT HEADER */
    .vasika-testimonials-page { padding: 140px 20px 100px 20px !important; }
    .vasika-header h1 { font-size: 2.8rem; }
    .vasika-grid { grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); }

    /* Scalare text și grilă Comunitate - PADDING AJUSTAT PT HEADER */
    .vasika-comunitate-wrapper { padding: 140px 0 80px 0; }
    .vasika-header-sectiune h1 { font-size: 42px; }
    .vasika-grila-canale { grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); }
}

/* --- Ecrane Desktop Mari (De la 992px în sus) --- */
@media (min-width: 992px) {
    /* Meniu adaptat complet pentru desktop */
    .menu-toggle {
        display: none;
    }
    .social-icons {
        display: flex;
        gap: 15px;
        align-items: center;
    }
    .social-icons a svg {
        width: 20px;
        height: 20px;
        fill: var(--text-muted);
        transition: fill .3s;
    }
    .social-icons a:hover svg {
        fill: var(--accent-neon);
    }
    .main-menu .mobile-social-wrap {
        display: none;
    }
    .main-menu {
        display: flex;
        flex-direction: row;
        position: static;
        width: auto;
        background: none;
        border-bottom: none;
        padding: 0;
        gap: 20px;
        box-shadow: none;
        max-height: none;
        overflow-y: visible;
    }
    .main-menu a {
        font-size: .9rem;
        width: auto;
        padding: 5px 0;
        border-bottom: none;
    }

    /* Structură pe mai multe coloane pentru layout-ul desktop */
    .hero h1 { font-size: 3.5rem; }
    .features-grid { grid-template-columns: repeat(2, 1fr); }
    .comparison-grid { grid-template-columns: repeat(2, 1fr); }
    .testimonials-grid { grid-template-columns: repeat(2, 1fr); }
    .pricing-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   9. FOOTER GLOBAL CUSTOM & SMOOTH BLENDING (REPARAT INTEGRAL - STICKY v2)
   ========================================================================== */

/* Pasul 1: Forțăm structura de bază a site-ului (HTML, Body și containerul Astra #page) 
   să ocupe întreaga înălțime a ecranului și să acționeze ca un aliniament Flexbox vertical */
html, 
body, 
#page, 
.site {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
    margin: 0 !important;
}

/* Pasul 2: Zona de conținut primește permisiunea de a se extinde automat 
   pentru a umple tot spațiul gol, indiferent cât de scurtă e pagina (coș, login etc.) */
#content, 
.site-content {
    flex: 1 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Pasul 3: Stilul de bază al footerului global + Trucul "margin-top: auto" 
   care îl împinge magnetic la baza absolută a ecranului */
.site-footer-global {
    margin-top: auto !important; /* Împinge footer-ul jos de tot pe paginile scurte */
    flex-shrink: 0 !important;   /* Împiedică strivirea footerului pe ecrane mici */
    width: 100%;
    position: relative;
    background: #060908; /* Culoarea de bază a site-ului */
    padding: 60px 0 40px 0;
    text-align: center;
    font-size: 0.85rem;
    color: var(--text-muted);
    border-top: 1px solid rgba(255, 211, 0, 0.1); /* O linie fină aurie, foarte discretă */
    isolation: isolate;
    clear: both;
}

/* Efectul de trecere fluidă (fade-in din transparență în negru) */
.site-footer-global::before {
    content: '';
    position: absolute;
    top: -99px; /* Împingem gradientul ușor în sus, la limita footerului */
    left: 0;
    width: 100%;
    height: 100px;
    background: linear-gradient(to bottom, rgba(6, 9, 8, 0) 0%, rgba(6, 9, 8, 1) 100%);
    pointer-events: none; /* Permite click-urile prin acest strat transparent */
    z-index: 1;
}

.site-footer-global .container {
    position: relative;
    z-index: 2;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}

.site-footer-global p {
    margin: 0;
    letter-spacing: 0.5px;
    line-height: 1.6;
}

/* Corecție pentru ca paginile cu fundal complet negru să nu creeze conflicte */
.vasika-testimonials-page,
.vasika-comunitate-wrapper {
    margin-bottom: 0 !important;
    padding-bottom: 40px !important;
}

/* Ajustare specială pentru mesajele de notificare WooCommerce (să nu fie acoperite) */
.woocommerce-notices-wrapper {
    width: 100%;
    position: relative;
    z-index: 10;
}

/* ==========================================================================
   10. REPARAȚIE GLOBALĂ COMPATIBILITATE & DARK MODE UNIVERSAL
   ========================================================================== */

/* 1. Forțăm fundalul închis și textul deschis la nivel de site pentru paginile de sistem (Coș, Checkout, Cursuri etc.) */
body, 
.site, 
#page,
.ast-container,
#content,
.site-content {
    background-color: #0a0a0a !important;
    color: #ffffff !important;
}

/* 2. Spațiu de siguranță global sub header-ul fix (să nu mai intre headerul peste conținutul paginilor) */
#content, 
.site-content,
.tutor-wrap,
.woocommerce-page #content {
    padding-top: 110px !important; /* Pe desktop împingem conținutul sub header */
    box-sizing: border-box;
}

/* 3. Ajustare container de conținut (să nu fie totul lipit de margini pe desktop sau strivit pe mobil) */
.woocommerce-cart .site-content .ast-container,
.woocommerce-checkout .site-content .ast-container,
.ast-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* 4. Corectare culori texte și titluri native din WooCommerce / Tutor LMS care erau negre */
h1, h2, h3, h4, h5, h6,
.woocommerce-products-header__title,
.page-title,
.entry-title,
.woocommerce-cart-form__contents th,
.product-name a,
.product-price,
.product-subtotal,
.cart-subtotal th,
.cart-subtotal td,
.order-total th,
.order-total td,
strong {
    color: #ffffff !important;
}

/* Scurtă corecție pentru textele secundare din tabele */
.woocommerce table.shop_table td,
.woocommerce-cart-delivery-info {
    color: #96928a !important;
}

/* 5. Stilizare link-uri și butoane native din paginile de sistem (Apasă pe Coș, Finalizează etc.) */
.woocommerce .button,
.woocommerce-page .button,
.tutor-btn {
    background-color: #00C9A7 !important;
    color: #000000 !important;
    font-weight: 700 !important;
    border-radius: 6px !important;
    transition: background 0.2s ease !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.woocommerce .button:hover,
.woocommerce-page .button:hover,
.tutor-btn:hover {
    background-color: #00C9A7 !important;
}

/* --- OPTIMIZARE AGRESIVĂ PENTRU MOBIL (Tabele WooCommerce Inteligente) --- */
@media (max-width: 768px) {
    
    /* Micșorăm spațiul de sus pe mobil deoarece headerul de mobil e mai îngust */
    #content, 
    .site-content,
    .tutor-wrap,
    .woocommerce-page #content {
        padding-top: 85px !important;
    }

    /* Transformăm tabelele rigide din Coș/Checkout în carduri fluide așezate pe verticală */
    .woocommerce table.shop_table,
    .woocommerce-page table.shop_table,
    .woocommerce table.shop_table tbody,
    .woocommerce-page table.shop_table tbody,
    .woocommerce table.shop_table tr,
    .woocommerce-page table.shop_table tr,
    .woocommerce table.shop_table td,
    .woocommerce-page table.shop_table td {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Ascundem headerul tabelului pe mobil (nu mai avem coloane) */
    .woocommerce table.shop_table thead,
    .woocommerce-page table.shop_table thead {
        display: none !important;
    }

    /* Stilăm fiecare rând de produs ca pe un card individual */
    .woocommerce table.shop_table tr,
    .woocommerce-page table.shop_table tr {
        background: #0a0a0a !important; /* Fundal de card, la fel ca pe prima pagină */
        border: 1px solid #96928a !important;
        border-radius: 8px;
        padding: 15px !important;
        margin-bottom: 15px !important;
        position: relative;
    }

    /* Aliniem elementele din interiorul cardului de produs */
    .woocommerce table.shop_table td,
    .woocommerce-page table.shop_table td {
        text-align: right !important;
        padding: 8px 0 !important;
        border: none !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
        position: relative;
        font-size: 0.95rem;
    }

    .woocommerce table.shop_table td:last-child,
    .woocommerce-page table.shop_table td:last-child {
        border-bottom: none !important;
    }

    /* Generăm etichete în stânga pentru a ști ce reprezintă fiecare preț/cantitate pe mobil */
    .woocommerce table.shop_table td::before,
    .woocommerce-page table.shop_table td::before {
        content: attr(data-title);
        position: absolute;
        left: 0;
        top: 8px;
        font-weight: 500;
        color: #96928a;
        text-align: left;
    }

    /* Corecție specială pentru butonul de ștergere produs (X) pe mobil */
    .woocommerce table.shop_table td.product-remove,
    .woocommerce-page table.shop_table td.product-remove {
        text-align: center !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        padding-bottom: 10px !important;
    }

    .woocommerce table.shop_table td.product-remove::before,
    .woocommerce-page table.shop_table td.product-remove::before {
        content: ""; /* Eliminăm eticheta la butonul X */
    }

    /* Lărgim zona de cupoane și acțiuni pe mobil */
    .woocommerce table.shop_table td.actions,
    .woocommerce-page table.shop_table td.actions {
        text-align: center !important;
    }
    
    .woocommerce table.shop_table td.actions .coupon,
    .woocommerce-page table.shop_table td.actions .coupon {
        width: 100% !important;
        display: flex;
        flex-direction: column;
        gap: 10px;
        margin-bottom: 15px;
    }

    .woocommerce table.shop_table td.actions .coupon input,
    .woocommerce-page table.shop_table td.actions .coupon button {
        width: 100% !important;
        margin: 0 !important;
    }

    /* Secțiunea de Total Coș (Cart Totals) o facem să ocupe tot ecranul */
    .woocommerce .cart-collaterals .cart_totals,
    .woocommerce-page .cart-collaterals .cart_totals {
        width: 100% !important;
        float: none !important;
        background: #0a0a0a !important;
        border: 1px solid #262420 !important;
        border-radius: 8px;
        padding: 20px !important;
        margin-top: 25px;
    }
}

/* ==========================================================================
   11. REPARAȚIE PAGINĂ ÎNREGISTRARE / AUTENTIFICARE (TUTOR LMS & WOOCOMMERCE)
   ========================================================================== */

/* 1. Reparăm textele / etichetele ascunse de deasupra casetelor */
.tutor-form-group label,
.tutor-login-form-wrapper label,
.tutor-registration-form-wrapper label,
.woocommerce-form-row label,
.woocommerce-form label,
label[for] {
    color: #ffffff !important;
}

/* Reducem opacitatea textului explicativ mic */
.tutor-form-group small,
.tutor-registration-form-wrapper span,
.woocommerce-privacy-policy-text {
    color: #96928a !important;
}

/* 2. Reparăm textul albastru selectat din imagine (by signing up...) */
.tutor-registration-form-wrapper form p,
.tutor-registration-form-wrapper label {
    color: #ffffff !important;
}
.tutor-registration-form-wrapper form p a,
.tutor-registration-form-wrapper label a {
    color: #00C9A7 !important; 
    text-decoration: underline;
}

/* 3. Spațiere pentru întregul container pe DESKTOP (folosind clasele reale Astra găsite în inspect) */
.page-template-default #content,
.page-template-default .site-content,
.page-template-default #primary {
    padding-top: 160px !important; /* Împinge tot conținutul și titlul în jos, sub headerul fix */
    box-sizing: border-box;
}

/* Spațiere pentru întregul container pe MOBIL */
@media (max-width: 768px) {
    .page-template-default #content,
    .page-template-default .site-content,
    .page-template-default #primary {
        padding-top: 110px !important;
    }
}

/* ==========================================================================
   REPARARE ȘI CENTRARE TITLU "STUDENT REGISTRATION"
   ========================================================================== */

/* 1. Forțăm poziționarea titlului în fluxul normal al paginii, deasupra formularului */
.page-id-7 .site-main .entry-header {
    display: block !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 550px !important; /* Îl aliniem perfect la lățimea formularului tău */
    margin: 0 auto 30px auto !important; /* Îl centrează pe ecran și lasă 30px până la formular */
    padding: 0 !important;
    text-align: center !important;
    float: none !important;
    clear: both !important;
}

/* 2. Stilizăm textul H1 propriu-zis ca să fie vizibil și centrat */
.page-id-7 .entry-title {
    color: #ffffff !important; /* Text alb pe fundalul tău închis */
    font-size: 2.2rem !important; /* Dimensiune optimă pentru ecrane */
    font-weight: 700 !important;
    text-align: center !important;
    display: block !important;
    margin: 0 !important;
    line-height: 1.3 !important;
}

/* 3. Ne asigurăm că pe mobil (unde ai meniul burger activat) conținutul coboară destul */
@media (max-width: 921px) {
    .page-id-7 #primary {
        padding-top: 120px !important; /* Împinge tot conținutul sub meniul de mobil */
    }
    .page-id-7 .entry-title {
        font-size: 1.8rem !important; /* Ceva mai mic pe ecranele de telefon */
    }
}
/* Corecție curată: împingem doar conținutul intern al headerului de curs sub meniul fix */
.tutor-wrap.tutor-full-width-course-top .tutor-course-details-page-header {
    padding-top: 90px !important;
}

/* Siguranță pentru ecrane mici (mobile) */
@media (max-width: 921px) {
    .tutor-wrap.tutor-full-width-course-top .tutor-course-details-page-header {
        padding-top: 80px !important;
    }
}

/* Anulăm poziționarea 'fixed' moștenită greșit de headerul intern Tutor LMS */
.tutor-wrap header.tutor-course-details-header {
    position: static !important;
    width: auto !important;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 !important;
    border-bottom: none !important;
}

/* Adăugăm acum spațiul corect de respirație doar deasupra titlului */
.tutor-wrap .tutor-course-details-page {
    padding-top: 40px !important;
}

.contact-info-box {
    background-color: #0a0a0a; /* Negru închis pentru fundal */
    border: 1px solid #00C9A7; /* Temperatură/Bordură aurie subtilă */
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    margin: 20px 0;
}

.contact-info-box p {
    color: #ffffff; /* Text alb curat pentru lizibilitate */
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 16px;
    line-height: 1.6;
    margin: 0;
}

.gold-link {
    color: #00C9A7; /* Culoare aurie pentru email */
    text-decoration: none;
    font-weight: bold;
    transition: color 0.3s ease, text-shadow 0.3s ease;
}

/* Efect de strălucire când se trece cu mouse-ul peste email */
.gold-link:hover {
    color: #fff;
    text-shadow: 0 0 8px #00C9A7;
}

/* ==========================================================================
   1. GRID GLOBAL ȘI BUTOANE REZOLVATE
   ========================================================================== */

/* Resetează comportamentul pe mobil pentru a preveni textul înghesuit */
.woocommerce ul.products {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 25px !important;
    padding: 0 !important;
    margin: 20px 0 !important;
}

/* Structura elementului de produs */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    background: #0a0a0a !important;
    border: 1px solid #252525 !important;
    padding: 20px !important;
    border-radius: 8px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-items: center !important; /* Centrează conținutul pe axa orizontală */
    box-sizing: border-box !important;
}

/* FIX: Butonul nu se mai întinde pe tot ecranul, are lățime normală cu padding */
.woocommerce ul.products li.product .button {
    width: auto !important;
    max-width: max-content !important;
    min-width: 200px !important; /* Îi dăm o bază stabilă ca să arate bine */
    padding: 0 25px !important;
    margin: 15px auto 0 auto !important; /* Îl împinge jos și îl centrează perfect */
    height: 48px !important;
    background-color: #00C9A7 !important;
    color: #000000 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    border-radius: 4px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

/* Ajustări Grid pentru Desktop */
@media (min-width: 768px) {
    .woocommerce ul.products.columns-4,
    .woocommerce ul.products.columns-3,
    .woocommerce ul.products.columns-2 {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (min-width: 1024px) {
    .woocommerce ul.products.columns-4 {
        grid-template-columns: repeat(4, 1fr) !important;
    }
    .woocommerce ul.products.columns-2 {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* ==========================================================================

   2. REZOLVARE VIZIBILITATE PREȚURI (Dark Mode)

   ========================================================================== */



.woocommerce .price,

.woocommerce .amount,

.woocommerce del,

.woocommerce ins,

.woocommerce .wps_sfm_interval,

.woocommerce-Price-amount {

    color: #ffffff !important;

    opacity: 1 !important;

}



/* Evidențiere preț redus curent */

.woocommerce ins .amount,

.woocommerce li.product .price ins .amount {

    color: #00C9A7 !important; /* Galben intens pentru prețul activ */

    font-weight: bold !important;

}



/* Stil preț vechi tăiat */

.woocommerce del .amount,

.woocommerce li.product .price del .amount {

    color: #aaaaaa !important;

    text-decoration: line-through !important;

    font-size: 0.9em !important;

}

/* ==========================================================================
   4. FIX REAPARIȚIE BUTOANE STRIPE EXPRESS (Google Pay / Link)
   ========================================================================== */

/* Containerul principal trebuie să fie block pur pentru ca iframe-ul Stripe să își calculeze înălțimea */
#wc-stripe-express-checkout-element {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    clear: both !important;
    margin: 20px 0 !important;
}

/* Forțăm elementele Stripe să aibă o înălțime minimă de siguranță ca să nu se prăbușească la 0px */
#wc-stripe-express-checkout-element-googlePay,
#wc-stripe-express-checkout-element-link,
.StripeElement,
.__PrivateStripeElement {
    display: block !important;
    width: 100% !important;
    min-height: 44px !important; /* Înălțimea standard a butoanelor de plată rapide */
    margin-bottom: 10px !important;
}

/* ==========================================================================
   5. RECENZII ȘI TAB-URI WOOCOMMERCE
   ========================================================================== */

/* Stil navigator tab-uri */
.woocommerce div.product .woocommerce-tabs ul.tabs {
    display: flex !important;
    padding-left: 0 !important;
    border-bottom: 2px solid #222222 !important;
    gap: 5px !important;
    margin-bottom: 15px !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: #0a0a0a !important;
    border: 1px solid #222222 !important;
    border-bottom: none !important;
    border-radius: 4px 4px 0 0 !important;
    margin: 0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    color: #888888 !important;
    font-weight: 600 !important;
    padding: 12px 16px !important;
    display: block !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    background: #00C9A7 !important;
    border-color: #00C9A7 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: #ffffff !important;
}

/* Stil panou conținut (Descriere / Recenzii) */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel {
    background: #0a0a0a !important;
    border: 1px solid #1c1c1c !important;
    padding: 20px !important;
    border-radius: 6px !important;
    color: #aaaaaa !important;
}

/* Reparare Stele Recenzii (Star Rating) lipsă sau invizibile */
.woocommerce .star-rating,
.woocommerce p.stars a {
    color: #e5b100 !important; /* Culoare aurie pentru stele selectate/active */
}

.woocommerce .star-rating::before {
    color: rgba(255, 255, 255, 0.15) !important; /* Stelele goale din fundal devin vizibile pe negru */
}

/* Reparare formular adăugare recenzie */
#review_form_wrapper input[type="text"],
#review_form_wrapper input[type="email"],
#review_form_wrapper textarea {
    width: 100% !important;
    background-color: #0a0a0a !important;
    border: 1px solid #333333 !important;
    color: #ffffff !important;
    padding: 10px !important;
    border-radius: 4px !important;
    box-sizing: border-box !important;
}

#review_form_wrapper input[type="submit"] {
    background-color: #00C9A7 !important;
    color: #000000 !important;
    font-weight: bold !important;
    padding: 10px 20px !important;
    border: none !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    margin-top: 10px !important;
}

/* ==========================================================================
   RESTRUCTURARE GRID ȘI CARDURI PRODUSE (WOOCOMMERCE)
   ========================================================================== */

/* 1. Resetare și Aliniere Grid General */
.ast-woocommerce-container ul.products {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important; /* 4 coloane pe Desktop */
    gap: 25px !important;
    padding: 0 !important;
    margin: 30px 0 !important;
    list-style: none !important;
}

/* 2. Stilizare Card Produs (Forțare Flexbox pentru a opri suprapunerile) */
.ast-woocommerce-container ul.products li.product {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 20px !important;
    background: #0a0a0a !important; /* Fundal închis premium pentru card */
    border: 1px solid #252525 !important;
    border-radius: 12px !important;
    
    /* Magia Flexbox: aliniază elementele pe verticală și împinge butonul jos */
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    position: relative !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

/* Efect de Hover discret pe Card */
.ast-woocommerce-container ul.products li.product:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 25px rgba(243, 156, 18, 0.15) !important; /* Glow portocaliu subtil */
    border-color: #00C9A7 !important;
}

/* 3. Imaginea Produsului */
.ast-woocommerce-container ul.products li.product img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16/10 !important; /* Păstrează toate imaginile la aceeași proporție */
    object-fit: cover !important;
    border-radius: 8px !important;
    margin-bottom: 15px !important;
}

/* 4. Titlul Produsului */
.ast-woocommerce-container ul.products li.product .woocommerce-loop-product__title,
.ast-woocommerce-container ul.products li.product h2 {
    font-size: 1.15rem !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 10px 0 5px 0 !important;
    min-height: 45px !important; /* Previne alinierea greșită dacă un titlu e mai lung */
}

/* 5. Prețul Produsului */
.ast-woocommerce-container ul.products li.product .price {
    color: #00C9A7 !important; /* Culoarea portocalie din site-ul tău */
    font-size: 1.3rem !important;
    font-weight: 700 !important;
    margin-top: auto !important; /* Împinge prețul și butonul în josul cardului */
    margin-bottom: 15px !important;
    display: block !important;
}
.ast-woocommerce-container ul.products li.product .price del {
    font-size: 0.95rem !important;
    color: #666 !important;
    margin-right: 8px !important;
}
.ast-woocommerce-container ul.products li.product .price ins {
    text-decoration: none !important;
    color: #00C9A7 !important;
}

/* 6. Butonul "Adaugă în Coș" (Full-Width și modern) */
.ast-woocommerce-container ul.products li.product .button.add_to_cart_button {
    background-color: #00C9A7 !important;
    color: #ffffff !important;
    padding: 12px 15px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    text-align: center !important;
    display: block !important;
    width: 100% !important;
    border: none !important;
    transition: background-color 0.2s ease !important;
    position: static !important; /* Anulează poziționările ciudate din Astra */
}

.ast-woocommerce-container ul.products li.product .button.add_to_cart_button:hover {
    background-color: #00C9A7 !important;
}

/* 7. Insigna de reducere (Sale!) */
.ast-woocommerce-container ul.products li.product .onsale {
    background-color: #00C9A7 !important;
    color: #ffffff !important;
    top: 15px !important;
    left: 15px !important;
    margin: 0 !important;
    padding: 4px 10px !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    border-radius: 4px !important;
    min-width: auto !important;
    min-height: auto !important;
    line-height: 1.2 !important;
}

/* ==========================================================================
   RESPONSIVITATE (Tablete și Mobil)
   ========================================================================== */

/* Tablete */
@media (max-width: 1024px) {
    .ast-woocommerce-container ul.products {
        grid-template-columns: repeat(2, 1fr) !important; /* 2 coloane pe tabletă */
        gap: 20px !important;
    }
}

/* Mobil (Aici rezolvăm problema din screenshot) */
@media (max-width: 767px) {
    .ast-woocommerce-container ul.products {
        grid-template-columns: 1fr !important; /* O singură coloană curată pe mobil */
        gap: 20px !important;
        padding: 0 10px !important;
    }
    
    .ast-woocommerce-container ul.products li.product {
        padding: 15px !important; /* Spațiere ușor mai mică pe ecran mic */
    }

    .ast-woocommerce-container ul.products li.product .woocommerce-loop-product__title,
    .ast-woocommerce-container ul.products li.product h2 {
        font-size: 1.1rem !important;
        min-height: auto !important; /* Pe mobil nu mai avem nevoie de înălțime minimă fixed */
    }
}

/* ==========================================================================
   PAGINA DE PRODUS INDIVIDUAL (SINGLE PRODUCT CUSTOM STYLING)
   ========================================================================== */

/* 1. Structură Generală & Layout Desktop */
@media (min-width: 922px) {
    .ast-woocommerce-container div.product {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        gap: 5% !important;
        margin-top: 40px !important;
    }

    /* Coloana Stângă: Imaginea de Curs */
    .ast-woocommerce-container div.product .woocommerce-product-gallery {
        flex: 0 0 45% !important;
        max-width: 45% !important;
        position: relative !important;
        top: 100px !important; /* Rămâne fixă la scroll */
    }

    /* Coloana Dreaptă: Detalii, Preț, Cumpărare */
    .ast-woocommerce-container div.product .summary.entry-summary {
        flex: 0 0 50% !important;
        max-width: 50% !important;
        display: flex !important;
        flex-direction: column !important;
    }
}

/* 2. Elemente din Coloana de Rezumat (Summary) */
.ast-woocommerce-container .summary .woocommerce-breadcrumb {
    font-size: 0.85rem !important;
    color: #888888 !important;
    margin-bottom: 15px !important;
}

.ast-woocommerce-container .summary .product_title {
    font-size: 2.2rem !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin-bottom: 15px !important;
}

/* Zona de Preț */
.ast-woocommerce-container .summary .price {
    font-size: 1.8rem !important;
    color: #00C9A7 !important; /* Portocaliul tău premium */
    font-weight: 700 !important;
    margin-bottom: 20px !important;
}
.ast-woocommerce-container .summary .price del {
    color: #888888 !important;
    font-size: 1.2rem !important;
    margin-right: 10px !important;
}

/* Descrierea Scurtă (Textul mare din screenshot) */
.ast-woocommerce-container .summary .woocommerce-product-details__short-description {
    font-size: 1.05rem !important;
    color: #aaaaaa !important;
    line-height: 1.6 !important;
    margin-bottom: 25px !important;
}

/* 3. Butonul Adaugă în Coș / Abonare */
.ast-woocommerce-container .summary form.cart .button {
    background-color: #00C9A7 !important;
    color: #ffffff !important;
    padding: 15px 30px !important;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    text-transform: none !important;
    transition: all 0.3s ease !important;
    width: auto !important;
    display: inline-block !important;
}
.ast-woocommerce-container .summary form.cart .button:hover {
    background-color: #00C9A7 !important;
    transform: translateY(-2px) !important;
}

/* 4. Reparație Butoane Express Checkout (GPay / Link - din image_e554a9.png) */
#wc-stripe-express-checkout-element {
    margin-top: 20px !important;
    max-width: 400px !important; /* Oprește butoanele din a se întinde monstruos */
    border-radius: 8px !important;
    overflow: visible !important;
}

/* 5. Meta Date (Categorii și Etichete) */
.ast-woocommerce-container .product_meta {
    border-top: 1px solid #252525 !important;
    padding-top: 20px !important;
    margin-top: 25px !important;
    font-size: 0.9rem !important;
    color: #888888 !important;
    line-height: 1.8 !important;
}
.ast-woocommerce-container .product_meta span a {
    color: #ffffff !important;
    text-decoration: none !important;
    background: #0a0a0a !important;
    padding: 3px 10px !important;
    border-radius: 4px !important;
    margin-left: 5px !important;
    display: inline-block !important;
}
.ast-woocommerce-container .product_meta span a:hover {
    background: #00C9A7 !important;
}

/* 6. Secțiunea de Taburi (Descriere extinsă și Recenzii) */
.ast-woocommerce-container .woocommerce-tabs {
    width: 100% !important;
    margin-top: 60px !important;
    border-top: 1px solid #252525 !important;
    padding-top: 40px !important;
}

/* Stilizare Meniu Taburi */
.ast-woocommerce-container .woocommerce-tabs ul.tabs {
    display: flex !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 30px 0 !important;
    border-bottom: 2px solid #252525 !important;
}
.ast-woocommerce-container .woocommerce-tabs ul.tabs li {
    margin-right: 30px !important;
    padding-bottom: 10px !important;
}
.ast-woocommerce-container .woocommerce-tabs ul.tabs li a {
    color: #888888 !important;
    font-weight: 600 !important;
    font-size: 1.1rem !important;
    text-decoration: none !important;
}
.ast-woocommerce-container .woocommerce-tabs ul.tabs li.active {
    border-bottom: 2px solid #00C9A7 !important;
}
.ast-woocommerce-container .woocommerce-tabs ul.tabs li.active a {
    color: #ffffff !important;
}

/* Conținutul Taburilor */
.ast-woocommerce-container .woocommerce-Tabs-panel {
    background: #0a0a0a !important;
    padding: 30px !important;
    border-radius: 12px !important;
    border: 1px solid #252525 !important;
    color: #cccccc !important;
    line-height: 1.7 !important;
}

/* 7. Formatare Formular Recenzii (Din image_e5c18c.png) */
#review_form_wrapper h2, #review_form_wrapper h3 {
    color: #ffffff !important;
    margin-bottom: 15px !important;
}
#review_form_wrapper .comment-form-comment textarea {
    background-color: #0a0a0a !important;
    border: 1px solid #333333 !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    padding: 15px !important;
    width: 100% !important;
    font-family: inherit !important;
}
#review_form_wrapper .comment-form-comment textarea:focus {
    border-color: #00C9A7 !important;
    outline: none !important;
}
#review_form_wrapper .form-submit input#submit {
    background-color: #00C9A7 !important;
    color: #ffffff !important;
    padding: 12px 30px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    border: none !important;
    cursor: pointer !important;
}

/* 8. Secțiunile de Sugestii (Up-sells & Related Products) */
section.upsells.products, section.related.products {
    width: 100% !important;
    margin-top: 50px !important;
    border-top: 1px solid #252525 !important;
    padding-top: 40px !important;
}
section.upsells.products h2, section.related.products h2 {
    color: #ffffff !important;
    font-size: 1.6rem !important;
    margin-bottom: 25px !important;
}

/* ==========================================================================
   RESPONSIVITATE (Optimizare Mobil)
   ========================================================================== */
@media (max-width: 921px) {
    .ast-woocommerce-container div.product .woocommerce-product-gallery,
    .ast-woocommerce-container div.product .summary.entry-summary {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
    
    .ast-woocommerce-container .summary .product_title {
        font-size: 1.6rem !important;
        margin-top: 20px !important;
    }
    
    #wc-stripe-express-checkout-element {
        max-width: 100% !important;
    }

    .ast-woocommerce-container .woocommerce-tabs {
        padding-top: 20px !important;
    }
    
    .ast-woocommerce-container .woocommerce-tabs ul.tabs {
        flex-direction: column !important;
        border-bottom: none !important;
        gap: 10px !important;
    }
    
    .ast-woocommerce-container .woocommerce-tabs ul.tabs li {
        border-bottom: 1px solid #252525 !important;
        padding-bottom: 8px !important;
        width: 100% !important;
    }
    
    .ast-woocommerce-container .woocommerce-tabs ul.tabs li.active {
        border-bottom-color: #00C9A7 !important;
    }

    .ast-woocommerce-container .woocommerce-Tabs-panel {
        padding: 20px !important;
    }
}

/* Corecție prețuri Tutor LMS pe fundal deschis (carduri) */
.tutor-color-black,
.price.tutor-fs-6,
.woocommerce-Price-amount.amount,
.wps_sfw_interval {
    color: #0a0a0a !important; /* Forțează prețul și intervalul (/Month, /Day) să fie vizibile */
}

/* Dacă există un preț tăiat (reducere), să îl facem un gri șters ca să se distingă */
del[aria-hidden="true"] .woocommerce-Price-amount.amount {
    color: #888888 !important;
}

/* 1. REPARARE TITLU ÎN PAGINA CURSULUI (Fundal Închis - image_006520.jpg) */
h1.tutor-course-details-title,
h1.tutor-course-details-title span {
    color: #ffffff !important; /* Forțăm titlul mare din pagina cursului să fie ALB */
}

/* 2. REPARARE PREȚURI ÎN CARDURI (Fundal Alb - image_007064.png) */
.list-item-price .tutor-color-black,
.list-item-price .woocommerce-Price-amount.amount,
.list-item-price .wps_sfw_interval {
    color: #0a0a0a !important; /* Forțăm doar prețul și intervalul din carduri să fie NEGRU */
}

/* Opțional: Prețul tăiat (reducerea) din carduri să fie gri */
.list-item-price del[aria-hidden="true"] .woocommerce-Price-amount.amount {
    color: #888888 !important;
}

/* 3. REPARARE TITLURI ÎN CARDURI (Fundal Alb - image_007064.png) */
.tutor-course-loop-title a,
.tutor-course-name a {
    color: #000000 !important; /* Titlurile cursurilor din listă rămân negre */
}
.tutor-course-loop-title a:hover,
.tutor-course-name a:hover {
    color: #00C9A7 !important; /* Efect de hover galben în listă */
}

/* ==========================================================================
   REPARARE COMPLETĂ TUTOR LMS - CONFLICTE DARK/LIGHT MODE
   ========================================================================== */

/* --------------------------------------------------------------------------
   ZONA 1: ELEMENTE PE FUNDAL ÎNCHIS (Pagina principală a cursului)
   -------------------------------------------------------------------------- */

/* Titlurile mari de secțiuni din pagină (ex: Conținut curs, Despre curs, Evaluări) */
.tutor-course-details-content h2,
.tutor-course-content-title,
.tutor-tab-item h3,
h1.tutor-course-details-title,
h1.tutor-course-details-title span {
    color: #ffffff !important; /* Rămân albe pe fundalul negru al site-ului */
}

/* Descrierile, paragrafele și listele de beneficii de pe fundalul închis */
.tutor-course-details-content p,
.tutor-tab-item p,
.tutor-course-benefits-items li {
    color: #cfd4d2 !important; /* Gri deschis pentru lizibilitate maximă */
}

/* Tab-urile de navigare de sus (Informații curs / Recenzii) */
.tutor-nav .tutor-nav-item a {
    color: #b3b3b3 !important;
}
.tutor-nav .tutor-nav-item.is-active a,
.tutor-nav .tutor-nav-item a:hover {
    color: #00C9A7 !important; /* Galbenul tău de brand */
}


/* --------------------------------------------------------------------------
   ZONA 2: SIDEBAR (Toate cardurile și widget-urile cu fundal alb)
   -------------------------------------------------------------------------- */

/* Forțăm titlurile din TOATE widgeturile din sidebar să fie negre (Gratuit, Cerințe etc.) */
.tutor-single-course-sidebar h3,
.tutor-single-course-sidebar-more h3,
.tutor-course-details-widget-title,
.tutor-sidebar-card .tutor-fs-4 {
    color: #0a0a0a !important;
}

/* Forțăm listele, textul simplu și metadatele din widgeturi să fie închise la culoare */
.tutor-single-course-sidebar span:not(.tutor-btn),
.tutor-single-course-sidebar li,
.tutor-single-course-sidebar p,
.tutor-course-details-widget-list,
.tutor-course-details-widget-list li,
.tutor-course-details-widget-list span {
    color: #555555 !important;
}

/* Fix specific pentru secțiunea Instructori (Nume, descriere scurtă - imaginea ta de inspect) */
.tutor-course-details-instructors,
.tutor-course-details-instructors div,
.tutor-course-details-instructors a,
.tutor-course-details-instructors span {
    color: #555555 !important;
}

/* Iconițele tip bullet-point și iconițele de meta (ceas, căciulă de absolvent etc.) din sidebar */
.tutor-single-course-sidebar .tutor-icon-bullet-point,
.tutor-sidebar-card i,
.tutor-sidebar-card span[class^="tutor-icon-"] {
    color: #555555 !important; /* Un gri închis vizibil pe alb */
}


/* --------------------------------------------------------------------------
   ZONA 3: CURRICULUM ACCORDEON (Secțiunile de lecții cu fundal deschis)
   -------------------------------------------------------------------------- */

/* Antetul secțiunilor din acordeon (ex: "primul pas") */
.tutor-accordion-item-header,
.tutor-accordion-item-header * {
    color: #0a0a0a !important;
}

/* Interiorul secțiunilor extinse (listele de lecții text și iconițe) */
.tutor-accordion-item-body-content,
.tutor-accordion-item-body-content * {
    color: #0a0a0a !important;
}

/* Link-urile directe către lecții din interiorul acordeonului */
.tutor-accordion-item-body-content a,
.tutor-course-content-list a {
    color: #0a0a0a !important;
}
.tutor-accordion-item-body-content a:hover {
    color: #00C9A7 !important;
}

/* =========================================================================
   REPARARE STRUCTURĂ PAGINĂ GIVEAWAY (INTEGRARE GRADIENT & TITLU FIX)
   ========================================================================= */

/* 1. Blocăm elementele parazite pe care Astra le aruncă automat sub meniu */
.page-template-page-giveaway .ast-single-post-title,
.page-template-page-giveaway .entry-header,
.page-template-page-giveaway .ast-header-meta {
    display: none !important;
}

/* 2. Facem zona transparentă ca să se vadă gradientul tău superb din fundal */
#primary.cst-clean-giveaway-page {
    padding-top: 140px !important; /* Împinge cardul curat sub meniul transparent */
    padding-bottom: 60px !important;
    background: transparent !important; /* Lasă gradientul nativ la vedere */
    display: block !important;
    clear: both !important;
    box-sizing: border-box !important;
}

/* 3. Containerul central al cardului */
.giveaway-central-container {
    width: 100% !important;
    max-width: 580px !important; /* O idee mai strâns pentru un aspect compact și premium */
    margin: 0 auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
}

/* 4. Construcția Cardului */
.custom-giveaway-card {
    background-color: var(--bg-card) !important; /* Culoarea #0d1412 din :root */
    border: 1px solid var(--border-color) !important; /* Culoarea #262420 */
    border-radius: 12px !important;
    padding: 40px 35px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.7) !important;
    box-sizing: border-box !important;
    display: block !important;
}

/* 5. Noul stil pentru titlul integrat în card */
.giveaway-main-title {
    font-size: 2rem !important;
    color: var(--text-light) !important; /* #ffffff */
    text-align: center !important;
    margin: 0 0 25px 0 !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.5px !important;
}

/* 6. Imagine/Media */
.giveaway-media-banner img {
    width: 100%;
    height: auto;
    border-radius: 6px;
    border: 1px solid var(--border-color);
    margin-bottom: 25px;
}

/* 7. Text corp descriere */
.giveaway-text-body {
    color: var(--text-muted);
    font-size: 1.05rem;
    line-height: 1.6;
    margin-bottom: 25px;
    text-align: center;
}

/* 8. Caseta de Status (Măsură fixă deasupra form-ului) */
.status-box {
    padding: 14px !important;
    border-radius: 6px !important;
    font-weight: 700 !important;
    text-align: center !important;
    font-size: 0.95rem !important;
    margin-bottom: 25px !important;
    letter-spacing: 0.5px !important;
}

.status-active {
    background-color: rgba(0, 201, 167, 0.06) !important;
    color: var(--accent-neon) !important; /* #ffd300 */
    border: 1px solid var(--accent-neon) !important;
}

.status-expired {
    background-color: rgba(0, 0, 0, 0.2);
    border: 1px dashed var(--border-color);
    padding: 25px 15px;
}

.status-expired h2 {
    color: var(--red-alert) !important;
    font-size: 1.5rem !important;
    margin-bottom: 10px !important;
}

/* Câștigător */
.gold-winner-ribbon {
    background: rgba(0, 201, 167, 0.1) !important;
    border: 1px solid var(--accent-neon) !important;
    color: var(--text-light) !important;
    padding: 10px 20px !important;
    border-radius: 6px !important;
    display: inline-block !important;
    margin: 15px auto !important;
    font-size: 1.1rem !important;
}

.gold-winner-ribbon strong {
    color: var(--accent-neon) !important;
}

.next-giveaway-notice {
    color: var(--accent-neon) !important;
    font-weight: 600 !important;
    margin-top: 15px;
}

/* 9. Câmpurile Formularului */
.custom-g-form .g-input-field {
    margin-bottom: 20px !important;
    display: block !important;
}

.custom-g-form label {
    display: block !important;
    color: var(--text-light) !important;
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    margin-bottom: 6px !important;
    text-align: left !important;
}

.custom-g-form input[type="text"],
.custom-g-form input[type="email"] {
    width: 100% !important;
    padding: 12px 15px !important;
    background-color: #0a0a0a !important; /* Interiorul inputurilor rămâne negru curat */
    border: 1px solid var(--border-color) !important;
    border-radius: 6px !important;
    color: var(--text-light) !important;
    font-size: 1rem !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
}

.custom-g-form input:focus {
    border-color: var(--accent-neon) !important;
    box-shadow: 0 0 8px rgba(229, 177, 0, 0.25) !important;
    outline: none !important;
}

/* 10. Butonul Principal */
.g-btn-submit {
    width: 100% !important;
    background-color: var(--accent-neon) !important;
    color: #000000 !important;
    padding: 15px !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    margin-top: 5px !important;
    transition: background-color 0.2s, box-shadow 0.2s !important;
}

.g-btn-submit:hover {
    background-color: var(--accent-hover) !important;
    box-shadow: 0 0 15px rgba(0, 201, 167, 0.3) !important;
}

/* Alerte stări */
.g-alert {
    padding: 12px;
    border-radius: 6px;
    font-weight: 600;
    margin-bottom: 20px;
    text-align: center;
    border: 1px solid;
}
.g-alert-success { background: rgba(40,167,69,0.1); color: #28a745; border-color: #28a745; }
.g-alert-warning { background: rgba(255,211,0,0.1); color: var(--accent-neon); border-color: var(--accent-neon); }
.g-alert-danger { background: rgba(217,65,65,0.1); color: var(--red-alert); border-color: var(--red-alert); }

/* =========================================================================
   SISTEM NOU: GRID GIVEAWAY & POP-UP MODAL (DARK-GOLD THEME)
   ========================================================================= */

/* Dezactivare titluri automate Astra pe această pagină */
.page-template-page-giveaway .ast-single-post-title,
.page-template-page-giveaway .entry-header {
    display: none !important;
}

/* Container principal - fundal transparent pentru vizualizarea gradientului */
#primary.cst-clean-giveaway-page {
    padding-top: 140px !important;
    padding-bottom: 80px !important;
    background: transparent !important;
    min-height: 70vh;
}

/* Grila de Carduri */
.giveaway-grid-container {
    width: 100% !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
    grid-gap: 30px !important;
    box-sizing: border-box;
}

/* Mesaj când nu există concursuri */
.no-giveaways-box {
    grid-column: 1 / -1;
    text-align: center;
    padding: 60px 20px;
}
.no-giveaways-box h2 { color: var(--accent-neon) !important; }

/* Cardul de Grid */
.g-grid-card {
    background-color: var(--bg-card) !important; /* #0d1412 */
    border: 1px solid var(--border-color) !important; /* #262420 */
    border-radius: 10px !important;
    overflow: visible;
    display: flex;
    flex-direction: column;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    transition: transform 0.3s ease, border-color 0.3s ease;
}
.g-grid-card:hover {
    transform: translateY(-5px);
    border-color: var(--accent-neon) !important;
}

/* Imagine Card */
.g-card-thumb img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-bottom: 1px solid var(--border-color);
}

/* Conținut Card */
.g-card-content {
    padding: 20px !important;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.g-card-title {
    font-size: 1.3rem !important;
    color: var(--text-light) !important;
    margin: 0 0 12px 0 !important;
    line-height: 1.4;
}

.g-card-date {
    font-size: 0.85rem;
    color: var(--text-muted);
    margin: 10px 0 15px 0 !important;
}

/* Badge-uri Status */
.g-badge {
    align-self: flex-start;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
}
.badge-active { background: rgba(0,201,167,0.1); color: var(--accent-neon); border: 1px solid var(--accent-neon); }
.badge-expired { background: rgba(217,65,65,0.1); color: var(--red-alert); border: 1px solid var(--red-alert); }

/* Butoane Grid */
.g-trigger-btn {
    width: 100%;
    padding: 10px 15px;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 5px;
    cursor: pointer;
    margin-top: auto;
    transition: all 0.2s ease;
}
.btn-gold { background: var(--accent-neon); color: #000; border: none; }
.btn-gold:hover { background: var(--accent-hover); box-shadow: 0 0 10px rgba(0,201,167,0.3); }
.btn-outline { background: transparent; color: var(--text-light); border: 1px solid var(--border-color); }
.btn-outline:hover { border-color: var(--text-light); background: rgba(255,255,255,0.05); }


/* =========================================================================
   STRUCTURĂ MODAL POP-UP (OVERLAY GLOBAL)
   ========================================================================= */
.g-modal-wrapper {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 99999 !important; /* Peste absolut orice element/header din site */
    display: none; /* Ascuns implicit */
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

/* Clasa activată prin JS */
.g-modal-open {
    display: flex !important;
}

/* Fundalul întunecat din spatele modalului */
.g-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.85);
}

/* Caseta Centrală a Modalului */
.g-modal-content-box {
    position: relative;
    background-color: var(--bg-card) !important; /* #0d1412 */
    border: 1px solid var(--border-color) !important;
    width: 100%;
    max-width: 550px;
    max-height: 85vh; /* Nu lasă modalul să iasă din ecran pe telefoane */
    border-radius: 12px;
    padding: 35px;
    box-shadow: 0 25px 60px rgba(0,0,0,0.8), 0 0 30px rgba(229,177,0,0.05);
    display: flex;
    flex-direction: column;
    z-index: 100000;
    animation: fadeInModal 0.3s ease;
}

@keyframes fadeInModal {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Butonul de Închidere (X) */
.g-modal-close-btn {
    position: absolute;
    top: 15px;
    right: 20px;
    background: transparent;
    border: none;
    color: var(--text-muted);
    font-size: 2rem;
    cursor: pointer;
    line-height: 1;
    transition: color 0.2s;
}
.g-modal-close-btn:hover { color: var(--accent-neon); }

/* Titlu Modal */
.modal-main-title {
    font-size: 1.8rem !important;
    color: var(--text-light) !important;
    margin: 0 0 20px 0 !important;
    padding-right: 25px;
    font-weight: 700;
    text-align: center;
}

/* Corpul modalului (permite scroll dacă descrierea e foarte lungă) */
.modal-scrollable-body {
    overflow-y: auto;
    flex-grow: 1;
    padding-right: 5px;
}
/* Personalizare scrollbar discret */
.modal-scrollable-body::-webkit-scrollbar { width: 6px; }
.modal-scrollable-body::-webkit-scrollbar-thumb { background: var(--border-color); border-radius: 4px; }

/* Elemente text interior */
.modal-text-desc {
    color: var(--text-muted);
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 20px;
}

.modal-status-alert {
    padding: 12px;
    border-radius: 6px;
    text-align: center;
    font-weight: 700;
    font-size: 0.9rem;
    margin-bottom: 20px;
}
.alert-active-info { background: rgba(0,201,167,0.06); color: var(--accent-neon); border: 1px solid var(--accent-neon); }
.alert-expired-info { background: rgba(0,0,0,0.3); border: 1px dashed var(--border-color); padding: 20px; }
.alert-expired-info h3 { color: var(--red-alert) !important; margin: 0 0 5px 0 !important; }

/* Castigator Modal */
.modal-gold-winner {
    background: rgba(0,201,167,0.1);
    border: 1px solid var(--accent-neon);
    color: var(--text-light);
    padding: 10px 15px;
    border-radius: 6px;
    display: inline-block;
    margin: 15px 0;
    font-size: 1.1rem;
}
.modal-gold-winner strong { color: var(--accent-neon); }
.modal-stay-tuned { color: var(--accent-neon); margin-top: 10px; font-weight: 600; }

/* Formular Modal */
.modal-giveaway-form .m-form-group {
    margin-bottom: 16px;
    text-align: left;
}
.modal-giveaway-form label {
    display: block;
    color: var(--text-light);
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 6px;
}
.modal-giveaway-form input {
    width: 100% !important;
    padding: 12px !important;
    background-color: #0a0a0a !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 6px !important;
    color: var(--text-light) !important;
    font-size: 0.95rem !important;
    box-sizing: border-box;
}
.modal-giveaway-form input:focus {
    border-color: var(--accent-neon) !important;
    outline: none !important;
}

/* Buton Submit */
.m-submit-btn {
    width: 100%;
    background: var(--accent-neon) !important;
    color: #000 !important;
    padding: 14px;
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    margin-top: 10px;
    transition: background 0.2s;
}
.m-submit-btn:hover { background: var(--accent-hover) !important; }

/* Alerte formulare */
.g-alert { padding: 12px; border-radius: 6px; font-weight: 600; margin-bottom: 15px; text-align: center; border: 1px solid; font-size: 0.9rem; }
.g-alert-success { background: rgba(40,167,69,0.1); color: #28a745; border-color: #28a745; }
.g-alert-warning { background: rgba(0,201,167,0.1); color: var(--accent-neon); border-color: var(--accent-neon); }
.g-alert-danger { background: rgba(217,65,65,0.1); color: var(--red-alert); border-color: var(--red-alert); }

/* ==========================================================================
   REPARAȚII PREMIUM PAGINĂ COȘ & CHECKOUT (WOOCOMMERCE BLOCKS)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. REPARARE PREȚ PRODUS SUGERAT (S-ar putea să te intereseze...)
   -------------------------------------------------------------------------- */
/* Schimbă prețul din negru în portocaliu/auriu ca să fie vizibil pe fundal închis */
.wc-block-components-product-price,
.wc-block-components-product-price ins,
.wc-block-components-product-price .woocommerce-Price-amount {
    color: #00C9A7 !important;
    font-weight: 700 !important;
}

/* Prețul vechi tăiat (dacă există reducere) îl facem un gri șters */
.wc-block-components-product-price del,
.wc-block-components-product-price del .woocommerce-Price-amount {
    color: #777777 !important;
    font-weight: normal !important;
}

/* Titlul secțiunii de sugestii și titlul produsului sugerat */
.wc-block-heading, 
.wc-block-components-product-name {
    color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   2. REPARARE DESCRIERE URIAȘĂ ÎN COȘ (Oprește textul din a ocupa toată pagina)
   -------------------------------------------------------------------------- */
/* Reducem drastic dimensiunea titlului lung din descrierea produsului din coș */
.wc-block-components-product-metadata__description {
    max-height: 60px !important; /* Limitează înălțimea maximă */
    overflow: visible !important;
    text-overflow: ellipsis !important; /* Adaugă "..." dacă textul e prea lung */
    margin-top: 5px !important;
}

/* Forțăm orice H1, H2, H3 sau text din descriere să devină mic și discret */
.wc-block-components-product-metadata__description *,
.wc-block-components-product-metadata__description .fui-heading {
    font-size: 0.85rem !important; /* Dimensiune mică de text secundar */
    font-weight: 400 !important;
    line-height: 1.3 !important;
    color: #aaaaaa !important; /* Gri deschis, curat */
    margin: 0 !important;
    padding: 0 !important;
}

/* Aliniem mai bine elementele din rândul de coș */
.wc-block-cart-items__row {
    align-items: center !important;
}

/* --------------------------------------------------------------------------
   3. REPARARE HOVER BUTOANE AURII (Oprește transformarea în gri urât)
   -------------------------------------------------------------------------- */
/* Forțăm butonul principal să rămână auriu/portocaliu în starea normală */
.wc-block-cart__submit-button,
.wc-block-cart__submit .wp-element-button,
.wc-block-components-checkout-step__submit-button {
    background-color: #00C9A7 !important;
    color: #ffffff !important;
    transition: all 0.2s ease-in-out !important;
}

/* REPARAȚIA PENTRU HOVER: În loc de gri, se va transforma într-un auriu mai închis/intens */
.wc-block-cart__submit-button:hover,
.wc-block-cart__submit .wp-element-button:hover,
.wc-block-components-checkout-step__submit-button:hover,
.wc-block-cart__submit-button:focus,
.wc-block-cart__submit .wp-element-button:focus {
    background-color: #00C9A7 !important; /* Un portocaliu/auriu premium mai închis */
    color: #ffffff !important;
    opacity: 1 !important; /* Anulează opacitatea scăzută din Astra */
    box-shadow: 0 4px 12px rgba(0, 201, 167, 0.3) !important;
}

/* --------------------------------------------------------------------------
   4. COSMETICĂ ȘI OPTIMIZARE GRID GENERAL (Desktop & Mobil)
   -------------------------------------------------------------------------- */
/* Stilizare card produs sugerat pentru a arăta premium */
li.wc-block-product {
    background: #0a0a0a !important;
    border: 1px solid #252525 !important;
    border-radius: 8px !important;
    padding: 15px !important;
}

/* Corecție text total și etichete coș */
.wc-block-components-totals-item__label,
.wc-block-cart__totals-title {
    color: #ffffff !important;
}

/* Optimizare pentru ecrane mici (Mobil) */
@media (max-width: 767px) {
    /* Face ca zona de produse din coș și zona de plată să nu fie lipite pe mobil */
    .wc-block-components-sidebar-layout {
        gap: 30px !important;
    }
    
    /* Reducem dimensiunea numelui produsului în coș pe mobil ca să nu se suprapună */
    .wc-block-components-product-name {
        font-size: 1rem !important;
    }
}
/* ==========================================================================
   REPARAȚII SUPLIMENTARE: CARD PRODUS SUGERAT (COȘ)
   ========================================================================== */

/* 1. Reparare text "/ Month" (să nu mai fie negru) */
.wc-block-components-product-price {
    color: #aaaaaa !important; /* Schimbă textul simplu/sufixul în gri deschis */
}

/* Forțare pentru orice span de interval generat de plugin-ul de abonamente */
.wc-block-components-product-price span:not(.woocommerce-Price-amount):not(del):not(ins) {
    color: #aaaaaa !important;
}


/* 2. Reparare buton "Adaugă în Coș Abonamentul" (Stare Normală) */
.wc-block-product .wc-block-components-product-button__button,
.wc-block-product .wp-block-button__link.add_to_cart_button {
    background-color: #00C9A7 !important; /* Auriu/Portocaliu stabil */
    color: #ffffff !important;
    opacity: 1 !important;
    font-weight: 600 !important;
    transition: all 0.2s ease-in-out !important;
}

/* 3. REPARARE HOVER BUTON SUGERAT (Să nu se mai facă gri urât) */
.wc-block-product .wc-block-components-product-button__button:hover,
.wc-block-product .wp-block-button__link.add_to_cart_button:hover,
.wc-block-product .wc-block-components-product-button__button:focus {
    background-color: #00C9A7 !important; /* Portocaliu mai intens la hover */
    color: #ffffff !important;
    opacity: 1 !important;
    box-shadow: 0 4px 12px rgba(0, 201, 167, 0.4) !important;
}
/* ==========================================================================
   OPTIMIZARE ȘI REPARARE PAGINĂ CHECKOUT (WOOCOMMERCE BLOCKS)
   ========================================================================== */

/* 1. REPARARE ETICHETE CĂSUȚE (Text invizibil / Alb pe Alb) */
/* Setează culoarea textului din interiorul căsuțelor (starea inactivă / placeholder) */
.wc-block-checkout .wc-block-components-text-input label,
.wc-block-checkout .wc-block-components-combobox label {
    color: #555555 !important; /* Gri închis, perfect vizibil pe căsuța albă */
    font-weight: 500 !important;
}

/* REPARARE ETICHETĂ ACTIVĂ: Când dai click în căsuță și textul se micșorează sus */
.wc-block-checkout .wc-block-components-text-input.is-active label,
.wc-block-checkout .wc-block-components-text-input:focus-within label,
.wc-block-checkout .wc-block-components-combobox.is-active label,
.wc-block-checkout .wc-block-components-combobox:focus-within label {
    color: #00C9A7 !important; /* Se transformă în auriul tău premium, devenind super lizibil! */
    font-weight: 600 !important;
}

/* Forțare text input de tip text simplu sau selectoare */
.wc-block-checkout .wc-block-components-text-input input,
.wc-block-checkout .wc-block-components-text-input textarea,
.wc-block-checkout .wc-block-components-combobox__input {
    color: #111111 !important; /* Textul pe care îl scrie clientul să fie negru intens */
    background-color: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
}

/* 2. REPARARE BUTON "PLASEAZĂ COMANDA" (De la invizibil la Auriu Premium) */
.wc-block-checkout .wc-block-components-checkout-place-order-button {
    background-color: #00C9A7 !important; /* Fundal auriu stabil */
    color: #ffffff !important; /* Text alb */
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 20px !important;
    border-radius: 8px !important;
    transition: all 0.3s ease-in-out !important;
    box-shadow: 0 4px 15px rgba(0, 201, 167, 0.2) !important;
}

/* REPARARE HOVER: Anulează griul implicit și îl face un portocaliu-auriu intens */
.wc-block-checkout .wc-block-components-checkout-place-order-button:hover,
.wc-block-checkout .wc-block-components-checkout-place-order-button:focus {
    background-color: #00C9A7 !important; /* Schimbare fină de nuanță la hover */
    color: #ffffff !important;
    opacity: 1 !important;
    transform: translateY(-2px) !important; /* Efect discret de ridicare */
    box-shadow: 0 6px 20px rgba(0, 201, 167, 0.4) !important;
}

/* 3. ARANJARE LOGICĂ ȘI TIPOGRAFIE (Texte ajutătoare și titluri) */
/* Toate titlurile mari din pașii de checkout devin albe și clare */
.wc-block-checkout h1, 
.wc-block-checkout h2, 
.wc-block-checkout h3,
.wc-block-checkout .wc-block-components-title,
.wc-block-checkout .wc-block-components-checkout-step__title {
    color: #ffffff !important;
    font-weight: 600 !important;
    letter-spacing: -0.5px !important;
}

/* Textul de lângă checkbox-uri (ex: "Adaugă o notă la comandă", "Sunt de acord cu Termenii...") */
.wc-block-checkout .wc-block-components-checkbox-control__label,
.wc-block-checkout .wc-block-components-radio-control__label,
.wc-block-checkout .wc-block-checkout__terms {
    color: #dddddd !important;
    font-size: 0.95rem !important;
}

/* Zona de text/link-uri de sub butoane */
.wc-block-checkout .wc-block-components-checkout-step__description,
.wc-block-checkout-express-payment-title {
    color: #aaaaaa !important;
}

/* 4. CORECTARE REZUMAT COMANDĂ (Coloana din Dreapta) */
/* Numele produselor din rezumat și etichetele de preț */
.wc-block-components-checkout-summary-block .wc-block-components-product-name,
.wc-block-components-checkout-summary-block .wc-block-components-totals-item__label {
    color: #ffffff !important;
}

/* Valorile intermediare ale prețurilor */
.wc-block-components-checkout-summary-block .wc-block-components-totals-item__value {
    color: #cccccc !important;
}

/* Prețul TOTAL mare din rezumat */
.wc-block-components-checkout-summary-block .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
    color: #00C9A7 !important; /* Totalul strălucește în auriu */
    font-weight: 700 !important;
}

/* --------------------------------------------------------------------------
   1. REPARARE PREȚURI ȘI TEXTE NEGRE (ZONA "RENEWAL FOR...")
   -------------------------------------------------------------------------- */
/* Titlul secțiunii de reînnoire */
div[class*="recurring_bifurcation"] h4 {
    color: #ffffff !important;
    font-size: 1.2rem !important;
    margin-bottom: 15px !important;
}

/* Etichetele text: "Subtotal:" și "Total:" */
div[class*="recurring_bifurcation"] ul li label {
    color: #cccccc !important; /* Gri deschis curat */
    font-weight: 500 !important;
}

/* Prețurile efective (Să nu mai fie negre, le facem Auriu/Portocaliu Premium) */
div[class*="recurring_bifurcation"] ul li .woocommerce-Price-amount,
div[class*="recurring_bifurcation"] ul li .amount {
    color: #00C9A7 !important; 
    font-weight: 700 !important;
}

/* Textul de interval de timp (/ Month) */
div[class*="recurring_bifurcation"] ul li .wps_sfw_interval {
    color: #999999 !important;
    font-size: 0.9rem !important;
    margin-left: 5px !important;
}

/* Aliniere și curățare listă de renewal */
div[class*="recurring_bifurcation"] ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

div[class*="recurring_bifurcation"] ul li {
    display: flex !important;
    justify-content: space-between !important;
    padding: 8px 0 !important;
    border-bottom: 1px dashed #252525 !important;
}

/* ==========================================================================
   REPARARE MENIU STÂNGA & NUME UTILIZATOR - TUTOR LMS (TEXT ALB)
   ========================================================================== */

/* 1. Forțare NUME UTILIZATOR să fie ALB (ex: ghirtasert) */
.tutor-dashboard-left-sidebar .tutor-dashboard-header-display-name,
.tutor-dashboard-left-sidebar .tutor-dashboard-header-info h4,
.tutor-dashboard-left-sidebar .tutor-fs-4,
.tutor-dashboard-header-username {
    color: #ffffff !important;
    font-weight: 600 !important;
}

/* Textul secundar de sub nume (dacă există, ex: rolul de Student/Instructor) */
.tutor-dashboard-left-sidebar .tutor-dashboard-header-subtitle,
.tutor-dashboard-left-sidebar .tutor-color-text-muted {
    color: #aaaaaa !important;
}

/* 2. Forțare TEXT TOATE BUTOANELE DIN STÂNGA să fie ALB CURAT */
/* (Panoul de control, Profilul meu, Cursuri înscrise, Recenzii, Istoric comenzi, Setări etc.) */
.tutor-dashboard-left-sidebar .tutor-dashboard-menu ul li a,
.tutor-dashboard-menu-item a,
.tutor-dashboard-menu-link {
    color: #ffffff !important; /* Textul devine alb pur, perfect vizibil */
    font-weight: 500 !important;
    letter-spacing: 0.3px !important;
    transition: all 0.2s ease-in-out !important;
}

/* 3. Forțare ICONIȚE de lângă butoane să fie Albe/Gri deschis */
.tutor-dashboard-left-sidebar .tutor-dashboard-menu ul li a i,
.tutor-dashboard-left-sidebar .tutor-dashboard-menu ul li a span[class^="tutor-icon-"],
.tutor-dashboard-menu-item a i {
    color: #eeeeee !important;
    opacity: 0.9 !important;
}

/* 4. HOVER & STARE ACTIVĂ (Când pui mouse-ul sau când ești pe pagina respectivă) */
/* Textul se transformă în Auriul tău Premium */
.tutor-dashboard-left-sidebar .tutor-dashboard-menu ul li.active a,
.tutor-dashboard-left-sidebar .tutor-dashboard-menu ul li a:hover,
.tutor-dashboard-menu-item.active a,
.tutor-dashboard-menu-item a:hover {
    color: #00C9A7 !important; /* Auriu stabil la hover/selectat */
    background-color: rgba(243, 156, 18, 0.1) !important; /* Un fundal discret în spatele butonului */
}

/* Iconițele devin și ele Aurii la hover sau când butonul e activ */
.tutor-dashboard-left-sidebar .tutor-dashboard-menu ul li.active a i,
.tutor-dashboard-left-sidebar .tutor-dashboard-menu ul li a:hover i,
.tutor-dashboard-left-sidebar .tutor-dashboard-menu ul li.active a span,
.tutor-dashboard-left-sidebar .tutor-dashboard-menu ul li a:hover span {
    color: #00C9A7 !important;
    opacity: 1 !important;
}

/* Îndepărtare linii de bordură inutile care ar putea arăta rău pe fundal închis */
.tutor-dashboard-left-sidebar {
    border-right: 1px solid #222222 !important;
}
/* ==========================================================================
   FORȚARE SPAȚIERE PAGINĂ COMUNITATE (REZOLVARE CONFLICT OVERLAP)
   ========================================================================== */

/* Țintim direct grila de carduri din pagina de comunitate și o obligăm 
   să împingă footer-ul cu 140px mai jos, eliberând butoanele acoperite */
.vasika-comunitate-wrapper .vasika-grila-canale {
    margin-bottom: 140px !important;
}

/* Asigurăm că wrapper-ul paginii își recalculează înălțimea corect pe mobil/desktop */
.vasika-comunitate-wrapper {
    height: auto !important;
    overflow: visible !important;
}
/* ==========================================================================
   REPARARE DEFINITIVĂ SUPRAPUNERE FOOTER - PAGINA COMUNITATE
   ========================================================================== */

/* Pasul 1: Dezactivăm complet Flexbox structural DOAR pe pagina care conține 
   wrapper-ul de comunitate. Revenirea la „display: block” obligă browserul 
   să recalculeze la milimetru înălțimea reală a cardurilor din grilă. */
body:has(.vasika-comunitate-wrapper) #page,
body:has(.vasika-comunitate-wrapper) .site,
body:has(.vasika-comunitate-wrapper) #content,
body:has(.vasika-comunitate-wrapper) .site-content,
body:has(.vasika-comunitate-wrapper) #primary,
body:has(.vasika-comunitate-wrapper) .site-main {
    display: block !important;
    height: auto !important;
    min-height: initial !important;
}

/* Pasul 2: Suprascriem regula restrictivă din secțiunea footerului global. 
   Forțăm wrapper-ul să aibă un spațiu de evacuare masiv la bază, astfel încât 
   gradientul de 100px al footer-ului să nu mai atingă sub nicio formă butoanele. */
.vasika-comunitate-wrapper {
    display: block !important;
    margin-bottom: 0 !important;
    padding-bottom: 160px !important; /* Spațiu de siguranță absolută sub butoane */
    float: none !important;
    clear: both !important;
}

/* Pasul 3: Ne asigurăm că footer-ul își reia comportamentul natural de curgere 
   în pagină și se așază cuminte sub conținut, fără decalaje. */
body:has(.vasika-comunitate-wrapper) .site-footer-global {
    margin-top: 0 !important;
    position: relative !important;
    clear: both !important;
}

/* ==========================================================================
   SISTEM GLOBAL DE NAVIGARE & REPARARE STRUCTURĂ FOOTER
   (Optimizat pentru Pagini Complexe, Desktop & Mobile-First)
   ========================================================================== */

/* --------------------------------------------------------------------------
   PASUL 1: ACTIVAREA „ÎNTRERUPĂTORULUI” PENTRU PAGINI CU BREAKOUT
   Identificăm paginile dinamice (Comunitate și Testimoniale) și le resetăm 
   structura ca să forțăm browserul să calculeze înălțimea reală a clipurilor/cardurilor.
   -------------------------------------------------------------------------- */
html:has(.vasika-comunitate-wrapper, .vasika-testimonials-page),
body:has(.vasika-comunitate-wrapper, .vasika-testimonials-page) {
    height: auto !important;
    display: block !important;
}

body:has(.vasika-comunitate-wrapper, .vasika-testimonials-page) #page,
body:has(.vasika-comunitate-wrapper, .vasika-testimonials-page) .site {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
    height: auto !important;
}

body:has(.vasika-comunitate-wrapper, .vasika-testimonials-page) #content,
body:has(.vasika-comunitate-wrapper, .vasika-testimonials-page) .site-content {
    display: block !important;
    flex: 1 0 auto !important;
    height: auto !important;
}

/* --------------------------------------------------------------------------
   PASUL 2: OPTIMIZARE ȘI TAMPON DE SIGURANȚĂ (DESKTOP)
   Adăugăm spațiu sub conținut pentru ca gradientul footerului să nu atingă elementele.
   -------------------------------------------------------------------------- */
.vasika-comunitate-wrapper,
.vasika-testimonials-page {
    display: block !important;
    position: relative !important;
    padding-top: 80px !important;
    padding-bottom: 140px !important; /* Spațiu curat pe desktop */
    margin-bottom: 0 !important;
    height: auto !important;
}

/* --------------------------------------------------------------------------
   PASUL 3: ULTRA-OPTIMIZARE PENTRU MOBIL (Media Query Ecran Mic)
   Pe mobil, videoclipurile și grilele se aranjează pe un singur rând lung.
   Forțăm un padding extins ca al doilea clip să iasă complet de sub footer.
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
    .vasika-comunitate-wrapper,
    .vasika-testimonials-page {
        padding-top: 40px !important;
        /* 180px oferă destul spațiu pe ecranele tactile, prevenind misclick-urile */
        padding-bottom: 180px !important; 
    }
    
    /* Ne asigurăm că videoclipurile din testimoniale nu forțează layout-ul pe mobil */
    .vasika-testimonials-page iframe,
    .vasika-testimonials-page video {
        max-width: 100% !important;
        margin-bottom: 20px !important;
    }
}

/* --------------------------------------------------------------------------
   PASUL 4: REPLICARE COȘ DE CUMPĂRĂTURI & LOGIN (PAGINI SCURTE)
   Comportamentul de „Sticky Footer” rămâne intact acolo unde paginile sunt goale.
   -------------------------------------------------------------------------- */
html:not(:has(.vasika-comunitate-wrapper, .vasika-testimonials-page)),
body:not(:has(.vasika-comunitate-wrapper, .vasika-testimonials-page)) {
    height: 100%;
}

body:not(:has(.vasika-comunitate-wrapper, .vasika-testimonials-page)) #page {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

body:not(:has(.vasika-comunitate-wrapper, .vasika-testimonials-page)) #content {
    flex: 1 0 auto;
}

body:not(:has(.vasika-comunitate-wrapper, .vasika-testimonials-page)) .site-footer-global {
    margin-top: auto !important;
}
/* ==========================================================================
   REPARARE PAGINĂ PRODUS (IMAGINE DESKTOP & VIZIBILITATE PREȚ)
   ========================================================================== */

/* 1. SALVAREA PREȚULUI ȘI A SUFIXULUI DIN ÎNTUNERIC (VALABIL PE TOATE DISPOZITIVELE) */
.single-product .summary .price,
.single-product .summary .price .amount,
.single-product .summary .price del .amount,
.single-product .summary .price ins .amount,
.woocommerce-Price-amount.amount,
.single-product .summary .price *,
.single-product .summary .wps-sfw-interval,
.single-product .summary .wps-sfw-interval *,
span.wps_sfw_interval {
    color: #ffffff !important;
}

span.wps_sfw_interval {
    display: inline-block !important;
    margin-left: 4px; /* Spațiu elegant după preț */
}

/* 2. REPARARE ABSOLUTĂ DESKTOP: ANULARE MOD STICKY / DRIFT PENTRU IMAGINEA DE PLACEHOLDER */
@media (min-width: 769px) {
    
    /* Blocăm structura exactă din screenshot-ul tău să nu mai plutească la scroll */
    .woocommerce-product-gallery,
    .woocommerce-product-gallery__wrapper,
    .woocommerce-product-gallery__image--placeholder,
    .woocommerce-product-gallery__image--placeholder img.wp-post-image,
    .single-product .woocommerce-product-gallery__image img {
        position: relative !important;
        top: 0 !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        transform: none !important;
        will-change: auto !important;
        background-attachment: scroll !important;
    }

    /* Blocăm containerele mari structurale (Astra / WooCommerce) */
    .product .images,
    .ast-woocommerce-container .images,
    .ast-product-gallery-layout-vertical,
    .ast-product-gallery-main,
    .flex-viewport,
    .single-product div.product .images,
    .single-product .flex-viewport,
    .single-product .ast-product-gallery-layout-vertical {
        position: relative !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        will-change: auto !important;
        height: auto !important;
    }

    /* Forțăm așezarea să alinieze elementele sus, fără întinderi dinamice */
    div.product {
        align-items: flex-start !important;
    }

    /* 1. Dezactivare efecte de Sticky Column - Selectori Standard (Fără erori în editor) */
    .elementor-widget-woocommerce-product-images,
    .elementor-sticky,
    .elementor-sticky--active,
    .elementor-sticky--effects,
    .elementor-element.elementor-sticky--active {
        position: relative !important;
        top: auto !important;
        transform: none !important;
    }

    /* 2. Selectori Moderni (Izolați special ca să nu blocheze restul fișierului)
       Notă: Editorul Hostinger s-ar putea să mai arate un "X" discret aici, dar browserele moderne 
       îl vor citi perfect, iar restul codului de mai sus va rămâne complet funcțional. */
    .elementor-column:has(.woocommerce-product-gallery) {
        position: relative !important;
        top: auto !important;
        transform: none !important;
    }}
    .e-con:has(.woocommerce-product-gallery) {
        position: relative !important;
        top: auto !important;
        transform: none !important;
    }
    .e-con-inner:has(.woocommerce-product-gallery) {
        position: relative !important;
        top: auto !important;
        transform: none !important;
    }
 


    /* Blocăm wrapper-ele generate de scripturile JS din Astra Pro */
    .ast-single-product-sticky-wrapper,
    div[class*="sticky-summary"],
    div[class*="sticky-gallery"] {
        position: relative !important;
        top: auto !important;
        height: auto !important;
        transform: none !important;
    }
    /* ==========================================================================
   FORȚARE BRUTĂ DESKTOP: BLOCARE COMPLETĂ IMAGINE PLACEHOLDER (ZERO MIȘCARE)
   ========================================================================== */
@media (min-width: 769px) {

    /* 1. Blocăm DIRECT imaginea din screenshot și toate straturile ei interne/externe */
    .single-product .woocommerce-product-gallery__image--placeholder img,
    .single-product .woocommerce-product-gallery__image--placeholder img.wp-post-image,
    .single-product .woocommerce-product-gallery__image--placeholder,
    .single-product .woocommerce-product-gallery__wrapper,
    .single-product .woocommerce-product-gallery,
    .single-product .flex-viewport,
    .single-product .product .images,
    .single-product .ast-woocommerce-container .images {
        position: relative !important;
        top: 0 !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        transform: none !important;
        -webkit-transform: none !important;
        will-change: auto !important;
        transition: none !important;
        -webkit-transition: none !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        height: auto !important;
        display: block !important;
    }

    /* 2. Dezactivăm brutal orice structură de tip Sticky (Astra Pro sau Elementor) din zona galeriei */
    .ast-single-product-sticky-wrapper,
    .ast-product-gallery-main,
    div[class*="sticky-gallery"],
    div[class*="sticky-summary"],
    .elementor-widget-woocommerce-product-images,
    .elementor-sticky,
    .elementor-sticky--active,
    .elementor-sticky--effects,
    .elementor-element.elementor-sticky--active {
        position: relative !important;
        top: 0 !important;
        bottom: auto !important;
        transform: none !important;
        -webkit-transform: none !important;
        will-change: auto !important;
        transition: none !important;
        height: auto !important;
    }

    /* 3. Forțăm structura mare a paginii să alinieze elementele sus (oprește întinderea coloanei foto) */
    div.product,
    .site-content .ast-container div.product,
    .elementor-wc-products .product {
        display: flex !important;
        align-items: flex-start !important;
    }
}
/* ==========================================================================
   REPARARE LAYOUT PROFIL TUTOR LMS: ÎMPINGERE FOOTER LA BAZĂ
   ========================================================================== */

/* 1. Forțăm wrapper-ul principal și containerele Tutor să își calculeze înălțimea automat */
.tutor-wrap,
.tutor-wrap .tutor-container {
    display: block !important;
    height: auto !important;
    clear: both !important;
}

/* 2. Corectăm coloana de conținut (biografia + cursurile) să nu se mai colapseze */
.tutor-user-profile-content {
    display: block !important;
    float: none !important; /* Elimină float-urile care strică înălțimea */
    width: 100% !important; /* Se asigură că ocupă spațiul corect */
    height: auto !important;
    clear: both !important;
}

/* 3. Forțăm grila de cursuri (cele 3 carduri din imagine) să rămână în fluxul normal al paginii */
.tutor-grid, 
.tutor-grid-3 {
    display: grid !important; /* Re-forțăm așezarea de tip Grid */
    position: relative !important;
    float: none !important;
    clear: both !important;
    height: auto !important;
    margin-bottom: 50px !important; /* Adaugă un spațiu elegant înainte să înceapă footer-ul */
}

/* 4. Resetăm brutal poziția Footer-ului global pentru a-l obliga să stea DOAR sub cursuri */
footer.site-footer-global,
.site-footer-global {
    display: block !important;
    position: relative !important;
    clear: both !important;
    top: auto !important;
    bottom: auto !important;
    margin-top: 0 !important;
}
/* ==========================================================================
   REPARARE RADICALĂ LAYOUT TUTOR LMS: CORECTARE ORDINE CURSURI / FOOTER
   ========================================================================== */

/* 1. Forțăm structura mare a paginii (Astra/WordPress) să devină o coloană Flex
      pentru a putea controla ordinea exactă a elementelor mari */
body, 
#page, 
.site, 
#content {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
}

/* 2. Forțăm zona Tutor LMS (profil + cursuri) să fie PRIMA în ordine și să ocupe spațiu real */
.tutor-wrap,
.tutor-wrap-parent {
    order: 1 !important;
    display: block !important;
    height: auto !important;
    min-height: max-content !important;
    clear: both !important;
}

/* 3. Corectăm containerele interne din Tutor să nu mai colapseze sub nicio formă */
.tutor-container,
.tutor-user-profile-content {
    display: block !important;
    height: auto !important;
    clear: both !important;
    overflow: visible !important; /* Schimbat din auto în visible ca să lase conținutul să respire */
}

/* 4. Ne asigurăm că grila de cursuri (cardurile albe) își păstrează poziția corectă */
.tutor-grid, 
.tutor-grid-3 {
    display: grid !important;
    position: relative !important;
    float: none !important;
    clear: both !important;
    height: auto !important;
    margin-bottom: 50px !important; /* Creează spațiu liber între cursuri și footer */
}

/* 5. Forțăm Footer-ul global să fie al DOILEA element (strict la baza paginii, sub cursuri) */
footer.site-footer-global,
.site-footer-global {
    order: 2 !important;
    position: relative !important;
    display: block !important;
    clear: both !important;
    margin-top: auto !important; /* Îl împinge automat la extremitatea de jos a ecranului */
    top: auto !important;
    bottom: 0 !important;
}
header.ast-header-without-markup {
    display: none !important;
}

/* 1. Modificare tag "Sale!" */
.woocommerce ul.products li.product .ast-onsale-card {
    background-color: #00C9A7 !important;
    color: #000000 !important;
}

/* 2. Modificare buton/cerculeț "Adaugă în coș" (din colțul imaginii) */
.woocommerce ul.products li.product .ast-on-card-button {
    background-color: #00C9A7 !important;
    color: #000000 !important;
}

/* 3. Modificare culoare pentru iconița SVG din interiorul butonului */
.woocommerce ul.products li.product .ast-on-card-button svg {
    fill: #000000 !important;
    stroke: #000000 !important;
}

/* 4. Opțional: Schimbare culoare text tooltip ("Adaugă în coș abonamentul") la hover */
.woocommerce ul.products li.product .ast-card-action-tooltip {
    background-color: #00C9A7 !important;
    color: #000000 !important;
}
/* ==========================================================================
   Hero Image - Desktop & General Styles
   ========================================================================== */
.hero-image-wrapper {
    width: 100%;
    max-width: 800px; /* O lățime ideală pentru desktop ca să nu devină uriașă */
    margin: 0 auto 24px auto; /* Centrat + spațiu generos jos */
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 12px; /* Colțuri rotunjite moderne */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15); /* Umbră fină pentru realism */
}

.hero-main-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    /* Împiedică layout shift-ul (schimbarea bruscă de așezare la încărcare) */
    aspect-ratio: 16 / 9; 
}

/* ==========================================================================
   Optimizare pentru Mobil și Tabletă (Ecrane sub 768px)
   ========================================================================== */
@media (max-width: 768px) {
    .hero-image-wrapper {
        max-width: 100%; /* Ocupă toată lățimea disponibilă pe telefon */
        margin-bottom: 16px; /* Spațiu ușor mai mic pe mobil până la badge */
        border-radius: 8px; /* Rotunjire mai mică, adaptată ecranelor mici */
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); /* Umbră mai discretă */
    }

    .hero-main-img {
        /* Pe mobil, dacă imaginea este prea înaltă, îi tăiem din înălțime 
           ca să lăsăm loc textului să se vadă "above the fold" (fără scroll) */
        max-height: 250px; 
        object-position: center; /* Se asigură că centrul imaginii rămâne mereu vizibil */
    }
}

/* Optimizare suplimentară pentru telefoane foarte mici (ex: iPhone SE) */
@media (max-width: 380px) {
    .hero-main-img {
        max-height: 180px; 
    }
}
/* --- TEXT TUTOR LMS (Alb) --- */

/* Targetează clasele specifice Tutor și forțează culoarea albă */
[class*="tutor-color-black"],
.tutor-fs-5,
.tutor-fs-6,
.tutor-fs-7,
.tutor-dashboard-title,
h6.tutor-fs-6 {
    color: #808080 !important;
}

/* Opțional: Schimbă și culoarea link-urilor din Tutor în alb/gri deschis dacă e nevoie */
.tutor-fs-7 a {
    color: #808080 !important;
    text-decoration: underline;
}


/* --- TEXT WOOCOMMERCE (Gri închis spre Negru) --- */

/* Targetează prețul și simbolul valutei din WooCommerce */
.woocommerce-Price-amount.amount,
.woocommerce-Price-currencySymbol {
    color: #808080 !important; /* Un negru/gri foarte închis, plăcut ochiului */
}
/* ==========================================================================
   X. REPARARE ȘI STILIZARE DESIGN BLOG CUSTOM
   ========================================================================== */

.blog-custom-wrapper {
    position: relative;
    display: block;
    width: 100%;
    margin: 0 auto;
    padding-top: 50px;
    padding-bottom: 80px;
    color: var(--text-light);
}

/* Container text/hero forțat să rămână inline în body */
.blog-hero-content {
    position: static !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    text-align: left;
    margin-bottom: 30px;
    padding: 0 !important;
    box-shadow: none !important;
}

.blog-main-title {
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 10px 0 !important;
    color: var(--accent-neon) !important;
}

.blog-subtitle {
    font-size: 1.1rem;
    color: var(--text-muted) !important;
    margin: 0 0 20px 0 !important;
}

/* Linie separatoare curată */
.blog-separator {
    border: 0;
    height: 1px;
    background: var(--border-color);
    margin: 40px 0;
    display: block;
    width: 100%;
}

/* Butonul de acțiune pentru adăugare */
.btn-neon-action {
    display: inline-block;
    background: var(--accent-neon);
    color: var(--bg-main) !important;
    font-weight: 600;
    border: none;
    padding: 12px 24px;
    border-radius: 4px;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    margin-top: 5px;
}

.btn-neon-action:hover {
    transform: scale(1.02);
    box-shadow: 0 0 15px var(--accent-neon);
}

/* Formularul de adăugare postări (Card izolat corect) */
.style-card-blur {
    background: rgba(29, 20, 18, 0.4) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 30px;
    margin: 30px 0;
    width: 100%;
    max-width: 800px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.6);
}

.formular-postare-noua h3 {
    margin-top: 0;
    margin-bottom: 25px;
    color: var(--text-light);
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: var(--text-muted);
}

.form-group input[type="text"] {
    width: 100%;
    background: #111111;
    border: 1px solid var(--border-color);
    padding: 12px;
    color: var(--text-light);
    border-radius: 4px;
    font-family: 'Inter', sans-serif;
}

.form-group input[type="text"]:focus {
    outline: none;
    border-color: var(--accent-neon);
}

.btn-submit-post {
    background: transparent;
    color: var(--accent-neon);
    border: 2px solid var(--accent-neon);
    padding: 12px 28px;
    font-weight: 600;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.btn-submit-post:hover {
    background: var(--accent-neon);
    color: var(--bg-main);
    box-shadow: 0 0 15px var(--accent-neon);
}

/* Notificări status */
.blog-alert {
    padding: 15px;
    border-radius: 4px;
    margin-bottom: 25px;
    text-align: center;
    font-weight: 500;
}
.alert-success { background: rgba(0, 201, 167, 0.15); color: var(--accent-neon); border: 1px solid var(--accent-neon); }
.alert-danger { background: rgba(255, 59, 59, 0.15); color: var(--red-alert); border: 1px solid var(--red-alert); }

/* Gridul principal de postări */
.blog-posts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 30px;
    margin-top: 20px;
}

.blog-card-item {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    transition: transform 0.3s ease, border-color 0.3s ease;
    display: flex;
    flex-direction: column;
}

.blog-card-item:hover {
    transform: translateY(-4px);
    border-color: var(--accent-neon);
}

.blog-card-body {
    padding: 25px;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.blog-meta-date {
    font-size: 0.85rem;
    color: var(--text-muted);
    margin-bottom: 12px;
    display: block;
}

.blog-card-title {
    font-size: 1.4rem;
    line-height: 1.4;
    margin: 0 0 15px 0;
}

.blog-card-title a {
    color: var(--text-light);
    text-decoration: none;
    transition: color 0.2s ease;
}

.blog-card-title a:hover {
    color: var(--accent-neon);
}

.blog-card-excerpt {
    color: var(--text-muted);
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 25px;
    flex-grow: 1;
}

.blog-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    padding-top: 15px;
}

.read-more-link {
    color: var(--accent-neon);
    font-weight: 500;
    text-decoration: none;
}

.read-more-link:hover {
    text-decoration: underline;
}

.blog-comments-count {
    font-size: 0.9rem;
    color: var(--text-muted);
}

/* Paginație */
.blog-pagination {
    text-align: center;
    margin-top: 60px;
}

.blog-pagination .page-numbers {
    display: inline-block;
    padding: 8px 16px;
    margin: 0 4px;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-light);
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.blog-pagination .page-numbers.current, 
.blog-pagination .page-numbers:hover {
    background: var(--accent-neon);
    color: var(--bg-main);
    border-color: var(--accent-neon);
}

.no-posts-found {
    text-align: center;
    color: var(--text-muted);
    font-style: italic;
    padding: 40px 0;
}

/* ==========================================================================
   X. OPTIMIZĂRI RESPONSIVE PENTRU MOBIL (ECORENE < 768px)
   ========================================================================== */

@media screen and (max-width: 768px) {
    
    .blog-custom-wrapper {
        /* Adăugăm spațiu suplimentar sus ca să nu intre sub header-ul tău global fixed */
        padding-top: 100px; 
        padding-left: 15px;
        padding-right: 15px;
    }

    /* Micșorăm titlul principal pe mobil să nu ocupe jumătate de ecran */
    .blog-main-title {
        font-size: 2rem !important;
        line-height: 1.3;
    }

    .blog-subtitle {
        font-size: 1rem !important;
        margin-bottom: 25px !important;
    }

    /* Butonul de adăugare postare devine full-width pe mobil pentru a fi ușor de apăsat cu degetul */
    .btn-neon-action {
        width: 100%;
        text-align: center;
        padding: 14px 20px; /* Un pic mai înalt pentru ergonomie touch */
    }

    /* Zona de formular se adaptează complet la lățimea ecranului */
    .style-card-blur {
        padding: 20px 15px !important;
        margin: 20px 0;
        border-radius: 6px;
    }

    /* Gridul de postări trece automat pe o singură coloană */
    .blog-posts-grid {
        grid-template-columns: 1fr !important;
        gap: 20px; /* Distanță puțin mai mică între carduri pe mobil */
    }

    /* Ajustări pentru interiorul cardului de blog */
    .blog-card-body {
        padding: 20px !important;
    }

    .blog-card-title {
        font-size: 1.25rem !important;
        margin-bottom: 10px;
    }

    .blog-card-excerpt {
        font-size: 0.9rem !important;
        margin-bottom: 20px;
    }

    /* Paginația pe mobil devine mai aerisită */
    .blog-pagination .page-numbers {
        padding: 10px 14px;
        margin: 4px 2px;
        font-size: 0.9rem;
    }
}

/* Ajustare suplimentară pentru telefoane foarte mici (ecrane < 480px) */
@media screen and (max-width: 480px) {
    .blog-main-title {
        font-size: 1.75rem !important;
    }
    
    .blog-card-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .blog-comments-count {
        font-size: 0.85rem;
    }
}

/* ==========================================================================
   X. STILIZARE ȘABLON ARTICOL (SINGLE POST) & COMENTARII DARK/NEON
   ========================================================================== */

/* 1. Structură și Tipografie în Articol */
.single-post .site-main {
    padding-top: 30px;
    padding-bottom: 60px;
}

/* Titlul articolului */
.single-post .entry-title {
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1.3;
    color: var(--text-light) !important;
    margin-bottom: 15px !important;
}

/* Meta date (Autor, Dată) */
.single-post .entry-meta, 
.single-post .entry-meta * {
    color: var(--text-muted) !important;
    font-size: 0.9rem;
}

/* Zona de conținut a textului */
.single-post .entry-content {
    color: var(--text-muted);
    font-size: 1.05rem;
    line-height: 1.7;
    margin-top: 30px;
}

/* Paragrafele să fie clar lizibile */
.single-post .entry-content p {
    margin-bottom: 24px !important;
    color: #e0e0e0; /* Un alb ușor stins pentru a nu obosi ochii la citit îndelungat */
}

/* Evidențieri cu Bold */
.single-post .entry-content strong, 
.single-post .entry-content b {
    color: var(--text-light) !important;
    font-weight: 600;
}

/* Stilizare Liste (Ordonate și Neordonate) care se vedeau lipite */
.single-post .entry-content ul, 
.single-post .entry-content ol {
    margin: 0 0 25px 25px !important;
    padding: 0 !important;
}

.single-post .entry-content li {
    margin-bottom: 10px;
    color: #e0e0e0;
}

/* Titluri din interiorul articolului (H2, H3) */
.single-post .entry-content h2, 
.single-post .entry-content h3 {
    color: var(--text-light) !important;
    margin-top: 40px !important;
    margin-bottom: 20px !important;
    font-weight: 600;
}

.single-post .entry-content h2 { font-size: 1.8rem; border-left: 3px solid var(--accent-neon); padding-left: 15px; }
.single-post .entry-content h3 { font-size: 1.4rem; }

/* Butoane din interiorul articolului */
.single-post .entry-content .wp-block-button__link,
.single-post .entry-content a.btn,
.single-post .entry-content a[href*="cursuri"] {
    background-color: var(--accent-neon) !important;
    color: var(--bg-main) !important;
    font-weight: 600;
    padding: 12px 28px;
    border-radius: 4px;
    transition: all 0.2s ease;
    display: inline-block;
    text-decoration: none;
}

.single-post .entry-content .wp-block-button__link:hover {
    transform: scale(1.02);
    box-shadow: 0 0 15px var(--accent-neon);
}

/* Paginație între articole (Next/Previous) */
.single-post .navigation.post-navigation {
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
    padding: 20px 0;
    margin: 40px 0;
}

.single-post .navigation.post-navigation .nav-links a {
    color: var(--accent-neon) !important;
    font-weight: 500;
}

/* ==========================================================================
   2. Sectiunea de Comentarii WordPress Nativă (Reparare fundaluri albe)
   ========================================================================== */
#comments {
    margin-top: 50px;
    padding-top: 30px;
    border-top: 1px solid var(--border-color);
}

/* Titlul "1 thought on..." */
.comments-title {
    font-size: 1.5rem;
    color: var(--text-light) !important;
    margin-bottom: 30px;
}

/* Lista de comentarii existente */
.comment-list, .ast-comment-list {
    list-style: none;
    margin: 0 0 40px 0;
    padding: 0;
}

.comment-list .comment-body, .ast-comment-list .comment-body {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    padding: 20px;
    border-radius: 6px;
    margin-bottom: 20px;
}

.comment-meta .comment-author .fn {
    color: var(--text-light);
    font-weight: 600;
    font-style: normal;
}

.comment-metadata a {
    color: var(--text-muted) !important;
    font-size: 0.85rem;
}

.comment-content p {
    color: #e0e0e0 !important;
    margin: 10px 0 0 0 !important;
}

/* Formularul de adăugare comentariu (Leave a Comment) */
.comment-respond {
    background: rgba(29, 20, 18, 0.2);
    border: 1px solid var(--border-color);
    padding: 30px;
    border-radius: 8px;
    margin-top: 40px;
}

.reply-title {
    font-size: 1.4rem;
    color: var(--text-light) !important;
    margin-bottom: 20px !important;
}

.comment-notes, .logged-in-as {
    color: var(--text-muted);
    font-size: 0.9rem;
    margin-bottom: 20px;
}

.logged-in-as a {
    color: var(--accent-neon);
}

/* Eliminare fundal alb din caseta text (Textarea) și Inputuri */
.comment-form textarea, 
.comment-form input[type="text"], 
.comment-form input[type="email"], 
.comment-form input[type="url"] {
    width: 100%;
    background: #111111 !important; /* Fundal închis */
    border: 1px solid var(--border-color) !important;
    color: var(--text-light) !important; /* Text alb */
    padding: 14px;
    border-radius: 4px;
    font-family: 'Inter', sans-serif;
    margin-bottom: 15px;
}

.comment-form textarea:focus, 
.comment-form input:focus {
    outline: none;
    border-color: var(--accent-neon) !important;
}

/* Butonul de trimitere comentariu (Post Comment) */
.comment-form .submit,
#submit {
    background: var(--accent-neon) !important;
    color: var(--bg-main) !important;
    font-weight: 600 !important;
    border: none !important;
    padding: 12px 28px !important;
    border-radius: 4px !important;
    cursor: pointer;
    transition: all 0.2s ease;
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 0.5px;
}

#submit:hover {
    transform: scale(1.02);
    box-shadow: 0 0 15px var(--accent-neon);
}

/* ==========================================================================
   3. OPTIMIZĂRI RESPONSIVE PENTRU MOBIL (SINGLE POST)
   ========================================================================== */
@media screen and (max-width: 768px) {
    .single-post .entry-title {
        font-size: 1.85rem; /* Titlu mai compact pe telefon */
        line-height: 1.3;
    }

    .single-post .entry-content {
        font-size: 0.95rem; /* Text fin ajustat */
    }

    .single-post .entry-content h2 {
        font-size: 1.4rem;
    }

    .comment-respond {
        padding: 20px 15px; /* Spațiu intern mai mic pe ecrane înguste */
    }

    .comments-title {
        font-size: 1.25rem;
    }
}

/* ==========================================================================
   X. REFACTORIZARE COMPLETĂ SINGLE POST (ARTICOLE) & COMENTARII
   ========================================================================== */

/* 1. Resetare și Aliniere Container Principal */
.single-post #primary {
    background-color: var(--bg-main) !important;
    padding-top: 40px !important;
    padding-bottom: 60px !important;
    min-height: auto !important;
}

/* Limităm lățimea articolului pe desktop pentru o citire confortabilă (tip trading blog) */
.single-post #main,
.single-post .site-main {
    max-width: 900px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    float: none !important;
}

/* Împachetarea articolului într-o structură curată */
.single-post article.post {
    background: transparent !important;
    border: none !important;
    margin-bottom: 40px !important;
}

/* 2. Zona de Titlu și Meta Date (Așezare sub Header-ul global) */
.single-post .entry-header {
    margin-bottom: 30px !important;
    padding: 0 !important;
    text-align: left !important;
}

.single-post h1.entry-title {
    font-size: 2.6rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    color: var(--text-light) !important;
    margin: 0 0 15px 0 !important;
    text-transform: none !important;
}

.single-post .entry-meta,
.single-post .entry-meta * {
    color: var(--text-muted) !important;
    font-size: 0.9rem !important;
    font-family: 'Inter', sans-serif !important;
}

.single-post .entry-meta a:hover {
    color: var(--accent-neon) !important;
}

/* 3. Structură Conținut Text (Suprascriere Astra & Elementor Blocks) */
.single-post .entry-content {
    background: var(--bg-card) !important; /* Creăm un fundal tip card pentru articol */
    border: 1px solid var(--border-color) !important;
    border-radius: 8px !important;
    padding: 40px !important;
    color: #e0e0e0 !important;
    font-size: 1.05rem !important;
    line-height: 1.75 !important;
}

/* Resetăm eventualele lățimi forțate de Elementor în interiorul articolului */
.single-post .entry-content .elementor-section,
.single-post .entry-content .elementor-container {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Paragrafe, Liste și Titluri Interioare */
.single-post .entry-content p {
    margin-bottom: 24px !important;
    color: #e0e0e0 !important;
}

.single-post .entry-content strong,
.single-post .entry-content b {
    color: var(--text-light) !important;
    font-weight: 600 !important;
}

/* Stilizare liste (ol/ul) care apăreau distorsionate */
.single-post .entry-content ul,
.single-post .entry-content ol,
.single-post .entry-content .wp-block-list {
    margin: 0 0 25px 25px !important;
    padding: 0 !important;
}

.single-post .entry-content li {
    margin-bottom: 12px !important;
    color: #e0e0e0 !important;
}

/* Headings din interiorul textului */
.single-post .entry-content h2,
.single-post .entry-content h3 {
    color: var(--text-light) !important;
    font-weight: 600 !important;
    margin-top: 40px !important;
    margin-bottom: 20px !important;
}

.single-post .entry-content h2 {
    font-size: 1.75rem !important;
    border-left: 3px solid var(--accent-neon) !important;
    padding-left: 15px !important;
}

/* Butoane (Cum e cel de Cursuri din imagini) */
.single-post .entry-content a.e-button-base,
.single-post .entry-content .wp-block-button__link {
    background-color: var(--accent-neon) !important;
    color: var(--bg-main) !important;
    font-weight: 600 !important;
    padding: 12px 30px !important;
    border-radius: 4px !important;
    transition: all 0.2s ease-in-out !important;
    display: inline-block !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

.single-post .entry-content a.e-button-base:hover,
.single-post .entry-content .wp-block-button__link:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 0 15px var(--accent-neon) !important;
}

/* 4. Paginație între articole (Navigație Jos) */
.single-post .navigation.post-navigation {
    margin: 40px 0 !important;
    padding: 20px 0 !important;
    border-top: 1px solid var(--border-color) !important;
    border-bottom: 1px solid var(--border-color) !important;
}

.single-post .post-navigation .nav-links {
    display: flex !important;
    justify-content: space-between !important;
    gap: 20px !important;
}

.single-post .post-navigation a {
    color: var(--accent-neon) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
}

.single-post .post-navigation a:hover {
    text-decoration: underline !important;
}

/* 5. Zona de Comentarii (Corectare completă fundal alb) */
#comments.comments-area {
    margin-top: 50px !important;
    background: transparent !important;
    padding: 0 !important;
}

.comments-title {
    font-size: 1.6rem !important;
    color: var(--text-light) !important;
    margin-bottom: 30px !important;
    font-weight: 600 !important;
}

/* Listă comentarii existente */
.ast-comment-list, .comment-list {
    margin: 0 0 40px 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.ast-comment-list .comment-body, .comment-list .comment-body {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    padding: 25px !important;
    border-radius: 6px !important;
    color: #e0e0e0 !important;
}

/* Formularul "Leave a Comment" */
.comment-respond {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    padding: 35px !important;
    border-radius: 8px !important;
}

.reply-title {
    font-size: 1.4rem !important;
    color: var(--text-light) !important;
    margin-bottom: 20px !important;
}

.comment-form .logged-in-as, 
.comment-form .comment-notes {
    color: var(--text-muted) !important;
    font-size: 0.95rem !important;
    margin-bottom: 20px !important;
}

.comment-form .logged-in-as a {
    color: var(--accent-neon) !important;
}

/* Neutralizare inputuri albe forțate de Astra */
.comment-form textarea,
.comment-form input[type="text"],
.comment-form input[type="email"] {
    width: 100% !important;
    background-color: #111111 !important; /* Fundal închis */
    border: 1px solid var(--border-color) !important;
    color: var(--text-light) !important; /* Text alb în interior */
    padding: 14px !important;
    border-radius: 4px !important;
    font-family: 'Inter', sans-serif !important;
    box-sizing: border-box !important;
}

.comment-form textarea:focus,
.comment-form input:focus {
    outline: none !important;
    border-color: var(--accent-neon) !important;
}

/* Butonul "Post Comment" */
.comment-form input[type="submit"],
#submit {
    background: var(--accent-neon) !important;
    color: var(--bg-main) !important;
    font-weight: 600 !important;
    border: none !important;
    padding: 12px 30px !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-transform: uppercase !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.5px !important;
}

.comment-form input[type="submit"]:hover,
#submit:hover {
    box-shadow: 0 0 15px var(--accent-neon) !important;
    transform: scale(1.01) !important;
}

/* ==========================================================================
   6. OPTIMIZARE MULTI-DISPOZITIV (RESPONSIVE MOBIL)
   ========================================================================== */
@media screen and (max-width: 768px) {
    .single-post #primary {
        padding-top: 20px !important;
    }
    
    /* Îndepărtăm padding-ul mare pe mobil ca să câștigăm spațiu */
    .single-post .entry-content {
        padding: 20px !important;
        border-radius: 6px !important;
        font-size: 0.98rem !important;
    }

    .single-post h1.entry-title {
        font-size: 1.85rem !important;
        line-height: 1.3 !important;
    }

    .single-post .entry-content h2 {
        font-size: 1.4rem !important;
    }

    .comment-respond {
        padding: 25px 15px !important;
    }

    .single-post .post-navigation .nav-links {
        flex-direction: column !important;
        gap: 15px !important;
    }
}

/* ==========================================================================
   REMEDIERE GLOBALĂ SINGLE POST (ARTICOLE VECHI ȘI NOI)
   ========================================================================== */

/* 1. Spargem lățimea de 1200px și centrăm textul pe desktop */
.single-post #primary,
.single-post .site-main {
    max-width: 850px !important; /* Dimensiune optimă de citire pentru trading/blog */
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    float: none !important;
}

/* 2. Corectare padding-uri (Să nu mai fie 0px și textul să nu se lipească de ecran) */
.single-post .entry-content {
    padding-left: 25px !important;
    padding-right: 25px !important;
    padding-top: 20px !important;
    padding-bottom: 40px !important;
    box-sizing: border-box !important;
}

/* Reducem spațierea listelor care erau lipite în stânga */
.single-post .entry-content ul,
.single-post .entry-content ol {
    padding-left: 20px !important;
    margin-bottom: 20px !important;
}

/* 3. Îmblânzirea Flexbox-ului de pe Body (Lăsăm conținutul articolului să curgă nativ) */
.single-post article.post {
    display: block !important; 
    width: 100% !important;
}

/* 4. Neutralizarea variabilelor Astra pentru Comentarii (Adio fundal alb) */
.single-post {
    --ast-comment-inputs-background: var(--bg-card, #0d1412) !important;
}

#comments, .comment-respond {
    max-width: 850px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 25px !important;
    background: transparent !important;
}

/* Forțăm textul din interiorul casetelor de input să fie vizibil și fundalul închis */
.comment-form textarea,
.comment-form input[type="text"],
.comment-form input[type="email"] {
    background-color: #111111 !important;
    color: #ffffff !important;
    border: 1px solid var(--border-color, #262420) !important;
    padding: 12px !important;
    border-radius: 4px !important;
}

/* ==========================================================================
   OPTIMIZARE PENTRU MOBIL
   ========================================================================== */
@media screen and (max-width: 768px) {
    .single-post .entry-content {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    .single-post h1.entry-title {
        font-size: 1.8rem !important;
        padding: 0 15px !important;
    }
    
    #comments, .comment-respond {
        padding: 15px !important;
    }
}

/* Scoate titlul articolului din poziția fixă și îl readuce în fluxul paginii */
.single-post .entry-header.ast-no-thumbnail {
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    z-index: auto !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: transparent !important;
    padding: 0 0 20px 0 !important;
    margin-top: 20px !important;
}

/* ==========================================================================
   SECȚIUNE REZULTATE (SLIDER)
   ========================================================================== */
.results-section {
    padding-top: 60px;
    padding-bottom: 80px;
    text-align: center;
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.results-header h2 {
    font-size: 2.5rem;
    font-weight: 800;
    margin-bottom: 10px;
}

/* Container Wrapper pentru poziționarea săgeților */
.slider-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    padding: 0 10px;
}

/* Caruselul propriu-zis */
.results-slider {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    scroll-behavior: smooth;
    snap-type: x mandatory;
    scrollbar-width: none; /* Ascunde scrollbar pe Firefox */
    padding: 15px 5px;
    width: 100%;
}

/* Ascunde scrollbar pe Chrome, Safari, Opera */
.results-slider::-webkit-scrollbar {
    display: none;
}

/* Setări actualizate pentru carduri - Înălțime fixă și aliniere perfectă */
.slide-item {
    flex: 0 0 calc(20% - 16px); /* Rămâne neschimbat pentru ecrane mari (5 pe rând) */
    snap-align: start;
    background: var(--bg-card);
    border: 1px solid var(--vasika-border, #1f1d16);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0,0,0,0.2);
    transition: transform 0.3s ease;
    
    /* MODIFICARE CONCRETĂ: Forțăm o înălțime fixă pentru toate cardurile */
    height: 400px; 
    display: flex;
    align-items: center;
    justify-content: center;
}

.slide-item:hover {
    transform: translateY(-5px);
}

/* Modificări pentru imagini - Elimină spațiul gol și umple cardul */
.slide-item img {
    width: 100%;
    height: 100%; /* Forțează imaginea să ocupe toată înălțimea cardului de 400px */
    display: block;
    
    /* MODIFICARE CONCRETĂ: "cover" taie inteligent marginile lungi fără să deformeze screenshot-ul, 
       iar "top" sau "center" alege zona de unde se face încadrarea */
    object-fit: cover; 
    object-position: center top; 
}

/* Stiluri pentru butoanele de navigare (Săgeți) */
.slider-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.7);
    border: 1px solid var(--accent-neon);
    color: var(--accent-neon);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    font-size: 1.2rem;
    cursor: pointer;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.slider-arrow:hover {
    background: var(--accent-neon);
    color: #000;
}

.prev-arrow { left: -20px; }
.next-arrow { right: -20px; }

/* ==========================================================================
   OPTIMIZĂRI RESPONSIVE (Mobil & Tabletă)
   ========================================================================== */

/* Tablete sau ecrane medii: Afișează 3 imagini simultan */
@media (max-width: 1024px) {
    .slide-item {
        flex: 0 0 calc(33.333% - 14px);
        height: 380px; /* Reducem ușor înălțimea pe tabletă pentru aspect proporțional */
    }
    .prev-arrow { left: -5px; }
    .next-arrow { right: -5px; }
}

/* Telefoane mobile: Afișează 1 imagine completă și o parte din următoarea (pentru a invita la swipe) */
@media (max-width: 600px) {
    .results-header h2 {
        font-size: 2rem;
    }
    
    .slide-item {
        flex: 0 0 82%; 
        height: 420px; /* Pe mobil mărim puțin înălțimea deoarece ecranele sunt lunguiețe și screenshot-urile de telefon vor arăta mult mai bine complet extinse */
    }
    
    /* Pe mobil săgețile pot încurca la atingere, le ascundem deoarece există swipe nativ cu degetul */
    .slider-arrow {
        display: none;
    }
    
    .results-slider {
        gap: 15px;
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* ==========================================================================
   SECȚIUNE REZULTATE (CARUSEL OPTIMIZAT CU FIX ȘI LIGHTBOX)
   ========================================================================== */
.results-section {
    padding-top: 60px;
    padding-bottom: 80px;
    text-align: center;
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.results-header h2 {
    font-size: 2.5rem;
    font-weight: 800;
    margin-bottom: 10px;
}

.slider-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    padding: 0 10px;
}

.results-slider {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    scroll-behavior: smooth;
    snap-type: x mandatory;
    scrollbar-width: none;
    padding: 15px 5px;
    width: 100%;
}

.results-slider::-webkit-scrollbar {
    display: none;
}

/* Cardurile individuale cu înălțime fixă și fundal curat */
.slide-item {
    flex: 0 0 calc(20% - 16px);
    snap-align: start;
    background: #111111; /* Uniformizează golurile imaginilor cu rezoluție mică */
    border: 1px solid var(--vasika-border, #1f1d16);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0,0,0,0.3);
    transition: transform 0.3s ease, border-color 0.3s ease;
    
    height: 450px; /* Aliniere perfectă la linie pe orizontală */
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: zoom-in;
}

.slide-item:hover {
    transform: translateY(-5px);
    border-color: var(--accent-neon);
}

/* Imaginile se adaptează complet (contain) fără distorsionări sau zoom excesiv */
.slide-item img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain; 
    padding: 12px; 
}

/* Săgeți de control */
.slider-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.75);
    border: 1px solid var(--accent-neon);
    color: var(--accent-neon);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    font-size: 1.2rem;
    cursor: pointer;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.slider-arrow:hover {
    background: var(--accent-neon);
    color: #000;
}

.prev-arrow { left: -20px; }
.next-arrow { right: -20px; }

/* --- STILURI MODAL (ECRAN COMPLET LA CLICK) --- */
.results-modal {
    display: none;
    position: fixed;
    z-index: 99999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.95);
    align-items: center;
    justify-content: center;
    cursor: zoom-out;
}

.results-modal-content {
    max-width: 90%;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 0 25px rgba(0, 234, 167, 0.25);
    animation: zoomAnimation 0.2s ease-out;
}

.results-modal-close {
    position: absolute;
    top: 20px;
    right: 30px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
}

@keyframes zoomAnimation {
    from { transform: scale(0.92); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

/* --- ADAPTARE MOBIL ȘI TABLETĂ --- */
@media (max-width: 1024px) {
    .slide-item { 
        flex: 0 0 calc(33.333% - 14px); 
        height: 380px; 
    }
    .prev-arrow { left: -5px; }
    .next-arrow { right: -5px; }
}

@media (max-width: 600px) {
    .slide-item { 
        flex: 0 0 82%; 
        height: 420px; 
    }
    .slider-arrow { 
        display: none; /* Swipe nativ pe mobil */
    }
    .results-slider {
        gap: 15px;
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* ==========================================================================
   SECȚIUNE MENTOR (VERSIUNEA CU TITLU SUS ȘI IMAGINE MARE)
   ========================================================================== */
.mentor-section {
    padding-top: 80px;
    padding-bottom: 100px;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

/* Zona de Titlu deasupra imaginii și textului */
.mentor-header {
    margin-bottom: 40px;
    text-align: left; /* Aliniat curat cu restul textului */
}

.mentor-title {
    font-size: 3.5rem; /* Titlu masiv, de impact vizual */
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 5px;
    color: #ffffff;
}

.mentor-subtitle {
    display: block;
    color: var(--accent-neon);
    font-size: 1.1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

/* Alinierea pe două coloane sub titlu */
.mentor-grid {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr; /* Oferă prioritate vizuală imaginii mari landscape */
    gap: 50px;
    align-items: flex-start; /* Aliniază elementele de sus în jos */
}

/* Containerul Imaginii - Extins pentru rezoluția ta */
.mentor-image-container {
    width: 100%;
}

.mentor-image-wrapper {
    position: relative;
    width: 100%;
    max-width: 620px; /* Am mărit lățimea pentru a afișa perfect formatul 1223x864 */
    border-radius: 20px;
    background: var(--bg-card, #0d1412);
    padding: 10px;
    border: 1px solid var(--vasika-border, #1f1d16);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
}

.mentor-image-wrapper::before {
    content: '';
    position: absolute;
    top: -2px; left: -2px; right: -2px; bottom: -2px;
    background: linear-gradient(135deg, var(--accent-neon), transparent 60%);
    border-radius: 22px;
    z-index: -1;
    opacity: 0.5;
}

.mentor-image-wrapper img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 12px;
    object-fit: cover;
}

/* Zona de text descriptiv */
.mentor-text p {
    color: var(--text-light, #ffffff);
    font-size: 1.05rem;
    line-height: 1.7;
    margin-bottom: 20px;
    opacity: 0.95;
}

.mentor-text p.highlight-p {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.6;
    border-left: 3px solid var(--accent-neon);
    padding-left: 15px;
    margin-bottom: 25px;
}

.green-accent {
    color: #00C9A7;
    font-weight: 700;
}

.mentor-text blockquote {
    font-style: italic;
    font-size: 1.1rem;
    color: var(--accent-neon);
    background: rgba(0, 201, 167, 0.04);
    border: 1px dashed rgba(0, 201, 167, 0.25);
    padding: 20px;
    border-radius: 10px;
    margin: 25px 0;
    line-height: 1.6;
}

/* ==========================================================================
   OPTIMIZĂRI PENTRU MOBIL ȘI TABLETĂ
   ========================================================================== */
@media (max-width: 1024px) {
    .mentor-title { font-size: 2.8rem; }
    .mentor-grid { grid-template-columns: 1fr; gap: 40px; } /* Trece în mod listă pe tablete */
}

@media (max-width: 768px) {
    .mentor-section { padding-top: 50px; padding-bottom: 60px; }
    .mentor-title { font-size: 2.3rem; }
    .mentor-subtitle { font-size: 0.95rem; }
    .mentor-image-wrapper { max-width: 100%; padding: 6px; }
    .mentor-text p { font-size: 1rem; }
}

/* ==========================================================================
   STILIZARE CORECTĂ ȘI CURATĂ PENTRU BLOG (ASTRA-CHILD)
   ========================================================================== */

/* Centrăm și limităm lățimea articolului pentru citire ușoară */
.single-post #primary {
    max-width: 800px !important;
    margin: 40px auto !important;
    padding: 0 20px !important;
    float: none !important;
}

/* Fundalul general al paginii de articol (Dark mode-ul tău) */
.single-post, 
.single-post .site-content {
    background-color: var(--bg-main, #0a0a0a) !important;
    color: var(--text-light, #ffffff) !important;
}

/* Spațierea textului din articol */
.single-post .entry-content p {
    font-size: 1.1rem !important;
    line-height: 1.75 !important;
    margin-bottom: 25px !important;
    color: #e0e0e0 !important;
}

/* Stilizare titluri din interiorul articolului (H2, H3) */
.single-post .entry-content h2,
.single-post .entry-content h3 {
    color: #ffffff !important;
    margin-top: 40px !important;
    margin-bottom: 20px !important;
    font-weight: 600 !important;
}

/* Reparăm listele care înainte se lipeau de margini */
.single-post .entry-content ul,
.single-post .entry-content ol {
    margin: 0 0 25px 30px !important;
    padding: 0 !important;
}

.single-post .entry-content li {
    margin-bottom: 10px !important;
    color: #e0e0e0 !important;
}

/* Zona de comentarii - preia stilul curat de lățime */
.single-post #comments {
    max-width: 800px !important;
    margin: 50px auto 0 auto !important;
    padding: 0 20px !important;
}

/* ==========================================================================
   STRUCTURĂ INDEPENDENTĂ BLOG COMPLET CONTROLATĂ
   ========================================================================== */

/* Containerul mare de fundal - preia tema ta dark mode */
#vasika-independent-blog-container {
    background-color: #0a0a0a !important;
    min-height: 100vh;
    padding: 60px 20px;
    box-sizing: border-box;
}

/* Limităm lățimea textului pe centru exact ca un layout premium de trading */
.vasika-blog-wrapper {
    max-width: 800px !important;
    margin: 0 auto !important;
}

/* Stilizare Titlu */
.vasika-post-header {
    margin-bottom: 30px;
}

.vasika-post-title {
    font-size: 2.5rem !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    line-height: 1.3 !important;
    margin-bottom: 10px !important;
}

.vasika-post-meta {
    color: #9c9990 !important;
    font-size: 0.9rem;
}

/* Stilizare Imagine */
.vasika-post-thumbnail {
    margin-bottom: 35px;
    border-radius: 8px;
    overflow: hidden;
}
.vasika-post-thumbnail img {
    width: 100%;
    height: auto;
    display: block;
}

/* Corpul textului din articol (Paragrafe și Elemente Gutenberg) */
.vasika-post-content {
    color: #ffffff !important;
    font-size: 1.1rem !important;
    line-height: 1.8 !important;
}

.vasika-post-content p {
    margin-bottom: 25px !important;
}

.vasika-post-content h2 {
    font-size: 1.8rem !important;
    color: #ffffff !important;
    margin-top: 40px !important;
    margin-bottom: 20px !important;
    font-weight: 600 !important;
}

.vasika-post-content h3 {
    font-size: 1.4rem !important;
    color: #ffffff !important;
    margin-top: 30px !important;
    margin-bottom: 15px !important;
    font-weight: 600 !important;
}

/* Liste curat aliniate */
.vasika-post-content ul, 
.vasika-post-content ol {
    margin: 0 0 30px 25px !important;
    padding: 0 !important;
}

.vasika-post-content li {
    margin-bottom: 12px !important;
}

/* Fixare ZONĂ COMENTARII (Neutralizare Fundal Alb Astra) */
.vasika-comments-section {
    margin-top: 60px;
    border-top: 1px solid #1f1d16;
    padding-top: 40px;
}

.vasika-comments-section input[type="text"],
.vasika-comments-section input[type="email"],
.vasika-comments-section textarea {
    background-color: #111111 !important;
    color: #ffffff !important;
    border: 1px solid #1f1d16 !important;
    padding: 14px !important;
    border-radius: 4px !important;
    width: 100%;
}

/* Butonul de trimitere comentariu */
.vasika-comments-section input[type="submit"] {
    background-color: #00C9A7 !important; /* Culoarea ta neon */
    color: #0a0a0a !important;
    font-weight: 600 !important;
    border: none !important;
    padding: 12px 28px !important;
    border-radius: 4px !important;
    cursor: pointer;
}

.blog-card-excerpt {
    /* 1. Forțează ruperea cuvintelor care nu au spații (ca în exemplul tău) */
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-all !important; /* Opțional, dacă vrei să taie fix la margine */

    /* 2. Limitează la un anumit număr de rânduri și pune puncte puncte (...) */
    display: -webkit-box !important;
    -webkit-line-clamp: 3; /* Afișează doar 3 rânduri de text */
    -webkit-box-orient: vertical;
    overflow: hidden;
    
    /* 3. Estetică */
    height: 4.8em; /* Ajustează înălțimea în funcție de line-height (aprox 3 rânduri) */
    margin-bottom: 20px !important;
}

/* Forțare text alb pentru numele celui care comentează */
.vasika-comments-section .comment-author cite,
.vasika-comments-section .comment-author .fn,
.vasika-comments-section .comment-author .fn a {
    color: #ffffff !important;
    font-style: normal !important;
    font-weight: 600 !important;
    font-size: 1.1rem !important;
}

/* Opțional: Schimbăm și culoarea textului "says" / "a spus" dacă e vizibil */
.vasika-comments-section .comment-metadata a {
    color: #a0a0a0 !important;
}

/* 1. Reparăm suprapunerea cu footer-ul */
#vasika-independent-blog-container {
    display: table !important; /* Forțează containerul să cuprindă tot conținutul float-uit */
    width: 100% !important;
    padding-bottom: 150px !important; /* Spațiu masiv de siguranță */
    margin-bottom: 0 !important;
}

.site-footer-global {
    clear: both !important;
    position: relative !important;
    z-index: 99 !important;
    margin-top: 0 !important; /* Elimină orice încercare a footerului de a urca */
}

/* 2. Reparăm vizibilitatea numelui (dacă PHP-ul îl randează dar e ascuns) */
.comment-author .fn, 
.comment-author cite,
.comment-details b {
    display: inline-block !important;
    visibility: visible !important;
    color: #ffffff !important;
    min-width: 10px;
    min-height: 10px;
}

/* ==========================================================================
   OPTIMIZARE COMPLETĂ MOBIL (MEDIA QUERIES < 768px)
   ========================================================================== */
@media screen and (max-width: 768px) {
    
    /* --- PAGINA BLOG.PHP (GRID-UL DE CARDURI) --- */
    
    .blog-custom-wrapper {
        padding: 20px 12px !important; /* Spațiu mai mic pe marginile ecranului */
    }

    .blog-main-title {
        font-size: 1.8rem !important; /* Titlu mai compact, să nu se rupă urât */
        line-height: 1.2 !important;
    }

    .blog-subtitle {
        font-size: 1rem;
        margin-bottom: 20px;
    }

    .blog-posts-grid {
        grid-template-columns: 1fr !important; /* Forțăm un singur card pe rând */
        gap: 20px !important;
    }

    .blog-card-image img, 
    .blog-card-placeholder {
        height: 160px; /* Imagini puțin mai scunde pe mobil ca să nu ocupe tot ecranul */
    }

    .blog-card-body {
        padding: 15px; /* Padding mai strâns în interiorul cardului */
    }

    .blog-card-title {
        font-size: 1.2rem !important;
    }

    .blog-meta-wrapper {
        flex-wrap: wrap; /* Dacă numele sau data sunt lungi, trec frumos pe rândul următor */
        gap: 8px;
        font-size: 0.8rem;
    }


    /* --- PAGINA SINGLE-BLOG_INDEPENDENT.PHP (ARTICOLUL) --- */

    #vasika-independent-blog-container {
        padding: 30px 10px !important; /* Lăsăm textul să respire, dar fără margini uriașe */
        padding-bottom: 80px !important; /* Spațiul tampon pentru footer pe mobil */
    }

    .vasika-post-title {
        font-size: 1.75rem !important; /* Titlul articolului se micșorează proporțional */
        line-height: 1.3 !important;
    }

    .vasika-post-content {
        font-size: 1rem !important; /* Text ușor mai mic, ideal pentru citit pe telefon */
        line-height: 1.7 !important;
    }

    /* Ajustăm imaginile din interiorul articolului să nu iasă din ecran */
    .vasika-post-content img {
        max-width: 100% !important;
        height: auto !important;
        border-radius: 4px;
    }

    /* Tabelele de analiză sau graficele devin glisabile pe orizontală (nu mai sparg layout-ul) */
    .vasika-post-content table {
        display: block !important;
        width: 100% !important;
        overflow-x: auto !important;
        white-space: nowrap;
    }


    /* --- ZONA DE COMENTARII PE MOBIL --- */

    .vasika-comments-section {
        margin-top: 40px;
        padding-top: 20px;
    }

    /* Comentariile lăsate de utilizatori se strâng puțin */
    .comment-list {
        padding-left: 0 !important; /* Eliminăm indentarea listei pe mobil */
        list-style: none;
    }

    /* Răspunsurile la comentarii (replies) nu mai merg mult în dreapta, altfel devin prea înguste */
    .comment-list .children {
        padding-left: 15px !important;
        margin-left: 5px !important;
        border-left: 1px solid #1f1d16;
    }

    .comment-body {
        padding: 12px !important;
    }

    /* Formularul de input ocupă tot ecranul pe telefon */
    .comment-form-author, 
    .comment-form-email, 
    .comment-form-url {
        width: 100% !important;
        float: none !important;
        margin-right: 0 !important;
    }
}

/* ==========================================================================
   BLOCARE IMPLEMENTĂRI AUTOMATE ASTRA (PENTRU MOBIL ȘI DESKTOP)
   ========================================================================== */

/* Ascundem complet headerul nativ de articol al temei Astra din această pagină */
#vasika-independent-blog-container .entry-header,
#vasika-independent-blog-container .ast-single-post-order,
.single-blog_independent .site-content .entry-header {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;
}

/* --- OPTIMIZARE REZISTENTĂ PENTRU MOBIL (< 768px) --- */
@media screen and (max-width: 768px) {
    
    #vasika-independent-blog-container {
        padding: 20px 14px !important;
        padding-bottom: 60px !important;
    }

    .vasika-blog-wrapper {
        width: 100% !important;
        max-width: 100% !important;
    }

    .vasika-post-title {
        font-size: 1.8rem !important;
        line-height: 1.3 !important;
        margin-bottom: 8px !important;
    }

    .vasika-post-meta {
        font-size: 0.85rem !important;
        color: #9c9990 !important;
        margin-bottom: 20px !important;
    }

    .vasika-post-thumbnail {
        margin-bottom: 20px !important;
        border-radius: 6px !important;
    }

    .vasika-post-content {
        font-size: 1.05rem !important;
        line-height: 1.65 !important;
    }
    
    .vasika-post-content p {
        margin-bottom: 18px !important;
    }
}
header.ast-comment-meta.ast-row.ast-comment-author.capitalize {
    display: none !important;
}

#ast-scroll-top {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Targetează containerul principal al editorului Gutenberg */
.editor-styles-wrapper {
    background-color: #ffffff !important;
}

/* Forțează fundalul alb pe toate structurile posibile ale editorului text */
.editor-styles-wrapper,
.editor-styles-wrapper .block-editor-writing-flow,
.editor-styles-wrapper .wp-block-post-title,
div.block-editor-block-list__layout {
    background-color: #ffffff !important;
    background: #ffffff !important;
}

/* Opțional: dacă textul era alb și acum nu se mai vede pe fundalul alb, îl facem negru */
.editor-styles-wrapper, 
.editor-styles-wrapper p, 
.editor-styles-wrapper h1, 
.editor-styles-wrapper h2 {
    color: #000000 !important;
}


/* --- STILURI CUSTOM ACCORDEON MENTORAT --- */

.mentorat-accordion {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
    background-color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}

.mentorat-accordion-item {
    border-bottom: 1px solid #e2e8f0;
}

.mentorat-accordion-item:last-child {
    border-bottom: none;
}

.mentorat-accordion-toggle {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 24px;
    background-color: #f8fafc;
    border: none;
    outline: none;
    cursor: pointer;
    text-align: left;
    transition: background-color 0.2s ease;
}

.mentorat-accordion-toggle:hover {
    background-color: #f1f5f9;
}

.mentorat-video-title {
    font-size: 16px;
    font-weight: 600;
    color: #1e293b;
}

.mentorat-video-date {
    font-size: 14px;
    color: #64748b;
    background: #e2e8f0;
    padding: 4px 10px;
    border-radius: 20px;
    font-weight: 500;
}

/* Săgeata indicator / Schimbare stare */
.mentorat-accordion-toggle::after {
    content: '\25BC'; /* Săgeată în jos */
    font-size: 12px;
    color: #64748b;
    margin-left: 15px;
    transition: transform 0.3s ease;
}

.mentorat-accordion-toggle.active::after {
    transform: rotate(-180deg);
}

/* Conținutul ascuns implicit */
.mentorat-accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out, padding 0.3s ease;
    background-color: #ffffff;
    padding: 0 24px;
}

/* Clasa adăugată din JS pentru deschidere */
.mentorat-accordion-content.open {
    padding: 24px;
    max-height: 1000px; /* Valoare suficientă pentru a cuprinde playerul video */
}

/* Responsivitate Video Wrapper (16:9 Aspect Ratio) */
.mentorat-video-wrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
    overflow: hidden;
    border-radius: 6px;
    background: #000;
}

.mentorat-video-wrapper iframe,
.mentorat-video-wrapper object,
.mentorat-video-wrapper embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Notificări/Alerte */
.mentorat-notice {
    padding: 20px;
    border-radius: 6px;
    text-align: center;
    font-size: 16px;
}
.mentorat-notice.alert {
    background-color: #fef3c7;
    border-left: 4px solid #d97706;
    color: #92400e;
}
.mentorat-notice.error {
    background-color: #fee2e2;
    border-left: 4px solid #dc2626;
    color: #991b1b;
}

/* Stiluri personalizate pentru Sesiunile 1-on-1 din Dashboard-ul Tutor LMS */

.video-embed-wrapper-custom {
    position: relative;
    padding-bottom: 56.25%; /* Păstrează proporția standard 16:9 */
    height: 0;
    overflow: hidden;
    max-width: 100%;
    background-color: #000;
    border-radius: 8px;
}

.video-embed-wrapper-custom iframe, 
.video-embed-wrapper-custom object, 
.video-embed-wrapper-custom embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Protecție vizuală simplă pe playerul HTML5 */
video::-internal-media-controls-download-button {
    display:none;
}
video::-webkit-media-controls-enclosure {
    overflow:hidden;
}
video::-webkit-media-controls-panel {
    width: calc(100% + 30px); /* Ascunde butonul nativ de download în unele browsere */
}