/* =========================================================
   KELEBEK GEN TR — AGENCY UI v1
   Çalışan Kiwi bağlantı yapısına dokunmadan profesyonel tema.
   ========================================================= */

:root{
  --kb-bg:#07090d;
  --kb-bg2:#0d1117;
  --kb-panel:#10151c;
  --kb-panel2:#151b22;
  --kb-orange:#ff6900;
  --kb-orange2:#ff8a00;
  --kb-gold:#ffbd32;
  --kb-cream:#fff7e8;
  --kb-cream2:#fff0da;
  --kb-text:#f5f7f9;
  --kb-muted:#8996a3;
  --kb-green:#34d399;
  --kb-blue:#25c8ff;
  --kb-purple:#db57ff;
  --kb-border:rgba(255,111,0,.38);
  --kb-shadow:0 18px 55px rgba(0,0,0,.34);
  --kb-butterfly:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath fill='black' d='M31 23C25 7 7 1 3 9c-4 8 7 23 24 24-11 5-16 13-12 14 7 2 14-5 17-14 3 9 10 16 17 14 4-1-1-9-12-14 17-1 28-16 24-24-4-8-22-2-28 14-1-3-3-3-4 0z'/%3E%3C/svg%3E");
}

*{box-sizing:border-box}
html,body{margin:0;background:var(--kb-bg)!important}
body{overflow:hidden}
.kiwi-wrap{
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
  background:var(--kb-bg)!important;
}

/* =========================================================
   1) PROFESYONEL GİRİŞ OVERLAY
   Native Kiwi welcome form DOM'da çalışmaya devam eder; yalnız görsel olarak
   gizlenir. Bu sayede bağlantı akışı Kiwi'nin kendi formundan yürür.
   ========================================================= */
body.kb-landing-open .kiwi-startup-common{
  opacity:0!important;
  pointer-events:none!important;
}

.kb-landing{
  position:fixed;
  inset:0;
  z-index:999999;
  display:grid;
  grid-template-columns:minmax(390px,38%) minmax(0,62%);
  min-height:100vh;
  color:#fff;
  background:
    radial-gradient(circle at 82% 20%,rgba(255,105,0,.20),transparent 23%),
    radial-gradient(circle at 12% 85%,rgba(255,82,0,.10),transparent 25%),
    #07090d;
}

