/* ═══════════════════════════════════════════════════════
   MarketLens — app.css
   Tüm sayfalarda ortak stiller
   includes/sidebar.css'den sonra yüklenir
═══════════════════════════════════════════════════════ */

/* ── RESET & BASE ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Outfit', sans-serif; background: var(--gray-100); color: var(--gray-900); font-size: 14px; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--gray-200); border-radius: 4px; }

/* ── LAYOUT: APP SHELL (sidebar + main) ── */
.app-shell { display: flex; height: 100vh; overflow: hidden; }
.main { flex: 1; display: flex; flex-direction: column; overflow: hidden; min-width: 0; }

/* ── TOPBAR ── */
.topbar {
  height: var(--header-h); flex-shrink: 0;
  background: #fff; border-bottom: 1px solid var(--gray-200);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 24px; gap: 16px;
}
.topbar-left  { display: flex; align-items: center; gap: 12px; }
.topbar-right { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.page-title   { font-size: 15px; font-weight: 600; color: var(--gray-900); }

/* Live badge */
.live-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 500; background: var(--success-50); color: var(--success-700); padding: 3px 10px; border-radius: 20px; border: 1px solid var(--success-100); }
.live-dot   { width: 6px; height: 6px; border-radius: 50%; background: var(--success-500); animation: pls 2s ease infinite; }
@keyframes pls { 0%,100%{opacity:1} 50%{opacity:.4} }

/* ── BREADCRUMB ── */
.breadcrumb { display: flex; align-items: center; gap: 4px; }
.breadcrumb a { font-size: 13px; font-weight: 500; color: var(--gray-500); text-decoration: none; transition: color .15s; }
.breadcrumb a:hover { color: var(--gray-900); }
.breadcrumb .sep { display: flex; align-items: center; color: var(--gray-300); }
.breadcrumb .sep svg { width: 14px; height: 14px; }
.breadcrumb .current { font-size: 13px; font-weight: 600; color: var(--gray-900); }

/* ── CONTENT AREA ── */
.content { flex: 1; overflow-y: auto; padding: 24px; padding-bottom: 40px; }

