.xp-box{margin:14px 0;padding:14px 15px;border:1px solid #efdde8;border-radius:12px;background:rgba(255,255,255,.78);color:#45414b;font-size:14px;line-height:1.6}.xp-box label{display:block;margin-bottom:8px;font-weight:500}.xp-entry{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.xp-entry input{flex:1;min-width:130px;box-sizing:border-box;padding:9px 11px;border:1px solid #e8dfe5;border-radius:8px;background:#fff;color:#45414b;outline:none;font:inherit}.xp-entry input:focus,.xp-dialog textarea:focus{border-color:#7d9cff;box-shadow:0 0 0 3px rgba(112,149,255,.1)}.xp-entry [hidden]{display:none!important}.xp-batch-count{flex:1;min-width:130px;padding:9px 0;color:#6c5a69}.xp-box button{border:1px solid #7890f3;border-radius:8px;padding:8px 13px;background:#7b90f6;color:#fff;cursor:pointer;line-height:1.5;font:inherit;white-space:nowrap}.xp-box button.xp-light{background:#fff3f9;border-color:#efdeea;color:#7c6274}.xp-box button:disabled{opacity:.5;cursor:not-allowed}.xp-hint,.xp-summary{margin:9px 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px}.xp-hint{color:#91828e}.xp-summary[data-state=pass]{color:#27965b}.xp-summary[data-state=fail]{color:#c14e68}.xp-rows{max-height:270px;overflow:auto}.xp-row{display:grid;grid-template-columns:minmax(85px,.8fr) minmax(0,1.8fr) auto;align-items:center;gap:10px;padding:10px 0;border-top:1px solid #f1e7ed;font-size:13px}.xp-handle{color:#564451;overflow-wrap:anywhere;font-weight:500}.xp-result{overflow-wrap:anywhere;color:#96837c}.xp-row button{padding:3px 7px;border:0;background:transparent;color:#998591;font-size:12px}.xp-row button:hover{background:#fff1f7;color:#bf6a94}.xp-row[data-state=PASS] .xp-result{color:#27965b}.xp-row[data-state=FAIL] .xp-result{color:#c14e68}.xp-row[data-state=UNKNOWN] .xp-result{color:#9a875e}.xp-disabled{pointer-events:none!important;opacity:.55!important}.xp-modal{position:fixed;inset:0;z-index:2147483001;background:rgba(67,48,62,.28);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:18px;box-sizing:border-box}.xp-dialog{background:linear-gradient(160deg,#fff,#fff7fc);width:510px;max-width:100%;max-height:calc(100dvh - 36px);overflow:auto;padding:24px;box-sizing:border-box;border:1px solid #f1deea;border-radius:18px;box-shadow:0 18px 60px rgba(108,72,96,.18);color:#554653;font-size:14px;line-height:1.7;font-family:inherit}.xp-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:8px}.xp-dialog h3{margin:0;font-size:18px;font-weight:600;color:#645066}.xp-dialog .xp-close{width:30px;height:30px;padding:0;border:0;border-radius:50%;background:#faedf5;color:#9c8194;font-size:23px;line-height:28px;cursor:pointer}.xp-dialog-hint{margin:0 0 15px;color:#96828f;font-size:13px}.xp-dialog textarea{display:block;width:100%;min-height:220px;box-sizing:border-box;padding:13px 14px;resize:vertical;border:1px solid #e9dbe4;border-radius:10px;background:#fff;outline:none;color:#51454e;font:inherit;line-height:1.9}.xp-dialog textarea::placeholder{color:#b6a8b2}.xp-batch-preview{margin:9px 1px;color:#9a8493;font-size:12px}.xp-batch-preview[data-state=fail]{color:#c14e68}.xp-dialog footer{display:flex;justify-content:flex-end;gap:9px;margin-top:18px;flex-wrap:wrap}.xp-dialog footer button{padding:9px 16px;border:1px solid #eedbe7;border-radius:9px;background:#fff1f8;color:#886a7e;cursor:pointer;font:inherit}.xp-dialog footer button:first-child{background:#7b90f6;border-color:#7890f3;color:#fff}@media(max-width:500px){.xp-box{padding:12px}.xp-entry input,.xp-batch-count{width:100%;flex-basis:100%}.xp-entry button{flex:1}.xp-row{grid-template-columns:minmax(0,1fr) auto;gap:4px 9px}.xp-row .xp-handle{grid-column:1}.xp-row .xp-result{grid-column:1;grid-row:2}.xp-row button{grid-column:2;grid-row:1 / span 2}.xp-modal{padding:15px}.xp-dialog{padding:19px 17px;border-radius:15px;max-height:calc(100dvh - 30px)}.xp-dialog textarea{min-height:220px}.xp-dialog footer button{flex:1}}

/* Customized labels remain readable on small screens. */
.xp-box label,.xp-result,.xp-dialog-hint,.xp-dialog h3{white-space:pre-wrap;overflow-wrap:anywhere}.xp-box button,.xp-dialog footer button{white-space:normal;overflow-wrap:anywhere;max-width:100%}

.xp-contact{margin-top:14px;padding-top:13px;border-top:1px solid #f1e7ed}.xp-contact input{display:block;width:100%;box-sizing:border-box;padding:9px 11px;border:1px solid #e8dfe5;border-radius:8px;background:#fff;color:#45414b;outline:none;font:inherit}.xp-contact input:focus{border-color:#7d9cff;box-shadow:0 0 0 3px rgba(112,149,255,.1)}.xp-contact input[aria-invalid=true]{border-color:#c14e68}.xp-contact .xp-hint{margin-bottom:0}.xp-contact-error{margin:6px 0 0;color:#c14e68;font-size:13px;overflow-wrap:anywhere}.xp-contact [hidden]{display:none!important}

/* The storefront theme clears borders and fixes text inputs at 240px.
   Keep these overrides inside the optional-contact X service form. */
.xp-box:has(.xp-contact)>label{font-weight:650;color:#59445d;font-size:15px}
.xp-box:has(.xp-contact) .xp-entry input,.xp-box .xp-contact input[type=text]{height:48px;min-height:48px;box-sizing:border-box;border:2px solid #d4a3be;border-radius:10px!important;padding:11px 14px!important;font-size:15px;line-height:22px;color:#493b4b;background:#fff!important;box-shadow:0 2px 7px rgba(151,94,133,.06);transition:border-color .15s,box-shadow .15s}
.xp-box:has(.xp-contact) .xp-entry input:hover,.xp-box .xp-contact input[type=text]:hover{border-color:#bc80a6}
.xp-box:has(.xp-contact) .xp-entry input:focus,.xp-box .xp-contact input[type=text]:focus{border-color:#a678bf;box-shadow:0 0 0 3px rgba(166,120,191,.14)}
.xp-box:has(.xp-contact) .xp-entry input::placeholder,.xp-box .xp-contact input[type=text]::placeholder{color:#886b80!important;opacity:1}
.xp-box .xp-contact{margin-top:18px;padding:16px;border:1px solid #ddbbd2;border-left:4px solid #bc85ae;border-radius:12px;background:linear-gradient(120deg,#fff1f8,#fbf4ff)}
.xp-box .xp-contact label{margin:0 0 10px;font-size:15px;font-weight:650;color:#73506d}
.xp-box .xp-contact input[type=text]{width:100%;max-width:100%;margin:0;border-color:#c891b2}
.xp-box .xp-contact .xp-hint{margin:10px 0 0;color:#7d6176;line-height:1.75}
.xp-box .xp-contact input[type=text][aria-invalid=true]{border-color:#c14e68}
.xp-box .xp-contact input[type=text][aria-invalid=true]:focus{box-shadow:0 0 0 3px rgba(193,78,104,.12)}
@media(max-width:500px){.xp-box .xp-contact{padding:13px 12px;margin-top:16px}.xp-box .xp-contact label{font-size:14px}}