/* =========================================================
   Bilardo Turnuva Portalı - Ana Tema (Diyarbakır / TBF İl Temsilciliği)
   Renk paleti logodan alınmıştır:
     • Dicle Turkuazı  #00838f / koyu #004d5c
     • Karpuz Kırmızı  #c62828 / #a31818
     • Bazalt Siyahı   #1a1a1a / #2c2c2c
     • Altın Aksent    #f9a825 / #e69100
     • Kağıt           #fafafa / sur bej #e9d9b6
   ========================================================= */

:root{
  --primary:#00838f;
  --primary-dark:#004d5c;
  --primary-light:#4fb3bf;
  --accent:#c62828;
  --accent-dark:#a31818;
  --gold:#f9a825;
  --gold-dark:#e69100;
  --basalt:#1a1a1a;
  --basalt-2:#2c2c2c;
  --sand:#e9d9b6;
  --paper:#fafafa;
  --gray-50:#f6f7f8;
  --gray-100:#eef0f2;
  --gray-200:#dfe3e7;
  --gray-300:#c2c9d0;
  --gray-500:#6b7580;
  --gray-700:#3c434a;
  --success:#2e7d32;
  --warning:#ed6c02;
  --danger:#c62828;
  --info:#0277bd;
  --radius:14px;
  --radius-sm:8px;
  --shadow-sm:0 2px 6px rgba(0,0,0,.06);
  --shadow:0 8px 24px rgba(0,0,0,.08);
  --shadow-lg:0 18px 48px rgba(0,131,143,.18);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI","Inter","Roboto",Arial,sans-serif;
  --header-h:72px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--font);
  color:var(--basalt-2);
  background:var(--paper);
  line-height:1.55;
  min-height:100vh;
  /* Bazalt taşı deseni - subtle */
  background-image:
    radial-gradient(circle at 10% 0%, rgba(0,131,143,.05), transparent 40%),
    radial-gradient(circle at 90% 0%, rgba(198,40,40,.04), transparent 35%);
}
a{color:var(--primary);text-decoration:none;transition:color .15s}
a:hover{color:var(--primary-dark)}

.container{max-width:1280px;margin:0 auto;padding:0 18px}

