/* ============================================================
   Mining Claim Listings v2 — Front-End Styles
   Theme: Mountain Man Mining™  (mountainmanmining.com)
   ============================================================ */

:root {
    --mcl-bg:           #0a0b0c;
    --mcl-bg-card:      #131517;
    --mcl-bg-raised:    #1b1e22;
    --mcl-bg-accent:    #212529;
    --mcl-gold:         #d4a017;
    --mcl-gold-light:   #e8c043;
    --mcl-gold-dark:    #a07a10;
    --mcl-gold-subtle:  rgba(212,160,23,.12);
    --mcl-gold-border:  rgba(212,160,23,.28);
    --mcl-text:         #f0ede8;
    --mcl-text-muted:   #8a8780;
    --mcl-text-dim:     #4a4845;
    --mcl-border:       rgba(255,255,255,.07);
    --mcl-border-mid:   rgba(255,255,255,.12);
    --mcl-radius:       6px;
    --mcl-radius-lg:    12px;
    --mcl-font-sans:    -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
    --mcl-font-serif:   Georgia,"Times New Roman",serif;
    --mcl-shadow:       0 6px 32px rgba(0,0,0,.6);
    --mcl-transition:   .2s ease;
}

.mcl-wrap *,.mcl-wrap *::before,.mcl-wrap *::after { box-sizing: border-box; }

/* ═══════════════════════════════════════════
   CLAIM DETAIL CARD
═══════════════════════════════════════════ */
.mcl-wrap {
    background:    var(--mcl-bg-card);
    border:        1px solid var(--mcl-gold-border);
    border-radius: var(--mcl-radius-lg);
    color:         var(--mcl-text);
    font-family:   var(--mcl-font-sans);
    overflow:      hidden;
    box-shadow:    var(--mcl-shadow);
    max-width:     860px;
    margin:        0 auto;
}

