:root { --pph-navy: #123047; --pph-navy-deep: #0b2234; --pph-accent: #198754; --pph-accent-dark: #126b42; --pph-surface: #fff; --pph-page: #f4f7fa; --pph-border: #dce4ea; --pph-muted: #617080; --pph-radius: 12px; --pph-shadow: 0 6px 20px rgba(15,42,61,.08); }
body { min-height: 100vh; color: #1e2d3a; background: var(--pph-page); font-family: Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.app-shell { min-height: 100vh; }.app-header { background: var(--pph-navy-deep); box-shadow: 0 2px 10px rgba(7,26,40,.18); }.app-navbar { min-height: 60px; }.app-brand { color:#fff; font-size:1.15rem; font-weight:750; letter-spacing:.035em; text-decoration:none; }.app-brand span { color:#7de0b0; }.app-user { color:#d5e1e9; font-size:.875rem; }
.app-nav { background:#fff; border-bottom:1px solid var(--pph-border); box-shadow:0 1px 3px rgba(15,42,61,.03); }.app-nav .nav-link { border-radius:7px; color:#536473; font-size:.9rem; font-weight:600; margin:.25rem .15rem; padding:.5rem .7rem; }.app-nav .nav-link:hover,.app-nav .nav-link.active { background:#e7f3ed; color:var(--pph-accent-dark); }.app-nav .nav-link.text-danger:hover,.app-nav .nav-link.text-danger.active { background:#fff0f0; color:#b42318!important; }
.page-content { padding-top:2rem; padding-bottom:3rem; }.page-heading { align-items:flex-start; display:flex; gap:1rem; justify-content:space-between; margin-bottom:1.5rem; }.page-eyebrow { color:var(--pph-accent-dark); font-size:.72rem; font-weight:800; letter-spacing:.1em; margin:0 0 .25rem; text-transform:uppercase; }.page-title { color:var(--pph-navy); font-size:clamp(1.5rem,2vw,2rem); font-weight:750; letter-spacing:-.025em; margin:0; }.page-description { color:var(--pph-muted); margin:.35rem 0 0; }
.content-card,.filter-card,.form-card { background:var(--pph-surface); border:1px solid var(--pph-border); border-radius:var(--pph-radius); box-shadow:var(--pph-shadow); }.content-card { overflow:hidden; }.filter-card { box-shadow:none; margin-bottom:1.25rem; padding:1rem; }.filter-form { align-items:end; display:flex; gap:.6rem; }.filter-field { flex:1 1 auto; min-width:0; }.filter-form .form-label { display:block; margin-bottom:.3rem; }.form-card { padding:clamp(1.25rem,3vw,2rem); }.table-responsive { margin:0; }.table { --bs-table-bg:transparent; --bs-table-striped-bg:#f8fafb; --bs-table-hover-bg:#eef6f1; margin-bottom:0; }.table > :not(caption) > * > * { border-bottom-color:#e8edf1; padding:.82rem .9rem; vertical-align:middle; }.table thead th { background:#f0f4f7; border-bottom:1px solid var(--pph-border); color:#425565; font-size:.75rem; font-weight:800; letter-spacing:.045em; text-transform:uppercase; white-space:nowrap; }.table .form-check-input { cursor:pointer; height:1.18rem; width:1.18rem; }.status-check { cursor:default!important; pointer-events:none; }
.btn { border-radius:8px; font-weight:650; padding:.5rem .9rem; }.btn-success { background:var(--pph-accent); border-color:var(--pph-accent); }.btn-success:hover,.btn-success:focus { background:var(--pph-accent-dark); border-color:var(--pph-accent-dark); }.btn-primary { background:var(--pph-navy); border-color:var(--pph-navy); }.btn-primary:hover,.btn-primary:focus { background:var(--pph-navy-deep); border-color:var(--pph-navy-deep); }.form-control,.form-select { border-color:#cbd6de; border-radius:8px; min-height:40px; }.form-control:focus,.form-select:focus { border-color:#61be8d; box-shadow:0 0 0 .22rem rgba(25,135,84,.14); }.form-label,legend { color:#405262; font-size:.86rem; font-weight:700; }
.dataTables_wrapper .row { align-items:center; margin:0; padding:.85rem 1rem; }.dataTables_wrapper .row:first-child { border-bottom:1px solid var(--pph-border); }.dataTables_wrapper .row:last-child { border-top:1px solid var(--pph-border); }.dt-input { border:1px solid #cbd6de!important; border-radius:7px!important; padding:.35rem .55rem!important; }
.login-page { align-items:center; background:radial-gradient(circle at 15% 15%,#dff2e8 0,transparent 27%),linear-gradient(135deg,#f1f5f8,#e8eff3); display:flex; min-height:100vh; }.login-card { border:0; border-radius:16px; box-shadow:0 18px 48px rgba(17,46,65,.16); overflow:hidden; }.login-card .card-body { padding:2rem; }.login-mark { background:var(--pph-navy); border-radius:6px; color:#fff; display:inline-block; font-size:.76rem; font-weight:800; letter-spacing:.045em; line-height:1.25; margin-bottom:1.25rem; max-width:100%; padding:.42rem .65rem; }.login-card h1 { color:var(--pph-navy); font-weight:750; letter-spacing:-.025em; }
@media (max-width:575.98px) { .page-content { padding-top:1.25rem; }.page-heading { flex-direction:column; margin-bottom:1rem; }.app-user { display:none; }.filter-form { align-items:stretch; flex-direction:column; }.filter-form .btn { width:100%; }.table > :not(caption) > * > * { padding:.7rem; }.dataTables_wrapper .row { padding:.75rem; } }
