/* Flatiron Client Dashboard: additions to the FLG kit styles */
.demo-bar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; background: #eef8f1; border-color: #b9e0c6; }
.demo-bar select { max-width: 520px; }
.demo-bar .expect { color: var(--ink-2); font-size: 13px; }
.mcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; margin: 0 0 18px; }
.mcard { background: var(--panel); border: 1px solid var(--rule); border-radius: 10px; padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; color: inherit; text-decoration: none; }
.mcard:hover { border-color: var(--accent); text-decoration: none; box-shadow: 0 2px 10px rgba(31, 78, 156, .08); }
.mcard .code { font-weight: 700; font-size: 17px; color: var(--ink); }
.mcard .ttl { color: var(--ink-2); font-size: 14px; margin-top: -4px; }
.mcard .meta { display: flex; gap: 8px; flex-wrap: wrap; font-size: 13px; color: var(--ink-2); }
.mcard .next { font-size: 13px; }
.mcard .waiting { font-weight: 700; color: var(--warn); }
.phasebar { display: grid; grid-template-columns: repeat(12, 1fr); gap: 2px; margin: 2px 0; }
.phasebar i { height: 8px; border-radius: 2px; background: var(--rule-2); }
.phasebar i.done { background: #9cc3ef; } .phasebar i.now { background: var(--accent); }
.phasebar.big i { height: 14px; }
.phaselabel { font-size: 13px; color: var(--ink-2); }
.phaselabel b { color: var(--ink); }
.phasenames { display: grid; grid-template-columns: repeat(12, 1fr); gap: 2px; font-size: 10.5px; color: var(--ink-3); line-height: 1.15; margin-top: 3px; }
.phasenames span.now { color: var(--accent); font-weight: 700; }
.badge.t0 { background: #eef1f5; color: #4a5568; } .badge.t1 { background: #e7f0fb; color: #1f4e9c; }
.badge.t2 { background: #fde3e1; color: #b42318; } .badge.t3 { background: #172033; color: #f2c14e; }
.waitme { display: grid; gap: 8px; }
.wrow { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; background: var(--panel); border: 1px solid var(--rule); border-left: 4px solid #eda100; border-radius: 8px; padding: 10px 12px; }
.wrow.overdue { border-left-color: var(--err); } .wrow.sent { border-left-color: var(--ok); opacity: .85; }
.wrow .wt { flex: 1; min-width: 200px; } .wrow .wt b { display: block; }
.team { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.tcard { background: var(--panel); border: 1px solid var(--rule); border-radius: 8px; padding: 10px 12px; font-size: 14px; }
.tcard.flg { border-left: 4px solid var(--accent); }
.tcard .r { color: var(--ink-2); font-size: 13px; }
.upd { background: var(--panel); border: 1px solid var(--rule); border-radius: 8px; padding: 12px 14px; margin-bottom: 10px; }
.upd h4 { margin: 0 0 4px; font-size: 15px; } .upd .by { color: var(--ink-3); font-size: 12px; margin-bottom: 6px; }
.access-note { font-size: 13px; color: var(--ink-2); background: #f6f7f9; border: 1px dashed var(--rule); border-radius: 8px; padding: 8px 12px; margin-bottom: 14px; }
.pagesec { margin: 0 0 18px; }
.sechead { cursor: pointer; user-select: none; display: flex; align-items: baseline; gap: 6px; border-bottom: 2px solid var(--rule); padding-bottom: 6px; }
.sechead .grp-caret { display: inline-block; width: 16px; transition: transform .12s; color: var(--ink-3); }
.pagesec.closed .sechead .grp-caret { transform: rotate(-90deg); }
.pagesec.closed .secbody { display: none; }
.secsub { font-weight: 400; font-size: 13px; color: var(--ink-3); }
.summary { font-size: 15px; line-height: 1.5; max-width: 900px; }
.ask-team { display: flex; gap: 8px; flex-wrap: wrap; } .ask-team textarea { flex: 1; min-width: 260px; }
dialog.ack { max-width: 560px; border: 1px solid var(--rule); border-radius: 10px; padding: 22px 24px; }
dialog.ack h3 { margin-top: 0; }
@media (max-width: 760px) { .mcards { grid-template-columns: 1fr; } .phasenames { display: none; } }
.noteform { flex-basis: 100%; display: flex; gap: 8px; flex-wrap: wrap; }
.noteform textarea { flex: 1; min-width: 0; }
/* 1.1: "View as" preview, stand-in notice, Refresh data, access request */
.preview-bar { background: #fff6e0; border-color: #f0cf7a; }
.client-bar { justify-content: space-between; }
.srcline { flex-basis: 100%; font-size: 12.5px; color: var(--ink-2); }
.stand-in { color: #8a5a00; font-weight: 600; }
.req-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; } .req-row textarea { flex: 1; min-width: 240px; }