2 lines
6.4 KiB
CSS
2 lines
6.4 KiB
CSS
:root{--kk-bg:#f6f7f8;--kk-surface:#ffffff;--kk-text:#151719;--kk-muted:#667085;--kk-border:#d9dee5;--kk-soft:#eef1f4;--kk-primary:#1f5f45;--kk-primary-dark:#123c2b;--kk-radius:10px;--kk-radius-sm:6px;--kk-shadow:0 10px 30px rgba(20,24,28,.06)}*{box-sizing:border-box}body{margin:0;background:var(--kk-bg);color:var(--kk-text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;line-height:1.5}.kk-navbar{background:rgba(255,255,255,.94);border-bottom:1px solid var(--kk-border);backdrop-filter:blur(10px)}.navbar-brand{font-weight:750;letter-spacing:-.02em}.brand-mark{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:6px;background:var(--kk-primary);color:#fff;font-weight:800}.nav-link{font-weight:600;color:#39404a}.nav-link:hover{color:var(--kk-primary)}.panel{background:var(--kk-surface);border:1px solid var(--kk-border);border-radius:var(--kk-radius);box-shadow:var(--kk-shadow);padding:24px}.hero{padding:32px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:800;color:var(--kk-primary);margin:0}h1{font-size:clamp(30px,4vw,48px);line-height:1.04;letter-spacing:-.05em;font-weight:820;margin:0 0 14px}h2{font-size:22px;letter-spacing:-.03em;font-weight:780;margin:0}.hero-copy{max-width:720px;color:var(--kk-muted);font-size:16px}.btn{border-radius:var(--kk-radius-sm);font-weight:700}.btn-lg{font-size:14px;padding:.75rem 1rem}.btn-dark{background:var(--kk-text);border-color:var(--kk-text)}.btn-dark:hover{background:var(--kk-primary-dark);border-color:var(--kk-primary-dark)}.btn-outline-dark{border-color:#aeb6c2}.company-card{border:1px solid var(--kk-border);border-radius:var(--kk-radius);padding:20px;background:#fafbfc}.meta-row{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-top:1px solid var(--kk-border)}.meta-row span{color:var(--kk-muted)}.meta-row strong{text-align:right}.stat-card{border:1px solid var(--kk-border);border-radius:var(--kk-radius);background:var(--kk-surface);padding:18px;min-height:98px}.stat-card span{display:block;color:var(--kk-muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.stat-card strong{display:block;margin-top:8px;font-size:24px;letter-spacing:-.04em}.section-heading{margin-bottom:18px}.form-label{font-size:12px;font-weight:750;color:#344054}.form-control,.form-select{border-color:var(--kk-border);border-radius:var(--kk-radius-sm);font-size:14px}.form-control:focus,.form-select:focus{border-color:var(--kk-primary);box-shadow:0 0 0 .2rem rgba(31,95,69,.12)}.kk-table{font-size:13px;margin-bottom:0}.kk-table thead th{color:#596273;text-transform:uppercase;font-size:11px;letter-spacing:.08em;background:#fafbfc;border-bottom:1px solid var(--kk-border)}.kk-table td{border-color:#eef1f4}.badge{border-radius:999px;font-weight:750}.empty-state{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:24px;border:1px dashed #b8c0cc;border-radius:var(--kk-radius);background:#fbfcfd;color:var(--kk-muted)}.empty-state strong{color:var(--kk-text)}.tracking-card{border:1px solid var(--kk-border);border-radius:var(--kk-radius);padding:20px;background:#fbfcfd}.tracking-card h3{font-size:26px;letter-spacing:-.04em;margin:0}.progress-steps{display:grid;gap:8px;list-style:none;padding:0;margin:0}.progress-steps li{position:relative;padding:10px 12px 10px 38px;border:1px solid var(--kk-border);border-radius:var(--kk-radius-sm);background:#fff;color:var(--kk-muted);font-weight:700}.progress-steps li:before{content:"";position:absolute;left:13px;top:13px;width:14px;height:14px;border:2px solid #c3cad5;border-radius:50%;background:#fff}.progress-steps li.done{border-color:#bed4c9;color:var(--kk-primary);background:#f6faf8}.progress-steps li.done:before{background:var(--kk-primary);border-color:var(--kk-primary)}.footer-line{color:var(--kk-muted);font-size:13px;border-top:1px solid var(--kk-border);padding-top:18px}.toast{border:1px solid var(--kk-border);box-shadow:var(--kk-shadow)}.detail-grid{display:grid;grid-template-columns:130px 1fr;gap:10px 16px}.detail-grid dt{color:var(--kk-muted);font-weight:750}.detail-grid dd{margin:0;font-weight:650}.print-body{background:#e9edf2}.print-sheet{max-width:920px;margin:24px auto;padding:0 16px}.print-actions{display:flex;justify-content:space-between;margin-bottom:12px}.doc-card{background:#fff;border:1px solid #cfd6df;border-radius:8px;padding:30px;color:#111}.doc-header{display:flex;justify-content:space-between;gap:24px;border-bottom:2px solid #111;padding-bottom:16px;margin-bottom:18px}.doc-header h1{font-size:28px;letter-spacing:-.04em;margin:0}.doc-header p{margin:5px 0 0;color:#555}.doc-number{text-align:right}.doc-number span,.doc-box span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#667085;font-weight:800}.doc-number strong{display:block;font-size:18px}.doc-title{text-align:center;text-transform:uppercase;letter-spacing:.14em;font-weight:850;border:1px solid #111;padding:9px;margin-bottom:16px}.doc-box{border:1px solid #cfd6df;border-radius:6px;padding:12px;min-height:78px}.doc-box strong{display:block}.doc-box small{color:#667085}.doc-table th{width:170px;background:#f6f7f8}.doc-table th,.doc-table td,.invoice-table th,.invoice-table td{border-color:#cfd6df}.invoice-table thead th{background:#111;color:#fff}.qc-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.qc-grid>div{border:1px solid #cfd6df;border-radius:6px;padding:12px}.qc-grid label{display:block;margin-top:10px}.signature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:46px}.signature-row div{text-align:center;border-top:1px solid #111;padding-top:10px;font-weight:750}.total-box{border:1px solid #cfd6df;border-radius:6px;overflow:hidden}.total-box div{display:flex;justify-content:space-between;padding:10px 12px;border-bottom:1px solid #e4e8ee}.total-box div:last-child{border-bottom:0}.total-box .remaining{background:#111;color:#fff}.payment-box{margin-top:18px;border:1px solid #cfd6df;border-radius:6px;padding:12px}.payment-box p{margin:6px 0 0;color:#555}@media (max-width:768px){.panel,.hero{padding:18px}.btn-group{display:grid}.detail-grid{grid-template-columns:1fr}.doc-header,.qc-grid{grid-template-columns:1fr;display:grid}.doc-number{text-align:left}.signature-row{gap:10px}}@media print{body{background:#fff}.print-sheet{margin:0;max-width:none;padding:0}.print-actions,.kk-navbar{display:none!important}.doc-card{border:0;border-radius:0;padding:0}.btn{display:none}}
|