/* ── Hero ── */
.mcl-hero { position:relative; width:100%; max-height:400px; overflow:hidden; }
.mcl-hero img { width:100%; height:400px; object-fit:cover; display:block; filter:brightness(.82); }
.mcl-hero-overlay { position:absolute; bottom:0; left:0; right:0; padding:32px 30px 22px; background:linear-gradient(transparent,rgba(0,0,0,.88)); }
.mcl-hero-title { font-family:var(--mcl-font-serif); font-size:clamp(20px,4vw,32px); font-weight:400; font-style:italic; color:#fff; margin:0 0 10px; line-height:1.2; }
.mcl-hero-badges { display:flex; gap:7px; flex-wrap:wrap; }

/* ── Badges ── */
.mcl-badge { display:inline-flex; align-items:center; gap:4px; padding:3px 10px; border-radius:20px; font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.mcl-badge-available { background:rgba(39,174,96,.2);  color:#5dca8a; border:1px solid rgba(39,174,96,.35); }
.mcl-badge-pending   { background:rgba(212,160,23,.2); color:var(--mcl-gold-light); border:1px solid var(--mcl-gold-border); }
.mcl-badge-sold      { background:rgba(192,57,43,.2);  color:#e67e70; border:1px solid rgba(192,57,43,.35); }
.mcl-badge-leased    { background:rgba(52,152,219,.2); color:#7ec8e3; border:1px solid rgba(52,152,219,.35); }
.mcl-badge-type      { background:var(--mcl-gold-subtle); color:var(--mcl-gold-light); border:1px solid var(--mcl-gold-border); }
.mcl-badge-patented  { background:rgba(155,89,182,.18); color:#c39bd3; border:1px solid rgba(155,89,182,.3); }
.mcl-badge-obo       { background:rgba(230,126,34,.18); color:#f0a05a; border:1px solid rgba(230,126,34,.3); }

/* ── Gallery ── */
.mcl-gallery-wrap { border-bottom:1px solid var(--mcl-border); }

/* ── Body ── */
.mcl-body { padding:26px 30px; }

/* ── Price block ── */
.mcl-price-block { display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:24px; padding-bottom:20px; border-bottom:1px solid var(--mcl-border); }
.mcl-price-label { font-size:10px; text-transform:uppercase; letter-spacing:.09em; color:var(--mcl-text-muted); }
.mcl-price-value { font-family:var(--mcl-font-serif); font-size:clamp(26px,5vw,38px); font-weight:400; color:var(--mcl-gold); line-height:1; }
.mcl-price-obo   { font-size:13px; color:var(--mcl-gold-light); font-style:italic; }
.mcl-price-sub   { font-size:13px; color:var(--mcl-text-muted); margin-left:4px; }

/* ── Section heading ── */
.mcl-section-heading { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.11em; color:var(--mcl-gold); margin:22px 0 12px; display:flex; align-items:center; gap:8px; }
.mcl-section-heading::after { content:''; flex:1; height:1px; background:var(--mcl-gold-border); }

/* ── Features grid ── */
.mcl-features-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(188px,1fr)); gap:10px; margin-bottom:4px; }
.mcl-feature { background:var(--mcl-bg-raised); border:1px solid var(--mcl-border); border-radius:var(--mcl-radius); padding:11px 14px; display:flex; align-items:flex-start; gap:11px; transition:border-color var(--mcl-transition); }
.mcl-feature:hover { border-color:var(--mcl-gold-border); }
.mcl-feature-icon { width:32px; height:32px; border-radius:6px; background:var(--mcl-gold-subtle); border:1px solid var(--mcl-gold-border); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--mcl-gold); }
.mcl-feature-icon svg { width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }
.mcl-feature-label { font-size:9px; text-transform:uppercase; letter-spacing:.06em; color:var(--mcl-text-muted); margin-bottom:2px; }
.mcl-feature-value { font-size:13px; font-weight:500; color:var(--mcl-text); line-height:1.3; }

/* ── Map ── */
.mcl-map-wrap { margin:0 0 6px; border-radius:var(--mcl-radius); overflow:hidden; border:1px solid var(--mcl-border); }
.mcl-map-container { width:100%; }
.mcl-map-marker { cursor:pointer; }
.mapboxgl-popup-content { background:#131517 !important; color:#f0ede8 !important; border:1px solid rgba(212,160,23,.3) !important; border-radius:6px !important; padding:10px 14px !important; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important; font-size:13px !important; box-shadow:0 4px 20px rgba(0,0,0,.6) !important; }
.mapboxgl-popup-content strong { color:#d4a017; display:block; margin-bottom:2px; }
.mapboxgl-popup-content small { color:#8a8780; font-size:11px; }
.mapboxgl-popup-tip { border-top-color:#131517 !important; }
.mapboxgl-ctrl-group { background:#131517 !important; border:1px solid rgba(212,160,23,.2) !important; }
.mapboxgl-ctrl-group button { background:#131517 !important; border-bottom:1px solid rgba(212,160,23,.15) !important; }
.mapboxgl-ctrl-group button .mapboxgl-ctrl-icon { filter:invert(1) sepia(1) saturate(2) hue-rotate(10deg) brightness(0.9); }
.mcl-notice { color:var(--mcl-text-muted); font-size:13px; font-style:italic; padding:12px 0; }

/* ── Minerals ── */
.mcl-minerals-row { display:flex; flex-wrap:wrap; gap:6px; margin-top:5px; }
.mcl-mineral-pill { background:var(--mcl-gold-subtle); border:1px solid var(--mcl-gold-border); color:var(--mcl-gold-light); padding:4px 12px; border-radius:20px; font-size:12px; font-weight:500; }

/* ── Notes / geology ── */
.mcl-notes-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:10px; }
.mcl-note-block { background:var(--mcl-bg-raised); border:1px solid var(--mcl-border); border-left:3px solid var(--mcl-gold-dark); border-radius:var(--mcl-radius); padding:12px 14px; }
.mcl-note-label { font-size:9px; text-transform:uppercase; letter-spacing:.07em; color:var(--mcl-gold); margin-bottom:5px; }
.mcl-note-value { font-size:13px; color:var(--mcl-text); line-height:1.55; }

/* ── Description ── */
.mcl-description { font-size:15px; line-height:1.8; color:var(--mcl-text); }
.mcl-description p { margin:0 0 1em; }

/* ── Video ── */
.mcl-video-wrap { margin:4px 0 6px; }
.mcl-video-inner { position:relative; padding-bottom:56.25%; height:0; overflow:hidden; border-radius:var(--mcl-radius); border:1px solid var(--mcl-border); }
.mcl-video-inner iframe { position:absolute; top:0; left:0; width:100%; height:100%; }

/* ── Doc links ── */
.mcl-doc-links { display:flex; flex-direction:column; gap:6px; }
.mcl-doc-category { font-size:10px; text-transform:uppercase; letter-spacing:.07em; color:var(--mcl-text-muted); margin:0 0 4px; }
.mcl-doc-link { display:inline-flex; align-items:center; gap:7px; color:var(--mcl-gold-light); text-decoration:none; font-size:13px; padding:7px 12px; background:var(--mcl-bg-raised); border:1px solid var(--mcl-border); border-radius:var(--mcl-radius); transition:border-color var(--mcl-transition),color var(--mcl-transition); width:fit-content; }
.mcl-doc-link:hover { border-color:var(--mcl-gold-border); color:#fff; }
.mcl-doc-link .mcl-feature-icon { width:22px; height:22px; border:none; background:transparent; }
.mcl-doc-link .mcl-feature-icon svg { width:13px; height:13px; }
.mcl-mrds-links { list-style:none; padding:0; margin:4px 0 0; display:flex; flex-direction:column; gap:5px; }
.mcl-mrds-links li a { display:inline-flex; align-items:center; gap:5px; color:var(--mcl-gold-light); text-decoration:none; font-size:13px; }
.mcl-mrds-links li a:hover { color:#fff; text-decoration:underline; }

/* ── Coords link ── */
.mcl-coords-link { color:var(--mcl-gold-light); text-decoration:none; font-size:13px; }
.mcl-coords-link:hover { color:#fff; }

/* ── Contact card ── */
.mcl-contact-card { display:flex; align-items:center; gap:14px; background:var(--mcl-bg-raised); border:1px solid var(--mcl-gold-border); border-radius:var(--mcl-radius-lg); padding:16px 20px; margin-top:20px; flex-wrap:wrap; }
.mcl-contact-card > .mcl-feature-icon { width:42px; height:42px; border-radius:50%; flex-shrink:0; }
.mcl-contact-card > .mcl-feature-icon svg { width:18px; height:18px; }
.mcl-contact-body { flex:1; min-width:160px; }
.mcl-contact-name { font-size:15px; font-weight:500; color:var(--mcl-text); margin:0 0 3px; }
.mcl-contact-detail { font-size:13px; color:var(--mcl-text-muted); margin:0 0 2px; }
.mcl-contact-detail a { color:var(--mcl-gold-light); text-decoration:none; }
.mcl-contact-detail a:hover { color:#fff; }
.mcl-offer-btn { display:inline-flex; align-items:center; gap:6px; background:var(--mcl-gold); color:#0a0b0c; font-weight:700; font-size:14px; padding:10px 20px; border-radius:var(--mcl-radius); text-decoration:none; letter-spacing:.02em; transition:background var(--mcl-transition),transform var(--mcl-transition); white-space:nowrap; }
.mcl-offer-btn:hover { background:var(--mcl-gold-light); transform:translateY(-1px); }

/* ── Divider ── */
hr.mcl-divider { border:none; border-top:1px solid var(--mcl-border); margin:22px 0; }

/* ═══════════════════════════════════════════
   CLAIMS LIST GRID
═══════════════════════════════════════════ */
.mcl-claims-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:18px; }
.mcl-claim-card { background:var(--mcl-bg-card); border:1px solid var(--mcl-border); border-radius:var(--mcl-radius-lg); overflow:hidden; color:var(--mcl-text); font-family:var(--mcl-font-sans); transition:border-color var(--mcl-transition),transform var(--mcl-transition); box-shadow:var(--mcl-shadow); }
.mcl-claim-card:hover { border-color:var(--mcl-gold-border); transform:translateY(-2px); }
.mcl-claim-card img { width:100%; height:165px; object-fit:cover; display:block; filter:brightness(.85); }
.mcl-claim-card-body { padding:14px 16px; }
.mcl-claim-card-body h3 { font-family:var(--mcl-font-serif); font-size:17px; font-weight:400; font-style:italic; color:var(--mcl-text); margin:0 0 5px; }
.mcl-claim-card-body h3 a { color:inherit; text-decoration:none; }
.mcl-claim-card-body h3 a:hover { color:var(--mcl-gold-light); }
.mcl-meta { font-size:12px; color:var(--mcl-text-muted); margin:0 0 6px; }
.mcl-minerals { font-size:11px; color:var(--mcl-gold); margin:0 0 9px; letter-spacing:.03em; }
.mcl-price { font-family:var(--mcl-font-serif); font-size:22px; color:var(--mcl-gold); margin:0 0 8px; font-style:italic; }
.mcl-status { font-size:10px; font-weight:700; padding:3px 10px; border-radius:20px; display:inline-block; letter-spacing:.04em; text-transform:uppercase; }
.mcl-status-available { background:rgba(39,174,96,.2);  color:#5dca8a; border:1px solid rgba(39,174,96,.35); }
.mcl-status-pending   { background:rgba(212,160,23,.2); color:var(--mcl-gold-light); border:1px solid var(--mcl-gold-border); }
.mcl-status-sold      { background:rgba(192,57,43,.2);  color:#e67e70; border:1px solid rgba(192,57,43,.35); }
.mcl-status-leased    { background:rgba(52,152,219,.2); color:#7ec8e3; border:1px solid rgba(52,152,219,.35); }

/* ── Map direction buttons ── */
.mcl-map-actions { display:flex; gap:8px; padding:10px 0 2px; flex-wrap:wrap; }
.mcl-dir-btn { display:inline-flex; align-items:center; gap:6px; padding:8px 14px; background:var(--mcl-bg-raised); border:1px solid var(--mcl-border-mid); border-radius:var(--mcl-radius); color:var(--mcl-gold-light); text-decoration:none; font-size:13px; font-weight:500; cursor:pointer; transition:border-color var(--mcl-transition),background var(--mcl-transition),color var(--mcl-transition); font-family:inherit; }
.mcl-dir-btn:hover { border-color:var(--mcl-gold-border); background:var(--mcl-gold-subtle); color:#fff; }
.mcl-dir-btn svg { flex-shrink:0; }
.mcl-share-trigger { background:var(--mcl-gold-subtle); border-color:var(--mcl-gold-border); }

/* ── QR code overlay ── */
.mcl-qr-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.75); z-index:99999; align-items:center; justify-content:center; }
.mcl-qr-card { background:var(--mcl-bg-card); border:1px solid var(--mcl-gold-border); border-radius:var(--mcl-radius-lg); padding:28px 32px; text-align:center; box-shadow:0 8px 40px rgba(0,0,0,.7); max-width:320px; }
.mcl-qr-title { font-size:14px; font-weight:500; color:var(--mcl-text); margin:0 0 16px; }
.mcl-qr-img { border-radius:6px; margin:0 auto 12px; display:block; }
.mcl-qr-claim { font-family:var(--mcl-font-serif); font-style:italic; font-size:15px; color:var(--mcl-gold); margin:0 0 4px; }
.mcl-qr-coords { font-size:12px; color:var(--mcl-text-muted); margin:0 0 16px; }
.mcl-qr-close { padding:8px 20px; background:var(--mcl-bg-raised); border:1px solid var(--mcl-border-mid); border-radius:var(--mcl-radius); color:var(--mcl-text); cursor:pointer; font-size:13px; font-family:inherit; }
.mcl-qr-close:hover { border-color:var(--mcl-gold-border); }

/* ── AI summary ── */
.mcl-ai-summary { font-size:14px; line-height:1.8; color:var(--mcl-text-muted); border-left:3px solid var(--mcl-gold-dark); padding-left:16px; margin:6px 0 0; }
.mcl-ai-summary p { margin:0 0 1em; }

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width:620px) {
    .mcl-body { padding:18px 16px; }
    .mcl-features-grid { grid-template-columns:1fr 1fr; }
    .mcl-notes-grid { grid-template-columns:1fr; }
    .mcl-hero img { height:230px; }
    .mcl-hero-overlay { padding:20px 16px 14px; }
    .mcl-contact-card { flex-direction:column; align-items:flex-start; }
    .mcl-offer-btn { width:100%; justify-content:center; }
    .mcl-map-actions { flex-direction:column; }
    .mcl-dir-btn { justify-content:center; }
    .mcl-qr-card { margin:0 16px; }
}
