/* ================================================================
   CATEGORY PAGE — Mobile Responsive CSS
   ================================================================ */

@media(max-width:640px) {
    .page-wrap { padding: 14px 12px 48px; }

    /* Top bar stacks on mobile */
    .cat-topbar {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        margin-bottom: 14px;
    }
    .sort-wrap { width: 100%; }
    .sort-sel { flex: 1; width: 100%; }

    /* Product grid — 2 columns tight */
    .prod-grid { gap: 10px; }
    .pcard { border-radius: 12px; }
    .pcard-body { padding: 10px; }
    .pcard-name { font-size: .82rem; margin-bottom: 5px; }
    .pc-now { font-size: .92rem; }
    .pc-old { font-size: .7rem; }
    .pc-off { font-size: .64rem; padding: 1px 5px; }
    .pcard-btn { padding: 8px; font-size: .76rem; border-radius: 8px; }

    /* Filter panel mobile */
    .filter-card { padding: 16px; border-radius: 12px; }

    /* Empty state */
    .empty-state { padding: 48px 16px; }
    .empty-icon { font-size: 2.6rem; }
}

@media(max-width:380px) {
    .prod-grid { gap: 8px; }
    .pcard-body { padding: 8px; }
    .pcard-name { font-size: .78rem; }
    .pc-now { font-size: .86rem; }
    .pcard-btn { padding: 7px; font-size: .72rem; }
    .cat-title { font-size: 1.05rem; }
}
