 .video-js .vjs-big-play-button {
      left:45%;
      top: 40%;
    }
 
    .small { font-size: 80%; }
    .bold { font-weight:bold; }
    .qualitytd { padding:1px; padding-right:15px; }
    .left { text-align:left; }
    .center { text-align:center; }
    .nowrap { text-wrap:none; }
    .btn-spacing { margin-left:10px; }
    .stream-spacing { margin-bottom:10px; }
    .vjs-hide {
      visibility: hidden;
      opacity: 0 !important;
      -webkit-transition: visibility 2.5s, opacity 1.5s !important;
      -moz-transition: visibility 2.5s, opacity 1.5s !important;
      -ms-transition: visibility 2.5s, opacity 1.5s !important;
      -o-transition: visibility 2.5s, opacity 1.5s !important;
      transition: visibility 2.5s, opacity 1.5s !important;
    }
    .menubtn {
      display: flex;
    }
    .menubtn a{
         font-style: normal;
    color: #ea601a;
    background: #f8ebe6;
    border: 2px none transparent;
    box-shadow: 0px 0px 0px -7px rgba(0, 0, 0, 0);
    padding: 13px 21px 13px 21px;
    line-height: 1.6;
    border-radius: 4px;
    color: #ea601a;
    text-decoration: none!important;
    text-align: center;
    }

    .menubtn a:hover{
          color: #ffffff;
    background: #ea601a;
    box-shadow: 0px 15px 25px -7px rgba(0, 0, 0, 0.1);
    }

    .stopka {
      border-top:solid 1px #e0e0e0;
      color:#a0a0a0;
      font-size:12px;
      text-align:center; 
    }
    .top {
      background-repeat:no-repeat;
      height:80px;
      font-size:24px;
      font-family:arial;
      font-weight:bold;
      text-align:center;
      padding:10px;
      border-bottom:1px solid #e0e0e0;
    }
    body{
       background-color: #F5F5F5!important;
       margin: 0;
       padding: 0!important;
    }
    .content { padding-top:10px;  background-color: #F5F5F5;}
    .content_center { padding-left:10px; }
    .header_logo {
      position:absolute;
      left:15px;
      top:15px;
    }

    /* ====== NOWE / RESPONSYWNE ====== */
    .layout {
      display:flex;
      flex-direction:column;
      gap:16px;
      max-width:1200px;
      margin:0 auto;
    }

    .streams-card {
      position:relative;
      top:0;
    }

    #streams {
      display:flex;
      flex-wrap:wrap;        
      align-items:center;
      justify-content: center;
      gap: 12px;               
      width:100%;
    }
    #streams > label,
    #streams > .btn {
      margin:0;                /* gap zarządza odstępami */
    }
#streams .menubtn.active a{
  color: #ffffff;
  background: #ea601a;
  box-shadow: 0px 15px 25px -7px rgba(0, 0, 0, 0.1);
}
    /* Informacja o aktywnym streamie */
    .active-stream {
      margin:0;
    }

    /* Player na całą szerokość */
    .player-wrapper {
      width:100%;
    }
    /* Używamy fluidowego trybu video.js przez klasę vjs-fluid */
    #Maguravideo {
      width:100%;
      height:auto;
    }

    /* Sekcja z bezpośrednim URL */
    .direct-url {
      margin:0;
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      align-items:center;
    }
    .direct-url #stream_direct_url {
      word-break:break-all;
    }

    /* Drobne korekty dla małych ekranów */
    @media (max-width: 576px) {
      .menubtn { width:auto; }
      .video-js .vjs-big-play-button { left:50%; top:45%; transform:translate(-50%,-50%); }
      #streams{
        gap: 8px;
      }
      .menubtn a{
        font-size: 12px;
        line-height: 14px;
      }
    }
