*{box-sizing:border-box} body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f4f7fb;color:#17233b}
.app{display:flex;min-height:100vh}.sidebar{width:230px;background:#0f2f57;color:#fff;padding:24px 16px;position:fixed;top:0;bottom:0}
.brand{font-weight:800;font-size:22px;margin:4px 10px 28px}.brand span{margin-left:6px}
nav{display:flex;flex-direction:column;gap:8px}.nav{border:0;background:transparent;color:#dce8f7;padding:12px 14px;border-radius:10px;text-align:left;font-size:15px;cursor:pointer}
.nav:hover,.nav.active{background:#1d4f86;color:white}.small{position:absolute;bottom:20px;font-size:12px;color:#aac0d9;line-height:1.5}
.content{margin-left:230px;width:calc(100% - 230px);padding:24px 30px}
header{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}h1{margin:0 0 5px;font-size:28px}header p{margin:0;color:#6c7a90}
.primary,.ghost,.danger{border:0;border-radius:9px;padding:11px 16px;font-weight:700;cursor:pointer}
.primary{background:#1565c0;color:white}.ghost{background:#e9eef5;color:#23364f}.danger{background:#ffe8e8;color:#b21f2d}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}.card{background:#fff;border:1px solid #e4eaf2;border-radius:15px;box-shadow:0 6px 24px rgba(22,42,77,.05);padding:18px}
.stat span{color:#6d7b8e;display:block;margin-bottom:10px}.stat b{font-size:30px}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:15px}.section-head input{max-width:320px}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;margin-top:12px}th,td{padding:12px 10px;border-bottom:1px solid #edf1f6;text-align:left;font-size:14px}th{color:#66768c;background:#fafbfd}
.badge{display:inline-block;padding:5px 9px;border-radius:999px;background:#eef4ff;color:#2456a6;font-size:12px}.hot{background:#ffecec;color:#b52c2c}.warm{background:#fff4db;color:#9b6b00}.cold{background:#eef2f5;color:#5f6d7a}
.view{display:none}.view.active{display:block}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.form-grid label{font-size:13px;font-weight:700;color:#40516b;display:flex;flex-direction:column;gap:7px}
input,select,textarea{width:100%;padding:11px;border:1px solid #dbe2eb;border-radius:8px;background:white;font:inherit}textarea{resize:vertical}.full{grid-column:1/-1}.actions{display:flex;justify-content:flex-end;gap:10px}
.detail-grid{display:grid;grid-template-columns:1fr 2fr;gap:18px}.profile h2{margin-top:0}.kv{display:grid;grid-template-columns:160px 1fr;gap:9px 14px}.kv b{color:#60728a}.notes{white-space:pre-wrap;background:#fafbfd;padding:14px;border-radius:10px;border:1px solid #edf1f5}.muted{color:#718096}
.linkbtn{border:0;background:#eaf2ff;color:#185ab6;border-radius:8px;padding:8px 10px;cursor:pointer}
@media(max-width:900px){.sidebar{position:static;width:100%;height:auto}.app{display:block}.content{margin:0;width:100%;padding:16px}.small{display:none}.cards{grid-template-columns:repeat(2,1fr)}.form-grid,.detail-grid{grid-template-columns:1fr}.full{grid-column:auto}}

.inline-field{display:flex;gap:8px;align-items:center}.inline-field select{flex:1}.small-btn{white-space:nowrap;padding:10px 12px}

.hidden-field{display:none!important}

.user-add-grid{display:grid;grid-template-columns:2fr 1.5fr 1.2fr auto;gap:12px;align-items:end;margin-top:18px}
.user-add-grid label{font-size:13px;font-weight:700;color:#40516b;display:flex;flex-direction:column;gap:7px}
.user-add-action{display:flex;align-items:end}
@media(max-width:900px){.user-add-grid{grid-template-columns:1fr}.user-add-action{align-items:stretch}}

.followup-row{
  display:grid;
  grid-template-columns:1.2fr .8fr 1.2fr;
  gap:16px;
  align-items:end;
}
.followup-row label{
  min-width:0;
}
@media(max-width:900px){
  .followup-row{
    grid-template-columns:1fr;
  }
}

.required-mark{color:#c62828;font-weight:800}
.field-error{border-color:#c62828!important;box-shadow:0 0 0 3px rgba(198,40,40,.10)!important}
.field-error-label{color:#c62828!important}
#saveBtn:disabled{opacity:.45;cursor:not-allowed}

.customer-name-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  min-width:220px;
}
.row-actions{
  display:flex;
  gap:6px;
  flex-shrink:0;
}
.icon-btn{
  width:34px;
  height:34px;
  border:1px solid #dbe2eb;
  background:#fff;
  border-radius:8px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  padding:0;
}
.icon-btn:hover{
  background:#f2f6fb;
  border-color:#b9c7d8;
}

.end-actions{
  justify-content:flex-end;
}

.action-col{
  text-align:center!important;
}
.centered-actions{
  justify-content:center;
  align-items:center;
}

.required-input-wrap{
  position:relative;
  width:100%;
}
.required-input-wrap input{
  padding-right:30px;
}
.required-inside{
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  color:#c62828;
  font-size:18px;
  font-weight:800;
  pointer-events:none;
}
.required-input-wrap:focus-within .required-inside{
  opacity:.9;
}
input.field-error{
  border-color:#d32f2f!important;
  box-shadow:0 0 0 2px rgba(211,47,47,.12)!important;
  outline:none!important;
}
input.field-error:focus{
  border-color:#d32f2f!important;
  box-shadow:0 0 0 2px rgba(211,47,47,.18)!important;
}

input::placeholder,
textarea::placeholder{
  color:rgba(0,0,0,.42);
  opacity:1;
}

.list-filters{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.list-filters select{
  min-width:190px;
}
.list-filters input{
  min-width:260px;
}
@media(max-width:900px){
  .list-filters{
    width:100%;
    align-items:stretch;
  }
  .list-filters select,
  .list-filters input{
    width:100%;
    min-width:0;
  }
}

.list-filters{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
  align-items:center!important;
  width:min(100%,620px);
}
.list-filters select,
.list-filters input{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
}
@media(max-width:700px){
  .list-filters{
    grid-template-columns:1fr!important;
    width:100%;
  }
}

.status-sale{
  background:#dcfce7!important;
  color:#15803d!important;
  border:1px solid #bbf7d0!important;
}
.status-negative{
  background:#fee2e2!important;
  color:#b91c1c!important;
  border:1px solid #fecaca!important;
}

.toast-container{position:fixed;right:22px;bottom:22px;z-index:9999;display:flex;flex-direction:column;gap:10px;pointer-events:none}
.app-toast{min-width:230px;padding:14px 18px;border-radius:10px;display:flex;align-items:center;gap:10px;font-weight:700;box-shadow:0 10px 30px rgba(15,23,42,.18);opacity:0;transform:translateY(12px);transition:.22s ease}
.app-toast.show{opacity:1;transform:translateY(0)}
.toast-success{background:#16a34a;color:#fff}
.toast-error{background:#dc2626;color:#fff}
.toast-icon{width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.18)}

.field-warning{
  display:none;
  margin-top:6px;
  font-size:12px;
  color:#c62828;
  font-weight:700;
}
.field-warning.show{
  display:block;
}

.brand-logo{
  display:flex!important;
  align-items:center;
  justify-content:flex-start;
  padding:8px 4px 18px;
}
.brand-logo img{
  display:block;
  width:175px;
  max-width:100%;
  height:64px;
  object-fit:contain;
  object-position:left center;
  border-radius:6px;
}

.detail-grid-customer{
  align-items:start;
}
.customer-summary{
  min-height:220px;
}
.customer-detail-main{
  min-width:0;
}
.customer-card-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:18px;
  padding:4px 0 8px;
}
.conversation-card h2{
  margin-bottom:4px;
}
.conversation-title-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
}
.conversation-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  padding:16px;
  margin:16px 0 18px;
  border:1px solid #e4eaf2;
  border-radius:12px;
  background:#fafbfd;
}
.conversation-form label{
  font-size:13px;
  font-weight:700;
  color:#40516b;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.conversation-note-field{
  grid-column:1/-1;
}
.conversation-add-action{
  grid-column:1/-1;
  display:flex;
  justify-content:flex-end;
}
.conversation-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.conversation-item{
  border:1px solid #e5eaf1;
  background:#fff;
  border-radius:12px;
  padding:14px 16px;
}
.conversation-meta{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  margin-bottom:8px;
}
.conversation-meta > div{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.conversation-channel{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:12px;
  padding:5px 9px;
  border-radius:999px;
  background:#eef4ff;
  color:#2456a6;
}
.conversation-text{
  line-height:1.5;
  white-space:pre-wrap;
}
.conversation-delete{
  border:0;
  background:transparent;
  cursor:pointer;
  opacity:.65;
  font-size:16px;
}
.conversation-delete:hover{
  opacity:1;
}
@media(max-width:900px){
  .conversation-form{
    grid-template-columns:1fr;
  }
  .conversation-note-field,
  .conversation-add-action{
    grid-column:auto;
  }
}

.compact-conversation-form{
  grid-template-columns:1fr 1fr 1fr 1fr;
}
.compact-conversation-list{
  max-height:320px;
  overflow:auto;
}
.compact-conversation-item{
  padding:10px 12px;
}
.compact-meta{
  margin-bottom:6px;
}
.conversation-main-meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}
.conversation-status,
.conversation-rep{
  display:inline-flex;
  align-items:center;
  padding:4px 8px;
  border-radius:999px;
  background:#f3f4f6;
  font-size:12px;
  color:#475569;
}
.conversation-actions{
  display:flex;
  gap:4px;
}
.conversation-edit,
.conversation-delete{
  border:0;
  background:transparent;
  cursor:pointer;
  opacity:.7;
  font-size:15px;
}
.conversation-edit:hover,
.conversation-delete:hover{
  opacity:1;
}
.two-line-clamp{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  line-height:1.4;
  max-height:2.8em;
}
.history-item{
  margin:0 0 10px;
}
.history-toggle{
  margin-top:4px;
}
@media(max-width:1100px){
  .compact-conversation-form{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:700px){
  .compact-conversation-form{
    grid-template-columns:1fr;
  }
}

.required-input-wrap select{
  padding-right:30px;
}

select.field-error{
  border-color:#d32f2f!important;
  box-shadow:0 0 0 2px rgba(211,47,47,.12)!important;
  outline:none!important;
}
select.field-error:focus{
  border-color:#d32f2f!important;
  box-shadow:0 0 0 2px rgba(211,47,47,.18)!important;
}

.phone-entry-grid{
  display:grid;
  grid-template-columns:1.45fr .55fr 1.5fr;
  gap:8px;
  align-items:center;
}
.phone-code-input{
  text-align:center;
  font-weight:700;
  background:#f8fafc!important;
}
@media(max-width:900px){
  .phone-entry-grid{
    grid-template-columns:1fr;
  }
}

/* Satış Temsilcisi + Sonraki Arama + Arama Tarihi aynı satır */
#customerForm{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:16px;
}
#customerForm > label{
  grid-column:span 3;
}
#customerForm > .bottom-row-field{
  grid-column:span 2!important;
}
#customerForm > .save-row-below{
  grid-column:1/-1!important;
  display:flex;
  justify-content:flex-end;
  margin-top:0!important;
}
#customerForm > .save-row-below #saveBtn{
  min-width:130px;
}
@media(max-width:900px){
  #customerForm{
    grid-template-columns:1fr;
  }
  #customerForm > label,
  #customerForm > .bottom-row-field,
  #customerForm > .save-row-below{
    grid-column:1/-1!important;
  }
}

/* Kaydet butonu yalnızca formun en altında */
.bottom-save-action{
  grid-column:1/-1!important;
  display:flex;
  justify-content:flex-end;
  margin-top:-6px;
  padding-top:0;
}
.bottom-save-action #saveBtn{
  min-width:130px;
}
#customerForm > .bottom-row-field{
  margin-bottom:0!important;
}
#customerForm > .save-row-below{
  display:none!important;
}
.customer-card-actions{
  margin-top:6px!important;
  padding-top:0!important;
}

/* DÜZELTME: Başlık ile veri giriş alanları arasındaki gereksiz büyük boşluğu kaldır */
#customerForm{
  display:block!important;
  min-height:0!important;
  height:auto!important;
  align-content:start!important;
}

/* Formun kendi mevcut grid yapısını kullan */
#customerForm .form-grid{
  margin-top:0!important;
  align-content:start!important;
}

/* Son üç alanı aynı satırda tut */
#customerForm .form-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:16px;
}
#customerForm .form-grid > label{
  grid-column:span 3;
}
#customerForm .form-grid > .bottom-row-field{
  grid-column:span 2!important;
}

