/* OFAP Attestation Certification — front (scopé, Divi-safe) */
:is(#ofap-attestation-app,#ofap-att-lightbox){
    --oat-rouge:#ED1C25; --oat-bleu:#2D2A4E; --oat-vert:#22AF9E; --oat-beige:#FFEBDE;
    max-width:1180px; margin:0 auto; container-type:inline-size;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) *{
    font-family:'Montserrat',sans-serif !important;
    box-sizing:border-box;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-step{display:none}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-step.is-active{display:block;animation:oatFade .35s ease}
@keyframes oatFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-card{
    background:#fff;border-radius:18px;overflow:hidden;
    box-shadow:0 12px 40px rgba(45,42,78,.12);border:1px solid rgba(45,42,78,.08);
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-head{
    background:var(--oat-bleu);color:#fff;padding:26px 30px 22px;text-align:center;
    border-bottom:4px solid var(--oat-rouge);
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-head h2{
    margin:0 !important;color:#fff !important;font-size:24px !important;
    font-weight:800 !important;line-height:1.25 !important;letter-spacing:.2px;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-head p{margin:6px 0 0 !important;color:#FFEBDE !important;font-size:15px !important;font-weight:600 !important}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-intro{padding:22px 30px 0;margin:0 !important;color:#3c3a55 !important;font-size:15px !important;line-height:1.6 !important}

:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-form{padding:20px 30px 30px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-grid label{
    display:flex;flex-direction:column;gap:6px;
    font-size:13px !important;font-weight:700 !important;color:var(--oat-bleu) !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-grid .oat-full{grid-column:1/-1}
:is(#ofap-attestation-app,#ofap-att-lightbox) input[type=text],
:is(#ofap-attestation-app,#ofap-att-lightbox) input[type=email],
:is(#ofap-attestation-app,#ofap-att-lightbox) input[type=date]{
    width:100%;padding:12px 14px !important;border:1.5px solid #d9d7e6 !important;border-radius:10px !important;
    font-size:15px !important;font-weight:500 !important;color:#222 !important;background:#fbfaff !important;
    transition:border-color .2s, box-shadow .2s; min-height:46px;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) input:focus{
    outline:none !important;border-color:var(--oat-vert) !important;
    box-shadow:0 0 0 3px rgba(34,175,158,.18) !important;background:#fff !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-hp{position:absolute !important;left:-9999px !important;opacity:0;height:0;width:0;padding:0 !important;border:0 !important}

:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-consent{
    display:flex;gap:10px;align-items:flex-start;margin:18px 0 6px;
    font-size:13.5px !important;font-weight:500 !important;color:#3c3a55 !important;line-height:1.5 !important;cursor:pointer;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-consent input{margin-top:3px;accent-color:var(--oat-vert);width:18px;height:18px;flex:0 0 auto}

:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-error{
    margin:14px 0 0;padding:12px 16px;border-radius:10px;
    background:#fdecec;color:#b3121a !important;border:1px solid #f5c2c5;
    font-size:14px !important;font-weight:600 !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-btn{
    display:block;width:100%;margin-top:18px;padding:15px 22px !important;
    background:var(--oat-rouge) !important;color:#fff !important;border:none !important;border-radius:12px !important;
    font-size:16px !important;font-weight:700 !important;letter-spacing:.3px;cursor:pointer;
    transition:transform .15s, box-shadow .15s, background .2s;
    box-shadow:0 6px 18px rgba(237,28,37,.3);text-transform:none !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-btn:hover{background:#d2131c !important;transform:translateY(-1px)}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-btn[disabled]{opacity:.6;cursor:wait;transform:none}

/* Étape signature */
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-card-sign .oat-iframe-wrap{position:relative;min-height:720px;background:#f6f5fb}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-iframe-wrap iframe{
    display:block;width:100%;height:720px;border:0;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-loader{
    position:absolute;inset:0;display:flex;flex-direction:column;gap:16px;align-items:center;justify-content:center;
    color:var(--oat-bleu) !important;font-size:15px !important;font-weight:600 !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-loader span{
    width:42px;height:42px;border-radius:50%;
    border:4px solid rgba(45,42,78,.15);border-top-color:var(--oat-vert);
    animation:oatSpin .8s linear infinite;
}
@keyframes oatSpin{to{transform:rotate(360deg)}}

/* Étape confirmation */
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-done{padding:50px 30px;text-align:center}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-done h2{
    margin:18px 0 8px !important;color:var(--oat-bleu) !important;
    font-size:26px !important;font-weight:800 !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-done-msg{margin:0 auto !important;max-width:480px;color:#3c3a55 !important;font-size:15.5px !important;line-height:1.6 !important}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-check svg{width:84px;height:84px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-check circle{stroke:var(--oat-vert);stroke-width:3;stroke-dasharray:151;stroke-dashoffset:151;animation:oatDraw .7s ease forwards}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-check path{stroke:var(--oat-vert);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40;animation:oatDraw .5s .5s ease forwards}
@keyframes oatDraw{to{stroke-dashoffset:0}}

@container (max-width:640px){
    :is(#ofap-attestation-app,#ofap-att-lightbox) .oat-grid{grid-template-columns:1fr}
    :is(#ofap-attestation-app,#ofap-att-lightbox) .oat-head h2{font-size:19px !important}
    :is(#ofap-attestation-app,#ofap-att-lightbox) .oat-form,:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-intro{padding-left:18px;padding-right:18px}
    :is(#ofap-attestation-app,#ofap-att-lightbox) .oat-iframe-wrap iframe,:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-card-sign .oat-iframe-wrap{min-height:640px;height:640px}
}

/* ===== Aperçu live du document ===== */
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-layout{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:26px;align-items:start}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-preview{position:sticky;top:24px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-preview-tag{
    display:inline-block;margin:0 0 10px;padding:5px 12px;border-radius:999px;
    background:var(--oat-vert);color:#fff !important;
    font-size:11.5px !important;font-weight:700 !important;letter-spacing:.4px;text-transform:uppercase;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet{
    background:#fff;border:1px solid rgba(45,42,78,.14);border-radius:8px;overflow:hidden;
    box-shadow:0 10px 30px rgba(45,42,78,.14);aspect-ratio:210/297;
    display:flex;flex-direction:column;font-size:7.4px;line-height:1.45;color:#222;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-head{
    background:var(--oat-bleu);color:#fff;text-align:center;padding:10px 8px 8px;
    border-bottom:2px solid var(--oat-rouge);display:flex;flex-direction:column;gap:2px;flex:0 0 auto;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-head strong{font-size:8.6px !important;font-weight:800 !important;color:#fff !important;letter-spacing:.2px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-head span{font-size:7.6px !important;font-weight:700 !important;color:#fff !important}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-head em{font-size:6.4px !important;font-style:normal !important;color:#FFEBDE !important}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-body{padding:9px 11px;flex:1;display:flex;flex-direction:column;min-height:0}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-body p{margin:0 0 4px !important;font-size:7.4px !important;line-height:1.45 !important;color:#222 !important}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-fields{width:100%;border-collapse:collapse;margin:2px 0 5px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-fields td{padding:1.5px 0 !important;border:0 !important;font-size:7.4px !important;vertical-align:top}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-fields td:first-child{width:84px;font-weight:700 !important;color:var(--oat-bleu) !important;white-space:nowrap}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-body ul{margin:0 0 5px !important;padding:0 0 0 11px !important;list-style:none !important}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-body ul li{
    margin:0 0 2.5px !important;font-size:6.9px !important;line-height:1.4 !important;color:#222 !important;position:relative;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-body ul li::before{content:"–";position:absolute;left:-10px;color:var(--oat-rouge);font-weight:700}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-fait{font-weight:600 !important}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-mention{font-style:italic !important;color:#6e6e78 !important;font-size:6.4px !important}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-zones{display:flex;gap:8px;margin:3px 0 6px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-zone{
    flex:1;height:30px;border:1px solid #d4d2e0;border-radius:3px;position:relative;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-zone-sig{border-color:var(--oat-vert)}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-zone i{
    position:absolute;left:0;right:0;bottom:-9px;text-align:center;
    font-size:5.8px !important;font-style:normal !important;color:#8a889c !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet-foot{
    margin-top:auto;padding-top:8px;text-align:center;
    font-size:5.4px !important;line-height:1.5 !important;color:#9a98a8 !important;
}
/* Valeurs : placeholder pointillé tant que vide, puis surlignage à la saisie */
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-ph:empty::before{content:"............................";color:#b9b7c8;letter-spacing:1px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-ph{font-weight:600;color:var(--oat-bleu) !important;border-radius:2px;transition:background .6s}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-ph.oat-flash{background:rgba(34,175,158,.22);transition:none}

@container (max-width:900px){
    :is(#ofap-attestation-app,#ofap-att-lightbox) .oat-layout{grid-template-columns:1fr}
    :is(#ofap-attestation-app,#ofap-att-lightbox) .oat-preview{position:static;max-width:420px;margin:0 auto;width:100%}
}

/* Les étapes signature et confirmation restent centrées en largeur lisible */
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-step-sign .oat-card,
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-step-done .oat-card{max-width:860px;margin:0 auto}

/* ===== Agrandissement de l'aperçu (lightbox) ===== */
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-preview-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-preview-bar .oat-preview-tag{margin:0}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-zoom-btn{
    padding:5px 12px !important;border-radius:999px !important;border:1.5px solid var(--oat-bleu) !important;
    background:#fff !important;color:var(--oat-bleu) !important;cursor:pointer;
    font-size:11.5px !important;font-weight:700 !important;letter-spacing:.3px;line-height:1.4 !important;
    transition:background .2s,color .2s;text-transform:none !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-zoom-btn:hover{background:var(--oat-bleu) !important;color:#fff !important}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet{cursor:zoom-in;transition:box-shadow .2s,transform .2s}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sheet:hover{box-shadow:0 14px 38px rgba(45,42,78,.24);transform:translateY(-2px)}

/* La lightbox est déplacée dans <body> au chargement (id #ofap-att-lightbox)
   pour échapper aux transformations CSS des sections Divi qui piègent position:fixed */
#ofap-att-lightbox{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;max-width:none;margin:0;padding:0}
#ofap-att-lightbox[hidden]{display:none}
#ofap-att-lightbox .oat-lightbox-backdrop{
    position:absolute;inset:0;background:rgba(45,42,78,.78);
    backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
    animation:oatFade .25s ease;cursor:zoom-out;
}
#ofap-att-lightbox .oat-lightbox-close{
    position:absolute;top:18px;right:22px;z-index:2;width:46px;height:46px;border-radius:50% !important;
    border:none !important;background:#ED1C25 !important;color:#fff !important;cursor:pointer;
    font-size:19px !important;font-weight:700 !important;line-height:1 !important;
    box-shadow:0 6px 18px rgba(0,0,0,.3);transition:transform .15s,background .2s;
    font-family:'Montserrat',sans-serif !important;
}
#ofap-att-lightbox .oat-lightbox-close:hover{background:#d2131c !important;transform:scale(1.08)}
#ofap-att-lightbox .oat-lightbox-stage{position:relative;z-index:1;animation:oatFade .3s ease}
#ofap-att-lightbox .oat-sheet{
    position:absolute;top:0;left:0;width:390px;cursor:default !important;transform-origin:top left;
    box-shadow:0 24px 70px rgba(0,0,0,.45);
}
#ofap-att-lightbox .oat-sheet:hover{box-shadow:0 24px 70px rgba(0,0,0,.45)}

/* ===== v2 — Étape signature : pad + OTP ===== */
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sign-body{padding:22px 30px 30px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-sign-info{
    background:#FFEBDE;border:1px solid #f5cdb4;border-radius:12px;padding:13px 16px;
    color:#5a3a26 !important;font-size:14px !important;font-weight:500 !important;line-height:1.55 !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-pad-block{margin:20px 0 4px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-pad-label{
    font-size:13px !important;font-weight:700 !important;color:var(--oat-bleu) !important;margin-bottom:8px;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-pad-label span{font-weight:500 !important;color:#8a889c !important}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-pad-wrap{
    position:relative;border:2px dashed #c9c6dd;border-radius:14px;background:#fbfaff;overflow:hidden;
    transition:border-color .2s;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-pad-wrap:hover{border-color:var(--oat-vert)}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-pad{
    display:block;width:100%;height:auto;aspect-ratio:3/1;touch-action:none;cursor:crosshair;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-pad-hint{
    position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
    color:#b9b7c8 !important;font-size:17px !important;font-weight:600 !important;pointer-events:none;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-pad-clear{
    margin-top:8px;padding:7px 14px !important;border-radius:9px !important;
    border:1.5px solid #d9d7e6 !important;background:#fff !important;color:#5a5876 !important;cursor:pointer;
    font-size:12.5px !important;font-weight:600 !important;transition:border-color .2s,color .2s;text-transform:none !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-pad-clear:hover{border-color:var(--oat-rouge) !important;color:var(--oat-rouge) !important}

:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-otp-block{
    margin:18px 0 4px;padding:16px;border:1px solid #e3e1ef;border-radius:12px;background:#fbfaff;
    display:flex;flex-wrap:wrap;align-items:center;gap:12px;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-otp-label{
    flex:1 1 100%;font-size:13px !important;font-weight:700 !important;color:var(--oat-bleu) !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-otp-input{
    width:170px !important;text-align:center;font-size:22px !important;letter-spacing:8px;
    font-weight:700 !important;padding:10px 12px !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-otp-resend{
    padding:9px 14px !important;border-radius:9px !important;border:1.5px solid var(--oat-vert) !important;
    background:#fff !important;color:var(--oat-vert) !important;cursor:pointer;
    font-size:12.5px !important;font-weight:700 !important;transition:background .2s,color .2s;text-transform:none !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-otp-resend:not([disabled]):hover{background:var(--oat-vert) !important;color:#fff !important}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-otp-resend[disabled]{opacity:.55;cursor:default}

:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-btn-sign{margin-top:16px}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-back{
    display:block;margin:14px auto 0;background:none !important;border:none !important;cursor:pointer;
    color:#8a889c !important;font-size:13px !important;font-weight:600 !important;text-decoration:underline;text-transform:none !important;
}
:is(#ofap-attestation-app,#ofap-att-lightbox) .oat-back:hover{color:var(--oat-bleu) !important}
