/* One Team — the plan card (اعمل الصح / برافو عليك) after the day's sales are saved */
@font-face{font-family:'Marhey';font-weight:700;font-display:swap;src:url(../fonts/marhey-arabic-700.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Marhey';font-weight:700;font-display:swap;src:url(../fonts/marhey-latin-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Readex Pro';font-weight:500;font-display:swap;src:url(../fonts/readex-pro-arabic-500.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Readex Pro';font-weight:500;font-display:swap;src:url(../fonts/readex-pro-latin-500.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Readex Pro';font-weight:600;font-display:swap;src:url(../fonts/readex-pro-arabic-600.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Readex Pro';font-weight:600;font-display:swap;src:url(../fonts/readex-pro-latin-600.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Readex Pro';font-weight:700;font-display:swap;src:url(../fonts/readex-pro-arabic-700.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Readex Pro';font-weight:700;font-display:swap;src:url(../fonts/readex-pro-latin-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
#otPlan{--ink:#1B0B1F;--mut:#8A7A8E;font-family:'Readex Pro',sans-serif;color:var(--ink);direction:rtl;font-size:16px;line-height:1.4;text-align:right;letter-spacing:normal;-webkit-text-size-adjust:100%}
#otPlan *{box-sizing:border-box}#otPlan bdi{unicode-bidi:isolate}
#otPlan .gold{--flat:#FFE27A;--blob:#FFB938}#otPlan .silver{--flat:#CDE9FF;--blob:#9DE7D7}
#otPlan button{font-family:inherit}
#otPlan{position:fixed;inset:0;background:#1a0420e8;display:none;align-items:center;justify-content:center;z-index:9000;opacity:0;transition:opacity .25s;perspective:1300px}
#otPlan.on{opacity:1}
#otPlan.out{opacity:0;transition:opacity .4s .25s}
#otPlan .wrap{position:relative;width:min(310px,78vw);aspect-ratio:63/88;container-type:inline-size;transform:translateY(120vh) rotate(-12deg) scale(.88);transition:transform .7s cubic-bezier(.2,1.15,.35,1)}
#otPlan.on .wrap{transform:none}
#otPlan.out .wrap{transform:translate(-45vw,-120vh) rotate(-28deg);transition:transform .6s ease-in}
#otPlan .flip{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.3,1.25,.5,1)}
#otPlan .flip.back{transform:rotateY(180deg)}
#otPlan .side{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;border-radius:7cqw;background:var(--flat);border:1.2cqw solid var(--ink);box-shadow:2.4cqw 2.4cqw 0 var(--ink)}
#otPlan .side.b{transform:rotateY(180deg)}
#otPlan .blob{position:absolute;width:86cqw;height:86cqw;left:50%;top:45%;transform:translate(-50%,-50%);border-radius:44% 56% 52% 48%;background:var(--blob);border:1cqw solid var(--ink)}
#otPlan .spark{position:absolute;font:700 8cqw Marhey;color:var(--ink);line-height:1}
#otPlan .chw{position:absolute;left:0;right:0;top:15cqw;bottom:35cqw;overflow:hidden}
#otPlan .chw img{position:absolute;left:50%;top:0;transform:translateX(-50%);-webkit-mask:linear-gradient(#000 82%,transparent 99%);mask:linear-gradient(#000 82%,transparent 99%);
  filter:drop-shadow(.8cqw 0 0 #fff) drop-shadow(-.8cqw 0 0 #fff) drop-shadow(0 -.8cqw 0 #fff) drop-shadow(.45cqw 0 0 #1B0B1F) drop-shadow(-.45cqw 0 0 #1B0B1F) drop-shadow(0 -.45cqw 0 #1B0B1F)}
#otPlan .silver .chw img{width:90%}
#otPlan .gold .chw img{width:98%}
#otPlan .tt{position:absolute;top:3.6cqw;left:0;right:0;text-align:center;font:700 10cqw/1.2 Marhey;color:var(--ink)}
#otPlan .rk{position:absolute;top:21cqw;left:4cqw;background:#fff;border:1cqw solid var(--ink);border-radius:4cqw;padding:1.4cqw 2.6cqw 1cqw;text-align:center;box-shadow:1.2cqw 1.2cqw 0 var(--ink);transform:rotate(-6deg);line-height:1.1}
#otPlan .rk b{display:block;font:700 7.6cqw/1 Marhey}
#otPlan .rk small{font:500 2.6cqw 'Readex Pro'}
#otPlan .card2{position:absolute;left:4cqw;right:4cqw;bottom:4cqw;background:#fff;border:1cqw solid var(--ink);border-radius:5cqw;box-shadow:1.4cqw 1.4cqw 0 var(--ink);padding:3cqw;text-align:center}
#otPlan .q{font:700 5.8cqw/1.3 Marhey}
#otPlan .pills{display:flex;justify-content:center;gap:2cqw;margin-top:2cqw}
#otPlan .pill{border:.8cqw solid var(--ink);border-radius:99px;padding:.8cqw 3cqw;font:600 3.4cqw 'Readex Pro';background:var(--blob)}
#otPlan .pill b{font-weight:700;font-size:4.4cqw}
#otPlan .pill.low{background:#FFD9E6}
#otPlan .sub0{font:500 3cqw 'Readex Pro';color:var(--mut);margin-top:1.6cqw}
#otPlan .bk{position:absolute;inset:4.5cqw;display:flex;flex-direction:column;gap:2.6cqw}
#otPlan .bk h3{margin:0;text-align:center;font:700 9.4cqw/1.2 Marhey}
#otPlan .bk .sub{text-align:center;font:500 3.4cqw 'Readex Pro';margin-top:-1.6cqw}
#otPlan .bx{background:#fff;border:1cqw solid var(--ink);border-radius:4.6cqw;box-shadow:1.2cqw 1.2cqw 0 var(--ink);padding:2.4cqw 3.4cqw}
#otPlan .kpi{font:500 3.7cqw 'Readex Pro'}
#otPlan .kpi b{font:700 6.4cqw Marhey}
#otPlan .bx h4{margin:0 0 1cqw;font:700 4.8cqw Marhey}
#otPlan .list{list-style:none;margin:0;padding:0}
#otPlan .it{display:flex;align-items:center;gap:2.6cqw;padding:1.4cqw 0}
#otPlan .it .c{flex:none;min-width:11cqw;text-align:center;background:var(--blob);border:.8cqw solid var(--ink);border-radius:3cqw;padding:.6cqw 2cqw;font:700 5cqw/1.3 Marhey}
#otPlan .it .c.bad{background:#FFD9E6}
#otPlan .lh{display:flex;align-items:flex-end;gap:2.6cqw;padding-bottom:1cqw;border-bottom:.5cqw solid var(--ink);font:600 2.9cqw/1.25 'Readex Pro';color:var(--mut)}
#otPlan .lh span:first-child{flex:1}
#otPlan .lh .rt,#otPlan .it .rt,#otPlan .it .c{flex:none;width:14cqw;min-width:0;text-align:center}
#otPlan .it .rt{font:600 4.6cqw 'Readex Pro';color:#9A8AA0;border:.8cqw solid transparent;padding:.6cqw 0}
#otPlan .it .c{padding:.6cqw 0}
#otPlan .lnote{margin-top:1.4cqw;font:600 3cqw 'Readex Pro';color:var(--ink);text-align:center}
#otPlan .sq{display:inline-block;width:3.6cqw;height:3.6cqw;vertical-align:-.6cqw;background:var(--blob);border:.6cqw solid var(--ink);border-radius:1cqw}
#otPlan .money .sq{border-color:#fff}
#otPlan .money tr.best td{background:#ffffff14}
#otPlan .money tr.best td:first-child{border-radius:0 2cqw 2cqw 0}
#otPlan .money tr.best td:last-child{border-radius:2cqw 0 0 2cqw}
#otPlan .money th:first-child{text-align:right;color:#fff;font-weight:600;font-size:3cqw}
#otPlan .it.ok .c{background:#fff}
#otPlan .it.ok .t{color:#5B4A5F}
#otPlan .it.ok .t small{color:#0F9D58}
#otPlan .it .t{flex:1;min-width:0;font:600 4cqw/1.3 'Readex Pro'}
#otPlan .it .t small{display:block;font-weight:500;font-size:3cqw;color:#C2185B}
#otPlan .tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:2cqw}
#otPlan .tile{background:#fff;border:.9cqw solid var(--ink);border-radius:3.6cqw;box-shadow:1cqw 1cqw 0 var(--ink);padding:1.4cqw 1cqw;text-align:center}
#otPlan .tile small{display:block;font:500 2.8cqw/1.3 'Readex Pro';color:var(--mut)}
#otPlan .tile b{font:700 5.4cqw/1.3 Marhey}
#otPlan .tile b i{font:500 2.8cqw 'Readex Pro';font-style:normal}
#otPlan .end{margin-top:auto;background:var(--ink);color:#fff;border-radius:4cqw;text-align:center;padding:2.4cqw;font:500 3.6cqw 'Readex Pro'}
#otPlan .end b{font:700 5.4cqw Marhey;color:var(--blob)}
#otPlan .note{background:#fff;border:.8cqw dashed var(--ink);border-radius:3cqw;padding:1.4cqw 3cqw;font:600 3.2cqw 'Readex Pro';text-align:center}
#otPlan .money{width:100%;border-collapse:separate;border-spacing:0;background:var(--ink);color:#fff;border-radius:4cqw;padding:1.4cqw 2.6cqw;font:500 3.3cqw/1.5 'Readex Pro';margin-top:auto}
#otPlan .money th{font:500 2.8cqw 'Readex Pro';color:#ffffffa0;padding:.4cqw 1cqw}
#otPlan .money td{padding:.8cqw 1cqw;text-align:center;border-top:1px solid #ffffff22}
#otPlan .money td:first-child{text-align:right}
#otPlan .money b{font:700 4.2cqw 'Readex Pro';color:var(--blob);white-space:nowrap}
#otPlan .money .z{color:#FF9EC0}
#otPlan .money .nt{font-size:2.7cqw;color:#ffffff90;text-align:center}
#otPlan .bye{position:absolute;z-index:10;top:-16cqw;left:50%;transform:translateX(-50%) scale(0);background:#fff;color:var(--ink);font:700 6.4cqw Marhey;border:1cqw solid var(--ink);border-radius:5cqw;padding:1.6cqw 6cqw;box-shadow:1.2cqw 1.2cqw 0 var(--ink);white-space:nowrap;transition:transform .3s cubic-bezier(.2,1.7,.4,1)}
#otPlan .bye:after{content:"";position:absolute;bottom:-3.6cqw;left:50%;border:3cqw solid transparent;border-top-color:var(--ink);border-bottom:0;transform:translateX(-50%)}
#otPlan .bye.on{transform:translateX(-50%) scale(1)}
#otPlan .x{position:absolute;z-index:12;top:-4.5cqw;left:-4.5cqw;width:11cqw;height:11cqw;border-radius:50%;border:1cqw solid var(--ink);background:#fff;color:var(--ink);font:700 4.8cqw/1 'Readex Pro';cursor:pointer;box-shadow:.8cqw .8cqw 0 var(--ink)}
#otPlan .acts{position:absolute;z-index:12;top:calc(100% + 5cqw);left:0;right:0;display:flex;justify-content:center;gap:3cqw}
#otPlan .acts button{border:1cqw solid var(--ink);border-radius:99px;background:#fff;color:var(--ink);font:600 4.2cqw 'Readex Pro';padding:2cqw 5cqw;cursor:pointer;box-shadow:1cqw 1cqw 0 var(--ink);white-space:nowrap}
#otPlan .acts .sh{background:linear-gradient(90deg,#16E3D3,#33F07B)}
/* the button that opens the card again (on the sales page) */
.plan-again{display:flex;align-items:center;gap:8px;margin:10px auto 0;border:1.5px solid #E5DAE8;background:#fff;border-radius:99px;padding:6px 14px 6px 8px;color:#37003C;font:600 13px 'Readex Pro',sans-serif;cursor:pointer;direction:rtl}
.plan-again img{width:24px;height:24px;border-radius:50%;object-fit:cover;object-position:top;border:1.5px solid #1B0B1F;background:#FFE27A}

#otPlan .it .c.wide{width:30.6cqw;font-size:4.2cqw}
#otPlan .hnote{margin-top:2cqw;text-align:center;font:600 3.1cqw/1.5 'Readex Pro';color:var(--ink);opacity:.75}
