/* =========================================================================
   Totana a la Carta - Desktop layout for the CATEGORY LIST view
   -------------------------------------------------------------------------
   Page-specific only. The shared chrome (top bar, restaurant cards, search
   control, filter dialog, footer) lives in desktop_shared.css, which must
   be loaded first. Everything here sits inside @media (min-width: 1024px),
   so the mobile rendering is untouched.
   ========================================================================= */

@media (min-width: 1024px) {

    /* The compact mobile header is replaced by the shared top bar. */
    .header {
        display: none;
    }

    main {
        padding-top: 0;
    }

    /* ---------------------------------------------------------------------
       1. Category banner
       --------------------------------------------------------------------- */
    .category-section {
        max-width: none;
        margin: 0;
        border-radius: 0;
        min-height: 0;
        overflow: visible;
        padding: 56px var(--dsk-gutter) 28px;
    }

    .category-content {
        position: relative;
        z-index: 3;
    }

    .category-breadcrumb {
        display: none !important;
    }

    /* Decorative category illustration, matching the mobile treatment. */
    .category-image-container {
        top: -24px;
        bottom: auto;
        right: 0;
        left: auto;
        width: 320px;
        height: 250px;
        display: flex;
        align-items: flex-start;
        justify-content: flex-end;
        z-index: 0;
        opacity: 1;
        pointer-events: none;
    }

    .category-image {
        width: auto;
        height: auto;
        max-height: 240px;
        object-position: right top;
        filter: none;
    }

    /* ---------------------------------------------------------------------
       2. Toolbar: result count on the left, search and filter on the right
       --------------------------------------------------------------------- */
    .search-section {
        max-width: none;
        margin: 0;
        padding: 4px var(--dsk-gutter) 30px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 24px;
    }

    .search-section::after {
        display: none;
    }

    .results-count {
        display: none !important;
    }

    .search-section .search-container {
        flex: 0 0 440px;
        width: 440px;
    }

    /* ---------------------------------------------------------------------
       3. Restaurant grid
       --------------------------------------------------------------------- */
    .restaurant-list-section {
        max-width: none;
        margin: 0;
        border-radius: 0;
        min-height: 0;
        padding: 0 var(--dsk-gutter) 80px;
    }

    .empty-state {
        padding: 5rem 1rem;
    }

    .empty-state-text {
        max-width: 440px;
        font-size: 1.1rem;
        color: rgba(31, 27, 22, .72);
    }
}

@media (min-width: 1024px) and (max-width: 1279px) {
    .search-section .search-container {
        flex: 0 0 360px;
        width: 360px;
    }
}