/*
Theme Name: RapTime
Theme URI: https://example.com/raptime
Author: RapTime
Description: RapTime.net rap muzik portali temasinin birebir + responsive yeniden yapimi. Ana sayfa haber bloklari, albumler arsivi (A-Z), muzik/album gridleri ve reklam alanlari icerir. Tum gorseller yer tutucudur; kendi gorsellerinizle degistirin.
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: raptime
*/

/* =========================================================
   0. Degiskenler / Tasarim tokenlari
   ========================================================= */
:root{
  --black:#0d0d0d;
  --nav-bg:#101010;
  --nav-bg2:#1c1c1c;
  --accent:#1a85a8;
  --accent-dark:#13647f;
  --accent-light:#8fd4ea;
  --snav-from:#2c97bc;
  --snav-to:#16708f;
  --heading-dark:#1d1d1d;
  --link:#15789f;
  --link-hover:#0e5a78;
  --panel-border:#1a85a8;
  --card-border:#d2d2d2;
  --grey-bg:#e7e7e7;
  --grey-soft:#f2f2f2;
  --grey-line:#cfcfcf;
  --text:#333;
  --muted:#777;
  --maxw:1000px;
  --gap:16px;
  --font-head:"Oswald","Arial Narrow",Arial,sans-serif;
  --font-body:"Open Sans",Arial,Helvetica,sans-serif;
}

/* =========================================================
   1. Reset / temel
   ========================================================= */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family:var(--font-body);
  font-size:14px;
  line-height:1.5;
  color:var(--text);
  background:#fff;
}
img{max-width:100%;height:auto;display:block;}
a{color:var(--link);text-decoration:none;}
a:hover{color:var(--link-hover);text-decoration:underline;}
h1,h2,h3,h4{margin:0;font-family:var(--font-head);font-weight:700;line-height:1.05;}
p{margin:0 0 .8em;}
ul{margin:0;padding:0;list-style:none;}

.rt-container{max-width:var(--maxw);margin:0 auto;padding:0 12px;}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);}

/* =========================================================
   2. Site ust kismi (skyline + ust menu + logo)
   ========================================================= */
