.customer-service-list { color: #10243a; font: 14px/1.5 Arial, sans-serif; }
.customer-service-list h3 { margin: 16px 0 8px; font-size: 15px; font-weight: 700; }
.customer-service-list .service-pane.customer-service-row { display: block; border: 1px solid #e4ebf0; border-radius: 10px; padding: 16px; margin: 8px 0; cursor: pointer; background: white; }
.customer-service-list .customer-service-heading { display: flex; justify-content: space-between; gap: 16px; }
.customer-service-list .customer-service-heading label { cursor: pointer; margin: 0; }
.customer-service-list .customer-service-selection { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.customer-service-list .booking-service-row-heading { display: flex; align-items: center; gap: 8px; }
.customer-service-list .sf-provi-service-ttle { font-size: 15px; font-weight: 700; }
.customer-service-list .booking-service-icon { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; flex: 0 0 30px; border-radius: 50%; color: #58718d; background: #edf2f7; }
.customer-service-list .booking-service-icon svg { width: 19px; height: 19px; }
.customer-service-list .booking-service-icon--servicing { color: #008651; background: #e5f5ec; }
.customer-service-list .customer-service-details { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
/* Override the legacy booking checkbox hiding rule only inside the shared service list. */
.customer-service-list .customer-service-heading input[type="checkbox"].filled-in {
    display: inline-block;
    appearance: none;
    position: static;
    opacity: 1;
    visibility: visible;
    width: 20px;
    height: 20px;
    margin: 0;
    border: 1px solid #026979;
    border-radius: 0;
    background: white;
    vertical-align: middle;
    accent-color: #026979;
    pointer-events: none;
}
.customer-service-list .customer-service-heading input[type="checkbox"].filled-in:checked {
    background: #026979 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10 4 4 8-9' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
}
/* The existing row click and keyboard handlers remain responsible for checkbox selection. */
.customer-service-list .service-pane.customer-service-row[aria-checked="true"] {
    border-color: #026979;
    box-shadow: inset 0 0 0 1px #026979;
    background: #f1faf8;
}
.customer-service-list .customer-service-description, .customer-service-list .customer-service-note { margin: 0 0 6px; color: #65758b; font-size: 13px; }
.customer-service-list .customer-service-offer { color: #008650; margin: 8px 0 0; text-align: right; }
.customer-service-list .btn-includes { border: 1px solid #dc9c00; border-radius: 3px; padding: 5px 10px; color: #10243a; background: #ffbd00; font-size: 12px; }
.customer-service-list .provi-service-price { white-space: nowrap; }
.customer-service-list .divider-line { display: none; }
@media (max-width: 480px) { .customer-service-list .customer-service-heading { gap: 8px; } .customer-service-list .service-pane.customer-service-row { padding: 12px; } }
@media (max-width: 640px) { .customer-service-list .customer-service-details { grid-template-columns: 1fr; gap: 0; } }
.customer-service-list .service-pane.customer-service-row:focus-visible { outline: 3px solid #1487df; outline-offset: 2px; }