/* Open Items section of the dashboard. Palette tokens come from the shell (:root in index.html).
   Dark in both OS schemes by design; every text colour sits on an explicit background. */
body.sec-items .wrap{max-width:1180px}

.it-today{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.it-chip{background:var(--card);border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:7px 13px;font-size:13px;display:inline-flex;gap:8px;align-items:center}
.it-chip b{color:var(--text);font-weight:600}
.it-chip.hot b{color:var(--red)}
.it-chip.warm b{color:var(--gold)}
.it-chip.on{border-color:var(--gold);color:var(--text);background:var(--raise)}
.it-chip:hover{border-color:var(--faint);color:var(--text)}
.it-quiet{color:var(--faint);font-size:13px}

.it-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:18px}
.it-bar select{flex:0 1 auto;max-width:100%;background:var(--card);color:var(--muted);border:1px solid var(--line);border-radius:10px;padding:8px 32px 8px 12px;font:inherit;font-size:13px;
  appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236F6555' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
.it-bar select:focus{outline:none;border-color:var(--gold);color:var(--text)}
.it-bar select.set{color:var(--text);border-color:var(--faint)}
.it-add{margin-left:auto;background:var(--gold);color:#241F16;font-weight:600;padding:9px 16px;border-radius:999px}
.it-add:hover{background:#FFC449}

.it-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
.it-col h3{margin:0 0 10px;font-size:11px;font-weight:600;letter-spacing:1.3px;text-transform:uppercase;color:var(--faint);display:flex;align-items:center;gap:8px}
.it-col h3 .n{color:var(--muted);font-weight:600;letter-spacing:0}
.it-group{font-size:12px;color:var(--muted);font-weight:600;margin:14px 0 6px;padding-left:2px}
.it-group:first-child{margin-top:0}
.it-none{color:var(--faint);font-size:13px;padding:14px 2px}

.it{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:8px}
.it.overdue{border-color:rgba(220,29,38,.55)}
.it.today{border-color:rgba(224,164,73,.6)}
.it-title{font-size:14.5px;font-weight:600;color:var(--text);line-height:1.45}
.it-meta{color:var(--muted);font-size:12.5px;margin-top:4px;line-height:1.5}
.it-meta .who{color:var(--text);font-weight:500}
.it-badge{display:inline-block;padding:1px 8px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.3px;margin-left:6px;vertical-align:1px}
.it-badge.due{background:rgba(224,164,73,.16);color:var(--gold)}
.it-badge.over{background:rgba(220,29,38,.16);color:#F28B90}
.it-badge.rem{background:var(--raise);color:var(--muted)}
.it-badge.reply{background:rgba(111,191,115,.16);color:#8FD093}
.it-next{color:var(--text);font-size:13px;margin-top:8px;line-height:1.5}
.it-next span{color:var(--faint)}
.it-detail{color:var(--muted);font-size:12.5px;margin-top:6px;line-height:1.55;white-space:pre-wrap}
.it-links{margin-top:8px;display:flex;gap:6px 12px;flex-wrap:wrap}
.it-links a{color:var(--gold);font-size:12.5px;text-decoration:none;border-bottom:1px solid rgba(224,164,73,.35)}
.it-links a:hover{color:#FFC449;border-color:#FFC449}
.it-acts{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.it-acts button{background:transparent;border:1px solid var(--line);color:var(--muted);font-size:12.5px;padding:6px 11px;border-radius:9px}
.it-acts button:hover{color:var(--text);border-color:var(--faint)}
.it-acts button.go{background:var(--gold);color:#241F16;border-color:var(--gold);font-weight:600}
.it-acts button.go:hover{background:#FFC449;border-color:#FFC449}
.it-closed{color:var(--faint);font-size:12.5px;margin-top:6px}

.it-pop{margin-top:10px;padding:10px 12px;background:var(--page);border:1px solid var(--line);border-radius:10px;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.it-pop input{background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:6px 9px;font:inherit;font-size:13px}
.it-pop input[type=text]{flex:1;min-width:160px}
.it-pop input:focus{outline:none;border-color:var(--gold)}
.it-pop button{background:transparent;border:1px solid var(--line);color:var(--muted);font-size:12.5px;padding:6px 10px;border-radius:8px}
.it-pop button:hover{color:var(--text);border-color:var(--faint)}
.it-pop button.go{background:var(--gold);color:#241F16;border-color:var(--gold);font-weight:600}
.it-pop button.go:hover{background:#FFC449}

/* Add / edit form */
.it-form{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px 22px;margin-bottom:18px}
.it-form h3{margin:0 0 14px;font-size:15px;font-weight:600;color:var(--text)}
.it-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
.it-grid .full{grid-column:1/-1}
.it-f label{display:block;font-size:11.5px;color:var(--faint);letter-spacing:.3px;margin-bottom:5px}
.it-f input,.it-f select,.it-f textarea{width:100%;background:var(--page);color:var(--text);border:1px solid var(--line);border-radius:10px;padding:9px 12px;font:inherit;font-size:14px}
.it-f textarea{min-height:64px;resize:vertical}
.it-f input:focus,.it-f select:focus,.it-f textarea:focus{outline:none;border-color:var(--gold)}
.it-f input[type=date]{color-scheme:dark}
.it-seg{display:inline-flex;background:var(--page);border:1px solid var(--line);border-radius:10px;padding:3px}
.it-seg button{background:transparent;border:none;color:var(--muted);font-size:13px;padding:7px 13px;border-radius:8px}
.it-seg button.on{background:var(--raise);color:var(--text);font-weight:600}
.it-formacts{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap;align-items:center}
.it-formacts .go{background:var(--gold);color:#241F16;font-weight:600;padding:10px 18px;border-radius:999px}
.it-formacts .go:hover{background:#FFC449}
.it-formacts .cancel{background:transparent;color:var(--muted);border:1px solid var(--line);padding:9px 16px;border-radius:999px}
.it-formacts .cancel:hover{color:var(--text);border-color:var(--faint)}
.it-formacts .del{margin-left:auto}
.it-hist{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.it-hist div{font-size:12.5px;color:var(--muted);padding:3px 0;line-height:1.5}
.it-hist div span{color:var(--faint);margin-right:8px;white-space:nowrap}
.it-err{background:rgba(220,29,38,.10);border:1px solid rgba(220,29,38,.45);color:#f0b8b3;border-radius:10px;padding:10px 14px;font-size:13.5px;margin-bottom:12px}

@media (max-width:900px){
  .it-cols{grid-template-columns:1fr}
  .it-col{margin-bottom:10px}
}
@media (max-width:520px){
  .it-grid{grid-template-columns:1fr}
  .it-add{margin-left:0;width:100%}
  .it-bar select{flex:1 1 140px;min-width:0}
  .it-acts button{flex:1 1 auto}
}