/* ============================================================
   AGRIMUS — assets/css/listing.css
   Base commune des pages « liste » (marche.php, reseau.php).
   ============================================================ */

:root {
    --g1: #1C4A2A;
    --g2: #2A6B3C;
    --g3: #3D8F52;
    --g-tint: #EBF5ED;
    --amber: #E8920A;
    --amber2: #F5A623;
    --ink: #1A1F1C;
    --ink2: #3D4840;
    --muted: #7A8A7C;
    --border: #DDE5DE;
    --bg: #F4F7F4;
    --surface: #FFFFFF;
    --r-lg: 16px;
    --shadow-sm: 0 1px 2px rgba(28, 74, 42, .06), 0 2px 8px rgba(28, 74, 42, .04);
    --shadow: 0 2px 6px rgba(28, 74, 42, .08), 0 8px 24px rgba(28, 74, 42, .08);
}

html,
body {
    overflow-x: hidden
}

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

.page-head {
    background: var(--surface);
    border-bottom: 1px solid var(--border)
}

.page-title i {
    font-size: 20px;
    color: var(--g3)
}

.wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 26px 20px 40px
}

.empty {
    grid-column: 1/-1;
    text-align: center;
    padding: 50px 20px;
    color: var(--muted);
    background: var(--surface);
    border: 1px dashed var(--border);
    border-radius: var(--r-lg)
}

.empty i {
    font-size: 30px;
    margin-bottom: 8px;
    color: var(--g3)
}

.pagination {
    display: flex;
    justify-content: center;
    gap: 4px;
    margin-top: 28px;
    flex-wrap: wrap;
    list-style: none
}

.pagination a,
.pagination span {
    display: block;
    padding: 6px 12px;
    border-radius: 8px;
    border: 1px solid var(--border);
    color: var(--g2);
    font-size: 12.5px;
    background: var(--surface)
}

.pagination .active span {
    background: var(--g1);
    color: #fff;
    border-color: var(--g1)
}

.pagination .disabled span {
    color: var(--muted)
}