.rt-topbar{
  position:relative;
  background:#0c0c0c;
  background-image:
    linear-gradient(180deg,#1a1a1a 0%,#0c0c0c 60%,#070707 100%);
  border-bottom:3px solid #000;
}
/* generic city skyline (SVG data uri, telifsiz) */
.rt-skyline{
  position:absolute;inset:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1000' height='120' viewBox='0 0 1000 120'><g fill='%23262626'><rect x='0' y='60' width='40' height='60'/><rect x='44' y='30' width='30' height='90'/><rect x='80' y='70' width='50' height='50'/><rect x='136' y='20' width='26' height='100'/><rect x='168' y='55' width='44' height='65'/><rect x='220' y='40' width='34' height='80'/><rect x='262' y='75' width='60' height='45'/><rect x='330' y='25' width='28' height='95'/><rect x='364' y='62' width='48' height='58'/><rect x='420' y='45' width='30' height='75'/><rect x='458' y='70' width='54' height='50'/><rect x='520' y='32' width='26' height='88'/><rect x='552' y='58' width='46' height='62'/><rect x='606' y='42' width='32' height='78'/><rect x='646' y='72' width='58' height='48'/><rect x='712' y='28' width='26' height='92'/><rect x='744' y='60' width='48' height='60'/><rect x='800' y='48' width='30' height='72'/><rect x='838' y='68' width='56' height='52'/><rect x='900' y='34' width='26' height='86'/><rect x='932' y='64' width='48' height='56'/></g></svg>");
  background-repeat:repeat-x;
  background-position:bottom center;
  opacity:.7;
  pointer-events:none;
}
.rt-topbar-inner{position:relative;z-index:2;display:flex;align-items:flex-start;justify-content:space-between;min-height:96px;gap:12px;}

/* Logo */
.rt-logo{padding:14px 0 0;}
.rt-logo a{display:inline-flex;align-items:baseline;gap:2px;text-decoration:none;}
.rt-logo .mark{
  display:inline-block;width:30px;height:26px;margin-right:6px;align-self:center;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 28' fill='%23ffffff'><path d='M2 26 L2 6 Q2 2 7 2 L20 2 Q26 2 26 9 L30 6 L30 12 L24 13 Q22 18 14 18 L10 18 L10 26 Z'/></svg>") no-repeat center/contain;
}
.rt-logo .word{font-family:var(--font-head);font-weight:700;font-size:38px;letter-spacing:.5px;color:#fff;text-transform:none;}
.rt-logo .word b{color:#fff;}
.rt-logo .word .tld{color:var(--accent-light);font-size:38px;}

/* Ust (birincil) menu */
.rt-primary-nav{align-self:stretch;display:flex;align-items:center;flex:1;}
.rt-primary-nav ul{display:flex;flex-wrap:wrap;align-items:center;}
.rt-primary-nav li{position:relative;}
.rt-primary-nav li + li::before{content:"|";color:#444;padding:0 10px;}
.rt-primary-nav a{
  display:inline-block;color:#fff;font-family:var(--font-head);font-weight:500;
  text-transform:uppercase;letter-spacing:.5px;font-size:15px;padding:6px 0;
}
.rt-primary-nav a:hover,.rt-primary-nav .current-menu-item>a{color:var(--accent-light);text-decoration:none;}

/* Mobil menu acma butonu */
.rt-nav-toggle{display:none;background:none;border:1px solid #444;color:#fff;font-size:18px;padding:6px 12px;cursor:pointer;border-radius:3px;}

/* =========================================================
   3. Ikincil menu (mavi grunge bar)
   ========================================================= */
.rt-secondary-nav{
  background:linear-gradient(180deg,var(--snav-from),var(--snav-to));
  position:relative;overflow:hidden;border-top:1px solid rgba(255,255,255,.15);
}
.rt-secondary-nav::after{ /* hafif doku */
  content:"";position:absolute;inset:0;opacity:.18;pointer-events:none;
  background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.08) 0 2px,transparent 2px 6px);
}
.rt-secondary-nav ul{position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;min-height:54px;}
.rt-secondary-nav li + li::before{content:"|";color:rgba(255,255,255,.45);padding:0 14px;font-size:22px;}
.rt-secondary-nav a{
  color:#0e5e79;font-family:var(--font-head);font-weight:700;text-transform:uppercase;
  font-size:26px;letter-spacing:.5px;text-shadow:0 1px 0 rgba(255,255,255,.15);
}
.rt-secondary-nav a:hover,
.rt-secondary-nav .current-menu-item>a,
.rt-secondary-nav .active>a{color:#fff;text-decoration:none;}

/* =========================================================
   4. Bolum basligi paterni (iki renkli + OVERGROUND seridi)
   ========================================================= */
.rt-section-head{margin:0 0 10px;}
.rt-section-head h2{font-size:26px;text-transform:uppercase;color:var(--heading-dark);letter-spacing:.5px;}
.rt-section-head h2 span{color:var(--accent);}
.rt-overground-strip{
  height:16px;line-height:16px;overflow:hidden;white-space:nowrap;
  font-family:var(--font-head);font-weight:700;font-size:11px;letter-spacing:2px;
  color:var(--accent);opacity:.75;border-bottom:1px solid var(--grey-line);
  margin-bottom:12px;
}
.rt-overground-strip.on-dark{color:#bfe6f2;border-bottom-color:rgba(255,255,255,.2);}

/* =========================================================
   5. HERO (one cikan gorsel + promo kutusu + carousel)
   ========================================================= */
.rt-hero{display:flex;gap:var(--gap);margin:14px 0;}
.rt-hero-feature{flex:1 1 58%;min-width:0;}
.rt-hero-feature .ph{
  position:relative;aspect-ratio:16/9;border-radius:2px;overflow:hidden;
  background:linear-gradient(135deg,#7a1f12,#c0461e 45%,#e8a33b);
  display:flex;align-items:flex-end;
}
.rt-hero-feature .ph .label{color:#fff;font-family:var(--font-head);font-weight:700;font-size:46px;
  text-transform:uppercase;padding:18px;text-shadow:0 2px 6px rgba(0,0,0,.5);}
.rt-hero-side{flex:1 1 40%;display:flex;flex-direction:column;gap:10px;min-width:0;}
.rt-promo{
  background:linear-gradient(180deg,var(--accent),var(--accent-dark));
  color:#eaf6fb;padding:16px 18px;border-radius:2px;flex:1 1 auto;
}
.rt-promo .eyebrow{font-size:11px;letter-spacing:1px;color:#cdeaf3;text-transform:uppercase;}
.rt-promo h3{font-size:26px;color:var(--accent-light);text-transform:none;margin:2px 0 8px;}
.rt-promo p{font-size:13px;color:#e6f4f9;margin:0;}

/* Album carousel */
.rt-carousel{background:#0e0e0e;border-radius:2px;padding:10px 8px;position:relative;}
.rt-carousel .strip{font-family:var(--font-head);font-weight:700;font-size:10px;letter-spacing:2px;color:#3f9fc0;white-space:nowrap;overflow:hidden;height:14px;margin-bottom:8px;}
.rt-carousel .track{display:flex;gap:8px;align-items:center;}
.rt-carousel .nav{background:none;border:none;color:#6cc1de;font-size:22px;cursor:pointer;padding:0 2px;line-height:1;}
.rt-carousel .covers{display:flex;gap:8px;overflow:hidden;flex:1;}
.rt-cover{flex:0 0 auto;width:72px;}
.rt-cover .art{width:72px;height:72px;border-radius:2px;background:linear-gradient(135deg,#333,#555);display:flex;align-items:center;justify-content:center;color:#bbb;font-size:9px;font-family:var(--font-head);letter-spacing:1px;}

/* =========================================================
   6. Ana sayfa haber gridleri
   ========================================================= */
.rt-home-grid{
  display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--gap);
  border:2px solid var(--panel-border);padding:16px;border-radius:3px;margin-bottom:18px;
}
.rt-col{min-width:0;}
.rt-col .stack{display:flex;flex-direction:column;gap:22px;}

/* Buyuk one cikan haber */
.rt-feat{margin-bottom:14px;}
.rt-feat .imgs{display:flex;gap:8px;margin-bottom:8px;}
.rt-feat .imgs .ph{flex:1;aspect-ratio:1/1;border-radius:2px;background:linear-gradient(135deg,#3a3a3a,#6a6a6a);}
.rt-feat h3{font-size:18px;color:var(--heading-dark);margin:4px 0 6px;text-transform:none;font-weight:700;}
.rt-feat p{font-size:12.5px;color:#444;margin:0;}

/* Kucuk haber satiri (thumb + metin) */
.rt-mini{display:flex;gap:10px;padding:10px 0;border-top:1px solid var(--grey-line);}
.rt-mini .thumb{flex:0 0 64px;}
.rt-mini .thumb .art{width:64px;height:64px;border-radius:2px;background:linear-gradient(135deg,#2e2e2e,#5a5a5a);display:flex;align-items:center;justify-content:center;color:#aaa;font-size:8px;font-family:var(--font-head);}
.rt-mini h4{font-size:14px;color:var(--link);font-weight:700;text-transform:none;margin:0 0 3px;}
.rt-mini p{font-size:11.5px;color:#555;margin:0;}

/* Reklam (ANZEIGE) kutusu */
.rt-ad{border:1px solid var(--grey-line);background:var(--grey-soft);border-radius:2px;padding:8px;margin:14px 0;text-align:center;}
.rt-ad .tag{display:flex;justify-content:space-between;font-size:10px;color:#999;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;}
.rt-ad .slot{height:120px;background:repeating-linear-gradient(45deg,#e3e3e3 0 12px,#ededed 12px 24px);display:flex;align-items:center;justify-content:center;color:#999;font-family:var(--font-head);font-size:13px;letter-spacing:1px;border-radius:2px;}

/* Kapak grid (RESIMLERI / YENI ALBUM / MIXTAPE / SINGLE) */
.rt-cover-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.rt-cover-grid .art{aspect-ratio:1/1;border-radius:2px;background:linear-gradient(135deg,#2c2c2c,#565656);display:flex;align-items:center;justify-content:center;color:#9a9a9a;font-size:9px;font-family:var(--font-head);letter-spacing:1px;}

/* =========================================================
   7. Underground bolumu
   ========================================================= */
.rt-underground{border:2px solid var(--panel-border);border-radius:3px;background:#fbfbfb;margin-bottom:24px;overflow:hidden;}
.rt-underground .head-bar{background:#fff;padding:14px 16px 0;}
.rt-underground .strip-bar{background:linear-gradient(180deg,var(--snav-from),var(--snav-to));color:#cdeef7;font-family:var(--font-head);font-weight:700;font-size:11px;letter-spacing:3px;padding:4px 16px;white-space:nowrap;overflow:hidden;}
.rt-underground .body{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);padding:16px;}
.rt-underground .right-empty{background:var(--grey-bg);border-radius:2px;min-height:220px;}
.rt-underground h3.sub{font-size:18px;text-transform:uppercase;color:var(--accent);margin-bottom:10px;letter-spacing:.5px;}

/* =========================================================
   8. Albumler arsiv sayfasi
   ========================================================= */
.rt-page{display:flex;gap:var(--gap);margin:14px 0 28px;}
.rt-main{flex:1 1 68%;min-width:0;border:2px solid var(--panel-border);border-radius:3px;padding:16px;}
.rt-sidebar{flex:1 1 30%;min-width:0;display:flex;flex-direction:column;gap:16px;}

.rt-albumler-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.rt-albumler-head .titles h1{font-size:30px;color:var(--accent);text-transform:uppercase;}
.rt-albumler-head .titles .sub{font-size:12px;color:#444;text-transform:uppercase;letter-spacing:.5px;}
.rt-search{display:flex;align-items:stretch;min-width:260px;flex:1 1 280px;max-width:420px;}
.rt-search input[type=search]{flex:1;border:1px solid var(--grey-line);border-right:none;padding:8px 12px;font-size:13px;border-radius:3px 0 0 3px;min-width:0;}
.rt-search button{background:linear-gradient(180deg,var(--accent),var(--accent-dark));color:#fff;border:none;font-family:var(--font-head);font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:0 16px;cursor:pointer;border-radius:0 3px 3px 0;}
.rt-search button:hover{filter:brightness(1.08);}

.rt-azbar{display:flex;flex-wrap:wrap;gap:4px 10px;margin:16px 0;padding-bottom:12px;border-bottom:1px solid var(--grey-line);}
.rt-azbar a{font-family:var(--font-head);font-weight:700;font-size:18px;color:#bdbdbd;}
.rt-azbar a:hover,.rt-azbar a.active{color:var(--accent);text-decoration:none;}

.rt-album-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.rt-album-card .art{aspect-ratio:4/3;border-radius:2px;background:linear-gradient(135deg,#33424a,#7a93a0);box-shadow:0 1px 3px rgba(0,0,0,.18);}
.rt-album-card h3{font-size:16px;margin:8px 0 4px;text-transform:none;}
.rt-album-card h3 a{color:var(--link);}
.rt-album-card p{font-size:12px;color:#555;margin:0;}
.rt-album-card p a{color:var(--link);}

.rt-pagination{display:flex;align-items:center;justify-content:space-between;margin-top:22px;padding-top:14px;border-top:1px solid var(--grey-line);font-size:13px;color:#777;}
.rt-pagination .pages{display:flex;gap:6px;align-items:center;}
.rt-pagination .pages a,.rt-pagination .pages span{padding:3px 9px;border:1px solid var(--grey-line);border-radius:3px;color:var(--link);}
.rt-pagination .pages span.current{background:var(--accent);color:#fff;border-color:var(--accent);}
.rt-pagination .pages .disabled{color:#bbb;border-color:#eee;}

/* Sidebar reklam + widget */
.rt-side-ad{border:1px solid var(--grey-line);border-radius:3px;overflow:hidden;}
.rt-side-ad .slot{height:230px;background:linear-gradient(160deg,#f6d8e2,#f1bcd0);display:flex;align-items:center;justify-content:center;color:#b14a72;font-family:var(--font-head);font-size:16px;letter-spacing:1px;}
.rt-side-ad .cta{display:flex;align-items:center;gap:8px;padding:10px;background:#fff;border-top:1px solid var(--grey-line);font-family:var(--font-head);font-weight:700;color:#333;}

.rt-widget .rt-section-head h2{font-size:22px;}

/* =========================================================
   9. Iskelet (bolum) sayfalari + standart icerik
   ========================================================= */
.rt-content{border:2px solid var(--panel-border);border-radius:3px;padding:20px;margin:14px 0 28px;}
.rt-content .entry h1,.rt-content .entry h2{color:var(--heading-dark);margin:0 0 10px;}
.rt-skeleton-note{background:var(--grey-soft);border:1px dashed var(--grey-line);border-radius:3px;padding:18px;color:#666;margin-top:14px;}
.rt-skeleton-note strong{color:var(--accent);}
.rt-placeholder-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin-top:16px;}
.rt-placeholder-grid .box{aspect-ratio:4/3;border-radius:2px;background:linear-gradient(135deg,#2c2c2c,#565656);display:flex;align-items:center;justify-content:center;color:#9a9a9a;font-family:var(--font-head);font-size:11px;letter-spacing:1px;}

.entry-content{font-size:14px;color:#333;}
.entry-content a{color:var(--link);}

/* =========================================================
   10. Footer
   ========================================================= */
.rt-footer{background:#0d0d0d;color:#9a9a9a;margin-top:10px;border-top:3px solid var(--accent);}
.rt-footer .cols{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:26px 0;}
.rt-footer h4{font-family:var(--font-head);text-transform:uppercase;color:#fff;font-size:15px;letter-spacing:1px;margin-bottom:10px;}
.rt-footer a{color:#9fcfe0;}
.rt-footer .bottom{border-top:1px solid #222;padding:12px 0;font-size:12px;color:#777;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;}

/* =========================================================
   11. Responsive
   ========================================================= */
@media (max-width:900px){
  .rt-home-grid{grid-template-columns:1fr 1fr;}
  .rt-home-grid .rt-col:last-child{grid-column:1 / -1;}
  .rt-secondary-nav a{font-size:20px;}
  .rt-secondary-nav li + li::before{padding:0 9px;}
  .rt-page{flex-direction:column;}
}
@media (max-width:680px){
  .rt-topbar-inner{flex-direction:column;align-items:stretch;min-height:0;}
  .rt-logo{order:-1;padding:12px 0 6px;text-align:center;}
  .rt-logo a{justify-content:center;}
  .rt-nav-toggle{display:inline-block;margin:0 0 8px;align-self:flex-start;}
  .rt-primary-nav{display:none;}
  .rt-primary-nav.open{display:block;width:100%;padding-bottom:10px;}
  .rt-primary-nav ul{flex-direction:column;align-items:stretch;width:100%;}
  .rt-primary-nav li + li::before{display:none;}
  .rt-primary-nav a{padding:9px 0;border-top:1px solid #222;width:100%;}
  .rt-secondary-nav ul{min-height:0;padding:8px 0;}
  .rt-secondary-nav a{font-size:17px;}
  .rt-secondary-nav li + li::before{padding:0 7px;font-size:16px;}
  .rt-hero{flex-direction:column;}
  .rt-home-grid{grid-template-columns:1fr;}
  .rt-underground .body{grid-template-columns:1fr;}
  .rt-underground .right-empty{min-height:120px;}
  .rt-album-grid{grid-template-columns:1fr 1fr;}
  .rt-footer .cols{grid-template-columns:1fr 1fr;}
  .rt-hero-feature .ph .label{font-size:32px;}
}
@media (max-width:440px){
  .rt-album-grid{grid-template-columns:1fr;}
  .rt-cover-grid{grid-template-columns:repeat(3,1fr);}
  .rt-footer .cols{grid-template-columns:1fr;}
  .rt-logo .word{font-size:30px;}
}