/* Suqeli — paiement Mobile Money sur le site */
.sqv-pay{min-width:0;--r:#5B35F5;--r2:#4524D9;--y:#FFB56B;--ys:#FFF1E2;--k:#191629;--t:#4A4A4A;--l:#E2E2E2;--g:#1A8A45;font-family:'Poppins',system-ui,-apple-system,sans-serif;color:var(--k);text-align:left;line-height:1.4}
.sqv-pay *,.sqv-pw *{box-sizing:border-box}
.sqv-pay-intro{font-size:.84rem;color:var(--t);margin:2px 0 14px}
.sqv-pay-f{margin:0 0 14px}
.sqv-pay-f[hidden],.sqv-pay-cardnote[hidden],.sqv-op[hidden]{display:none!important}
.sqv-pay label,.sqv-pay-lab{display:block;font-size:.84rem;font-weight:700;color:var(--k);margin:0 0 7px;line-height:1.3}
.sqv-pay select{width:100%;height:48px;border:1.5px solid #DADADA;border-radius:12px;background:#fff;padding:0 40px 0 14px;font:inherit;font-size:.95rem;color:var(--k);appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.sqv-pay select:focus{outline:none;border-color:var(--k);box-shadow:0 0 0 3px rgba(255,181,107,.45)}

/* opérateurs */
.sqv-pay-ops{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;min-width:0}
.sqv-pay .sqv-op{position:relative;display:flex;align-items:center;gap:10px;margin:0;min-height:58px;padding:9px 12px;border:1.5px solid #DADADA;border-radius:14px;background:#fff;cursor:pointer;font-size:.88rem;font-weight:700;color:var(--k);transition:border-color .15s,box-shadow .15s,background .15s;-webkit-tap-highlight-color:transparent}
.sqv-pay .sqv-op:hover{border-color:#9A9A9A}
.sqv-pay .sqv-op input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.sqv-pay .sqv-op.on{border-color:var(--k);background:#FFFBEA;box-shadow:0 5px 15px rgba(91,53,245,.16)}
.sqv-pay .sqv-op:focus-within{outline:2px solid var(--k);outline-offset:2px}
.sqv-pay .sqv-op.on::after{content:"";position:absolute;top:-7px;right:-7px;width:20px;height:20px;border-radius:50%;background:var(--r) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/12px no-repeat;box-shadow:0 0 0 2px #fff}
.sqv-op-i{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:.72rem;font-weight:900;letter-spacing:-.02em;background:#F2F2F2;color:var(--k)}
.sqv-op[data-c=mtn] .sqv-op-i{background:#FFCB05;color:#191629}
.sqv-op[data-c=moov] .sqv-op-i{background:#0B5CAB;color:#fff}
.sqv-op[data-c=yas] .sqv-op-i{background:#FFE01B;color:#1B1464}
.sqv-op[data-c=celtiis] .sqv-op-i{background:#6B2C91;color:#fff}
.sqv-op[data-c=orange] .sqv-op-i{background:#FF7900;color:#191629}
.sqv-op[data-c=wave] .sqv-op-i{background:#1DC8F2;color:#0B2B4A}
.sqv-op[data-c=free] .sqv-op-i{background:#CD1E25;color:#fff}
.sqv-op[data-c=airtel] .sqv-op-i{background:#E40000;color:#fff}
.sqv-op[data-c=card] .sqv-op-i{background:var(--k);color:var(--y)}
.sqv-op-n{min-width:0;line-height:1.2;overflow-wrap:anywhere}
.sqv-op-n small{display:block;font-size:.7rem;font-weight:600;color:#7A7A7A;margin-top:2px}

/* numéro */
.sqv-tel{display:flex;align-items:stretch;height:50px;border:1.5px solid #DADADA;border-radius:12px;background:#fff;overflow:hidden}
.sqv-tel:focus-within{border-color:var(--k);box-shadow:0 0 0 3px rgba(255,181,107,.45)}
.sqv-tel.bad{border-color:var(--r);background:#FFF8F8}
.sqv-tel-cc{flex:none;display:flex;align-items:center;padding:0 12px;background:#F6F6F6;border-right:1.5px solid #E7E5F0;font-weight:800;font-size:.95rem;color:var(--k)}
.sqv-pay .sqv-tel input{flex:1;min-width:0;width:0;border:0!important;outline:0;box-shadow:none!important;background:transparent!important;height:100%!important;min-height:0!important;padding:0 14px!important;font:inherit;font-size:1.05rem!important;font-weight:700;letter-spacing:.04em;color:var(--k);border-radius:0!important}
.sqv-pay-hint{display:block;margin-top:6px;font-size:.76rem;color:#6B6B6B;line-height:1.4}
.sqv-pay-err{display:block;margin-top:6px;font-size:.78rem;font-weight:700;color:var(--r2)}
.sqv-pay-cardnote{font-size:.8rem;color:var(--t);background:#F6F6F6;border-radius:12px;padding:10px 12px;margin:0 0 6px}

/* intégration dans la page de commande Suqeli (moyens de paiement en cartes) */
#gcoPage #payment ul.payment_methods > li{min-width:0}
#gcoPage #payment ul.payment_methods li .sqv-pay{margin:12px 0 2px;min-width:0}
#gcoPage #payment ul.payment_methods li .sqv-pay label.sqv-op{display:flex!important;font-size:.88rem!important;font-weight:700!important;margin:0!important}
#gcoPage #payment ul.payment_methods li .sqv-pay label.sqv-op[hidden]{display:none!important}
#gcoPage #payment ul.payment_methods li .sqv-pay label:not(.sqv-op){display:block!important;font-size:.84rem!important;font-weight:700!important;margin:0 0 7px!important}
@media (max-width:480px){
  .sqv-pay-ops,.sqv-pw-form .sqv-pay-ops{grid-template-columns:1fr}
  .sqv-pay .sqv-op{min-height:52px;padding:8px 12px}
  .sqv-op-n small{display:inline;margin:0 0 0 6px}
  .sqv-op-i{width:34px;height:34px}
}

/* ---------------------------------------------------------------- suivi du paiement */
.sqv-pw{--r:#5B35F5;--r2:#4524D9;--y:#FFB56B;--k:#191629;--t:#4A4A4A;--g:#1A8A45;position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(25,22,41,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);font-family:'Poppins',system-ui,-apple-system,sans-serif;animation:sqv-fade .2s ease}
@keyframes sqv-fade{from{opacity:0}to{opacity:1}}
.sqv-pw-card,.sqv-pay-track .sqv-pw-card{position:relative;width:100%;max-width:440px;max-height:calc(100vh - 32px);overflow:auto;background:#fff;border-radius:22px;padding:26px 22px 20px;color:var(--k);text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.28);line-height:1.45}
.sqv-pay-track{--r:#5B35F5;--r2:#4524D9;--y:#FFB56B;--k:#191629;--t:#4A4A4A;--g:#1A8A45;font-family:'Poppins',system-ui,-apple-system,sans-serif;margin:0 0 22px}
.sqv-pay-track .sqv-pw-card{max-width:none;max-height:none;box-shadow:none;border:1px solid var(--sq-line,#E7E5F0);box-shadow:0 7px 21px rgba(91,53,245,.16)}
.sqv-pw-x{position:absolute;top:10px;right:10px;width:36px;height:36px;border:0;border-radius:50%;background:#F2F2F2;color:var(--k);font-size:1.1rem;line-height:1;cursor:pointer}
.sqv-pw-ic{width:74px;height:74px;margin:0 auto 14px;border-radius:50%;display:grid;place-items:center;background:#FFF1E2;color:var(--k);position:relative}
.sqv-pw-ic svg{width:36px;height:36px}
.sqv-pw[data-e=attente] .sqv-pw-ic::before,.sqv-pay-track[data-e=attente] .sqv-pw-ic::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:3px solid var(--y);animation:sqv-ring 1.6s ease-out infinite}
@keyframes sqv-ring{0%{transform:scale(.85);opacity:1}100%{transform:scale(1.25);opacity:0}}
.sqv-pw-ic.ok{background:#E3F5EA;color:var(--g)}
.sqv-pw-ic.ko{background:#FDECEC;color:var(--r)}
.sqv-pw-ic.warn{background:#FFF1E2;color:#8A6100}
.sqv-pw h3{margin:0 0 8px;font-size:1.25rem;font-weight:900;letter-spacing:-.02em;line-height:1.25;color:var(--k)}
.sqv-pw-lead{margin:0 0 14px;font-size:.92rem;color:var(--t)}
.sqv-pw-lead b{color:var(--k);white-space:nowrap}
.sqv-pw-steps{list-style:none;margin:0 0 14px;padding:0;text-align:left;display:grid;gap:8px;counter-reset:s}
.sqv-pw-steps li{position:relative;padding:10px 12px 10px 46px;border-radius:12px;background:#F7F7F5;font-size:.86rem;line-height:1.35;counter-increment:s;margin:0}
.sqv-pw-steps li::before{content:counter(s);position:absolute;left:12px;top:50%;transform:translateY(-50%);width:24px;height:24px;border-radius:50%;background:var(--k);color:var(--y);font-weight:900;font-size:.78rem;display:grid;place-items:center}
.sqv-pw-wait{display:flex;align-items:center;justify-content:center;gap:10px;margin:2px 0 10px;font-size:.86rem;font-weight:700;color:var(--k)}
.sqv-pw-t{font-variant-numeric:tabular-nums;color:var(--r);min-width:3.2em;text-align:left}
.sqv-spin{width:18px;height:18px;border-radius:50%;border:3px solid #EDEDED;border-top-color:var(--r);animation:sqv-spin .8s linear infinite;flex:none}
@keyframes sqv-spin{to{transform:rotate(360deg)}}
.sqv-pw-help{font-size:.78rem;color:#6B6B6B;margin:0 0 14px}
.sqv-pw-msg{margin:0 0 12px;font-size:.84rem;font-weight:700;color:var(--r2)}
.sqv-pw-act{display:grid;gap:8px}
.sqv-pw-act button,.sqv-pw-act a{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;border-radius:999px;border:2px solid var(--k);background:#fff;color:var(--k)!important;font:inherit;font-weight:800;font-size:.92rem;cursor:pointer;text-decoration:none!important;padding:10px 16px;line-height:1.2}
.sqv-pw-act .p{background:var(--r);border-color:var(--r);color:#fff!important}
.sqv-pw-act .p:hover{background:var(--r2);border-color:var(--r2)}
.sqv-pw-act button[disabled]{opacity:.45;cursor:default}
.sqv-pw-act .lnk{border:0;min-height:36px;font-weight:700;font-size:.84rem;color:#6B6B6B!important;text-decoration:underline!important;text-underline-offset:3px}
.sqv-pw-form{text-align:left;margin:4px 0 12px}
.sqv-pw-form .sqv-pay-f{margin:0 0 12px}
.sqv-pw-form .sqv-pw-act{margin-top:4px}
.sqv-pw-form .sqv-pay-ops{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
.sqv-pw-fee{display:block;margin-top:4px;font-size:.76rem;color:#7A7A7A}
.sqv-pw-act .lnk svg{flex:none}
.sqv-pay-track h3{margin:0 0 8px;font-size:1.2rem;font-weight:900;letter-spacing:-.02em;line-height:1.25;color:var(--k)}
.sqv-pay-track .sqv-pw-card{margin:0 auto;max-width:520px}
.sqv-pay-resume{--r:#5B35F5;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 0 16px;padding:12px 14px;border-radius:14px;background:#FFF1E2;border:1.5px solid #191629;font-family:'Poppins',system-ui,sans-serif;font-size:.86rem;font-weight:700;color:#191629}
.sqv-pay-resume button{border:0;border-radius:999px;background:var(--r);color:#fff;font:inherit;font-weight:800;font-size:.84rem;padding:9px 16px;cursor:pointer}
.sqv-pw-foot{margin-top:12px;font-size:.72rem;color:#9A9A9A;display:flex;align-items:center;justify-content:center;gap:6px}
.sqv-pay-ok{display:flex;gap:12px;align-items:center;margin:0 0 20px;padding:14px 16px;border-radius:16px;background:#E3F5EA;border:1.5px solid #9AD3AE;font-family:'Poppins',system-ui,sans-serif;font-size:.9rem;color:#191629}
.sqv-pay-ok span{flex:none;width:34px;height:34px;border-radius:50%;background:#1A8A45;color:#fff;display:grid;place-items:center;font-weight:900}
.sqv-pay-ok b{display:block;font-size:1rem}
html.sqv-pw-open,html.sqv-pw-open body{overflow:hidden}
@media (max-width:480px){
  .sqv-pw{align-items:flex-end;padding:0}
  .sqv-pw .sqv-pw-card{max-width:none;border-radius:22px 22px 0 0;max-height:94vh;padding:24px 18px calc(18px + env(safe-area-inset-bottom));animation:sqv-up .25s ease}
  @keyframes sqv-up{from{transform:translateY(30px)}to{transform:none}}
  .sqv-pw h3{font-size:1.12rem}
}
@media (prefers-reduced-motion:reduce){.sqv-pw,.sqv-pw .sqv-pw-card,.sqv-spin,.sqv-pw-ic::before{animation:none!important}}
.sqv-pay-track .sqv-pw-lead{font-size:.92rem;margin:0 0 16px}
.sqv-pay-track .sqv-pw-act{max-width:380px;margin:0 auto}
.sqv-pay-track .sqv-pw-steps,.sqv-pay-track .sqv-pw-form{max-width:440px;margin-left:auto;margin-right:auto}
/* 3.22 : vrais logos des moyens de paiement (images réglées par l'équipe) */
.sqv-op .sqv-op-i.img{background:#fff!important;padding:3px;overflow:hidden;border:1px solid #ECECEC}
.sqv-op .sqv-op-i.img img{width:100%;height:100%;object-fit:contain;display:block;border-radius:6px}