/**
 * Responsive Styles - Editorial Premium
 *
 * @package Blog_Shopping_Uniformes
 * @version 2.0.0
 */

/* ==========================================================================
   Large Devices (Desktops, 1200px and below)
   ========================================================================== */

@media (max-width: 1200px) {
    /* Featured Post */
    .featured-post {
        grid-template-columns: 1fr 1fr;
        gap: var(--space-8);
    }

    .featured-post__title {
        font-size: var(--text-3xl);
    }

    /* Footer Grid */
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--space-10);
    }

    .footer-brand {
        grid-column: span 2;
    }
}

/* ==========================================================================
   Medium-Large Devices (Tablets Landscape, 1024px and below)
   ========================================================================== */

@media (max-width: 1024px) {
    /* Show mobile menu */
    .main-navigation {
        display: none;
    }

    .menu-toggle {
        display: flex;
    }

    /* Content Area */
    .content-area.has-sidebar {
        grid-template-columns: 1fr;
        gap: var(--space-12);
    }

    /* Posts Grid */
    .posts-grid.grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Hero Editorial */
    .hero-editorial__title {
        font-size: var(--text-5xl);
    }

    .hero-editorial__content {
        padding-top: var(--space-24);
    }

    /* Grid Featured - Tablet */
    .grid-featured {
        grid-template-columns: 1fr;
        gap: var(--space-8);
    }

    .cards-small-column {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-4);
    }

    .card-small {
        flex-direction: column;
        padding-bottom: 0;
        border-bottom: none;
    }

    .card-small__image {
        width: 100%;
        height: 180px;
    }

    .card-small__content {
        padding: var(--space-3) 0;
    }

    /* Related Posts - Tablet */
    .related-posts__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Search Results - Tablet */
    .search-results__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Archive Page - Tablet */
    .archive-hero__title {
        font-size: var(--text-4xl);
    }

    .archive-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-6);
    }
}

/* ==========================================================================
   Medium Devices (Tablets, 768px and below)
   ========================================================================== */

