/* Tamas Tanya pitch kit - page level additions for the back office.
   Loaded after shared/admin.css. Only what the shared layer does not provide. */

/* page header */
.page-head { display: flex; align-items: baseline; gap: var(--s3); flex-wrap: wrap; margin-bottom: var(--s2); }
.page-head h2 { margin: 0; font-size: var(--fs-xl); }
.page-head .minta { flex: 0 0 auto; }
.page-intro { color: var(--muted); font-size: var(--fs-sm); margin: 0 0 var(--s5); max-width: 70ch; }

/* reset control in the top bar */
.top-reset {
  border: 1px solid rgba(253, 252, 249, .35); background: none; color: #e5e0d3;
  border-radius: var(--radius-pill); padding: 5px 12px; margin-left: var(--s3);
  font-size: 11px; font-weight: 700; cursor: pointer; white-space: nowrap; flex: 0 0 auto;
}
.top-reset:hover { background: rgba(253, 252, 249, .14); color: var(--cream); }
@media (max-width: 520px) { .app-top .app-title { display: none; } }

/* generic blocks */
.stack { display: grid; gap: var(--s4); }
.block { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--s4); }
.block > h3 { font-size: var(--fs-lg); margin: 0 0 var(--s2); }
.block > h3 + .block-sub { margin: 0 0 var(--s3); color: var(--muted); font-size: var(--fs-xs); }
.block-head { display: flex; align-items: center; justify-content: space-between; gap: var(--s3); flex-wrap: wrap; margin-bottom: var(--s3); }
.block-head h3 { margin: 0; font-size: var(--fs-lg); }
.count-badge {
  background: var(--forest); color: var(--cream); border-radius: var(--radius-pill);
  padding: 2px 10px; font-size: var(--fs-xs); font-weight: 700;
}
.note-card { background: var(--info-bg); border: 1px solid #bcd0dd; border-radius: var(--radius); padding: var(--s4); font-size: var(--fs-sm); }
.note-card h3 { font-size: var(--fs-md); margin: 0 0 var(--s2); }
.note-card p { margin: 0 0 var(--s2); }
.note-card p:last-child { margin-bottom: 0; }

/* two column layout on wide screens */
.cols { display: grid; gap: var(--s4); }
.cols > * { min-width: 0; }
@media (min-width: 900px) { .cols-2 { grid-template-columns: 1fr 1fr; } .cols-side { grid-template-columns: 1.35fr 1fr; } }

/* row list variant with actions */
.row-item.row-static { cursor: default; }
.row-actions { display: flex; gap: var(--s2); flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 560px) {
  .row-item { flex-wrap: wrap; }
  .row-actions { width: 100%; justify-content: flex-start; }
}

/* toasts */
.toast-host { position: fixed; left: 50%; transform: translateX(-50%); bottom: 92px; z-index: 80; display: grid; gap: var(--s2); width: max-content; max-width: 92vw; }
@media (min-width: 1024px) { .toast-host { bottom: var(--s5); } }

/* calendar day panel */
.day-panel { margin-top: var(--s4); }
.day-panel .detail-head { display: flex; align-items: center; gap: var(--s3); flex-wrap: wrap; }
.occ-bar { height: 8px; border-radius: var(--radius-pill); background: var(--line); overflow: hidden; margin-top: 6px; }
.occ-bar i { display: block; height: 100%; background: var(--forest); }

/* pipeline card actions */
.pipe-card .pc-row { display: flex; gap: 6px; margin-top: var(--s2); }
.pipe-card .pc-row .btn { flex: 1 1 0; }
.pc-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }

/* timeline */
.tl { list-style: none; margin: 0; padding: 0 0 0 var(--s4); border-left: 2px solid var(--line); }
.tl li { position: relative; padding: 0 0 var(--s4) var(--s4); font-size: var(--fs-sm); }
.tl li:last-child { padding-bottom: 0; }
.tl li::before { content: ""; position: absolute; left: -7px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background: var(--line); }
.tl li.is-done::before { background: var(--forest); }
.tl .tl-when { display: block; font-size: var(--fs-xs); color: var(--muted-soft); }

/* notes */
.note-list { list-style: none; margin: 0 0 var(--s3); padding: 0; display: grid; gap: var(--s2); }
.note-list li { background: var(--pale); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--s3); font-size: var(--fs-sm); }
.note-list .note-when { display: block; font-size: var(--fs-xs); color: var(--muted-soft); }

/* email preview inside the back office */
.mail { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.mail-head { padding: var(--s3) var(--s4); border-bottom: 1px solid var(--line); background: var(--pale); font-size: var(--fs-xs); color: var(--muted); }
.mail-subject { display: block; font-family: var(--font-head); font-size: var(--fs-lg); color: var(--forest-dark); margin-top: 4px; }
.mail-body { padding: var(--s4); font-size: var(--fs-sm); white-space: pre-wrap; }

/* photo picker */
.thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: var(--s2); }
.thumb { border: 2px solid transparent; border-radius: var(--radius); overflow: hidden; padding: 0; background: none; cursor: pointer; }
.thumb img { width: 100%; height: 58px; object-fit: cover; }
.thumb.is-selected { border-color: var(--gold); }
.upload-preview { margin-top: var(--s3); }
.upload-preview img { border-radius: var(--radius); max-height: 180px; object-fit: cover; width: 100%; }

/* small inline number input in tables */
.num-input { width: 118px; text-align: right; padding: 6px 8px; }
table.tt input.num-input { font-size: var(--fs-sm); }
table.tt td, table.tt th { white-space: nowrap; }
table.tt td.wrap, table.tt th.wrap { white-space: normal; min-width: 150px; }

/* key value grid */
.kv { display: grid; grid-template-columns: 1fr auto; gap: 6px var(--s4); font-size: var(--fs-sm); }
.kv dt { color: var(--muted); margin: 0; }
.kv dd { margin: 0; font-weight: 700; text-align: right; }

/* filters row */
.filters { display: flex; gap: var(--s3); flex-wrap: wrap; align-items: flex-end; margin-bottom: var(--s4); }
.filters .field { margin-bottom: 0; min-width: 170px; }

/* aktualis editor list */
.akt-item { display: flex; gap: var(--s3); align-items: flex-start; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--s3); }
.akt-item img { width: 74px; height: 56px; object-fit: cover; border-radius: var(--radius); flex: 0 0 auto; }
.akt-item .akt-main { flex: 1 1 auto; min-width: 0; }
.akt-item .akt-title { font-weight: 700; color: var(--forest-dark); }
.akt-item .akt-meta { font-size: var(--fs-xs); color: var(--muted); }
.akt-item .akt-text { font-size: var(--fs-sm); color: var(--muted); margin-top: 4px; }
.akt-actions { display: flex; flex-direction: column; gap: 6px; flex: 0 0 auto; }
@media (max-width: 520px) { .akt-item { flex-wrap: wrap; } .akt-actions { flex-direction: row; width: 100%; } }

/* bar chart labels */
.bars { height: 180px; }
.bars .bar i { min-height: 3px; }

/* approval queue */
.queue-item { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--s4); display: grid; gap: var(--s3); }
.queue-item .qi-head { display: flex; justify-content: space-between; gap: var(--s3); flex-wrap: wrap; align-items: center; }

/* nothing may push the page sideways on a phone */
.app-main { overflow-x: clip; }