/* NutriAile - Theme Editor v2 (Dark Panel) */

/* ── PANEL ── */
.theme-editor{position:fixed;top:0;right:-420px;width:400px;bottom:0;display:flex;flex-direction:column;background:var(--bg-primary);border-left:1px solid var(--border-mid);box-shadow:-4px 0 32px rgba(0,0,0,.4);z-index:10000;transition:right .3s cubic-bezier(.4,0,.2,1)}
.theme-editor.open{right:0}

/* ── HEADER ── */
.te-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-light);background:var(--bg-secondary);flex-shrink:0;z-index:1}
.te-header h3{font-size:16px;font-weight:700;letter-spacing:-.3px;color:var(--text-primary)}
.te-close{width:30px;height:30px;border-radius:50%;border:1px solid var(--border-mid) !important;background:var(--bg-tertiary) !important;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;color:var(--text-secondary) !important;transition:all .15s}
.te-close:hover{background:var(--border-strong) !important;color:var(--text-primary) !important}

/* ── SEKMELER ── */
.te-tabs{display:flex;flex-wrap:wrap;gap:6px;padding:12px 16px;background:var(--bg-primary);border-bottom:1px solid var(--border-light);flex-shrink:0}
.te-tab{display:inline-flex;align-items:center;gap:4px;padding:6px 12px;border-radius:20px;border:1.5px solid var(--border-mid) !important;background:var(--bg-primary) !important;cursor:pointer;transition:all .18s;font-family:inherit;color:var(--text-secondary) !important;white-space:nowrap}
.te-tab:hover{border-color:var(--accent) !important;color:var(--accent) !important;background:var(--accent-dim) !important}
.te-tab.active{border-color:var(--accent) !important;color:var(--accent) !important;background:var(--accent-dim) !important;font-weight:600}
.te-tab-icon{font-size:13px;line-height:1}
.te-tab-label{font-size:11px;font-weight:500;line-height:1}

/* ── İÇERİK ── */
.te-body{flex:1 1 0;min-height:0;padding:14px 18px 100px 18px;overflow-y:auto;-webkit-overflow-scrolling:touch}
.te-group{margin-bottom:18px}
.te-group-title{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--accent);margin-bottom:10px;opacity:.8}
.te-group-desc{font-size:10px;color:var(--text-tertiary);margin:-6px 0 10px 0;font-style:italic}
.te-hint{font-size:9px;color:var(--text-tertiary);margin:-4px 0 6px 0;padding-left:2px;opacity:.7}

/* ── RENK SATIRI ── */
.te-row{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.te-row label{font-size:12px;font-weight:500;color:var(--text-primary);flex:1;min-width:0}
.te-row input[type="color"]{width:32px;height:32px;border:2px solid var(--border-mid);border-radius:8px;cursor:pointer;padding:2px;background:var(--bg-secondary)}
.te-hex-input{width:72px !important;font-size:11px !important;font-family:'Roboto Mono',monospace !important;padding:5px 8px !important;border:1px solid var(--border-mid) !important;border-radius:6px !important;background:var(--bg-secondary) !important;color:var(--text-primary) !important;text-transform:uppercase}
.te-text-wide{width:140px !important;font-size:11px !important;padding:5px 8px !important;border:1px solid var(--border-mid) !important;border-radius:6px !important;background:var(--bg-secondary) !important;color:var(--text-primary) !important}

/* ── COLOR-ALPHA SATIRI ── */
.te-ca-row{flex-wrap:nowrap}
.te-ca-row input[type="color"]{width:32px;height:32px;border:2px solid var(--border-mid);border-radius:8px;cursor:pointer;padding:2px;background:var(--bg-secondary);flex-shrink:0}
.te-alpha-slider{width:80px !important;flex-shrink:0}
.te-alpha-val{min-width:34px !important;font-size:10px !important}

/* ── SLIDER SATIRI ── */
.te-slider-row{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.te-slider-row label{font-size:12px;font-weight:500;color:var(--text-primary);flex:1;min-width:0}
.te-slider{-webkit-appearance:none;appearance:none;width:100px;height:6px;border-radius:3px;background:var(--border-mid);outline:none;cursor:pointer;flex-shrink:0;border:none !important}
.te-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--accent);cursor:pointer;border:2px solid var(--bg-primary);box-shadow:0 1px 4px rgba(0,0,0,.4);transition:background .15s}
.te-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent);cursor:pointer;border:2px solid var(--bg-primary);box-shadow:0 1px 4px rgba(0,0,0,.4);transition:background .15s}
.te-val{font-size:11px;font-weight:600;color:var(--accent);min-width:42px;text-align:right;font-family:'Roboto Mono',monospace}

