/* =========================================
   Dbazi Magazine Archive - Optimized V3 (CLS & Access Fixed)
   ========================================= */

.magazine-archive-new {
    direction: rtl;
    text-align: right;
    background-color: #f8f9fa;
    font-family: inherit;
}

/* --- Grid System --- */
.magazine-archive-new .dbazi-row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -10px;
    margin-left: -10px;
}

.magazine-archive-new .dbazi-col-5 {
    position: relative; width: 100%; padding: 0 10px;
    flex: 0 0 41.666667%; max-width: 41.666667%;
}

.magazine-archive-new .dbazi-col-4 {
    position: relative; width: 100%; padding: 0 10px;
    flex: 0 0 33.333333%; max-width: 33.333333%;
}

.magazine-archive-new .dbazi-col-3 {
    position: relative; width: 100%; padding: 0 10px;
    flex: 0 0 25%; max-width: 25%;
}
.magazine-archive-new .dbazi-col-3.mb-5 { margin-bottom: 40px; }

/* --- Responsive Fixes (Mobile Optimized) --- */
@media (max-width: 992px) {
    .magazine-archive-new .dbazi-col-5,
    .magazine-archive-new .dbazi-col-4 {
        flex: 0 0 50%; max-width: 50%;
    }
    .magazine-archive-new .dbazi-col-3 {
        flex: 0 0 50%; max-width: 50%;
    }
    .magazine-archive-new .filter-search-box .dbazi-col-3 {
        flex: 0 0 100%; max-width: 100%; margin-top: 10px;
    }
}

@media (max-width: 576px) {
    /* در موبایل همه ستون‌ها تمام عرض شوند */
    .magazine-archive-new .dbazi-col-5,
    .magazine-archive-new .dbazi-col-4,
    .magazine-archive-new .dbazi-col-3 {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 15px;
    }
    
    .magazine-archive-new .top-detail-box h1 {
        font-size: 32px;
    }
    
    /* --- FIX: CLS Fix for Mobile Header --- */
    /* تغییر auto به عدد ثابت برای رزرو فضا */
    .magazine-archive-new .top-img-box {
        min-height: 650px !important; 
        padding-top: 40px;
        padding-bottom: 60px;
        background-attachment: scroll !important; /* جلوگیری از پرش تصویر */
    }
}

/* --- Header & Filter Section --- */
.magazine-archive-new .top-img-box {
    min-height: 500px; /* رزرو فضا برای دسکتاپ */
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 60px;
}

.magazine-archive-new .header-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(180deg, rgba(230, 33, 32, 0.4) 0%, rgba(180, 10, 10, 0.7) 100%);
    z-index: 1;
}

.magazine-archive-new .top-detail-box h1 {
    font-size: 42px; color: #fff; font-weight: 900; text-shadow: 0 4px 10px rgba(0,0,0,0.2);
}
.magazine-archive-new .top-detail-box p {
    font-size: 16px; color: rgba(255,255,255,0.95);
}

/* Filters */
.magazine-archive-new .filter-search-box label {
    font-size: 14px; font-weight: 700; color: #fff; margin-bottom: 8px; display: block; padding-right: 5px;
}

.magazine-archive-new .form-control {
    border-radius: 50px !important;
    border: 1px solid rgba(255,255,255,0.4);
    background-color: rgba(255,255,255,0.95);
    height: 50px;
    padding: 0 20px;
    font-size: 14px;
    color: #333;
    width: 100%;
    transition: 0.3s;
    outline: none;
}

.magazine-archive-new select.form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: left 15px center;
    background-size: 16px;
    padding-left: 40px;
}

.magazine-archive-new .form-control:focus {
    background-color: #fff;
    box-shadow: 0 0 0 4px rgba(255,255,255,0.2);
}

