*{box-sizing:border-box}
body{margin:0;background:#e7e7e7;font-family:Arial,Helvetica,sans-serif;color:#111}
.lsh-pay-shell{min-height:100vh}
.lsh-pay-brandbar{height:52px;background:#fff;border-bottom:1px solid #d5d9d9;display:flex;align-items:center;padding:0 18px}
.lsh-pay-brand{font-size:22px;font-weight:800;text-decoration:none;color:#111}.lsh-pay-brand span{color:#ff9900}
.lsh-pay-page{width:min(1120px,calc(100% - 24px));margin:12px auto 40px;display:grid;grid-template-columns:190px minmax(0,1fr);gap:12px}
.lsh-pay-side{background:#fff;border:1px solid #d5d9d9;padding:12px;height:max-content}
.lsh-pay-side-title{font-size:12px;font-weight:700;border-bottom:1px solid #eee;padding-bottom:8px;margin-bottom:7px}
.lsh-pay-side-title strong{float:right;color:#007600}
.lsh-pay-side a{display:block;padding:6px 2px;color:#2162a1;text-decoration:none;font-size:11px}
.lsh-pay-main{display:grid;gap:8px}
.lsh-pay-group{background:#fff;border:1px solid #d5d9d9;padding:12px}
.lsh-pay-group h2{font-size:14px;margin:0 0 12px}
.lsh-pay-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.lsh-pay-grid-wide{grid-template-columns:repeat(7,minmax(0,1fr))}
.lsh-pay-grid a,.lsh-pay-grid button{
  min-height:68px;border:0;background:#fff;color:#111;text-decoration:none;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  padding:5px;cursor:pointer;text-align:center;font-family:inherit
}
.lsh-pay-grid a:hover,.lsh-pay-grid button:hover{background:#f7fafa}
.lsh-pay-grid span{font-size:24px;line-height:1.2;margin-bottom:5px}
.lsh-pay-grid b{font-size:10px;font-weight:500;line-height:1.25}
.lsh-pay-notice{background:#fff8e1;border:1px solid #e8b64b;border-radius:5px;padding:12px;font-size:12px;line-height:1.4}
@media(max-width:900px){
  .lsh-pay-grid-wide{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:700px){
  .lsh-pay-page{grid-template-columns:1fr}
  .lsh-pay-grid,.lsh-pay-grid-wide{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:460px){
  .lsh-pay-grid,.lsh-pay-grid-wide{grid-template-columns:repeat(2,minmax(0,1fr))}
}


/* LSH PAY BALANCE PANEL LARGER - requested UI-only fix */
.lsh-pay-page{
  grid-template-columns:260px minmax(0,1fr);
}
.lsh-pay-side{
  min-height:245px;
  padding:18px 16px;
}
.lsh-pay-side-title{
  font-size:15px;
  padding-bottom:11px;
  margin-bottom:10px;
}
.lsh-pay-side-title strong{
  font-size:16px;
}
.lsh-pay-side a{
  padding:9px 3px;
  font-size:14px;
  line-height:1.35;
}
@media(max-width:700px){
  .lsh-pay-page{grid-template-columns:1fr}
  .lsh-pay-side{min-height:auto}
}

/* Test #7: keep future LifeStyle Hub Pay services visible but clearly inactive */
.lsh-pay-grid button.lsh-coming-soon{position:relative;opacity:.72;cursor:not-allowed;background:#fafafa}
.lsh-pay-grid button.lsh-coming-soon:hover{background:#fafafa}
.lsh-pay-grid button.lsh-coming-soon em{margin-top:5px;padding:2px 6px;border-radius:999px;background:#fff3cd;border:1px solid #f0c36d;color:#7a5200;font-size:9px;font-style:normal;font-weight:700;line-height:1.2}

/* LifeStyle Hub Pay One-Time Provider-Ready Pack */
.lsh-pay-grid button.lsh-provider-ready{position:relative;opacity:1;cursor:pointer;background:#fff}
.lsh-pay-grid button.lsh-provider-ready:hover{background:#f3f8ff;box-shadow:inset 0 0 0 1px #b8d5f2}
.lsh-pay-grid button.lsh-provider-ready em{margin-top:5px;padding:2px 7px;border-radius:999px;background:#e8f4ff;border:1px solid #9cc9ef;color:#075985;font-size:9px;font-style:normal;font-weight:700}
.lsh-service-modal{position:fixed;inset:0;z-index:99999;background:rgba(15,23,42,.58);display:flex;align-items:center;justify-content:center;padding:18px}
.lsh-service-modal[hidden]{display:none}.lsh-modal-open{overflow:hidden}
.lsh-service-card{position:relative;width:min(560px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:14px;box-shadow:0 24px 70px rgba(0,0,0,.28);padding:24px}
.lsh-service-close{position:absolute;right:14px;top:12px;border:0;background:transparent;font-size:28px;cursor:pointer;color:#475569}
.lsh-service-head{display:flex;gap:14px;align-items:center;border-bottom:1px solid #e5e7eb;padding:0 36px 16px 0;margin-bottom:18px}.lsh-service-head>span{font-size:36px}.lsh-service-head h2{margin:0 0 4px;font-size:22px}.lsh-service-head p{margin:0;color:#64748b;font-size:13px}
.lsh-service-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.lsh-service-fields label{font-size:12px;font-weight:700;color:#334155}.lsh-service-fields input{display:block;width:100%;margin-top:6px;border:1px solid #aeb8c4;border-radius:7px;padding:11px 12px;font:inherit;outline:none}.lsh-service-fields input:focus{border-color:#1473e6;box-shadow:0 0 0 3px rgba(20,115,230,.12)}
.lsh-service-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.lsh-service-actions button{border:1px solid #9aa5b1;border-radius:999px;background:#fff;padding:9px 18px;font-weight:700;cursor:pointer}.lsh-service-actions .primary{background:#ffd814;border-color:#f0b800;color:#111}.lsh-service-safe{font-size:11px;color:#64748b;line-height:1.45;margin:14px 0 0}
@media(max-width:560px){.lsh-service-fields{grid-template-columns:1fr}.lsh-service-card{padding:20px}}

/* PayU BBPS UAT integration status */
.lsh-payu-status{display:flex;align-items:center;gap:9px;margin:10px 0 8px;padding:10px;border:1px solid #d5d9d9;border-radius:8px;background:#f8fafc}
.lsh-payu-status .dot{width:9px;height:9px;border-radius:50%;background:#94a3b8;flex:0 0 auto}
.lsh-payu-status b{display:block;font-size:12px}.lsh-payu-status small{display:block;margin-top:2px;font-size:10px;color:#64748b;line-height:1.3}
.lsh-payu-status[data-state="ready"]{background:#f0fdf4;border-color:#86efac}.lsh-payu-status[data-state="ready"] .dot{background:#16a34a}
.lsh-payu-status[data-state="setup"]{background:#fff7ed;border-color:#fdba74}.lsh-payu-status[data-state="setup"] .dot{background:#f97316}
.lsh-payu-status[data-state="error"]{background:#fef2f2;border-color:#fca5a5}.lsh-payu-status[data-state="error"] .dot{background:#dc2626}
.lsh-payu-test{width:100%;border:1px solid #9aa5b1;border-radius:8px;background:#fff;padding:8px 9px;font-size:11px;font-weight:700;cursor:pointer;margin-bottom:8px}.lsh-payu-test:hover{background:#f7fafa}.lsh-payu-test:disabled{opacity:.55;cursor:not-allowed}
