.charge-choice.connector-unavailable{cursor:not-allowed;opacity:1}
.charge-choice .availability{font-weight:750}
.charge-choice.ocpp-available{border-color:#b9e9cb}
.charge-choice.ocpp-available.selected{border-color:#1aa65b;box-shadow:0 5px 16px rgba(26,166,91,.18)}
.charge-choice.ocpp-available .connector-symbol{border-color:#5fd38c;background:#effcf4}
.charge-choice.ocpp-available .availability{background:#daf7e5;color:#137a3e}
.charge-choice.ocpp-preparing{border-color:#b9e8f3;background:#fbfeff}
.charge-choice.ocpp-preparing .connector-symbol,.charge-choice.ocpp-charging .connector-symbol{border-color:#43bdd5;background:#edfaff}
.charge-choice.ocpp-preparing .availability,.charge-choice.ocpp-charging .availability{background:#d9f4fa;color:#087c96}
.charge-choice.ocpp-charging{border-color:#55c7df;background:#f7fdff;box-shadow:0 4px 15px rgba(0,151,184,.13)}
.charge-choice.ocpp-suspendedev,.charge-choice.ocpp-suspendedevse{border-color:#b8cce5;background:#fbfcff}
.charge-choice.ocpp-suspendedev .connector-symbol,.charge-choice.ocpp-suspendedevse .connector-symbol{border-color:#7899c2;background:#f0f5fb}
.charge-choice.ocpp-suspendedev .availability,.charge-choice.ocpp-suspendedevse .availability{background:#e6eef8;color:#365d8b}
.charge-choice.ocpp-finishing{border-color:#cbdde7;background:#fcfeff}
.charge-choice.ocpp-finishing .connector-symbol{border-color:#9dbdce;background:#f3f8fa}
.charge-choice.ocpp-finishing .availability{background:#eaf2f6;color:#4f7081}
.charge-choice.ocpp-reserved{border-color:#f1ca82;background:#fffdfa}
.charge-choice.ocpp-reserved .connector-symbol{border-color:#e2a93e;background:#fff7e7}
.charge-choice.ocpp-reserved .availability{background:#fff0cf;color:#8b5b00}
.charge-choice.ocpp-faulted{border-color:#ef9da2;background:#fffafb}
.charge-choice.ocpp-faulted .connector-symbol{border-color:#df5d66;background:#fff0f1}
.charge-choice.ocpp-faulted .availability{background:#ffe1e3;color:#a52b34}
.charge-choice.ocpp-unavailable{border-color:#d9dfe2;background:#f5f7f8;color:#87929a}
.charge-choice.ocpp-unavailable .connector-symbol{border-color:#cbd3d7;background:#edf1f3}
.charge-choice.ocpp-unavailable .availability{background:#e7ebed;color:#626d75}
.charge-choice.ocpp-offline{border-color:#cbd2d6;background:#f1f3f4;color:#747e85}
.charge-choice.ocpp-offline .connector-symbol{border-color:#b9c2c7;background:#e5e9eb}
.charge-choice.ocpp-offline .availability{background:#dfe4e6;color:#4f5a61}
.charge-choice.connector-unavailable .connector-radio{background:#f1f4f5;border-color:#d6dde0}
.charge-choice.connector-unavailable .tariff-grid,.charge-choice.connector-unavailable .connector-technical{opacity:.72}

/* High-visibility selection for outdoor use. The status badge keeps its own colour. */
.charge-choice.ocpp-available:not(.selected){border-color:#d7e1e4;background:#fbfcfc;box-shadow:0 2px 8px rgba(25,61,76,.05)}
.charge-choice.selected{border-width:3px;border-color:#079447;background:#fff;box-shadow:0 8px 22px rgba(7,148,71,.34),0 0 0 2px rgba(7,148,71,.12)}
.charge-choice.ocpp-available.selected{border-color:#079447;background:#fff;box-shadow:0 8px 22px rgba(7,148,71,.34),0 0 0 2px rgba(7,148,71,.12)}
.charge-choice.selected .connector-side{background:transparent;border-right-color:#e1e8ea}
.charge-choice.selected .connector-radio{display:grid;place-items:center;width:25px;height:25px;background:#087d41;border-color:#087d41;box-shadow:0 0 0 4px #d9f7e5;color:#fff}
.charge-choice.selected .connector-radio::after{content:'✓';font-size:16px;font-weight:900;line-height:1}

/* Connector pictogram colour always follows the OCPP state, never selection. */
.charge-choice .connector-symbol img{filter:brightness(0) saturate(100%)}
.charge-choice.ocpp-available .connector-symbol img{filter:brightness(0) saturate(100%) invert(38%) sepia(82%) saturate(1120%) hue-rotate(101deg) brightness(87%) contrast(94%)}
.charge-choice.ocpp-preparing .connector-symbol img,.charge-choice.ocpp-charging .connector-symbol img{filter:brightness(0) saturate(100%) invert(47%) sepia(91%) saturate(871%) hue-rotate(145deg) brightness(88%) contrast(92%)}
.charge-choice.ocpp-suspendedev .connector-symbol img,.charge-choice.ocpp-suspendedevse .connector-symbol img{filter:brightness(0) saturate(100%) invert(39%) sepia(20%) saturate(1267%) hue-rotate(174deg) brightness(87%) contrast(85%)}
.charge-choice.ocpp-finishing .connector-symbol img{filter:brightness(0) saturate(100%) invert(48%) sepia(15%) saturate(765%) hue-rotate(151deg) brightness(86%) contrast(85%)}
.charge-choice.ocpp-reserved .connector-symbol img{filter:brightness(0) saturate(100%) invert(61%) sepia(74%) saturate(743%) hue-rotate(359deg) brightness(91%) contrast(91%)}
.charge-choice.ocpp-faulted .connector-symbol img{filter:brightness(0) saturate(100%) invert(31%) sepia(67%) saturate(1745%) hue-rotate(327deg) brightness(86%) contrast(92%)}
.charge-choice.ocpp-unavailable .connector-symbol img,.charge-choice.ocpp-offline .connector-symbol img{filter:brightness(0) saturate(100%) invert(48%) sepia(8%) saturate(463%) hue-rotate(155deg) brightness(91%) contrast(85%)}
.charge-experience.payment-locked{overflow:hidden;overscroll-behavior:none}
.payment-popup{position:fixed;z-index:2200;inset:0 auto 0 50%;width:min(600px,100%);transform:translateX(-50%);overflow:hidden;overscroll-behavior:none}
.payment-dialog{position:relative;width:100%;max-height:calc(100dvh - max(20px,env(safe-area-inset-top)));overflow-y:auto;overscroll-behavior:contain;padding-top:26px;text-align:left}
.payment-dialog h2{font-size:22px;margin:5px 0 3px}
.payment-dialog>p{margin:0 0 16px}
.payment-dialog .payment-options{max-width:none;gap:9px}
.payment-dialog .payment-option{grid-template-columns:38px minmax(0,1fr) 22px;padding:12px 13px}
.payment-method-icon{width:34px;height:34px;border-radius:10px;background:#eef2f4;color:#626f79;display:grid;place-items:center}
.payment-method-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.payment-radio{width:22px;height:22px;border:2px solid #9aa7af;border-radius:50%;display:grid;place-items:center;color:transparent;font-size:0;line-height:1;background:#fff}
.payment-option.selected .payment-radio{border-color:var(--mc-cyan-dark);background:var(--mc-cyan-dark);box-shadow:0 0 0 3px rgba(0,127,159,.12)}
.payment-option.selected .payment-method-icon{background:#e7f7fb;color:#007f9f}
.payment-option .payment-tag-code{font-size:10px;color:#929da5;margin-top:2px}
.payment-free-badge{display:inline-flex;align-items:center;margin-left:5px;padding:3px 7px;border-radius:999px;background:#e5f8e9;color:#087044;font-size:9px;font-style:normal;font-weight:800;white-space:nowrap;vertical-align:middle}
.payment-option-free .payment-method-icon{background:#eaf9ee;color:#138a46}
.payment-option-free.selected{border-color:#159a4c;box-shadow:0 0 0 3px rgba(21,154,76,.12)}
.payment-option-free.selected .payment-radio{border-color:#159a4c;background:#159a4c;box-shadow:0 0 0 3px rgba(21,154,76,.12)}
.free-session-price{display:grid;grid-template-columns:28px 1fr;align-items:center;column-gap:9px;margin-top:12px;padding:12px;border-radius:12px;background:#eaf9ee;color:#087044}
.free-session-price>span{grid-row:1/3;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#159a4c;color:#fff;font-weight:900}
.free-session-price>strong,.free-session-price>small{display:block;margin:0}
.free-session-price>small{color:#397750;font-size:11px;margin-top:2px}
.payment-dialog-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:9px;margin-top:16px}
.payment-dialog-actions button{height:50px;border-radius:12px;font-weight:800}
.payment-loading-dialog{display:grid;justify-items:center;gap:10px;padding:28px}
.payment-loading-dialog p{margin:0}