/* WebCare Flexible Plan — product form and customer account */
.webcare-plan-box,.webcare-account{font-family:inherit;color:#0f172a}
.webcare-plan-box{position:relative;isolation:isolate;box-sizing:border-box;width:100%;max-width:480px;margin:24px 0;padding:28px 22px 20px;overflow:hidden;border:1px solid #e2e8f0;border-top:4px solid #102f80;border-radius:22px;background:#fff;box-shadow:0 8px 28px rgba(15,23,42,.06)}
.webcare-plan-box *,.webcare-account *{box-sizing:border-box}
.webcare-plan-box:before{content:"";position:absolute;z-index:-1;top:-110px;right:-65px;width:220px;height:220px;border-radius:50%;background:#eaf1ff;pointer-events:none}
.webcare-plan-kicker{display:inline-block;margin-bottom:16px;padding:7px 13px;border-radius:25px;background:#eaf1ff;color:#123984;font-size:10px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}
.webcare-plan-box h3{margin:0 0 10px;color:#080d1c;font-size:clamp(25px,5vw,29px);font-weight:800;line-height:1.22;letter-spacing:-.7px}
.webcare-plan-box h3 span{color:#123f9b}
.webcare-plan-intro{margin:0 0 25px;color:#475569;font-size:14px;line-height:1.55}
.webcare-plan-intro strong{color:#334155;font-weight:800}
.webcare-product-form{display:flex;flex-direction:column;gap:9px}
.webcare-product-form label{display:block;margin:0 0 8px;color:#475569;font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}
.webcare-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:8px}
.webcare-fields>div{min-width:0}
.webcare-frequency{display:flex;gap:7px}
.webcare-plan-box .webcare-frequency-btn{display:block;flex:1;width:auto;min-width:0;min-height:78px;margin:0;padding:11px 9px;border:1px solid #e2e8f0;border-radius:14px;background:#fff;color:#111827;font-family:inherit;text-align:left;cursor:pointer;box-shadow:none}
.webcare-plan-box .webcare-frequency-btn.active{border:1.5px solid #17469e;outline:2px solid #dbe7ff;background:#f2f6ff}
.webcare-frequency-btn strong{display:block;margin-bottom:5px;color:#111827;font-size:14px;font-weight:800}
.webcare-frequency-btn small{display:block;color:#64748b;font-size:11px;font-weight:400;line-height:1.4}
.webcare-product-form select{display:block;width:100%;min-width:0;min-height:60px;margin:0;padding:10px 12px;border:1px solid #cbdaf8;border-radius:14px;background-color:#fff;color:#111827;font-family:inherit;font-size:14px;font-weight:700;box-shadow:none}
.webcare-product-form select:focus{border-color:#17469e;outline:2px solid #dbe7ff;outline-offset:1px}
.webcare-product-form .webcare-hidden-select{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
.webcare-plan-estimate{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center;gap:12px;margin:8px 0 10px;padding:20px 16px;border-radius:17px;background:#0b1328;color:#fff}
.webcare-plan-estimate>div{min-width:0}
.webcare-plan-estimate span{display:block;margin-bottom:8px;color:#cbd5e1;font-size:10px;font-weight:800;letter-spacing:.5px;line-height:1.4}
.webcare-plan-estimate strong{color:#fff;font-size:clamp(17px,4vw,24px);font-weight:800;line-height:1.25;overflow-wrap:anywhere}
.webcare-plan-estimate small{color:#cbd5e1;font-size:11px;font-weight:500}
.webcare-estimate-column{min-width:0}
.webcare-total-column{min-width:0;padding-left:12px;border-left:1px solid #475569;text-align:right}
.webcare-plan-estimate .webcare-total-column strong{font-size:clamp(14px,3.5vw,18px)}
.webcare-milestone{margin:12px 0;padding:13px 14px;border:1px solid #bfdbfe;border-radius:12px;background:#eff6ff;color:#1e3a8a;font-size:12px;line-height:1.5}
.webcare-milestone strong{display:block;margin-bottom:4px;color:inherit;font-weight:800}
.webcare-milestone p{margin:0;color:#334155;line-height:1.55}
.webcare-milestone-started{border-color:#bbf7d0;background:#f0fdf4;color:#166534}
.webcare-milestone-started p{color:#166534}
.webcare-milestone-pending{border-color:#fed7aa;background:#fff7ed;color:#9a3412}
.webcare-milestone-pending p{color:#7c2d12}
.webcare-plan-box button{font-family:inherit;cursor:pointer}
.webcare-plan-box button.webcare-installment-button,.webcare-plan-box button.webcare-full-button{display:block;width:100%;min-height:49px;margin:9px 0 0;padding:12px 15px;border-radius:11px;font-size:15px;font-weight:750;line-height:1.4;text-align:center;box-shadow:none;transition:background-color .2s ease,border-color .2s ease}
.webcare-plan-box button.webcare-installment-button{border:1px solid #1b4ba6;background:#1b4ba6;color:#fff}
.webcare-plan-box button.webcare-installment-button:hover{border-color:#123984;background:#123984;color:#fff}
.webcare-plan-box button.webcare-full-button{border:1px solid #1b4ba6;background:#fff;color:#17469e}
.webcare-plan-box button.webcare-full-button:hover{background:#f2f6ff;color:#123984}
.webcare-plan-box button:focus-visible,.webcare-frequency-btn:focus-visible{outline:2px solid #2563eb;outline-offset:3px}
.webcare-plan-footnote{margin:8px 0 0;color:#64748b;font-size:11px;line-height:1.45}
/* Customer account */
.webcare-account>h2{font-size:28px;font-weight:800}
.webcare-account>p{color:#64748b}
.webcare-empty{padding:28px;border:1px dashed #cbd5e1;border-radius:14px;background:#f8fafc}
.webcare-account-card{margin:22px 0;padding:24px;border:1px solid #e2e8f0;border-radius:18px;background:#fff;box-shadow:0 5px 20px rgba(15,23,42,.04)}
.webcare-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.webcare-card-head h3{margin:0;font-size:20px;font-weight:800}
.webcare-status{padding:5px 10px;border-radius:20px;background:#eff6ff;color:#1d4ed8;font-size:11px;font-weight:800;text-transform:uppercase}
.webcare-status-completed{background:#dcfce7;color:#166534}
.webcare-status-cancelled{background:#fee2e2;color:#991b1b}
.webcare-account-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.webcare-account-grid>div{min-width:0;padding:14px;border-radius:12px;background:#f8fafc}
.webcare-account-grid small{display:block;margin-bottom:7px;color:#64748b;font-size:10px;font-weight:800;text-transform:uppercase}
.webcare-account-grid strong{display:block;overflow-wrap:anywhere;font-size:17px}
.webcare-account-grid .webcare-paid{color:#15803d}
.webcare-account-grid .webcare-balance{color:#b91c1c}
.webcare-progress-label{display:flex;justify-content:space-between;gap:8px;margin:18px 0 7px;font-size:12px;font-weight:800}
.webcare-progress{height:10px;overflow:hidden;border-radius:10px;background:#e2e8f0}
.webcare-progress span{display:block;height:100%;border-radius:10px;background:#2563eb}
.webcare-plan-meta{margin:14px 0;color:#64748b;font-size:12px}
.webcare-account-actions form{display:flex;flex-wrap:wrap;gap:10px}
.webcare-account-actions .button{flex:1;min-width:180px;padding:12px;text-align:center}
.webcare-complete-note{color:#15803d;font-weight:700}
.webcare-payment-history{margin-top:18px;padding-top:14px;border-top:1px solid #e2e8f0}
.webcare-payment-history summary{cursor:pointer;font-weight:800}
.webcare-table-wrap{max-width:100%;overflow-x:auto}
.webcare-payment-history table{width:100%;margin-top:12px;border-collapse:collapse;font-size:13px}
.webcare-payment-history th,.webcare-payment-history td{padding:10px;border-bottom:1px solid #e2e8f0;text-align:left;white-space:nowrap}
@media(max-width:600px){.webcare-plan-box{padding:22px 16px 18px;border-radius:19px}.webcare-plan-box h3{font-size:25px}.webcare-account-card{padding:16px}.webcare-account-grid{grid-template-columns:1fr}.webcare-card-head{align-items:flex-start;flex-direction:column}.webcare-account-actions form{flex-direction:column}.webcare-account-actions .button{width:100%;min-width:0}}
@media(max-width:380px){.webcare-plan-box{padding:20px 13px 17px}.webcare-fields{grid-template-columns:1fr}.webcare-plan-estimate{gap:8px;padding:16px 11px}.webcare-total-column{padding-left:8px}}