/* ── SELECT SATIRI ── */
.te-select-row{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.te-select-row label{font-size:12px;font-weight:500;color:var(--text-primary);flex:1;min-width:0}
.te-select{padding:5px 8px;border:1px solid var(--border-mid) !important;border-radius:6px;background:var(--bg-secondary) !important;color:var(--text-primary) !important;font-size:11px;font-family:inherit;cursor:pointer;min-width:110px;max-width:140px}

/* ── PRESET GRID ── */
.te-preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.te-preset-btn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 10px;border-radius:12px;border:1.5px solid var(--border-mid) !important;background:var(--bg-secondary) !important;cursor:pointer;transition:all .2s;color:var(--text-primary) !important}
.te-preset-btn:hover{border-color:var(--accent) !important;transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.3)}
.te-preset-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;border:1px solid rgba(255,255,255,.08)}
.te-preset-name{font-size:12px;font-weight:600;color:var(--text-primary)}
.te-preset-dots{display:flex;gap:4px}
.te-preset-dots span{width:12px;height:12px;border-radius:50%;border:1px solid rgba(255,255,255,.1)}

/* ── AKSİYON BUTONLARI ── */
.te-actions-row{display:flex;gap:8px}
.te-bottom-actions{display:flex;gap:8px;margin-top:20px;padding-top:16px;border-top:1px solid var(--border-light)}
.te-btn{flex:1;padding:10px 12px;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid var(--border-mid) !important;background:var(--bg-secondary) !important;color:var(--text-primary) !important;font-family:inherit;transition:all .15s}
.te-btn:hover{background:var(--bg-tertiary) !important;border-color:var(--accent) !important}
.te-btn-danger{color:var(--danger-accent,#ef4444) !important;border-color:rgba(239,68,68,0.3) !important}
.te-btn-danger:hover{background:rgba(239,68,68,0.1) !important;border-color:var(--danger-accent,#ef4444) !important}
.te-btn-redo{color:#5b8def !important;border-color:rgba(91,141,239,0.3) !important}
.te-btn-redo:hover{background:rgba(91,141,239,0.1) !important;border-color:#5b8def !important}
.te-bottom-actions .te-btn{font-size:11px;padding:9px 8px}

/* ── OVERLAY ── */
.te-overlay{position:fixed;top:0;left:0;width:calc(100% - 400px);height:100%;background:rgba(0,0,0,.08);z-index:9999;display:none}
.te-overlay.open{display:block}
@media(max-width:480px){.te-overlay{width:0;display:none !important}}

/* ── MOBİL ── */
@media(max-width:480px){
  .theme-editor{width:100%;right:-100%}
  .te-slider{width:80px}
  .te-select{min-width:90px;max-width:110px}
  .te-preset-grid{grid-template-columns:1fr 1fr}
}

/* ── ÖZEL PRESET ── */
.te-custom-preset-wrap{position:relative;width:100%}
.te-custom-preset-wrap .te-preset-btn{width:100%;height:100%;padding:14px 10px;box-sizing:border-box}
.te-cp-del{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;background:var(--bg-tertiary);border:1px solid var(--border-mid) !important;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--text-secondary);cursor:pointer;opacity:0;transition:opacity .15s;z-index:5;padding:0}
.te-cp-rename{position:absolute;top:-6px;left:-6px;width:20px;height:20px;border-radius:50%;background:var(--bg-tertiary);border:1px solid var(--border-mid) !important;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--text-secondary);cursor:pointer;opacity:0;transition:opacity .15s;z-index:5;padding:0}
.te-custom-preset-wrap:hover .te-cp-del,.te-custom-preset-wrap:hover .te-cp-rename{opacity:1}
.te-cp-del:hover{background:rgba(239,68,68,0.15) !important;border-color:var(--danger-accent,#ef4444) !important;color:var(--danger-accent,#ef4444) !important}
.te-cp-rename:hover{background:rgba(45,212,168,0.12) !important;border-color:var(--accent) !important;color:var(--accent) !important}
.te-preset-date{font-size:9px;color:var(--text-tertiary);opacity:.6;margin-top:-2px}
.te-empty{font-size:11px;color:var(--text-tertiary);text-align:center;padding:12px 0;font-style:italic}
.te-save-row{display:flex;gap:8px;margin-top:10px}
.te-btn-save{flex:1;background:rgba(45,212,168,0.08) !important;border-color:var(--accent) !important;color:var(--accent) !important;font-weight:600}
.te-btn-save:hover{background:rgba(45,212,168,0.18) !important}
.te-btn-update{flex:1;background:rgba(91,141,239,0.08) !important;border-color:#5b8def !important;color:#5b8def !important;font-weight:600;font-size:11px !important}
.te-btn-update:hover{background:rgba(91,141,239,0.18) !important}

/* ¦¦ SAYFA YASLAMA (SOLA KAYDIRMA) ¦¦ */
body { transition: padding-right 0.3s cubic-bezier(.4,0,.2,1); }
body.te-open { padding-right: 400px; }
.bottom-nav { transition: right 0.3s cubic-bezier(.4,0,.2,1); }
body.te-open .bottom-nav { right: 400px; }
@media(max-width: 480px) { body.te-open { padding-right: 0; } body.te-open .bottom-nav { right: 0; } }