/* =========================================================
   PARA Podcast – Single episode
   - Layout CSS for templates/single-episode.php
   - Én selector per linje + forklarende kommentarer
   - Bruker samme tema-variabler som hub (frontend-hub.css)
   ========================================================= */

/* Wrapper: samme “post-bredde” */
body.para-is-mobile .para-pod{ padding:0; }
.para-pod{ max-width:1320px; margin:0 auto; padding:0 clamp(16px,6vw,80px) clamp(36px,6vw,70px); }
.para-pod-article{ max-width:992px; margin:0 auto; }

/* Sørg for at single også får “podkast-bakgrunn” slik hub gjør */
body.para-podcast .para-site{ background:var(--pp-bg); color:var(--pp-text); }

/* ---------------------------------------------------------
   Hero
   --------------------------------------------------------- */
.para-pod-hero{ margin:18px 0 0; position:relative; }
.para-pod-hero-media{ position:relative; border-radius:10px; overflow:hidden; background:var(--pp-card); border:1px solid var(--pp-border); box-shadow:var(--pp-shadow-soft); }
.para-pod-hero-img{ width:100%; height:560px; display:block; object-fit:cover; }
.para-pod-hero-img--placeholder{ background:linear-gradient(135deg, rgba(37,99,235,.18), rgba(17,24,39,.08)); }
body.para-podcast.pp-theme-dark .para-pod-hero-img--placeholder{ background:linear-gradient(135deg, rgba(96,165,250,.22), rgba(0,0,0,.28)); }

/* Episodenummer: rund badge */
.para-pod-hero-num{ position:absolute; top:14px; right:14px; z-index:3; display:flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:50%; background:#fff; color:#333; font-weight:900; font-size:22px; letter-spacing:-.02em; line-height:1; backdrop-filter:blur(4px); }

/* Spiller henger ned fra bildet (midlertidig) */
.para-pod-hero-player{ position:absolute; left:16px; right:16px; bottom:-15px; z-index:4; background:var(--pp-card); border:1px solid var(--pp-border); border-radius:12px; padding:10px !important; box-shadow:var(--pp-shadow); }
.para-pod-after-hero-spacer{ height:10px; }
.para-pod-audio{ width:100%; display:block; }
.para-pod-player-missing{ font-size:14px; color:var(--pp-muted); }

/* ---------------------------------------------------------
   Topbar under hero: breadcrumb venstre + fargevelger høyre
   --------------------------------------------------------- */
.para-pod-topbar{ max-width:1360px; margin:0 auto; font-size:14px; opacity:.92; }
.para-pod-topbar--below-hero{ margin-top:30px; }
.para-pod-topbar-inner{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; max-width:992px; margin:0 auto; }
.para-pod-breadcrumb{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; color:var(--pp-text); }
.para-pod-breadcrumb a{ text-decoration:none; color:inherit; }
.para-pod-breadcrumb a:hover{ color:var(--para-color-primary); text-decoration:underline; }
.para-pod-breadcrumb .sep{ opacity:.6; }
.para-pod-breadcrumb .current{ opacity:.85; }
.para-pod-tools{ margin-left:auto; display:flex; align-items:center; justify-content:flex-end; }
@media (max-width: 900px){ .para-pod-breadcrumb .current{ display:none; } }
@media (max-width: 768px){ font-size:13px;} }


/* ---------------------------------------------------------
   Header
   --------------------------------------------------------- */
.para-pod-header{ padding:18px 0 10px; text-align:left; }
.para-pod-series-name{ font-size:14px; letter-spacing:.14em; text-transform:uppercase; color:var(--pp-muted); margin:0 0 8px; font-weight:900; }
.para-pod-title{ margin:0; line-height:1.1; font-size:clamp(28px,3vw,42px); letter-spacing:-.02em; color:var(--pp-text); }

/* ---------------------------------------------------------
   Content (ingen dropcap)
   --------------------------------------------------------- */
.para-pod-content{ margin:18px 0 0; line-height:1.6; font-size:var(--para-body-size); color:var(--pp-text); }
.para-pod-content p{ margin:0 0 1.05em; }
.para-pod-content a{ color:inherit; }
.para-pod-content a:hover{ color:var(--para-color-primary); }
.para-pod-content p:first-of-type::first-letter{ float:none; font-size:inherit; line-height:inherit; padding:0; margin:0; }

