/* ==========================================================================
   At Akıllı Tarım — Ortak tasarım sistemi (aydınlık profesyonel)
   Tek görsel kaynak: token'lar + bileşen stilleri. Tüm sayfalar bunu kullanır.
   ========================================================================== */

:root {
    /* Marka (yeşil) */
    --brand-900:#0d3b2e;
    --brand-800:#124a38;
    --brand-700:#1b5e20;
    --brand-600:#25703a;
    --brand-500:#2e7d32;
    --brand-300:#66bb6a;
    --brand-050:#e8f5e9;
    --accent:#43a047;

    /* Nötr / zemin */
    --bg:#eef2f4;
    --surface:#ffffff;
    --surface-2:#f5f8fa;
    --line:#e6ecf0;
    --text:#1f2a30;
    --muted:#7a8894;

    /* Durum */
    --success:#2e7d32;
    --danger:#c0392b;
    --warn:#e0a100;
    --info:#1565c0;

    /* Şekil */
    --r-lg:18px;
    --r:14px;
    --r-sm:10px;
    --shadow:0 6px 18px rgba(16,42,67,.08);
    --shadow-lg:0 12px 34px rgba(16,42,67,.14);
}

* { -webkit-tap-highlight-color:transparent; }

body {
    background:var(--bg);
    color:var(--text);
    font-family:"Inter","Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
    font-feature-settings:"cv02","cv03","cv04","cv11";
    letter-spacing:.1px;
}

