@charset "UTF-8";
*{box-sizing:border-box}
html{min-height:100%;background:#020712}
body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% -15%,#142c5c 0,#071225 38%,#020712 75%);background-attachment:fixed;color:#fff;font:15px/1.45 "Segoe UI",Tahoma,Arial,sans-serif}
a{color:#8fc0ff;text-decoration:none}a:hover{color:#fff}
#jukebox-brand{width:min(1180px,94vw);height:175px;margin:0 auto;display:flex;align-items:center;justify-content:center;overflow:visible}
#jukebox-brand img{display:block;width:min(1050px,92vw);max-height:170px;object-fit:contain;filter:drop-shadow(0 9px 16px rgba(0,0,0,.6))}
#page{width:min(1220px,calc(100% - 32px));margin:0 auto 30px;padding:16px;border:1px solid #26456f;border-radius:13px;background:rgba(2,8,18,.88);box-shadow:0 22px 65px rgba(0,0,0,.48);overflow:hidden}
#logo{height:auto;min-height:92px;margin:0 0 22px;padding:18px 12px 22px;border-bottom:1px solid #29415f;font-size:42px;font-weight:900;display:flex;align-items:center;justify-content:space-between}
#logo>a{color:#fff;text-shadow:2px 2px 0 #000}
#listener_count{font-size:13px;font-weight:700;padding:10px 14px;border:1px solid #315b91;border-radius:999px;background:#08162b;white-space:nowrap}
#navigation,#top_requests,#partner-links{float:left;clear:left;width:185px;margin:0 18px 14px 0}
#navigation dl,#top_requests dl{margin:0;padding:0;overflow:hidden;border:1px solid #28496f;border-radius:10px;background:#07152a}
#navigation dt,#top_requests dt{padding:12px 13px;background:linear-gradient(#17396d,#102a51);font-weight:900;text-transform:uppercase;letter-spacing:.04em}
#navigation dd,#top_requests dd{margin:0;border-top:1px solid #183353}
#navigation dd a,#top_requests dd a{display:block;padding:11px 10px;color:#fff}
#navigation dd a:hover,#top_requests dd a:hover{background:#112e57}
#navigation img{width:22px;height:22px;margin-right:10px;vertical-align:middle;object-fit:contain}
#currently_playing_wrapper,#coming-up_wrapper,#recently_played_wrapper,#playlist,#search{margin-left:203px;margin-bottom:15px}
#currently_playing,#coming-up,#recently_played{overflow:hidden;border:1px solid #294c78;border-radius:10px;background:#071426;box-shadow:0 10px 25px rgba(0,0,0,.22)}
.section-title,.recent-head{min-height:42px;padding:11px 14px;background:linear-gradient(90deg,#173a75,#0d2a57);font-size:14px;font-weight:900;text-transform:uppercase;letter-spacing:.035em}
.section-title{display:flex;justify-content:space-between}
.now-grid{display:grid;grid-template-columns:210px minmax(0,1fr) 80px;gap:24px;align-items:center;padding:18px 16px 20px;background:linear-gradient(115deg,#10213b,#071326)}
#cpPictureMainSong{display:block!important;width:190px;height:190px;object-fit:cover;border:1px solid #496a91;border-radius:9px;box-shadow:0 10px 25px rgba(0,0,0,.45)}
.song-actions{display:flex;gap:10px;margin-top:13px;justify-content:center}
.song-actions img,.recent-links img{width:30px;height:30px;padding:4px;object-fit:contain;border-radius:7px;background:#fff;border:1px solid #79a6df}
.now-label{color:#8cbcff;font-size:18px;font-weight:800}
#currently-playing-title{margin:5px 0 20px;font-size:30px;line-height:1.1;font-weight:900;color:#fff;text-shadow:1px 2px 0 #000}
.now-meta{margin:6px 0;font-size:17px;font-weight:650}.now-meta span{font-weight:800}
.now-time{text-align:right;font-size:18px;font-weight:900}
.requested{display:inline-block;margin-top:7px;padding:3px 8px;border-radius:999px;background:#183b72;color:#d9eaff;font-size:12px;font-weight:800}
.dedication-card{margin-top:18px;padding:12px 14px;border-left:3px solid #4f8fe9;border-radius:6px;background:#0c1c32;color:#e8f2ff}
.coming-list{padding:14px}
.coming-card{display:flex;gap:22px;align-items:center;min-height:145px;padding:0 8px}
.coming-cover img{display:block!important;width:135px;height:135px;object-fit:cover;border:1px solid #41658e;border-radius:8px}
.coming-info{font-size:16px}.coming-info strong{display:block;margin-bottom:5px;color:#fff;font-size:21px}.coming-info span{color:#82b8ff;font-weight:800}
.recent-head{display:grid;grid-template-columns:minmax(0,1fr) 130px 280px 70px;gap:12px}
.recent-head span:nth-child(2){text-align:center}.recent-head span:last-child{text-align:right}
.recent-row{display:grid;grid-template-columns:minmax(0,1fr) 130px 280px 70px;gap:12px;align-items:center;min-height:76px;padding:8px 14px;border-top:1px solid #172b45;background:#081426}
.recent-row:nth-child(even){background:#0b192c}
.recent-song{display:flex;align-items:center;gap:15px;font-weight:650}
.recent-song .rpPicture{display:block!important;width:60px;height:60px;object-fit:cover;border:1px solid #3f638c;border-radius:7px}
.recent-links{display:flex;justify-content:center;gap:7px}.recent-links img{width:27px;height:27px}
.recent-album{font-weight:650}.recent-time{text-align:right;font-weight:900}
#footer{clear:both;margin-top:28px;padding:18px 10px 4px;border-top:1px solid #213b5d;text-align:center;color:#8799b0}
.error,.success{margin-left:203px;padding:12px;border-radius:8px}.error{background:#4a1717}.success{background:#174526}
@media(max-width:850px){
 #jukebox-brand{height:125px}#jukebox-brand img{max-height:120px}
 #page{width:calc(100% - 14px);padding:9px}
 #logo{font-size:30px;display:block;text-align:center}#listener_count{display:table;margin:12px auto 0}
 #navigation,#top_requests,#partner-links{float:none;width:100%;margin:0 0 12px}
 #currently_playing_wrapper,#coming-up_wrapper,#recently_played_wrapper,#playlist,#search,.error,.success{margin-left:0}
 .now-grid{grid-template-columns:1fr;text-align:center}.now-cover{margin:auto}.now-time{text-align:center}
 .recent-head{display:none}.recent-row{grid-template-columns:1fr 100px}.recent-album,.recent-time{display:none}
}

/* ===== RADIO TORDENSKRALL: FUNKLENDE STJERNEHIMMEL ===== */
html{min-height:100%;background:#01050d}
body{position:relative;isolation:isolate;min-height:100vh;background:radial-gradient(ellipse at 50% -15%,rgba(20,55,112,.46) 0,rgba(6,20,43,.92) 36%,#01050d 76%);background-attachment:fixed}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.78;background-image:radial-gradient(circle at 7% 11%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 14% 36%,#8fc7ff 0 1px,transparent 1.7px),radial-gradient(circle at 23% 18%,#fff 0 1.2px,transparent 1.8px),radial-gradient(circle at 31% 63%,#72b5ff 0 1px,transparent 1.6px),radial-gradient(circle at 39% 28%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 47% 79%,#b9dcff 0 1.2px,transparent 1.8px),radial-gradient(circle at 54% 13%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 62% 48%,#78baff 0 1px,transparent 1.7px),radial-gradient(circle at 69% 24%,#fff 0 1.1px,transparent 1.7px),radial-gradient(circle at 76% 72%,#a8d5ff 0 1px,transparent 1.6px),radial-gradient(circle at 84% 17%,#fff 0 1.2px,transparent 1.8px),radial-gradient(circle at 91% 55%,#6fb2ff 0 1px,transparent 1.6px),radial-gradient(circle at 97% 31%,#fff 0 1px,transparent 1.5px);background-size:173px 149px,211px 181px,257px 203px,193px 239px,229px 167px,281px 221px,197px 257px,263px 193px,223px 271px,289px 211px,241px 179px,277px 247px,199px 229px;animation:rtStarDrift 55s linear infinite,rtStarSoftTwinkle 5.5s ease-in-out infinite alternate}
body::after{content:"";position:fixed;inset:-3%;pointer-events:none;z-index:0;opacity:.72;background:radial-gradient(circle at 11% 24%,rgba(255,255,255,.95) 0 1.3px,rgba(90,170,255,.38) 2px,transparent 7px),radial-gradient(circle at 27% 72%,rgba(255,255,255,.92) 0 1.5px,rgba(60,145,255,.32) 2.5px,transparent 8px),radial-gradient(circle at 43% 14%,rgba(255,255,255,.95) 0 1.4px,rgba(100,185,255,.36) 2px,transparent 8px),radial-gradient(circle at 58% 58%,rgba(255,255,255,.90) 0 1.3px,rgba(70,155,255,.30) 2px,transparent 7px),radial-gradient(circle at 73% 31%,rgba(255,255,255,.98) 0 1.6px,rgba(100,185,255,.42) 2.5px,transparent 9px),radial-gradient(circle at 88% 76%,rgba(255,255,255,.94) 0 1.4px,rgba(65,150,255,.35) 2px,transparent 8px),radial-gradient(ellipse at 18% 68%,rgba(20,91,190,.10),transparent 27%),radial-gradient(ellipse at 82% 23%,rgba(28,92,210,.12),transparent 30%);filter:drop-shadow(0 0 4px rgba(75,155,255,.40));animation:rtBigStarTwinkle 3.8s ease-in-out infinite alternate,rtStarFloat 28s ease-in-out infinite alternate}
#jukebox-brand,#page{position:relative;z-index:2}
@keyframes rtStarDrift{from{background-position:0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0}to{background-position:55px 28px,-36px 42px,31px -25px,-48px 33px,27px 39px,-29px -31px,41px 22px,-33px 36px,26px -41px,-39px 24px,37px 31px,-25px -34px,44px 29px}}
@keyframes rtStarSoftTwinkle{0%{opacity:.48;filter:brightness(.82)}45%{opacity:.82;filter:brightness(1.12)}100%{opacity:.62;filter:brightness(.94)}}
@keyframes rtBigStarTwinkle{0%{opacity:.32;filter:drop-shadow(0 0 2px rgba(75,155,255,.25)) brightness(.82)}35%{opacity:.82;filter:drop-shadow(0 0 7px rgba(100,180,255,.58)) brightness(1.28)}67%{opacity:.50;filter:drop-shadow(0 0 3px rgba(75,155,255,.32)) brightness(.96)}100%{opacity:.92;filter:drop-shadow(0 0 9px rgba(125,195,255,.62)) brightness(1.38)}}
@keyframes rtStarFloat{from{transform:translate3d(-.5%,0,0) scale(1.01)}to{transform:translate3d(.8%,-.7%,0) scale(1.035)}}
@media (prefers-reduced-motion:reduce){body::before,body::after{animation:none!important}}

/* ===== PLAYLIST / REQUESTS: TYDELIG SKILLE MELLOM LÅTENE ===== */
#playlist table{
    border-collapse:separate !important;
    border-spacing:0 8px !important;
}
#playlist table tbody tr{
    background:linear-gradient(90deg,rgba(10,28,54,.98),rgba(5,17,34,.98)) !important;
    box-shadow:inset 0 0 0 1px rgba(62,111,170,.65),0 3px 10px rgba(0,0,0,.18);
}
#playlist table tbody tr:nth-child(even){
    background:linear-gradient(90deg,rgba(13,34,64,.98),rgba(7,21,40,.98)) !important;
}
#playlist table tbody td{
    padding-top:9px !important;
    padding-bottom:9px !important;
    border-top:1px solid rgba(72,126,190,.35);
    border-bottom:1px solid rgba(72,126,190,.35);
    vertical-align:middle;
}
#playlist table tbody td:first-child{
    border-left:1px solid rgba(72,126,190,.35);
    border-radius:9px 0 0 9px;
}
#playlist table tbody td:last-child{
    border-right:1px solid rgba(72,126,190,.35);
    border-radius:0 9px 9px 0;
}
#playlist table tbody tr:hover{
    background:linear-gradient(90deg,rgba(20,53,99,.98),rgba(10,29,55,.98)) !important;
}

/* ===== TESTPAKKE 4: FAST PLAYLIST-GEOMETRI + TEMAKNAPPER ===== */

/* Lås hele resultat-tabellen så lange/manglende titler ikke flytter kolonnene */
#playlist table{
    width:100% !important;
    table-layout:fixed !important;
    border-collapse:separate !important;
    border-spacing:0 8px !important;
}

/* Faste rad-høyder */
#playlist table tbody tr{
    height:64px !important;
}
#playlist table tbody td{
    height:64px !important;
    max-height:64px !important;
    padding:7px 8px !important;
    vertical-align:middle !important;
    overflow:hidden !important;
}

/* Kolonnebredder – gammel playlist bruker flere små celler i samme rad */
#playlist table tbody td:first-child{
    width:42px !important;
    min-width:42px !important;
    max-width:42px !important;
    text-align:center;
}

/* Covere skal aldri få blåse opp raden */
#playlist table tbody img:not([src*="request"]):not([src*="home"]):not([src*="info"]){
    max-width:52px !important;
    max-height:52px !important;
    object-fit:cover !important;
}

/* Lang tekst: én linje, fast bredde, ... på slutten */
#playlist table tbody td{
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
}
#playlist table tbody td a{
    max-width:100%;
}

/* Gjør alle gamle form-knapper til samme blå Tordenskrall-stil */
#search input[type="submit"],
#search input[type="button"],
#search button,
#search .characterButton,
#playlist input[type="submit"],
#playlist input[type="button"],
#playlist button{
    appearance:none;
    -webkit-appearance:none;
    min-height:30px;
    padding:4px 10px !important;
    border:1px solid #2d73cf !important;
    border-radius:5px !important;
    background:linear-gradient(180deg,#1761c4 0%,#0a3f91 100%) !important;
    color:#fff !important;
    font-family:"Segoe UI",Tahoma,Arial,sans-serif !important;
    font-weight:800 !important;
    text-shadow:0 1px 1px #061b3d;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 5px rgba(0,0,0,.25);
    cursor:pointer;
}
#search input[type="submit"]:hover,
#search input[type="button"]:hover,
#search button:hover,
#search .characterButton:hover,
#playlist input[type="submit"]:hover,
#playlist input[type="button"]:hover,
#playlist button:hover{
    background:linear-gradient(180deg,#2677df 0%,#0c4cac 100%) !important;
    border-color:#5aa0ff !important;
}

/* Bokstav-filteret: faste, like knapper */
#search .characterButton{
    display:inline-block !important;
    min-width:29px !important;
    height:30px !important;
    line-height:20px !important;
    margin:2px 1px !important;
    text-align:center !important;
    text-decoration:none !important;
}

/* Søkefelt/selects inn i samme tema */
#search input[type="text"],
#search select{
    min-height:30px;
    padding:4px 8px;
    border:1px solid #315d91;
    border-radius:4px;
    background:#08172b;
    color:#fff;
    outline:none;
}
#search input[type="text"]:focus,
#search select:focus{
    border-color:#5798e9;
    box-shadow:0 0 0 2px rgba(65,137,225,.18);
}

/* De gamle blå request-bildene får en roligere innramming */
#playlist table tbody td img{
    vertical-align:middle;
}


/* ===== TESTPAKKE 5: ALT MOT VENSTRE + MER PLASS TIL ARTIST/TITTEL ===== */

/*
   Den gamle SAM-tabellen består av mange separate TD-celler.
   Vi presser inn de små tekniske kolonnene og gir tekstfeltet mest mulig plass.
*/
#playlist table {
    width: 100% !important;
    table-layout: fixed !important;
}

