:root{--primary: #6366f1;--primary-hover: #4f46e5;--bg-body: #f8fafc;--text-main: #0f172a;--text-muted: #64748b;--success: #10b981;--warning: #f59e0b;--danger: #ef4444;--shadow-card: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-hover: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--radius: 16px}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;width:100%;overflow-x:hidden}body{font-family:Plus Jakarta Sans,Inter,sans-serif;background-color:var(--bg-body);color:var(--text-main);line-height:1.6;-webkit-font-smoothing:antialiased;background-image:radial-gradient(at 0% 0%,rgba(99,102,241,.15) 0px,transparent 50%),radial-gradient(at 100% 0%,rgba(168,85,247,.1) 0px,transparent 50%);background-attachment:fixed}#root{height:100%}.center-screen{display:flex;justify-content:center;align-items:center;height:100vh;height:100dvh;width:100%;padding:1rem}.center-screen .card{background:#ffffffbf;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:2.5rem;border-radius:24px;box-shadow:var(--shadow-hover);border:1px solid rgba(255,255,255,.6)}.center-screen h2{color:var(--primary);font-weight:800}.container{max-width:1100px;margin:0 auto;padding:1rem}.form-group{margin-bottom:1.25rem}input{width:100%;padding:.875rem 1rem;border:1px solid #e2e8f0;border-radius:12px;font-size:.95rem;background:#fff;transition:all .2s ease;outline:none}input:focus{border-color:var(--primary);box-shadow:0 0 0 4px #6366f11a}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;border-radius:12px;font-weight:600;border:none;cursor:pointer;transition:all .2s;gap:.5rem}.btn:active{transform:scale(.96)}.btn-full{width:100%}.btn-primary{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;box-shadow:0 4px 12px #6366f140}.btn-danger{background:#fff;color:#ef4444;border:1px solid #fee2e2}.btn-success{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.create-bar{display:flex;gap:.75rem;background:#fff;padding:1rem;border-radius:var(--radius);box-shadow:var(--shadow-card);margin-bottom:2rem}.table-container{border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:var(--shadow-card);border:1px solid #f1f5f9}table{width:100%;border-collapse:collapse}th{background:#f8fafc;padding:1rem;font-size:.75rem;font-weight:700;text-transform:uppercase;color:var(--text-muted);text-align:left}td{padding:1rem;border-bottom:1px solid #f1f5f9;vertical-align:middle}tr:last-child td{border-bottom:none}.badge{display:inline-flex;align-items:center;padding:.35em .85em;border-radius:20px;font-size:.75rem;font-weight:700;text-transform:uppercase}.badge:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:6px}.status-DRAFT{background:#f1f5f9;color:#475569;border:1px solid #e2e8f0}.status-DRAFT:before{background:#94a3b8}.status-UNDER_APPROVAL{background:#fffbeb;color:#b45309;border:1px solid #fef3c7}.status-UNDER_APPROVAL:before{background:#f59e0b}.status-APPROVED{background:#ecfdf5;color:#047857;border:1px solid #a7f3d0}.status-APPROVED:before{background:#10b981}@media screen and (max-width:768px){.dashboard-header{flex-direction:column;align-items:flex-start}.create-bar{flex-direction:column}table thead{display:none}table,tbody,tr,td{display:block;width:100%}table tr{margin-bottom:1rem;border:1px solid #e2e8f0;border-radius:16px;background:#fff;box-shadow:var(--shadow-card);padding:1.25rem}table td{display:flex;justify-content:space-between;align-items:flex-start;padding:.75rem 0;border-bottom:none;text-align:right}table td:before{content:attr(data-label);font-weight:700;font-size:.7rem;color:#94a3b8;text-transform:uppercase;margin-right:1rem}.cell-content{display:flex;flex-direction:column;align-items:flex-end;text-align:right;gap:4px}.cell-content div:first-child{font-size:1rem;color:var(--text-main)}table td[data-label=Action]{margin-top:.5rem;padding-top:1rem;border-top:1px solid #f1f5f9;display:flex;justify-content:flex-end}.btn-dashboard{width:100%}}