/* --------------------------------------------------------------- Üst bar */
.at-navbar {
    background:linear-gradient(100deg,var(--brand-900),var(--brand-700));
    box-shadow:0 2px 14px rgba(13,59,46,.25);
    padding:.6rem 0;
    position:sticky; top:0; z-index:1030;
}
.at-navbar .container { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; }
.at-brand {
    display:inline-flex; align-items:center; gap:.5rem;
    color:#fff; font-weight:800; font-size:1.12rem; letter-spacing:.2px;
    text-decoration:none;
}
.at-brand .leaf { font-size:1.15rem; }
.at-brand small { font-weight:500; opacity:.75; font-size:.72rem; }
.at-navbar .btn { border-radius:999px; font-weight:600; }
.at-navbar .btn-light-ghost {
    color:#eafff0; border:1px solid rgba(255,255,255,.28); background:rgba(255,255,255,.06);
}
.at-navbar .btn-light-ghost:hover { background:rgba(255,255,255,.16); color:#fff; }
.at-navbar .btn-admin {
    color:#fff3cd; border:1px solid rgba(255,213,74,.55); background:rgba(255,213,74,.12);
}
.at-navbar .btn-admin:hover { background:rgba(255,213,74,.22); color:#fff; }

/* Canlı bağlantı nabzı (navbar) */
.canli-dot { color:#7be39a; font-size:.6rem; vertical-align:middle; margin-left:.35rem;
    animation:nabiz 1.6s ease-in-out infinite; }
.canli-dot.kopuk { color:#ff8a80; animation:none; }
@keyframes nabiz { 0%,100%{opacity:1} 50%{opacity:.25} }

/* Cihaz bağlantı noktası (navbar cihaz seçici) */
.baglanti-dot { display:inline-block; width:.55rem; height:.55rem; border-radius:50%;
    vertical-align:middle; margin-right:.15rem; }
.baglanti-dot.on  { background:#3fe07a; box-shadow:0 0 0 2px rgba(63,224,122,.25); }
.baglanti-dot.off { background:#ff5a4d; box-shadow:0 0 0 2px rgba(255,90,77,.25);
    animation:nabiz 1.4s ease-in-out infinite; }

/* Hesap / cihaz menüleri */
.dropdown-menu { border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow-lg);
    padding:.35rem; }
.dropdown-item { border-radius:8px; font-weight:500; }
.dropdown-item.active { background:var(--brand-050); color:var(--brand-700); }
.cihaz-menu { max-width:min(320px,calc(100vw - 24px)); }
.dropdown-header { font-size:.68rem; letter-spacing:.08em; text-transform:uppercase;
    color:var(--muted); font-weight:700; }

/* ----------------------------------------------------------------- Kart */
.card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
    box-shadow:var(--shadow); margin-bottom:20px; }
.card-pad { padding:1.1rem 1.15rem; }

/* Bölüm etiketi */
.kart-baslik { display:flex; align-items:center; gap:.45rem;
    font-size:.72rem; letter-spacing:.07em; font-weight:700; color:var(--muted);
    text-transform:uppercase; margin:0; }
.kart-baslik .bi { font-size:.95rem; color:var(--brand-500); }
.kart-ayrac { border:0; border-top:1px solid var(--line); margin:.85rem 0; }

/* --------------------------------------------------------- KPI stat tile */
.stat-tile {
    background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
    box-shadow:var(--shadow); padding:.85rem .6rem; text-align:center; height:100%;
    position:relative; overflow:hidden;
}
.stat-tile::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px;
    background:var(--tile-accent,var(--brand-500)); }
.stat-tile .ikon { font-size:1.35rem; line-height:1; color:var(--tile-accent,var(--brand-500)); }
.stat-tile .deger { font-size:1.7rem; font-weight:800; line-height:1.15; letter-spacing:-.5px; }
.stat-tile .etiket { font-size:.72rem; color:var(--muted); font-weight:600; }
.tile-isi   { --tile-accent:#e6844b; }
.tile-nem   { --tile-accent:#2f8fd6; }
.tile-toprak{ --tile-accent:#3f9a4a; }

/* ------------------------------------------------------------- Butonlar */
.btn { border-radius:999px; font-weight:700; }
.btn-lg-status { padding:.8rem 1.5rem; font-size:1.02rem; letter-spacing:.3px; }
.btn-brand { background:var(--brand-600); border-color:var(--brand-600); color:#fff; }
.btn-brand:hover { background:var(--brand-700); border-color:var(--brand-700); color:#fff; }
.btn-outline-brand { color:var(--brand-700); border:1px solid var(--brand-500); background:#fff; }
.btn-outline-brand:hover { background:var(--brand-050); color:var(--brand-800); }

/* -------------------------------------------------------------- Rozetler */
.badge-pill { border-radius:999px; font-weight:700; font-size:.72rem; padding:.35em .7em; }
.durum-nokta { display:inline-block; width:.55rem; height:.55rem; border-radius:50%;
    background:currentColor; margin-right:.35rem; vertical-align:middle; }

/* --------------------------------------------------------- Pompa kartı */
.pompa-karti { border:1.5px solid var(--line); transition:box-shadow .3s,border-color .3s; }
.pompa-karti.calisiyor { border-color:var(--brand-300);
    box-shadow:0 0 0 4px rgba(67,160,71,.12), var(--shadow); }
.durum-dev { font-size:1.5rem; font-weight:800; letter-spacing:.3px; }

/* -------------------------------------- Aktif sulama göstergesi (pompa ON) */
/* Saf CSS: akan su ışık çizgileri + yükselen kabarcıklar + nabız atan damla */
.sulama-gosterge {
    position:relative; overflow:hidden; display:none;
    height:76px; border-radius:var(--r); margin:.6rem 0 .2rem;
    background:linear-gradient(120deg,#0e5a6b 0%,#1b8f7a 58%,#2fae7a 100%);
    color:#eafffb; box-shadow:inset 0 0 0 1px rgba(255,255,255,.10);
}
.sulama-gosterge.aktif { display:flex; align-items:center; gap:.85rem; padding:0 1.1rem;
    animation:sahneAc .4s ease; }
@keyframes sahneAc { from{opacity:0; transform:scale(.985)} to{opacity:1; transform:none} }

/* Akan su: hareketli açılı ışık çizgileri */
.sulama-gosterge::before {
    content:""; position:absolute; inset:-20% -30%; pointer-events:none;
    background:repeating-linear-gradient(115deg, rgba(255,255,255,.10) 0 10px, transparent 10px 30px);
    animation:suAkisi 1.2s linear infinite;
}
@keyframes suAkisi { from{transform:translateX(0)} to{transform:translateX(40px)} }

/* Alttan yükselen kabarcıklar */
.sulama-gosterge .kabarcik { position:absolute; bottom:-10px; border-radius:50%;
    background:rgba(255,255,255,.4); animation:yuksel 2.6s ease-in infinite; }
.sulama-gosterge .kabarcik:nth-child(1){ left:20%; width:8px;  height:8px;  animation-delay:0s; }
.sulama-gosterge .kabarcik:nth-child(2){ left:38%; width:5px;  height:5px;  animation-delay:.9s; }
.sulama-gosterge .kabarcik:nth-child(3){ left:60%; width:6px;  height:6px;  animation-delay:1.5s; }
.sulama-gosterge .kabarcik:nth-child(4){ left:82%; width:9px;  height:9px;  animation-delay:.5s; }
@keyframes yuksel { 0%{transform:translateY(0);opacity:0} 18%{opacity:.75} 100%{transform:translateY(-84px);opacity:0} }

/* Nabız atan su damlası */
.sulama-gosterge .damla { position:relative; z-index:1; font-size:1.95rem; line-height:1;
    filter:drop-shadow(0 2px 3px rgba(0,0,0,.3)); animation:damlaNabiz 1.6s ease-in-out infinite; }
@keyframes damlaNabiz { 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-3px) scale(1.09)} }

/* Metin */
.sulama-gosterge .yazi { position:relative; z-index:1; }
.sulama-gosterge .yazi b { display:block; font-weight:800; letter-spacing:.3px; font-size:1.02rem; }
.sulama-gosterge .yazi small { opacity:.85; font-size:.75rem; }

/* -------------------------------------- Can suyu göstergesi (vana AÇIK) */
/* Pompadan KASITLI farklı: mavi palet + yukarıdan DÜŞEN damlalar (tek atış/dökülme) */
.cansuyu-gosterge {
    position:relative; overflow:hidden; display:none; text-align:left;
    height:72px; border-radius:var(--r); margin:.2rem 0 .6rem;
    background:linear-gradient(120deg,#0f4c81 0%,#1f78c2 55%,#38b6c9 100%);
    color:#eaf6ff; box-shadow:inset 0 0 0 1px rgba(255,255,255,.10);
}
.cansuyu-gosterge.aktif { display:flex; align-items:center; gap:.85rem; padding:0 1.1rem; animation:sahneAc .4s ease; }
/* yukarıdan düşen su damlaları */
.cansuyu-gosterge .damla-yagmur { position:absolute; inset:0; pointer-events:none; }
.cansuyu-gosterge .damla-yagmur i {
    position:absolute; top:-14px; width:3px; height:13px; border-radius:2px;
    background:linear-gradient(rgba(255,255,255,.15), rgba(255,255,255,.85));
    animation:dusenDamla 1s linear infinite;
}
.cansuyu-gosterge .damla-yagmur i:nth-child(1){ left:12%; animation-duration:.9s;  animation-delay:0s;   }
.cansuyu-gosterge .damla-yagmur i:nth-child(2){ left:27%; animation-duration:1.15s; animation-delay:.35s; }
.cansuyu-gosterge .damla-yagmur i:nth-child(3){ left:45%; animation-duration:.8s;  animation-delay:.6s;  }
.cansuyu-gosterge .damla-yagmur i:nth-child(4){ left:64%; animation-duration:1.05s; animation-delay:.15s; }
.cansuyu-gosterge .damla-yagmur i:nth-child(5){ left:79%; animation-duration:.95s; animation-delay:.5s;  }
.cansuyu-gosterge .damla-yagmur i:nth-child(6){ left:91%; animation-duration:1.2s;  animation-delay:.8s;  }
@keyframes dusenDamla { 0%{transform:translateY(0);opacity:0} 12%{opacity:.9} 100%{transform:translateY(86px);opacity:0} }
/* alt su yüzeyi parıltısı */
.cansuyu-gosterge::after { content:""; position:absolute; left:0; right:0; bottom:0; height:10px;
    background:linear-gradient(rgba(255,255,255,0), rgba(255,255,255,.20));
    animation:suYuzey 1.6s ease-in-out infinite; }
@keyframes suYuzey { 0%,100%{opacity:.5} 50%{opacity:.95} }
/* dökülen damla ikonu */
.cansuyu-gosterge .damla { position:relative; z-index:1; font-size:1.85rem; line-height:1;
    filter:drop-shadow(0 2px 3px rgba(0,0,0,.3)); animation:damlaDus 1.4s ease-in-out infinite; }
@keyframes damlaDus { 0%,100%{transform:translateY(-2px)} 50%{transform:translateY(2px)} }
/* metin */
.cansuyu-gosterge .yazi { position:relative; z-index:1; }
.cansuyu-gosterge .yazi b { display:block; font-weight:800; letter-spacing:.3px; font-size:1.02rem; }
.cansuyu-gosterge .yazi small { opacity:.85; font-size:.75rem; }

/* --------------------------------------------------------------- Tablo */
.table { --bs-table-bg:transparent; margin:0; }
.table thead th { font-size:.72rem; letter-spacing:.05em; text-transform:uppercase;
    color:var(--muted); font-weight:700; border-bottom:1px solid var(--line); }
.table td, .table th { vertical-align:middle; }
.tablo-kart .table tbody tr:last-child td { border-bottom:0; }

/* --------------------------------------------------------------- Form */
.form-control, .form-select { border-radius:var(--r-sm); border-color:var(--line); }
.form-control:focus, .form-select:focus {
    border-color:var(--brand-300); box-shadow:0 0 0 .2rem rgba(67,160,71,.15); }
.form-check-input:checked { background-color:var(--brand-600); border-color:var(--brand-600); }
.form-label { font-weight:600; font-size:.82rem; }
.form-ipucu { font-size:.76rem; color:var(--muted); }

/* --------------------------------------------------------------- Alert */
.alert { border:1px solid transparent; border-radius:var(--r); }

/* ------------------------------------------------------- Auth (giriş) */
.auth-body { background:radial-gradient(1200px 600px at 50% -10%,var(--brand-700),var(--brand-900)); min-height:100vh; }
.auth-marka { color:#eafff0; text-align:center; margin:7vh 0 1rem; font-weight:800; font-size:1.5rem; }
.auth-marka small { display:block; font-weight:500; opacity:.72; font-size:.85rem; letter-spacing:.3px; }
.auth-card { max-width:420px; margin:0 auto 6vh; border:none; border-radius:var(--r-lg);
    box-shadow:0 18px 50px rgba(0,0,0,.35); }
.input-ikonlu { position:relative; }
.input-ikonlu .bi { position:absolute; left:.8rem; top:50%; transform:translateY(-50%);
    color:var(--muted); pointer-events:none; }
.input-ikonlu .form-control { padding-left:2.3rem; }

/* --------------------------------------------------------------- Yardımcı */
.text-muted-2 { color:var(--muted) !important; }
.sayfa-govde { padding-top:1.4rem; padding-bottom:2.5rem; }

@media (max-width:575.98px){
    .at-brand { font-size:1rem; }
    .btn-lg-status { padding:.75rem 1rem; }
    .stat-tile .deger { font-size:1.4rem; }
    .durum-dev { font-size:1.3rem; }
}

@media (prefers-reduced-motion: reduce){
    .sulama-gosterge::before, .sulama-gosterge .kabarcik, .sulama-gosterge .damla,
    .cansuyu-gosterge .damla-yagmur i, .cansuyu-gosterge::after, .cansuyu-gosterge .damla,
    .canli-dot, .stat-tile { animation:none !important; }
}