/* Ingen kunstig sentrering i resultatene */
#playlist table tbody td {
    text-align: left !important;
}

/* Låtnummer */
#playlist table tbody td:nth-child(1) {
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    padding-left: 5px !important;
    padding-right: 3px !important;
}

/* Cover */
#playlist table tbody td:nth-child(2) {
    width: 62px !important;
    min-width: 62px !important;
    max-width: 62px !important;
    padding-left: 3px !important;
    padding-right: 6px !important;
}

/* ARTIST + TITTEL: hovedfeltet får resten av plassen */
#playlist table tbody td:nth-child(3) {
    width: auto !important;
    padding-left: 4px !important;
    padding-right: 8px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}
#playlist table tbody td:nth-child(3) a {
    display: block !important;
    width: 100% !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}

/* Request/link-knapper: bare plassen de faktisk trenger */
#playlist table tbody td:nth-child(4) {
    width: 128px !important;
    min-width: 128px !important;
    max-width: 128px !important;
    padding-left: 3px !important;
    padding-right: 3px !important;
    white-space: nowrap !important;
}

/* Album: behold nyttig plass, men ikke stjel halve raden */
#playlist table tbody td:nth-child(5) {
    width: 205px !important;
    min-width: 205px !important;
    max-width: 205px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}

/* Tid helt til slutt */
#playlist table tbody td:nth-child(6) {
    width: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
    padding-left: 4px !important;
    padding-right: 6px !important;
    text-align: right !important;
}

