/* Sólo Crear abono. El lienzo violeta no recolorea texto, fotos ni controles. */
#clientModal .modal:has(#subscriptionForm){position:relative;isolation:isolate;width:min(720px,calc(100vw - 32px));max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);padding:22px;border:1px solid #936bc67d;border-radius:18px;color-scheme:dark;background:linear-gradient(100deg,#080710ed,#10071db3),linear-gradient(#9455da,#9455da),url('assets/clientes-deuda-v198.png') center/cover no-repeat;background-color:#080710;background-blend-mode:normal,color,normal;box-shadow:inset 0 1px #d9baff16,0 25px 85px #000b;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
#clientModal:has(#subscriptionForm) .subscription-create-header{display:flex;align-items:center;gap:12px;margin-bottom:10px;padding:0 0 11px;border-bottom:1px solid #ad85d53d}
#clientModal:has(#subscriptionForm) .subscription-create-header>span{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border:1px solid #ad85d56b;border-radius:12px;background:#302044ad;color:#d8baff}
#clientModal:has(#subscriptionForm) .subscription-create-header svg{width:25px;height:25px}
#clientModal:has(#subscriptionForm) .subscription-create-header small{display:block;margin-bottom:3px;color:#c7a9e7;font:600 10px/1.3 Inter,system-ui,sans-serif;letter-spacing:1px;text-transform:uppercase}
#clientModal:has(#subscriptionForm) .subscription-create-header h2{color:#f3eaff;font-size:31px;line-height:1.1}
#clientModal:has(#subscriptionForm) .subscription-create-description{margin:0 0 13px;padding:9px 11px;border:1px solid #9f7abd30;border-radius:10px;background:#0d0915bf;color:#c2b7d0;font-size:12px;line-height:1.55}
#clientModal #subscriptionForm{margin:0;min-width:0}
#clientModal #subscriptionForm .fields{gap:10px 16px;padding:2px 12px 12px;border:1px solid #9875ba47;border-radius:12px;background:linear-gradient(140deg,#181020d9,#080b13e6)}
#clientModal #subscriptionForm .field{min-width:0}
#clientModal #subscriptionForm .field label{margin:10px 0 6px;color:#cec0df;font-size:11px;font-weight:600}
#clientModal #subscriptionForm .input{min-width:0;min-height:40px;padding:10px 12px;border-color:#82639975;background:#080c16d9;color:#eef0fa;font-size:12px}
#clientModal #subscriptionForm .input::placeholder{color:#9a8fa9}
#clientModal #subscriptionForm .input:focus{outline:2px solid #b785eb70;outline-offset:1px;border-color:#bb8fed;background:#100e1ce8;box-shadow:0 0 15px #9d62cc18}
#clientModal #subscriptionForm .input:disabled{opacity:1;border-color:#9472b247;color:#d5c4e9;background:#20172ac9}
#clientModal #subscriptionForm #subscriptionDates{margin:10px 0;padding:9px 11px;border:1px solid #9b78c166;border-radius:9px;background:#181126d9;color:#d4c2e8;font-size:10px;line-height:1.6}
#clientModal #subscriptionForm .subscription-member-field{margin:0;padding:0 12px 12px;border:1px solid #9875ba47;border-radius:12px;background:#0e0a17d9}
#clientModal #subscriptionForm #subscriptionMemberResults{margin-top:7px;color:#b5a8c6;font-size:11px;line-height:1.5;overflow-wrap:anywhere}
#clientModal #subscriptionForm .subscription-search-hint{margin:0 0 6px;color:#b5a8c6;font-size:10px}
#clientModal #subscriptionForm .subscription-search-list{display:grid;gap:5px;max-height:192px;overflow:auto;overscroll-behavior:contain}
#clientModal #subscriptionForm .subscription-search-list button{display:flex;align-items:center;justify-content:space-between;gap:9px;min-width:0;width:100%;padding:8px 11px;border:1px solid #7b609b66;border-radius:8px;background:linear-gradient(115deg,#281a3bd9,#10111ed9);color:#e7daf7;text-align:left;font-size:11px}
#clientModal #subscriptionForm .subscription-search-list button>span{min-width:0;overflow-wrap:anywhere}
#clientModal #subscriptionForm .subscription-search-list button>small{flex:none;color:#baa3d5;font-size:10px}
#clientModal #subscriptionForm #subscriptionMembers>p{display:flex;align-items:center;justify-content:space-between;gap:9px;margin:8px 0 0;padding:8px 10px;border:1px solid #9875ba55;border-radius:9px;background:#23162bd9;color:#e0d0ed;font-size:11px;overflow-wrap:anywhere}
#clientModal #subscriptionForm #subscriptionMembers button{flex:none;min-height:28px;padding:4px 8px;color:#d7b9ed;font-size:10px}
#clientModal #subscriptionForm .actions{align-items:center;flex-wrap:wrap;gap:10px;margin-top:14px;padding-top:13px;border-top:1px solid #ad85d53d}
#clientModal #subscriptionForm .secondary{border-color:#9472b275;background:linear-gradient(130deg,#292039,#11101e);color:#d9caed;box-shadow:inset 0 1px #d9baff0c}
#clientModal #subscriptionForm .secondary:hover:not(:disabled){border-color:#bf96ea;background:#30213f}
#clientModal #subscriptionForm .client-subscription-create{display:flex;align-items:center;justify-content:center;gap:0;width:300px;max-width:100%;min-height:62px;margin:0;padding:8px 34px 8px 82px;border:1px solid #90dfa359;border-radius:14px;background:#071b15 url('assets/lector-cobrar-v297.png') center/100% auto no-repeat;box-shadow:0 5px 17px #0007;color:#e8fff1;cursor:pointer;transition:box-shadow .15s,border-color .15s}
#clientModal #subscriptionForm .client-subscription-create>span{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0;text-shadow:0 2px 4px #000}
#clientModal #subscriptionForm .client-subscription-create strong{font:700 13px/1.3 Inter,system-ui,sans-serif}
#clientModal #subscriptionForm .client-subscription-create small{font:600 10px/1.3 Inter,system-ui,sans-serif;color:#c7e9d8}
#clientModal #subscriptionForm .client-subscription-create:hover:not(:disabled){border-color:#b0f4c5;box-shadow:0 0 0 2px #a4f6bf25,0 0 18px #65e49824}
#clientModal #subscriptionForm button:focus-visible{outline:2px solid #d5b6ff;outline-offset:3px}
#clientModal #subscriptionForm button:disabled{opacity:.5;cursor:wait}
@media(max-width:600px){
  #clientModal .modal:has(#subscriptionForm){width:calc(100vw - 20px);max-height:calc(100dvh - 20px);padding:16px}
  #clientModal #subscriptionForm .fields{grid-template-columns:1fr;gap:0}
  #clientModal #subscriptionForm .actions{justify-content:space-between}
  #clientModal #subscriptionForm .client-subscription-create{width:min(300px,100%)}
}
@media(prefers-reduced-motion:reduce){#clientModal #subscriptionForm .client-subscription-create{transition:none}}