/* Kaydet butonu son satırın hemen altında */
#customerForm .bottom-save-action{
  display:flex!important;
  justify-content:flex-end;
  margin-top:8px!important;
  padding-top:0!important;
}

/* Önceki hatalı üst/sağ kaydet yerleşimini etkisizleştir */
#customerForm > .save-row-below{
  display:none!important;
}

@media(max-width:900px){
  #customerForm .form-grid{
    grid-template-columns:1fr;
  }
  #customerForm .form-grid > label,
  #customerForm .form-grid > .bottom-row-field{
    grid-column:1/-1!important;
  }
}

/* TEMİZ YERLEŞİM DÜZELTMESİ */
#customerForm.card.form-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:16px!important;
  align-content:start!important;
  min-height:auto!important;
  height:auto!important;
  margin-top:0!important;
}

#customerForm.card.form-grid > h2.full,
#customerForm.card.form-grid > .full:not(.followup-row){
  grid-column:1/-1!important;
}

#customerForm.card.form-grid > label{
  grid-column:span 3!important;
}

#customerForm.card.form-grid > .followup-row{
  grid-column:1/-1!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:end!important;
  margin:0!important;
}

#customerForm.card.form-grid > .followup-row > .bottom-row-field{
  min-width:0!important;
}

#customerForm.card.form-grid > .bottom-save-action{
  grid-column:1/-1!important;
  display:flex!important;
  justify-content:flex-end!important;
  margin-top:4px!important;
  padding-top:0!important;
}