/* Hvis gammel markup har tomme mellomceller, ikke la dem lage digre hull */
#playlist table tbody td:empty {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Overskriftene følger samme venstreorienterte uttrykk */
#playlist table thead th {
    text-align: left !important;
}

/* Mobil: album får vike før artist/tittel */
@media (max-width: 900px) {
    #playlist table tbody td:nth-child(5),
    #playlist table thead th:nth-child(5) {
        display: none !important;
    }
    #playlist table tbody td:nth-child(4) {
        width: 118px !important;
        min-width: 118px !important;
        max-width: 118px !important;
    }
}


/* ===== TESTPAKKE 7: RETT OPP ETTER BAMBUSEN =====
   Behold boksene/kolonnene fra Testpakke 5.
   Flytt KUN innholdet internt mot venstre.
   Ingen kollapsing av tabellceller.
*/

/* Resultatrader beholder full bredde og normal tabellgeometri */
#playlist table{
    width:100% !important;
    table-layout:fixed !important;
}

/* Alt innhold inni cellene starter ved venstre kant */
#playlist table tbody td{
    text-align:left !important;
    vertical-align:middle !important;
}

/* Nummer: litt luft, men ikke sentrert */
#playlist table tbody td:first-child{
    text-align:left !important;
    padding-left:7px !important;
}

