body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.app{background:#222;display:flex;flex-direction:column;height:100vh;text-align:center}.header{align-items:center;height:5%;justify-content:center;margin:auto;position:relative}.body,.header{display:flex;width:100%}.body{height:92%}.footer{font-size:13px;height:3%;justify-content:left;width:98%}.footer,.sidebar{align-items:center;color:#d9d9d9;display:flex;margin:auto}.sidebar{background:#262626;height:100%;justify-content:center;min-width:200px;transition:transform .3s ease;width:20%}.content{background:#333;color:#d9d8d8;flex:1 1;height:100%;margin:auto;width:85%}.header .header-btn{align-items:center;border:none;color:#e7e7e7;cursor:pointer;display:flex;justify-content:center;padding:5px 10px;position:absolute;right:10px;width:190px}.header .header-btn .user-btn:hover{background-color:#aeaeae;cursor:pointer}.header .header-btn .user-btn{align-items:center;background-color:#587d02;border-radius:50%;color:#fff;display:flex;font-size:18px;height:30px;justify-content:center;width:30px}.header .header-btn button{background:#858383;border:none;color:#e7e7e7;cursor:pointer;padding:5px 10px}.header .header-btn .logout-btn{background:#b33838;border:none;border-radius:3px;color:#e7e7e7;cursor:pointer;padding:5px 10px;position:absolute;right:10px}.header .header-btn .logout-btn:hover{background-color:#aeaeae;cursor:pointer}.header button:hover{background:#a8a7a7}.header .backoffice-logo{align-items:center;color:#c5c4c4;display:flex;font-weight:700;gap:20px;justify-content:center;left:220px;position:absolute;width:200px}.header .backoffice-logo img{height:40px;width:40px}.sidebar-toggle{display:none;left:10px;position:absolute}.overlay{background:#0006;bottom:0;left:0;position:fixed;right:0;top:0;z-index:500}ul{list-style-type:none}.backoffice-logo a{align-items:center;display:flex;flex-direction:column;justify-content:center}.backoffice-logo a,.backoffice-logo a:active,.backoffice-logo a:focus,.backoffice-logo a:hover,.backoffice-logo a:visited{color:#a3a2a2;text-decoration:none}.required{color:red;margin-left:5px}.spinner{animation:spin 1s linear infinite;border:6px solid #f3f3f3;border-radius:50%;border-top-color:#2196f3;height:40px;margin:20px auto;width:40px}.unauthorized{color:red}.page-404,.unauthorized{margin-top:80px}.page-404 .home{cursor:pointer;text-decoration:underline}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media (max-width:1200px){.sidebar{height:92%;left:0;position:fixed;top:5%;transform:translateX(-100%);transition:transform .3s ease;width:200px;z-index:1000}.sidebar.open{transform:translateX(0)}.content{width:100%}.sidebar-toggle{background:#444;border:none;color:#fff;cursor:pointer;display:inline-block;left:20px;margin-right:10px;padding:5px 10px;position:absolute;z-index:2000}.header .backoffice-logo{left:80px}}.dash-main{height:90%;position:relative;width:100%}.dashboard-container{align-items:center;background:#1e1e1e;border-radius:16px;box-shadow:0 4px 12px #0006;color:#b6b6b6;display:flex;flex-direction:column;font-size:18px;gap:10px;justify-content:center;margin:50px auto;max-width:500px;padding:20px}.dash-title{justify-content:space-between;margin-bottom:20px;position:relative}.dash-title,.dash-title .playlist-panding{align-items:center;display:flex;width:100%}.dash-title .playlist-panding{flex-direction:column;height:30px;justify-content:center;position:absolute;top:30px}.dash-title .playlist-panding .info{color:red;font-size:14px;height:20%;width:100%}.dash-container{position:relative}.asaid-label{color:#969696;font-size:14px;font-weight:700;left:0;position:absolute;transform:rotate(-90deg) translateY(-45px);width:120px}.dash-pl{align-items:center;display:flex;flex-direction:column;gap:8px;height:110px;justify-content:center;margin-top:10px;width:100%}.dash-title .title{font-size:16px;font-weight:700;width:50%}.dash-pl .dash-pl-label{text-transform:uppercase}.dash-pl .playlist-main{align-items:center;background-color:#2e2e2e;border-radius:7px;display:flex;font-size:15px;height:90%;justify-content:center;position:relative;width:85%}.dash-pl .playlist-main .current-playlist{align-items:center;color:#7995a0;display:flex;flex-direction:column;gap:20px;height:40%;justify-content:center;width:90%}.dash-pl .playlist-main .current-playlist .current-playlist-name{align-items:center;display:flex;font-size:27px;font-weight:700;height:60%;justify-content:start;width:100%}.dash-pl .playlist-main .current-playlist .current-playlist-time{align-items:center;display:flex;font-size:17px;gap:10px;height:40%;justify-content:start;width:100%}.switch-playlist{align-items:center;display:flex;flex-direction:column;gap:10px;height:90%;justify-content:end;position:absolute;right:20px}.switch-playlist .switch{background-color:#008cba;border:none;border-radius:4px;color:#cac9c9;cursor:pointer;font-size:12px;padding:14px 20px;text-transform:uppercase}.btn.switch:hover{background-color:#969696}.dash-task{align-items:center;display:flex;flex-direction:column;gap:8px;height:110px;justify-content:center;margin-top:10px;width:100%}.dash-task .dash-task-label{text-transform:uppercase}.dash-task .task-main{align-items:center;background-color:#2e2e2e;border-radius:7px;display:flex;font-size:15px;height:90%;justify-content:center;position:relative;width:85%}.dash-task .task-main .current-task{align-items:center;color:#7995a0;display:flex;flex-direction:column;height:80%;justify-content:center;width:50%}.dash-task .task-main .current-task .current-task-label{align-items:center;display:flex;font-size:15px;font-weight:700;height:50%;justify-content:center;text-transform:uppercase;width:100%}.dash-task .task-main .current-task .current-task-content{align-items:center;display:flex;font-size:17px;gap:10px;height:50%;justify-content:center;width:100%}.dash-track{align-items:center;display:flex;flex-direction:column;gap:8px;height:180px;justify-content:center;margin-top:10px;width:100%}.dash-track .dash-track-label{text-transform:uppercase}.dash-track .track-info-box{align-items:center;background-color:#2e2e2e;border-radius:7px;color:#7995a0;display:flex;flex-direction:column;font-size:15px;height:100%;justify-content:center;width:85%}.dash-track .track-info-box .track-info-container{align-items:center;display:flex;flex-direction:column;height:95%;justify-content:center;width:100%}.dash-track .track-info-box .track-info-container .track-title{align-items:start;display:flex;font-size:25px;font-weight:700;height:35%;justify-content:center;width:90%}.dash-track .track-info-box .track-info-container .track-title div{overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap;width:100%}.dash-track .track-info-box .track-info-container .track-info{align-items:center;display:flex;flex-wrap:nowrap;font-size:16px;height:15%;justify-content:space-between;width:90%}.dash-track .track-info-box .track-info-container .track-info-progress{align-items:center;display:flex;flex-direction:column;flex-wrap:nowrap;font-size:16px;gap:10px;height:45%;justify-content:center;width:90%}.track-info-container .track-info-progress .track-progress{height:40%;width:100%}.progress-bar{background:#595959;border-radius:8px;height:4px;margin-top:10px;overflow:hidden}.progress-bar-fill{background:#22c55e;border-radius:8px;height:100%;transition:width .3s ease}.dash-track .track-info-box .track-info-container .track-info-content{align-items:center;display:flex;flex-direction:column;font-size:16px;gap:5px;justify-content:center;width:50%}.dash-track .track-info-box .track-info-container .track-info .elapsed{align-items:start}.dash-track .track-info-box .track-info-container .track-info .remaining{align-items:end}.dash-track .track-info-box .track-info-container .duration{flex-direction:row;font-size:16px;gap:20px;height:30%}.dash-track .track-info-box .track-info-container .next-track{display:flex;flex-direction:row;font-size:16px;gap:10px;height:30%;width:100%}.dash-track .track-info-box .track-info-container .next-track strong{width:10%}.dash-track .track-info-box .track-info-container .next-track .next-track-content{overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap;width:80%}.status-box{display:flex;flex-direction:column;gap:5px;justify-content:center;width:85%}.status-box h2{margin-bottom:16px;text-align:center}.status-row{display:flex;justify-content:space-between;margin:6px 0}.status-box .playlist,.status-box .status{border-bottom:1px solid grey;padding-bottom:7px}.status-box .playlist{display:flex;flex-direction:column;width:100%}.status-box .playlist .playlist-name{display:flex;justify-content:space-between;margin:6px 0;width:100%}.running{color:#22c55e}.stopped{color:#ef4444}.button-row{display:flex;gap:20%;justify-content:center;margin-top:30px}.btn{border:none;border-radius:4px;cursor:pointer;font-size:12px;font-weight:700;padding:14px 20px;transition:background .2s}.btn.start{background:#04aa6d;color:#e3e2e2}.btn.start:disabled{background:#39843c;cursor:not-allowed;opacity:.6}.btn.start:hover{background-color:grey}.btn.stop{background:#f44336;color:#fff}.btn.stop:disabled{background:#951919;cursor:not-allowed;opacity:.6}.btn.stop:hover{background-color:grey}.switch-modal-overlay{background:#00000080;height:100%;position:fixed;right:0;top:0;width:100%;z-index:999}.switch-modal,.switch-modal-overlay{align-items:center;display:flex;justify-content:center}.switch-modal{background:#353535;border:1px solid grey;border-radius:12px;box-shadow:0 0 10px #0003;flex-direction:column;height:400px;padding:20px;text-align:center;width:400px}.playlists-confirm-btn{background-color:#4caf50;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:15px;padding:12px 18px}.stop-playing-modal-overlay{background:#00000080;height:100%;position:fixed;right:0;top:0;width:100%;z-index:999}.stop-playing-modal,.stop-playing-modal-overlay{align-items:center;display:flex;justify-content:center}.stop-playing-modal{background:#353535;border:1px solid grey;border-radius:12px;box-shadow:0 0 10px #0003;flex-direction:column;height:400px;padding:20px;text-align:center;width:400px}.stop-playing-modal h2{color:red}.login-main{height:100%;width:100%}.login-form{height:70%;justify-content:center}.login-form,.users-main{align-items:center;display:flex;flex-direction:column;position:relative;width:100%}.users-main{height:95%;justify-content:baseline}.create-user h1,.login-form .title,.users-main h1{font-size:35px;font-weight:700;height:10%;margin-top:30px;text-transform:uppercase;width:100%}.login-form .login-form-conteiner{align-items:center;display:flex;flex-wrap:wrap;gap:5%;height:40%;justify-content:center;width:40%}.create-user .create-form-conteiner{align-items:center;border:1px solid grey;border-radius:10px;display:flex;flex-direction:column;height:100%;justify-content:center;margin-top:40px;padding:50px;width:60%}.create-user .create-form-conteiner .form-btn{align-items:center;display:flex;gap:20px;height:30%;justify-content:center}.create-user .input-conteiner{align-items:center;display:flex;flex-wrap:wrap;gap:5%;height:40%;justify-content:center;width:90%}.create-user .inputs,.login-form .inputs{align-items:center;display:flex;flex-direction:column;gap:5px;height:45%;justify-content:center;width:270px}.create-user .inputs .label,.login-form .inputs .label,.role-select .label{text-align:left;width:100%}.create-user .inputs input,.login-form .inputs input{background-color:#646464;border-radius:8px;color:#fff;height:35px;padding:2px 10px;width:250px}.create-user .inputs input::placeholder,.login-form .inputs input::placeholder{color:#bababa}.create-user .inputs input:invalid,.login-form .inputs input:invalid{background-color:#646464;color:#fff}.create-user .inputs input:focus,.login-form .inputs input:focus{background-color:#646464;color:#fff}.create-user .inputs input:valid,.login-form .inputs input:valid{background-color:#646464;color:#fff}.create-user .inputs input:empty,.login-form .inputs input:empty{background-color:#646464;color:#fff}.login-form .errors{position:absolute;top:10px}.role-select{align-items:center;display:flex;flex-direction:column;gap:5px;height:30%;justify-content:center;width:200px}.role-select select{width:200px}.create-user.submit-btn,.login-form .submit-btn,.users-main .create-btn{align-items:center;display:flex;height:20%;justify-content:center;width:100%}.create-user button,.submit-btn button,.users-main .create-btn button{background-color:#598759;border:none;border-radius:7px;box-shadow:0 3px 8px -2px #000;color:#e8e8e8;font-size:17px;font-weight:700;height:45px;text-transform:uppercase;width:150px}.create-user button:hover,.submit-btn button:hover{background-color:#a4a4a4}.users-all-main{height:100%}.users-main .table-container{border:1px solid grey;border-radius:7px;margin-top:40px;max-height:600px;overflow-y:auto;scrollbar-color:#a4b541 #2d2d2d;scrollbar-width:thin;width:70%}.users-main .table-container::-webkit-scrollbar{width:10px}.users-main .table-container::-webkit-scrollbar-track{background:#2d2d2d;border-radius:5px}.users-main .table-container::-webkit-scrollbar-thumb{background-color:#a4b541;border:2px solid #2d2d2d;border-radius:5px}.users-main .table-container::-webkit-scrollbar-thumb:hover{background-color:#a4b541}.users-main .table-container .table{background-color:initial;border-collapse:collapse;position:relative;width:100%}.users-main .table thead th{background-color:#232c2b;padding:4px;position:-webkit-sticky;position:sticky;top:0;z-index:2}.users-main .table thead tr{font-size:18px;font-weight:700}.users-main .table thead{border-bottom:2px solid #a4a3a3}.users-main .table-container .table th,td{border:1px solid #383838}.users-main .table-container .table tr:nth-child(2n){background-color:#7d8480}.users-main .table-container .table tr:nth-child(odd){background-color:#616968}.users-main .table-container .table tr:hover{background-color:#3e4b4a}.users-main .table-container .table tbody th{font-size:17px;font-weight:700;padding:7px}.users-main .table-container .table td{padding:4px}.users-main .table-container .t-email{text-align:left;width:53%}.users-main .table-container .t-role{width:33%}.users-main .table-container .t-btn{width:10%}.users-main .table-container .edit-btn{background-color:initial;border:none;color:#cccbcb}.users-main .table-container .edit-btn:hover{color:#35e94a}.create-user{align-items:center;display:flex;flex-direction:column;height:75%;justify-content:baseline;width:100%}@media (max-width:1200px){.login-form{height:80%}}@media (max-width:900px){.login-form{height:85%}}@media (max-width:600px){.login-form{height:90%}}.main{flex-wrap:wrap;gap:.8%;height:100%;justify-content:center}.main,.tasks-main{align-items:center;border-radius:7px;display:flex;position:relative}.tasks-main{flex-direction:column;height:95%;justify-content:baseline;width:77%}.guid-preview{align-items:center;background-color:#262626;border-left:1px solid grey;display:flex;height:100%;justify-content:center;width:22%}.guid-preview-main{align-items:center;display:flex;flex-direction:column;height:90%;justify-content:baseline;margin:auto;position:relative;width:100%}.guid-preview-title,.task-main-title{height:10%;width:100%}.guid-preview h1,.main h1{font-size:35px;font-weight:700;margin:auto;text-align:center}.guid-preview-btn,.task-main-btn{height:10%;width:100%}.form-btn{align-items:center;display:flex;gap:20px;justify-content:center}.add-btn,.form-btn .submit-btn{background-color:#598759}.add-btn,.form-btn .cancel-btn,.form-btn .submit-btn{border:none;border-radius:7px;box-shadow:0 3px 8px -2px #000;color:#e8e8e8;height:45px;margin:10px;width:150px}.form-btn .cancel-btn{background-color:#933939}.add-btn:hover,.form-btn button:hover{background-color:#a4a4a4}.table-main{height:80%;width:95%}.table-container{border:1px solid grey;border-radius:7px;margin-top:40px;max-height:600px;overflow-y:auto;scrollbar-color:#a4b541 #2d2d2d;scrollbar-width:thin;width:96%}.table-container::-webkit-scrollbar{width:10px}.table-container::-webkit-scrollbar-track{background:#2d2d2d;border-radius:5px}.table-container::-webkit-scrollbar-thumb{background-color:#a4b541;border:2px solid #2d2d2d;border-radius:5px}.table-container::-webkit-scrollbar-thumb:hover{background-color:#a4b541}.main .table-container .table{background-color:initial;border-collapse:collapse;position:relative;width:100%}.table thead th{background-color:#232c2b;padding:4px;position:-webkit-sticky;position:sticky;top:0;z-index:2}.table thead tr{font-size:18px;font-weight:700}.table thead{border-bottom:2px solid #a4a3a3}.table-container .table .t-id{width:3%}.table-container .table .t-name{text-align:left;width:25%}.table-container .table .t-desc{text-align:left;width:23%}.table-container .table .t-playlist{width:10%}.table-container .table .t-start{width:17%}.table-container .table .t-btn{width:7%}.table-container .table .t-active{cursor:pointer;width:6%}.table-container .table .t-rep{width:7%}.task-form{align-items:center;border:1px solid grey;border-radius:10px;display:flex;flex-direction:column;gap:50px;justify-content:center;margin-top:40px;padding:50px;width:90%}.task-form input,select{background-color:#646464;border:none;border-radius:8px;color:#fff;font-size:15px;padding:10px}::placeholder{color:#bababa}.task-form select,.time{width:50%}.weekly-time{align-items:center;display:flex;gap:5%;justify-content:start;width:100%}.weekly-time .time{width:45%}.name-disc,.playlist,.repeat-start{align-items:baseline;display:flex;gap:30px;justify-content:center;width:80%}.fild{align-items:flex-start;display:flex;flex-direction:column;gap:5px;justify-content:left;width:100%}.name-disc input,.name-disc textarea{width:95%}.guide-main-container{height:70%;width:100%}.guide-main-container,.m-expanded-guide{align-items:center;display:flex;justify-content:center}.m-expanded-guide{background-color:#19191926;border:1px solid hsla(0,0%,85%,.445);border-radius:20px;box-shadow:inset 0 0 0 0 grey;color:gray;height:400px;margin:auto;position:relative;width:80%;z-index:30}.m-expanded-guide-content{height:100%}.m-expanded-guide-content,.m-expanded-guide-title{align-items:center;display:flex;flex-direction:column;justify-content:center;width:100%}.m-expanded-guide-title{height:18%}.m-expanded-guide-title .m-text{align-items:center;color:#cdcbcb;display:flex;font-size:17px;font-weight:700;height:50%;justify-content:center;margin:auto;text-shadow:1px 1px #000}.m-expanded-guide-title .m-date-arrows{align-items:center;display:flex;font-size:14px;height:30%;justify-content:center;margin:auto;width:50%}.m-expanded-guide-title .m-date-arrows .m-left-arrow button,.m-expanded-guide-title .m-date-arrows .m-right-arrow button{background-color:initial;border:none;font-size:12px;width:15%}.m-expanded-guide-title .m-date-arrows .m-day{text-transform:uppercase;width:70%}.m-expanded-guide-list-main{align-items:start;display:flex;flex-direction:column;height:80%;justify-content:center;overflow:hidden;width:100%}.m-expanded-guide-list{height:100%;width:100%}.m-expanded-guide-list ul{align-items:center;display:flex;flex:1 1 auto;flex-direction:column;gap:14px;margin:0 0 10px;max-height:90%;overflow-y:auto;padding:10px 0;transition:padding-bottom .3s ease,padding-top .3s ease;width:100%}.m-expanded-guide-list ul::-webkit-scrollbar{width:10px}.m-expanded-guide-list ul::-webkit-scrollbar-track{background:#2d2d2d;border-radius:5px}.m-expanded-guide-list ul::-webkit-scrollbar-thumb{background-color:#a4b541;border:2px solid #2d2d2d;border-radius:5px}.m-expanded-guide-list ul::-webkit-scrollbar-thumb:hover{background-color:#a4b541}.m-expanded-guide-list ul li{align-items:center;border-bottom:1px solid #87581e54;display:flex;flex-wrap:wrap;justify-content:space-between;padding-bottom:5px;position:relative;width:100%}.m-expanded-guide-list ul li:last-child{border-bottom:none}.start-end-time{font-size:11px;height:100%;text-align:center;width:16%}.task-content{align-items:center;display:flex;flex-direction:column;flex-wrap:nowrap;gap:3px;justify-content:center;width:83%}.task-name{color:#c3c3c3;font-size:15px;font-weight:700}.task-description,.task-name{overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap;width:100%}.task-description{font-size:12px}.not-approved{color:#f52d2d}.approved-msg,.not-approved{font-size:20px;position:absolute;top:15%}.approved-msg{color:#37f52d}@media (max-width:1600px){.tasks-main{height:95%;width:81%}.table-container{width:97%}.guid-preview{width:18%}.m-expanded-guide{height:320px;width:92%}}@media (max-width:1200px){.tasks-main{width:74%}.guid-preview{width:25%}}@media (max-width:900px){.tasks-main{height:49%;width:100%}.guid-preview{border:none;height:50%;width:100%}.m-expanded-guide{height:210px;width:90%}.table-container{height:220px}}@media (max-width:600px){.tasks-main{height:45%;width:100%}.guid-preview{border:none;height:54%;width:100%}.m-expanded-guide{height:200px;width:90%}.table-container{height:200px}}.playlists-main{flex-wrap:wrap;gap:.8%;height:100%;justify-content:center}.playlists-main,.playlists-page-main{align-items:center;border-radius:7px;display:flex;position:relative}.playlists-page-main{flex-direction:column;height:95%;justify-content:baseline;width:77%}.playlists-main-title{height:10%;width:100%}.playlists-main-btn{position:absolute;right:10px;top:10px;z-index:10}.playlists-pl-btn{height:10%;width:100%}.pl-settings-btn{background-color:#598759;border:none;border-radius:7px;box-shadow:0 3px 8px -2px #000;color:#e8e8e8;font-size:20px;height:45px;margin:10px;width:150px}.pl-settinns-btn{display:flex;position:absolute;right:10px;top:10px;z-index:10}.pl-settings-btn:hover{background:#aeadad}.file-btn{display:flex;left:0;position:absolute;top:10px}.playlists-tabs-container{align-items:center;border:1px solid grey;border-bottom:none;border-top-left-radius:7px;border-top-right-radius:7px;flex-wrap:wrap;gap:10px;height:10%;justify-content:center;margin-top:40px;max-height:600px}.playlists-main .table-container,.playlists-tabs-container{display:flex;overflow-y:auto;position:relative;scrollbar-color:#a4b541 #2d2d2d;scrollbar-width:thin;width:100%}.playlists-main .table-container{border:1px solid grey;border-radius:0;border-bottom-left-radius:7px;border-bottom-right-radius:7px;border-top:none;flex-direction:column;margin-top:0;max-height:650px}.playlists-modal-overlay{background:#00000080;height:100%;left:0;position:fixed;top:0;width:100%;z-index:999}.playlists-modal,.playlists-modal-overlay{align-items:center;display:flex;justify-content:center}.playlists-modal{background:#353535;border:1px solid grey;border-radius:12px;box-shadow:0 0 10px #0003;flex-direction:column;height:50%;padding:20px;text-align:center;width:30%}.pl-modal-name{height:40%;width:70%}.playlists-modal input{background-color:grey;border-radius:7px;color:#fff;margin:10px 0;padding:8px;width:100%}.pl-modal-check{align-items:center;display:flex;flex-direction:column;height:20%;justify-content:space-around;width:70%}.pl-modal-check .check{cursor:pointer;width:20%}.pl-modal-check .check:hover{color:grey}.playlists-modal-buttons{align-items:center;display:flex;flex-wrap:wrap;height:40%;justify-content:space-between;width:50%}.playlists-create-btn{padding:12px 18px}.playlists-create-btn,.playlists-edit-btn{background-color:#4caf50;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:15px}.playlists-edit-btn{padding:12px 26px}.playlists-cancel-btn{background-color:#f44336;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:15px;padding:12px 18px}.playlist-tabs{flex-wrap:wrap;justify-content:start;width:98%}.playlist-tabs,.tab{align-items:center;display:flex}.tab{background:#0000;color:silver;cursor:pointer;flex-direction:column;font-size:20px;justify-content:center;transition:.2s;width:130px}.tab.active,.tab:hover{color:#8baf5b}.tab.active{background:#0000;font-weight:700}.tab.active:after{background-color:#8baf5b;border-radius:2px;box-shadow:0 2px 4px 1px #232222;content:"";height:3px;width:80%}.tab.active:hover{color:#acd872}.del-tab-btn{background:#0000;border:none;color:inherit;cursor:pointer}.table-main h1{text-transform:uppercase}.table-main{margin-bottom:10px;position:relative}.folder-list{display:flex;flex-direction:column;gap:8px;margin:15px 0;max-height:200px;overflow-y:auto}.folder-tree-container{border:1px solid #ccc;border-radius:6px;height:90%;overflow-x:hidden;overflow-y:auto;padding:8px;width:100%}.folder-tree{font-family:sans-serif;margin-left:12px}.folder-item{align-items:center;cursor:pointer;display:flex;padding:3px 6px;transition:background-color .2s;-webkit-user-select:none;user-select:none}.folder-item:hover{background-color:#f0f0f0}.folder-item.selected{background-color:#007bff!important;border-radius:4px;color:#fff}.folder-children{border-left:1px solid #ddd;margin-left:16px;padding-left:6px;width:500px}.folder-icon{color:#f5a623;margin-right:6px}.file-icon{color:#888;margin-right:6px}.folder-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.playlists-main .table{display:flex;flex-direction:column;width:100%}.playlists-main .table tbody,.playlists-main .table thead{width:100%}.playlists-main .table tbody tr,.playlists-main .table thead tr{display:flex;flex-wrap:nowrap;justify-content:center;max-width:100%}.p-id{overflow:hidden;width:3%}.p-name{width:22%}.p-artist,.p-name{overflow:hidden;text-align:left}.p-artist{width:20%}.p-duration{overflow:hidden;width:8%}.p-filePath,.p-filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:21%}.p-btn{overflow:hidden;width:5%}.ps-name{text-align:left;width:70%}.ps-random{width:20%}.no-content{width:100%}@media (max-width:1600px){.playlists-page-main{height:95%;width:81%}.playlists-table-container{width:97%}}@media (max-width:1200px){.playlists-page-main{width:74%}}@media (max-width:900px){.playlists-page-main{height:49%;width:100%}.playlists-table-container{height:220px}}@media (max-width:600px){.playlists-page-main{height:45%;width:100%}.playlists-table-container{height:200px}}.whitelist-main{align-items:center;display:flex;flex-direction:column;height:80%;justify-content:baseline;margin:auto;width:80%}.whitelist-main h1{font-size:35px;font-weight:700;height:10%;margin-top:30px;text-transform:uppercase;width:100%}.whitelist-main .create-btn{align-items:center;display:flex;height:20%;justify-content:center;width:100%}.whitelist-main .create-btn button{background-color:#598759;border:none;border-radius:7px;box-shadow:0 3px 8px -2px #000;color:#e8e8e8;font-size:17px;font-weight:700;height:45px;text-transform:uppercase;width:150px}.whitelist-main .table-container{border:1px solid grey;border-radius:7px;margin-top:40px;max-height:600px;overflow-y:auto;scrollbar-color:#a4b541 #2d2d2d;scrollbar-width:thin;width:60%}.whitelist-main .table-container::-webkit-scrollbar{width:10px}.whitelist-main .table-container::-webkit-scrollbar-track{background:#2d2d2d;border-radius:5px}.whitelist-main .table-container::-webkit-scrollbar-thumb{background-color:#a4b541;border:2px solid #2d2d2d;border-radius:5px}.whitelist-main .table-container::-webkit-scrollbar-thumb:hover{background-color:#a4b541}.whitelist-main .table-container .table{background-color:initial;border-collapse:collapse;position:relative;width:100%}.whitelist-main .table-container .table thead th{background-color:#232c2b;padding:4px;position:-webkit-sticky;position:sticky;top:0;z-index:2}.whitelist-main .table-container .table thead tr{font-size:18px;font-weight:700}.whitelist-main .table-container .table thead{border-bottom:2px solid #a4a3a3}.table-container .table th,td{border:1px solid #383838}.table-container .table tr:nth-child(2n){background-color:#7d8480}.table-container .table tr:nth-child(odd){background-color:#616968}.table-container .table tr:hover{background-color:#3e4b4a}.table-container .table tbody th{font-size:17px;font-weight:700;padding:7px}.table-container .table td{padding:4px}.table-container .table .t-address{text-align:left;width:80%}.table-container .table .t-btn{width:12%}.table-container .table .del-btn,.table-container .table .edit-btn{background-color:initial;border:none;color:#cccbcb}.table-container .table .edit-btn:hover{color:#35e94a}.table-container .table .del-btn:hover{color:#d22a2a}.sidebar-content{font-size:20px;height:calc(100% - 40px);padding:20px;text-align:left;width:100%}.sidebar-content h2{font-size:27px}.sidebar ul{list-style:none;padding-left:0}.sidebar ul li{margin-bottom:10px}.sidebar ul li ul{margin-left:15px;margin-top:5px}.sidebar a{color:#e4e4e4;text-decoration:none}
/*# sourceMappingURL=main.396edaf0.css.map*/