UniformFlow/public/css/app.css

:root{--ink:#17201d;--muted:#6d7773;--line:#e3e8e5;--paper:#f5f7f4;--card:#fff;--green:#155f4d;--green2:#e2f1eb;--amber:#a76812;--rose:#a44747;--shadow:0 12px 35px rgba(24,48,39,.07)}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif}.app-shell{min-height:100vh;display:grid;grid-template-columns:248px 1fr}.sidebar{background:#14251f;color:#dce8e3;padding:28px 18px;display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;width:248px}.brand{display:flex;gap:12px;align-items:center;color:white;text-decoration:none;font-family:Manrope;font-weight:800;font-size:18px;padding:0 8px 34px}.brand small,.sidebar-foot small{display:block;color:#86a098;font:500 11px "DM Sans";margin-top:2px}.brand-mark{width:38px;height:38px;display:grid;place-items:center;background:#d3e7aa;color:#173028;border-radius:11px;font-size:13px}.sidebar nav{display:grid;gap:6px}.sidebar nav a{color:#9fb2ab;text-decoration:none;padding:12px 14px;border-radius:10px;display:flex;gap:12px;align-items:center;font-weight:600;font-size:14px}.sidebar nav a.active,.sidebar nav a:hover{color:white;background:#203b32}.sidebar-foot{margin-top:auto;border-top:1px solid #294239;padding:20px 8px 0;display:flex;gap:10px;align-items:center;font-size:12px}.sidebar-foot strong{display:block}.status-dot{width:8px;height:8px;border-radius:99px;background:#63ca98;display:inline-block}.app-shell>main{grid-column:2;min-width:0}.topbar{height:82px;background:rgba(255,255,255,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 38px;position:sticky;top:0;z-index:5}.topbar strong{display:block;font-family:Manrope;font-size:17px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:10px;font-weight:700;color:#82908b;display:block;margin-bottom:5px}.avatar{margin-left:auto;width:38px;height:38px;border-radius:50%;background:#d8e8df;color:#1e5d49;display:grid;place-items:center;font-size:12px;font-weight:700}.menu-button{display:none}.content{padding:34px 38px 70px;max-width:1500px;margin:auto}.page-intro{display:flex;justify-content:space-between;align-items:flex-end;margin:4px 0 28px;gap:20px}.page-intro h1{font:800 clamp(27px,3vw,42px) Manrope;margin:0;letter-spacing:-.04em}.page-intro h1 em{color:var(--green);font-style:normal}.page-intro p{margin:7px 0 0;color:var(--muted)}.button{border:0;border-radius:9px;padding:12px 17px;font:700 13px "DM Sans";text-decoration:none;cursor:pointer;text-align:center;display:inline-block}.button.primary{background:var(--green);color:white}.button.dark{background:#17201d;color:white}.danger-button{background:#a44747;color:white}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin-bottom:20px}.stat-card{background:white;border:1px solid var(--line);border-radius:14px;padding:20px;position:relative;box-shadow:var(--shadow)}.stat-card small{display:block;color:var(--muted);font-weight:600}.stat-card>strong{display:block;font:800 34px Manrope;margin:12px 0}.stat-card a{font-size:12px;color:var(--green);font-weight:700;text-decoration:none}.stat-icon{position:absolute;right:18px;top:18px;width:33px;height:33px;border-radius:9px;display:grid;place-items:center}.mint .stat-icon{background:#e2f1eb;color:#17634e}.blue .stat-icon{background:#e4edf4;color:#316985}.amber .stat-icon{background:#faefd9;color:#9a641d}.rose .stat-icon{background:#f5e5e5;color:#a44747}.two-column{display:grid;grid-template-columns:1fr 1fr;gap:20px}.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px;box-shadow:var(--shadow)}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.panel-head h2,.handover-start h2{margin:0;font:800 19px Manrope}.panel-head>a,.text-link,.back{color:var(--green);font-size:12px;font-weight:700;text-decoration:none}.list-row,.activity,.handover-item{display:flex;gap:13px;align-items:center;padding:13px 0;border-top:1px solid #edf0ee}.item-symbol{width:38px;height:38px;border-radius:10px;background:#edf2ef;color:#416056;display:grid;place-items:center;font-size:11px;font-weight:800;flex:none}.grow{flex:1}.list-row strong,.activity strong,.handover-item strong{display:block;font-size:13px}.list-row small,.activity small,.handover-item small,.block{display:block;color:var(--muted);font-size:11px;margin-top:3px}.pill{display:inline-block;border-radius:99px;padding:5px 9px;background:#edf1ef;color:#596662;font-weight:700;font-size:10px;white-space:nowrap}.pill.good{background:#e2f1eb;color:#17634e}.pill.warning{background:#fbefd8;color:#936018}.pill.danger{background:#f5e1e1;color:#a13e3e}.activity-dot{width:8px;height:8px;border-radius:50%;background:#d38742}.activity-dot.in{background:#55ab7f}.activity b{font-size:12px}.empty{text-align:center;color:var(--muted);padding:34px;font-size:13px}.forms-top{margin-bottom:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid .full{grid-column:1/-1}.form-stack{display:grid;gap:14px}label{font-size:11px;font-weight:700;color:#52605b}label>span{font-weight:400;color:#8d9793}input,select,textarea{width:100%;margin-top:6px;padding:11px 12px;border:1px solid #dce2df;border-radius:8px;background:white;color:var(--ink);font:500 13px "DM Sans"}input:focus,select:focus{outline:2px solid #b6d9ca;border-color:var(--green)}.table-panel{margin-top:20px;padding:0}.table-panel .panel-head{padding:21px 22px 4px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;color:#7a8782;font-size:10px;text-transform:uppercase;letter-spacing:.08em;padding:12px 20px;border-bottom:1px solid var(--line)}td{padding:14px 20px;border-bottom:1px solid #edf0ee;color:#40504a}tbody tr:hover{background:#fafcfb}.size-badge{width:31px;height:27px;border-radius:6px;background:#edf2ef;display:inline-grid;place-items:center;font-weight:800;color:#365348}.layout-aside{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;align-items:start}.sticky{position:sticky;top:105px}.search{display:flex}.search input{margin:0;border-radius:8px 0 0 8px}.search button{border:0;background:#21362f;color:white;border-radius:0 8px 8px 0;padding:0 12px}.pagination{padding:15px 20px}.pagination nav>div:first-child{display:none}.pagination nav>div:last-child{display:flex;justify-content:space-between;align-items:center}.pagination svg{width:16px}.pagination a,.pagination span{font-size:11px;color:var(--muted)}.profile-strip{display:grid;grid-template-columns:repeat(4,1fr);background:#20372f;color:white;border-radius:14px;padding:22px;margin-bottom:20px}.profile-strip>div{padding:0 22px;border-right:1px solid #3b5049}.profile-strip>div:last-child{border:0}.profile-strip small{display:block;color:#9db0a9;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.profile-strip strong{display:block;margin-top:6px;font-size:14px}.profile-strip .status-dot{margin-right:7px}.issue-form{margin-bottom:20px}.issue-grid{grid-template-columns:1.2fr 1.8fr .6fr .8fr 1fr auto;align-items:end}.issue-grid .button{margin-bottom:0}.handover-start{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.handover-start p{color:var(--muted);font-size:13px;margin:7px 0 0}.handover-start form{display:flex;gap:10px;min-width:430px}.handover-start select{margin:0}.handover-item label{min-width:280px}.handover-confirm{margin-top:20px;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:22px}.warning-box{background:#fff2dc;border-radius:9px;padding:12px 15px;font-size:11px;color:#805518}.warning-box strong,.warning-box span{display:block}.alert{padding:13px 16px;border-radius:10px;margin-bottom:18px;font-size:13px}.alert.success{background:#dff1e9;color:#175f4b}.alert.error{background:#f7e4e4;color:#983f3f}.alert ul{margin:7px 0 0}.back{display:block;margin-bottom:20px}
@media(max-width:1050px){.stats-grid{grid-template-columns:1fr 1fr}.layout-aside{grid-template-columns:1fr}.sticky{position:static}.issue-grid{grid-template-columns:1fr 1fr}.handover-confirm{grid-template-columns:1fr}.profile-strip{grid-template-columns:1fr 1fr;gap:20px}.profile-strip>div{border:0}}
@media(max-width:760px){.app-shell{display:block}.sidebar{transform:translateX(-100%);transition:.2s;z-index:20}.menu-open .sidebar{transform:translateX(0)}.app-shell>main{display:block}.menu-button{display:block;border:0;background:none;font-size:20px;margin-right:15px}.content{padding:24px 16px}.topbar{padding:0 16px}.stats-grid,.two-column,.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.page-intro{align-items:flex-start;flex-direction:column}.handover-start{align-items:stretch;flex-direction:column;gap:20px}.handover-start form{min-width:0;flex-direction:column}.handover-item{align-items:flex-start;flex-wrap:wrap}.handover-item label{min-width:100%;padding-left:51px}.profile-strip{grid-template-columns:1fr}.stats-grid{gap:10px}.panel{padding:16px}}