/* Coverbilder: VENSTRESTILLES INNI SIN EKSISTERENDE BOKS */
#playlist table tbody td img{
    margin-left:0 !important;
    margin-right:auto !important;
}

/* Hvis coveret ligger inni en lenke, skal lenken heller ikke sentrere */
#playlist table tbody td a{
    text-align:left !important;
}

/* Artist/tittel: start ved venstre kant av sin egen celle og bruk hele cella */
#playlist table tbody td:nth-child(3){
    text-align:left !important;
    padding-left:5px !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
}
#playlist table tbody td:nth-child(3) a{
    display:block !important;
    width:100% !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
}

/* Linkknappene starter ved venstre kant av link-kolonnen */
#playlist table tbody td:nth-child(4){
    text-align:left !important;
    padding-left:4px !important;
}

/* Album starter ved venstre kant av album-kolonnen */
#playlist table tbody td:nth-child(5){
    text-align:left !important;
    padding-left:5px !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
}

/* Tid får lov å stå til høyre – det er naturlig for tidskolonnen */
#playlist table tbody td:last-child{
    text-align:right !important;
    padding-right:8px !important;
}

/* Overskrifter følger kolonnene uten å flytte selve kolonnene */
#playlist table thead th{
    text-align:left !important;
}
#playlist table thead th:last-child{
    text-align:right !important;
}


/* ===== TESTPAKKE 9: BYGGET MOT DEN FAKTISKE display.playlist.php ===== */

