/* ✅ Pashto Digital Association - Light Professional Theme */

/* 1) Fonts (Best for Pashto/Dari) */
@import url("https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800&family=Inter:wght@400;500;600;700;800&display=swap");

:root{
  --bg: #f6f8fc;               /* main background */
  --surface: #ffffff;          /* cards */
  --surface-2:#eef6ff;         /* soft section bg */
  --text: #0b1220;             /* main text */
  --muted:#475569;             /* muted text */
  --border: rgba(15, 23, 42, .12);
  --shadow: 0 18px 45px rgba(15, 23, 42, .08);

  /* Brand accents */
  --accent: #0ea5e9;           /* sky */
  --accent-2:#22c55e;          /* green */
  --accent-3:#f59e0b;          /* warm (optional) */

  --nav: rgba(255,255,255,.86);
}

html, body{
  height: 100%;
}

body{
  font-family: "Vazirmatn","Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  background:
    radial-gradient(900px 420px at 12% 0%, rgba(14,165,233,.14), transparent 60%),
    radial-gradient(900px 420px at 88% 10%, rgba(34,197,94,.10), transparent 55%),
    var(--bg);
  color: var(--text);
  line-height: 1.85; /* ✅ Pashto readable */
}

/* Pashto text readability helpers */
h1,h2,h3,h4,h5,h6{
  font-weight: 800;
  letter-spacing: -0.2px;
  line-height: 1.35;
}

p, li{
  color: rgba(11,18,32,.92);
}

a{ text-decoration:none; }

/* Navbar */
.navbar{
  background: var(--nav);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 8px 20px rgba(15,23,42,.06);
}

.navbar .nav-link{
  color: var(--muted) !important;
  font-weight: 700;
  padding: .65rem .85rem;
  border-radius: .75rem;
}

.navbar .nav-link:hover,
.navbar .nav-link.active{
  color: var(--accent) !important;
  background: rgba(14,165,233,.10);
}

.brand-logo{
  width: 40px;
  height: 40px;
  border-radius: 999px;
  object-fit: cover;
  box-shadow: 0 8px 20px rgba(2,6,23,.12);
}

/* Hero */
#home{
  position: relative;
  min-height: 70vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  border-bottom: 1px solid var(--border);
}

#home::before{
  content:"";
  position:absolute;
  inset:0;
  background: url("channels4_banner.jpg") center/cover no-repeat;
  opacity: .10; /* ✅ less dark */
  filter: saturate(1.08) contrast(1.02);
}

#home::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top left, rgba(14,165,233,.18), transparent 55%),
    radial-gradient(circle at bottom right, rgba(34,197,94,.14), transparent 55%),
    linear-gradient(to bottom, rgba(255,255,255,.65), rgba(255,255,255,.92));
}

#home .hero-content{
  position: relative;
  z-index: 5;
}

.hero-badge{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.4rem 1rem;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  border: 1px solid var(--border);
  font-size: .9rem;
  color: var(--muted);
  box-shadow: 0 12px 26px rgba(15,23,42,.08);
}

.hero-badge span{
  color: var(--accent);
  font-weight: 800;
}

/* Buttons */
.btn-primary{
  background: linear-gradient(135deg, var(--accent-2), var(--accent));
  border: none;
  border-radius: .9rem;
  padding: .7rem 1.1rem;
  font-weight: 800;
  box-shadow: 0 14px 26px rgba(14,165,233,.18);
}

.btn-primary:hover{
  background: linear-gradient(135deg, #16a34a, #0284c7);
  transform: translateY(-1px);
  transition: .2s ease;
}

/* Sections */
section.section{
  padding: 4rem 0 3rem;
}

.section-title{
  font-weight: 900;
  margin-bottom: 2rem;
  color: var(--text);
}

/* Cards */
.card-custom{
  background: var(--surface);
  border-radius: 1.1rem;
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}

.card-custom-soft{
  background: linear-gradient(180deg, rgba(238,246,255,.88), #ffffff);
  border-radius: 1.1rem;
  border: 1px solid var(--border);
  box-shadow: 0 14px 40px rgba(15,23,42,.06);
}

/* Tags */
.tag-pill{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.25rem .75rem;
  border-radius: 999px;
  font-size: .8rem;
  background: rgba(34,197,94,.10);
  border: 1px solid rgba(34,197,94,.20);
  color: #166534;
  font-weight: 800;
}

/* Avatar */
.avatar-sm{
  width: 56px;
  height: 56px;
  border-radius: 999px;
  object-fit: cover;
  border: 2px solid rgba(14,165,233,.30);
}

/* Forms */
.form-control, .form-select{
  background-color: #ffffff;
  border-radius: .85rem;
  border: 1px solid rgba(15, 23, 42, .18);
  color: var(--text);
  padding: .75rem .9rem;
}

.form-control::placeholder{
  color: rgba(71,85,105,.75);
}

.form-control:focus, .form-select:focus{
  background-color: #ffffff;
  border-color: rgba(14,165,233,.75);
  box-shadow: 0 0 0 .18rem rgba(14,165,233,.18);
  color: var(--text);
}

/* Accent helper */
.text-accent{ color: var(--accent); }

/* Footer */
footer{
  border-top: 1px solid var(--border);
  padding: 1.35rem 0;
  font-size: .95rem;
  color: rgba(71,85,105,.92);
  background: rgba(255,255,255,.70);
}

/* Mobile */
@media (max-width: 576px){
  #home{ min-height: 75vh; }
  .navbar .nav-link{ padding: .55rem .7rem; }
}