/* ── BUTTONS ── */
.btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px; border-radius: var(--radius-sm);
  font-size: 13px; font-weight: 500; cursor: pointer;
  font-family: 'Outfit', sans-serif; border: none;
  transition: all .15s; text-decoration: none; white-space: nowrap;
}
.btn svg { width: 15px; height: 15px; flex-shrink: 0; }
.btn-primary   { background: var(--brand-500); color: #fff; }
.btn-primary:hover { background: var(--brand-600); }
.btn-secondary { background: #fff; color: var(--gray-700); border: 1px solid var(--gray-200); }
.btn-secondary:hover { background: var(--gray-50); }
.btn-danger    { background: var(--error-50); color: var(--error-600); border: 1px solid var(--error-100); }
.btn-danger:hover { background: var(--error-100); }
.btn-ghost     { background: transparent; color: var(--gray-600); border: 1px solid var(--gray-200); }
.btn-ghost:hover { background: var(--gray-50); }
.btn-sm { padding: 6px 10px; font-size: 12px; }
.btn-sm svg { width: 13px; height: 13px; }

/* Legacy tb-btn alias */
.tb-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: var(--radius-sm); font-size: 13px; font-weight: 500; cursor: pointer; border: 1px solid var(--gray-200); background: #fff; color: var(--gray-700); font-family: 'Outfit', sans-serif; transition: all .15s; white-space: nowrap; }
.tb-btn:hover { background: var(--gray-50); }
.tb-btn.primary { background: var(--brand-500); color: #fff; border-color: var(--brand-500); }
.tb-btn.primary:hover { background: var(--brand-600); }
.tb-btn.danger  { border-color: var(--error-100); color: var(--error-600); }
.tb-btn.danger:hover { background: var(--error-50); }
.btn-icon { width: 15px; height: 15px; display: flex; align-items: center; flex-shrink: 0; }
.btn-icon svg { width: 15px; height: 15px; fill: currentColor; }
.h-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: var(--radius-sm); font-size: 13px; font-weight: 500; cursor: pointer; border: 1px solid var(--gray-200); background: #fff; color: var(--gray-700); font-family: 'Outfit', sans-serif; transition: all .15s; white-space: nowrap; }
.h-btn:hover { background: var(--gray-50); border-color: var(--gray-300); }
.h-btn.primary { background: var(--brand-500); color: #fff; border-color: var(--brand-500); }
.h-btn.primary:hover { background: var(--brand-600); border-color: var(--brand-600); }
.h-btn-icon { width: 15px; height: 15px; display: flex; align-items: center; }
.h-btn-icon svg { width: 15px; height: 15px; fill: currentColor; color: var(--gray-500); }
.h-btn.primary .h-btn-icon svg { color: #fff; }

/* ── SEARCH ── */
.search-wrap  { position: relative; display: flex; align-items: center; }
.search-icon  { position: absolute; left: 11px; color: var(--gray-400); width: 16px; height: 16px; pointer-events: none; }
.search-icon svg { width: 16px; height: 16px; fill: currentColor; }
.search-input { background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius-sm); padding: 8px 12px 8px 34px; font-size: 13px; color: var(--gray-700); font-family: 'Outfit', sans-serif; outline: none; width: 220px; transition: border-color .15s, box-shadow .15s; }
.search-input:focus { border-color: var(--brand-400); background: #fff; box-shadow: 0 0 0 4px rgba(70,95,255,.12); }
.search-input::placeholder { color: var(--gray-400); }

/* ── PILLS / FILTERS ── */
.filter-bar { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--gray-100); }
.pill { font-size: 12px; font-weight: 500; padding: 5px 12px; border-radius: 20px; border: 1px solid var(--gray-200); background: transparent; color: var(--gray-600); cursor: pointer; font-family: 'Outfit', sans-serif; transition: all .15s; white-space: nowrap; flex-shrink: 0; }
.pill:hover { border-color: var(--gray-400); color: var(--gray-800); }
.pill.on { background: var(--gray-900); color: #fff; border-color: var(--gray-900); }
.filter-sep { width: 1px; height: 20px; background: var(--gray-200); flex-shrink: 0; margin: 0 2px; }

/* ── CARDS ── */
.card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; display: flex; flex-direction: column; }
.card-head { padding: 16px 20px; border-bottom: 1px solid var(--gray-100); display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; }
.card-title { font-size: 14px; font-weight: 600; color: var(--gray-900); }
.card-sub   { font-size: 12px; color: var(--gray-400); margin-top: 2px; }
.card-actions { display: flex; align-items: center; gap: 8px; }
.card-body  { padding: 20px; }

/* Metric cards */
.metrics-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.metric-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 20px; box-shadow: var(--shadow-sm); }
.metric-top  { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.metric-icon { width: 40px; height: 40px; border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.metric-icon svg { width: 20px; height: 20px; fill: currentColor; }
.icon-blue   { background: var(--brand-50);   color: var(--brand-500); }
.icon-green  { background: var(--success-50);  color: var(--success-600); }
.icon-orange { background: var(--orange-50);   color: var(--orange-500); }
.icon-purple { background: #f4f3ff; color: #7a5af8; }
.metric-trend { font-size: 11px; font-weight: 500; padding: 2px 8px; border-radius: 20px; }
.trend-up      { background: var(--success-50); color: var(--success-700); }
.trend-neutral { background: var(--gray-100); color: var(--gray-500); }
.metric-value  { font-size: 28px; font-weight: 700; color: var(--gray-900); letter-spacing: -.02em; margin-bottom: 4px; }
.metric-label  { font-size: 13px; color: var(--gray-500); }

/* Stat cards (favourites, members) */
.stat-card  { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius-sm); padding: 16px 20px; box-shadow: var(--shadow-sm); }
.stat-label { font-size: 11px; color: var(--gray-400); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 6px; }
.stat-value { font-size: 22px; font-weight: 700; color: var(--gray-900); line-height: 1; }
.stat-sub   { font-size: 11px; color: var(--gray-500); margin-top: 4px; }

/* Section cards (profile) */
.section-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); }
.section-head { padding: 16px 20px; border-bottom: 1px solid var(--gray-100); display: flex; align-items: center; justify-content: space-between; }
.section-title { font-size: 13px; font-weight: 600; color: var(--gray-900); }
.section-body  { padding: 18px 20px; }
.edit-link { font-size: 11px; color: var(--brand-500); cursor: pointer; text-decoration: none; transition: opacity .15s; }
.edit-link:hover { opacity: .7; }

/* ── TABLE ── */
table { width: 100%; border-collapse: collapse; }
thead th { padding: 10px 16px; text-align: left; font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--gray-400); background: var(--gray-50); border-bottom: 1px solid var(--gray-200); position: sticky; top: 0; z-index: 1; white-space: nowrap; cursor: default; user-select: none; }
thead th[data-sort] { cursor: pointer; }
thead th[data-sort]:hover { color: var(--gray-700); background: var(--gray-100); }
tbody tr { border-bottom: 1px solid var(--gray-100); transition: background .1s; }
tbody tr:last-child { border-bottom: none; }
tbody tr:hover { background: var(--gray-50); }
tbody tr.selected { background: var(--brand-25); }
tbody td { padding: 12px 16px; font-size: 13px; color: var(--gray-700); vertical-align: middle; }
.table-wrap { overflow-y: auto; overflow-x: auto; flex: 1; min-height: 0; }
.td-rank    { font-size: 12px; font-weight: 600; color: var(--gray-400); }
.td-name    { font-size: 13px; color: var(--gray-900); }
.td-name a  { color: var(--gray-900); text-decoration: none; }
.td-name a:hover { color: var(--brand-500); }
.td-price   { font-weight: 600; color: var(--gray-900); }
.td-stars   { color: #c8922a; font-weight: 500; }
.td-reviews { color: var(--gray-500); }
.sort-arrow, .sa { font-size: 11px; transition: opacity .15s; }

/* ── BADGES ── */
.opp-badge    { display: inline-block; font-size: 11px; padding: 3px 8px; border-radius: 20px; font-weight: 600; border: 1px solid transparent; white-space: nowrap; }
.opp-high     { background: var(--success-50);  color: var(--success-700); border-color: var(--success-100); }
.opp-mid      { background: var(--warning-50);  color: var(--warning-700); border-color: var(--warning-100); }
.opp-low      { background: var(--gray-100);    color: var(--gray-500);    border-color: var(--gray-200); }
.opp-pl-high  { background: var(--brand-50);    color: var(--brand-600);   border-color: var(--brand-100); }
.opp-ws-high  { background: var(--success-50);  color: var(--success-700); border-color: var(--success-100); }
.opp-ds-high  { background: var(--orange-50);   color: var(--orange-700);  border-color: var(--orange-100); }
.opp-pl-mid   { background: var(--brand-25);    color: var(--brand-500);   border-color: var(--brand-50); }
.opp-ws-mid   { background: var(--success-50);  color: var(--success-600); border-color: var(--success-100); }
.opp-ds-mid   { background: var(--warning-50);  color: var(--warning-700); border-color: var(--warning-100); }

.badge-count { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--error-600); background: var(--error-50); border: 1px solid var(--error-100); padding: 4px 10px; border-radius: 20px; }
.badge-count svg { width: 13px; height: 13px; flex-shrink: 0; }

/* ── CREDIT PILL ── */
.credit-pill { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--orange-50); border: 1px solid var(--orange-100); border-radius: 20px; font-size: 12px; font-weight: 600; color: var(--orange-700); }
.credit-dot  { width: 6px; height: 6px; border-radius: 50%; background: var(--orange-500); animation: pls 2s ease infinite; }

/* ── FAVOURITE BUTTON ── */
.fav-btn { width: 30px; height: 30px; border-radius: var(--radius-xs); background: transparent; border: 1px solid var(--gray-200); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all .15s; }
.fav-btn:hover, .fav-btn.active { background: var(--error-50); border-color: var(--error-100); }
.heart { color: var(--gray-300); font-size: 14px; transition: color .15s, transform .2s; }
.fav-btn.active .heart { color: var(--error-500); }
.fav-btn:hover .heart { color: var(--error-500); transform: scale(1.15); }

/* ── AI PANEL ── */
.ai-panel { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); box-shadow: var(--shadow-sm); display: flex; flex-direction: column; min-height: 460px; overflow: hidden; }
.ai-head  { padding: 14px 16px; border-bottom: 1px solid var(--gray-100); display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; }
.ai-head-left { display: flex; align-items: center; gap: 8px; }
.ai-indicator { width: 7px; height: 7px; border-radius: 50%; background: var(--success-500); animation: pls 2.5s ease infinite; }
.ai-title { font-size: 13px; font-weight: 600; color: var(--gray-900); }
.ai-badge { font-size: 10px; background: var(--warning-50); color: var(--warning-700); padding: 2px 7px; border-radius: 8px; font-weight: 600; border: 1px solid var(--warning-100); }
.ai-messages { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 12px; min-height: 260px; }
.ai-msg  { display: flex; gap: 8px; align-items: flex-start; }
.ai-msg.user { flex-direction: row-reverse; }
.msg-avatar { width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 700; margin-top: 2px; }
.msg-avatar.ai   { background: var(--gray-900); color: #fff; }
.msg-avatar.user { background: var(--brand-500); color: #fff; }
.msg-bubble { max-width: 85%; padding: 9px 12px; border-radius: 12px; font-size: 13px; line-height: 1.6; }
.msg-bubble.ai   { background: var(--gray-50); border: 1px solid var(--gray-200); border-top-left-radius: 3px; color: var(--gray-800); }
.msg-bubble.user { background: var(--brand-500); color: #fff; border-bottom-right-radius: 3px; }
.ai-input-row { padding: 10px 14px; border-top: 1px solid var(--gray-100); display: flex; gap: 8px; flex-shrink: 0; }
.ai-input { flex: 1; border: 1px solid var(--gray-200); border-radius: var(--radius-sm); padding: 8px 12px; font-size: 13px; color: var(--gray-900); font-family: 'Outfit', sans-serif; outline: none; background: var(--gray-50); transition: border-color .15s; }
.ai-input:focus { border-color: var(--brand-400); background: #fff; }
.ai-send { width: 36px; height: 36px; border-radius: var(--radius-sm); background: var(--brand-500); color: #fff; border: none; cursor: pointer; font-size: 14px; display: flex; align-items: center; justify-content: center; transition: background .15s; flex-shrink: 0; }
.ai-send:hover { background: var(--brand-600); }
.ai-send:disabled { opacity: .4; cursor: not-allowed; }
.prod-detail { background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius-sm); padding: 10px 14px; margin: 0 14px 8px; display: none; }
.prod-detail.show { display: block; }
.prod-detail-name { font-size: 12px; font-weight: 600; color: var(--brand-500); margin-bottom: 8px; }
.prod-detail-row  { display: flex; justify-content: space-between; margin-bottom: 3px; }
.prod-detail-key  { font-size: 11px; color: var(--gray-500); }
.prod-detail-val  { font-size: 11px; font-weight: 600; color: var(--gray-900); }

/* Typing dots */
.typing-dots { display: flex; gap: 3px; align-items: center; padding: 2px; }
.typing-dots span { width: 5px; height: 5px; border-radius: 50%; background: var(--gray-400); animation: bounce-dot .9s infinite; }
.typing-dots span:nth-child(2) { animation-delay: .15s; }
.typing-dots span:nth-child(3) { animation-delay: .3s; }
@keyframes bounce-dot { 0%,80%,100%{transform:translateY(0);opacity:.4} 40%{transform:translateY(-4px);opacity:1} }

/* ── CHART CARD ── */
.chart-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; }
.chart-head { padding: 14px 16px; border-bottom: 1px solid var(--gray-100); }
.chart-body { padding: 14px 16px; }
.qstat      { display: flex; justify-content: space-between; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--gray-100); }
.qstat:last-child { border-bottom: none; }
.qstat-label { font-size: 12px; color: var(--gray-500); }
.qstat-val   { font-size: 12px; font-weight: 600; color: var(--gray-900); }

/* ── MODAL ── */
.modal-overlay { position: fixed; inset: 0; background: rgba(16,24,40,.5); z-index: 200; display: none; align-items: center; justify-content: center; backdrop-filter: blur(2px); }
.modal-overlay.show { display: flex; }
.modal       { background: #fff; border-radius: var(--radius); padding: 28px; width: 400px; max-width: calc(100vw - 32px); box-shadow: var(--shadow-lg); }
.modal-icon  { font-size: 32px; margin-bottom: 14px; }
.modal-title { font-size: 16px; font-weight: 700; color: var(--gray-900); margin-bottom: 8px; }
.modal-sub   { font-size: 13px; color: var(--gray-500); line-height: 1.6; margin-bottom: 22px; }
.modal-btns  { display: flex; gap: 10px; }
.modal-btn   { flex: 1; padding: 10px; border-radius: var(--radius-sm); font-size: 13px; font-weight: 600; cursor: pointer; font-family: 'Outfit', sans-serif; border: none; transition: all .15s; }
.modal-cancel  { background: var(--gray-100); color: var(--gray-700); }
.modal-cancel:hover { background: var(--gray-200); }
.modal-confirm { background: var(--error-500); color: #fff; }
.modal-confirm:hover { background: var(--error-600); }

/* ── TOAST ── */
.toast { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%) translateY(12px); background: var(--gray-900); color: #fff; padding: 10px 20px; border-radius: var(--radius-sm); font-size: 13px; font-weight: 500; opacity: 0; transition: all .25s; pointer-events: none; white-space: nowrap; z-index: 999; box-shadow: var(--shadow-lg); }
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ── SPINNER ── */
.spinner { width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--gray-200); border-top-color: var(--brand-500); animation: spin .7s linear infinite; display: inline-block; }
.loading-state { display: flex; align-items: center; justify-content: center; padding: 80px; gap: 12px; color: var(--gray-400); font-size: 13px; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ── EMPTY STATE ── */
.empty-state { text-align: center; padding: 80px 24px; }
.empty-icon  { font-size: 48px; margin-bottom: 16px; }
.empty-title { font-size: 20px; font-weight: 700; color: var(--gray-900); margin-bottom: 8px; }
.empty-sub   { font-size: 14px; color: var(--gray-500); margin-bottom: 24px; line-height: 1.6; }

/* ── FORM ELEMENTS ── */
.field { display: flex; flex-direction: column; gap: 6px; }
.field label { font-size: 13px; font-weight: 500; color: var(--gray-700); }
.input {
  width: 100%; padding: 10px 12px; border: 1px solid var(--gray-200);
  border-radius: var(--radius-sm); font-size: 14px; color: var(--gray-900);
  font-family: 'Outfit', sans-serif; outline: none; background: #fff;
  transition: border-color .15s, box-shadow .15s;
}
.input:focus { border-color: var(--brand-400); box-shadow: 0 0 0 4px rgba(70,95,255,.12); }
.input::placeholder { color: var(--gray-400); }
.input.error { border-color: var(--error-300); }
.input.error:focus { box-shadow: 0 0 0 4px rgba(240,68,56,.12); }
.select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2398a2b3' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; padding-right: 32px; }

/* ── ALERTS ── */
.alert { display: none; padding: 10px 14px; border-radius: var(--radius-sm); font-size: 13px; margin-bottom: 12px; border: 1px solid transparent; }
.alert.show { display: block; }
.alert.error   { background: var(--error-50);   color: var(--error-700);   border-color: var(--error-100); }
.alert.success { background: var(--success-50); color: var(--success-700); border-color: var(--success-100); }
.alert.info    { background: var(--brand-50);   color: var(--brand-700);   border-color: var(--brand-100); }
.alert.warning { background: var(--warning-50); color: var(--warning-700); border-color: var(--warning-100); }

/* ── RESPONSIVE ── */
@media (max-width: 900px) {
  .app-shell { flex-direction: column; height: auto; overflow: auto; }
  .main { padding-top: 56px; min-height: 100vh; overflow-y: auto; }
  .topbar { height: auto; min-height: 56px; padding: 10px 16px; flex-wrap: wrap; }
  .content { padding: 14px; padding-bottom: 32px; }
  .metrics-row { grid-template-columns: 1fr 1fr; gap: 10px; }
  .metric-value { font-size: 22px; }
  .search-input { width: 100%; }
  .search-wrap  { flex: 1; }
  .credit-pill  { display: none; }
}
@media (max-width: 640px) {
  .metrics-row { grid-template-columns: 1fr; }
  .filter-bar  { flex-wrap: nowrap; }
  .modal { padding: 20px; }
}

/* ═══════════════════════════════════════
   PRODUCT PAGE
═══════════════════════════════════════ */
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* Breadcrumb */
.bc-link{color:var(--gray-400);text-decoration:none;transition:color .15s;font-weight:500;}
.bc-link:hover{color:var(--brand-500);}
.bc-sep{color:var(--gray-300);margin:0 4px;}
.bc-current{color:var(--gray-700);font-weight:600;}
.header-actions{display:flex;align-items:center;gap:8px;}

/* Product top */
.product-top{display:grid;grid-template-columns:auto 1fr;gap:24px;background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow-sm);animation:fadeIn .3s ease;}
.product-img-wrap{width:200px;height:200px;border-radius:12px;background:var(--gray-50);border:1px solid var(--gray-200);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;}
.product-img-wrap img{width:100%;height:100%;object-fit:contain;padding:8px;}
.product-img-placeholder{font-size:48px;color:var(--gray-300);}
.product-meta{display:flex;flex-direction:column;gap:12px;}
.product-badges{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.product-title{font-size:20px;font-weight:700;color:var(--gray-900);line-height:1.4;letter-spacing:-.02em;}
.product-asin{font-size:12px;color:var(--gray-400);}
.product-stats{display:flex;align-items:center;gap:20px;flex-wrap:wrap;}
.stat-item{display:flex;align-items:center;gap:6px;}
.stat-icon{width:16px;height:16px;display:flex;align-items:center;}
.stat-icon svg{width:16px;height:16px;fill:currentColor;}
.stat-val{font-size:14px;font-weight:600;color:var(--gray-700);}
.stat-label{font-size:12px;color:var(--gray-400);}
.stat-sep{width:1px;height:20px;background:var(--gray-200);}

/* Product badges */
.badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:4px 12px;border-radius:20px;border:1px solid transparent;}
.badge-rank{background:var(--gray-100);color:var(--gray-600);border-color:var(--gray-200);}
.badge-brand{background:var(--error-50);color:var(--error-600);border-color:var(--error-100);}
.badge-pl{background:var(--brand-50);color:var(--brand-600);border-color:var(--brand-100);}
.badge-ws{background:var(--success-50);color:var(--success-700);border-color:var(--success-100);}
.badge-ds{background:var(--orange-50);color:var(--orange-700);border-color:var(--orange-100);}
.badge-opp-high{background:var(--success-50);color:var(--success-700);border-color:var(--success-100);}
.badge-opp-mid{background:var(--warning-50);color:var(--warning-700);border-color:var(--warning-100);}
.badge-opp-low{background:var(--gray-100);color:var(--gray-500);border-color:var(--gray-200);}

/* Product main grid */
.main-grid{display:grid;grid-template-columns:1fr 380px;gap:20px;}
.left-col{display:flex;flex-direction:column;gap:20px;}
.right-col{display:flex;flex-direction:column;gap:20px;}

/* Score cards */
.score-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.score-card{border-radius:12px;padding:18px;border:1px solid;position:relative;overflow:hidden;transition:transform .15s,box-shadow .15s;}
.score-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.score-card-pl{background:var(--brand-50);border-color:var(--brand-100);}
.score-card-ws{background:var(--success-50);border-color:var(--success-100);}
.score-card-ds{background:var(--orange-50);border-color:var(--orange-100);}
.score-card.best-model::after{content:'En İyi';position:absolute;top:10px;right:10px;font-size:9px;font-weight:700;padding:2px 7px;border-radius:20px;letter-spacing:.05em;}
.score-card-pl.best-model::after{background:var(--brand-500);color:#fff;}
.score-card-ws.best-model::after{background:var(--success-600);color:#fff;}
.score-card-ds.best-model::after{background:var(--orange-500);color:#fff;}
.score-card-label{font-size:12px;font-weight:600;margin-bottom:10px;}
.score-card-pl .score-card-label{color:var(--brand-600);}
.score-card-ws .score-card-label{color:var(--success-700);}
.score-card-ds .score-card-label{color:var(--orange-700);}
.score-num{font-size:36px;font-weight:700;line-height:1;letter-spacing:-.03em;margin-bottom:10px;}
.score-card-pl .score-num{color:var(--brand-600);}
.score-card-ws .score-num{color:var(--success-700);}
.score-card-ds .score-num{color:var(--orange-700);}
.score-bar-track{height:6px;background:rgba(255,255,255,.5);border-radius:3px;overflow:hidden;margin-bottom:8px;}
.score-bar-fill{height:100%;border-radius:3px;transition:width .8s cubic-bezier(.4,0,.2,1);}
.score-card-pl .score-bar-fill{background:var(--brand-500);}
.score-card-ws .score-bar-fill{background:var(--success-500);}
.score-card-ds .score-bar-fill{background:var(--orange-500);}
.score-card-hint{font-size:11px;opacity:.7;line-height:1.4;}
.score-card-pl .score-card-hint{color:var(--brand-700);}
.score-card-ws .score-card-hint{color:var(--success-700);}
.score-card-ds .score-card-hint{color:var(--orange-700);}

/* Margin calculator */
.margin-row{display:flex;justify-content:space-between;align-items:center;padding:11px 22px;border-bottom:1px solid var(--gray-100);}
.margin-row:last-child{border-bottom:none;}
.margin-row.highlight{background:var(--success-50);}
.margin-row.negative{background:var(--error-50);}
.margin-label{font-size:13px;color:var(--gray-500);}
.margin-val{font-size:13px;font-weight:600;color:var(--gray-700);}
.margin-val.green{color:var(--success-600);}
.margin-val.red{color:var(--error-600);}
.margin-val.big{font-size:15px;}
.margin-slider-wrap{padding:14px 22px 18px;border-top:1px solid var(--gray-100);}
.slider-label{display:flex;justify-content:space-between;font-size:12px;color:var(--gray-500);margin-bottom:8px;}
.margin-slider{width:100%;accent-color:var(--brand-500);}

/* Facts grid */
.facts-grid{display:grid;grid-template-columns:1fr 1fr;}
.fact-item{padding:16px 22px;border-bottom:1px solid var(--gray-100);border-right:1px solid var(--gray-100);}
.fact-item:nth-child(even){border-right:none;}
.fact-item:nth-last-child(-n+2){border-bottom:none;}
.fact-label{font-size:11px;color:var(--gray-400);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;}
.fact-val{font-size:16px;font-weight:700;color:var(--gray-900);margin-bottom:3px;}
.fact-sub{font-size:11px;color:var(--gray-400);}

/* Chart wrap */
.chart-wrap{padding:16px;}

/* Amazon card */
.amazon-card{background:linear-gradient(135deg,#ff9900,#ffb347);border-radius:var(--radius);padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.amazon-card-left{color:#fff;}
.amazon-card-title{font-size:14px;font-weight:700;margin-bottom:4px;}
.amazon-card-sub{font-size:12px;opacity:.85;}
.amazon-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:var(--radius-sm);background:#fff;color:#c45500;font-size:13px;font-weight:700;text-decoration:none;transition:opacity .15s;white-space:nowrap;flex-shrink:0;}
.amazon-btn:hover{opacity:.9;}

/* AI quick buttons (product-specific) */
.ai-quick-btns{padding:0 14px 10px;display:flex;flex-wrap:wrap;gap:6px;flex-shrink:0;}
.ai-quick-btn{font-size:11px;font-weight:500;padding:5px 11px;border-radius:20px;border:1px solid var(--gray-200);background:#fff;color:var(--gray-600);cursor:pointer;font-family:'Outfit',sans-serif;transition:all .15s;}
.ai-quick-btn:hover{border-color:var(--brand-400);color:var(--brand-500);background:var(--brand-25);}
.ai-credit-note{padding:8px 14px;font-size:11px;color:var(--gray-400);border-top:1px solid var(--gray-100);display:flex;align-items:center;gap:5px;flex-shrink:0;}
.ai-credit-dot{width:5px;height:5px;border-radius:50%;background:var(--orange-400);}
.ai-input-row{padding:10px 12px;border-top:1px solid var(--gray-100);display:flex;gap:8px;flex-shrink:0;background:var(--gray-25);}

/* State box */
.state-box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:80px 24px;text-align:center;}
.state-icon{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;}
.state-title{font-size:18px;font-weight:600;color:var(--gray-900);}
.state-sub{font-size:14px;color:var(--gray-400);}
.spin{width:24px;height:24px;border-radius:50%;border:2px solid var(--gray-200);border-top-color:var(--brand-500);animation:spin .7s linear infinite;}

/* Product responsive */
@media(max-width:1200px){
  .main-grid{grid-template-columns:1fr;}
  .right-col{display:contents;}
  .right-col>*{order:10;}
}
@media(max-width:900px){
  .product-top{grid-template-columns:1fr;}
  .product-img-wrap{width:120px;height:120px;}
  .score-cards{grid-template-columns:1fr;}
  .facts-grid{grid-template-columns:1fr;}
  .fact-item:nth-child(odd){border-right:none;}
  .fact-item:nth-last-child(-n+2){border-bottom:1px solid var(--gray-100);}
  .fact-item:last-child{border-bottom:none;}
}


/* ═══════════════════════════════════════
   DASHBOARD PAGE
═══════════════════════════════════════ */
--brand-25:#f2f7ff;--brand-50:#ecf3ff;--brand-100:#dde9ff;--brand-200:#c2d6ff;
  --brand-400:#7592ff;--brand-500:#465fff;--brand-600:#3641f5;--brand-700:#2a31d8;
  --gray-25:#fcfcfd;--gray-50:#f9fafb;--gray-100:#f2f4f7;--gray-200:#e4e7ec;
  --gray-300:#d0d5dd;--gray-400:#98a2b3;--gray-500:#667085;--gray-600:#475467;
  --gray-700:#344054;--gray-800:#1d2939;--gray-900:#101828;
  --success-50:#ecfdf3;--success-100:#d1fadf;--success-500:#12b76a;--success-600:#039855;--success-700:#027a48;
  --error-50:#fef3f2;--error-100:#fee4e2;--error-500:#f04438;--error-600:#d92d20;
  --warning-50:#fffaeb;--warning-100:#fef0c7;--warning-500:#f79009;--warning-700:#b54708;
  --orange-50:#fff6ed;--orange-100:#ffead5;--orange-500:#fb6514;--orange-700:#c4320a;
  --shadow-sm:0px 1px 3px 0px rgba(16,24,40,.1),0px 1px 2px 0px rgba(16,24,40,.06);
  --shadow-md:0px 4px 8px -2px rgba(16,24,40,.1),0px 2px 4px -2px rgba(16,24,40,.06);
  --shadow-lg:0px 12px 16px -4px rgba(16,24,40,.08),0px 4px 6px -2px rgba(16,24,40,.03);
  --sidebar-w:290px;--header-h:64px;--radius:16px;--radius-sm:8px;--radius-xs:6px;
}
.logo-mark svg{width:16px;height:16px;fill:#fff;}
.nav-group-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--gray-400);margin-bottom:12px;padding-left:12px;margin-top:16px;}
.nav-item:hover{background:var(--gray-100);color:var(--gray-700);}
.nav-item.active{background:var(--brand-50);color:var(--brand-500);}
.nav-item.active .nav-icon{color:var(--brand-500);}
.nav-icon svg{width:20px;height:20px;fill:currentColor;}
.cat-item:hover{background:var(--gray-100);color:var(--gray-700);}
/* Profil — Claude.ai stili */
/* Kategori dropdown */
.cat-dropdown{position:relative;flex-shrink:0;}
.cat-dropdown-btn{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:var(--radius-xs);border:1px solid var(--gray-200);background:#fff;font-size:12px;font-weight:600;color:var(--gray-700);cursor:pointer;font-family:'Outfit',sans-serif;white-space:nowrap;transition:all .15s;}
.cat-dropdown-btn:hover{border-color:var(--brand-400);background:var(--brand-25);}
.cat-dropdown-menu{position:absolute;top:calc(100% + 6px);left:0;min-width:220px;max-height:320px;overflow-y:auto;background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);z-index:100;opacity:0;pointer-events:none;transform:translateY(4px);transition:opacity .15s,transform .15s;}
.cat-dropdown-menu.show{opacity:1;pointer-events:all;transform:translateY(0);}
.cat-dd-item{display:flex;align-items:center;gap:8px;padding:8px 14px;font-size:13px;font-weight:500;color:var(--gray-700);cursor:pointer;transition:background .1s;}
.cat-dd-item:hover{background:var(--gray-50);}
.cat-dd-item.active{background:var(--brand-50);color:var(--brand-600);}
.cat-dd-item .cat-count{margin-left:auto;font-size:11px;font-weight:500;background:var(--gray-100);color:var(--gray-400);padding:1px 7px;border-radius:20px;}
.cat-dd-sub{padding-left:28px;font-size:12px;color:var(--gray-600);}
.cat-dd-sub .cat-count{background:transparent;font-size:11px;}
.header{height:var(--header-h);flex-shrink:0;background:#fff;border-bottom:1px solid var(--gray-200);display:flex;align-items:center;justify-content:space-between;padding:0 24px;gap:16px;}
.header-left{display:flex;align-items:center;gap:12px;}
.header-right{display:flex;align-items:center;gap:8px;}
.icon-blue{background:var(--brand-50);color:var(--brand-500);}
.icon-green{background:var(--success-50);color:var(--success-600);}
.icon-orange{background:var(--orange-50);color:var(--orange-500);}
.icon-purple{background:#f4f3ff;color:#7a5af8;}
.trend-up{background:var(--success-50);color:var(--success-700);}
.trend-neutral{background:var(--gray-100);color:var(--gray-500);}
/* Dashboard — main-grid sabit yükseklikte, içi scroll */
.main-grid{display:grid;grid-template-columns:1fr 344px;gap:16px;height:900px;}
.main-grid > .card{display:flex;flex-direction:column;overflow:hidden;min-height:0;}
.right-panel{display:flex;flex-direction:column;gap:16px;height:100%;overflow:hidden;}
/* AI panel — global min-height'i sıfırla, flex ile doldur */
.right-panel .ai-panel{flex:2;min-height:0 !important;display:flex;flex-direction:column;overflow:hidden;}
.right-panel .ai-panel .ai-messages{flex:1;overflow-y:auto !important;min-height:0 !important;padding:14px;}
/* Chart card sabit, ezilmesin */
.right-panel .chart-card{flex-shrink:0;}
.ai-indicator{width:8px;height:8px;border-radius:50%;background:var(--success-500);animation:pls 2.5s ease infinite;}
@keyframes bd{0%,80%,100%{transform:translateY(0);opacity:.4}40%{transform:translateY(-5px);opacity:1}}
@media(max-width:1024px){
  .sidebar.open{transform:translateX(0);}
  .header{height:auto;padding:10px 16px;flex-wrap:wrap;gap:8px;}
  .header-right{width:100%;flex-wrap:wrap;gap:6px;}
  .main-grid{grid-template-columns:1fr!important;min-height:unset!important;}
}
@media(max-width:640px){
}


/* ═══════════════════════════════════════
   FAVOURITES PAGE
═══════════════════════════════════════ */
/* Favourites — eski renk değişkenlerini yeni sisteme eşleştir */




/* STATS */
.fav-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 20px; }

/* FILTERS */
.pill { font-size: 11px; padding: 4px 12px; border-radius: 20px; border: 1px solid var(--gray-200); background: transparent; color: var(--gray-500); cursor: pointer; font-family: 'Outfit', sans-serif; transition: all .15s; }
.search-box { display: flex; align-items: center; gap: 8px; background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius-sm); padding: 7px 12px; margin-left: auto; }
.search-box input { border: none; background: transparent; font-size: 13px; color: var(--gray-900); font-family: 'Outfit', sans-serif; outline: none; width: 180px; }

/* GRID & CARD */
.fav-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.fav-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; transition: transform .2s, box-shadow .2s; position: relative; box-shadow: var(--shadow-sm); }
.fav-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.fav-card-img { width: 100%; height: 140px; object-fit: contain; background: var(--gray-50); padding: 12px; }
.fav-card-img-placeholder { width: 100%; height: 140px; background: var(--gray-100); display: flex; align-items: center; justify-content: center; font-size: 32px; }
.fav-card-body { padding: 14px; }
.fav-card-cat { font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--brand-500); margin-bottom: 5px; }
.fav-card-name { font-size: 13px; font-weight: 500; color: var(--gray-900); line-height: 1.45; margin-bottom: 10px; }
.fav-card-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.fav-card-price { font-size: 15px; font-weight: 700; color: var(--gray-900); }
.fav-card-stars { font-size: 11px; color: #c8922a; }
.fav-card-reviews { font-size: 11px; color: var(--gray-400); }
.fav-card-actions { display: flex; gap: 6px; flex-wrap: wrap; }

/* Kart butonları */
.card-btn { flex: 1; min-width: 80px; padding: 7px 8px; border-radius: var(--radius-sm); font-size: 11px; font-weight: 600; cursor: pointer; font-family: 'Outfit', sans-serif; text-align: center; text-decoration: none; transition: all .15s; border: 1px solid transparent; display: inline-flex; align-items: center; justify-content: center; gap: 4px; white-space: nowrap; }
.card-btn-detail  { background: var(--brand-500); color: #fff; border-color: var(--brand-500); }
.card-btn-detail:hover { background: var(--brand-600); }
.card-btn-amazon  { background: var(--gray-100); color: var(--gray-700); border-color: var(--gray-200); }
.card-btn-amazon:hover { background: var(--gray-200); }
.card-btn-product { background: var(--brand-50); color: var(--brand-600); border-color: var(--brand-100); }
.card-btn-product:hover { background: var(--brand-100); }
.card-btn-remove  { background: var(--error-50); color: var(--error-600); border-color: var(--error-100); }
.card-btn-remove:hover { background: var(--error-100); }

.fav-remove-badge { position: absolute; top: 10px; right: 10px; width: 28px; height: 28px; border-radius: 50%; background: rgba(255,255,255,.92); border: 1px solid var(--gray-200); display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 14px; transition: all .15s; box-shadow: var(--shadow-sm); }
.fav-remove-badge:hover { background: var(--error-50); border-color: var(--error-100); }




@media(max-width:900px) {
  .fav-stats { grid-template-columns: 1fr 1fr; }
  .fav-grid { grid-template-columns: 1fr 1fr; }
  .search-box { margin-left: 0; width: 100%; }
  .search-box input { width: 100%; }
}
@media(max-width:480px) {
  .fav-stats { grid-template-columns: 1fr; }
  .fav-grid { grid-template-columns: 1fr; }
}


/* ═══════════════════════════════════════
   PROFILE PAGE
═══════════════════════════════════════ */
/* Profile page — sidebar.css ile uyumlu ek stiller */

/* Eski renk değişkenlerini yeni sistemle eşleştir */


/* MAIN */

/* TOPBAR */
.page-title { font-size: 15px; font-weight: 600; color: var(--gray-900); }

/* CONTENT */

/* PROFILE GRID */
.profile-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 960px; margin: 0 auto; }
.profile-header { grid-column: 1 / -1; background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 24px; display: flex; align-items: center; gap: 20px; box-shadow: var(--shadow-sm); }
.profile-avatar-big { width: 64px; height: 64px; border-radius: 50%; background: var(--brand-500); display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 700; color: #fff; flex-shrink: 0; }
.profile-name { font-size: 18px; font-weight: 700; color: var(--gray-900); margin-bottom: 2px; }
.profile-email { font-size: 13px; color: var(--gray-500); margin-bottom: 10px; }
.profile-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.profile-header-actions { margin-left: auto; }

/* BADGE */
.badge { font-size: 11px; padding: 3px 10px; border-radius: 20px; font-weight: 600; }
.badge-plan { background: var(--gray-900); color: #fff; }
.badge-status { background: var(--success-50); color: var(--success-700); border: 1px solid var(--success-100); }
.badge-provider { background: var(--brand-50); color: var(--brand-600); border: 1px solid var(--brand-100); }

/* SECTION CARDS */

/* INFO ROWS */
.info-row { display: flex; align-items: flex-start; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--gray-100); gap: 12px; }
.info-row:last-child { border-bottom: none; padding-bottom: 0; }
.info-row:first-child { padding-top: 0; }
.info-key { font-size: 12px; color: var(--gray-500); padding-top: 2px; flex-shrink: 0; }
.info-val { font-size: 13px; font-weight: 500; color: var(--gray-900); display: flex; align-items: center; gap: 8px; text-align: right; flex-wrap: wrap; justify-content: flex-end; }

/* PLAN CARD */
.plan-visual { background: var(--gray-900); border-radius: var(--radius-sm); padding: 18px 20px; margin-bottom: 14px; position: relative; overflow: hidden; }
.plan-visual::before { content:''; position:absolute;inset:0; background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size:28px 28px; pointer-events:none; }
.plan-visual-name { font-size: 18px; font-weight: 700; color: #fff; margin-bottom: 3px; position: relative; z-index: 1; }
.plan-visual-sub { font-size: 12px; color: rgba(255,255,255,.4); position: relative; z-index: 1; }
.plan-visual-price { position: absolute; top: 18px; right: 20px; z-index: 1; text-align: right; }
.plan-visual-amount { font-size: 24px; font-weight: 700; color: #c8922a; line-height: 1; }
.plan-visual-period { font-size: 11px; color: rgba(255,255,255,.35); }
.plan-features-list { display: flex; flex-direction: column; gap: 7px; margin-bottom: 14px; }
.plan-feat { display: flex; align-items: center; gap: 9px; font-size: 13px; color: var(--gray-700); }
.feat-check { width: 16px; height: 16px; border-radius: 4px; background: var(--success-50); color: var(--success-700); display: flex; align-items: center; justify-content: center; font-size: 9px; font-weight: 700; flex-shrink: 0; }
.plan-upgrade-btn { width: 100%; padding: 10px; background: var(--brand-500); color: #fff; border: none; border-radius: var(--radius-sm); font-size: 13px; font-weight: 600; cursor: pointer; font-family: 'Outfit', sans-serif; transition: background .15s; }
.plan-upgrade-btn:hover { background: var(--brand-600); }

/* USAGE BAR */
.usage-item { margin-bottom: 12px; }
.usage-item:last-child { margin-bottom: 0; }
.usage-top { display: flex; justify-content: space-between; margin-bottom: 5px; }
.usage-label { font-size: 12px; color: var(--gray-500); }
.usage-val { font-size: 12px; font-weight: 500; color: var(--gray-700); }
.usage-bar { height: 6px; background: var(--gray-100); border-radius: 3px; overflow: hidden; }
.usage-fill { height: 100%; border-radius: 3px; background: var(--brand-500); transition: width .6s ease; }
.usage-fill.full { background: var(--error-500); }
.usage-fill.ok { background: var(--success-500); }

/* DANGER ZONE */
.danger-zone { border: 1px solid var(--error-100); border-radius: var(--radius); overflow: hidden; grid-column: 1 / -1; }
.danger-head { padding: 14px 20px; background: var(--error-50); border-bottom: 1px solid var(--error-100); }
.danger-title { font-size: 13px; font-weight: 600; color: var(--error-600); }
.danger-body { padding: 18px 20px; background: #fff; display: flex; flex-direction: column; gap: 12px; }
.danger-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.danger-text h4 { font-size: 13px; font-weight: 500; color: var(--gray-900); margin-bottom: 2px; }
.danger-text p { font-size: 12px; color: var(--gray-500); line-height: 1.5; }
.danger-btn { padding: 8px 14px; border-radius: var(--radius-sm); font-size: 12px; font-weight: 500; cursor: pointer; font-family: 'Outfit', sans-serif; white-space: nowrap; flex-shrink: 0; transition: all .15s; border: 1px solid var(--error-100); background: transparent; color: var(--error-600); }
.danger-btn:hover { background: var(--error-50); }
.danger-btn.fill { background: var(--error-500); color: #fff; border-color: var(--error-500); }
.danger-btn.fill:hover { background: var(--error-600); }

/* MODAL */
.modal { background: #fff; border-radius: var(--radius); padding: 28px; width: 380px; max-width: calc(100vw - 32px); box-shadow: var(--shadow-lg); }

/* TOAST */
.toast { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%) translateY(12px); background: var(--gray-900); color: #fff; padding: 10px 20px; border-radius: var(--radius-sm); font-size: 13px; font-weight: 500; opacity: 0; transition: all .25s; pointer-events: none; white-space: nowrap; z-index: 999; }

/* EDIT INPUT */
.edit-field { display: none; gap: 8px; align-items: center; margin-top: 6px; }
.edit-field.show { display: flex; }
.edit-field input { flex: 1; padding: 8px 10px; border: 1px solid var(--gray-200); border-radius: var(--radius-sm); font-size: 13px; color: var(--gray-900); font-family: 'Outfit', sans-serif; outline: none; background: var(--gray-50); }
.edit-field input:focus { border-color: var(--brand-400); background: #fff; }
.save-btn { padding: 8px 14px; background: var(--brand-500); color: #fff; border: none; border-radius: var(--radius-sm); font-size: 12px; font-weight: 600; cursor: pointer; font-family: 'Outfit', sans-serif; }
.cancel-btn { padding: 8px 10px; background: transparent; color: var(--gray-500); border: 1px solid var(--gray-200); border-radius: var(--radius-sm); font-size: 12px; cursor: pointer; font-family: 'Outfit', sans-serif; }

/* RESPONSIVE */
@media(max-width:900px) {
  .profile-grid { grid-template-columns: 1fr; }
  .profile-header { flex-wrap: wrap; }
  .profile-header-actions { width: 100%; }
  .danger-zone { grid-column: 1; }
}


/* ═══════════════════════════════════════
   MEMBERS PAGE
═══════════════════════════════════════ */
--ink: #0d0d0b; --ink2: #1e1e1b;
  --surface: #f7f4ee; --surface2: #ede9e0; --surface3: #e4e0d5;
  --white: #ffffff;
  --border: rgba(13,13,11,.09); --border2: rgba(13,13,11,.05);
  --muted: #6b6b66; --muted2: #9a9a94;
  --gold: #c8922a; --gold-bg: rgba(200,146,42,.08);
  --green: #1a7a52; --green-bg: #e8f5ee; --green-text: #0f6e56;
  --amber: #9a5a00; --amber-bg: #fef3e2;
  --red: #b5341e; --red-bg: #fde8e5;
  --blue: #185FA5; --blue-bg: #e6f1fb;
  --sidebar-w: 220px;
}
body { font-family: 'DM Sans', sans-serif; background: var(--surface); color: var(--ink); height: 100vh; display: flex; overflow: hidden; font-size: 14px; }

/* SIDEBAR */
.admin-badge { font-size: 9px; background: var(--gold); color: var(--ink); padding: 1px 6px; border-radius: 8px; font-weight: 600; letter-spacing: .04em; }

/* MOBİL */

/* MAIN */
.page-title { font-size: 15px; font-weight: 500; color: var(--ink); display: flex; align-items: center; gap: 8px; }

/* CONTENT */

/* STATS */
.stats-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 20px; }

/* TOOLBAR */
.toolbar { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.search-box { display: flex; align-items: center; gap: 8px; background: var(--white); border: 1px solid var(--border); border-radius: 8px; padding: 7px 12px; flex: 1; max-width: 280px; }
.search-box input { border: none; background: transparent; font-size: 13px; color: var(--ink); font-family: 'DM Sans', sans-serif; outline: none; width: 100%; }
.filter-select { padding: 7px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--white); font-size: 12px; color: var(--muted); font-family: 'DM Sans', sans-serif; cursor: pointer; }
.member-count { font-size: 12px; color: var(--muted2); margin-left: auto; }

/* TABLE */
.table-card { background: var(--white); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; }
table { width: 100%; border-collapse: collapse; }
.member-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--gold); display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 600; color: var(--ink); flex-shrink: 0; }
.member-info { display: flex; align-items: center; gap: 10px; }
.member-name { font-weight: 500; font-size: 13px; color: var(--ink); }
.member-email { font-size: 11px; color: var(--muted); }
.plan-badge { display: inline-block; font-size: 10px; padding: 3px 8px; border-radius: 8px; font-weight: 500; }
.plan-starter { background: var(--surface2); color: var(--muted); }
.plan-pro { background: var(--gold-bg); color: var(--gold); }
.plan-agency { background: var(--blue-bg); color: var(--blue); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; margin-right: 5px; }
.status-active { background: var(--green); }
.status-passive { background: var(--muted2); }
.status-cancelled { background: var(--red); }
.status-text { font-size: 12px; }
.action-btn { padding: 5px 10px; border-radius: 6px; font-size: 11px; font-weight: 500; cursor: pointer; border: 1px solid var(--border); background: transparent; color: var(--muted); font-family: 'DM Sans', sans-serif; transition: all .15s; }
.action-btn:hover { background: var(--surface2); color: var(--ink); }
.action-btn.edit { background: var(--blue-bg); color: var(--blue); border-color: rgba(24,95,165,.2); }
.action-btn.edit:hover { background: #cfe2f7; }
.note-text { font-size: 11px; color: var(--muted); font-style: italic; max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.no-note { color: var(--muted2); font-size: 11px; }

/* ACCESS DENIED */
.access-denied { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; gap: 12px; text-align: center; padding: 40px; }
.access-denied-icon { font-size: 48px; }
.access-denied-title { font-family: 'DM Serif Display', serif; font-size: 24px; color: var(--ink); }
.access-denied-sub { font-size: 14px; color: var(--muted); }

/* LOADING */
.loading-row td { text-align: center; padding: 40px; color: var(--muted); }

/* MODAL */
.modal { background: var(--white); border-radius: 16px; padding: 28px; width: 440px; max-width: calc(100vw - 32px); box-shadow: 0 20px 60px rgba(13,13,11,.2); }
.form-group { margin-bottom: 16px; }
.form-label { font-size: 11px; font-weight: 500; color: var(--muted2); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 6px; display: block; }
.form-select, .form-textarea { width: 100%; padding: 9px 12px; border: 1px solid var(--border); border-radius: 8px; font-size: 13px; color: var(--ink); font-family: 'DM Sans', sans-serif; background: var(--white); outline: none; transition: border-color .15s; }
.form-select:focus, .form-textarea:focus { border-color: rgba(13,13,11,.25); }
.form-textarea { resize: vertical; min-height: 80px; line-height: 1.5; }

/* TOAST */
.toast { position: fixed; bottom: 24px; right: 24px; background: var(--ink); color: var(--surface); padding: 10px 18px; border-radius: 10px; font-size: 13px; z-index: 300; opacity: 0; transform: translateY(8px); transition: all .3s; pointer-events: none; }

/* RESPONSIVE */
@media (max-width: 900px) {
  body { flex-direction: column; overflow: auto; height: auto; }
  .stats-row { grid-template-columns: 1fr 1fr; gap: 10px; }
  .note-text, .no-note { display: none; }
}
@media (max-width: 480px) {
  .stats-row { grid-template-columns: 1fr; }
}


/* "Ürünü İncele" küçük ikon butonu */
.inspect-btn{display:inline-flex;align-items:center;padding:4px 8px;border-radius:var(--radius-xs);background:var(--brand-50);border:1px solid var(--brand-100);color:var(--brand-600);font-size:11px;font-weight:600;text-decoration:none;white-space:nowrap;transition:all .15s;font-family:'Outfit',sans-serif;}
.inspect-btn:hover{background:var(--brand-500);color:#fff;border-color:var(--brand-500);}

/* prod-detail "Ürünü Detaylı İncele" linki */
.detail-page-btn{display:block;margin-top:10px;padding:7px 12px;background:var(--brand-500);color:#fff;border-radius:var(--radius-sm);font-size:12px;font-weight:600;text-align:center;text-decoration:none;transition:background .15s;}
.detail-page-btn:hover{background:var(--brand-600);}

/* Product action buttons under product-top */
.product-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:4px;}

/* ═══════════════════════════════════════
   SEARCH PAGE — Ürün Araştırma
═══════════════════════════════════════ */

/* Hero bölümü */
.search-hero{max-width:680px;margin:0 auto;text-align:center;padding:40px 0 8px;}
.hero-badge{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--brand-600);background:var(--brand-50);border:1px solid var(--brand-100);padding:5px 14px;border-radius:20px;margin-bottom:24px;letter-spacing:.02em;}
.hero-badge-dot{width:7px;height:7px;border-radius:50%;background:var(--brand-500);animation:pls 2s ease infinite;}
.hero-title{font-size:36px;font-weight:800;color:var(--gray-900);line-height:1.2;letter-spacing:-.03em;margin-bottom:14px;}
.hero-title span{color:var(--brand-500);}
.hero-sub{font-size:15px;color:var(--gray-500);line-height:1.7;margin-bottom:32px;}

/* Search card */
.search-card{background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow-md);text-align:left;}
.search-input-label{display:block;font-size:13px;font-weight:600;color:var(--gray-700);margin-bottom:10px;}
.search-input-wrap{display:flex;gap:10px;margin-bottom:10px;}
.search-input-outer{position:relative;flex:1;display:flex;align-items:center;}
.search-input-icon{position:absolute;left:13px;width:16px;height:16px;color:var(--gray-400);pointer-events:none;display:flex;align-items:center;}
.search-input-icon svg{width:16px;height:16px;stroke:currentColor;}
.search-main-input{width:100%;padding:12px 40px 12px 40px;border:1.5px solid var(--gray-200);border-radius:var(--radius-sm);font-size:14px;font-family:'Outfit',sans-serif;color:var(--gray-900);background:var(--gray-50);outline:none;transition:border-color .15s,box-shadow .15s,background .15s;}
.search-main-input:focus{border-color:var(--brand-400);background:#fff;box-shadow:0 0 0 4px rgba(70,95,255,.1);}
.search-main-input::placeholder{color:var(--gray-400);}
.search-clear-btn{position:absolute;right:10px;width:22px;height:22px;border-radius:50%;background:var(--gray-200);border:none;cursor:pointer;display:none;align-items:center;justify-content:center;color:var(--gray-500);transition:all .15s;padding:0;}
.search-clear-btn.visible{display:flex;}
.search-clear-btn:hover{background:var(--gray-300);color:var(--gray-700);}
.search-clear-btn svg{width:11px;height:11px;}
.search-submit-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;background:var(--brand-500);color:#fff;border:none;border-radius:var(--radius-sm);font-size:14px;font-weight:600;font-family:'Outfit',sans-serif;cursor:pointer;transition:all .15s;white-space:nowrap;flex-shrink:0;}
.search-submit-btn:hover{background:var(--brand-600);transform:translateY(-1px);box-shadow:0 4px 12px rgba(70,95,255,.3);}
.search-submit-btn:active{transform:translateY(0);}
.search-submit-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none;}
.search-submit-btn svg{width:16px;height:16px;}

/* Error & tip */
.search-input-error{display:none;align-items:center;gap:7px;font-size:12px;color:var(--error-600);margin-top:8px;padding:8px 12px;background:var(--error-50);border-radius:var(--radius-sm);border:1px solid var(--error-100);}
.search-input-error.show{display:flex;}
.search-paste-tip{display:none;align-items:center;gap:7px;font-size:12px;color:var(--success-700);margin-top:8px;padding:7px 12px;background:var(--success-50);border-radius:var(--radius-sm);border:1px solid var(--success-100);}
.search-paste-tip.show{display:flex;}

/* Format hints */
.search-hints{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px;padding-top:14px;border-top:1px solid var(--gray-100);}
.search-hint-label{font-size:11px;color:var(--gray-400);font-weight:500;white-space:nowrap;}
.search-hint-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border:1px solid var(--gray-200);border-radius:20px;background:var(--gray-50);font-size:11px;font-weight:500;color:var(--gray-600);cursor:pointer;font-family:'Outfit',sans-serif;transition:all .15s;}
.search-hint-chip:hover{border-color:var(--brand-400);color:var(--brand-500);background:var(--brand-25);}

/* Divider */
.search-divider{display:flex;align-items:center;gap:16px;margin:36px auto 24px;max-width:860px;}
.search-divider-line{flex:1;height:1px;background:var(--gray-200);}
.search-divider-text{font-size:12px;font-weight:600;color:var(--gray-400);white-space:nowrap;text-transform:uppercase;letter-spacing:.06em;}

/* How it works cards */
.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:36px;max-width:860px;margin-left:auto;margin-right:auto;}
.how-card{background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius);padding:24px;position:relative;transition:box-shadow .2s,transform .2s;}
.how-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);}
.how-step{position:absolute;top:20px;right:20px;width:24px;height:24px;border-radius:50%;background:var(--brand-50);color:var(--brand-500);font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;border:1px solid var(--brand-100);}
.how-icon{width:40px;height:40px;border-radius:var(--radius-sm);background:var(--brand-50);border:1px solid var(--brand-100);display:flex;align-items:center;justify-content:center;margin-bottom:14px;color:var(--brand-500);}
.how-icon svg{width:20px;height:20px;}
.how-title{font-size:14px;font-weight:700;color:var(--gray-900);margin-bottom:8px;}
.how-desc{font-size:13px;color:var(--gray-500);line-height:1.6;}

/* Son aramalar */
.recent-section{background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius);overflow:hidden;max-width:860px;margin:0 auto;}
.recent-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--gray-100);}
.recent-title{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--gray-900);}
.recent-title svg{color:var(--gray-400);}
.recent-clear-btn{font-size:12px;color:var(--gray-400);background:none;border:none;cursor:pointer;font-family:'Outfit',sans-serif;transition:color .15s;}
.recent-clear-btn:hover{color:var(--error-600);}
.recent-empty{padding:32px 20px;text-align:center;color:var(--gray-400);font-size:13px;display:flex;flex-direction:column;align-items:center;gap:8px;}
.recent-empty svg{color:var(--gray-300);}
.recent-item{display:flex;align-items:center;gap:12px;padding:12px 20px;text-decoration:none;border-bottom:1px solid var(--gray-100);transition:background .1s;}
.recent-item:last-child{border-bottom:none;}
.recent-item:hover{background:var(--gray-50);}
.recent-item-icon{width:32px;height:32px;border-radius:var(--radius-sm);background:var(--gray-100);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--gray-400);}
.recent-item-body{flex:1;min-width:0;}
.recent-item-asin{font-size:13px;font-weight:600;color:var(--gray-900);font-family:monospace;}
.recent-item-name{font-size:12px;color:var(--gray-500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px;}
.recent-item-time{font-size:11px;color:var(--gray-400);white-space:nowrap;flex-shrink:0;}
.recent-item-arrow{color:var(--gray-300);display:flex;align-items:center;flex-shrink:0;}

/* Responsive */
@media(max-width:900px){
  .hero-title{font-size:26px;}
  .how-grid{grid-template-columns:1fr;}
  .search-input-wrap{flex-direction:column;}
  .search-submit-btn{width:100%;justify-content:center;}
}

/* ═══════════════════════════════════════
   BESTSELLERS — Sidebar kategori ağacı
═══════════════════════════════════════ */
#bsCatTree{overflow-y:auto;max-height:calc(100vh - 320px);}
.bs-cat-item{border-radius:var(--radius-sm);margin-bottom:1px;transition:background .1s;}
.bs-cat-row{display:flex;align-items:center;justify-content:space-between;padding:7px 12px;border-radius:var(--radius-sm);cursor:pointer;transition:background .1s;gap:4px;}
.bs-cat-row:hover{background:var(--gray-100);}
.bs-cat-active > .bs-cat-row{background:var(--brand-50);}
.bs-cat-active > .bs-cat-row span[style*="font-size:13px"]{color:var(--brand-500) !important;font-weight:600;}
.bs-cat-sub-item{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;border-radius:var(--radius-sm);cursor:pointer;transition:background .1s;gap:4px;margin-bottom:1px;}
.bs-cat-sub-item:hover{background:var(--gray-100);}
.bs-cat-active.bs-cat-sub-item{background:var(--brand-50);}
.bs-cat-active.bs-cat-sub-item span{color:var(--brand-500) !important;font-weight:600;}