/* President overview extends the shared screen, card, filter and table system. */
.president-dashboard { display:grid; gap:18px; min-width:0; }
.president-dashboard .content-card { padding:22px; min-width:0; }
.president-dashboard h2 { margin:0 0 8px; font-size:1.25rem; }
.president-dashboard p { color:#59665d; }
.president-context { font-size:.8rem; margin:0; }
.president-overview { display:flex; gap:16px; align-items:center; padding:20px 24px; border-radius:14px; border:1px solid #d6ded8; }
.president-overview p { margin:4px 0 0; }
.president-dashboard .healthy, .president-dashboard .completed { background:#edf6ef; color:#285d3a; }
.president-dashboard .overdue, .president-dashboard .blocked { background:#fff0ed; color:#9e322b; }
.president-dashboard .unknown { background:#fff8e6; color:#775a18; }
.president-charts { display:grid; grid-template-columns:1fr 1.2fr 1fr; gap:16px; }
.president-charts p { font-size:.8rem; min-height:32px; }
.president-donut-row { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:20px; }
.president-donut { width:160px; height:160px; border-radius:50%; border:0; padding:15px; background:conic-gradient(#47805a var(--recorded),#c75548 0); cursor:pointer; flex-shrink:0; }
.president-donut > span { border-radius:50%; background:white; width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; color:#243c2c; }
.president-donut strong { font-size:2rem; }
.president-donut small { max-width:100px; }
.president-legend { display:grid; gap:12px; }
.president-legend button { background:none; border:0; display:flex; align-items:center; gap:7px; padding:6px; color:inherit; cursor:pointer; }
.president-legend i { width:12px; height:12px; border:1px solid currentColor; border-radius:50%; }
.president-bars { display:grid; gap:12px; }
.president-bars button { display:grid; grid-template-columns:125px 1fr 24px; align-items:center; gap:10px; border:0; background:none; text-align:left; color:inherit; font-size:.8rem; cursor:pointer; padding:5px 0; }
.president-bar { height:17px; border-radius:5px; overflow:hidden; }
.president-bar > span { display:block; height:100%; background:currentColor; min-width:0; }
.president-weekly { display:flex; gap:12px; justify-content:space-around; margin:15px 0; }
.president-weekly button { min-width:0; display:grid; justify-items:center; gap:8px; border:0; background:none; color:inherit; cursor:pointer; }
.president-column { height:95px; width:28px; background:#f0f2ef; border-radius:5px; display:flex; align-items:flex-end; overflow:hidden; }
.president-column > span { width:100%; background:#c75548; }
.president-calendar { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:5px; }
.president-weekday { text-align:center; font-size:.75rem; padding:8px; }
.president-day { border:1px solid #e0e5df; min-height:86px; padding:7px; border-radius:7px; min-width:0; }
.president-day.today { border-color:#497655; }
.president-day > span { font-size:.75rem; }
.president-day button { display:grid; gap:4px; width:100%; border:0; border-radius:5px; padding:7px; margin-top:5px; text-align:left; cursor:pointer; overflow-wrap:anywhere; }
.president-day button strong { font-size:.75rem; }
.president-day button small { font-size:.65rem; }
.president-kanban { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.president-kanban > section { min-width:0; background:#f5f6f3; padding:12px; border-radius:12px; }
.president-kanban h3 { font-size:.9rem; display:flex; justify-content:space-between; margin:0 0 14px; }
.president-kanban > section > p { font-size:.8rem; }
.president-project { width:100%; display:grid; gap:8px; padding:14px; border:1px solid #d9e0da; border-radius:9px; text-align:left; cursor:pointer; margin-bottom:10px; overflow-wrap:anywhere; }
.president-project small { font-size:.75rem; }
.president-status { font-size:.75rem; font-weight:700; }
.president-track { height:7px; border-radius:4px; background:#dce5dd; display:block; overflow:hidden; }
.president-track > span { height:100%; background:#47805a; display:block; }
.president-nuclei { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.president-nucleus { display:grid; gap:10px; padding:16px; text-align:left; border:1px solid #dce2dc; border-radius:10px; cursor:pointer; }
.president-nucleus span,.president-nucleus small { font-size:.8rem; }
.president-detail { width:min(900px,calc(100vw - 28px)); max-height:85vh; border:1px solid #d9e0da; border-radius:16px; padding:24px; color:#25392c; }
.president-detail::backdrop { background:#12231788; }
.president-detail .screen-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.president-detail-project { border-top:1px solid #dce2dc; padding:14px 0; }
.president-task { display:grid; gap:5px; padding:12px; border:1px solid #e1e5df; border-radius:8px; margin:8px 0; }
.president-task.overdue { background:#fff0ed; }
.president-task span,.president-task small { font-size:.8rem; }
.president-dashboard button:focus-visible,.president-detail button:focus-visible { outline:3px solid #256b9c; outline-offset:3px; }
@media(max-width:1150px) { .president-charts { grid-template-columns:repeat(2,minmax(0,1fr)); } .president-charts > :last-child { grid-column:1/-1; } .president-kanban { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:700px) { .president-charts,.president-nuclei,.president-kanban { grid-template-columns:1fr; } .president-charts > :last-child { grid-column:auto; } .president-dashboard .content-card { padding:15px; } .president-overview { padding:16px; align-items:flex-start; } .president-dashboard .screen-heading { flex-wrap:wrap; } .president-calendar { grid-template-columns:1fr; } .president-weekday,.president-empty-day { display:none; } .president-day { min-height:38px; display:grid; grid-template-columns:24px 1fr; gap:5px; align-items:start; } .president-day button { grid-column:2; margin:0; } .president-detail { padding:16px; } .president-detail h2 { font-size:1.15rem; } }
.president-weekly button { padding:0; }
.president-weekly small { white-space:nowrap; }
.president-detail > .screen-heading { flex-direction:row; text-align:left; }
.president-detail > .screen-heading h2 { flex:1; min-width:0; margin:0; }
.president-detail > .screen-heading button { flex:0 0 auto; }