/* ============================================================
 * FIELD GUIDE theme — AD PLATES
 * Frames for the engine's paid slots (render_ad / network_ad),
 * built from the same parts as the rest of the guide: cream card,
 * hairline rules, small-caps label, copper italic meta.
 * Paid  -> solid ink frame, "Advertisement".
 * House -> dashed frame (same language as .claim), an invitation
 *          plus the real rate from cfg('ad_slot_prices').
 * Loaded by app/templates/fieldguide/head.php.
 * ============================================================ */

.fg-adrow{margin:44px 0;}
.fg-adrow--top{margin:16px 0 0;}
.fg-adrow--tight{margin:36px 0 0;}

/* ---------- shared frame ---------- */
.fg-ad{display:block;background:var(--card);border:1px solid var(--ink);}
.fg-ad-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  padding:9px 18px;border-bottom:1px solid var(--ink);background:var(--paper);}
.fg-ad-label{font-size:9.5px;letter-spacing:.2em;color:var(--ink-faint);font-weight:600;}
.fg-ad-meta{font-family:var(--serif);font-style:italic;font-size:13px;color:var(--copper);
  white-space:nowrap;}

/* the .ad-slot div is emitted by helpers.php render_ad() */
.fg-ad .ad-slot{padding:22px 24px;font-family:var(--serif);font-size:17px;line-height:1.5;
  color:var(--ink-soft);text-align:center;}
.fg-ad .ad-slot strong,.fg-ad .ad-slot b{font-weight:600;color:var(--ink);}
.fg-ad .ad-slot a{display:block;color:inherit;}
.fg-ad .ad-slot img{display:block;margin:0 auto;height:auto;}
.fg-ad .ad-slot p{margin:0;}
.fg-ad .ad-slot p + p{margin-top:8px;}

.fg-ad-foot{border-top:1px solid var(--line);padding:9px 18px;text-align:right;}
.fg-ad-foot a{font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  color:var(--green);}
.fg-ad-foot a:hover{color:var(--copper);}

/* ---------- house fallback: an invitation, not a broken box ---------- */
.fg-ad.is-house{background:transparent;border:1px dashed var(--line-dark);}
.fg-ad.is-house .fg-ad-head{background:transparent;border-bottom:1px dashed var(--line-dark);}
.fg-ad.is-house .ad-slot{color:var(--ink-soft);}
.fg-ad.is-house .ad-slot a:hover strong{color:var(--copper);}
.fg-ad.is-house .fg-ad-foot{border-top:1px dashed var(--line-dark);}

/* paid plates carry a copper tick in the corner, like a plate number */
.fg-ad.is-paid .fg-ad-label{color:var(--ink);}

/* ---------- plate: full-width body slot ---------- */
.fg-ad--plate .ad-slot{padding:20px 26px;}
/* the house plate reads as a two-part notice: the offer, then the way in */
.fg-ad--plate.is-house{display:grid;grid-template-columns:1fr auto;align-items:stretch;}
.fg-ad--plate.is-house .fg-ad-head{grid-column:1/-1;}
.fg-ad--plate.is-house .ad-slot{font-size:18px;text-align:left;padding:18px 26px;
  align-self:center;}
.fg-ad--plate.is-house .fg-ad-foot{border-top:0;border-left:1px dashed var(--line-dark);
  display:flex;align-items:center;padding:0 26px;}

/* ---------- rail: the entry sidebar ---------- */
.fg-ad--rail{margin-top:36px;}
.fg-ad--rail .fg-ad-head{padding:8px 16px;}
.fg-ad--rail .ad-slot{padding:18px 18px;font-size:15.5px;line-height:1.45;text-align:left;}
.fg-ad--rail .fg-ad-foot{padding:8px 16px;text-align:left;}

/* ---------- strip: one hairline-ruled line under the masthead ---------- */
.fg-ad--strip{display:flex;align-items:baseline;gap:20px;background:transparent;border:0;
  border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);padding:10px 0;}
.fg-ad--strip.is-house{background:transparent;border:0;
  border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);}
.fg-ad--strip .fg-ad-head{display:contents;}
.fg-ad--strip .fg-ad-head::before,.fg-ad--strip .fg-ad-head::after{content:none;}
.fg-ad--strip .fg-ad-label{flex:none;padding:0;background:none;border:0;line-height:1.6;}
.fg-ad--strip .fg-ad-meta{flex:none;margin-left:auto;order:3;}
.fg-ad--strip .ad-slot{flex:1;padding:0;text-align:left;font-size:15.5px;line-height:1.6;
  min-width:0;}
.fg-ad--strip .ad-slot a{display:inline;}

/* ---------- dark: inside the footer ---------- */
.fg-adband{border-bottom:1px solid rgba(207,198,176,.15);}
.fg-adband .wrap{padding-top:16px;padding-bottom:16px;}
.fg-ad--dark,.fg-ad--dark.is-house{display:flex;align-items:baseline;gap:20px;
  background:transparent;border:0;padding:0;}
.fg-ad--dark .fg-ad-head,.fg-ad--dark.is-house .fg-ad-head{display:contents;}
.fg-ad--dark .fg-ad-label{flex:none;color:#8A8270;line-height:1.6;}
.fg-ad--dark .fg-ad-meta{flex:none;margin-left:auto;order:3;color:#C89A6A;}
.fg-ad--dark .ad-slot{flex:1;padding:0;text-align:left;font-size:15px;line-height:1.6;
  color:#A79E86;min-width:0;}
.fg-ad--dark .ad-slot a:hover{color:#C89A6A;}
.fg-ad--dark .ad-slot strong,.fg-ad--dark .ad-slot b{color:#F0EADA;font-weight:600;}
.fg-ad--dark .ad-slot a{display:inline;}
.fg-ad--dark .ad-slot a:hover strong{color:#C89A6A;}

/* ---------- network (AdSense etc.): frame only, no editorial voice ---- */
.fg-ad.is-net .ad-slot{padding:14px;text-align:center;}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .fg-adrow{margin:34px 0;}
  .fg-ad--rail{margin-top:28px;}
}
@media (max-width:640px){
  .fg-ad--strip,.fg-ad--dark{display:block;}
  .fg-ad--strip .fg-ad-head,.fg-ad--dark .fg-ad-head{display:flex;justify-content:space-between;
    gap:12px;padding:0 0 6px;background:transparent;border:0;}
  .fg-ad--strip .fg-ad-meta,.fg-ad--dark .fg-ad-meta{margin-left:0;}
  .fg-ad .ad-slot,.fg-ad--plate .ad-slot{padding:18px;font-size:16px;}
  .fg-ad--strip .ad-slot,.fg-ad--dark .ad-slot{padding:0;}
  /* the two-part house plate stacks rather than squeezing the CTA */
  .fg-ad--plate.is-house{display:block;}
  .fg-ad--plate.is-house .ad-slot{padding:18px;font-size:16.5px;}
  .fg-ad--plate.is-house .fg-ad-foot{border-left:0;border-top:1px dashed var(--line-dark);
    display:block;padding:9px 18px;text-align:left;}
}