@media (max-width: 768px) {
    /* Typography Scale Down */
    h1, .single-post__title {
        font-size: var(--text-4xl);
    }

    /* Search Page */
    .search-hero {
        padding: var(--space-12) 0;
    }

    .search-hero__title {
        font-size: var(--text-3xl);
    }

    .search-results {
        padding: var(--space-12) 0;
    }

    .search-results__grid {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }

    .search-card__title {
        font-size: var(--text-base);
    }

    /* Archive Page - Mobile */
    .archive-hero {
        padding: var(--space-12) 0 var(--space-8);
    }

    .archive-hero__title {
        font-size: var(--text-3xl);
    }

    .archive-hero__description {
        font-size: var(--text-base);
    }

    .archive-content {
        padding: var(--space-8) 0 var(--space-12);
    }

    .archive-grid {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }

    .archive-card__content {
        padding: var(--space-5);
    }

    .archive-card__title {
        font-size: var(--text-lg);
    }

    .archive-pagination .page-numbers {
        min-width: 40px;
        height: 40px;
        font-size: var(--text-xs);
    }

    .archive-pagination .prev span,
    .archive-pagination .next span {
        display: none;
    }

    h2 {
        font-size: var(--text-3xl);
    }

    h3 {
        font-size: var(--text-2xl);
    }

    /* Header */
    .header-inner {
        height: 64px;
        padding: 0 var(--space-4);
    }

    .header-fixed-adjust {
        padding-top: 64px;
    }

    /* Featured Post */
    .featured-post {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }

    .featured-post__image {
        aspect-ratio: 16/9;
    }

    .featured-post__content {
        padding: 0;
    }

    .featured-post__title {
        font-size: var(--text-2xl);
    }

    /* Posts Grid */
    .posts-grid.grid-3,
    .posts-grid.grid-2 {
        grid-template-columns: 1fr;
    }

    /* Posts List */
    .posts-grid.list .post-card {
        flex-direction: column;
        gap: var(--space-4);
    }

    .posts-grid.list .post-card__image {
        width: 100%;
    }

    .posts-grid.list .post-card__title {
        font-size: var(--text-xl);
    }

    /* Hero Editorial */
    .hero-editorial {
        min-height: 60vh;
    }

    .hero-editorial__title {
        font-size: var(--text-4xl);
    }

    .hero-editorial__excerpt {
        font-size: var(--text-lg);
    }

    .hero-editorial__content {
        padding-top: var(--space-20);
    }

    /* Hero Simple */
    .hero-simple {
        padding: var(--space-16) 0 var(--space-10);
    }

    .hero-simple__title {
        font-size: var(--text-4xl);
    }

    /* Single Post */
    .single-post-header {
        padding: var(--space-16) 0 var(--space-8);
    }

    .single-post__meta {
        flex-direction: column;
        gap: var(--space-4);
    }

    .post-content {
        padding: var(--space-8) var(--space-4);
        font-size: var(--text-base);
    }

    .post-footer {
        padding: var(--space-8) var(--space-4);
    }

    /* Single Hero */
    .single-hero {
        min-height: 45vh;
    }

    .single-hero__title {
        font-size: var(--text-4xl);
    }

    .single-hero__excerpt {
        font-size: var(--text-lg);
    }

    .single-hero__meta {
        gap: var(--space-4);
    }

    .single-article {
        padding: var(--space-12) 0;
    }

    .article-content {
        font-size: var(--text-base);
    }

    .article-content blockquote {
        padding: var(--space-6);
        font-size: var(--text-xl);
    }

    /* Author Box */
    .author-box {
        flex-direction: column;
        text-align: center;
        padding: var(--space-6);
    }

    .author-box__avatar {
        margin: 0 auto;
    }

    /* Share Section */
    .share-section {
        padding: var(--space-5);
    }

    .share-others {
        flex-direction: column;
        gap: var(--space-3);
    }

    .share-whatsapp-main {
        font-size: var(--text-sm);
        padding: var(--space-3) var(--space-4);
    }

    /* Footer */
    .footer-main {
        padding: var(--space-12) 0;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: var(--space-8);
    }

    .footer-brand {
        grid-column: span 1;
        text-align: center;
        padding-right: 0;
    }

    .footer-social {
        justify-content: center;
    }

    .footer-column-title {
        margin-top: var(--space-6);
    }

    .footer-bottom-inner {
        flex-direction: column;
        gap: var(--space-4);
        text-align: center;
    }

    .footer-bottom-menu {
        justify-content: center;
    }

    /* Newsletter */
    .newsletter-section {
        padding: var(--space-12) 0;
    }

    .newsletter-title {
        font-size: var(--text-2xl);
    }

    .newsletter-form {
        flex-direction: column;
    }

    .newsletter-form button {
        width: 100%;
    }

    /* Sidebar */
    .sidebar {
        gap: var(--space-8);
    }

    /* Comments */
    .comments-area {
        padding: var(--space-8) var(--space-4);
    }

    .comment-body {
        flex-direction: column;
        gap: var(--space-3);
    }

    /* 404 Page */
    .error-404__title {
        font-size: var(--text-6xl);
    }

    /* Related Posts Grid */
    .related-posts .posts-grid {
        grid-template-columns: 1fr;
    }

    /* Post Navigation */
    .post-nav-links {
        grid-template-columns: 1fr;
    }

    .post-nav-next {
        grid-column: 1;
        text-align: left;
    }

    .post-nav-next .post-nav-label {
        justify-content: flex-start;
        flex-direction: row-reverse;
    }

    /* Floating Buttons */
    .floating-buttons {
        bottom: var(--space-4);
        right: var(--space-4);
    }

    .floating-btn {
        width: 44px;
        height: 44px;
    }
}

/* ==========================================================================
   Small Devices (Mobile, 576px and below)
   ========================================================================== */

