:root{
  /* Takvim hücreleri: daha net ama göz yormayan */
 --cell-border: rgba(15,23,42,.08);

  --ink:#0f172a;
  --muted:#64748b;
  --line:rgba(15,23,42,.10);

  --radius:18px;
  --shadow: 0 12px 28px rgba(2,6,23,.08);
  --shadow2: 0 8px 18px rgba(2,6,23,.06);
}

/* Soft card */
.card-soft{
  border:1px solid var(--line);
  box-shadow: var(--shadow2);
  border-radius: var(--radius);
  background:#fff;
}

/* Üst küçük kart */
.stats-card{
  border-radius: var(--radius);
  border:1px solid var(--line);
  box-shadow: var(--shadow2);
  background:#fff;
}

/* Takvim */
.calendar-wrap{ display:grid; gap:18px; }

.month-card{
  border-radius: calc(var(--radius) + 2px);
  overflow:hidden;
  border:1px solid var(--line);
  background:#fff;
  box-shadow: var(--shadow2);
}
.month-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 14px;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
  border-bottom:1px solid var(--line);
}
.month-title{ font-weight:800; letter-spacing:.2px; color:var(--ink); }

.month-grid{ display:grid; grid-template-columns: repeat(7, 1fr); }

.dow{
  font-size:.78rem;
  color:var(--muted);
  text-align:center;
  padding:8px 0;
  background:#fff;
  border-bottom:1px solid var(--cell-border);
}

/* Gün hücresi */
.day-cell{
  position:relative;
  min-height:56px;             /* biraz büyüt (daha premium) */
  padding:10px 10px;
  border-right:1px solid var(--cell-border);
  border-bottom:1px solid var(--cell-border);
  cursor:pointer;
  user-select:none;
  transition: transform .12s ease, filter .12s ease, box-shadow .12s ease;
}
.day-cell:nth-child(7n){ border-right:0; }

.day-cell:hover{
  transform: translateY(-1px);
  filter: saturate(1.04) contrast(1.02);
  box-shadow: 0 10px 16px rgba(2,6,23,.08);
  z-index: 2;
}
.day-cell:active{ transform: translateY(0px) scale(.995); }