/* Ekte seksjonsfaner/overskrifter tilbake og tydelig justert */
#playlist table thead th{
    height:40px !important;
    padding:9px 8px !important;
    background:linear-gradient(180deg,#173d77 0%,#102e5b 100%) !important;
    border-top:1px solid #315e96 !important;
    border-bottom:1px solid #315e96 !important;
    color:#fff !important;
    font-weight:900 !important;
    text-transform:uppercase;
    letter-spacing:.03em;
}
#playlist table thead th:first-child{border-radius:7px 0 0 7px}
#playlist table thead th:last-child{border-radius:0 7px 7px 0;text-align:right!important}

/* Viktig: seks ekte kolonner, uten nth-child-gjetting */
#playlist table{
    width:100% !important;
    table-layout:fixed !important;
}
#playlist .pl-num{
    width:34px !important;
    padding:6px 2px 6px 7px !important;
    text-align:left !important;
}
#playlist .pl-cover{
    width:68px !important;
    padding:6px 6px 6px 2px !important;
    text-align:left !important;
}
#playlist .pl-cover a,
#playlist .pl-cover img{
    display:block !important;
    margin:0 !important;
}
#playlist .pl-cover img{
    width:58px !important;
    height:58px !important;
    max-width:58px !important;
    max-height:58px !important;
    object-fit:cover !important;
    border-radius:5px !important;
}

/* Artist/tittel får all fleksibel plass og starter straks etter coveret */
#playlist .pl-title{
    width:auto !important;
    padding:6px 8px 6px 3px !important;
    text-align:left !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
}

/* Linker kompakt og med ekte temaknapper */
#playlist .pl-links{
    width:142px !important;
    padding:6px 4px !important;
    text-align:left !important;
    white-space:nowrap !important;
}
#playlist .pl-btn{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    height:30px !important;
    margin:0 4px 0 0 !important;
    padding:0 8px !important;
    border:1px solid #3d82d7 !important;
    border-radius:6px !important;
    background:linear-gradient(180deg,#1c69c8 0%,#0b438f 100%) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 5px rgba(0,0,0,.25) !important;
    color:#fff !important;
    font:bold 12px/1 "Segoe UI",Tahoma,Arial,sans-serif !important;
    text-decoration:none !important;
    text-shadow:0 1px 1px #041a39;
}
#playlist .pl-btn:hover{
    background:linear-gradient(180deg,#2d7de0 0%,#0e50aa 100%) !important;
    border-color:#76b6ff !important;
}
#playlist .pl-request{min-width:58px !important}
#playlist .pl-home{width:31px !important;min-width:31px !important;padding:0!important;font-size:21px!important}
#playlist .pl-info{width:31px !important;min-width:31px !important;padding:0!important;font-size:17px!important;font-family:Georgia,serif!important}

/* Album og tid */
#playlist .pl-album{
    width:225px !important;
    padding:6px 5px !important;
    text-align:left !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
}
#playlist .pl-time{
    width:62px !important;
    padding:6px 8px 6px 3px !important;
    text-align:right !important;
    white-space:nowrap !important;
}

/* Faste, ryddige låtrader */
#playlist tbody tr:not(:first-child):not(:last-child){
    height:72px !important;
}
#playlist tbody tr:not(:first-child):not(:last-child) td{
    height:72px !important;
    vertical-align:middle !important;
}

/* Paging-raden skal ikke arve låtrad-layout */
#td-playlist-paging{
    width:auto !important;
    height:auto !important;
    padding:12px 10px !important;
    text-align:left !important;
    white-space:normal !important;
}

/* På mindre vindu prioriter artist/tittel framfor album */
@media(max-width:1050px){
    #playlist .pl-album{width:165px!important}
}


/* ===== TESTPAKKE 10: ARTIST + TITTEL SKAL BEGGE SYNES ===== */

/* Gi artist/tittel-kolonnen litt mer plass; ta litt fra album/link. */
#playlist .pl-links{
    width:136px !important;
}
#playlist .pl-album{
    width:190px !important;
}

/* To linjer i samme faste rad:
   artist øverst, låttittel under. Begge får sin egen ellipsis. */
#playlist .pl-title{
    padding-top:7px !important;
    padding-bottom:7px !important;
    white-space:normal !important;
    overflow:hidden !important;
}
#playlist .pl-artist,
#playlist .pl-songtitle{
    display:block !important;
    width:100% !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
    text-align:left !important;
}
#playlist .pl-artist{
    margin-bottom:3px !important;
    color:#91c2ff !important;
    font-size:13px !important;
    font-weight:800 !important;
    line-height:1.25 !important;
}
#playlist .pl-songtitle{
    color:#fff !important;
    font-size:15px !important;
    font-weight:700 !important;
    line-height:1.25 !important;
}

/* Requested-markøren må ikke presse bort tittelen. */
#playlist .pl-title .requested,
#playlist .pl-title ~requested{
    font-size:10px !important;
}

/* Litt høyere rader gir begge tekstlinjene luft uten å endre bredde. */
#playlist tbody tr:not(:first-child):not(:last-child){
    height:76px !important;
}
#playlist tbody tr:not(:first-child):not(:last-child) td{
    height:76px !important;
}

/* ==========================================================
   RT FINPUSS: MENY + MOST REQUESTED + SISTE SANGER
   ========================================================== */
