@import url('https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&family=Syne:wght@400;600;800&display=swap');

/* ── Arka plan & font ── */
body {
  font-family: 'Syne', sans-serif !important;
  background-color: #07090e !important;
}

/* Animasyonlu grid */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image:
    linear-gradient(rgba(79,195,247,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(79,195,247,0.03) 1px, transparent 1px);
  background-size: 48px 48px;
  z-index: 0;
  pointer-events: none;
  animation: gridMove 25s linear infinite;
}
@keyframes gridMove {
  0%   { background-position: 0 0; }
  100% { background-position: 48px 48px; }
}

/* Mavi ambient blob */
body::after {
  content: '';
  position: fixed;
  width: 700px;
  height: 700px;
  border-radius: 50%;
  background: #4fc3f7;
  filter: blur(160px);
  opacity: 0.07;
  top: -200px;
  left: -150px;
  pointer-events: none;
  z-index: 0;
  animation: blobFloat 9s ease-in-out infinite alternate;
}
@keyframes blobFloat {
  from { transform: translate(0,0) scale(1); }
  to   { transform: translate(40px,-30px) scale(1.08); }
}

/* ── Header ── */
#page_wrapper > div:first-child,
nav, header {
  background: rgba(7,9,14,0.8) !important;
  backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

/* ── Site başlığı ── */
#site-title {
  font-family: 'Space Mono', monospace !important;
  font-weight: 700 !important;
  font-size: 22px !important;
  letter-spacing: -0.5px !important;
  color: #e8eaf0 !important;
}

/* ── Servis grup başlıkları ── */
.service-group > div:first-child,
h2.text-theme-800 {
  font-family: 'Space Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: #4a5568 !important;
  font-weight: 400 !important;
}

/* ── Servis kartları ── */
.service-card,
li.service {
  background: #0e1117 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 14px !important;
  transition:
    transform 0.3s cubic-bezier(0.34,1.56,0.64,1),
    border-color 0.3s ease,
    box-shadow 0.3s ease !important;
}

.service-card:hover,
li.service:hover {
  transform: translateY(-5px) scale(1.012) !important;
  border-color: rgba(79,195,247,0.35) !important;
  box-shadow: 0 16px 48px rgba(79,195,247,0.08) !important;
  background: #0e1117 !important;
}

/* ── Kart servis adı ── */
.service-card .service-name,
li.service span.font-medium {
  font-family: 'Syne', sans-serif !important;
  font-weight: 800 !important;
  color: #e8eaf0 !important;
  letter-spacing: -0.3px !important;
}

/* ── Kart açıklaması ── */
.service-card .service-description,
li.service span.text-theme-500 {
  font-family: 'Syne', sans-serif !important;
  font-size: 11px !important;
  color: #4a5568 !important;
}

/* ── Docker durumu ── */
.service-card .online { color: #69f0ae !important; }
.service-card .offline,
.service-card .stopped { color: #ff6b6b !important; }

/* ── Widget ── */
.resource-usage span, .widget span {
  font-family: 'Space Mono', monospace !important;
  font-size: 11px !important;
  color: #e8eaf0 !important;
}

/* ── Saat & tarih ── */
#time, #date, [class*="clock"], [class*="datetime"] {
  font-family: 'Space Mono', monospace !important;
  color: #e8eaf0 !important;
}

/* ── Arama kutusu ── */
#search input {
  background: #0e1117 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 10px !important;
  color: #e8eaf0 !important;
  font-family: 'Space Mono', monospace !important;
  font-size: 12px !important;
}
#search input:focus {
  border-color: rgba(79,195,247,0.4) !important;
  box-shadow: 0 0 0 3px rgba(79,195,247,0.08) !important;
  outline: none !important;
}

/* ── Scrollbar ── */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: #07090e; }
::-webkit-scrollbar-thumb { background: rgba(79,195,247,0.2); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(79,195,247,0.4); }

/* ── Link rengi ── */
a { color: #4fc3f7 !important; text-decoration: none !important; }

/* ── Kart arka planları ── */
.bg-theme-100\/10, .bg-theme-200\/10,
.dark\:bg-theme-900\/20, .dark\:bg-theme-800\/20 {
  background-color: #0e1117 !important;
}

/* ══════════════════════════════
   Sol alt — Filistin mesajı
   ══════════════════════════════ */
#pal-badge {
  position: fixed;
  bottom: 20px;
  left: 24px;
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 9px;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.8px;
  color: rgba(255,255,255,0.38);
  pointer-events: none;
  user-select: none;
}

/* SVG bayrak */
#pal-badge svg {
  width: 24px;
  height: 16px;
  border-radius: 3px;
  overflow: hidden;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.08);
  flex-shrink: 0;
}