/* TALKCHAT_R19C12R9R15R3_PROFILE_EDIT_DARK_CONTRAST
   Dark-mode contrast fix for "Profilimi Düzenle" / #accountPanel.
   The legacy profile CSS is light-only:
   .account-row background:white; .account-row b color:#17243b; inputs background:white.
   In dark mode those values become unreadable on the full-height dark drawer.
   This layer fixes only dark-mode account/profile editor visuals.
*/

@media (min-width:768px){

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel{
    background:#151f2b!important;
    color:#e8eef5!important;
    scrollbar-color:#41556b #151f2b;
  }

  /* Main profile edit rows */
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-details{
    background:#151f2b!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-row{
    background:#151f2b!important;
    color:#8fa5ba!important;
    border-bottom-color:#2b3948!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel button.account-row{
    cursor:pointer!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel button.account-row:hover,
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel button.account-row:focus-visible{
    background:#1b2937!important;
    outline:0!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-row b{
    color:#eef4fa!important;
    font-weight:650!important;
    opacity:1!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-row small{
    color:#9fb0c2!important;
    opacity:1!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-row > .material-symbols-outlined,
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-row .sym{
    color:#6f93b7!important;
    opacity:1!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-row > .material-symbols-outlined:last-child,
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-row > .sym:last-child{
    color:#7890a7!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel button.account-row:hover b,
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel button.account-row:focus-visible b{
    color:#ffffff!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel button.account-row:hover > .material-symbols-outlined,
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel button.account-row:focus-visible > .material-symbols-outlined{
    color:#65baff!important;
  }

  /* Field editor after clicking Doğum Tarihi / Ruh Hali / Meslek etc. */
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-editor{
    color:#e8eef5!important;
    background:#151f2b!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-editor > button:first-child{
    background:transparent!important;
    color:#e8eef5!important;
    font-weight:700!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-editor > button:first-child .material-symbols-outlined,
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-editor > button:first-child .sym{
    color:#7fb4df!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-editor label{
    color:#a9b8c7!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-editor input,
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-editor select{
    background:#111a24!important;
    border-color:#344556!important;
    color:#edf3f8!important;
    caret-color:#edf3f8!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-editor input::placeholder{
    color:#718297!important;
    opacity:1!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-editor select option{
    background:#111a24!important;
    color:#edf3f8!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-editor input:focus,
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-editor select:focus{
    border-color:#3b91c9!important;
    box-shadow:0 0 0 3px rgba(59,145,201,.13)!important;
    outline:0!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .mood-suggestions button{
    background:#1c2a38!important;
    color:#c9d5e0!important;
    border:1px solid #304052!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .mood-suggestions button:hover{
    background:#233649!important;
    color:#ffffff!important;
    border-color:#3c5c78!important;
  }

  /* The account module can also render privacy/security/session panes.
     Keep them readable if reached from the same editor. */
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-tabs{
    background:#111a24!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-tabs button{
    background:#172330!important;
    border-color:#2f4052!important;
    color:#9eafc0!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-tabs button.selected{
    background:#203a51!important;
    border-color:#315d7e!important;
    color:#69bdff!important;
    box-shadow:none!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .privacy-row{
    color:#d7e0e9!important;
    border-bottom-color:#2b3948!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .privacy-row .material-symbols-outlined,
  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .privacy-row .sym{
    color:#7697b8!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .privacy-row select{
    background:#111a24!important;
    border-color:#344556!important;
    color:#e7eef5!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .account-security{
    color:#d7e0e9!important;
  }

  html[data-theme="dark"] #featureLayer .profile-popup #accountPanel .latest-session{
    color:#45d49a!important;
    background:rgba(16,185,129,.13)!important;
  }

  /* Avatar helper text */
  html[data-theme="dark"] #featureLayer .profile-popup #avatarEditor p{
    color:#9fb0c2!important;
  }
}

/* Mobile behavior/style stays untouched. */