#navigation dd a {
  display:flex; align-items:center; gap:10px; min-height:48px;
  padding:8px 10px !important; font-weight:750;
}
#navigation .menu-icon {
  flex:0 0 34px; width:34px; height:34px; display:inline-flex;
  align-items:center; justify-content:center; border-radius:8px;
  color:#fff; font-size:18px; font-weight:900; line-height:1;
  background:linear-gradient(180deg,#1977d7 0%,#0d4e9e 100%);
  border:1px solid #2e94f2; box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 3px 8px rgba(0,0,0,.25);
}
#navigation dd a:hover .menu-icon { background:linear-gradient(180deg,#2694ff,#1261bd); }
#navigation .menu-label { min-width:0; }

#top_requests .top-request-item a {
  display:flex !important; align-items:center; gap:9px; padding:8px !important;
}
#top_requests .top-request-cover {
  display:block !important; flex:0 0 48px; width:48px !important; height:48px !important;
  margin:0 !important; object-fit:cover; border-radius:6px !important;
  border:1px solid #2d6cad !important; background:#071426;
}
#top_requests .top-request-text { display:block; min-width:0; line-height:1.2; }
#top_requests .top-request-text strong { display:block; color:#fff; font-size:12px; }
#top_requests .top-request-text span { display:block; margin-top:3px; color:#c7d8ef; font-size:11px; }
#top_requests .top-request-text em { display:inline-block; margin-top:3px; color:#69b7ff; font-size:10px; font-style:normal; }

#recently_played .recent-links { display:flex; align-items:center; justify-content:center; gap:5px; }
#recently_played .theme-action {
  display:inline-flex; align-items:center; justify-content:center; height:30px;
  min-width:30px; padding:0 8px; border-radius:7px; color:#fff !important;
  font-size:12px; font-weight:900; line-height:1; text-decoration:none !important;
  background:linear-gradient(180deg,#1977d7 0%,#0d4e9e 100%);
  border:1px solid #2e94f2; box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 6px rgba(0,0,0,.25);
}
#recently_played .theme-action:hover { background:linear-gradient(180deg,#2694ff,#1261bd); }
#recently_played .theme-buy { min-width:48px; font-size:10px; }
#recently_played .theme-home { font-size:20px; }
#recently_played .theme-info { font-family:Georgia,serif; font-size:18px; font-style:italic; }


/* RT HOTFIX: Lås Most Requested-cover til små thumbnails.
   Ekstra spesifisitet + min/max hindrer gamle jukebox-regler i å blåse dem opp. */
html body #top_requests dl dd.top-request-item a img.top-request-cover {
  width:54px !important;
  height:54px !important;
  min-width:54px !important;
  min-height:54px !important;
  max-width:54px !important;
  max-height:54px !important;
  object-fit:cover !important;
  object-position:center !important;
  display:block !important;
  flex:0 0 54px !important;
}

/* ==========================================================
   RT HOTFIX 20.08.2026
   Temaknapper for NÅ SPILLES + PLAYLIST & REQUESTS.
   Erstatter de gamle hvite SAM-bildeknappene visuelt.
   ========================================================== */

/* Felles knappeskall */
#currently_playing .song-actions a,
#playlist .pl-links a {
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    height:30px !important;
    min-width:30px !important;
    margin:0 4px 0 0 !important;
    padding:0 8px !important;
    border:1px solid #3d82d7 !important;
    border-radius:7px !important;
    background:linear-gradient(180deg,#1c69c8 0%,#0b438f 100%) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 5px rgba(0,0,0,.25) !important;
    color:#fff !important;
    font:bold 12px/1 "Segoe UI",Tahoma,Arial,sans-serif !important;
    text-decoration:none !important;
    text-shadow:0 1px 1px #041a39;
    vertical-align:middle !important;
    overflow:hidden !important;
}

#currently_playing .song-actions a:hover,
#playlist .pl-links a:hover {
    background:linear-gradient(180deg,#2d7de0 0%,#0e50aa 100%) !important;
    border-color:#76b6ff !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 0 10px rgba(45,161,255,.35) !important;
}

/* De gamle SAM-bildene skal ikke få hvit bakgrunn/ramme */
#currently_playing .song-actions a img,
#playlist .pl-links a img {
    display:block !important;
    width:20px !important;
    height:20px !important;
    max-width:20px !important;
    max-height:20px !important;
    margin:0 !important;
    padding:0 !important;
    object-fit:contain !important;
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
}

/* ØNSK MEG-knappen får litt ekstra bredde */
#playlist .pl-links a:first-child {
    min-width:72px !important;
}

/* NÅ SPILLES: jevn plassering under cover */
#currently_playing .song-actions {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    margin-top:13px !important;
}

/* ==========================================================
   RT HOTFIX: NÅ SPILLES – SAMME TEMAKNAPPER SOM SISTE SANGER
   Skjuler de gamle SAM-bildeikonene og lager knappene i CSS.
   ========================================================== */

#currently_playing .song-actions a {
    position:relative !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:34px !important;
    min-width:34px !important;
    height:30px !important;
    padding:0 !important;
    margin:0 !important;
    border:1px solid #2e94f2 !important;
    border-radius:7px !important;
    background:linear-gradient(180deg,#1977d7 0%,#0d4e9e 100%) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 6px rgba(0,0,0,.25) !important;
    color:#fff !important;
    text-decoration:none !important;
    overflow:visible !important;
}

