/*
 * Cavités / Publications -- search-form width, stat cards, disclaimer,
 * view toggle, map legend, badges, difficulty tags, single-cave fiche
 * plus GPS and rigging tables, Publications' PDF-link chip.
 * Split out of theme.css 2026-08-04 (v10.29, 4th attempt -- every rule
 * individually verified exclusive to Cavites/Publications by
 * cross-referencing every other feature's PHP and JS for the same class
 * names, not by line-range or section-header guessing; see VERSIONS.md
 * for the full incident writeup of why the first 3 attempts broke Blog.
 * The shared data-table, modal, row-action, search-bar and admin-link
 * base classes stay in theme.css since Blog's own table reuses them too.
 */

/* ---- Cave search form ---- */
.gsl-cave-wrap { max-width: 1200px; margin: 0 auto; padding: 0 1rem; }
/* ---- Cave stat cards ---- */
.gsl-cave-stats {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: 1rem; margin-bottom: 0.8rem;
}
.gsl-cave-stat-card {
    background: #e0e2e6; border-radius: 4px;
    border-left: 3px solid var(--gsl-accent);
    padding: 0.55rem 1rem;
    aspect-ratio: 9 / 2;
    display: flex; flex-direction: column; justify-content: center; gap: 0.1rem;
    overflow: hidden;
}
.gsl-cave-stat-card__val {
    font-family: "Cardo", Georgia, serif; font-size: 1.15rem;
    color: #1a1a1a; line-height: 1;
}
.gsl-cave-stat-card__label {
    font-size: 0.65rem; color: #1a1a1a; opacity: 0.5;
    text-transform: uppercase; letter-spacing: 0.07em;
    font-family: "Inter", sans-serif; font-weight: 500;
}
.gsl-cave-stat-card__sub {
    font-size: 0.72rem; color: #1a1a1a; opacity: 0.55;
    font-style: italic; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis;
}
@media (max-width: 640px) { .gsl-cave-stats { grid-template-columns: repeat(2, 1fr); } }
.gsl-cave-disclaimer {
    border: 1px solid var(--gsl-db-hover); border-radius: 6px;
    margin-bottom: 1rem; background: var(--gsl-db-row);
}
.gsl-cave-disclaimer summary {
    cursor: pointer; padding: 0.7rem 1.1rem; font-weight: 600;
    letter-spacing: 0.03em; color: #6D533C; list-style: none; font-size: 0.88rem;
}
.gsl-cave-disclaimer summary::-webkit-details-marker { display: none; }
/* Disclosure arrow: was a "▶"/"▼" character SWAP (content: "▶ " ->
   content: "▼ ") — unified 2026-08-07 to the same single-glyph-ROTATED
   technique membres.php/histoire.php/liens.php's own disclosure widgets
   already use, closing the "broader symbol sweep" gap this left (▶ is in
   WordPress's own emoji table, ▼ isn't — an inconsistency moot either way
   since CSS content: strings are never touched by wp_staticize_emoji() in
   the first place, only DOM text nodes are). An inline SVG chevron via
   background-image (content: strings can't hold an <svg> element
   directly) at this site's own summary color (#6D533C), rotated 90deg on
   [open] exactly like the 3 other widgets. */
.gsl-cave-disclaimer summary::before {
    content: "";
    display: inline-block;
    width: 0.7em; height: 0.7em;
    margin-right: 0.35em;
    background: url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%236D533C%22 stroke-width=%222.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M9 6l6 6-6 6%22/%3E%3C/svg%3E') center / contain no-repeat;
    vertical-align: -0.05em;
    transition: transform 0.15s;
}
.gsl-cave-disclaimer[open] summary::before { transform: rotate(90deg); }
.gsl-cave-disclaimer__body {
    padding: 0.2rem 1.2rem 1rem; border-top: 1px solid var(--gsl-db-hover);
}
.gsl-cave-disclaimer__body p {
    color: #333 !important; line-height: 1.6; font-size: 0.84rem; margin: 0.7rem 0 0;
}
/* Cavités page's own "+ Ajouter" sits right after the disclaimer box —
   the shared -2.4rem pull-up would overlap into it, so this placement
   opts out of it with a small top margin instead. */
.gsl-dt-topbar--flush { margin-top: 0.3rem; }
/* Publications' topbar sits right at the top of .gsl-cave-wrap, directly
   under the banner — the shared -2.4rem pull-up crowded it right against
   the banner edge. */
.gsl-dt-topbar--roomy { margin-top: 0.6rem; }
/* Publications' topbar has 2 children (count + "+ Ajouter" link) — pin the
   count to the left so justify-content:flex-end only pushes the link,
   instead of bunching both together on the right. */