/* ---------- HEADER (Surlar teması) ---------- */
.site-header{
  background:linear-gradient(135deg,#fff 0%,#f7fafb 100%);
  border-bottom:3px solid var(--primary);
  box-shadow:var(--shadow-sm);
  position:sticky;top:0;z-index:100;
}
.city-strip{
  background:linear-gradient(90deg,var(--basalt) 0%,var(--basalt-2) 50%,var(--basalt) 100%);
  color:#f0eadd;
  font-size:12px;
}
.city-strip .container{
  display:flex;flex-wrap:wrap;gap:14px;
  padding:8px 18px;align-items:center;
}
.city-strip .strip-item{opacity:.85}
.city-strip .strip-user{margin-left:auto;display:flex;gap:10px}
.city-strip .strip-user a{color:var(--gold);}
.city-strip .strip-user a:hover{color:#fff}

.header-inner{
  display:flex;align-items:center;gap:18px;
  padding:14px 18px;position:relative;
}
.brand{display:flex;align-items:center;gap:14px;color:var(--basalt)}
.brand img{
  height:64px;width:64px;border-radius:50%;
  border:3px solid var(--primary);
  box-shadow:0 4px 12px rgba(0,131,143,.25);
  object-fit:cover;background:#fff;
}
.brand strong{
  display:block;font-size:20px;font-weight:800;letter-spacing:.2px;
  background:linear-gradient(90deg,var(--primary-dark),var(--primary));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.brand small{color:var(--gray-500);font-size:12px;letter-spacing:.5px;text-transform:uppercase}
.wall-decor{
  position:absolute;bottom:0;left:50%;transform:translateX(-50%);
  width:340px;height:30px;color:var(--basalt);opacity:.08;pointer-events:none;
}
.wall-svg{width:100%;height:100%}
.tournament-select{
  margin-left:auto;display:flex;align-items:center;gap:10px;
  background:var(--gray-50);padding:8px 14px;border-radius:var(--radius-sm);
  border:1px solid var(--gray-200);
}
.tournament-select label{font-size:12px;color:var(--gray-500);font-weight:600}
.tournament-select select{
  border:0;background:transparent;font-weight:700;color:var(--primary-dark);
  font-size:14px;padding:4px 8px;cursor:pointer;
}

/* ---------- NAV MENU ---------- */
.main-nav{
  background:linear-gradient(135deg,var(--primary-dark) 0%,var(--primary) 100%);
  position:relative;overflow:hidden;
}
.main-nav::before{
  content:"";position:absolute;inset:0;
  background-image:
    radial-gradient(circle at 15% 50%, rgba(255,255,255,.06) 0, transparent 25%),
    radial-gradient(circle at 85% 50%, rgba(249,168,37,.12) 0, transparent 30%);
  pointer-events:none;
}
.main-nav ul{
  list-style:none;margin:0;padding:0;
  display:flex;flex-wrap:wrap;
  position:relative;z-index:1;
}
.main-nav a{
  display:block;padding:14px 18px;
  color:rgba(255,255,255,.88);font-weight:600;font-size:14px;
  border-bottom:3px solid transparent;transition:all .2s;
}
.main-nav a:hover{background:rgba(255,255,255,.08);color:#fff;}
.main-nav a.active{
  color:#fff;background:rgba(0,0,0,.22);
  border-bottom-color:var(--gold);
}

/* ---------- MAIN ---------- */
.main-content{padding:26px 18px;min-height:calc(100vh - 400px)}

/* ---------- HERO (Turnuva başlığı) ---------- */
.hero{
  background:
    linear-gradient(135deg,rgba(0,77,92,.94),rgba(0,131,143,.88)),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 200'><path d='M0 200 L0 120 L30 120 L30 90 L55 90 L55 115 L80 115 L80 75 L115 75 L115 50 L140 50 L140 95 L170 95 L170 70 L200 70 L200 30 L235 30 L235 90 L270 90 L270 70 L300 70 L300 95 L335 95 L335 60 L370 60 L370 90 L400 90 L400 70 L430 70 L430 100 L460 100 L460 65 L490 65 L490 95 L520 95 L520 80 L555 80 L555 50 L590 50 L590 90 L625 90 L625 70 L660 70 L660 110 L695 110 L695 80 L730 80 L730 95 L760 95 L760 115 L800 115 L800 200 Z' fill='%23000' opacity='.2'/></svg>") bottom/cover no-repeat;
  color:#fff;border-radius:var(--radius);
  padding:42px 32px;margin-bottom:24px;
  box-shadow:var(--shadow-lg);position:relative;overflow:hidden;
}
.hero::before{
  content:"";position:absolute;top:-40px;right:-30px;
  width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle,var(--gold) 0,transparent 70%);
  opacity:.28;
}
.hero::after{
  content:"";position:absolute;bottom:-60px;left:-40px;
  width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle,var(--accent) 0,transparent 70%);
  opacity:.15;
}
.hero-content{position:relative;z-index:1}
.hero h1{margin:6px 0 8px;font-size:36px;font-weight:800;letter-spacing:-.4px}
.hero p{margin:0 0 14px;opacity:.9;font-size:16px}
.hero-meta{display:flex;flex-wrap:wrap;gap:18px;font-size:14px;opacity:.95}
.hero .pill{
  display:inline-block;padding:4px 12px;border-radius:20px;
  background:var(--gold);color:var(--basalt);font-weight:700;font-size:12px;
  letter-spacing:1px;text-transform:uppercase;
}

/* ---------- STAT GRID ---------- */
.stat-grid{
  display:grid;gap:16px;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  margin-bottom:24px;
}
.stat-card{
  background:#fff;border-radius:var(--radius);
  padding:22px 20px;box-shadow:var(--shadow-sm);
  border-left:4px solid var(--primary);display:flex;flex-direction:column;gap:4px;
  transition:transform .2s,box-shadow .2s;
}
.stat-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.stat-card:nth-child(2){border-left-color:var(--accent)}
.stat-card:nth-child(3){border-left-color:var(--gold)}
.stat-card:nth-child(4){border-left-color:var(--basalt)}
.stat-card .num{font-size:36px;font-weight:800;color:var(--primary-dark);line-height:1}
.stat-card .lbl{font-size:13px;color:var(--gray-500);text-transform:uppercase;letter-spacing:.5px;font-weight:600}

/* ---------- CARD ---------- */
.card{
  background:#fff;border-radius:var(--radius);
  padding:22px 22px;box-shadow:var(--shadow-sm);margin-bottom:20px;
  border:1px solid var(--gray-100);
}
.card h2{
  margin:0 0 16px;font-size:20px;color:var(--primary-dark);
  padding-bottom:10px;border-bottom:2px solid var(--gray-100);
  display:flex;align-items:center;gap:8px;
}
.card h2::before{
  content:"";width:4px;height:20px;background:var(--primary);border-radius:2px;
}
.card h3{color:var(--primary-dark);margin:0 0 10px}

.grid-2{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(420px,1fr))}
.group-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(360px,1fr))}

