/* css */
body{margin:0;padding-bottom:var(--command-height);line-height:1.6;background:var(--primary-clr);transition:all .3s ease;color:var(--text-clr);min-height:100vh;text-transform: lowercase;transition: none !important;}
h1,h2,h3{font-weight:600;margin:0}
p{margin-bottom:1rem}
a{color:var(--text-clr);text-decoration:underline;cursor:pointer}
a:focus,a:hover{color:var(--text-clr)}
code{background-color:var(--secondary-clr);border-radius:3px;font-family: monospace, sans-serif;font-size:.95em;padding: 0 3px;white-space: pre-wrap;word-break: break-all;}
code span{font-family: monospace, sans-serif;}
button {text-transform: lowercase;}
ul{padding-left:1.5rem;margin-bottom:1rem}
li {word-break: break-all;}
blockquote{border-left:3px solid var(--border-clr);padding-left:1rem;color:var(--text-secondary-clr);margin-left:0;margin-right:0;margin-bottom:7px;font-style:italic}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--sidebar-width);overflow-y:auto;overflow-x:hidden;z-index:1000;display:flex;flex-direction:column;background-color:var(--secondary-clr)}
.sidebar.collapsed{width:var(--sidebar-collapsed-width)}
.sidebar-menu{flex-grow:1}
.menu-list {padding: 20px 10px;position: sticky;top: 0;z-index: 10;background: var(--secondary-clr);border-bottom: 1px solid var(--border-clr);}
.sidebar-item{display:flex;align-items:center;color:var(--text-clr);text-decoration:none;white-space:nowrap;border-radius: 9px;}
.sidebar-item:hover{background:var(--secondary-hover-clr)}
.sidebar-item-close{display:none;justify-self: end;align-items:center;padding:5px;color:var(--text-clr);text-decoration:none;white-space:nowrap;position:sticky;z-index:10;background:var(--primary-clr);text-align:center;cursor:pointer}
.sidebar-item-close:hover::before {background: linear-gradient(360deg, color(from var(--primary-clr) srgb r g b / 0), color(from var(--primary-clr) srgb r g b / 110) 20%);}
.command-bar{position:fixed;bottom:0;left:0;right:0;background:var(--primary-clr);padding:20px 0 20px 0;display:flex;align-items:center;flex-direction:column;z-index:100;max-width:var(--container-width);margin:0 auto}
.collapse-btn {border: none;color: var(--text-secondary-clr);justify-content: end !important;}
.sidebar-item-coll {display: flex;align-items: center;padding: 10px;color: var(--text-clr);text-decoration: none;white-space: nowrap;border-radius: 7px;}
.sidebar-item-coll:hover{background:var(--secondary-hover-clr)}
.prefix{background:transparent;white-space:nowrap;user-select:none;color:var(--placeholder);display:flex;align-items:center}
.command-input{width:100%;font-size:16px;padding: 5px 5px 5px 20px;border-radius:12px;background:var(--secondary-clr);color:var(--text-clr);outline:0;border:0;display: flex;justify-items: center;}
.command-input:focus{outline:0;background:var(--focus-clr)}
input[type=text]{flex:1;border:none;font-family: monospace, sans-serif;font-size: 16px;background:transparent;color:var(--text-clr);}
input[type=text]::placeholder{color:var(--placeholder)}
input[type=text]:focus{outline:2px solid var(--primary)}
.command-bar:before{content:"";position:absolute;top:-50px;bottom:0;inset-inline-start:0;width:100%;height:100px;pointer-events:none;z-index:-1;background:linear-gradient(180deg,color(from var(--primary-clr) srgb r g b / 0),color(from var(--primary-clr) srgb r g b / 100) 55%)}
.prompt-disclaim{text-align:center;color:var(--placeholder);font-size:14px;margin-top:15px;margin-bottom:0}
.main-content{max-width: var(--container-width);margin: 0 auto;padding: 80px 20px 100px 20px;}
.header{position:fixed;top:0;left:var(--sidebar-width);right:0;background: var(--primary-clr);display:flex;justify-content:space-between;align-items:center;flex-direction: column;z-index:1001;}
.header .header-top {width: 100%;}
.header .header-bottom {padding: 20px 20px;width: 100%;display: flex;justify-content: space-between;}
.sidebar.collapsed ~ .header {left:var(--sidebar-collapsed-width)}
.header .header-logo {display: flex;align-items: center;}
.header .header-logo a {font-family:monospace,sans-serif;text-decoration: none;color: var(--text-secondary-clr);}
.header-logo-text {font-size:22px}
.header .header-logo a:hover {color: var(--text-clr);}
.header-title {margin: 250px auto;width: fit-content;text-align: center;display: flex;flex-direction: column;justify-content: center;}
.header-title h1{font-size:38px;font-weight:700;line-height:1.1;width: 100%;background:linear-gradient(90deg,#2a7b9b 0,#57c785 50%,#eddd53 100%);background-clip:text;-webkit-background-clip:text;text-emphasis-color:transparent;-webkit-text-fill-color:transparent}
.header-title h2{font-size:20px;font-weight:500;line-height:1.1;color:var(--heading-secondary-clr)}
.dropdown{position:relative;z-index:1001;display: inline-flex;}
.dropdown-btn{background:var(--secondary-clr);border:none;border-radius:9px;cursor:pointer;display:flex;align-items:center;width:40px;height:40px;justify-content:center}
.dropdown-btn .icon{font-size:20px;font-weight:600;line-height:1;color: var(--text-secondary-clr);font-family: sans-serif;text-transform: uppercase;}
.dropdown-content{display:none;position:absolute;top:calc(100% + .5rem);right:0;background:var(--secondary-clr);min-width:200px;box-shadow:0 8px 16px rgba(0,0,0,.1);border:1px solid var(--border-clr);border-radius:15px;z-index:1002;padding:10px}
.dropdown.active .dropdown-content{display:block}
.dropdown-item{padding: 3px 0;display:block;color:var(--text-clr);text-decoration:none;display: flex;align-items: center;border-radius: 9px;}
.dropdown-item:hover{background:var(--secondary-hover-clr);color:var(--text-clr);}
.user-login-box{display: flex;align-items: center;gap:5px;padding:15px}
.username-dropdown-div {display: flex;flex-direction: column;border-bottom: 1px solid var(--border-clr);padding: 5px 10px 15px 10px;margin-bottom:10px}
#username-dropdown-name {font-weight: 700;display: flex;align-items: center;gap:7px} 
#username-dropdown-verify {display: flex;align-content: center;flex-wrap: wrap;}
.auth-verify-icon{background: var(--blue-transparent);border-radius: 999px;height: calc(var(--scale) * 22px)!important;width: calc(var(--scale) * 30px)!important;color: var(--blue);}
#username-dropdown-api {font-weight: 400;margin-top:7px;color: var(--placeholder);font-size: 13px;font-style: normal;text-transform: none;cursor: pointer;position: relative;} 
#username-dropdown-api:hover {color:var(--text-clr)}
#username-dropdown-api:hover::before{content:attr(data-text);position:absolute;background:var(--placeholder);color:var(--primary-clr);top:0;right:0;left:0;pointer-events:none;white-space:nowrap;z-index:10;padding:0 10px 0 35px;background:linear-gradient(90deg,color(from var(--blue) srgb r g b / 0),color(from var(--blue) srgb r g b / 110) 60%);text-align:right}
.menu-mobil-btn{background:var(--secondary-clr);border:none;border-radius:9px!important;cursor:pointer;display:flex;align-items:center;width:40px;height:40px;justify-content:center;margin-right:15px}
.color-red {color:var(--red)}
.endpoint-buttons {display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;background:var(--secondary-clr);color:var(--text-clr);padding: 6px 20px;border-top-left-radius:13px;border-top-right-radius:13px;min-height:52px;max-height:100px;margin-bottom:3px}
.endpoint-buttons h4 {font-size:15px;font-weight:500;text-transform: uppercase;color:var(--text-secondary-clr);font-family: sans-serif;}
.endpoint-buttons .sag-buttons {display:flex;flex-wrap:wrap;align-items:center;}
.endpoint-buttons .sag-buttons .icon {height: auto!important;}
.endpoint{background:var(--secondary-clr);color:var(--text-clr);padding:10px 10px 25px 20px;border-bottom-left-radius:13px; border-bottom-right-radius:13px; overflow-x:auto;position:relative;font-size:17px;line-height:1.4em;white-space:pre-wrap;word-break:break-word;font-family:monospace}
.gorBtn{border:none;border-radius:8px;color:var(--text-clr);font-weight:600;cursor:pointer;font-size:13px;transition:background-color .25s;user-select:none;z-index:10;height:35px;width: 35px;display: flex;}
.gorBtn:hover{background:var(--primary-clr);color:var(--bg)}
.apiBtn{border:none;border-radius:8px;color:var(--text-clr);font-weight:600;cursor:pointer;font-size:13px;transition:background-color .25s;user-select:none;z-index:10;height:35px;width: 35px;display: flex;}
.apiBtn:hover{background:var(--primary-clr);color:var(--bg)}
.fetchBtn{border:none;border-radius:8px;color:var(--text-clr);font-weight:600;cursor:pointer;font-size:13px;transition:background-color .25s;user-select:none;z-index:10;height:35px;width: 35px;display: flex;}
.fetchBtn:hover{background:var(--primary-clr);color:var(--bg)}
#cmdRun {cursor: pointer;border-radius: 9px;width: 40px!important;height: 40px!important;}
#cmdRun:hover {background-color: var(--btn-hover-clr);}
.cmdText {width: fit-content;margin: 20px 0;padding: 0;border-radius: 7px;font-weight: 600;font-size: 18px;word-break: break-all;}
.cmdText code {margin-right:5px;margin-left:5px;font-weight: 500;}
.output-block {margin-bottom: 1.5rem;padding-bottom: 1rem;}
#output-container {display: flex;flex-direction: column-reverse;}
#loginBtn {padding: 7px 13px;border-radius: 8px;border:1px solid var(--blue);background-color: var(--primary-clr);color:var(--blue);cursor:pointer;font-size: 16px;}
#loginBtn:hover {text-decoration: underline;}
#registerBtn {padding: 8px 14px;border-radius: 8px;border:1px solid var(--blue);background-color: var(--blue);color:var(--primary-clr);cursor:pointer;font-size: 16px;}
#registerBtn:hover {border:1px solid var(--blue-hover);background-color: var(--blue-hover);}
.wiki-text {margin-bottom:20px;}
#authButtons {gap: 10px;display: flex;}
#header-text {margin-top: 15px;text-transform: none;}
#header-text h3 {margin-top: 25px}
#header-text a {text-decoration: none;}
#header-text .hreflink {color: var(--blue);cursor: pointer;}
#header-text .hreflink:hover {text-decoration: underline;}
/* history*/
#history-cmd{padding:0 10px 100px 10px}
#history-section{max-width:var(--container-width);margin:1rem auto;padding:1rem}
#history-list{display:flex;flex-direction:column;gap:.7rem}
.history-group-title{font-size:13px;margin-top:1.5rem;margin-bottom:.3rem;color:var(--text-secondary-clr);padding:0 10px;user-select:none}
.history-item{display:flex;transition:background-color .3s ease;border-radius:9px;justify-content:space-between;position:relative}
.history-item:hover{background-color:var(--secondary-hover-clr)}
.history-cmd-link{flex:1;padding:7px 10px 7px 10px;white-space:nowrap;overflow:hidden;text-decoration: none;text-overflow:ellipsis;cursor:pointer;font-family:monospace,sans-serif;font-size:15px;color:var(--text-clr);user-select:text}
.popup-cmd-link{display:flex;opacity: 0;visibility: hidden;align-items:center;position:relative;justify-content:center;color:var(--placeholder);--scale:0;border:1px solid transparent;text-align:center;cursor:pointer;border-radius:calc(var(--scale) * 10px);align-items:center;z-index:1}
.history-item:hover .popup-cmd-link,.popup-cmd-link.show-popup {opacity: 1;visibility: visible;padding:8px 13px;cursor:pointer;--scale:0.85;}
.popup-menu{display:none;background:var(--primary-clr);border:1px solid var(--border-clr);border-radius:9px;padding:7px;flex-direction:column;box-shadow:0 8px 16px rgba(0,0,0,.1)}
.popup-menu-item{display:flex;align-items:center;padding:0;color:var(--text-clr);text-decoration:none;white-space:nowrap;border-radius: 7px;}
.popup-menu .delete {color:var(--red)}
.popup-menu-item:hover{background:var(--secondary-hover-clr)}
.popup-menu-item .text{line-height: 1;padding-right:10px}
.popup-menu-item .icon{height: 30px!important;width: 30px!important;}
.delete-btn,.mark-btn{border:none;border-radius:5px;padding:3px 8px;color:var(--text-clr);cursor:pointer;font-size:.85rem;transition:background-color .3s ease}
.mark-btn{background:var(--blue)}
.mark-btn:hover{background:var(--blue-hover)}
.delete-btn{background:var(--red)}
.delete-btn:hover{background:var(--red)}
.text-muted{font-size:13px;font-style:italic;color:var(--placeholder);padding:10px}
.floating-popup {display: flex;position: fixed;}
.json-highlight code {background: transparent;}
/* json color */
.json-key       { color: var(--json-key); }
.json-string    { color: var(--json-string); }
.json-number    { color: var(--json-number); }
.json-boolean   { color: var(--json-boolean); font-weight: 600; }
.json-null      { color: var(--json-null); font-style: italic; }
.json-brace     { color: var(--json-brace); }
.json-bracket   { color: var(--json-bracket); }
.json-colon     { color: var(--json-colon); }
.json-semicolon { color: var(--json-semicolon); }
.json-quote     { color: var(--json-quote); }
.json-equals    { color: var(--json-equals); }
.json-slash     { color: var(--json-slash); }
.json-amp       { color: var(--json-amp); }
.json-plus      { color: var(--json-plus); }
.json-hash      { color: var(--json-hash); }
/* alert bg */
.alert{position:fixed;display:flex;align-items:center;right: 20px;top: 90px;gap:10px;background:var(--primary);color:#fff;padding:10px 10px;border-radius: 7px;box-shadow:0 4px 15px rgba(0,0,0,.5);border: 1px solid rgba(255, 255, 255, .3);z-index:9999;line-height:1;max-width:320px;width:fit-content;opacity:0;pointer-events:none;transition:all .4s ease}
.alert div#alertIcon{border-radius: 7px;background: #ffffff60;padding: 6px;width: 40px;height: 40px;display: flex;justify-content: center;align-items: center;}
.alert div#alertMessage {padding:3px 10px 3px 3px;letter-spacing:.35px;font-size:16px;}
.alert{top:110px;right:20px;transform:translateY(-20px)}
.alert.show{opacity:1;transform:translateY(0);pointer-events:auto}
.bg-success {background-color: var(--green);}
.bg-danger {background-color: var(--red);}
.bg-warning {background-color: var(--orange);}
.bg-info {background-color: var(--blue);}
.bg-light {background-color: var(--heading-secondary-clr);color: var(--text-clr);}
.bg-dark {background-color: var(--text-clr);color: var(--primary-clr);}
.autocomplete-items{position:fixed;bottom:115px;left:0;right:0;max-width:calc(var(--container-width) - 40px);margin:0 auto;background: var(--secondary-clr);border:1px solid var(--border-clr);max-height:250px;overflow-y:auto;z-index:9999;display:none;box-shadow:0 -2px 10px rgba(0,0,0,.2)}
.autocomplete-items div{padding:7px 12px;cursor:pointer;display:flex;justify-content:space-between;transition:background .2s ease}
.autocomplete-items div.active,.autocomplete-items div:hover{background:var(--border-clr)}
.autocomplete-items .cmd-desc{font-size:12px;color:var(--placeholder);margin-left:8px}
.result-il-baslik {margin-top: 30px;}
.il-wiki{display:flex;flex-direction:column;gap:20px;margin-bottom:10px}
.il-wiki .result{background-color:var(--slate);border-radius:10px;padding-bottom:25px;margin-bottom:20px;min-height:80px;position:relative;font-family:sans-serif;font-size:17px;color:var(--dark);transition:background-color .3s ease}
.result-il-metin{line-height:1.7;color:var(--dark);white-space:pre-wrap;word-wrap:break-word}
.result-il-metin img{max-width:100%;max-height:300px;object-fit:contain;float: left;padding-right: 15px;}
.result.loading{animation:pulse-bg 1.5s ease-in-out infinite}
.result-map {z-index: 0;width: 100%;height: var(--map-height);border-radius: 12px;overflow: hidden;margin: 1rem 0;border: 0;}
.dark-mode .result-map {filter: grayscale(0.4) brightness(0.8);}
.result-map .leaflet-bottom {bottom:100%}
@keyframes pulse-bg{0%{background-color:#f3f3f3}50%{background-color:#e0e0e0}100%{background-color:#f3f3f3}}
.content,.hover\:content {position: relative;}
.content::before {content: "";position: absolute;left: -20px;font-weight: 700;color: var(--primary);transition: opacity 0.2s ease;content: attr(data-content);opacity: 1;margin-right: 3px;}
.hover\:content::before {content: "";position: absolute;left: -20px;font-weight: 700;color: var(--primary);transition: opacity 0.2s ease;opacity: 0;}
.hover\:content:hover::before {content: attr(data-content);opacity: 1;margin-right: 3px;}
.capitalize{text-transform: capitalize;}
.uppercase{text-transform: uppercase;}
.lowercase{text-transform: lowercase;}
/* email verify */
.verify-warning{font-family:monospace,sans-serif;background:var(--border-clr);color:var(--text-clr);display:flex;align-items:center;justify-content:space-between;flex-flow:wrap;width:100%;animation:fadeIn .3s ease-in-out;gap:10px}
.verify-warning .verify-warning-text{display:flex;align-items:center;color:var(--red);padding-left:23px;}
.verify-warning .icon{color:var(--red)}
.resend-btn{padding:9px 12px;border:none;background-color:var(--red-transparent);color:var(--red);cursor:pointer;font-size:14px;font-family:monospace,sans-serif;transition:all .2s ease;white-space:nowrap}
.resend-btn:hover{background-color:var(--red-hover);color:var(--primary-clr)}
.resend-btn:disabled{opacity:.7;cursor:not-allowed}
.mainContentVerify {padding-top: 100px;}
@keyframes fadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@media (min-width:768px){
  .sidebar-item-close{display:none!important;}
}
@media (max-width:768px){
  .sidebar{left:0;top:0;bottom:0;height:100%;width:70%;transform:translateY(100%);z-index: 1003;}
  body.collapsed::before {content: "";position: fixed;inset: 0;left: 65%;background: linear-gradient(270deg, color(from var(--text-clr) srgb r g b / 0), color(from var(--text-clr) srgb r g b / 100) 100%);z-index: 1002;pointer-events: none;opacity: 1;transition: opacity 0.3s ease;}  
  .sidebar.visible{transform:translateY(0)}
  .sidebar-item-close {display: flex;}
  .header{left:0 !important;padding: 0;}
  .mobile-menu-btn{display:block;position:fixed;top:1rem;left:1rem;z-index:1001;background:var(--secondary-clr);border:none;padding:.5rem;border-radius:4px;cursor:pointer}
  .dropdown-content{position:fixed;bottom:auto;top:75px;right:0px;left:0px;border-top:1px solid var(--border-clr);box-shadow:0 -8px 16px rgba(0,0,0,.1);border-radius:0;}
  .dropdown-content:before {content: "";position: absolute;top: 100%;bottom: 0;inset-inline-start: 0;width: 100%;height: 100vh;pointer-events: none;z-index: -1;background: linear-gradient(0deg, color(from var(--text-clr) srgb r g b / 0), color(from var(--text-clr) srgb r g b / 100) 100%);}
  .dropdown-btn{bottom:4.5rem;right:1rem;z-index:1003;top:1rem}
  .command-bar {padding:0 10px}
  .header-title {margin: 0 0 20px 0;width: 100%;height: 70vh;}
  .header-title h1 {font-size: 28px;}
  .header-title h2 {font-size: 18px;}
  .login-content{padding:1.5rem;margin:1rem;box-shadow:none}
  .back-button{top:1rem;left:1rem}
  .alert{bottom:0px;left:50%;top:auto;transform:translate(-50%,0px);width: 100%;font-size:18px;border-radius: 0px;max-width: 100%;}
  .alert.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
  .alert div#alertIcon {margin-left:10px;}
  #history-cmd {display: block!important;}
  .resend-btn {width: 100%;}
  .mainContentVerify {padding-top: 200px;}
  .menu-list{padding-top:37px}
  .history-item .popup-cmd-link {opacity: 1;visibility: visible;padding:8px 13px;cursor:pointer;--scale:0.85;}
  .json-highlight {word-break: break-all;white-space: pre-line;}
}
.sidebar.collapsed .text{display:none}
.sidebar.collapsed .sidebar-item{justify-content:center}
.sidebar.collapsed .icon{margin-right:0}
.hidden {display: none;}