/* Gamle SAM-"papp"-ikoner helt bort */
#currently_playing .song-actions a img {
    display:none !important;
}

/* Nye symboler – samme uttrykk som knappene i "Siste sanger" */
#currently_playing .song-actions a::before {
    display:block !important;
    color:#fff !important;
    font-weight:900 !important;
    line-height:1 !important;
    text-align:center !important;
}

/* Første knapp = hjem/artist */
#currently_playing .song-actions a:nth-child(1)::before {
    content:"⌂";
    font-family:"Segoe UI Symbol","Segoe UI",Arial,sans-serif !important;
    font-size:20px !important;
}

/* Andre knapp = info */
#currently_playing .song-actions a:nth-child(2)::before {
    content:"i";
    font-family:Georgia,serif !important;
    font-size:18px !important;
    font-style:italic !important;
}

/* Eventuell tredje knapp */
#currently_playing .song-actions a:nth-child(3)::before {
    content:"♪";
    font-family:"Segoe UI Symbol","Segoe UI",Arial,sans-serif !important;
    font-size:18px !important;
}

#currently_playing .song-actions a:hover {
    background:linear-gradient(180deg,#2694ff,#1261bd) !important;
    border-color:#76b6ff !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 0 10px rgba(45,161,255,.35) !important;
}

#currently_playing .song-actions {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:5px !important;
    margin-top:13px !important;
}

/* ==========================================================
   RT KLOKKE – VENSTREMENY
   ========================================================== */
#navigation dd.rt-clock-item {
    border-top:1px solid #183353 !important;
    padding:0 !important;
}

#rt-clock {
    padding:12px 8px 11px !important;
    text-align:center !important;
    background:linear-gradient(180deg,rgba(15,43,82,.95),rgba(5,20,40,.98)) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}

#rt-clock-time {
    color:#ffffff !important;
    font-size:25px !important;
    line-height:1.05 !important;
    font-weight:900 !important;
    letter-spacing:2px !important;
    font-variant-numeric:tabular-nums;
    text-shadow:0 0 8px rgba(70,160,255,.55),0 2px 2px #000;
}

#rt-clock-date {
    margin-top:6px !important;
    color:#8fc0ff !important;
    font-size:10px !important;
    line-height:1.25 !important;
    font-weight:700 !important;
}

/* ==========================================================
   RT MOBILFIX 20.08.2026
   KUN TELEFON. Desktop-reglene over er urørt.
   ========================================================== */
@media screen and (max-width:700px) {
    /* Selve playlisten skal holde seg innenfor mobilskjermen */
    #playlist,
    #playlist_wrapper,
    #playlist table {
        width:100% !important;
        max-width:100% !important;
    }

    #playlist table {
        table-layout:fixed !important;
    }

    /* Mobiloverskrift: bare RESULTAT + LINK er nyttig */
    #playlist table thead th {
        display:none !important;
    }
    #playlist table thead th:first-child {
        display:table-cell !important;
        width:auto !important;
        border-radius:7px 0 0 7px !important;
    }
    #playlist table thead th.links {
        display:table-cell !important;
        width:116px !important;
        text-align:center !important;
        border-radius:0 7px 7px 0 !important;
    }

    /* Nummer, cover, album og tid viker på telefon */
    #playlist .pl-num,
    #playlist .pl-cover,
    #playlist .pl-album,
    #playlist .pl-time {
        display:none !important;
    }

    /* Artist + låttittel får resten av bredden */
    #playlist .pl-title {
        display:table-cell !important;
        width:auto !important;
        height:76px !important;
        padding:9px 8px !important;
        white-space:normal !important;
        overflow:hidden !important;
    }
    #playlist .pl-artist {
        font-size:13px !important;
        line-height:1.25 !important;
    }
    #playlist .pl-songtitle {
        margin-top:4px !important;
        font-size:16px !important;
        line-height:1.25 !important;
    }

    /* Handlingsfeltet blir kompakt, men finger-vennlig */
    #playlist .pl-links {
        display:table-cell !important;
        width:116px !important;
        min-width:116px !important;
        max-width:116px !important;
        padding:7px 4px !important;
        text-align:right !important;
        white-space:nowrap !important;
        overflow:visible !important;
    }

    /* Request-bildet skal IKKE krympes til 20x20 på mobil */
    #playlist .pl-links a:first-child {
        width:58px !important;
        min-width:58px !important;
        height:34px !important;
        padding:0 5px !important;
    }
    #playlist .pl-links a:first-child img {
        display:block !important;
        width:auto !important;
        height:auto !important;
        max-width:48px !important;
        max-height:22px !important;
        margin:auto !important;
    }

    #playlist .pl-home,
    #playlist .pl-info {
        width:26px !important;
        min-width:26px !important;
        height:34px !important;
        padding:0 !important;
        margin-left:2px !important;
        margin-right:0 !important;
    }

    /* Paging skal bruke hele raden på telefon */
    #td-playlist-paging {
        display:table-cell !important;
        width:auto !important;
        max-width:none !important;
        padding:10px 6px !important;
        font-size:12px !important;
        text-align:center !important;
        white-space:normal !important;
    }

    /* Søkefeltet må kunne krympe */
    #search {
        overflow:hidden !important;
    }
    #search input[type="text"] {
        max-width:100% !important;
    }
    #search table {
        display:block !important;
        width:100% !important;
        overflow-x:auto !important;
        white-space:nowrap !important;
    }
}
/* RT PERMANENT ØNSK BUTTON FIX 21.08.2026 */
#playlist .pl-links .pl-request {
 display:inline-flex !important; align-items:center !important; justify-content:center !important;
 min-width:58px !important; width:auto !important; height:34px !important; padding:0 9px !important;
 font-family:"Segoe UI",Tahoma,Arial,sans-serif !important; font-size:12px !important; font-weight:900 !important;
 color:#fff !important; text-decoration:none !important;
}
#playlist .pl-links .pl-request img { display:none !important; }


