/* ========================================
   COLLECTIONS - MOBILE ONLY STYLES
   This file is loaded only on mobile devices
   ======================================== */

/* --- MOBILE LAYOUT OVERRIDES --- */

/* Remove default section padding to match header width */
.col-section {
    padding: 0 !important;
    max-width: 100% !important;
}

/* Header: Stack vertically on mobile, add internal padding */
.col-header-wrapper {
    flex-direction: column !important;
    align-items: flex-start !important;
    padding: 20px 4px 0 4px !important;
    /* Top padding + side gutters */
    margin-bottom: 20px !important;
}

/* Filters Panel: Needs side margins now that section has none */
.col-filters-panel {
    margin: 0 4px 24px 4px !important;
    border-radius: 8px !important;
}

/* Grid: Single column, add side padding */
.col-grid {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 0 4px 40px 4px !important;
    /* Bottom padding for scroll */
}

/* Search bar full width */
.col-search-filter-bar {
    width: 100% !important;
    flex-wrap: wrap !important;
}

.col-search-container {
    width: 100% !important;
    max-width: none !important;
}

/* --- CARD (Horizontal Compact Style) --- */
.col-card {
    padding: 10px !important;
    min-height: 100px !important;
    height: auto !important;
    border-radius: 6px !important;
}

/* Image: Smaller on mobile */
.col-card-image {
    width: 85px !important;
    height: 85px !important;
    margin-right: 12px !important;
    border-radius: 4px !important;
}

/* Title: Smaller font */
.col-card-title {
    font-size: 0.95rem !important;
    margin-bottom: 2px !important;
}

/* Subtitle: Even smaller */
.col-card-subtitle {
    font-size: 0.8rem !important;
    margin-bottom: 6px !important;
}

/* Tags: Compact */
.col-tags-text {
    font-size: 0.75rem !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
}

/* Audio count badge */
.col-audio-badge {
    font-size: 0.6rem !important;
    padding: 2px 5px !important;
}

/* Section title smaller */
.col-section h2 {
    font-size: 1.4rem !important;
}

/* Pagination compact */
.pagination-wrapper {
    padding: 15px 0 !important;
}

.pagination-wrapper .page-link {
    padding: 6px 10px !important;
    font-size: 0.85rem !important;
}