/*
Theme Name: Yadegar Music
Theme URI: https://example.com
Author: Yadegar Music Team
Author URI: https://example.com
Description: قالب اختصاصی سایت یادگار موزیک؛ آرشیو دانلود و پخش آنلاین ترانه‌های نوستالژیک فارسی با هویت بصری «نوار کاست».
Version: 1.0
Requires at least: 5.8
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: yadegar-music
*/

:root{
    --bg-deep:#180F22;
    --bg-panel:#241832;
    --bg-panel-2:#2E1F3F;
    --gold:#E3B23C;
    --rose:#C15B4A;
    --ivory:#F3EDE3;
    --lavender:#A79BB8;
    --line: rgba(227,178,60,0.18);
    --radius: 3px;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:
      radial-gradient(1100px 600px at 85% -10%, rgba(193,91,74,0.16), transparent 60%),
      radial-gradient(900px 500px at -10% 20%, rgba(227,178,60,0.10), transparent 55%),
      var(--bg-deep);
    color:var(--ivory);
    font-family:'Vazirmatn', sans-serif;
    line-height:1.6;
    overflow-x:hidden;
  }
  .mono{font-family:'JetBrains Mono', monospace; letter-spacing:0.02em;}
  a{color:inherit; text-decoration:none;}
  ::selection{background:var(--gold); color:#180F22;}

  /* ===== texture ===== */
  .tape-noise{
    position:fixed; inset:0; pointer-events:none; z-index:2; opacity:0.035; mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  /* ===== header ===== */
  header{
    position:sticky; top:0; z-index:30;
    display:flex; align-items:center; justify-content:space-between;
    padding:18px 6vw;
    background:rgba(24,15,34,0.86);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  .logo{display:flex; align-items:center; gap:12px; font-weight:800; font-size:1.25rem;}
  .logo .reel{
    width:30px; height:30px; border-radius:50%;
    border:3px solid var(--gold);
    position:relative;
    animation:spin 6s linear infinite;
  }
  .logo .reel::after{
    content:""; position:absolute; inset:0; margin:auto;
    width:6px; height:6px; background:var(--gold); border-radius:50%;
  }
  @keyframes spin{ to{ transform:rotate(360deg); } }
  nav{display:flex; gap:30px; font-size:0.92rem; color:var(--lavender);}
  nav a:hover{color:var(--gold);}
  .header-actions{display:flex; align-items:center; gap:12px;}
  .search-btn{
    display:flex; align-items:center; gap:8px;
    border:1px solid var(--line); padding:9px 16px; border-radius:999px;
    font-size:0.85rem; color:var(--lavender); cursor:pointer; white-space:nowrap;
  }
  .search-btn:hover{border-color:var(--gold); color:var(--gold);}

  @media(max-width:900px){ nav{display:none;} }
  @media(max-width:520px){ .search-btn span{display:none;} }

  /* ===== account menu ===== */
  .account-menu{position:relative;}
  .account-menu summary{
    list-style:none; cursor:pointer; display:flex; align-items:center; gap:8px;
    border:1px solid var(--line); padding:6px 14px 6px 8px; border-radius:999px;
    color:var(--lavender); font-size:0.85rem; white-space:nowrap;
  }
  .account-menu summary::-webkit-details-marker{display:none;}
  .account-menu summary:hover, .account-menu[open] summary{border-color:var(--gold); color:var(--gold);}
  .account-menu .ic{
    width:26px; height:26px; border-radius:50%;
    background:linear-gradient(135deg, var(--gold), var(--rose));
    display:flex; align-items:center; justify-content:center; font-size:0.75rem; color:#1B1206; flex:0 0 auto;
  }
  .account-panel{
    position:absolute; top:calc(100% + 10px); left:0; width:230px;
    background:var(--bg-panel); border:1px solid var(--line); border-radius:8px;
    padding:16px; box-shadow:0 20px 40px -12px rgba(0,0,0,0.55); z-index:40;
  }
  .account-panel .hint{font-size:0.72rem; color:var(--lavender); margin-bottom:14px; line-height:1.7;}
  .account-panel .btn{width:100%; justify-content:center; margin-bottom:10px; font-size:0.85rem; padding:11px 20px;}
  .account-panel .btn:last-child{margin-bottom:0;}

  /* ===== hero: mixtape label ===== */
  .hero{
    position:relative;
    padding:8vh 6vw 7vh;
    display:grid; grid-template-columns:1.1fr 0.9fr; gap:6vw; align-items:center;
  }
  .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-family:'JetBrains Mono'; font-size:0.72rem; letter-spacing:0.18em;
    color:var(--rose); text-transform:uppercase; margin-bottom:22px;
  }
  .eyebrow::before{content:""; width:22px; height:1px; background:var(--rose);}
  h1{
    font-size:clamp(2.4rem, 5vw, 4.1rem);
    font-weight:800; line-height:1.18; letter-spacing:-0.01em;
    margin-bottom:22px;
  }
  h1 em{ font-style:normal; color:var(--gold); position:relative; }
  .hero p.lead{ color:var(--lavender); font-size:1.05rem; max-width:46ch; margin-bottom:34px; }
  .hero-actions{display:flex; gap:14px; flex-wrap:wrap;}
  .btn{
    padding:14px 26px; border-radius:2px; font-size:0.92rem; font-weight:600;
    cursor:pointer; border:1px solid transparent; display:inline-flex; align-items:center; gap:10px;
  }
  .btn-solid{background:var(--gold); color:#1B1206;}
  .btn-solid:hover{background:#efc35a;}
  .btn-ghost{border-color:var(--line); color:var(--ivory);}
  .btn-ghost:hover{border-color:var(--gold); color:var(--gold);}

  /* cassette visual */
  .cassette-wrap{position:relative; display:flex; justify-content:center;}
  .cassette{
    width:100%; max-width:380px; aspect-ratio:5/3.2;
    background:linear-gradient(160deg, var(--bg-panel-2), var(--bg-panel) 60%);
    border:1px solid var(--line); border-radius:10px;
    position:relative; box-shadow:0 30px 60px -20px rgba(0,0,0,0.6);
    padding:22px;
  }
  .cassette::before{
    content:""; position:absolute; inset:10px; border:1px dashed rgba(227,178,60,0.25); border-radius:6px;
  }
  .cassette .label{ position:relative; z-index:1; text-align:center; margin-bottom:18px; }
  .cassette .label .title{font-weight:700; font-size:0.95rem; color:var(--gold);}
  .cassette .label .sub{font-family:'JetBrains Mono'; font-size:0.66rem; color:var(--lavender); letter-spacing:0.08em;}
  .reels{display:flex; justify-content:space-around; align-items:center; padding:0 30px;}
  .cog{
    width:64px; height:64px; border-radius:50%;
    background:radial-gradient(circle at center, #100A18 0 14px, transparent 15px),
               repeating-conic-gradient(#3A2A50 0deg 10deg, #221731 10deg 20deg);
    border:2px solid rgba(227,178,60,0.4);
    animation:spin 4s linear infinite;
  }
  .cassette .window{
    position:absolute; bottom:18px; left:22px; right:22px; height:22px;
    background:rgba(24,15,34,0.6); border:1px solid var(--line); border-radius:3px;
  }

  /* ===== section shell ===== */
  section{padding:6vh 6vw;}
  .section-head{
    display:flex; align-items:baseline; justify-content:space-between;
    margin-bottom:36px; border-bottom:1px solid var(--line); padding-bottom:18px; flex-wrap:wrap; gap:10px;
  }
  .section-head h2{font-size:1.6rem; font-weight:800;}
  .section-head p{color:var(--lavender); font-size:0.85rem; margin-top:6px;}
  .section-head .tag{font-family:'JetBrains Mono'; font-size:0.72rem; color:var(--lavender);}
  .see-all{font-size:0.85rem; color:var(--rose);}
  .see-all:hover{color:var(--gold);}

  /* ===== track grid (new releases) ===== */
  .track-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(210px,1fr)); gap:22px; }
  .track-card{
    background:var(--bg-panel); border:1px solid var(--line); border-radius:6px; overflow:hidden;
    transition:transform .25s ease, border-color .25s ease;
  }
  .track-card:hover{transform:translateY(-4px); border-color:var(--gold);}
  .art{ aspect-ratio:1/1; position:relative; display:flex; align-items:center; justify-content:center; }
  .art .play{
    width:44px; height:44px; border-radius:50%; background:rgba(24,15,34,0.55);
    border:1px solid var(--gold); color:var(--gold);
    display:flex; align-items:center; justify-content:center;
    opacity:0; transition:opacity .2s ease; cursor:pointer;
  }
  .track-card:hover .art .play{opacity:1;}
  .track-info{padding:14px 16px 16px;}
  .track-info .t{font-weight:600; font-size:0.95rem; margin-bottom:4px;}
  .track-info .a{color:var(--lavender); font-size:0.82rem;}
  .track-meta{
    display:flex; justify-content:space-between; align-items:center;
    margin-top:12px; font-family:'JetBrains Mono'; font-size:0.72rem; color:var(--lavender);
  }
  .track-meta .cm{display:flex; align-items:center; gap:4px;}
  .dl{color:var(--rose); display:flex; align-items:center; gap:5px;}
  .dl:hover{color:var(--gold);}

  /* palette generator for placeholder art */
  .p1{background:linear-gradient(135deg,#C15B4A,#7A2E3C);}
  .p2{background:linear-gradient(135deg,#E3B23C,#8A5A20);}
  .p3{background:linear-gradient(135deg,#5B4A9E,#2E1F3F);}
  .p4{background:linear-gradient(135deg,#3E7A6B,#1F3F35);}
  .p5{background:linear-gradient(135deg,#9E4A7B,#3F1F32);}
  .p6{background:linear-gradient(135deg,#4A6E9E,#1F2E3F);}
  .p7{background:linear-gradient(135deg,#8A6A2E,#3F2E1F);}

  /* ===== category / nostalgic singers ===== */
  .cat-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:20px; }
  .cat-card{
    background:var(--bg-panel); border:1px solid var(--line); border-radius:8px;
    padding:24px 16px; text-align:center; transition:border-color .25s ease, transform .25s ease;
  }
  .cat-card:hover{border-color:var(--gold); transform:translateY(-3px);}
  .cat-card .avatar{width:74px; height:74px; border-radius:50%; margin:0 auto 14px; border:1px solid var(--line);}
  .cat-card .name{font-weight:700; font-size:0.95rem; margin-bottom:4px;}
  .cat-card .tag{font-family:'JetBrains Mono'; font-size:0.66rem; color:var(--rose); letter-spacing:0.04em;}
  .cat-card .add{
    margin-top:14px; font-size:0.72rem; color:var(--lavender); border:1px dashed var(--line);
    border-radius:999px; padding:6px 12px; display:inline-block;
  }
  .cat-card:hover .add{border-color:var(--gold); color:var(--gold);}
  .cat-card.more{
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    border-style:dashed; color:var(--lavender); gap:6px;
  }
  .cat-card.more .plus{font-size:1.6rem; color:var(--gold);}

  /* ===== chart list (mixtape label ticket) ===== */
  .chart-list{border-top:1px solid var(--line);}
  .chart-row{
    display:grid; grid-template-columns:52px 1fr auto 44px; align-items:center; gap:18px;
    padding:16px 10px; border-bottom:1px solid var(--line);
    transition:background .2s ease;
  }
  .chart-row:hover{background:rgba(227,178,60,0.05);}
  .chart-row .num{font-family:'JetBrains Mono'; color:var(--rose); font-size:1.1rem; font-weight:500;}
  .chart-row .info .t{font-weight:600; font-size:0.98rem;}
  .chart-row .info .a{color:var(--lavender); font-size:0.82rem; margin-top:2px;}
  .chart-row .dur{font-family:'JetBrains Mono'; color:var(--lavender); font-size:0.74rem; text-align:left; white-space:nowrap;}
  .chart-row .dlbtn{
    width:34px; height:34px; border:1px solid var(--line); border-radius:50%;
    display:flex; align-items:center; justify-content:center; color:var(--lavender);
    justify-self:end;
  }
  .chart-row:hover .dlbtn{border-color:var(--gold); color:var(--gold);}
  @media(max-width:560px){ .chart-row{grid-template-columns:36px 1fr 44px;} .chart-row .dur{display:none;} }

  /* ===== most viewed / most played split ===== */
  .split-charts{display:grid; grid-template-columns:1fr 1fr; gap:40px;}
  @media(max-width:760px){ .split-charts{grid-template-columns:1fr;} }
  .sub-chart h3{
    font-size:1.05rem; font-weight:700; margin-bottom:6px; display:flex; align-items:center; gap:8px;
  }
  .sub-chart h3 .ic{color:var(--gold);}
  .sub-chart .cap{font-size:0.76rem; color:var(--lavender); margin-bottom:16px;}
  .mini-row{
    display:grid; grid-template-columns:26px 1fr auto; align-items:center; gap:14px;
    padding:12px 4px; border-bottom:1px solid var(--line);
  }
  .mini-row .num{font-family:'JetBrains Mono'; color:var(--rose); font-size:0.92rem;}
  .mini-row .info .t{font-weight:600; font-size:0.9rem;}
  .mini-row .info .a{color:var(--lavender); font-size:0.76rem; margin-top:2px;}
  .mini-row .stat{font-family:'JetBrains Mono'; font-size:0.72rem; color:var(--lavender); text-align:left; white-space:nowrap;}

  /* ===== contact ===== */
  .contact-wrap{display:grid; grid-template-columns:1fr 1fr; gap:22px;}
  @media(max-width:700px){ .contact-wrap{grid-template-columns:1fr;} }
  .contact-card{
    background:var(--bg-panel); border:1px solid var(--line); border-radius:8px;
    padding:30px; display:flex; flex-direction:column; gap:12px;
  }
  .contact-card .ic{
    width:46px; height:46px; border-radius:50%; background:rgba(227,178,60,0.12);
    border:1px solid var(--gold); color:var(--gold); display:flex; align-items:center; justify-content:center;
    font-size:1.2rem;
  }
  .contact-card .label{font-size:0.78rem; color:var(--lavender);}
  .contact-card .value{font-family:'JetBrains Mono'; font-size:1.02rem; color:var(--ivory); word-break:break-all;}
  .contact-card a.value:hover{color:var(--gold);}
  .contact-card .cta-mini{align-self:flex-start; margin-top:4px; padding:10px 20px; font-size:0.82rem;}

  /* ===== song detail example + comments ===== */
  .song-detail{background:var(--bg-panel); border:1px solid var(--line); border-radius:10px; overflow:hidden;}
  .song-head{
    display:flex; gap:22px; align-items:center; padding:26px; border-bottom:1px solid var(--line); flex-wrap:wrap;
  }
  .song-head .art{width:110px; height:110px; border-radius:8px; flex:0 0 auto;}
  .song-head .meta{flex:1; min-width:220px;}
  .song-head .meta .t{font-size:1.3rem; font-weight:800; margin-bottom:6px;}
  .song-head .meta .a{color:var(--lavender); font-size:0.9rem; margin-bottom:14px;}
  .song-head .meta .actions{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px;}
  .song-head .stats{display:flex; gap:20px; font-family:'JetBrains Mono'; font-size:0.74rem; color:var(--lavender); flex-wrap:wrap;}
  .comments{padding:26px;}
  .comments h3{font-size:1.1rem; font-weight:700; margin-bottom:20px;}
  .comment{display:flex; gap:14px; margin-bottom:20px;}
  .comment .cav{width:40px; height:40px; border-radius:50%; flex:0 0 auto;}
  .comment .body{flex:1; min-width:0;}
  .comment .row1{display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:4px;}
  .comment .name{font-weight:700; font-size:0.88rem;}
  .comment .time{font-family:'JetBrains Mono'; font-size:0.66rem; color:var(--lavender); white-space:nowrap;}
  .comment .text{color:var(--ivory); font-size:0.88rem; line-height:1.8;}
  .comment-form{display:flex; gap:10px; margin-top:24px; padding-top:22px; border-top:1px solid var(--line); flex-wrap:wrap;}
  .comment-form textarea{
    flex:1; min-width:200px; background:rgba(24,15,34,0.6); border:1px solid var(--line); color:var(--ivory);
    border-radius:6px; padding:12px 14px; font-family:'Vazirmatn'; resize:vertical; min-height:46px;
  }
  .comment-form textarea::placeholder{color:var(--lavender);}
  .comment-form .btn{align-self:flex-start;}

  /* ===== newsletter / cta ===== */
  .cta{
    margin:6vh 6vw; padding:60px 6vw; border-radius:8px;
    background:linear-gradient(120deg, var(--bg-panel-2), var(--bg-panel));
    border:1px solid var(--line);
    display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:28px;
  }
  .cta h3{font-size:1.6rem; font-weight:800; max-width:26ch;}
  .cta p{color:var(--lavender); margin-top:8px; max-width:40ch;}
  .cta form{display:flex; gap:10px;}
  .cta input{
    background:rgba(24,15,34,0.6); border:1px solid var(--line); color:var(--ivory);
    padding:13px 16px; border-radius:2px; font-family:'Vazirmatn'; min-width:220px;
  }
  .cta input::placeholder{color:var(--lavender);}

  /* ===== player bar ===== */
  .player{
    position:sticky; bottom:0; z-index:20;
    display:flex; align-items:center; gap:18px;
    padding:14px 6vw; background:rgba(20,13,29,0.92); backdrop-filter:blur(10px);
    border-top:1px solid var(--line);
  }
  .player .pcog{width:38px; height:38px; border-radius:50%; background:repeating-conic-gradient(#3A2A50 0deg 10deg, #221731 10deg 20deg); border:2px solid var(--gold); animation:spin 3s linear infinite;}
  .player .meta{flex:1; min-width:0;}
  .player .meta .t{font-weight:600; font-size:0.88rem;}
  .player .meta .a{color:var(--lavender); font-size:0.75rem;}
  .player .controls{display:flex; align-items:center; gap:16px; color:var(--lavender);}
  .player .controls .center{width:38px; height:38px; border-radius:50%; border:1px solid var(--gold); color:var(--gold); display:flex; align-items:center; justify-content:center;}
  .player .track{flex:2; height:3px; background:rgba(255,255,255,0.08); border-radius:2px; display:none; position:relative;}
  .player .track span{position:absolute; inset:0; width:38%; background:var(--gold); border-radius:2px;}
  @media(min-width:760px){ .player .track{display:block;} }

  /* ===== footer ===== */
  footer{
    padding:50px 6vw 30px; border-top:1px solid var(--line);
    display:flex; flex-wrap:wrap; justify-content:space-between; gap:30px;
    color:var(--lavender); font-size:0.85rem;
  }
  footer .cols{display:flex; gap:60px; flex-wrap:wrap;}
  footer .cols div{display:flex; flex-direction:column; gap:10px;}
  footer .cols .h{color:var(--ivory); font-weight:700; margin-bottom:4px; font-size:0.82rem;}
  footer a:hover{color:var(--gold);}