#customerForm.card.form-grid > .save-row-below{
  display:none!important;
}

/* Müşteri kartı görünümünde içerik başlığın hemen altında başlasın */
#detail.active #detailContent,
#detailContent{
  margin-top:0!important;
  padding-top:0!important;
}

#detailContent .detail-grid{
  margin-top:0!important;
  align-items:start!important;
}

.customer-detail-main,
.customer-summary{
  margin-top:0!important;
}

@media(max-width:900px){
  #customerForm.card.form-grid{
    grid-template-columns:1fr!important;
  }
  #customerForm.card.form-grid > label,
  #customerForm.card.form-grid > .followup-row,
  #customerForm.card.form-grid > .bottom-save-action,
  #customerForm.card.form-grid > h2.full{
    grid-column:1/-1!important;
  }
  #customerForm.card.form-grid > .followup-row{
    grid-template-columns:1fr!important;
  }
}

/* Müşteri kartı: iki simetrik sütun */
.customer-detail-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:18px;
  align-items:start;
  width:100%;
}

.customer-left-column,
.customer-right-column{
  display:flex;
  flex-direction:column;
  gap:18px;
  min-width:0;
}

.customer-detail-layout .card{
  width:100%;
  margin:0!important;
}

.compact-summary-card{
  min-height:0!important;
}

