/* ==========================================================================
   ARCHÍV NOVINIEK (news.php)
   ========================================================================== */
.archive-page { max-width: 1200px; margin: 0 auto 80px auto; padding: 0 20px; }
.archive-header { text-align: center; margin-bottom: 50px; }
.archive-header h1 { font-size: 42px; font-weight: 800; color: white; margin: 0 0 10px 0; text-transform: uppercase; }
.archive-header h1 span { color: #f97316; }
.archive-header p { color: #a1a1aa; font-size: 16px; }

.archive-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 30px; }

.archive-card { 
    background: #121214; 
    border: 1px solid rgba(255,255,255,0.05); 
    border-radius: 12px; 
    overflow: hidden; 
    text-decoration: none; 
    transition: 0.3s ease; 
    display: flex; 
    flex-direction: column; 
}

/* Prvý článok je väčší, bez akýchkoľvek mätúcich nápisov */
.archive-card.featured-card { 
    grid-column: 1 / -1; 
    flex-direction: row; 
    align-items: center; 
    background: #18181b;
    border-color: rgba(249, 115, 22, 0.2);
}

.archive-card:hover { 
    border-color: #f97316; 
    transform: translateY(-5px); 
    box-shadow: 0 10px 30px rgba(0,0,0,0.4); 
}

.ac-img-wrapper { width: 100%; height: 220px; overflow: hidden; position: relative; border-bottom: 1px solid rgba(255,255,255,0.05); }
.archive-card.featured-card .ac-img-wrapper { width: 50%; height: 100%; min-height: 350px; border-bottom: none; border-right: 1px solid rgba(255,255,255,0.05); }

.ac-img { width: 100%; height: 100%; object-fit: cover; transition: 0.5s ease; }
.archive-card:hover .ac-img { transform: scale(1.05); }

.ac-content { padding: 30px; display: flex; flex-direction: column; flex: 1; }
.archive-card.featured-card .ac-content { padding: 50px; }

.ac-meta { display: flex; gap: 20px; font-size: 11px; text-transform: uppercase; font-weight: 700; color: #a1a1aa; margin-bottom: 15px; }
.ac-meta i { color: #f97316; margin-right: 6px; }

.ac-title { font-size: 22px; color: white; margin: 0 0 15px 0; font-weight: 800; line-height: 1.3; transition: 0.2s; }
.archive-card.featured-card .ac-title { font-size: 36px; }
.archive-card:hover .ac-title { color: #f97316; }

.ac-excerpt { color: #71717a; font-size: 14px; line-height: 1.6; margin-bottom: 25px; flex: 1; }

.ac-btn { 
    font-size: 11px; 
    font-weight: 800; 
    color: white; 
    text-transform: uppercase; 
    display: flex; 
    align-items: center; 
    gap: 8px; 
    transition: 0.2s; 
    background: rgba(255,255,255,0.05);
    padding: 10px 20px;
    border-radius: 6px;
    width: fit-content;
}
.archive-card:hover .ac-btn { background: #f97316; }

.empty-archive { text-align: center; padding: 60px; border: 1px dashed rgba(255,255,255,0.1); border-radius: 12px; }
.empty-archive i { font-size: 40px; color: #f97316; margin-bottom: 15px; }
.empty-archive h3 { color: white; margin-bottom: 10px; }

/* ==========================================================================
   STABILNÝ DETAIL ČLÁNKU (news_view.php)
   ========================================================================== */
.clean-article-page { width: 100%; padding: 0 20px; }

/* Pevný box, ktorý drží článok pekne v strede */
.clean-article-wrapper { 
    max-width: 900px; 
    margin: 0 auto; 
    background: #18181b; 
    border: 1px solid rgba(255,255,255,0.05); 
    border-radius: 12px; 
    padding: 50px; 
    box-shadow: 0 10px 30px rgba(0,0,0,0.3); 
}

.clean-back-btn { display: inline-flex; align-items: center; gap: 8px; color: #a1a1aa; text-decoration: none; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-bottom: 40px; transition: 0.2s; }
.clean-back-btn:hover { color: white; transform: translateX(-5px); }

.clean-article-header { margin-bottom: 40px; text-align: center; }

.clean-meta { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 20px; font-size: 12px; color: #a1a1aa; font-weight: 600; text-transform: uppercase; margin-bottom: 25px; }
.clean-tag { background: rgba(249, 115, 22, 0.1); color: #f97316; padding: 5px 12px; border-radius: 4px; border: 1px solid rgba(249, 115, 22, 0.3); }
.clean-meta i { color: #f97316; margin-right: 6px; }

.clean-title { font-size: 42px; font-weight: 800; color: white; line-height: 1.2; margin: 0; }

.clean-hero-wrapper { width: 100%; margin-bottom: 50px; border-radius: 8px; overflow: hidden; border: 1px solid rgba(255,255,255,0.05); }
.clean-hero-img { width: 100%; height: auto; max-height: 450px; display: block; object-fit: cover; }

/* Textový obsah z databázy */
.clean-article-content { font-size: 17px; line-height: 1.8; color: #d4d4d8; }
.clean-article-content p { margin-bottom: 25px; }
.clean-article-content h2 { font-size: 28px; color: white; margin: 40px 0 20px 0; font-weight: 700; }
.clean-article-content h3 { font-size: 22px; color: white; margin: 30px 0 15px 0; font-weight: 700; }
.clean-article-content a { color: #f97316; text-decoration: none; }
.clean-article-content a:hover { text-decoration: underline; }
.clean-article-content ul, .clean-article-content ol { margin-bottom: 25px; padding-left: 20px; }
.clean-article-content li { margin-bottom: 10px; }

/* Obrázky v obsahu článku — nikdy nepretekajú */
.clean-article-content img {
    max-width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;
    margin: 20px 0;
}

/* Tabuľky a iné wide elementy */
.clean-article-content table,
.clean-article-content pre,
.clean-article-content iframe {
    max-width: 100%;
    overflow-x: auto;
    display: block;
}

/* Zabraňuje pretekaniu celej stránky */
.clean-article-page { overflow-x: hidden; }
.clean-article-wrapper { overflow-x: hidden; }

@media (max-width: 768px) {
    .archive-card.featured-card { flex-direction: column; }
    .archive-card.featured-card .ac-img-wrapper { width: 100%; height: 200px; border-right: none; border-bottom: 1px solid rgba(255,255,255,0.05); }

    .clean-article-page { padding: 0 12px; }
    .clean-article-wrapper { padding: 24px 16px; border-radius: 8px; }
    .clean-title { font-size: 26px; line-height: 1.25; }
    .clean-meta { gap: 10px; font-size: 11px; }
    .clean-article-content { font-size: 16px; }
    .clean-article-content h2 { font-size: 22px; }
    .clean-article-content h3 { font-size: 18px; }
    .clean-back-btn { margin-bottom: 24px; }
    .clean-hero-wrapper { margin-bottom: 30px; }
}