/* ================================================================
   Адмінка заявок. Палітра та ж, що на сайті, але щільніша:
   тут не читають, тут працюють — тому дрібніший шрифт і менше повітря.
   ================================================================ */
:root{
  --bg:            #0c0c0d;
  --bg-panel:      #17171a;
  --bg-soft:       #1d1d21;
  --line:          #2c2c31;
  --sand:          #d9c39a;
  --sand-bright:   #e8d5ac;
  --sand-dim:      #a08f6d;
  --text:          #d6d4cf;
  --text-dim:      #8e8b85;
  --danger:        #e0a3a3;

  --font-display: "Oswald", "Helvetica Neue", Arial, sans-serif;
  --font-body:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --radius: 4px;
}

*,*::before,*::after{ box-sizing:border-box; }

/* .btn задає display:inline-block і тим перебиває стандартне
   [hidden]{display:none} — без цього рядка кнопка «Показать ещё»
   видно навіть тоді, коли показувати вже нічого. */
[hidden]{ display:none !important; }

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  font-size:14px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

/* ---------------- Шапка ---------------- */
.bar{
  display:flex; flex-wrap:wrap; align-items:center; gap:16px;
  padding:16px 24px;
  border-bottom:1px solid var(--line);
  background:rgba(10,10,11,.9);
  position:sticky; top:0; z-index:10;
}
.bar h1{
  font-family:var(--font-display);
  font-weight:500; font-size:22px; letter-spacing:.04em;
  color:var(--sand-bright);
  margin:0;
}
.bar-tools{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-left:auto; }

input, select, textarea{
  font-family:var(--font-body);
  font-size:14px;
  color:var(--text);
  background:#111114;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:8px 11px;
}
input:focus, select:focus, textarea:focus{ outline:none; border-color:var(--sand); }
#q{ min-width:280px; }

.btn{
  display:inline-block;
  font-family:var(--font-display);
  font-size:14px; letter-spacing:.04em;
  text-decoration:none;
  padding:8px 18px;
  border-radius:var(--radius);
  border:1px solid transparent;
  background:var(--sand); color:#141414;
  cursor:pointer;
}
.btn:hover{ background:var(--sand-bright); }
.btn-ghost{ background:transparent; color:var(--sand); border-color:var(--sand-dim); }
.btn-ghost:hover{ background:rgba(217,195,154,.1); }
.btn[disabled]{ opacity:.5; cursor:default; }

.counts{
  margin:0;
  padding:10px 24px;
  font-size:13px;
  color:var(--text-dim);
  border-bottom:1px solid var(--line);
}
.counts:empty{ display:none; }

/* ---------------- Двоколонка ---------------- */
.layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px, 420px);
  gap:0;
  align-items:start;
}
.list-pane{ padding:0 0 40px; min-width:0; }
.detail-pane{
  border-left:1px solid var(--line);
  padding:22px 24px 40px;
  position:sticky; top:74px;
  max-height:calc(100vh - 74px);
  overflow-y:auto;
}
.detail-empty{ color:var(--text-dim); margin:0; }

/* ---------------- Таблиця ---------------- */
.list{
  width:100%;
  border-collapse:collapse;
}
.list th{
  text-align:left;
  font-family:var(--font-display);
  font-weight:500; font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--sand-dim);
  padding:12px 14px;
  border-bottom:1px solid var(--line);
  white-space:nowrap;
}
.list td{
  padding:11px 14px;
  border-bottom:1px solid var(--line);
  vertical-align:top;
}
.list tbody tr{ cursor:pointer; }
.list tbody tr:hover{ background:var(--bg-panel); }
.list tbody tr.is-active{ background:var(--bg-soft); box-shadow:inset 3px 0 0 var(--sand); }

.col-age{ width:64px; }
.cell-date{ color:var(--text-dim); white-space:nowrap; font-size:13px; }
.cell-name{ color:var(--sand-bright); font-weight:600; }

/* стан заявки — крапка й підпис, без строкатих плашок */
.badge{ display:inline-flex; align-items:center; gap:7px; white-space:nowrap; font-size:13px; }
.badge::before{
  content:""; width:7px; height:7px; border-radius:50%;
  background:var(--text-dim);
}
.badge-new::before{ background:var(--sand); }
.badge-in_review::before{ background:#7fa8c9; }
.badge-accepted::before{ background:#8fbf8f; }
.badge-rejected::before{ background:var(--danger); }

.list-status{
  padding:16px 24px;
  color:var(--text-dim);
  margin:0;
}
.list-status:empty{ display:none; }
#more{ margin:8px 24px; }

/* ---------------- Картка заявки ---------------- */
.detail h2{
  font-family:var(--font-display);
  font-weight:500; font-size:20px;
  color:var(--sand-bright);
  margin:0 0 4px;
}
.detail-sub{ color:var(--text-dim); font-size:13px; margin:0 0 20px; }

.detail dl{ margin:0 0 20px; }
.detail dt{
  font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--sand-dim);
  margin-top:14px;
}
.detail dd{ margin:3px 0 0; }
.detail dd.about{ white-space:pre-wrap; }

.detail-field{ margin-bottom:16px; }
.detail-field label{
  display:block;
  font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--sand-dim);
  margin-bottom:6px;
}
.detail-field select,
.detail-field textarea{ width:100%; }
.detail-field textarea{ min-height:90px; resize:vertical; }

.detail-actions{ display:flex; align-items:center; gap:14px; }
.save-status{ font-size:13px; color:var(--text-dim); }
.save-status.is-ok{ color:var(--sand-bright); }
.save-status.is-error{ color:var(--danger); }

/* ---------------- Вузький екран ---------------- */
@media (max-width: 900px){
  .layout{ grid-template-columns:1fr; }
  .detail-pane{
    border-left:none;
    border-top:1px solid var(--line);
    position:static;
    max-height:none;
  }
  .bar-tools{ margin-left:0; width:100%; }
  #q{ flex:1 1 100%; min-width:0; }
}