.travel-card,
.conversation-card,
.history-card{
  min-height:0!important;
}

/* Görüşme listesi büyüdükçe kart da doğal olarak aşağı doğru uzasın */
.compact-conversation-list,
.conversation-list{
  max-height:none!important;
  overflow:visible!important;
}

.compact-conversation-form{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

.conversation-note-field,
.conversation-add-action{
  grid-column:1/-1!important;
}

.history-card{
  margin-top:0!important;
}

.customer-card-actions{
  margin-top:0!important;
  padding-top:0!important;
  justify-content:flex-end!important;
}

@media(max-width:1050px){
  .customer-detail-layout{
    grid-template-columns:1fr;
  }
}

@media(max-width:700px){
  .compact-conversation-form{
    grid-template-columns:1fr!important;
  }
}

/* KAYDET BUTONU DÜZELTME */
#customerForm .bottom-save-action{
  grid-column:1/-1!important;
  display:flex!important;
  justify-content:flex-end!important;
  margin-top:6px!important;
  padding-top:0!important;
  visibility:visible!important;
  opacity:1!important;
}
#customerForm #saveBtn{
  display:inline-flex!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  cursor:pointer!important;
}
#customerForm #saveBtn:disabled{
  opacity:1!important;
  cursor:pointer!important;
}