/* ==========================================================
   RT ØNSK-KNAPP FIX 21.08.2026
   Første playlist-knapp skal vise teksten ØNSK, ikke noteikon.
   ========================================================== */
html body #playlist .pl-links {
    width:160px !important;
    min-width:160px !important;
    max-width:160px !important;
    overflow:visible !important;
}
html body #playlist .pl-links .pl-request {
    position:relative !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:58px !important;
    min-width:58px !important;
    height:36px !important;
    padding:0 7px !important;
    margin-right:5px !important;
    color:#fff !important;
    font-family:"Segoe UI",Tahoma,Arial,sans-serif !important;
    font-size:12px !important;
    font-weight:900 !important;
    line-height:1 !important;
    text-decoration:none !important;
    overflow:visible !important;
}
html body #playlist .pl-links .pl-request::before,
html body #playlist .pl-links .pl-request::after {
    content:none !important;
    display:none !important;
}
html body #playlist .pl-links .pl-request img {
    display:none !important;
}
html body #playlist .pl-links .pl-home,
html body #playlist .pl-links .pl-info {
    width:38px !important;
    min-width:38px !important;
    height:36px !important;
    padding:0 !important;
    margin-right:5px !important;
}


/* ==========================================================
   RT STJERNEHIMMEL FINPUSS 21.08.2026
   Mer synlig twinkle uten å endre layout.
   ========================================================== */
body::before{
  opacity:.92 !important;
  animation:rtStarDrift 48s linear infinite,rtStarSoftTwinkle 2.8s ease-in-out infinite alternate !important;
}
body::after{
  opacity:.88 !important;
  filter:drop-shadow(0 0 6px rgba(105,180,255,.58)) !important;
  animation:rtBigStarTwinkle 2.15s ease-in-out infinite alternate,rtStarFloat 24s ease-in-out infinite alternate !important;
}
@keyframes rtStarSoftTwinkle{
  0%{opacity:.38;filter:brightness(.72)}
  28%{opacity:.98;filter:brightness(1.42)}
  55%{opacity:.56;filter:brightness(.92)}
  78%{opacity:.90;filter:brightness(1.28)}
  100%{opacity:.48;filter:brightness(.82)}
}
@keyframes rtBigStarTwinkle{
  0%{opacity:.25;filter:drop-shadow(0 0 2px rgba(75,155,255,.22)) brightness(.75)}
  24%{opacity:1;filter:drop-shadow(0 0 10px rgba(125,200,255,.78)) brightness(1.55)}
  52%{opacity:.42;filter:drop-shadow(0 0 3px rgba(75,155,255,.30)) brightness(.88)}
  76%{opacity:.94;filter:drop-shadow(0 0 8px rgba(110,190,255,.68)) brightness(1.42)}
  100%{opacity:.34;filter:drop-shadow(0 0 2px rgba(75,155,255,.25)) brightness(.80)}
}

/* ==========================================================
   RT TOPBAR-GFX 21.08.2026 - PLASSERT MELLOM TITTEL OG LYTTERE
   ========================================================== */
#logo{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    gap:18px !important;
    overflow:visible !important;
}

#logo > a{
    flex:0 0 auto !important;
    position:relative !important;
    z-index:2 !important;
}

#topbar-gfx{
    flex:1 1 0 !important;
    min-width:0 !important;
    height:100px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:visible !important;
    margin:0 8px !important;
    pointer-events:none !important;
}

#topbar-gfx img{
    display:block !important;
    width:auto !important;
    height:92px !important;
    max-width:100% !important;
    object-fit:contain !important;
    object-position:center !important;
    transform:scale(1.90) !important;
    transform-origin:center center !important;
    opacity:.98 !important;
    filter:drop-shadow(0 0 8px rgba(70,150,255,.28));
}

#listener_count{
    flex:0 0 auto !important;
    position:relative !important;
    z-index:2 !important;
}

@media(max-width:850px){
    #logo{
        display:block !important;
        text-align:center !important;
    }
    #topbar-gfx{
        width:min(620px,96%) !important;
        min-width:0 !important;
        height:72px !important;
        margin:-6px auto 2px !important;
        justify-content:center !important;
    }
    #topbar-gfx img{
        max-width:100% !important;
        object-position:center !important;
        opacity:.82 !important;
    }
}