:root {
    --radio-accent: #d95b8f;
    --radio-background: #f3f3f3;
    --radio-surface: #ffffff;
    --radio-text: #202020;
    --background: #1a1a1d;
    --surface:    #2a2a2f;
    --text:       #f2f2f2;
    --accent:     #d96ba0;
}

html {
  font-size: 14px;
  width: 390px;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

/*@media (prefers-color-scheme: dark) {
    body {background: #1a1a1d;color: white;
    }
}
*/
body {
    margin-bottom: 60px;
    padding-bottom: 100px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
  /*transition:background-color 1s ease,color 1s ease;*/
}
body.morning {background-image: url('/images/morning.jpg');}
body.day {background-image: url('/images/day.jpg');}
body.evening {background-image: url('/images/evening.jpg');}
body.night {background-image: url('/images/night.jpg');}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

.majorcontrol {
    min-height: 48px;
    min-width: 48px;
}

.player-button {
    width: 64px;
    height: 64px;
    border-radius: 50%;
}

.player-bar {
    padding-bottom: env(safe-area-inset-bottom);
    background-color: rgba(255, 255, 255, 0.45);
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(10px);
}
.player-artwork {width:200px; max-height: 130px;}

.station-logo {
    width: 110px;
    height: 100px;
    border-radius: 12px;
    object-fit: scale-down;
    background: #eee;
}

.list-group-item {
    min-height: 72px;
}

.favourites {display:flex; gap:13px; flex-direction: column; }
.favourites.morning {color:#ffffff;}
.favourites.day {color:#000000;}
.favourites.evening {color:#ffffff;}
.favourites.night {color:#ffffff;}
#playerStatus {font-size:3em; color: orange; font-weight:bold; -webkit-text-stroke: 1px black;}

.stationtext {font-weight:bold; font-size:1.3em; font-weight:bold; line-height:1.3em; color:white;   }
#playerStation {color:black; font-size: 1em; font-weight: bold; word-wrap:anywhere;}