@media (max-width: 576px) {
    /* Root Adjustments */
    :root {
        --space-16: 3rem;
        --space-20: 4rem;
        --space-24: 5rem;
    }

    /* Typography */
    h1, .single-post__title {
        font-size: var(--text-3xl);
    }

    /* Grid Featured - Mobile */
    .cards-small-column {
        grid-template-columns: 1fr;
    }

    .card-small__image {
        height: 200px;
    }

    /* Related Posts - Mobile */
    .related-posts__grid {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }

    .related-post-card__title {
        font-size: var(--text-base);
    }

    /* Search Page - Mobile */
    .search-hero {
        padding: var(--space-10) 0;
    }

    .search-hero__title {
        font-size: var(--text-2xl);
    }

    .search-hero__query {
        font-size: var(--text-base);
    }

    .search-form-inline {
        flex-direction: column;
        border-radius: var(--radius-lg);
    }

    .search-form-inline__input {
        border-bottom: 1px solid var(--color-border);
    }

    .search-form-inline__button {
        border-radius: 0 0 var(--radius-lg) var(--radius-lg);
    }

    .search-results {
        padding: var(--space-10) 0;
    }

    .search-card__content {
        padding: var(--space-4);
    }

    h2 {
        font-size: var(--text-2xl);
    }

    h3 {
        font-size: var(--text-xl);
    }

    /* Container */
    .container {
        padding-left: var(--space-4);
        padding-right: var(--space-4);
    }

    /* Header */
    .header-inner {
        height: 56px;
    }

    .header-fixed-adjust {
        padding-top: 56px;
    }

    .site-title {
        font-size: var(--text-lg);
    }

    /* Hero Editorial */
    .hero-editorial {
        min-height: 50vh;
    }

    .hero-editorial__title {
        font-size: var(--text-3xl);
    }

    .hero-editorial__excerpt {
        font-size: var(--text-base);
    }

    .hero-editorial__meta {
        flex-direction: column;
        gap: var(--space-2);
    }

    /* Hero Simple */
    .hero-simple__title {
        font-size: var(--text-3xl);
    }

    .hero-simple__description {
        font-size: var(--text-base);
    }

    /* Section Header */
    .section-header {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-2);
    }

    /* Post Card */
    .post-card__title {
        font-size: var(--text-lg);
    }

    .post-card__excerpt {
        font-size: var(--text-sm);
    }

    .post-card__meta {
        font-size: var(--text-xs);
    }

    /* Featured Post */
    .featured-post__title {
        font-size: var(--text-xl);
    }

    .featured-post__excerpt {
        font-size: var(--text-base);
    }

    /* Single Post */
    .single-post-header {
        padding: var(--space-12) 0 var(--space-6);
    }

    .single-post__excerpt {
        font-size: var(--text-base);
    }

    .post-content h2 {
        font-size: var(--text-2xl);
    }

    .post-content h3 {
        font-size: var(--text-xl);
    }

    .post-content blockquote {
        padding: var(--space-4) var(--space-5);
        font-size: var(--text-lg);
    }

    /* Single Hero - Mobile */
    .single-hero {
        min-height: 40vh;
    }

    .single-hero__content {
        padding: var(--space-10) 0;
    }

    .single-hero__title {
        font-size: var(--text-3xl);
    }

    .single-hero__excerpt {
        font-size: var(--text-base);
        display: none;
    }

    .single-hero__meta {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-3);
    }

    .single-article {
        padding: var(--space-10) 0;
    }

    .article-content h2 {
        font-size: var(--text-2xl);
    }

    .article-content h3 {
        font-size: var(--text-xl);
    }

    .article-content blockquote {
        padding: var(--space-4) var(--space-5);
        font-size: var(--text-lg);
    }

    /* Tags */
    .post-tags {
        flex-direction: column;
        align-items: flex-start;
    }

    /* Author Box */
    .author-box__name {
        font-size: var(--text-lg);
    }

    .author-box__avatar {
        width: 64px;
        height: 64px;
    }

    /* Search Form */
    .search-form {
        flex-direction: column;
    }

    .search-form .search-submit {
        width: 100%;
    }

    /* Search Overlay */
    .search-overlay .search-field {
        font-size: var(--text-2xl);
    }

    /* Pagination */
    .pagination .page-numbers {
        min-width: 40px;
        height: 40px;
        font-size: var(--text-sm);
    }

    /* Breadcrumbs */
    .breadcrumbs-list {
        font-size: var(--text-xs);
    }

    /* Widget */
    .widget-recent-post {
        flex-direction: column;
    }

    .widget-recent-post__image {
        width: 100%;
        height: 150px;
    }

    /* 404 Page */
    .error-404__title {
        font-size: var(--text-5xl);
    }

    .error-404__subtitle,
    .no-results__title {
        font-size: var(--text-xl);
    }

    .error-404__text,
    .no-results__text {
        font-size: var(--text-base);
    }

    /* Mobile Drawer - Full Width on Small Screens */
    .mobile-drawer {
        max-width: 100%;
    }

    .drawer-header {
        padding: var(--space-4) var(--space-5);
    }

    .drawer-branding img {
        height: 32px;
    }

    .drawer-content {
        padding: var(--space-2) 0;
    }

    .mobile-menu-list > li > a {
        padding: var(--space-4) var(--space-5);
        font-size: var(--text-base);
    }

    .mobile-menu-list .sub-menu a {
        padding: var(--space-3) var(--space-5) var(--space-3) var(--space-8);
    }

    .drawer-contact {
        padding: var(--space-4) var(--space-5);
    }
}

