/* =======================================================
 * KYNC 2026
 * CasaOS Inspired Theme
 * ======================================================= */

:root {

  --radius: 24px;

  --glass-light: rgba(255,255,255,.45);
  --glass-dark: rgba(15,23,42,.35);

  --border-light: rgba(255,255,255,.55);
  --border-dark: rgba(255,255,255,.12);

  --shadow-light:
  0 8px 30px rgba(0,0,0,.08);

  --shadow-dark:
  0 12px 40px rgba(0,0,0,.35);
}

/* =======================================================
 * KOYU TEMA
 * ======================================================= */

[data-md-color-scheme="slate"] body {

  background:

  radial-gradient(
    circle at 0% 0%,
    rgba(56,189,248,.30),
                  transparent 35%
  ),

  radial-gradient(
    circle at 100% 100%,
    rgba(168,85,247,.25),
                  transparent 35%
  ),

  radial-gradient(
    circle at 50% 20%,
    rgba(14,165,233,.15),
                  transparent 25%
  ),

  #0f172a;

  background-attachment: fixed;
}

/* =======================================================
 * AÇIK TEMA
 * ======================================================= */

[data-md-color-scheme="default"] body {

  background:

  radial-gradient(
    circle at 0% 0%,
    rgba(59,130,246,.20),
                  transparent 40%
  ),

  radial-gradient(
    circle at 100% 100%,
    rgba(168,85,247,.18),
                  transparent 40%
  ),

  radial-gradient(
    circle at 50% 20%,
    rgba(6,182,212,.10),
                  transparent 30%
  ),

  #f8fafc;

  background-attachment: fixed;
}

/* =======================================================
 * HEADER
 * ======================================================= */

[data-md-color-scheme="default"] .md-header {

  background: rgba(219,228,239,.88);

  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);

  border-bottom:
  1px solid rgba(148,163,184,.25);
}

[data-md-color-scheme="slate"] .md-header {

  background: rgba(15,23,42,.82);

  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* =======================================================
 * TAB BAR
 * ======================================================= */

[data-md-color-scheme="default"] .md-tabs {

  background: rgba(203,213,225,.70);

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

[data-md-color-scheme="slate"] .md-tabs {

  background: rgba(15,23,42,.60);

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Açık tema yazıları */

[data-md-color-scheme="default"] .md-tabs__link,
[data-md-color-scheme="default"] .md-header__title,
[data-md-color-scheme="default"] .md-logo,
[data-md-color-scheme="default"] .md-search__form,
[data-md-color-scheme="default"] .md-header__button {

  color: #0f172a !important;
}

/* =======================================================
 * SOL MENÜ
 * ======================================================= */

.md-sidebar {
  background: transparent;
}

.md-nav__title {
  background: transparent !important;
}

.md-nav--primary {
  border: none !important;
}

.md-sidebar--primary {
  border: none !important;
}

/* =======================================================
 * ORTA ÇİZGİLERİ KALDIR
 * ======================================================= */

.md-content__inner,
.md-content article {

  border: none !important;

  box-shadow: none !important;

  background: transparent;
}

hr,
.md-typeset hr {

  display: none !important;
}

/* =======================================================
 * ANA SAYFA KARTLARI
 * ======================================================= */

.dashboard {

  display:grid;

  grid-template-columns:
  repeat(auto-fill,minmax(140px,1fr));

  gap:18px;

  margin-top:24px;
}

.card {

  display:flex;

  flex-direction:column;

  align-items:center;

  justify-content:center;

  min-height:150px;

  padding:18px;

  text-align:center;

  border-radius:20px;

  text-decoration:none !important;

  color:inherit !important;

  transition:.25s;

  backdrop-filter: blur(20px);

  -webkit-backdrop-filter: blur(20px);
}

[data-md-color-scheme="default"] .card {

  background: var(--glass-light);

  border: 1px solid var(--border-light);

  box-shadow: var(--shadow-light);
}

[data-md-color-scheme="slate"] .card {

  background: var(--glass-dark);

  border: 1px solid var(--border-dark);

  box-shadow: var(--shadow-dark);
}

.card:hover {

  transform:translateY(-4px);
}

.card-icon {

  width:90px;

  height:90px;

  max-width:90px;

  max-height:90px;

  object-fit:contain;

  display:block;

  margin:0 auto 12px auto;

  transition:.25s;
}

.card:hover .card-icon {

  transform:scale(1.08);
}

.card span {

  font-size:.95rem;

  font-weight:600;

  text-align:center;
}

/* =======================================================
 * SON GÜNCELLENENLER
 * ======================================================= */

.updates {

  margin-top:40px;

  padding:24px;

  border-radius:var(--radius);

  backdrop-filter: blur(20px);

  -webkit-backdrop-filter: blur(20px);
}

[data-md-color-scheme="default"] .updates {

  background:var(--glass-light);

  border:1px solid var(--border-light);

  box-shadow:var(--shadow-light);
}

[data-md-color-scheme="slate"] .updates {

  background:var(--glass-dark);

  border:1px solid var(--border-dark);

  box-shadow:var(--shadow-dark);
}

/* =======================================================
 * LOGO
 * ======================================================= */

.md-logo img {

  transition:.4s ease;
}

.md-logo:hover img {

  transform:
  rotate(8deg)
  scale(1.08);
}

/* =======================================================
 * PANEL SAYFASI
 * ======================================================= */

.panel-grid {

  display:grid;

  grid-template-columns:
  repeat(auto-fill,minmax(130px,1fr));

  gap:18px;

  margin-top:24px;
}

.panel-card {

  display:flex;

  flex-direction:column;

  align-items:center;

  justify-content:center;

  min-height:130px;

  padding:14px;

  border-radius:20px;

  text-decoration:none !important;

  color:inherit !important;

  transition:.25s;
}

[data-md-color-scheme="default"] .panel-card {

  background:rgba(255,255,255,.70);

  border:1px solid rgba(255,255,255,.40);

  box-shadow:0 8px 20px rgba(0,0,0,.08);
}

[data-md-color-scheme="slate"] .panel-card {

  background:rgba(15,23,42,.55);

  border:1px solid rgba(255,255,255,.08);

  box-shadow:0 8px 20px rgba(0,0,0,.25);
}

.panel-card:hover {

  transform:translateY(-4px);
}

/* Emoji ikonlar */

.panel-emoji {

  font-size:42px;

  line-height:1;

  margin-bottom:10px;
}

/* SVG veya IMG ikonlar */

.panel-card img,
.panel-card svg {

  width:90px !important;

  height:90px !important;

  max-width:90px !important;

  max-height:90px !important;

  object-fit:contain;

  margin-bottom:10px;
}

.panel-card span {

  font-size:.90rem;

  font-weight:600;

  text-align:center;
}

/* =======================================================
 * MOBİL
 * ======================================================= */

@media (max-width:768px) {

  .panel-grid {

    grid-template-columns:
    repeat(2,1fr);
  }

  .panel-card {

    min-height:120px;
  }

  .panel-emoji {

    font-size:38px;
  }

  .panel-card img,
  .panel-card svg {

    width:68px !important;

    height:68px !important;
  }
}