/*
Theme Name: World of Music – Exact Reference V15
Version: 15.1.0
Description: Exakte visuelle Vorlage mit echtem laut.fm Player und Live-Songdaten.
*/
html,body{margin:0;padding:0;background:#160b07}
body{font-family:Arial,Helvetica,sans-serif}
.reference-site{width:100%;min-height:100vh;background:#160b07}
.reference-home{
  position:relative;
  width:100%;
  max-width:1200px;
  margin:0 auto;
  line-height:0;
  overflow:hidden;
  background:#160b07;
}
.reference-image{
  display:block;
  width:100%;
  height:auto;
  margin:0;
  padding:0;
}
.reference-nav,
.footer-hotspots{
  position:absolute;
  left:0;right:0;
  pointer-events:none;
}
.reference-nav{top:0;height:100%}
.reference-nav a,
.footer-hotspots a{
  position:absolute;
  display:block;
  color:transparent;
  text-decoration:none;
  pointer-events:auto;
  background:transparent;
}
.reference-nav a:focus,
.footer-hotspots a:focus{
  outline:2px solid #d8ae4c;
  outline-offset:2px;
}

/* Player sits inside the radio display from the reference artwork. */
.live-player{
  position:absolute;
  left:22.8%;
  top:21.7%;
  width:54.2%;
  height:8.0%;
  z-index:5;
  overflow:hidden;
  border-radius:8px;
  background:#17100d;
  box-shadow:0 0 0 2px #d8ae4c, 0 3px 10px rgba(0,0,0,.45);
}
.live-player iframe{
  display:block;
  width:100%!important;
  height:150px!important;
  min-height:150px!important;
  border:0!important;
  margin:0!important;
}

/* Live current/last-song panel overlays the static song text in the reference. */
.live-now-panel{
  position:absolute;
  left:1.2%;
  top:37.4%;
  width:22.5%;
  height:27.0%;
  z-index:6;
  padding:1.1% 1.0%;
  color:#17120f;
  background:rgba(255,248,235,.97);
  border:2px solid rgba(181,139,80,.95);
  border-radius:7px;
  box-shadow:0 3px 9px rgba(70,35,12,.25);
  line-height:1.25;
  overflow:hidden;
}
.live-current{
  padding-bottom:8px;
  border-bottom:1px solid #d9c8ae;
}
.live-label{
  display:block;
  font-family:Georgia,serif;
  font-style:italic;
  font-weight:700;
  font-size:clamp(15px,1.55vw,23px);
}
.live-current strong{
  display:block;
  margin-top:8px;
  font-size:clamp(12px,1.2vw,18px);
}
.live-current span:last-child{
  display:block;
  font-size:clamp(11px,1.05vw,16px);
}
.live-last h2{
  margin:8px 0 4px;
  font-family:Georgia,serif;
  font-style:italic;
  font-size:clamp(13px,1.25vw,18px);
}
.last-song{
  display:flex;
  gap:7px;
  padding:4px 0;
  border-bottom:1px solid #e2d5c2;
  font-size:clamp(9px,.88vw,13px);
}
.last-song span{min-width:32px;color:#6f5c47}
.last-song b{font-weight:600}

/* Right column: real schedule, filling the former chat position. */
.live-schedule-panel{
  position:absolute;
  right:1.2%;
  top:37.4%;
  width:22.5%;
  height:27.0%;
  z-index:6;
  padding:1.1% 1.0%;
  color:#17120f;
  background:rgba(255,248,235,.97);
  border:2px solid rgba(181,139,80,.95);
  border-radius:7px;
  box-shadow:0 3px 9px rgba(70,35,12,.25);
  line-height:1.3;
  overflow:hidden;
}
.live-schedule-panel h2{
  margin:0 0 8px;
  padding-bottom:7px;
  border-bottom:1px solid #d9c8ae;
  font-family:Georgia,serif;
  font-style:italic;
  font-size:clamp(15px,1.55vw,23px);
}
.live-schedule-panel table{
  width:100%;
  border-collapse:collapse;
}
.live-schedule-panel td{
  padding:5px 2px;
  border-bottom:1px solid #e2d5c2;
  font-size:clamp(9px,.9vw,13px);
}
.live-schedule-panel a{
  display:block;
  margin-top:10px;
  padding:7px 8px;
  border-radius:6px;
  background:#3a3835;
  color:#fff;
  text-decoration:none;
  text-align:center;
  font-size:clamp(9px,.85vw,12px);
}

@media(max-width:700px){
  .reference-home{width:100%;max-width:100%}
  /* On mobile the full reference remains visible; functional live panels scale with it. */
  .live-player{
    left:22.8%;
    top:21.7%;
    width:54.2%;
    height:8%;
  }
  .live-player iframe{height:150px!important}
  .live-now-panel{
    left:1.2%;
    top:37.4%;
    width:22.5%;
    height:27%;
    padding:1% .8%;
  }
  .live-schedule-panel{
    right:1.2%;
    top:37.4%;
    width:22.5%;
    height:27%;
    padding:1% .8%;
  }
  .live-now-panel .live-label,
  .live-schedule-panel h2{font-size:clamp(11px,2.8vw,17px)}
  .live-current strong{font-size:clamp(8px,2.2vw,13px)}
  .live-current span:last-child,
  .last-song,
  .live-schedule-panel td,
  .live-schedule-panel a{font-size:clamp(7px,1.7vw,11px)}
  .last-song{gap:3px;padding:2px 0}
  .last-song span{min-width:24px}
  .live-schedule-panel td{padding:3px 1px}
  .live-schedule-panel a{margin-top:4px;padding:4px 3px}
}
@media(max-width:420px){
  .live-now-panel,.live-schedule-panel{border-width:1px}
  .live-current{padding-bottom:3px}
  .live-last h2{margin:3px 0 2px}
  .last-song{display:block}
  .last-song span{display:none}
  .live-schedule-panel h2{margin-bottom:3px;padding-bottom:3px}
}


/* Musikwunsch-Seite – passend zur World-of-Music-Retrooptik */
.wom-request-page{min-height:100vh;padding:34px 18px 60px;background:radial-gradient(circle at top,#6b3b20 0,#2a1710 42%,#160b07 100%);box-sizing:border-box;color:#24160f}
.wom-request-shell{max-width:980px;margin:0 auto}
.wom-request-kicker{display:inline-block;margin-bottom:10px;padding:7px 13px;border:1px solid #d8ae4c;border-radius:999px;background:#74131b;color:#f7e6c5;font:700 12px/1 Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;box-shadow:0 3px 12px rgba(0,0,0,.3)}
.wom-request-card{position:relative;overflow:hidden;border:3px solid #d8ae4c;border-radius:18px;background:linear-gradient(145deg,#fff8eb,#ead6b5);box-shadow:0 18px 45px rgba(0,0,0,.45)}
.wom-request-card:before{content:"";position:absolute;inset:10px;border:1px solid rgba(116,19,27,.28);border-radius:12px;pointer-events:none}
.wom-request-inner{position:relative;padding:38px clamp(20px,5vw,58px)}
.wom-request-title{margin:0;color:#74131b;font:700 clamp(34px,6vw,64px)/.95 Georgia,serif;text-align:center;text-transform:uppercase;text-shadow:1px 2px 0 #fff}
.wom-request-subtitle{max-width:680px;margin:14px auto 30px;color:#5b4636;font:italic 18px/1.5 Georgia,serif;text-align:center}
.wom-request-form{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.wom-request-field{display:flex;flex-direction:column;gap:7px}
.wom-request-field.full{grid-column:1/-1}
.wom-request-field label{font:700 13px/1.2 Arial,sans-serif;color:#4b3426;text-transform:uppercase;letter-spacing:.06em}
.wom-request-field input,.wom-request-field textarea{width:100%;box-sizing:border-box;border:2px solid #c3a779;border-radius:10px;background:#fffdf7;color:#24160f;padding:13px 14px;font:16px/1.35 Arial,sans-serif;box-shadow:inset 0 2px 5px rgba(80,40,10,.08)}
.wom-request-field textarea{min-height:105px;resize:vertical}
.wom-request-field input:focus,.wom-request-field textarea:focus{outline:2px solid #d8ae4c;outline-offset:1px;border-color:#8d671e}
.wom-request-submit{grid-column:1/-1;display:flex;justify-content:center;padding-top:6px}
.wom-request-button{border:2px solid #e0c27a;border-radius:10px;padding:15px 28px;background:linear-gradient(#b31e29,#74131b);color:#fff8eb;font:700 16px/1 Arial,sans-serif;letter-spacing:.05em;cursor:pointer;box-shadow:0 5px 0 #4b0c11,0 10px 18px rgba(70,20,10,.22);transition:transform .12s ease,filter .12s ease}
.wom-request-button:hover{filter:brightness(1.08);transform:translateY(-1px)}
.wom-request-button:active{transform:translateY(3px);box-shadow:0 2px 0 #4b0c11,0 5px 10px rgba(70,20,10,.18)}
.wom-request-note{margin:22px 0 0;text-align:center;color:#6b5745;font:13px/1.5 Arial,sans-serif}
.wom-request-alert{margin:0 auto 20px;max-width:980px;border-radius:10px;padding:14px 16px;font:600 14px/1.4 Arial,sans-serif}
.wom-request-alert.success{background:#e9f2df;border:1px solid #8fa96d;color:#29431a}
.wom-request-alert.error{background:#f6e2dc;border:1px solid #b36a58;color:#5d1f14}
.wom-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important}
@media(max-width:680px){
  .wom-request-page{padding:18px 10px 38px}
  .wom-request-inner{padding:28px 18px}
  .wom-request-form{grid-template-columns:1fr;gap:15px}
  .wom-request-field.full,.wom-request-submit{grid-column:auto}
  .wom-request-title{font-size:clamp(34px,12vw,52px)}
  .wom-request-subtitle{font-size:16px;margin-bottom:24px}
  .wom-request-card{border-width:2px;border-radius:13px}
}

/* -------------------------------------------------------------------------
 * Startseite: Wunschbox über die komplette untere Wunsch-/News-Zeile.
 * Die beiden dekorativen Vinylhälften greifen die Radio-/Jukebox-Optik auf.
 * ------------------------------------------------------------------------- */
.home-request-panel{
  position:absolute;
  left:.15%;
  right:.15%;
  top:65.65%;
  width:auto;
  height:20.05%;
  z-index:7;
  box-sizing:border-box;
  color:#17120f;
  background:linear-gradient(180deg,rgba(255,249,238,.99),rgba(241,224,195,.985));
  border:2px solid rgba(181,139,80,.98);
  border-radius:9px;
  box-shadow:0 4px 12px rgba(45,20,8,.32),inset 0 0 0 1px rgba(255,255,255,.6);
  line-height:1.2;
  overflow:hidden;
}
.home-request-panel:before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(116,19,27,.24);
  border-radius:6px;
  pointer-events:none;
}
.home-request-content{
  position:relative;
  z-index:3;
  width:68%;
  height:100%;
  margin:0 auto;
  box-sizing:border-box;
  padding:1.1% 0 .7%;
}
.home-request-head{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  margin-bottom:7px;
  padding-bottom:5px;
  border-bottom:1px solid #d9c8ae;
}
.home-request-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  width:29px;
  height:29px;
  border-radius:50%;
  background:#74131b;
  color:#f7e6c5;
  font:700 19px/1 Georgia,serif;
  box-shadow:0 2px 4px rgba(0,0,0,.2),inset 0 0 0 1px #e0c27a;
}
.home-request-head h2{
  margin:0;
  color:#74131b;
  font-family:Georgia,serif;
  font-style:italic;
  font-size:clamp(16px,1.55vw,23px);
}
.home-request-head p{
  margin:2px 0 0;
  color:#6b5745;
  font-size:clamp(9px,.85vw,12px);
}
.home-request-form{
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
}
.home-request-form input{
  width:100%;
  min-width:0;
  box-sizing:border-box;
  height:32px;
  padding:6px 9px;
  border:1px solid #c3a779;
  border-radius:7px;
  background:#fffdf7;
  color:#24160f;
  font:clamp(10px,.9vw,13px)/1.2 Arial,sans-serif;
  box-shadow:inset 0 1px 3px rgba(80,40,10,.08);
}
.home-request-form input:focus{
  outline:2px solid #d8ae4c;
  outline-offset:1px;
  border-color:#8d671e;
}
.home-request-form button{
  grid-column:1/-1;
  width:100%;
  height:32px;
  border:2px solid #e0c27a;
  border-radius:7px;
  background:linear-gradient(#b31e29,#74131b);
  color:#fff8eb;
  font:700 clamp(10px,.9vw,13px)/1 Arial,sans-serif;
  letter-spacing:.02em;
  cursor:pointer;
  box-shadow:0 3px 0 #4b0c11,0 5px 10px rgba(70,20,10,.16);
}
.home-request-form button:hover{filter:brightness(1.08)}
.home-request-more{
  display:block;
  margin-top:5px;
  color:#74131b;
  text-decoration:none;
  text-align:center;
  font:700 clamp(8px,.72vw,11px)/1.2 Arial,sans-serif;
}
.home-request-more:hover{text-decoration:underline}
.home-request-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important}

/* Decorative half-vinyls: each disc is intentionally clipped by the box edge. */
.home-request-vinyl{
  position:absolute;
  z-index:1;
  top:50%;
  width:23%;
  aspect-ratio:1;
  border-radius:50%;
  transform:translateY(-50%);
  background:
    radial-gradient(circle at center,#d8ae4c 0 4%,#74131b 4.5% 7%,#17100d 7.5% 8.5%,transparent 9%),
    repeating-radial-gradient(circle at center,#0b0908 0 2px,#24201d 3px 4px,#0b0908 5px 7px);
  box-shadow:inset 0 0 0 2px rgba(216,174,76,.35),0 8px 15px rgba(30,12,5,.35);
  opacity:.96;
}
.home-request-vinyl:after{
  content:"";
  position:absolute;
  inset:8%;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
}
.home-request-vinyl span{
  position:absolute;
  left:50%;
  top:50%;
  width:11%;
  aspect-ratio:1;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:#d8ae4c;
  box-shadow:0 0 0 3px #17100d,0 0 0 5px #74131b;
}
.home-request-vinyl-left{left:-12.5%}
.home-request-vinyl-right{right:-12.5%}

@media(max-width:700px){
  .home-request-panel{
    left:.15%;
    right:.15%;
    top:65.65%;
    width:auto;
    height:20.05%;
    border-width:1px;
  }
  .home-request-panel:before{inset:4px}
  .home-request-content{width:72%;padding:.9% 0 .5%}
  .home-request-head{gap:5px;margin-bottom:3px;padding-bottom:2px}
  .home-request-icon{width:20px;height:20px;font-size:14px}
  .home-request-head h2{font-size:clamp(10px,2.8vw,17px)}
  .home-request-head p{font-size:clamp(6px,1.65vw,10px)}
  .home-request-form{gap:4px}
  .home-request-form input,.home-request-form button{height:23px;padding:4px 5px;font-size:clamp(6px,1.7vw,10px);border-radius:4px}
  .home-request-more{margin-top:3px;font-size:clamp(5px,1.3vw,8px)}
  .home-request-vinyl{width:27%}
  .home-request-vinyl-left{left:-15%}
  .home-request-vinyl-right{right:-15%}
}
@media(max-width:420px){
  .home-request-content{width:76%}
  .home-request-head{margin-bottom:2px}
  .home-request-form{gap:3px}
  .home-request-form input,.home-request-form button{height:19px;padding:3px 4px}
  .home-request-more{margin-top:2px}
  .home-request-vinyl{width:30%}
  .home-request-vinyl-left{left:-17%}
  .home-request-vinyl-right{right:-17%}
}

/* Feinschliff 06: Originalmaßstab wiederhergestellt – nur Schrift etwas kräftiger */
.live-now-panel .live-label,
.live-now-panel .live-current strong,
.live-now-panel .live-current span:not(.live-label),
.live-now-panel .live-last h2,
.live-now-panel .live-last #wom-last-songs,
.live-now-panel .live-last #wom-last-songs time,
.live-schedule-panel h2,
.live-schedule-panel table,
.live-schedule-panel table th,
.live-schedule-panel table td,
.live-schedule-panel > a{
  font-weight:700 !important;
}

/* Feinschliff 07: genau eine Schriftgröße größer und fett */
.live-now-panel .live-label,
.live-now-panel .live-current strong,
.live-now-panel .live-current span:not(.live-label),
.live-now-panel .live-last h2,
.live-now-panel .live-last #wom-last-songs,
.live-now-panel .live-last #wom-last-songs time,
.live-schedule-panel h2,
.live-schedule-panel table,
.live-schedule-panel table th,
.live-schedule-panel table td,
.live-schedule-panel > a{
  font-size: calc(1em + 1px) !important;
  font-weight:700 !important;
}

/* Shared radio header + navigation for all WordPress subpages. */
.wom-global-header{
  position:relative;
  width:100%;
  max-width:1200px;
  margin:0 auto;
  overflow:hidden;
  background:#160b07;
  line-height:0;
}
.wom-global-header-image{
  display:block;
  width:100%;
  height:auto;
  margin:0;
  padding:0;
}
.wom-global-player{
  left:22.8%;
  top:59.0%;
  width:54.2%;
  height:17.0%;
}
.wom-global-nav{top:0;height:100%;}
.wom-global-nav a{z-index:10;}

/* Keep subpage content visually attached to the same radio shell. */
.reference-site > .card,
.reference-site > .wom-request-page{
  width:100%;
  max-width:1200px;
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
}

@media(max-width:700px){
  .wom-global-player{
    left:22.8%;
    top:59.0%;
    width:54.2%;
    height:17.0%;
  }
}