body{background-color: #FFFFFF;color: #262626;}
body *{font-family: "Nunito", sans-serif; margin:0; padding:0; font-size:small; line-height:20px;}
/* Modernized Global Image Corners */
a img,:link img,:visited img,img {
  background: url('/images/blocks-wave.svg') center center no-repeat;
  background-size:cover;
  border-radius: 8px; /* Changed from 3px to 8px */
  box-shadow: none;
  filter: brightness(1.26);
  transition: opacity .5s ease-in-out .1s;
}
a{text-decoration:none; color: #262626;}
a:hover{text-decoration:none;color: #262626;}
body, td{  margin:0;  padding:0;  font-size:small;}
b{ font-weight:bold;}
textarea{ font-size:small;}
.input-t, .input-t:focus {
            padding: 10px;
            width: 60%;
            margin-top: 5px;
            margin-bottom: 5px;
            border-radius: 0px!important;
            border-color: #262626;
            border: 2px solid #262626 !important;
            outline: none !important;
        }
.input-b {
            padding: 10px;
            width: 35%;
            margin-left: -5px;
            border-radius:20px;
            background-color: #262626;
            color: #FFFFFF;
            border: 1px solid #262626 !important;
        }
.mt-2 {
            padding: 11px;
            width: 25%;
            margin-left: -5px;
            border-radius: none;
            background-color: #262626;
            color: #FFFFFF;
            font-weight: bold;
            border: 1px solid #262626 !important;
        }
.popula-track {
            position:absolute;
            top:5px;
            right:5px;
            background-color:#fdba29;
            border-radius:20px;
            font-size:10px;
            font-weight:bold;
            letter-spacing:1px;
            color: #262626;
            padding:1px 8px;
            text-transform:uppercase;
        }
/* =======================================================
   MODERNIZED HORIZONTAL SCROLL CARDS (ALBUM/ARTIST)
======================================================= */
.artist-container, .album-container {
    display: flex;
    align-items: flex-start; /* CRITICAL: Prevents cards from stretching vertically */
    overflow-x: auto;
    padding: 10px 0; /* Reduced bottom padding */
    -webkit-overflow-scrolling: touch; 
    scrollbar-width: none; 
}
.artist-container::-webkit-scrollbar, .album-container::-webkit-scrollbar {
    display: none; 
}
.album-container {
    border-bottom: 0.1px solid #dddddd;
}
/* Ensure the wrapping link tags behave properly in horizontal scroll */
.artist-container > a, .album-container > a {
    display: block;
    flex-shrink: 0;
    text-decoration: none;
}
.artist-card, .album-card {
    width: 120px;
    text-align: center;
    padding: 8px; /* Adjusted to 8px */
    border-radius: 12px;
    min-width: 120px;
    transition: background-color 0.2s ease, transform 0.2s ease;
    position: relative;
    /* Use flex column to snap tight to contents and eliminate empty gaps */
    display: flex;
    flex-direction: column;
    align-items: center;
}
.artist-card:hover, .album-card:hover {
    background-color: #f4f7fb;
    transform: translateY(-2px); 
}
/* Lock the internal container to exactly 100x100 to fix overlay positioning */
.artist-card .container, .album-card .container {
    width: 100px;
    height: 100px;
    position: relative;
    display: block;
}
.artist-card img {
    border-radius: 50%;
    width: 100px;
    height: 100px;
    object-fit: cover;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1); 
    display: block; /* Removes baseline gap */
}
.album-card img {
    border-radius: 8px; 
    width: 100px;
    height: 100px;
    object-fit: cover;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    display: block; /* Removes baseline gap */
}
.artist-card .name, .album-card .name {
    width: 100%;
    font-weight: 700;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 8px;
    color: #262626;
}
.artist-card .role, .album-card .role {
    width: 100%;
    font-style: normal;
    font-size: 12px;
    color: #007bff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 2px;
}
.album-card .duration {
    position: absolute;
    bottom: 4px;
    left: 4px;
    font-size:10px;
    font-weight: bold;
    letter-spacing:1px;
    text-transform:uppercase;
    padding:1px 8px;
    border-radius:20px;
    background: rgba(0, 0, 0, 0.48);
    color: #FFFFFF !important;
    display: flex;
    align-items: center;
    margin: 0;
}
.album-card .duration::before {
    content: "\f017";
    font-family: "Font Awesome 7 Free";
    margin-right: 2px;
}
/* ======================================================= */
.dots span {
    animation: blink 1.5s infinite;
    opacity: 0;
}
.dots span:nth-child(1) { animation-delay: 0s; }
.dots span:nth-child(2) { animation-delay: 0.5s; }
.dots span:nth-child(3) { animation-delay: 1s; }
@keyframes blink {
    0% { opacity: 0; }
    50% { opacity: 1; }
    100% { opacity: 0; }
}
.dlbtn{ background-color: #262626;color:white;border:none;border-radius:20px;padding:10px;width:78%;font-weight:bold;cursor:pointer;margin:3px; }
.dlbtn a{ color:white; text-decoration:none; }
audio{border-radius:20px;height:40px;border:1px solid #606060;}
.tCenter{text-align:center;}
/* Adjusted border heights (18px) to match the new 36px height of .more (8px padding + 20px line-height + 8px padding) */
/* Increased right-border slightly to 11px to completely cover any sub-pixel rendering hairline gaps */
.more::before {content:'';position:absolute;border-top:18px solid transparent;border-bottom:18px solid transparent;border-right:11px solid #262626;left:-10px;top:0;}
/* Adjusted padding to 8px 15px */
.more {padding:8px 15px;background: #262626;position:absolute;right:0;top:0;font-size:12px;cursor:pointer;font-weight:700;color: #FFFFFF;}
.more a {color: #FFFFFF;}
.container { position:relative; text-align:center; }
.d-flex{display:flex;text-align:center!important}
.justify-content-center{justify-content:center;text-align:center!important}
.logo {background: #262626; color: #FFFFFF; padding:2px; top:0; z-index:10; text-align:center; border-bottom:3px solid #262626;}
.logo a{color: #FFFFFF; font-weight:bold;}
.search{background: #262626;border:1px dashed #FFFFFF; padding:2px; color: #FFFFFF; font-weight:bold; text-align:center;}
/* Adjusted padding to 8px */
h1, h2, h3{ background: #F2F2F2;font-weight:bold;font-size:16px;padding:8px;min-height:20px;border-bottom: #e9e9e9 solid 2px;position:relative;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
h2 a{ color: #FFFFFF;}
h3{ text-align:left;}
.clr{clear:both;}
.absmiddle{vertical-align:middle;}
.ct{margin-right:3px; vertical-align:middle; padding:1px; border:1px solid #999;}
.odd, .even, .sl{vertical-align:middle;}
.odd{}
.even{}
.description{background: #F2F2F2; color: #222; padding:2px; text-align:center;}
.description a{text-decoration:underline;}
.filedescription{background: #F2F2F2; padding:5px 0; text-align:center; border-top:1px solid #dddddd; border-bottom:1px solid #dddddd;}
/* =======================================================
   MODERNIZED .fm (FILE MAIN IMAGE & OVERLAYS)
======================================================= */
.fm {
    text-align: center;
    background-color: #ffffff;
    border-bottom: 0.1px solid #dddddd;
    padding-top: 3px;
    padding-bottom: 0px;
}
.fm a {
    display: inline-block;
    padding: 0px;
    position: relative;
    text-decoration: none;
}
.fm .container {
    position: relative;
    display: inline-block;
    border-radius: 8px;
    overflow: hidden; /* Important: keeps absolute overlays within the rounded border */
    margin: 0 auto;
}
.fm a img, .fm a video {
    padding: 0;
    margin: 0 auto;
    display: block; /* FIX: Removes baseline bottom spacing gap */
    border-radius: 8px;
}
/* ======================================================= */
/* =======================================================
   MODERNIZED .fl (FILE LIST) STYLES
======================================================= */
.fl {
    border-bottom: 0.1px solid #dddddd;
    background-color: #ffffff;
}
/* Adjusted padding to 8px 6px */
.fl td { padding:8px 6px; border-bottom:0.1px solid #dddddd; }
.fl a {
    display: block;
    padding: 12px 14px;
    text-decoration: none;
    color: #262626;
}
.fl a > div {
    display: flex;
    align-items: center; 
    gap: 15px; 
    width: 100%;
}
.fl a div div {
    display: block; 
}
.fl a img {
    padding: 0;
    margin: 0;
    border-radius: 8px; 
    box-shadow: 0 3px 8px rgba(0,0,0,0.12); 
    object-fit: cover;
}
.fl a > div > div:last-child {
    flex: 1; 
    line-height: 1.5;
    font-size: 15px;
    font-weight: bold;
}
.fl span {
    font-weight: normal;
    color: #666666; 
    font-size: 13px;
    display: inline-block;
    margin-top: 2px;
}
.fl span[id^="statusupdate-"] {
    color: #262626;
}
.fl span.ar {
    color: #007bff; 
    font-style: normal;
    font-weight: 500;
}
.fl span.mc {
    font-size: 80%;
}
.fl span.alb {
    color: #67b241;
    font-style: italic;
}
/* =======================================================
   REVERTED DENTERED BADGE (File Counts)
======================================================= */
.dentered {
    position: absolute;
    bottom: 6px;
    left: 2px;
    font-size:10px;
    font-weight: bold;
    letter-spacing:1px;
    text-transform:uppercase;
    padding:1px 8px;
    border-radius:20px;
    background: rgba(0, 0, 0, 0.48);
    color: #FFFFFF !important;
    display: flex;
    align-items: center;
    margin: 3px;
    z-index: 3; /* ensures it stays on top of the image */
}
.dentered::before {
    content: "\f017";
    font-family: "Font Awesome 7 Free";
    margin-right: 2px;
}
.fm .dentered {margin-bottom: 0;}
/* ======================================================= */
.tblimg{width:65px; text-align:center;}
.catRow div{ display:table-cell;}
.catRow div img{ padding:0;margin-right:5px;}
.link1{ color: #0E71C6;}
.button{color: #086C8F; font-weight:bold;}
.red{color:red;}
.info{color:red;text-align:center; padding:2px;}
p{ padding:2px 0;}
table{width:100%;margin:auto;}
.table{width:100%;max-width:100%;margin-bottom:3px;border-spacing:0;border-collapse:collapse;}
.text-right{text-align:left }
.table-bordered>tbody>tr>td{border:0.1px solid #dddddd;}
.table>tbody>tr>td{padding:12px;line-height:1.42857143;vertical-align:top }
.table-bordered>tbody>tr>th{border:0.1px solid #262626;background: #262626;color: #FFFFFF;font-size:15px;padding:8px 8px 8px 7px;text-align:center;}
.table-bordered{border:0px solid #dddddd; }
.devider{height:5px;}
.dtype{border-bottom:0.1px solid #dddddd; font-size:small;padding-bottom:5px; text-align:center;}
.dtype span{ border:0.1px solid #d50; padding:3px; border-radius:20px; background: #d50; color: #F2F2F2;}
.dtype a{border:0.1px solid #F2F2F2; padding:3px; border-radius:20px; background: #F2F2F2;}
.fileName{font-weight:bold;}
.fileName span{ color: #262626; text-decoration:none;}
.fileName img{ padding-right:3px;}
.downLink{margin:5px 0;}
.pgn{text-align:center; padding-top:10px; background: #F2F2F2; border-bottom: #e9e9e9 solid 2px;color: #262626;margin-top:2px;}
.pgn a,.pgn span{border:1px solid #F2F2F2; padding:2px 5px; margin:0 2px; background: #dddddd;border-radius:20px; text-decoration:none; font-weight:bold;}
.pgn a:hover, .pgn span{background: #dddddd; border:1px solid #F2F2F2;}
.pgn input[type="submit"] {background: #dddddd;}
.pgn div{padding-top:5px;}
.showimage{padding:5px; text-align:center;}
a.top {color: #FF7F00; text-decoration:none;}
/* =======================================================
   MODERNIZED .updates div (Disclaimer, Privacy, Info text)
======================================================= */
.updates {
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
}
.updates div {
    padding: 14px 16px;
    border-bottom: 1px solid #eeeeee;
    line-height: 1.6;
    color: #444444;
    font-size: 14px;
    transition: background-color 0.2s ease-in-out;
}
.updates div:last-child {
    border-bottom: none;
}
.updates div:hover {
    background-color: #f4f7fb; 
}
.updates div strong:first-child {
    color: #262626; 
    font-size: 15px;
    margin-right: 4px;
}
/* New Semantic Classes for Privacy & Legal Pages */
.updates p.policy-heading {
    font-size: 16px;
    font-weight: 800;
    color: #262626;
    margin: 20px 16px 5px 16px;
    padding-bottom: 5px;
    border-bottom: 2px solid #eeeeee;
}
.updates p.policy-text {
    padding: 5px 16px;
    color: #444444;
    font-size: 14px;
    line-height: 1.6;
}
.updates p.policy-highlight {
    background: #e8f5e9; /* Soft green background */
    color: #0f5132; /* Deep green text */
    border-left: 4px solid #198754; /* Green accent border */
    padding: 12px 16px;
    margin: 10px 16px 20px 16px;
    font-weight: 600;
    font-size: 14px;
    border-radius: 4px;
    line-height: 1.6;
}
.updates p.policy-footer {
    padding: 16px;
    color: #262626;
    font-weight: 600;
    font-size: 14px;
    text-align: center;
    background: #f4f7fb;
    border-top: 1px solid #eeeeee;
    margin-top: 10px;
}
/* ======================================================= */
.catRow,.catRowHome{border-bottom:0.1px solid #dddddd; font-weight:bold;}
.catRow a, .catRowHome a{display:block; font-weight:bold;background:url(../images/arrow.png) right center no-repeat;padding:8px;}
.catRow a div span, .catRowHome  a div span{color: #5a5; font-weight:normal;}

.artistRow a{ border-top:0.1px solid #dddddd;}
.artistRow a{ font-weight:bold; display:block; padding:10px;}
.az{background: #dde7f1;text-align:center; padding:10px; border-radius:20px;width:90%;margin: 0 auto;}
.az a{background: #FFFFFF;border:1px solid #395b9b; padding:5px 8px; margin:1px; display:inline-block;border-radius:.25rem!important; text-decoration:none; font-weight:bold;}
.az a:hover{background: #00BFFF;}
/* Adjusted padding to 8px */
.path{background: #F2F2F2;font-weight:bold;font-size:16px;padding:8px;border-bottom: #e9e9e9 solid 2px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.fshow{padding-top:3px; text-align:center;border-bottom:0px solid #dddddd;}
.thumbimg{ vertical-align:middle;}
.f1 {padding:5px; font-weight:bold; text-align:center; background-color: #262626;color: #FFFFFF;}
.f1 a{color: #FFFFFF;}
input[type=submit]:hover {background: #262626;color: #FFFFFF;}
input[type=submit] {margin-top:3px;margin-left:2px;margin-right:2px;}
input, select {padding:8px;margin:1px;border-radius:20px;border:0.1px solid #dddddd;text-align:center;}
input:focus{padding:8px;margin:1px;border-radius:20px;border:none;text-align:center;}
.input-wrapper {
            position: relative;
            display: inline-block;
            vertical-align: middle;
            margin: 1px;
        }
#saavn-search-box, #ghost-input {
            width: 100%;
            box-sizing: border-box;
            padding: 8px !important;
            border-radius:20px;
            border: 0.1px solid #dddddd;
            margin: 1px !important;
        }
#ghost-input {
            position: absolute;
            top: 0; 
            left: 0;
            background: #FFFFFF; 
            color: #606060; 
            z-index: 1;
            border-color: transparent;
            pointer-events: none;
            text-align: left !important;
        }
#saavn-search-box {
            position: relative;
            z-index: 2;
            background: transparent !important; 
            text-align: center;
        }
#saavn-search-box:focus {
            border: 0.1px solid #dddddd;
            outline: none;
        }
#saavn-search-box:not(:placeholder-shown) {
    text-align: left !important;
}
/* =======================================================
   BITRATE BUTTONS (filelist.php)
======================================================= */
.date-badge {
    position: absolute;
    top: 5px;
    left: 5px;
    background: #fdba29;
    border-radius:20px;
    font-size:10px;
    font-weight: bold;
    letter-spacing:1px;
    text-transform:uppercase;
    padding:1px 8px;
    color: #262626;
    z-index: 3;
}
.kbps-btn {
    position: absolute;
    right: 10px;
    z-index: 3;
    background: #fdba29;
    border-radius:20px;
    font-size: 14px;
    font-weight: 900;
    letter-spacing: 0.33px;
    color: #262626;
    text-transform: uppercase;
    padding: 5px 8px;
    cursor: pointer;
}
/* Specific heights for each bitrate button */
.kbps-32  { bottom: 210px; }
.kbps-64  { bottom: 176px; }
.kbps-96  { bottom: 142px; }
.kbps-128 { bottom: 108px; }
.kbps-192 { bottom: 74px; }
.kbps-256 { bottom: 40px; }
.kbps-320 { bottom: 6px; }
.kbps-size {
    background: #262626;
    color: #fdba29;
    padding: 2px 6px;
    border-radius: 8px;
}
/* =======================================================
   AUTO-HIDE COVER OVERLAYS AFTER 6 SECONDS
======================================================= */
/* 1. Base state: Element is visible by default */
.fm .kbps-btn {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    
    /* Animates to hidden state after a 6-second delay */
    animation: hideOverlay 0.2s ease-in-out 6s forwards;
    
    /* Ensures smooth fade-in when the animation is canceled on hover */
    transition: opacity 0.2s ease, visibility 0.2s ease;
}
@keyframes hideOverlay {
    0% { 
        opacity: 1; 
        visibility: visible; 
    }
    100% { 
        opacity: 0; 
        visibility: hidden; 
        pointer-events: none; 
    }
}
/* 2. Hover state: Cancel animation */
.fm:hover .kbps-btn,
.fm:active .kbps-btn {
    animation: none; /* Kills the hide animation */
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}