/* ===========================================
   SYNTHEDGE v2 — JOURNAL CSS
   =========================================== */

.journal-stats {
  display:flex; gap:0;
  background:var(--bg-card); border:1px solid var(--border);
  border-radius:var(--r-lg); overflow:hidden;
}
.jstat { flex:1; padding:18px 20px; text-align:center; border-right:1px solid var(--border); }
.jstat:last-child { border-right:none; }
.jstat-val { display:block; font-family:var(--font-display); font-size:1.4rem; font-weight:800; margin-bottom:4px; }
.jstat-label { font-size:11px; color:var(--text-3); text-transform:uppercase; letter-spacing:.06em; }
.text-red { color:var(--red); }

/* FILTERS */
.journal-filters { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.j-search {
  background:var(--bg-card); border:1px solid var(--border);
  border-radius:var(--r-md); padding:9px 14px;
  color:var(--text-1); font-size:13px; font-family:var(--font-body);
  flex:1; min-width:200px; transition:border-color .2s;
}
.j-search:focus { outline:none; border-color:var(--orange); }
.j-search::placeholder { color:var(--text-3); }
.j-filter-group { display:flex; gap:8px; flex-wrap:wrap; }
.j-select {
  background:var(--bg-card); border:1px solid var(--border);
  border-radius:var(--r-md); padding:9px 12px;
  color:var(--text-2); font-size:12px; font-family:var(--font-body);
  cursor:pointer; transition:border-color .2s;
}
.j-select:focus { outline:none; border-color:var(--orange); }

/* LOADING / EMPTY STATES — real states, not decoration */
.journal-loading, .journal-empty {
  text-align:center; padding:48px 24px; color:var(--text-3); font-size:14px;
  background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-lg);
}

/* ENTRIES */
.journal-entries { display:flex; flex-direction:column; gap:2px; }
.journal-date-group { margin-top:8px; margin-bottom:4px; }
.jdg-label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--text-3); padding:4px 0; }

.journal-entry {
  background:var(--bg-card); border:1px solid var(--border);
  border-radius:var(--r-md); padding:14px 16px;
  display:flex; align-items:flex-start; gap:14px;
  transition:border-color .2s, transform .15s;
  cursor:default; position:relative; margin-bottom:8px;
}
.journal-entry:hover { border-color:var(--border-soft); transform:translateX(2px); }
.je-win { border-left:3px solid var(--green); }
.je-loss { border-left:3px solid var(--red); }
.je-be { border-left:3px solid var(--amber); }

.je-left { display:flex; flex-direction:column; align-items:center; gap:6px; min-width:64px; }
.je-outcome { width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:14px; }
.je-outcome-win { background:rgba(52,211,153,0.15); color:var(--green); }
.je-outcome-loss { background:rgba(251,91,91,0.15); color:var(--red); }
.je-outcome-be { background:rgba(255,176,32,0.15); color:var(--amber); }
.je-instrument { font-size:11px; font-weight:700; color:var(--text-3); text-align:center; }
.je-dir { font-size:10px; font-weight:800; padding:2px 6px; border-radius:4px; }
.je-dir.buy { background:rgba(52,211,153,0.1); color:var(--green); }
.je-dir.sell { background:rgba(251,91,91,0.1); color:var(--red); }

.je-center { flex:1; min-width:0; }
.je-setup { font-size:13px; font-weight:500; margin-bottom:6px; }
.je-tags { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:6px; }
.je-tag { font-size:10px; padding:2px 8px; border-radius:100px; background:rgba(255,255,255,0.05); color:var(--text-3); border:1px solid var(--border); }
.je-emotion { font-size:10px; padding:2px 8px; border-radius:100px; }
.je-emotion-confident { background:rgba(52,211,153,0.1); color:var(--green); }
.je-emotion-calm { background:rgba(45,212,191,0.1); color:var(--teal); }
.je-emotion-fearful { background:rgba(255,176,32,0.1); color:var(--amber); }
.je-emotion-fomo { background:rgba(251,91,91,0.1); color:var(--red); }
.je-emotion-revenge { background:rgba(251,91,91,0.15); color:var(--red); }
.je-emotion-greedy { background:rgba(255,107,53,0.1); color:var(--orange); }
.je-note { font-size:12px; color:var(--text-3); line-height:1.5; margin-bottom:4px; }
.je-screenshot-link { font-size:11px; color:var(--orange); display:inline-block; margin-top:2px; }

.je-right { text-align:right; min-width:80px; }
.je-pnl { font-family:var(--font-display); font-size:1rem; font-weight:800; }
.je-rr { font-size:11px; color:var(--text-3); margin-top:2px; }
.je-time { font-size:11px; color:var(--text-3); margin-top:4px; }

.je-actions { display:flex; flex-direction:column; gap:4px; opacity:0; transition:opacity .2s; }
.journal-entry:hover .je-actions { opacity:1; }
.je-btn { font-size:14px; padding:4px; border-radius:4px; transition:background .2s; }
.je-btn:hover { background:rgba(255,255,255,0.06); }