.day-num{ font-weight:900; font-size:.95rem; color:var(--ink); }
.day-meta{ font-size:.72rem; color:#334155; margin-top:2px; opacity:.95; }

.cell-green{ background: linear-gradient(180deg, rgba(255,255,255,.38), transparent 55%), var(--cell-green); }
.cell-yellow{ background: linear-gradient(180deg, rgba(255,255,255,.38), transparent 55%), var(--cell-yellow); }
.cell-red{ background: linear-gradient(180deg, rgba(255,255,255,.38), transparent 55%), var(--cell-red); }
.cell-empty{ background:#fff; cursor:default; box-shadow:none !important; transform:none !important; }

.dot{
  position:absolute;
  right:10px;
  top:12px;
  width:8px;
  height:8px;
  border-radius:50%;
  background: rgba(15,23,42,.45);
  box-shadow: 0 0 0 3px rgba(255,255,255,.35);
}

/* Legend */
.legend{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.legend span{ display:inline-flex; gap:8px; align-items:center; font-size:.85rem; color:#334155; }
.legend i{
  width:14px; height:14px;
  border-radius:6px;
  display:inline-block;
  border:1px solid var(--line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}

/* Table + badge */
.table-sm td, .table-sm th{ padding:.45rem .55rem; }
.badge-soft{
  background: rgba(15, 23, 42, .055);
  color: var(--ink);
  border:1px solid var(--line);
  border-radius: 999px;
}

/* ===============================
   MODERN STAT CARDS (RENKLİ) - PREMIUM
=============================== */

.stat-card{
  position:relative;
  border-radius: calc(var(--radius) + 2px);
  padding:16px 16px 14px 16px;
  color:var(--ink);
  border:1px solid rgba(15,23,42,.10);
  box-shadow: var(--shadow);
  overflow:hidden;
  min-height:98px;
  transform: translateZ(0);
}

/* “Glass shine” + renk glow */
.stat-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    radial-gradient(900px 220px at 18% 18%, rgba(255,255,255,.70), transparent 55%),
    radial-gradient(500px 260px at 85% 10%, rgba(255,255,255,.30), transparent 55%);
  pointer-events:none;
}
.stat-card::after{
  content:"";
  position:absolute;
  right:-48px;
  top:-48px;
  width:170px;
  height:170px;
  border-radius:50%;
  background: rgba(255,255,255,.22);
  pointer-events:none;
}

.stat-row{
  display:flex;
  align-items:center;
  gap:12px;
  position:relative;
  z-index:1;
}

.stat-ico{
  width:48px; height:48px;
  border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.28);
  border: 1px solid rgba(255,255,255,.28);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    0 10px 16px rgba(2,6,23,.10);
  flex: 0 0 auto;
  backdrop-filter: blur(6px);
}
.stat-ico svg{ width:20px; height:20px; opacity:.98; }

.stat-meta{ min-width:0; }
.stat-label{
  font-size:.82rem;
  color: rgba(15,23,42,.78);
  margin-bottom:2px;
  font-weight:700;
}
.stat-value{
  font-size:1.55rem;           /* daha net */
  font-weight:900;
  letter-spacing:.2px;
  line-height:1.1;
  color:var(--ink);
}
.stat-sub{
  margin-top:6px;
  font-size:.82rem;
  color: rgba(15,23,42,.72);
}
.stat-sub b{ color:var(--ink); font-weight:900; }

/* Kart hover: premium “lift” */
.stat-card:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(2,6,23,.12);
}

/* Renk temaları - daha net / modern */
.stat--blue{
  background:
    radial-gradient(900px 260px at 10% 10%, rgba(59,130,246,.22), transparent 55%),
    linear-gradient(135deg, #CFE3FF 0%, #EEF6FF 55%, #FFFFFF 100%);
}
.stat--green{
  background:
    radial-gradient(900px 260px at 10% 10%, rgba(34,197,94,.20), transparent 55%),
    linear-gradient(135deg, #C9F7D8 0%, #F1FFF6 55%, #FFFFFF 100%);
}
.stat--amber{
  background:
    radial-gradient(900px 260px at 10% 10%, rgba(245,158,11,.22), transparent 55%),
    linear-gradient(135deg, #FFE3A8 0%, #FFF6E2 55%, #FFFFFF 100%);
}
.stat--rose{
  background:
    radial-gradient(900px 260px at 10% 10%, rgba(244,63,94,.22), transparent 55%),
    linear-gradient(135deg, #FFC5D0 0%, #FFF1F3 55%, #FFFFFF 100%);
}
.stat--slate{
  background:
    radial-gradient(900px 260px at 10% 10%, rgba(100,116,139,.22), transparent 55%),
    linear-gradient(135deg, #E2E8F0 0%, #F8FAFC 55%, #FFFFFF 100%);
}

/* Responsive küçük ekranda kart içi denge */
@media(max-width:420px){
  .stat-value{ font-size:1.35rem; }
  .day-cell{ min-height:52px; }
}

/* ===================================
   SOL DASHBOARD PANELİ
=================================== */

.dashboard-left{
  display:flex;
  flex-direction:column;
  gap:18px;
}

/* Yıl kartı */
.year-card{
  background: linear-gradient(135deg,#f1f5f9 0%,#ffffff 100%);
  border-radius:20px;
  padding:20px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border:1px solid rgba(15,23,42,.08);
  box-shadow: 0 12px 24px rgba(2,6,23,.06);
}

.year-label{
  font-size:.8rem;
  color:#64748b;
  font-weight:600;
}
.year-value{
  font-size:1.9rem;
  font-weight:900;
  color:#0f172a;
}

.year-form{
  display:flex;
  gap:10px;
}
.year-form input{
  border:1px solid rgba(15,23,42,.15);
  border-radius:12px;
  padding:6px 10px;
  width:90px;
}
.year-form button{
  background:#2563eb;
  color:#fff;
  border:none;
  padding:6px 14px;
  border-radius:12px;
  font-weight:600;
}

/* Finans grid */
.finance-grid{
  display:grid;
  grid-template-columns: repeat(2,1fr);
  gap:16px;
}

.finance-box{
  padding:16px;
  border-radius:18px;
  border:1px solid rgba(15,23,42,.08);
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
  background:#fff;
  transition:.15s ease;
}

.finance-box:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 32px rgba(2,6,23,.10);
}

.f-label{
  font-size:.8rem;
  color:#64748b;
  font-weight:600;
}

.f-value{
  font-size:1.25rem;
  font-weight:900;
  margin-top:6px;
}

/* Renkler */
.finance-income{
  background: linear-gradient(135deg,#d1fae5,#ffffff);
}
.finance-expense{
  background: linear-gradient(135deg,#fee2e2,#ffffff);
}
.finance-net{
  background: linear-gradient(135deg,#dbeafe,#ffffff);
}
.finance-rec{
  background: linear-gradient(135deg,#fef3c7,#ffffff);
}

/* =========================
   MODERN HEADER / NAVBAR
========================= */
.fx-nav{
  background: linear-gradient(180deg, rgba(15,23,42,.92), rgba(2,6,23,.92));
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,.10);
}

.fx-brand{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 10px;
  text-decoration:none;
}

.fx-logo{
  width:34px;
  height:34px;
  border-radius:12px;
  object-fit:cover;
  box-shadow: 0 10px 20px rgba(0,0,0,.25);
  border:1px solid rgba(255,255,255,.16);
}

.fx-logo-fallback{
  width:34px;
  height:34px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  color:#fff;
  background: linear-gradient(135deg, rgba(59,130,246,.85), rgba(34,197,94,.65));
  border:1px solid rgba(255,255,255,.18);
  box-shadow: 0 10px 20px rgba(0,0,0,.25);
}

.fx-brand-text{
  font-weight:900;
  letter-spacing:.2px;
  color:#fff;
  opacity:.95;
}

.fx-nav-links .fx-link{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:14px;
  color: rgba(255,255,255,.78) !important;
  transition: .15s ease;
  margin: 6px 4px;
}

.fx-nav-links .fx-link:hover{
  background: rgba(255,255,255,.08);
  color:#fff !important;
  transform: translateY(-1px);
}

.fx-nav-links .fx-link.active{
  background: rgba(255,255,255,.14);
  color:#fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
}

.fx-ico{
  width:20px;
  display:inline-flex;
  justify-content:center;
  opacity:.95;
}

.fx-nav-right{
  display:flex;
  align-items:center;
  gap:10px;
}

.fx-nav-tagline{
  font-size:.85rem;
  color: rgba(255,255,255,.55);
  white-space:nowrap;
}

.fx-nav-toggle{
  border:1px solid rgba(255,255,255,.16);
  border-radius:14px;
}