/* MAI Pembelian ISO: styles are scoped under .mai-app to avoid theme conflicts. */
.mai-app{--mai-green:#14532d;--mai-dark:#153c2d;--mai-mint:#eaf4e9;--mai-gold:#d5a94f;--mai-line:#dfe9e3;--mai-ink:#172b23;--mai-slate:#61716a;--mai-bg:#f6f8f6;color:var(--mai-ink);font:400 15px/1.55 system-ui,-apple-system,"Segoe UI",Arial,sans-serif;background:var(--mai-bg);border:1px solid var(--mai-line);border-radius:18px;overflow:hidden;margin:18px auto 40px;box-shadow:0 14px 40px rgba(11,61,34,.06);max-width:1160px}
.mai-app *{box-sizing:border-box}.mai-app p{margin:0 0 16px}.mai-app h1,.mai-app h2,.mai-app h3{font-family:inherit;color:var(--mai-ink);line-height:1.2;margin:0;font-weight:750}.mai-app h1{font-size:clamp(25px,3vw,35px);letter-spacing:-.025em}.mai-app h2{font-size:21px}.mai-app h3{font-size:16px;margin:30px 0 16px;padding-left:12px;border-left:3px solid var(--mai-gold)}.mai-app a{text-decoration:none}.mai-app a:hover{text-decoration:underline}.mai-app button,.mai-app input,.mai-app select,.mai-app textarea{font:inherit}
.mai-top{background:linear-gradient(110deg,#10452b,#1d6540);padding:18px 32px;color:#fff;display:flex;justify-content:space-between;gap:12px;align-items:center;border-bottom:4px solid var(--mai-gold)}.mai-brand{display:flex;align-items:center;gap:13px}.mai-mark{background:#fff;color:#125233;font-size:20px;font-weight:900;letter-spacing:-.055em;padding:12px 9px;border-radius:12px}.mai-brand-name{font-size:15px;font-weight:800;letter-spacing:.08em}.mai-brand-desc{font-size:11px;color:#d0ecda}.mai-top-user{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:12px}.mai-top-user a{color:#f5d584;font-weight:700}.mai-shell{padding:32px}.mai-heading{display:flex;justify-content:space-between;align-items:center;gap:22px;margin-bottom:25px}.mai-heading p{color:var(--mai-slate);margin:9px 0 0;font-size:14px}.mai-eyebrow{display:inline-block;color:#24724a;font-size:10px;letter-spacing:.14em;font-weight:800;margin-bottom:6px}.mai-code{border:1px solid var(--mai-line);background:#fff;border-radius:12px;padding:12px;text-align:right;white-space:nowrap;font-size:12px;font-weight:750}.mai-code small{display:block;font-weight:400;color:var(--mai-slate);font-size:10px;margin-top:3px}.mai-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:19px}.mai-stat{background:#fff;border:1px solid var(--mai-line);border-radius:14px;padding:20px;box-shadow:0 2px 9px rgba(20,83,45,.025)}.mai-stat:before{content:"";display:block;height:3px;width:28px;background:var(--mai-gold);border-radius:4px;margin-bottom:12px}.mai-stat span{font-size:12px;color:var(--mai-slate);display:block}.mai-stat strong{display:block;font-size:30px;color:var(--mai-dark);line-height:1.3;margin-top:5px;font-variant-numeric:tabular-nums}
.mai-panel{background:#fff;border:1px solid var(--mai-line);border-radius:15px;padding:25px;margin-bottom:20px}.mai-panel-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.mai-panel-head p{font-size:13px;color:var(--mai-slate);margin:5px 0 0}.mai-bubble{background:var(--mai-mint);color:var(--mai-green);font-size:12px;font-weight:800;padding:8px 12px;border-radius:30px}.mai-btn{background:var(--mai-green);border:1px solid var(--mai-green);border-radius:9px;min-height:41px;color:#fff!important;padding:10px 17px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:750;cursor:pointer;white-space:normal;text-align:center;transition:transform .15s,background .15s}.mai-btn:hover{background:#0d3e22;transform:translateY(-1px);text-decoration:none!important}.mai-btn-outline{background:#fff;color:var(--mai-green)!important;border-color:#a3cbb0}.mai-btn-outline:hover{background:#f3f9f3}.mai-btn-warning{background:#fff9ea;border-color:#e2bd6e;color:#7e5500!important}.mai-btn-warning:hover{background:#fff1cb}.mai-link{color:#166139;font-size:13px;font-weight:750}.mai-muted{color:var(--mai-slate);font-size:12px}.mai-empty{text-align:center!important;color:var(--mai-slate);padding:28px!important}
.mai-filter{display:flex;align-items:center;gap:10px;margin-bottom:20px}.mai-filter input,.mai-filter select{height:43px;padding:8px 11px;border-radius:8px;border:1px solid #d6e2da;color:var(--mai-ink);background:white;min-width:0;box-shadow:none}.mai-filter input{flex:1}.mai-tablewrap{width:100%;overflow-x:auto}.mai-table{border-collapse:collapse;border:0;width:100%;font-size:13px;margin:0;min-width:660px}.mai-table thead th{background:#f3f7f3;font-size:11px;color:#50665a;text-transform:uppercase;letter-spacing:.04em;font-weight:800;padding:12px;text-align:left;border-bottom:1px solid var(--mai-line)}.mai-table tbody td{padding:14px 12px;vertical-align:middle;border-bottom:1px solid #edf2ef}.mai-table td small{display:block;color:#7a8780;font-size:11px;margin-top:4px}.mai-table tr:last-child td{border-bottom:none}.mai-pill{display:inline-block;padding:5px 10px;border-radius:24px;font-size:11px;font-weight:750;white-space:nowrap;background:#eaf0ff;color:#27498b}.mai-status-submitted,.mai-status-reviewed{background:#fff3d6;color:#8e6111}.mai-status-needs_changes,.mai-status-postponed{background:#fff2e8;color:#ad5b20}.mai-status-approved,.mai-status-conditional{background:#e4f4e8;color:#156b38}.mai-status-rejected{background:#fbe9e9;color:#9c3434}
.mai-form .mai-grid,.mai-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.mai-field{display:flex;flex-direction:column;gap:7px;min-width:0;margin:0 0 15px;font-size:13px;font-weight:650}.mai-field>span{color:#344b3f}.mai-field em{color:#c24133;font-style:normal}.mai-field input,.mai-field textarea,.mai-field select{display:block;width:100%;border:1px solid #cfddd4;background:#fff;color:#162c20;border-radius:8px;padding:10px 12px;font-size:14px;min-height:43px;box-shadow:none;outline:none}.mai-field textarea{resize:vertical;min-height:96px}.mai-field input:focus,.mai-field select:focus,.mai-field textarea:focus{border-color:#2a9254;box-shadow:0 0 0 3px rgba(42,146,84,.11)}.mai-readonly{min-height:43px;background:#f5f7f5;border:1px solid var(--mai-line);border-radius:8px;padding:10px 12px;font-weight:600}.mai-item{border:1px solid #dbe8dc;background:#fdfefd;border-radius:12px;padding:16px;margin-bottom:11px}.mai-item-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}.mai-remove{border:0;background:transparent;color:#a83f3f;font-size:12px;font-weight:750;cursor:pointer}.mai-add-item{margin:2px 0 14px}.mai-total{background:#eff7ef;border:1px solid #d8e8d8;border-radius:10px;padding:16px 19px;display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;color:#345343;font-size:14px;font-weight:750}.mai-total strong{font-size:25px;color:var(--mai-green);font-variant-numeric:tabular-nums}.mai-upload{display:flex;flex-direction:column;gap:7px;align-items:center;text-align:center;padding:26px;border:1.5px dashed #b4d1bc;border-radius:12px;background:#f8fbf7;cursor:pointer;color:#2b6342}.mai-upload span{color:var(--mai-slate);font-size:12px}.mai-upload input{max-width:100%;font-size:12px}.mai-check{display:flex;align-items:flex-start;gap:11px;background:#f7faf6;border-radius:9px;padding:16px;font-size:13px}.mai-check input{margin-top:4px;accent-color:var(--mai-green)}.mai-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.mai-attachments{display:flex;flex-wrap:wrap;gap:9px}.mai-attachment{border:1px solid var(--mai-line);border-radius:8px;padding:9px 12px;color:#21603e;font-weight:650;font-size:12px}.mai-attachment small{color:var(--mai-slate);font-weight:400}.mai-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;background:#f8faf8;border:1px solid #edf1ed;padding:16px;border-radius:11px}.mai-meta>div{min-width:0;overflow-wrap:anywhere}.mai-meta span{display:block;font-size:11px;color:var(--mai-slate)}.mai-meta b{font-size:13px;font-weight:750}.mai-info{background:#f7faf6;padding:16px;border-radius:10px}.mai-process{border:1px solid #bcd7c5;background:#fafffb;border-radius:12px;margin-top:26px;padding:18px}.mai-process h3{margin-top:0}.mai-timeline{border-left:2px solid #b8d4bf;padding:0 0 0 20px;margin-left:8px}.mai-timeline-item{display:flex;position:relative;gap:12px;margin:0 0 22px}.mai-dot{height:13px;width:13px;border-radius:50%;background:var(--mai-green);border:3px solid white;outline:1px solid var(--mai-green);position:absolute;left:-27px;top:5px}.mai-timeline-item strong{font-size:13px}.mai-timeline-item p{font-size:12px;color:var(--mai-slate);margin:3px 0}.mai-alert{border-radius:10px;padding:13px 16px;margin:0 0 20px;font-size:13px;font-weight:650}.mai-success{background:#e5f5e7;color:#1e7139;border:1px solid #b6dec0}.mai-danger{background:#fff1ee;color:#9d3930;border:1px solid #efc7c2}.mai-warning{background:#fff9e9;color:#8c6017;border:1px solid #ead9a4}.mai-footer{color:#819087;text-align:center;border-top:1px solid var(--mai-line);padding-top:22px;margin-top:34px;font-size:11px}.mai-login{max-width:480px;margin:0 auto 40px}.mai-login form label{display:block;font-size:13px;font-weight:700;margin:15px 0 6px}.mai-login form input[type=text],.mai-login form input[type=password]{width:100%;max-width:100%;min-height:42px;border:1px solid #d0dfd3;border-radius:8px;padding:10px}.mai-login form input[type=submit]{background:var(--mai-green);color:white;border:0;border-radius:8px;padding:10px 22px;cursor:pointer}.mai-login .login-remember label{font-weight:400}
@media(max-width:800px){.mai-top{padding:16px 18px}.mai-shell{padding:22px 16px}.mai-heading{align-items:flex-start}.mai-code{display:none}.mai-stat{padding:15px}.mai-panel{padding:17px}.mai-panel-head{align-items:flex-start}.mai-meta{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:570px){.mai-brand-desc{font-size:10px}.mai-top-user{font-size:11px}.mai-brand-name{font-size:12px}.mai-mark{font-size:16px}.mai-heading{display:block}.mai-stats{gap:7px}.mai-stat{padding:10px}.mai-stat strong{font-size:25px}.mai-stat span{font-size:10px}.mai-panel-head{display:block}.mai-panel-head .mai-btn{margin-top:13px}.mai-grid,.mai-form .mai-grid{grid-template-columns:1fr;gap:0}.mai-meta{grid-template-columns:1fr}.mai-filter{flex-wrap:wrap}.mai-filter input{flex-basis:100%}.mai-filter select{flex:1}.mai-total{flex-wrap:wrap}.mai-total strong{font-size:22px}.mai-app{border-radius:0}.mai-actions .mai-btn{flex:1}}