/* ==========================================================================
   Extra Small Devices (Very Small Phones, 360px and below)
   ========================================================================== */

@media (max-width: 360px) {
    h1, .single-post__title {
        font-size: var(--text-2xl);
    }

    .hero-editorial__title {
        font-size: var(--text-2xl);
    }

    .hero-simple__title {
        font-size: var(--text-2xl);
    }

    .post-card__title {
        font-size: var(--text-base);
    }

    .error-404__title {
        font-size: var(--text-4xl);
    }
}

/* ==========================================================================
   Print Styles
   ========================================================================== */

@media print {
    /* Hide non-essential elements */
    .site-header,
    .mobile-drawer,
    .drawer-overlay,
    .search-overlay,
    .sidebar,
    .footer-main,
    .floating-buttons,
    .share-section,
    .related-posts,
    .comments-area,
    .breadcrumbs,
    .newsletter-section,
    .pagination {
        display: none !important;
    }

    /* Reset layout */
    .header-fixed-adjust {
        padding-top: 0 !important;
    }

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

    /* Typography */
    body {
        font-family: Georgia, 'Times New Roman', serif;
        font-size: 12pt;
        line-height: 1.6;
        color: #000;
        background: #fff;
    }

    h1, h2, h3, h4, h5, h6 {
        font-family: Georgia, 'Times New Roman', serif;
        color: #000;
        page-break-after: avoid;
    }

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

    /* Show URLs */
    a[href]::after {
        content: " (" attr(href) ")";
        font-size: 0.8em;
        font-weight: normal;
    }

    a[href^="#"]::after,
    a[href^="javascript:"]::after {
        content: "";
    }

    /* Images */
    img {
        max-width: 100% !important;
        page-break-inside: avoid;
    }

    /* Content */
    .post-content {
        max-width: 100%;
        padding: 0;
        font-size: 11pt;
    }

    .post-content blockquote {
        border-left: 2px solid #000;
        padding-left: 1em;
        font-style: italic;
    }

    /* Page breaks */
    p, blockquote, ul, ol {
        orphans: 3;
        widows: 3;
    }

    /* Footer */
    .footer-bottom {
        border-top: 1px solid #000;
        padding: 1em 0;
    }

    .copyright {
        color: #000;
    }
}

/* ==========================================================================
   High Contrast Mode
   ========================================================================== */

@media (prefers-contrast: high) {
    :root {
        --color-text-primary: #000000;
        --color-text-secondary: #000000;
        --color-text-tertiary: #333333;
        --color-border: #000000;
        --color-bg-secondary: #ffffff;
    }

    a {
        text-decoration: underline;
    }

    .btn,
    .tag,
    .social-link,
    .share-btn,
    .floating-btn {
        border: 2px solid currentColor !important;
    }

    .post-card__image,
    .featured-post__image,
    .hero-editorial__image {
        border: 1px solid #000;
    }
}

/* ==========================================================================
   Reduced Motion
   ========================================================================== */

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

    .post-card:hover .post-card__image img,
    .featured-post:hover .featured-post__image img {
        transform: none;
    }

    .floating-btn:hover {
        transform: none;
    }
}

/* ==========================================================================
   Dark Mode Support
   ========================================================================== */

@media (prefers-color-scheme: dark) {
    :root.auto-dark-mode {
        --color-black: #ffffff;
        --color-white: #0a0a0a;

        --color-gray-100: #1a1a1a;
        --color-gray-200: #2d2d2d;
        --color-gray-300: #404040;
        --color-gray-400: #525252;
        --color-gray-500: #737373;
        --color-gray-600: #a3a3a3;
        --color-gray-700: #d4d4d4;
        --color-gray-800: #e5e5e5;
        --color-gray-900: #f5f5f5;
    }

    :root.auto-dark-mode .site-header.is-scrolled {
        background-color: rgba(26, 26, 26, 0.98);
    }

    :root.auto-dark-mode .search-overlay {
        background-color: rgba(26, 26, 26, 0.98);
    }
}

/* ==========================================================================
   Large Screen Enhancements (1400px and up)
   ========================================================================== */

@media (min-width: 1400px) {
    .container--wide {
        max-width: 1600px;
    }

    .hero-editorial__title {
        font-size: var(--text-7xl);
    }

    .featured-post {
        gap: var(--space-16);
    }

    .featured-post__title {
        font-size: var(--text-5xl);
    }

    .posts-grid {
        gap: var(--space-12);
    }
}