/* ---------------------------------------------------------
   Divider + footer/meta
   --------------------------------------------------------- */
.para-pod-divider{ margin:28px 0 20px; border:0; border-top:1px solid rgba(0,0,0,.08); }
body.para-podcast.pp-theme-dark .para-pod-divider{ border-top-color:rgba(255,255,255,.10); }
.para-pod-footer{ display:grid; gap:14px; font-size:14px; color:var(--pp-text); }
.para-pod-published strong, .para-pod-updated strong{ font-weight:700; }
.para-pod-updated {margin-top: -10px;}

/* ---------------------------------------------------------
   Prev/Next + episodenummer-badge til høyre
   --------------------------------------------------------- */
.para-pod-prevnext{ display:grid; gap:12px; grid-template-columns:1fr 1fr; margin-top:15px; }
.para-prevnext-item{ border:1px solid var(--pp-border); background:var(--pp-card); border-radius:8px; padding:20px; box-shadow:var(--pp-shadow-soft); }
.para-prevnext-item.is-empty{ visibility:hidden; }
.para-prevnext-label{ display:block; font-size:12px; color:var(--pp-muted); font-weight:700; margin-bottom:6px; }
.para-prevnext-a{ display:flex; align-items:center; justify-content:space-between; gap:10px; text-decoration:none; color:inherit; }
.para-prevnext-title{ font-weight:700; font-size:18px; color:var(--pp-text); }
.para-prevnext-ep{ display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:var(--pp-active-bg); border:1px solid rgba(0,0,0,.10); font-size:12px; font-weight:900; color:var(--pp-text); flex:0 0 auto; }
body.para-podcast.pp-theme-dark .para-prevnext-ep{ border-color:rgba(255,255,255,.14); }
.para-prevnext-a:hover .para-prevnext-title{ color:var(--para-color-primary); }
.para-prevnext-item.para-prevnext-next{ text-align:right; }

/* ---------------------------------------------------------
   Responsiv
   --------------------------------------------------------- */
@media (max-width:768px){ .para-pod-hero-img{ height:360px; } }
@media (max-width:768px){ .para-pod-hero-player{ left:12px; right:12px; } }
@media (max-width:768px){ .para-pod-prevnext{ grid-template-columns:1fr; } }
@media (max-width:768px){ .para-prevnext-title{ font-size:16px; } }

/* =========================================================
   FIX: Innhold (shownotes) må alltid være synlig
   - Overstyr evt. post/dropcap-regler fra tema/post.css
   ========================================================= */

/* Tving normal tekstflyt/farge */
.para-pod .para-pod-content{ display:block; visibility:visible; opacity:1; color:var(--pp-text); }
.para-pod .para-pod-content *{ visibility:visible; opacity:1; }

/* Dropcap-kill (robust, tåler !important i tema) */
.para-pod .para-pod-content p:first-of-type::first-letter{ float:none !important; font-size:inherit !important; line-height:inherit !important; padding:0 !important; margin:0 !important; color:inherit !important; background:none !important; }

/* =========================================================
   FIX: Prev/Next i mørkt tema
   ========================================================= */

body.para-podcast.pp-theme-dark .para-prevnext-item{ background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.12); }
body.para-podcast.pp-theme-dark .para-prevnext-label{ color:rgba(255,255,255,.62); }
body.para-podcast.pp-theme-dark .para-prevnext-title{ color:rgba(255,255,255,.92); }
body.para-podcast.pp-theme-dark .para-prevnext-ep{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.14); color:rgba(255,255,255,.92); }
body.para-podcast.pp-theme-dark .para-prevnext-a:hover .para-prevnext-title{ color:var(--para-color-primary); }


/* Hero-player wrapper skal ikke “dobbel-styles” når vi bruker para-audio-card */
.para-pod-hero-player{ background:transparent; border:0; padding:0; box-shadow:none; }
.para-pod-audio-card{ margin:0; } /* wp-audioplayer.css har margin:30px 0 */