/* ==========================================================================
   eZya Theme — Responsive (Clean White & Dark Text)
   ========================================================================== */

@media (min-width: 1200px) {
    .container {
        max-width: 1200px;
    }
}

@media (max-width: 991.98px) {
    .header-content {
        padding: 20px 0;
    }

    .header .site-name .navbar-brand-logo img {
        max-width: 210px;
    }

    .header .site-name .title {
        font-size: 1.35rem;
    }

    #MenuToggle {
        display: block;
    }

    #DesktopMenu {
        display: none;
    }

    .navbar-ezya {
        padding: 8px 0;
    }

    .pkp_structure_sidebar {
        padding-left: 0;
        margin-top: 24px;
    }

    .article-main .article-title,
    .article-details .article-title {
        font-size: 1.5rem;
    }

    .editorial-member {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .pkp_structure_content {
        padding: 24px 20px;
    }

    /* Grid adjustments */
    .grid-main-sidebar,
    .grid-sidebar-main {
        grid-template-columns: 1fr;
    }

    .content-grid {
        grid-template-columns: 1fr;
    }

    .articles-grid {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    }

    .editorial-grid {
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    }

    .announcements-grid {
        grid-template-columns: 1fr;
    }

    .issues-grid {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    }
}

@media (max-width: 767.98px) {
    body {
        font-size: 0.875rem;
    }

    :root {
        --content-padding: 16px;
        --grid-gap: 16px;
    }

    .header-top {
        padding: 6px 0;
        font-size: 0.75rem;
    }

    .header-top .nav-link {
        padding: 3px 8px;
        font-size: 0.75rem;
    }

    .header-content {
        padding: 16px 0;
    }

    .header .site-name .navbar-brand-logo img {
        max-width: 170px;
    }

    .header .site-name .title {
        font-size: 1.15rem;
    }

    .topSearch {
        margin-top: 10px;
    }

    .header-search .form-control {
        padding: 8px 14px;
        font-size: 0.8125rem;
    }

    .header-search .btn {
        padding: 8px 14px;
    }

    .pkp_structure_content {
        padding: 16px;
    }

    .pkp_structure_main,
    .article-main,
    .article-details {
        padding: 20px;
        border-radius: var(--radius);
    }

    #homepageSlider {
        margin-bottom: 20px;
        border-radius: var(--radius);
    }

    .current-issue {
        padding: 18px;
    }

    .current-issue h2 {
        font-size: 1.15rem;
    }

    .article-summary {
        padding: 18px;
    }

    .article-summary .title,
    .article-summary .article-title {
        font-size: 1rem;
    }

    .article-summary .abstract {
        font-size: 0.8125rem;
        -webkit-line-clamp: 2;
    }

    .sidebar-block {
        padding: 18px;
    }

    .pkp_structure_footer {
        padding: 32px 0 16px;
    }

    .footer-content h4 {
        font-size: 0.95rem;
    }

    .btn-primary,
    .btn-outline-primary {
        padding: 8px 20px;
        font-size: 0.875rem;
    }

    .article-main .article-meta {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .article-keywords .keyword {
        font-size: 0.75rem;
        padding: 4px 10px;
    }

    .announcement {
        padding: 18px;
    }

    .announcement h3 {
        font-size: 1.05rem;
    }

    .pagination .page-item .page-link {
        padding: 6px 10px;
        font-size: 0.8125rem;
    }

    .editorial-member {
        padding: 18px;
    }

    .section-title {
        font-size: 1.1rem;
    }
}

@media (max-width: 575.98px) {
    .header .site-name .navbar-brand-logo img {
        max-width: 145px;
    }

    .header .site-name .title {
        font-size: 1rem;
    }

    .mobile-menu-container {
        max-width: 280px;
    }

    .mobile-menu .navbar-nav .nav-link {
        padding: 10px 16px;
        font-size: 0.875rem;
    }

    .article-main .article-title,
    .article-details .article-title {
        font-size: 1.2rem;
    }

    .editorial-member .member-photo {
        width: 60px;
        height: 60px;
    }

    .articles-grid,
    .editorial-grid,
    .announcements-grid,
    .issues-grid {
        grid-template-columns: 1fr;
    }

    .grid-2,
    .grid-3,
    .grid-4 {
        grid-template-columns: 1fr;
    }

    .col-span-2,
    .col-span-3 {
        grid-column: span 1;
    }
}

@media print {
    .header-top,
    .header-bottom,
    .topSearch,
    #MenuToggle,
    .mobile-menu-container,
    .pkp_structure_sidebar,
    .pkp_structure_footer,
    .btn,
    .pagination {
        display: none !important;
    }

    .header {
        background: none !important;
        color: #000 !important;
        border-bottom: 1px solid #000 !important;
    }

    .header .site-name .title {
        color: #000 !important;
    }

    .pkp_structure_main {
        box-shadow: none !important;
        padding: 0 !important;
        border: none !important;
    }

    body {
        font-size: 12pt;
        line-height: 1.5;
        color: #000;
    }

    a {
        color: #000 !important;
        text-decoration: underline !important;
    }

    .content-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .header .site-name .navbar-brand-logo img {
        image-rendering: -webkit-optimize-contrast;
    }
}

/* ==========================================================================
   ACCESSIBILITY
   ========================================================================== */

*:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ==========================================================================
   SCROLLBAR
   ========================================================================== */

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--bg-soft);
}

::-webkit-scrollbar-thumb {
    background: var(--text-muted);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--text-secondary);
}

/* ==========================================================================
   SELECTION
   ========================================================================== */

::selection {
    background: var(--primary);
    color: #fff;
}

::-moz-selection {
    background: var(--primary);
    color: #fff;
}