.vng-square{max-width:780px;margin:24px auto;padding:clamp(20px,4vw,36px);background:#fff;color:#14323d;border:1px solid #c9dce3;border-radius:22px;box-shadow:0 12px 38px #14323d0c}.vng-pay-heading>span{font-size:12px;font-weight:800;letter-spacing:.13em;color:#176383}.vng-pay-heading h2{font-size:clamp(25px,4vw,34px);line-height:1.2;margin:8px 0 12px;color:#123640}.vng-pay-heading p,.vng-square p{line-height:1.55}.vng-square fieldset{border:0;margin:24px 0;padding:0;min-width:0}.vng-square legend{font-size:18px;font-weight:750;margin-bottom:14px;color:#153e49}.vng-pay-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.vng-pay-grid .wide{grid-column:1/-1}.vng-square label{display:block;font-size:14px;font-weight:650;color:#223e48}.vng-square label span{font-weight:400}.vng-square input:not([type=checkbox]),.vng-square textarea,.vng-square select{box-sizing:border-box;display:block;width:100%;min-height:46px;background:#fff;border:1px solid #8eabb7;border-radius:8px;margin-top:6px;padding:11px 12px;color:#16343e;font-size:16px}.vng-square input:focus,.vng-square textarea:focus,.vng-square select:focus{outline:3px solid #1786af;outline-offset:2px}.vng-square #vng-square-card{margin:20px 0 8px;min-height:92px}.vng-square .vng-pay-confirm{display:flex;gap:12px;align-items:flex-start;line-height:1.5}.vng-pay-confirm input{width:22px;height:22px;flex:none;margin-top:2px;accent-color:#146282}.vng-square button#vng-square-pay{width:100%;padding:15px 20px;min-height:50px;background:#126384;color:#fff;border:0;border-radius:10px;font-weight:750;font-size:17px}.vng-square button#vng-square-pay:hover{background:#0c4a64;color:#fff}.vng-square button#vng-square-pay:disabled{background:#526e79;color:#fff;cursor:wait}.vng-square button:focus-visible,.vng-square a:focus-visible{outline:3px solid #188ab3;outline-offset:3px}.vng-pay-small{font-size:13px;color:#425d67}.vng-pay-sandbox{padding:12px;background:#fff1b4;color:#473b05;font-weight:700;border-radius:8px}#vng-square-status:not(:empty){padding:14px;background:#edf5f7;border-left:4px solid #126384;border-radius:6px;color:#173943}#vng-square-receipt{padding:18px;background:#e5f6ed;border:1px solid #80b99a;border-radius:10px}.vng-pay-receipt-link{display:inline-block;min-height:44px;padding:10px 14px;border-radius:7px;background:#116849;color:#fff!important;text-decoration:none;font-weight:700}@media(max-width:550px){.vng-pay-grid{grid-template-columns:1fr}.vng-square{padding:20px 16px;border-radius:14px;margin:16px 0}.vng-square legend{font-size:17px}}

.vng-embedded .vng-square iframe{min-height:0!important}.vng-embedded .service-form:has(.vng-square){background:transparent;border:0}.service-form>.vng-square{margin:0}

@media(max-width:600px){body.page-id-285 .vng-qr{display:none!important}}

/* Match the VNG site palette while keeping financial fields clear. */
.vng-square{font-family:inherit;background:linear-gradient(145deg,#ffffff 0%,#f2f8f7 100%);border-color:#bfd6d8;box-shadow:0 10px 28px rgba(18,54,64,.07)}.vng-pay-heading{padding-bottom:18px;border-bottom:1px solid #cbdfe0}.vng-pay-heading>span{color:#147568}.vng-embedded .vng-pay-heading h2{font-size:clamp(22px,2.5vw,28px)!important;line-height:1.25;color:#123640;margin:8px 0 10px}.vng-square legend{color:#123640}.vng-square input:not([type=checkbox]),.vng-square textarea,.vng-square select{border-color:#abc7cb;font-family:inherit}.vng-square button#vng-square-pay{background:#146b63;box-shadow:0 3px 0 #104d49}.vng-square button#vng-square-pay:hover{background:#104d49}.vng-square button#vng-square-pay:disabled{background:#587777;box-shadow:none}.vng-square #vng-square-card{padding:14px;background:#fff;border:1px solid #bfd6d8;border-radius:10px;min-height:0}
/* VNG bill-payment presentation: scoped to this page only. */
body.page-id-285 .vng-embedded{background:#f1f7f6}
body.page-id-285 .vng-square{background:#f7fbfa;overflow:hidden;border:1px solid #bfd6d8}
body.page-id-285 .vng-pay-heading{background:linear-gradient(120deg,#123640,#165b60);margin:calc(-1 * clamp(20px,4vw,36px)) calc(-1 * clamp(20px,4vw,36px)) 24px;padding:24px clamp(20px,4vw,36px);border:0}
body.page-id-285 .vng-pay-heading>span{color:#bce9df}
body.page-id-285 .vng-pay-heading h2{color:#fff!important}
body.page-id-285 .vng-pay-heading p{color:#edf7f5;margin-bottom:0}
body.page-id-285 .service-info{border-color:#bfd6d8;color:#163b45;background:#f9fcfb}
body.page-id-285 .service-info[aria-labelledby="spruce-bill-heading"]{border-left:4px solid #147568;background:#e8f3ef}
body.page-id-285 .service-info a{color:#125b76;text-underline-offset:3px}
body.page-id-285 .vng-square input:not([type=checkbox]),body.page-id-285 .vng-square select,body.page-id-285 .vng-square textarea{background:#fff;color:#123640;font-weight:500}
@media(max-width:550px){body.page-id-285 .vng-pay-heading{margin:-20px -16px 22px;padding:22px 16px}}


/* ===== VNG payment trust badges (added, presentational only) ===== */
.vng-trust-badges{display:flex;flex-wrap:wrap;gap:10px 18px;justify-content:center;align-items:center;margin:20px auto 6px;padding:14px 14px 4px;max-width:660px;border-top:1px solid rgba(21,61,71,.12);}
.vng-trust-badge{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;line-height:1.2;color:#4a5a5e;font-weight:600;letter-spacing:.2px;white-space:nowrap;}
.vng-trust-badge svg{width:16px;height:16px;flex:0 0 16px;stroke:#14576c;}
.vng-trust-badges .vng-trust-note{flex-basis:100%;text-align:center;font-size:10.5px;font-weight:400;color:#7a8688;margin-top:4px;}
@media (max-width:480px){.vng-trust-badge{font-size:10.5px;} .vng-trust-badge svg{width:14px;height:14px;flex:0 0 14px;}}


/* ===== VNG Pay a Bill: gated reveal button (presentational; Square untouched) ===== */
.vng-pay-reveal{display:inline-flex;align-items:center;gap:11px;background:#14576c;color:#fff;border:0;border-radius:12px;padding:16px 26px;font-size:17px;font-weight:700;letter-spacing:.3px;line-height:1.25;text-align:left;cursor:pointer;box-shadow:0 6px 18px rgba(21,61,71,.28);margin:4px 0 10px;transition:background .15s ease,transform .05s ease;}
.vng-pay-reveal:hover{background:#0f4757;}
.vng-pay-reveal:focus-visible{outline:3px solid #9ecbd6;outline-offset:2px;}
.vng-pay-reveal:active{transform:translateY(1px);}
.vng-pay-reveal .vng-pay-reveal__icon{width:26px;height:26px;flex:0 0 26px;stroke:#fff;}
.vng-pay-reveal .vng-pay-reveal__label small{display:block;font-size:12.5px;font-weight:600;opacity:.85;letter-spacing:.2px;}
html.vng-pay-gate:not(.vng-pay-open) .service-form{position:relative;overflow:hidden;}
html.vng-pay-gate:not(.vng-pay-open) .service-form section.vng-square{position:absolute!important;top:0;left:0;width:100%;visibility:hidden!important;}
html.vng-pay-gate.vng-pay-open .vng-pay-reveal{display:none!important;}