.kb-login-side{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:38px;
  border-right:1px solid var(--kb-border);
  background:
    radial-gradient(circle at 50% 24%,rgba(255,104,0,.13),transparent 31%),
    linear-gradient(180deg,#0d1219 0%,#07090d 100%);
}

.kb-login-side::before{
  content:"";
  position:absolute;
  inset:22px;
  border:1px solid rgba(255,116,0,.18);
  border-radius:25px;
  pointer-events:none;
}

.kb-login-card{
  position:relative;
  z-index:2;
  width:min(390px,100%);
  padding:30px;
  border:1px solid rgba(255,114,0,.38);
  border-radius:21px;
  background:rgba(12,17,23,.92);
  box-shadow:var(--kb-shadow),inset 0 0 30px rgba(255,105,0,.025);
  backdrop-filter:blur(14px);
}

.kb-mini-logo{
  display:block;
  width:215px;
  max-width:78%;
  margin:0 auto 15px;
  filter:drop-shadow(0 0 15px rgba(255,83,0,.18));
}

.kb-login-card h1{
  margin:0;
  text-align:center;
  font-size:27px;
  line-height:1.12;
  letter-spacing:-.03em;
}
.kb-login-card .kb-sub{
  display:block;
  margin:7px auto 24px;
  color:#9eabb7;
  text-align:center;
  font-size:13px;
  line-height:1.5;
}

.kb-field-label{
  display:block;
  margin:0 0 8px;
  color:#c8d0d7;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.kb-nick-input{
  width:100%;
  height:52px;
  padding:0 15px;
  color:#fff;
  font-size:16px;
  outline:none;
  border:1px solid rgba(255,126,24,.55);
  border-radius:11px;
  background:#080c11;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.01);
}
.kb-nick-input:focus{
  border-color:#ff7b09;
  box-shadow:0 0 0 3px rgba(255,105,0,.11),0 0 20px rgba(255,87,0,.09);
}

.kb-enter{
  width:100%;
  height:54px;
  margin-top:15px;
  border:1px solid #ff932a;
  border-radius:12px;
  color:#fff;
  font-weight:900;
  letter-spacing:.04em;
  cursor:pointer;
  background:linear-gradient(135deg,#ff8d00,#ff5200);
  box-shadow:0 13px 28px rgba(255,82,0,.22);
}
.kb-enter:hover{filter:brightness(1.07);transform:translateY(-1px)}
.kb-enter:disabled{opacity:.68;cursor:wait;transform:none}

.kb-login-error{
  display:none;
  margin-top:12px;
  padding:10px 12px;
  border-radius:9px;
  color:#ffb8a3;
  background:rgba(255,82,40,.09);
  border:1px solid rgba(255,105,60,.20);
  font-size:12px;
}
.kb-login-error.is-visible{display:block}

.kb-dev{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-top:23px;
  padding-top:18px;
  text-align:center;
  border-top:1px solid rgba(255,255,255,.07);
}
.kb-dev strong{color:#ff973b;font-size:13px}
.kb-dev span{color:#d5dbe1;font-size:11px}
.kb-dev small{color:#67737e;font-size:10px}

.kb-promo-side{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  padding:45px 55px;
  background:
    radial-gradient(circle at 72% 18%,rgba(255,102,0,.20),transparent 24%),
    radial-gradient(circle at 32% 78%,rgba(255,72,0,.08),transparent 27%),
    linear-gradient(145deg,#151a20 0%,#090d12 62%,#130905 100%);
}
.kb-promo-side::after{
  content:"";
  position:absolute;
  right:-85px;
  bottom:-65px;
  width:500px;
  height:380px;
  opacity:.07;
  background:#ff7100;
  -webkit-mask:var(--kb-butterfly) center/contain no-repeat;
  mask:var(--kb-butterfly) center/contain no-repeat;
  transform:rotate(-10deg);
}
.kb-promo{
  position:relative;
  z-index:2;
  width:min(760px,100%);
  text-align:center;
}
.kb-promo-logo{
  display:block;
  width:min(610px,88%);
  max-height:190px;
  object-fit:contain;
  margin:0 auto 17px;
  filter:drop-shadow(0 0 24px rgba(255,87,0,.20));
}
.kb-badge{
  display:inline-block;
  padding:8px 14px;
  color:#ffad5e;
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
  border:1px solid rgba(255,146,56,.32);
  border-radius:999px;
  background:rgba(255,105,0,.06);
}
.kb-promo h2{
  margin:20px 0 0;
  font-size:clamp(42px,4.3vw,68px);
  line-height:.98;
  letter-spacing:-.045em;
}
.kb-promo h2 span{color:#ff7320}
.kb-promo p{
  max-width:610px;
  margin:21px auto 25px;
  color:#9eaab5;
  line-height:1.65;
  font-size:14px;
}
.kb-feature-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  max-width:600px;
  margin:0 auto;
}
.kb-feature{
  min-height:92px;
  padding:18px;
  text-align:left;
  border:1px solid rgba(255,129,28,.15);
  border-radius:14px;
  background:rgba(255,255,255,.032);
}
.kb-feature b{display:block;color:#fff;font-size:14px;margin-bottom:5px}
.kb-feature small{color:#788692;font-size:11px}
.kb-promo-footer{
  display:flex;
  justify-content:space-between;
  gap:20px;
  max-width:600px;
  margin:23px auto 0;
  padding-top:17px;
  color:#798590;
  font-size:10px;
  border-top:1px solid rgba(255,255,255,.06);
}
.kb-promo-footer strong{color:#ff9638}

/* =========================================================
   2) CHAT ÜST MARKA BANDI
   ========================================================= */
body.kb-chat::before{
  content:"";
  position:fixed;
  z-index:1000;
  top:0;left:0;right:0;
  height:96px;
  pointer-events:none;
  border-bottom:1px solid rgba(255,116,0,.68);
  background:
    url("kelebek-logo.png") 25px center/430px auto no-repeat,
    radial-gradient(circle at 68% 35%,rgba(255,101,0,.23),transparent 19%),
    linear-gradient(180deg,#190d06,#080a0d);
  box-shadow:0 8px 25px rgba(0,0,0,.30);
}
body.kb-chat::after{
  content:"Sohbetin Özgür Kanatları  ♡";
  position:fixed;
  z-index:1001;
  top:35px;
  left:480px;
  color:#ffae53;
  font:italic 22px "Segoe Script","Brush Script MT",cursive;
  text-shadow:0 0 10px rgba(255,103,0,.40);
  pointer-events:none;
}
body.kb-chat .kiwi-wrap{
  height:calc(100vh - 96px)!important;
  margin-top:96px!important;
}

/* =========================================================
   3) SOL MENÜ
   ========================================================= */
.kiwi-statebrowser{
  background:
    radial-gradient(circle at 35% 12%,rgba(255,102,0,.10),transparent 28%),
    linear-gradient(180deg,#101419,#080b0e 67%,#0b0805)!important;
  border-right:1px solid var(--kb-border)!important;
}
.kiwi-statebrowser-appsettings{display:none!important}

.kiwi-statebrowser-usermenu{
  min-height:145px!important;
  padding-top:14px!important;
  border-bottom:1px solid rgba(255,109,0,.22)!important;
}
.kiwi-statebrowser-usermenu-avatar{
  position:relative;
  transform:scale(1.05);
}
.kiwi-statebrowser-usermenu-avatar::after{
  content:"";
  position:absolute;
  width:31px;height:23px;
  right:-12px;bottom:-7px;
  background:linear-gradient(135deg,#ffbd24,#ff5600);
  -webkit-mask:var(--kb-butterfly) center/contain no-repeat;
  mask:var(--kb-butterfly) center/contain no-repeat;
  filter:drop-shadow(0 0 7px rgba(255,91,0,.65));
}
.kiwi-statebrowser-usermenu-network{
  color:#fff!important;
  font-weight:900!important;
  font-size:14px!important;
}

.kiwi-statebrowser-network-header{
  margin:10px 9px 7px!important;
  padding:10px 11px!important;
  border:1px solid rgba(255,139,30,.58)!important;
  border-radius:10px!important;
  background:linear-gradient(90deg,rgba(222,72,0,.76),rgba(255,126,0,.13))!important;
}
.kiwi-statebrowser-network-name{color:#fff!important;font-weight:900!important}
.kiwi-statebrowser-channels-header{
  padding:11px 12px 7px!important;
  color:#aeb7bf!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.kiwi-statebrowser-channel{
  min-height:41px!important;
  margin:3px 8px!important;
  border:1px solid transparent!important;
  border-radius:9px!important;
}
.kiwi-statebrowser-channel:hover{
  background:rgba(255,116,0,.08)!important;
}
.kiwi-statebrowser-channel-active{
  background:linear-gradient(90deg,#d84b00,#ff7200)!important;
  border-color:#ff912d!important;
  box-shadow:0 0 17px rgba(255,84,0,.18)!important;
}
.kiwi-statebrowser-channel-name{color:#eef1f3!important;font-weight:700!important}
.kiwi-statebrowser-channel-active .kiwi-statebrowser-channel-name{color:#fff!important;font-weight:900!important}
.kiwi-statebrowser-channel-label{
  min-width:30px!important;
  padding:3px 7px!important;
  border-radius:7px!important;
  color:#fff!important;
  font-weight:900!important;
  background:linear-gradient(#ff8d00,#ff5900)!important;
}
.kiwi-statebrowser-newnetwork{display:none!important}

/* =========================================================
   4) ORTA HEADER + CHAT
   ========================================================= */
.kiwi-header{
  min-height:58px!important;
  color:#fff!important;
  background:linear-gradient(180deg,#161b21,#0d1116)!important;
  border-bottom:1px solid #ff7312!important;
}
.kiwi-header-name,.kiwi-header-name-full{
  color:#fff!important;
  font-size:20px!important;
  font-weight:900!important;
}
.kiwi-header-name-full::before{
  content:"#";
  display:inline-grid;
  place-items:center;
  width:40px;height:40px;
  margin-right:11px;
  border-radius:10px;
  color:#fff;
  font-size:27px;
  background:linear-gradient(145deg,#ff8c00,#ff5500);
}
.kiwi-header-option-settings{display:none!important}
.kiwi-header-option a{color:#fff!important;border-radius:9px!important}

.kiwi-messagelist{
  position:relative;
  color:#30414d!important;
  background:
    linear-gradient(rgba(255,249,239,.97),rgba(255,246,230,.97)),
    url("kelebek-logo.png") 73% 64%/330px auto no-repeat!important;
}
.kiwi-messagelist::after{
  content:"";
  position:absolute;
  right:6%;top:28%;
  width:300px;height:280px;
  opacity:.055;
  pointer-events:none;
  background:#ff6900;
  -webkit-mask:var(--kb-butterfly) center/contain no-repeat;
  mask:var(--kb-butterfly) center/contain no-repeat;
}
.kiwi-messagelist-message{
  margin:2px 12px!important;
  padding:7px 9px!important;
  border-radius:9px!important;
  line-height:1.42!important;
}
.kiwi-messagelist-message:hover{background:rgba(255,119,0,.055)!important}
.kiwi-messagelist-message--highlight{
  background:rgba(255,153,54,.12)!important;
  box-shadow:inset 3px 0 #ff7000!important;
}
.kiwi-messagelist-message a,.kiwi-messagelist-message-link{
  color:#ff4e17!important;
  text-decoration:underline!important;
}
.kiwi-messagelist-message-notice{
  background:rgba(255,238,207,.50)!important;
  border-left:2px solid rgba(255,116,0,.20)!important;
}

/* =========================================================
   5) MESAJ GİRİŞİ
   ========================================================= */
.kiwi-controlinput{
  padding:8px 10px 10px!important;
  background:linear-gradient(180deg,#10151a,#090c10)!important;
  border-top:1px solid #ff7312!important;
}
.kiwi-controlinput-inner{
  min-height:52px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,115,0,.55)!important;
  border-radius:12px!important;
  background:#0c1117!important;
  box-shadow:0 7px 19px rgba(0,0,0,.23)!important;
}
.kiwi-controlinput-user{
  position:relative;
  min-width:72px!important;
  padding-left:36px!important;
  color:#fff!important;
  font-weight:900!important;
}
.kiwi-controlinput-user::before{
  content:"";
  position:absolute;
  left:9px;top:50%;
  width:22px;height:17px;
  transform:translateY(-50%);
  background:linear-gradient(135deg,#ffb500,#ff5600);
  -webkit-mask:var(--kb-butterfly) center/contain no-repeat;
  mask:var(--kb-butterfly) center/contain no-repeat;
}
.kiwi-controlinput-user-nick{color:#f3f4f5!important;font-weight:900!important}
.kiwi-controlinput-input,.kiwi-controlinput-input textarea,.kiwi-controlinput-input input{
  color:#fff!important;background:transparent!important
}
.kiwi-controlinput-send{
  width:76px!important;
  margin:5px!important;
  color:#fff!important;
  border:1px solid #ff982d!important;
  border-radius:9px!important;
  background:linear-gradient(145deg,#ff8a00,#ff5100)!important;
}

/* =========================================================
   6) SAĞ KULLANICI PANELİ / YETKİ KELEBEKLERİ
   ========================================================= */
.kiwi-sidebar{
  color:#fff!important;
  background:
    radial-gradient(circle at 85% 20%,rgba(255,100,0,.09),transparent 25%),
    linear-gradient(180deg,#11161c,#090c10)!important;
  border-left:1px solid var(--kb-border)!important;
}
.kiwi-nicklist{padding:7px!important;background:transparent!important}
.kiwi-nicklist-usercount{
  position:relative;
  min-height:47px!important;
  margin:5px 5px 10px!important;
  padding:11px 38px 11px 42px!important;
  color:#fff!important;
  font-size:16px!important;
  font-weight:900!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-radius:10px!important;
  background:#11171d!important;
}
.kiwi-nicklist-usercount::before{
  content:"👥";
  position:absolute;left:12px;
}
.kiwi-nicklist-user{
  --role:#9da6af;
  --rolebg:rgba(255,255,255,.028);
  position:relative;
  min-height:47px!important;
  margin:5px 3px!important;
  padding:9px 48px 9px 43px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  border-radius:10px!important;
  background:var(--rolebg)!important;
}
.kiwi-nicklist-user::before{
  content:"";
  position:absolute;
  left:10px;top:50%;
  width:26px;height:20px;
  transform:translateY(-50%);
  background:var(--role);
  -webkit-mask:var(--kb-butterfly) center/contain no-repeat;
  mask:var(--kb-butterfly) center/contain no-repeat;
}
.kiwi-nicklist-user::after{
  position:absolute;
  right:7px;top:50%;
  transform:translateY(-50%);
  padding:2px 5px;
  color:var(--role);
  font-size:8px;
  font-weight:900;
  border:1px solid currentColor;
  border-radius:5px;
  opacity:.86;
}
.kiwi-nicklist-user-prefix{display:none!important}
.kiwi-nicklist-user-nick{color:var(--role)!important;font-weight:850!important}
.kiwi-nicklist-user--mode-q{--role:#ffb51d;--rolebg:linear-gradient(90deg,rgba(255,105,0,.14),rgba(255,180,0,.035))}
.kiwi-nicklist-user--mode-q::after{content:"FOUNDER"}
.kiwi-nicklist-user--mode-a{--role:#dc54ff;--rolebg:linear-gradient(90deg,rgba(170,45,255,.14),rgba(120,25,170,.03))}
.kiwi-nicklist-user--mode-a::after{content:"SOP"}
.kiwi-nicklist-user--mode-o{--role:#20caff;--rolebg:linear-gradient(90deg,rgba(0,163,255,.13),rgba(0,90,150,.03))}
.kiwi-nicklist-user--mode-o::after{content:"OP"}
.kiwi-nicklist-user--mode-h{--role:#ff8c12;--rolebg:linear-gradient(90deg,rgba(255,117,0,.13),rgba(255,180,0,.03))}
.kiwi-nicklist-user--mode-h::after{content:"AOP"}
.kiwi-nicklist-user--mode-v{--role:#4bd69a;--rolebg:linear-gradient(90deg,rgba(38,205,135,.09),transparent)}
.kiwi-nicklist-user--mode-v::after{content:"VOICE"}
.kiwi-nicklist-user:not(.kiwi-nicklist-user--mode-q):not(.kiwi-nicklist-user--mode-a):not(.kiwi-nicklist-user--mode-o):not(.kiwi-nicklist-user--mode-h):not(.kiwi-nicklist-user--mode-v)::after{display:none}

/* User detail / PM */
.kiwi-userbox,.kiwi-sidebar-userbox{
  color:#e7edf2!important;
  background:#0b0f14!important;
}
.kiwi-userbox-header{
  padding:17px!important;
  background:linear-gradient(180deg,#171316,#0d1115)!important;
  border-bottom:1px solid rgba(255,111,0,.30)!important;
}
.kiwi-userbox-nick{color:#ff8b25!important;font-weight:900!important}
.kiwi-userbox-usermask,.kiwi-userbox-basicinfo,.kiwi-userbox-basicinfo-title,
.kiwi-userbox-basicinfo-data,.kiwi-userbox-whois-line{color:#c5ced6!important}
.kiwi-userbox-action,.kiwi-userbox a{color:#ff9339!important}

/* =========================================================
   7) MASAÜSTÜ ÖLÇÜLERİ
   ========================================================= */
@media (min-width:1050px){
  body.kb-chat .kiwi-statebrowser{
    width:230px!important;min-width:230px!important;max-width:230px!important;flex:0 0 230px!important;
  }
  body.kb-chat .kiwi-sidebar{
    width:290px!important;min-width:290px!important;max-width:290px!important;flex:0 0 290px!important;
  }
}

/* =========================================================
   8) MOBİL
   ========================================================= */
@media (max-width:900px){
  .kb-landing{
    display:block;
    overflow:auto;
  }
  .kb-login-side{
    min-height:100vh;
    padding:20px 15px;
    border-right:0;
  }
  .kb-promo-side{display:none}
  .kb-login-card{width:min(390px,100%);padding:24px}
  body.kb-chat::before,body.kb-chat::after{display:none}
  body.kb-chat .kiwi-wrap{height:100vh!important;margin-top:0!important}
}

/* Scrollbar */
*{scrollbar-width:thin;scrollbar-color:#ff6b00 rgba(255,255,255,.03)}
*::-webkit-scrollbar{width:7px;height:7px}
*::-webkit-scrollbar-track{background:rgba(255,255,255,.02)}
*::-webkit-scrollbar-thumb{background:linear-gradient(#ff9500,#ff5500);border-radius:20px}


/* =========================================================
   v1.2 MOBILE CHAT INPUT FIX
   Android/iOS browser chrome + safe-area için
   ========================================================= */
@media (max-width:900px){

  html,
  body{
    width:100% !important;
    min-height:100% !important;
    overscroll-behavior:none;
  }

  body.kb-chat{
    height:100dvh !important;
    min-height:100dvh !important;
    overflow:hidden !important;
  }

  body.kb-chat .kiwi-wrap{
    position:fixed !important;
    inset:0 !important;
    width:100vw !important;
    height:100dvh !important;
    min-height:100dvh !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
  }

  /* Mesaj yazma alanı her zaman görünür kalsın */
  body.kb-chat .kiwi-controlinput{
    position:relative !important;
    z-index:60 !important;
    flex:0 0 auto !important;
    min-height:64px !important;
    padding:
      7px
      8px
      calc(7px + env(safe-area-inset-bottom, 0px))
      8px !important;
    background:#090d12 !important;
    border-top:1px solid rgba(255,112,0,.72) !important;
    box-shadow:0 -8px 22px rgba(0,0,0,.28) !important;
  }

  body.kb-chat .kiwi-controlinput-inner{
    min-height:50px !important;
    height:auto !important;
    border-radius:12px !important;
    overflow:visible !important;
  }

  body.kb-chat .kiwi-controlinput-input-wrap{
    min-height:46px !important;
    display:flex !important;
    align-items:center !important;
  }

  body.kb-chat .kiwi-controlinput-input,
  body.kb-chat .kiwi-controlinput-input textarea,
  body.kb-chat .kiwi-controlinput-input input{
    min-height:44px !important;
    max-height:110px !important;
    padding-top:11px !important;
    padding-bottom:11px !important;
    font-size:16px !important; /* iOS zoom engeli */
    line-height:1.35 !important;
  }

  body.kb-chat .kiwi-controlinput-user{
    min-width:64px !important;
    padding-left:31px !important;
    padding-right:7px !important;
    font-size:12px !important;
  }

  body.kb-chat .kiwi-controlinput-send{
    min-width:46px !important;
    width:46px !important;
    height:42px !important;
    margin:4px !important;
  }

  /* Mesaj alanı input tarafından ezilmesin */
  body.kb-chat .kiwi-messagelist{
    min-height:0 !important;
  }

  /* Sağ panel açıkken de alt kutu kaybolmasın */
  body.kb-chat .kiwi-sidebar{
    padding-bottom:env(safe-area-inset-bottom, 0px) !important;
  }

  /* Eski 100vh kuralını modern mobil viewport ile ez */
  @supports not (height:100dvh){
    body.kb-chat,
    body.kb-chat .kiwi-wrap{
      height:100vh !important;
      min-height:100vh !important;
    }
  }
}