/* MODAL */
.modal-overlay {
  position:fixed; inset:0; z-index:200;
  background:rgba(0,0,0,0.75); backdrop-filter:blur(6px);
  display:none; align-items:center; justify-content:center; padding:20px;
}
.modal-overlay.open { display:flex; }
.modal {
  background:var(--bg-card); border:1px solid var(--border-soft);
  border-radius:var(--r-xl); width:100%; max-width:640px;
  max-height:90vh; display:flex; flex-direction:column;
  box-shadow:0 24px 80px rgba(0,0,0,0.6);
  animation: modalIn .25s ease;
}
@keyframes modalIn { from{opacity:0;transform:scale(0.96)} to{opacity:1;transform:scale(1)} }
.modal-header { display:flex; align-items:center; justify-content:space-between; padding:20px 24px; border-bottom:1px solid var(--border); }
.modal-header h2 { font-family:var(--font-display); font-size:16px; font-weight:700; }
.modal-close { color:var(--text-3); padding:4px; border-radius:var(--r-sm); transition:color .2s; }
.modal-close:hover { color:var(--text-1); }
.modal-body { padding:20px 24px; overflow-y:auto; display:flex; flex-direction:column; gap:16px; }
.modal-footer { padding:16px 24px; border-top:1px solid var(--border); display:flex; justify-content:flex-end; gap:10px; }

/* FORM ELEMENTS */
.form-group { display:flex; flex-direction:column; gap:6px; }
.form-group label { font-size:12px; font-weight:600; color:var(--text-3); text-transform:uppercase; letter-spacing:.06em; }
.form-input {
  background:var(--bg-base); border:1px solid var(--border);
  border-radius:var(--r-sm); padding:9px 12px;
  color:var(--text-1); font-size:13px; font-family:var(--font-body);
  transition:border-color .2s; width:100%;
}
.form-input:focus { outline:none; border-color:var(--orange); }
.form-textarea { resize:vertical; min-height:80px; }
.form-row-2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.form-row-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; }

.dir-toggle { display:flex; gap:0; border:1px solid var(--border); border-radius:var(--r-sm); overflow:hidden; }
.dir-btn { flex:1; padding:9px 0; font-size:12px; font-weight:700; color:var(--text-3); transition:all .2s; }
.dir-btn.buy-active { background:rgba(52,211,153,0.15); color:var(--green); }
.dir-btn.sell-active { background:rgba(251,91,91,0.15); color:var(--red); }

.emotion-picker { display:flex; flex-wrap:wrap; gap:8px; }
.emo-btn { padding:6px 12px; border-radius:100px; font-size:12px; border:1px solid var(--border); color:var(--text-3); transition:all .2s; background:var(--bg-base); }
.emo-btn:hover { border-color:var(--orange); color:var(--text-1); }
.emo-btn.selected { border-color:var(--orange); background:var(--orange-soft); color:var(--orange); }

.file-drop {
  border:1.5px dashed var(--border-soft); border-radius:var(--r-md);
  padding:28px; text-align:center; color:var(--text-3); font-size:13px;
  display:flex; flex-direction:column; align-items:center; gap:8px;
  cursor:pointer; transition:border-color .2s, background .2s;
}
.file-drop:hover { border-color:var(--orange); background:var(--orange-soft); }
.file-drop.drag-over { border-color:var(--teal); background:var(--teal-soft); }
.file-label { color:var(--orange); cursor:pointer; }
.img-preview { margin-top:8px; border-radius:var(--r-md); overflow:hidden; }
.img-preview img { max-height:120px; border-radius:var(--r-md); }

.tags-input-wrap {
  background:var(--bg-base); border:1px solid var(--border);
  border-radius:var(--r-sm); padding:6px 10px;
  display:flex; flex-wrap:wrap; gap:6px; min-height:40px;
  transition:border-color .2s;
}
.tags-input-wrap:focus-within { border-color:var(--orange); }
.tags-list { display:flex; flex-wrap:wrap; gap:4px; }
.tag-chip { background:var(--orange-soft); color:var(--orange); padding:2px 8px; border-radius:100px; font-size:11px; font-weight:700; display:flex; align-items:center; gap:4px; }
.tag-chip button { font-size:12px; color:var(--orange); opacity:.7; transition:opacity .2s; }
.tag-chip button:hover { opacity:1; }
.tags-input { border:none; background:transparent; color:var(--text-1); font-size:13px; font-family:var(--font-body); outline:none; flex:1; min-width:120px; }

.spinner {
  width:14px; height:14px; border-radius:50%;
  border:2px solid rgba(26,14,8,0.3); border-top-color:#1A0E08;
  animation: spin .7s linear infinite; display:inline-block;
}
@keyframes spin { to { transform:rotate(360deg); } }

@media (max-width:600px) {
  .journal-stats { flex-wrap:wrap; }
  .jstat { min-width:33%; border-bottom:1px solid var(--border); }
  .form-row-2, .form-row-3 { grid-template-columns:1fr; }
}