.gsl-dt-count--pin-left { margin-right: auto; }
/* ---- Cave Table/Map view toggle ---- */
.gsl-cave-view-toggle {
    display: inline-flex; gap: 0.3rem;
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
}
.gsl-cave-view-btn {
    font-size: 0.82rem; padding: 0.3rem 0.8rem; cursor: pointer;
    border: 1px solid var(--gsl-db-hover); border-radius: 3px;
    background: var(--gsl-db-base); color: #1a1a1a; opacity: 0.65;
}
.gsl-cave-view-btn:hover { opacity: 1; background: var(--gsl-db-btn); }
.gsl-cave-view-btn--active { opacity: 1; background: var(--gsl-db-btn); font-weight: 600; }
.gsl-cave-view-btn:disabled {
    opacity: 0.3; cursor: default; pointer-events: none;
}
.gsl-cave-view-btn:disabled:hover { background: var(--gsl-db-base); }
.gsl-cave-map-wrap { margin-bottom: 1.5rem; }
.gsl-cave-map { height: 520px; border-radius: 4px; border: 1px solid var(--gsl-db-hover); }
.gsl-cave-map-legend {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.9rem;
    margin-top: 0.6rem; font-size: 0.8rem; color: #1a1a1a; opacity: 0.75;
}
.gsl-cave-map-legend__label { font-weight: 600; opacity: 1; }
.gsl-cave-map-legend__item { display: inline-flex; align-items: center; gap: 0.3rem; }
.gsl-cave-map-legend__dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; border: 1px solid rgba(0,0,0,0.3); }
/* ---- Cave table (descent-canyon style) ---- */
.gsl-dt-table-wrap { overflow-x: auto; margin-top: 0.25rem; }
.gsl-col-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.gsl-col-pages { white-space: nowrap; }
/* ---- Cavités page ---- */
.gsl-cave-wrap { color: #1a1a1a; }
.gsl-cave-wrap a { color: #1a1a1a !important; }
.gsl-cave-wrap a:hover { color: #3a5070 !important; }
.gsl-col-stars { text-align: center; letter-spacing: 0.05em; color: #c8a84b; white-space: nowrap; }
/* Star icons are now real inline SVGs (self-hosted Twemoji artwork,
   helpers.php's GSL_STAR_FILLED_SVG/_EMPTY_SVG — 2026-08-07 symbol sweep,
   see helpers.php's own docblock), not the plain ★/☆ Unicode characters
   this rule was originally sized for. letter-spacing/color above are now
   no-ops on the SVGs themselves (inline SVG doesn't inherit `color`
   without fill="currentColor", and letter-spacing doesn't apply between
   inline-block elements the way it does between glyphs) — kept anyway
   since the 2 remaining <option>-based spots (cavites.php's filter
   dropdown and edit-modal select, which can't hold SVG/HTML at all) still
   render plain ★ text and still need this styling. A small explicit gap
   replaces what letter-spacing was providing for the table's own icons. */
.gsl-col-stars svg { vertical-align: -2px; }
.gsl-col-stars svg + svg { margin-left: 1px; }
.gsl-cave-map-legend__item svg { vertical-align: -2px; }
.gsl-badge { font-size: 0.9em; padding: 2px 6px; border-radius: 3px; white-space: nowrap; font-weight: 500; }
.gsl-badge--private { background: rgba(180,60,60,0.15); color: #c04040; }
.gsl-badge--public  { background: rgba(60,140,60,0.12); color: #3a8a3a; }
.gsl-cave-code {
    font-size: 0.7rem; font-family: monospace;
    background: rgba(109,83,60,0.2); color: var(--gsl-accent);
    border-radius: 2px; padding: 0.05rem 0.35rem; margin-right: 0.4rem;
    vertical-align: middle;
}
.gsl-diff { font-size: 0.78rem; padding: 0.1rem 0.45rem; border-radius: 2px; display: inline-block; }
.gsl-diff--facile    { background: rgba(77,91,72,0.5);  color: #aed4a0; }
.gsl-diff--moyen     { background: rgba(109,83,60,0.5); color: #d4b48a; }
.gsl-diff--difficile { background: rgba(151,60,32,0.4); color: #e8957a; }
.gsl-diff--expert    { background: rgba(120,60,180,0.5); color: #d4a8ff; }
/* override on light background */
.gsl-cave-wrap .gsl-diff--facile    { background: rgba(77,130,60,0.2);  color: #2a5a1a; }
.gsl-cave-wrap .gsl-diff--moyen     { background: rgba(60,110,180,0.18); color: #1a3a6b; }
.gsl-cave-wrap .gsl-diff--difficile { background: rgba(180,60,20,0.15); color: #8b2000; }
.gsl-cave-wrap .gsl-diff--expert    { background: rgba(120,40,180,0.15); color: #5a1a8b; }
.gsl-dt-form-row--three { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0 1.2rem; }
.gsl-dt-form-row--four { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 0 1.2rem; }
/* Caractère spans columns 1-2 of a --four row (2026-08-09, per Anna's
   request) — used only inside the modal's Caractère/checkboxes row,
   where the checkbox list needs more room than one quarter-width column
   and the neighboring column had nothing else in it anyway. Safe under
   theme.css's narrow-viewport collapse to grid-template-columns: 1fr too
   — a span:2 on a 1-column grid is simply a no-op, not a layout bug. */
.gsl-dt-form-row--span2 { grid-column: span 2; }
.gsl-cave-form-checks { display: flex; flex-wrap: wrap; gap: .3rem 1.2rem; }
.gsl-cave-form-checks label {
    display: inline-flex; align-items: center; gap: .4rem; text-transform: none;
    font-size: .85rem; font-weight: 400; color: rgba(255,255,255,.75); letter-spacing: normal;
    margin-bottom: 0;
}
.gsl-cave-current-file { display: block; font-size: .78rem; color: rgba(255,255,255,.5); font-style: italic; margin-top: .3rem; }
/* ---- Single cave fiche ---- */
.gsl-fiche { margin-top: 2rem; }
.single-cavite .gsl-fiche { color: #1a1a1a; }
.single-cavite .gsl-fiche a { color: #1a1a1a !important; }
.single-cavite .gsl-fiche a:hover { color: #3a5070 !important; }
.single-cavite .gsl-fiche__pdf-btn { background: var(--gsl-db-btn) !important; color: #1a1a1a !important; }
.single-cavite .gsl-fiche__pdf-btn:hover { background: var(--gsl-db-hover) !important; }
.single-cavite .gsl-fiche__topo-btn { color: #1a1a1a !important; border-color: var(--gsl-db-hover) !important; background: transparent !important; }
.single-cavite .gsl-fiche__topo-btn:hover { background: rgba(180,188,196,0.3) !important; }
.single-cavite .gsl-cave-fiche td { color: #1a1a1a !important; border-color: var(--gsl-db-hover) !important; }
.single-cavite .gsl-fiche__h { color: #1a1a1a !important; }
.single-cavite .gsl-diff--facile    { background: rgba(77,130,60,0.2);   color: #2a5a1a; }
.single-cavite .gsl-diff--moyen     { background: rgba(60,110,180,0.18); color: #1a3a6b; }
.single-cavite .gsl-diff--difficile { background: rgba(180,60,20,0.15);  color: #8b2000; }
.single-cavite .gsl-diff--expert    { background: rgba(120,40,180,0.15); color: #5a1a8b; }
/* Back button — also shares its row with the cave_interdite warning
   notice (2026-08-09, per Anna's request, refined the same day: "the
   goal is for it to appear higher up, but without cramping the buttons/
   links already there, especially in narrower viewport" — a plain flex
   row + wrap, not absolute-positioned centering against the row's full
   width, since an earlier absolute-centered version fought with the back
   link at real in-between viewport widths, exactly the cramping this
   asked to avoid). flex-wrap lets the notice sit beside the back link
   when there's room and drop to its own centered line below when there
   isn't — no fixed breakpoint needed, it responds to the actual
   available width at any viewport. */
.gsl-fiche__back {
    display: flex; align-items: center; flex-wrap: wrap; gap: 0.6rem 1rem;
    margin-bottom: 1.2rem;
}
.gsl-fiche__back-btn {
    font-size: 0.82rem; color: #5a6070 !important;
    text-decoration: none !important; opacity: 0.75;
    transition: opacity 0.15s;
}
.gsl-fiche__back-btn:hover { opacity: 1; color: #3a5070 !important; }
.gsl-fiche__actions { display: flex; gap: 0.75rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.gsl-fiche__pdf-btn, .gsl-fiche__topo-btn {
    display: inline-block; padding: 0.5rem 1.1rem; border-radius: 3px;
    font-size: 0.88rem; text-decoration: none !important; cursor: pointer;
}
.gsl-fiche__pdf-btn {
    background: var(--gsl-accent); color: #1a1a1a !important; transition: color 0.15s;
}
.gsl-fiche__pdf-btn:hover, .gsl-fiche__pdf-btn:focus,
.gsl-cave-wrap a.gsl-fiche__pdf-btn:hover, .gsl-cave-wrap a.gsl-fiche__pdf-btn:focus,
.single-cavite .gsl-fiche a.gsl-fiche__pdf-btn:hover, .single-cavite .gsl-fiche a.gsl-fiche__pdf-btn:focus {
    background: var(--gsl-highlight); color: #fff !important;
}
.gsl-fiche__topo-btn {
    background: transparent; color: var(--gsl-accent) !important;
    border: 1px solid var(--gsl-accent);
}
.gsl-fiche__topo-btn:hover { background: rgba(109,83,60,0.15); }
.gsl-fiche__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.gsl-fiche__cols--three { grid-template-columns: 0.6fr 1fr 1.6fr; }
@media (max-width: 900px) { .gsl-fiche__cols--three { grid-template-columns: 1fr 1fr; } }
@media (max-width: 700px) { .gsl-fiche__cols { grid-template-columns: 1fr; } }
.gsl-fiche__map { margin-top: 1rem; border-radius: 3px; overflow: hidden; line-height: 0; }
.gsl-leaflet-map { width: 100%; height: 240px; border-radius: 3px; }
.gsl-fiche__h {
    font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.07em;
    color: var(--gsl-accent); border-bottom: 1px solid rgba(109,83,60,0.3);
    padding-bottom: 0.4rem; margin-bottom: 0.9rem; font-weight: 600;
}
/* "Coordonnées approximatives" warning (2026-08-08) — the ⚠ next to
   "Localisation GPS" and its explanatory legend line. Same warning color
   (#e0a030) already used site-wide for this exact category of "not a
   confirmed value" flag (#gsl-cave-country-warning, theme.css;
   #gsl-blog-draft-countdown, same file). Needs the real .single-cavite-
   scoped selector, not a bare class, for the same specificity reason
   .gsl-fiche__h/.gsl-cave-fiche td above already need it — this is
   .entry-content text on the single-cave fiche page, and a plain class
   here would lose to that page's own dark-body-text rule. */
.gsl-cave-coords-warning { color: #e0a030; font-size: 0.85em; }
.single-cavite .gsl-cave-coords-warning-legend {
    font-size: 0.78rem; color: #e0a030 !important; font-style: italic;
    margin: -0.4rem 0 0.9rem; line-height: 1.4;
}
/* "Accès interdit" warning banner (2026-08-09) — sits beside
   .gsl-fiche__back (the "← Retour aux cavités" link) in the same flex
   row, moving it higher up the page than a standalone block below
   .gsl-fiche__actions would (Anna's real goal — "appear higher up,
   without cramping the buttons/links already there").

   Split into two elements, #gsl-cave-interdite-notice-wrap (outer) and
   #gsl-cave-interdite-notice (inner, the actual visible box) — found
   necessary after 2 rounds of feedback that pulled in opposite
   directions: growing the box itself to center it made it "unnecessarily
   wide" on a wide screen (Anna's report), but removing grow entirely
   left it stuck flush against the back link instead of centered on the
   row (Anna's next report, from the screenshot). Giving flex:1 + centering
   to the WRAPPER (invisible, no padding/background of its own) while the
   box inside keeps its own intrinsic width/padding resolves both at
   once: the wrapper claims the row's remaining space and centers the box
   within it, but the box's visible footprint never stretches beyond its
   own content + padding.

   Not a hard center-of-body-width lock (an earlier version tried that
   via absolute positioning, but it fought with the back link at real
   in-between viewport widths — exactly the cramping the "higher up,
   without cramping" refinement asked to avoid). .gsl-fiche__back's own
   flex-wrap (see "Back button" above) drops this to its own full-width
   centered line once there's genuinely no room beside the back link, at
   any viewport width — no fixed breakpoint to maintain. Same #e0a030
   warning-yellow already used site-wide for this category of flag (the
   coords-approximate warning just above, #gsl-cave-country-warning/
   #gsl-blog-draft-countdown in theme.css) — but this one needs a real ID
   selector for its color, not just a class, for the exact same reason
   the two theme.css precedents do: .wp-site-blocks:has(.gsl-cave-wrap)
   .entry-content p (specificity ~0,3,0, !important) is this single-cave
   page's own dark-body-text rule and would otherwise win against a plain
   class. This notice's own text sits in a <span>, not a <p>, so that
   particular rule can't actually match it — the ID is used anyway to
   stay consistent with this file's own established defensive pattern
   rather than relying on markup-shape coincidence. */
#gsl-cave-interdite-notice-wrap {
    display: flex; justify-content: center;
    flex: 1 1 auto; min-width: 0;
}
#gsl-cave-interdite-notice {
    display: flex; align-items: center; justify-content: center; gap: 0.5rem;
    flex: 0 1 auto; padding: 0.35rem 0.75rem;
    background: rgba(224,160,48,0.12); border: 1px solid #e0a030;
    border-radius: 6px; color: #8a5f10 !important; text-align: center;
    font-weight: 600; font-size: 0.85rem; line-height: 1.3;
}
#gsl-cave-interdite-notice .gsl-cave-interdite-notice__icon {
    flex: 0 0 auto; color: #e0a030; width: 16px; height: 16px;
}
.gsl-cave-fiche {
    width: 100%; border-collapse: collapse; font-size: 0.88rem;
}
.gsl-cave-fiche th, .gsl-cave-fiche td {
    padding: 0.45rem 0.6rem; border-bottom: 1px solid rgba(109,83,60,0.15); text-align: left;
}
.gsl-cave-fiche th { width: 42%; opacity: 0.6; font-weight: 500; padding-left: 0; }
/* Narrower label column specifically for the "Localisation GPS" table —
   its own labels (Entrée/Parking/Altitude) are short, and the value cell
   needs the extra room now that it holds coordinates + 2 map links
   (Google Maps + Swisstopo/OSM) instead of 1, so they fit on one line
   more often. Scoped to --gps only, not the shared 42% default above,
   since "Données techniques" values don't need the extra space. */
.gsl-cave-fiche--gps th { width: 22%; }
.gsl-cave-fiche tr:last-child th, .gsl-cave-fiche tr:last-child td { border-bottom: none; }
.gsl-gps-coords { font-family: monospace; font-size: 0.85rem; }
.gsl-gps-links { display: block; margin-top: 0.3rem; }
.gsl-gps-link { font-size: 0.78rem; color: var(--gsl-accent) !important; text-decoration: none !important; margin-right: 0.7rem; }
.gsl-gps-link:hover { color: var(--gsl-highlight) !important; }
.gsl-fiche__pdf-preview { width: 100%; height: 420px; border: 1px solid rgba(109,83,60,0.25); display: block; background: #fff; }
.single-cavite .gsl-fiche__pdf-preview { border-color: var(--gsl-db-hover); }
/* Topographie gallery (v10.34: multiple images/pages) — one image per
   "row," a plain flowing stack with no visible table frame or divider
   between images (Anna's explicit spec — not a bordered/gridded card
   layout). Single column, a small gap for breathing room only (not a
   drawn rule); object-fit: contain handles portrait/landscape without
   cropping either way, no separate orientation detection needed. White
   background per image since a scanned topo is normally black-on-white
   paper — a dark page background made it look like a printing error. */
.gsl-fiche__topo-gallery { margin-top: 2rem; }
.gsl-fiche__topo-grid {
    display: grid; grid-template-columns: 1fr; gap: 1.5rem;
}
.gsl-fiche__topo-item {
    margin: 0; background: #fff;
}
.gsl-fiche__topo-item a { display: block; line-height: 0; }
.gsl-fiche__topo-item img.gsl-topo-img {
    width: 100%; max-height: 720px; object-fit: contain; cursor: zoom-in;
}
.gsl-fiche__rigging { margin-top: 2rem; }
.gsl-rigging-table { width: 100%; border-collapse: collapse; font-size: 0.86rem; }
.gsl-rigging-table th, .gsl-rigging-table td {
    padding: 0.4rem 0.6rem; border-bottom: 1px solid rgba(109,83,60,0.15); text-align: left;
}
.gsl-rigging-table thead th { opacity: 0.6; font-weight: 600; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; }
.gsl-rigging-table tr:last-child td { border-bottom: none; }
.gsl-rigging-table__puits { font-weight: 600; white-space: nowrap; color: var(--gsl-accent); }
.gsl-rigging-table__notes { opacity: 0.7; font-style: italic; }
.single-cavite .gsl-rigging-table th,
.single-cavite .gsl-rigging-table td { color: #1a1a1a !important; border-color: var(--gsl-db-hover) !important; }
/* ---- Publications: PDF "read" link (icon + label) ---- */
.gsl-pub-pdf-link { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.3rem 0.7rem; border-radius: 4px; background: rgba(163,133,95,0.15); color: #a3855f !important; text-decoration: none !important; border: 1px solid rgba(163,133,95,0.4); font-size: 0.85rem; font-weight: 600; transition: background 0.15s, border-color 0.15s; }
.gsl-pub-pdf-link:hover { background: rgba(163,133,95,0.28); border-color: rgba(163,133,95,0.6); }
.gsl-pub-pdf-icon { flex-shrink: 0; }