/* Button */
.magazine-archive-new .btn-filter {
    background-color: #222; color: #fff; height: 50px;
    border-radius: 50px !important; font-weight: 700; border: none; width: 100%; cursor: pointer;
    transition: all 0.3s ease;
    font-family: 'IRANSansX', sans-serif !important; font-size: 15px;
}
.magazine-archive-new .btn-filter:hover {
    background-color: #000; transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

/* --- Magazine Card --- */
.magazine-archive-new .post-box { padding-top: 80px; background-color: #f9f9f9; }

.magazine-archive-new .mag-card {
    background: #fff; border-radius: 20px; overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    height: 100%; display: flex; flex-direction: column;
    border: 1px solid rgba(0,0,0,0.03);
}
.magazine-archive-new .mag-card:hover {
    transform: translateY(-10px); box-shadow: 0 20px 40px rgba(230, 33, 32, 0.15);
}
.magazine-archive-new .mag-cover-wrapper { position: relative; overflow: hidden; padding: 15px 15px 0 15px; }
.magazine-archive-new .mag-cover-img { width: 100%; height: auto; display: block; border-radius: 12px; transition: transform 0.5s ease; }
.magazine-archive-new .mag-card:hover .mag-cover-img { transform: scale(1.03); }

.magazine-archive-new .hover-overlay {
    position: absolute; top: 15px; left: 15px; right: 15px; bottom: 0;
    background: rgba(255,255,255,0.2); display: flex; align-items: center; justify-content: center;
    opacity: 0; transition: all 0.3s ease; border-radius: 12px;
}
.magazine-archive-new .mag-card:hover .hover-overlay { opacity: 1; }

.magazine-archive-new .view-btn {
    background: #E62120; color: #fff; padding: 10px 30px; border-radius: 50px;
    font-weight: 800; font-size: 14px; transform: translateY(20px);
    transition: all 0.3s ease; box-shadow: 0 5px 15px rgba(230,33,32,0.4);
    font-family: 'IRANSansX', sans-serif !important;
}
.magazine-archive-new .mag-card:hover .view-btn { transform: translateY(0); }

.magazine-archive-new .mag-content {
    padding: 25px 20px; text-align: center; flex-grow: 1;
    display: flex; flex-direction: column; justify-content: space-between;
}
.magazine-archive-new .mag-title { margin: 0 0 10px; line-height: 1.5; font-size: 16px; }
.magazine-archive-new .mag-title a { color: #333; font-weight: 700; text-decoration: none; }
.magazine-archive-new .mag-card:hover .mag-title a { color: #E62120; }
.magazine-archive-new .mag-meta { margin-bottom: 20px; }

/* --- FIX: Contrast Issue for Date Badge --- */
.magazine-archive-new .date-badge {
    display: inline-block; background: #f0f0fb; 
    color: #333; /* Changed from #888 to #333 for better contrast */
    font-weight: 700; /* Added bold */
    font-size: 13px; padding: 5px 15px; border-radius: 20px;
}

.magazine-archive-new .btn-read {
    display: block; background-color: #f0f0fb; color: #444;
    text-align: center; padding: 12px 0; border-radius: 50px;
    font-size: 15px; font-weight: 700; text-decoration: none; transition: all 0.2s ease;
    font-family: 'IRANSansX', sans-serif !important;
}
.magazine-archive-new .mag-card:hover .btn-read {
    background-color: #E62120; color: #fff; box-shadow: 0 5px 15px rgba(230, 33, 32, 0.25);
}

/* Pagination */
.magazine-archive-new .pagination-box { background: transparent; padding-bottom: 60px; padding-top: 20px; }
.magazine-archive-new .dbazi-pagination { display: flex; justify-content: center; gap: 10px; }
.magazine-archive-new .page-numbers {
    width: 50px; height: 50px; display: flex; align-items: center; justify-content: center;
    background: #fff; border-radius: 50%; color: #333; font-weight: bold;
    text-decoration: none; box-shadow: 0 5px 15px rgba(0,0,0,0.05); transition: 0.2s;
}
.magazine-archive-new .page-numbers.current, .magazine-archive-new .page-numbers:hover {
    background: #E62120; color: #fff; transform: scale(1.1);
    box-shadow: 0 5px 20px rgba(230, 33, 32, 0.3);
}

/* Triangles */
.magazine-archive-new .triangle-box {
    position: absolute; bottom: 0; left: 0; width: 100%; height: 40px; z-index: 3; overflow: hidden;
}
.magazine-archive-new .triangle-box-bottom { top: -39px; bottom: auto; transform: rotate(180deg); }
.magazine-archive-new .triangle-center, .magazine-archive-new .triangle-bottom {
    position: absolute; left: 50%; transform: translateX(-50%); width: 300px; text-align: center;
}
.magazine-archive-new .triangle-center { bottom: -42px; }


/* --- SEO Content Section --- */
.magazine-archive-new .mag-seo-box {
    background-color: #fff;
    padding: 60px 0;
    border-top: 1px solid #e5e5e5;
    color: #444;
    margin-top: 0;
}

.magazine-archive-new .mag-seo-content {
    max-width: 900px; margin: 0 auto;
    text-align: justify; line-height: 1.9;
}

.magazine-archive-new .mag-seo-content h3 {
    font-size: 24px; font-weight: 800; color: #222;
    margin-bottom: 25px; text-align: center;
}

.magazine-archive-new .mag-seo-content p {
    font-size: 15px; margin-bottom: 20px; color: #555;
}

/* --- FIX: SEO Link Accessibility --- */
.magazine-archive-new .mag-seo-content a {
    color: #E62120;
    text-decoration: underline !important;
}

/* Alert Box */
.magazine-archive-new .mag-alert {
    background-color: #fff3cd; border: 1px solid #ffeeba; color: #856404;
    padding: 20px; border-radius: 15px; margin-top: 30px; font-size: 14px;
    display: flex; align-items: flex-start; gap: 10px;
}
.magazine-archive-new .mag-alert strong { white-space: nowrap; }

/* =========================================
   Single Magazine Fixed Styles (V4)
   ========================================= */

/* Main Container */
.magazine-single-new {
    background-color: #f4f6f8 !important;
    font-family: inherit;
    padding-bottom: 50px;
}

/* Breadcrumb */
.mag-breadcrumb-container {
    background: #fff; padding: 15px 0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05); margin-bottom: 30px;
}
.custom-breadcrumbs {
    font-size: 14px; color: #666; display: flex; align-items: center; flex-wrap: wrap;
}
.custom-breadcrumbs a {
    color: #333; font-weight: 700; text-decoration: none; transition: 0.2s;
}
.custom-breadcrumbs a:hover { color: #E62120; }
.custom-breadcrumbs .separator { margin: 0 10px; color: #ccc; font-size: 12px; }
.custom-breadcrumbs .current-post { color: #888; font-weight: normal; }

/* Main Card */
.mag-single-card {
    background: #fff; border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.03);
    padding: 40px; margin-bottom: 40px; border: 1px solid #eaeaea;
}

/* Header */
.mag-single-header {
    text-align: center; margin-bottom: 30px;
    border-bottom: 2px solid #f9f9f9; padding-bottom: 30px;
}
.entry-title {
    font-size: 28px !important; font-weight: 900 !important; color: #222; margin-bottom: 15px !important;
}
.meta-date-badge {
    display: inline-block; background: #fff0f0; color: #E62120;
    padding: 5px 15px; border-radius: 20px; font-size: 13px; font-weight: bold;
}

/* Navigation */
.mag-navigation {
    display: flex; justify-content: space-between;
    margin-top: 40px; padding-top: 20px; border-top: 1px solid #eee;
}
.nav-btn-wrapper a {
    background: #f8f9fa; padding: 10px 20px; border-radius: 8px;
    color: #444; font-weight: 700; text-decoration: none;
    display: inline-block; transition: 0.3s;
}
.nav-btn-wrapper a:hover { background: #E62120; color: #fff; }

/* =========================================
   4. Comments Section Fix
   ========================================= */

.mag-comments-section { max-width: 100%; margin-top: 30px; }
.comments-header-title {
    font-size: 20px; font-weight: 800; margin-bottom: 20px;
    border-right: 4px solid #E62120; padding-right: 15px;
}

.magazine-single-new ol.comment-list {
    padding: 0 !important; margin: 0 !important; list-style: none !important; background: transparent !important;
}

.magazine-single-new .comment-body {
    background: #fff !important; border-radius: 12px !important;
    padding: 25px !important; margin-bottom: 20px !important;
    border: 1px solid #eef0f2 !important; box-shadow: 0 4px 10px rgba(0,0,0,0.02) !important;
    position: relative;
}

.magazine-single-new .comment-meta {
    display: flex; align-items: center; margin-bottom: 15px;
    border-bottom: 1px solid #f5f5f5; padding-bottom: 10px;
}

.magazine-single-new .comment-author {
    display: flex; align-items: center; width: auto !important;
}

.magazine-single-new .comment-author img.avatar {
    width: 50px !important; height: 50px !important;
    border-radius: 50% !important; margin-left: 15px !important;
    border: 2px solid #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.1); float: none !important;
}

.magazine-single-new .fn {
    font-size: 16px !important; font-weight: bold !important;
    color: #000 !important; font-style: normal;
}

.magazine-single-new .comment-metadata {
    margin-right: auto !important; font-size: 12px; color: #999;
}
.magazine-single-new .comment-metadata a { text-decoration: none; color: #aaa; }

.magazine-single-new .comment-content {
    font-size: 15px; line-height: 1.8; color: #444;
    padding: 0 !important; border: none !important; text-align: justify;
}

.magazine-single-new .reply { text-align: left; margin-top: 10px; }
.magazine-single-new .comment-reply-link {
    display: inline-block; padding: 5px 15px; border: 1px solid #E62120;
    color: #E62120; border-radius: 20px; font-size: 12px; font-weight: bold;
    text-decoration: none; transition: all 0.2s;
}
.magazine-single-new .comment-reply-link:hover { background: #E62120; color: #fff; }

.magazine-single-new .children {
    padding-right: 40px !important; border-right: 2px solid #e0e0e0;
    margin-top: 10px !important; list-style: none !important;
}

@media (max-width: 768px) {
    .mag-single-card { padding: 20px; }
    .custom-breadcrumbs { font-size: 12px; }
    .magazine-single-new .children { padding-right: 15px !important; }
}

/* =========================================
   Magazine Archive & Single - DARK MODE FIX
   ========================================= */

body.dark .magazine-archive-new,
body.dark .magazine-single-new,
body.dark .mag-seo-box {
    background-color: #0c0c0e !important; color: #f3f3f3 !important; border-color: #2d2d33 !important;
}

body.dark .mag-card,
body.dark article.mag-single-card,
body.dark .mag-comments-section.mag-single-card {
    background-color: #131316 !important; border: 1px solid #2d2d33 !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.4) !important; color: #f3f3f3 !important;
}

body.dark .mag-title a,
body.dark .entry-title,
body.dark .comments-header-title,
body.dark .comments-title-main {
    color: #ffffff !important; text-shadow: none !important;
}

body.dark .mag-title a:hover,
body.dark .nav-btn-wrapper a:hover,
body.dark .custom-breadcrumbs a:hover {
    color: #E62120 !important;
}

body.dark .mag-breadcrumb-container {
    background-color: #131316 !important; border-bottom: 1px solid #2d2d33 !important; box-shadow: none !important;
}
body.dark .custom-breadcrumbs a { color: #b0b0b0 !important; }
body.dark .custom-breadcrumbs .current-post { color: #666 !important; }
body.dark .custom-breadcrumbs .separator { color: #444 !important; }

body.dark .date-badge,
body.dark .btn-read,
body.dark .nav-btn-wrapper a {
    background-color: #1f1f22 !important; color: #e0e0e0 !important; border: 1px solid #2d2d33 !important;
}
body.dark .meta-date-badge {
    background-color: rgba(230, 33, 32, 0.1) !important; color: #ff6b6b !important;
    border: 1px solid rgba(230, 33, 32, 0.2) !important;
}
body.dark .meta-date-badge svg { stroke: #ff6b6b !important; }

body.dark .magazine-archive-new .form-control {
    background-color: #131316 !important; border-color: #444 !important; color: #fff !important;
}
body.dark .magazine-archive-new .form-control::placeholder { color: #888 !important; }
body.dark .magazine-archive-new select.form-control {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") !important;
}

body.dark .magazine-archive-new .page-numbers {
    background-color: #131316 !important; color: #fff !important; box-shadow: 0 5px 15px rgba(0,0,0,0.3) !important;
}
body.dark .magazine-archive-new .page-numbers.current,
body.dark .magazine-archive-new .page-numbers:hover {
    background-color: #E62120 !important;
}

body.dark .mag-comments-section .comment-body,
body.dark .comment-body {
    background-color: #18181b !important; border: 1px solid #2d2d33 !important; box-shadow: none !important;
}
body.dark .comment-author .fn,
body.dark .comment-author .fn a {
    color: #ffffff !important;
}
body.dark .comment-content,
body.dark .comment-content p {
    color: #cccccc !important;
}
body.dark .comment-metadata a { color: #777 !important; }
body.dark .comment-meta,
body.dark .comment-metadata { border-bottom-color: #2d2d33 !important; }
body.dark .comment-reply-link { border-color: #E62120 !important; color: #E62120 !important; }
body.dark .comment-reply-link:hover { background-color: #E62120 !important; color: #fff !important; }
body.dark .children { border-right-color: #2d2d33 !important; }

body.dark .mag-single-header { border-bottom-color: #2d2d33 !important; }
body.dark .mag-navigation { border-top-color: #2d2d33 !important; }
body.dark .comments-title-main { border-right-color: #E62120 !important; }

body.dark .mag-seo-content h3 { color: #fff !important; }
body.dark .mag-seo-content p { color: #aaa !important; }
body.dark .magazine-archive-new .mag-alert {
    background-color: #2a2412 !important; border-color: #463a18 !important; color: #d1b66b !important;
}

body.dark .real3dflipbook .flipbook-logo { display: none !important; }