#customerForm .bottom-save-action{
  grid-column:1/-1!important;
  display:flex!important;
  justify-content:flex-end!important;
  margin-top:6px!important;
  padding:0!important;
}
#customerForm #saveBtn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:130px!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  opacity:1!important;
  visibility:visible!important;
}

.phone-entry-two{
  grid-template-columns:1fr 1.5fr!important;
}
.phone-code-selector-wrap{
  min-width:0;
}
#phoneCountryCode{
  width:100%;
}
@media(max-width:900px){
  .phone-entry-two{
    grid-template-columns:1fr!important;
  }
}

.customer-card-actions{display:none!important}

.meta-modal{
  position:fixed;
  inset:0;
  z-index:99998;
  background:rgba(15,23,42,.38);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px;
}
.meta-modal.hidden{display:none!important}
.meta-modal-card{
  width:min(1120px,96vw);
  max-height:92vh;
  overflow:auto;
  background:#fff;
  border-radius:26px;
  padding:28px 30px 30px;
  box-shadow:0 24px 70px rgba(15,23,42,.22);
}
.meta-modal-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  margin-bottom:18px;
}
.meta-modal-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px 20px;
}
.meta-note-wide{grid-column:1/-1}
.meta-modal-grid textarea{
  width:100%;
  box-sizing:border-box;
  resize:vertical;
  min-height:110px;
}
.meta-modal-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:20px;
}
.meta-actions-cell{text-align:center;white-space:nowrap}
.meta-actions-cell .icon-btn{margin:0 3px}
.meta-status-pill{
  display:inline-flex;
  padding:5px 10px;
  border-radius:999px;
  background:#e8f0ff;
  color:#1657b8;
  font-size:12px;
  font-weight:700;
}
.meta-filters input{min-width:320px}
@media(max-width:760px){
  .meta-modal-grid{grid-template-columns:1fr}
  .meta-note-wide{grid-column:auto}
}

.crm-login-screen{
  position:fixed;inset:0;z-index:100000;background:#f2f5fb;
  display:grid;place-items:center
}
.crm-login-card{
  width:min(430px,92vw);background:#fff;padding:32px;border-radius:18px;
  box-shadow:0 12px 40px #0001
}
.crm-login-card img{display:block;max-width:220px;margin:0 auto 20px}
.crm-login-card input{width:100%;box-sizing:border-box;margin:7px 0 15px}
.crm-login-card button{width:100%}
.crm-login-msg{min-height:20px;color:#b91c1c;margin:0 0 10px}
.crm-logout-btn{
  position:fixed;right:16px;bottom:16px;z-index:9000;padding:10px 14px;
  background:#173b67;color:#fff;border:0;border-radius:9px;cursor:pointer
}
.user-password-actions{display:flex;gap:8px;align-items:center}
.user-password-actions input{min-width:140px}

.server-logout-btn{
  position:fixed;
  right:16px;
  bottom:16px;
  z-index:9000;
  padding:10px 14px;
  background:#173b67;
  color:#fff;
  text-decoration:none;
  border-radius:9px;
  font-weight:700
}