/* ---------- PAGE HEAD & FILTER ---------- */
.page-head{
  background:#fff;padding:18px 22px;border-radius:var(--radius);
  margin-bottom:16px;box-shadow:var(--shadow-sm);
  border-left:6px solid var(--accent);
}
.page-head h1{margin:0 0 4px;color:var(--primary-dark);font-size:24px}
.page-head p{margin:0;color:var(--gray-500)}

.filter-bar{
  display:flex;flex-wrap:wrap;gap:10px;align-items:center;
  background:#fff;padding:14px 18px;border-radius:var(--radius);
  margin-bottom:16px;box-shadow:var(--shadow-sm);
}
.filter-bar label{font-weight:600;font-size:13px;color:var(--gray-700)}
.filter-bar select,.filter-bar input[type=text]{
  padding:8px 12px;border:1px solid var(--gray-200);border-radius:var(--radius-sm);
  font-size:14px;background:#fff;
}
.help-text{color:var(--gray-500);font-size:13px;margin:0 0 14px}
.muted{color:var(--gray-500)}

/* ---------- TABLE ---------- */
.data-table{
  width:100%;border-collapse:collapse;background:#fff;
  font-size:14px;
}
.data-table th{
  background:linear-gradient(180deg,var(--primary-dark),var(--primary));
  color:#fff;padding:12px 10px;text-align:left;font-weight:600;font-size:13px;
  text-transform:uppercase;letter-spacing:.4px;
}
.data-table td{padding:10px;border-bottom:1px solid var(--gray-100);vertical-align:middle}
.data-table tbody tr:hover{background:rgba(0,131,143,.04)}
.data-table.compact td,.data-table.compact th{padding:7px 8px;font-size:13px}
.data-table.striped tbody tr:nth-child(even){background:var(--gray-50)}
.data-table.striped tbody tr:hover{background:rgba(0,131,143,.06)}
.data-table small{display:block;color:var(--gray-500);font-size:11px;margin-top:2px}
.data-table .winner{font-weight:700;color:var(--success)}
.data-table .score{text-align:center;font-size:15px;color:var(--primary-dark)}
.data-table tr.qualified{background:rgba(249,168,37,.12)!important}
.data-table tr.qualified td:first-child::before{content:"★ ";color:var(--gold)}
.data-table .rank-1{color:var(--gold-dark);font-weight:800;font-size:16px}
.data-table .rank-2{color:#808080;font-weight:700}
.data-table .rank-3{color:#cd7f32;font-weight:700}

/* ---------- BADGES ---------- */
.badge{
  display:inline-block;padding:3px 10px;border-radius:14px;
  font-size:12px;font-weight:700;background:var(--gray-200);color:var(--basalt);
  letter-spacing:.2px;
}
.badge-primary{background:rgba(0,131,143,.14);color:var(--primary-dark)}
.badge-success{background:rgba(46,125,50,.14);color:var(--success)}
.badge-danger{background:rgba(198,40,40,.14);color:var(--danger)}
.badge-warning{background:rgba(237,108,2,.16);color:var(--warning)}
.badge-info{background:rgba(2,119,189,.12);color:var(--info)}
.badge-secondary{background:var(--gray-100);color:var(--gray-700)}
.badge-dark{background:var(--basalt-2);color:#fff}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-block;padding:9px 16px;border-radius:var(--radius-sm);
  background:var(--gray-100);color:var(--basalt);font-weight:600;font-size:14px;
  border:1px solid var(--gray-200);cursor:pointer;transition:all .15s;
  text-decoration:none;line-height:1.3;
}
.btn:hover{background:var(--gray-200);transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;border-color:transparent;box-shadow:0 4px 12px rgba(0,131,143,.3)}
.btn-primary:hover{color:#fff;box-shadow:0 6px 18px rgba(0,131,143,.4)}
.btn-danger{background:linear-gradient(135deg,var(--accent),var(--accent-dark));color:#fff;border-color:transparent}
.btn-danger:hover{color:#fff}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold-dark));color:var(--basalt);border-color:transparent}
.btn-sm{padding:5px 10px;font-size:12px}
.btn-block{display:block;width:100%;text-align:center}

/* ---------- LIVE SCORE ---------- */
.live-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.live-card{
  background:linear-gradient(135deg,var(--basalt),var(--basalt-2));
  color:#fff;border-radius:var(--radius);padding:20px;
  border:2px solid var(--accent);position:relative;overflow:hidden;
  box-shadow:var(--shadow);
}
.live-dot{display:flex;align-items:center;gap:8px;font-weight:800;color:var(--accent);font-size:13px;letter-spacing:2px}
.live-dot span{width:10px;height:10px;border-radius:50%;background:var(--accent);animation:pulse 1.2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.live-table{font-size:13px;opacity:.7;margin:6px 0 14px}
.live-players{margin-bottom:12px}
.live-players .lp{display:flex;justify-content:space-between;padding:10px 14px;background:rgba(255,255,255,.06);border-radius:8px;margin-bottom:6px}
.live-players .name{font-weight:600}
.live-players .score{font-size:26px;font-weight:800;color:var(--gold)}
.live-meta{font-size:12px;opacity:.7}

/* ---------- GROUP CARD ---------- */
.group-card h3 a{color:var(--primary-dark)}
.group-card h3{
  margin:0 0 12px;padding-bottom:10px;
  border-bottom:2px solid var(--gold);
}

/* ---------- ALERTS ---------- */
.alert{padding:12px 18px;border-radius:var(--radius-sm);margin-bottom:16px;font-weight:500;border-left:4px solid}
.alert-success{background:#e9f4ea;color:#1b5e20;border-color:var(--success)}
.alert-error{background:#fdecea;color:#7a1515;border-color:var(--accent)}
.alert-info{background:#e3f2fd;color:#01579b;border-color:var(--info)}
.alert-warning{background:#fff4e5;color:#7a4500;border-color:var(--warning)}

/* ---------- FORMS ---------- */
.form-grid{display:grid;gap:14px;grid-template-columns:repeat(2,1fr)}
.form-grid .fg-col-2{grid-column:span 2}
.form-grid label{display:block;font-weight:600;font-size:13px;color:var(--gray-700);margin-bottom:5px}
.form-grid input,.form-grid select,.form-grid textarea{
  width:100%;padding:9px 12px;border:1px solid var(--gray-200);border-radius:var(--radius-sm);
  font-size:14px;font-family:inherit;background:#fff;
}
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{
  outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(0,131,143,.12);
}
.form-actions{display:flex;gap:10px;margin-top:8px}

/* ---------- PAGINATION ---------- */
.pagination{display:flex;gap:4px;justify-content:center;margin:20px 0}
.pagination a{padding:6px 12px;border:1px solid var(--gray-200);border-radius:var(--radius-sm);color:var(--primary-dark);background:#fff}
.pagination a.active{background:var(--primary);color:#fff;border-color:var(--primary)}

/* ---------- FOOTER ---------- */
.site-footer{
  background:
    linear-gradient(180deg,var(--basalt) 0%,#000 100%);
  color:#d6dbe0;margin-top:40px;padding:40px 0 18px;position:relative;
}
.site-footer::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--primary),var(--gold),var(--accent),var(--primary));
}
.footer-cols{display:grid;gap:30px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.footer-cols h4{color:var(--gold);margin:0 0 10px;font-size:15px;text-transform:uppercase;letter-spacing:1px}
.footer-cols ul{list-style:none;margin:0;padding:0}
.footer-cols ul li{margin:5px 0}
.footer-cols a{color:#d6dbe0}.footer-cols a:hover{color:var(--gold)}
.footer-bottom{
  text-align:center;padding-top:18px;margin-top:24px;
  border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:var(--gray-300);
}

/* ---------- AUTH (üye giriş / kayıt) ---------- */
.auth-container{
  min-height:60vh;display:flex;align-items:center;justify-content:center;padding:30px 0;
}
.auth-box{
  background:#fff;padding:32px;border-radius:var(--radius);
  box-shadow:var(--shadow-lg);max-width:440px;width:100%;
  border-top:5px solid var(--primary);
}
.auth-box.wide{max-width:700px}
.auth-head{text-align:center;margin-bottom:24px}
.auth-head h1{margin:0 0 6px;color:var(--primary-dark)}
.auth-head p{margin:0;color:var(--gray-500)}
.auth-box form label{display:block;margin:10px 0 5px;font-weight:600;font-size:13px;color:var(--gray-700)}
.auth-box form input{width:100%;padding:10px 12px;border:1px solid var(--gray-200);border-radius:var(--radius-sm);font-size:14px}
.auth-box form input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(0,131,143,.12)}
.auth-box .btn-primary{margin-top:16px}
.auth-foot{text-align:center;margin-top:16px;font-size:13px}
.auth-info{margin-top:18px;padding-top:14px;border-top:1px solid var(--gray-100);text-align:center}

/* ---------- USER PANEL (üye paneli) ---------- */
.user-panel{display:grid;gap:20px;grid-template-columns:280px 1fr}
.user-side{display:flex;flex-direction:column;gap:14px}
.user-card{
  background:linear-gradient(135deg,var(--primary-dark),var(--primary));
  color:#fff;padding:24px;border-radius:var(--radius);text-align:center;
  box-shadow:var(--shadow);
}
.user-card .avatar{
  width:72px;height:72px;border-radius:50%;margin:0 auto 12px;
  background:var(--gold);color:var(--basalt);font-size:30px;font-weight:800;
  display:flex;align-items:center;justify-content:center;
  border:3px solid #fff;
}
.user-card h3{color:#fff;margin:0 0 6px}
.user-card p{opacity:.8;margin:0 0 10px}
.user-menu{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
.user-menu a{
  display:block;padding:12px 18px;color:var(--gray-700);font-weight:600;
  border-left:3px solid transparent;transition:all .15s;
}
.user-menu a:hover{background:var(--gray-50)}
.user-menu a.active{background:var(--gray-50);color:var(--primary-dark);border-left-color:var(--primary)}
.user-menu a.danger{color:var(--accent);border-top:1px solid var(--gray-100)}
.user-main .card{min-height:300px}

/* ---------- NEWS ---------- */
.news-list{display:grid;gap:16px}
.news-item h2{color:var(--primary-dark)}
.news-item .content{color:var(--gray-700)}

/* ---------- PAGE ACTIONS ---------- */
.page-actions{display:flex;gap:10px;align-items:center;margin-bottom:14px;flex-wrap:wrap}
.inline-search{display:flex;gap:6px;margin-left:auto}
.inline-search input,.inline-search select{padding:7px 10px;border:1px solid var(--gray-200);border-radius:var(--radius-sm)}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 960px){
  .header-inner{flex-wrap:wrap}
  .tournament-select{width:100%}
  .main-nav ul{flex-direction:column}
  .main-nav a{padding:10px 14px}
  .hero h1{font-size:26px}
  .user-panel{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .form-grid .fg-col-2{grid-column:span 1}
  .grid-2{grid-template-columns:1fr}
  .wall-decor{display:none}
  .city-strip{font-size:11px}
  .city-strip .strip-user{width:100%;margin:0}
}