*{box-sizing:border-box;margin:0;padding:0}@font-face{font-family:IBM Plex Arabic;src:url(/assets/IBMPlexSansArabic-Medium-9AMM1-8b.ttf)format("truetype")}@font-face{font-family:Aynama Curved;src:url(/assets/KOAynama-Curved-D_5-WG55.ttf)format("truetype")}@font-face{font-family:Khalaya;src:url(/assets/KoKhalaya-5-5-Dj0r9FWk.otf)format("opentype")}@font-face{font-family:Khalaya VF;src:url(/assets/KoKhalayaVF-CLG3K6Fa.ttf)format("truetype")}body{direction:rtl;background-color:#fff;margin:0;font-family:IBM Plex Sans Arabic,sans-serif}.page-container{flex-direction:column;min-height:100vh;display:flex}.page-container-tow{flex-direction:column;max-height:100vh;display:flex}.page-one,.page-two{aspect-ratio:855/805;width:90%;max-width:855px;min-height:unset;background-image:url(/background-one.png);background-position:50%;background-repeat:no-repeat;background-size:97% 95%;justify-content:center;align-items:center;margin:0 auto;display:flex}.page-three{background-image:url(/assets/design-page-3-H0MXH2iY.png);background-repeat:no-repeat;background-size:100% 100%;justify-content:center;align-items:center;width:90%;max-width:950px;min-height:600px;margin:40px auto;padding:40px 0;display:flex}header{justify-content:center;align-items:center;gap:100px;width:100%;max-width:1200px;margin:-15px auto -25px;padding:0 100px;display:flex;position:relative}header:before{content:"";background-color:#000;width:1px;height:120px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}header .left,header .right{flex:1;align-items:center;display:flex}header .left{justify-content:flex-end;gap:20px}header .right{justify-content:flex-start}header .left .eid-elfeter{width:300px;height:auto}.logo{width:100px;height:auto;margin-top:20px}header .right img{width:100%;max-width:480px;height:auto}.card{background-color:#0000;border-radius:0;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:10% 6% 6%;display:flex}.page-three .card{padding:40px 20px}.page-two .card{padding:35px 20px}.card h3{color:#000;text-align:center;margin-bottom:60px;font-size:48px;font-weight:700}.page-one .card{justify-content:space-between;padding:50px;position:relative}.page-two .card{justify-content:space-between}.page-one .card h3{margin-top:90px;margin-left:70px}.input-container,.card-content{flex-direction:column;margin-top:70px;margin-left:70px;display:flex}.page-two .card-content{margin-top:100px}.page-one .input-container{margin-top:0;margin-bottom:280px;margin-left:100px}.page-three-title{margin-bottom:20px!important;font-size:28px!important}.card input{color:#000;text-align:right;appearance:none;-o-transition:opacity .2s, background-color .2s;background-color:#d9d9d9;border:none;border-radius:0;outline:none;width:100%;max-width:1300px;padding:18px 50px;font-family:inherit;font-size:24px;transition:opacity .2s,background-color .2s}.card input::placeholder{color:#aca8a8;opacity:1;font-size:36px}.card input:focus{opacity:1}.input-hint{color:#aaa;text-align:center;margin-bottom:20px;font-size:22px}.error-message{color:#86888e;text-align:center;margin-top:0;margin-bottom:400px;margin-left:100px;font-size:32px;font-weight:600}.error-message .error-svg{width:430px;height:auto;margin:0 auto;display:block}.error-message .error-svg--arabic{max-width:370px;margin-top:-30px}.error-message .space{max-width:410px;margin-top:-30px;margin-left:65px}.page-two .error-message{text-align:center;margin-top:5px;margin-bottom:0;font-size:20px}.page-three .error-message{margin-bottom:0!important}.card button{color:#fff;cursor:pointer;-o-transition:opacity .2s, background-color .2s;appearance:none;background-color:#2cb35d;border:none;border-radius:0;margin-top:25px;padding:5px 80px;font-family:inherit;font-size:24px;transition:opacity .2s,background-color .2s}.card button:hover{opacity:1}.page-one .input-container{align-items:center;position:absolute;top:52%}.card .btn-choice{text-align:center;-o-transition:all .2s;background-color:#4285f4;border:3px solid #0000;border-radius:0;width:80%;min-width:530px;max-width:600px;margin-top:20px;margin-bottom:5px;margin-right:40px;padding:16px 30px;font-size:24px;font-weight:400;transition:all .2s}.page-two h3{margin-bottom:10px}.card .btn-choice:hover,.card .btn-choice.selected{opacity:1}.card .btn-choice.selected{border-color:#000;transform:scale(.98)}.card .btn-choice.blue{background-color:#ea4335}.action-buttons{direction:ltr;justify-content:center;gap:30px;margin-top:0;margin-bottom:190px;margin-left:100px;display:flex}.page-three .action-buttons{margin-bottom:400px}.card .action-buttons button{margin-top:0;padding:15px 70px}.card button.btn-yellow,.card button.yellow{color:#fff;background-color:#ffc10e}.grid-container{display:-ms-grid;direction:ltr;grid-template-columns:repeat(2,minmax(220px,280px));gap:15px;width:70%;max-width:760px;margin-top:110px;margin-bottom:30px;margin-right:-210px;display:grid}.grid-item{aspect-ratio:3/4.2;cursor:pointer;-o-transition:all .2s ease;background-color:#d1d1d1;border:4px solid #0000;transition:all .2s;position:relative;overflow:hidden}.grid-item.selected{border-color:#000;transform:scale(.98)}.image-placeholder{width:100%;height:100%}.name-overlay{color:#333;text-align:center;pointer-events:none;width:90%;font-size:20px;font-weight:700;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.popup-overlay{z-index:9999;background-color:#0006;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.popup-content{text-align:center;background-color:#fff;border-radius:30px;width:80%;max-width:400px;padding:40px;box-shadow:0 4px 20px #00000026}.popup-content p{color:#000;margin-bottom:30px;font-size:24px;font-weight:700}.popup-content button{color:#fff;cursor:pointer;-o-transition:opacity .2s;background-color:#ee4032;border:none;border-radius:20px;padding:10px 50px;font-family:inherit;font-size:20px;transition:opacity .2s}.popup-content button:hover{opacity:.9}.card-overlay{z-index:10;background-color:#0000;flex-direction:column;justify-content:center;align-items:center;gap:15px;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.btn-view{cursor:pointer;width:auto;min-width:170px;font-family:inherit;box-shadow:0 4px 6px #0000004d;color:#fff!important;background-color:#f40000!important;border:none!important;margin-top:250px!important;padding:5px 40px!important;font-size:20px!important}.btn-select{cursor:pointer;width:auto;min-width:170px;font-family:inherit;box-shadow:0 4px 6px #0000004d;color:#fff!important;background-color:#4285f4!important;border:none!important;margin-top:0!important;padding:5px 40px!important;font-size:20px!important}.image-popup-overlay{z-index:10000;background-color:#000000d9;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.image-popup-content{background-color:#0000;border-radius:20px;justify-content:center;align-items:center;max-width:90%;max-height:90%;display:flex;position:relative}.image-popup-content canvas{border-radius:20px;max-width:100%;max-height:90vh;display:block}.btn-close-popup{cursor:pointer;z-index:10001;justify-content:center;align-items:center;font-weight:700;display:flex;position:absolute;top:-20px;right:-20px;box-shadow:0 4px 6px #0000004d;color:#000!important;background-color:#fff!important;border:none!important;border-radius:50%!important;width:40px!important;height:40px!important;margin-top:0!important;padding:0!important;font-size:30px!important}.page-four{width:90%;max-width:855px;min-height:unset;aspect-ratio:855/805;background-image:url(/background-one.png);background-position:50%;background-repeat:no-repeat;background-size:97% 88%;justify-content:center;align-items:center;margin:2px auto 0;display:flex}.split-card{direction:ltr;flex-direction:row;justify-content:center;align-items:center;gap:10px;width:90%;margin-top:-100px;margin-left:50px;padding:20px;display:flex}.share-section{direction:rtl;flex-direction:column;justify-content:center;align-items:center;width:50%;padding:0 20px;display:flex}.share-section h3{margin-bottom:-10px}.share-subtitle{color:#333;text-align:center;margin-bottom:40px;font-size:24px;font-weight:700}.page-four-actions{flex-direction:column;gap:15px;width:100%;max-width:380px;display:flex}.page-four .canvas-section canvas{border-radius:0;min-width:280px}.page-four-actions button{width:100%;margin-top:0!important}.page-four-link{width:100%;text-decoration:none}.share-buttons-grid{display:-ms-grid;grid-template-columns:repeat(2,minmax(120px,180px));gap:10px;width:100%;margin-bottom:5px;display:grid}.share-btn{cursor:pointer;-webkit-transition:-webkit-transform .2s,opacity .2s;border:none;border-radius:30px;justify-content:center;align-items:center;width:100%;transition:transform .2s,opacity .2s;display:flex;margin-top:0!important;padding:10px!important}.share-btn:hover{transform:scale(1.05);opacity:.9!important}.share-btn.x-br{color:#fff!important;background-color:#000!important}.share-btn.whatsapp{color:#fff!important;background-color:#25d366!important}.share-btn.snapchat{color:#fff!important;background-color:#ffc10e!important}.share-btn.instagram{color:#e1306c!important;background-color:#f0f0f0!important;border:1px solid #ddd!important}.share-btn.linkedin{color:#fff!important;background-color:#0077b5!important}.share-btn.tiktok{color:#ff0050!important;background-color:#000!important}.share-btn.instagram img,.share-btn.snapchat img,.share-btn.tiktok img{width:30px;height:30px}.canvas-section{justify-content:center;align-items:center;width:35%;display:flex}.page-four-preview{background:#d1d1d1;justify-content:center;align-items:center;width:120%;max-width:420px;min-height:400px;padding:5px;display:flex}.canvas-section canvas{border-radius:20px;width:100%;max-width:360px;height:auto;box-shadow:0 10px 30px #00000026}footer{justify-content:center;align-items:center;margin-top:auto;padding-top:5px;padding-bottom:30px;display:flex}footer a{color:#000;font-size:10px;font-weight:700;text-decoration:none}footer span{margin-right:3px;font-family:Khalaya VF,sans-serif;font-size:20px}.page-one footer,.page-two footer{margin-top:20px}.card-loading-overlay{justify-content:center;gap:3px;width:100%;margin:5px 0;display:flex}.card-loading-count{color:#000;text-align:center;font-size:16px;font-weight:700}.card-loading-text{color:#000;text-align:center;font-size:14px;font-weight:700}.page-four-preview{width:100%;display:inline-block;position:relative}.page-four-preview canvas{width:100%;height:auto;display:block}.btn-download-overlay{-webkit-backdrop-filter:blur(1.5px);backdrop-filter:blur(1.5px);cursor:pointer;-o-transition:background .2s;align-items:center;gap:8px;font-family:inherit;font-size:14px;transition:background .2s;display:flex;position:absolute;bottom:16px;left:57%;transform:translate(-50%);box-shadow:0 4px 30px #0000001a;border-left:.8px solid!important;border-right:.8px solid!important;border-radius:4px!important;padding:10px 22px!important}.btn-download-overlay svg{padding:1px}.btn-download-overlay:hover{background:#c8c8c8}.page-four .card button{background:0 0;padding:0}@media (width<=1024px){header{gap:40px;padding:30px 50px}header:before{height:90px}header .left .eid-elfeter{width:200px}.logo{width:70px}header .right img{max-width:300px}.page-one,.page-two{padding:40px 20px}.card{border-radius:20px;width:85%;min-height:320px;padding:50px 20px}.page-one .card{padding:8%}.card h3{margin-bottom:40px;font-size:30px}.page-two .card h3{margin-bottom:10px;font-size:30px}.card input{max-width:400px;padding:18px 50px;font-size:24px}.card input::placeholder{font-size:16px}.card button{margin-top:20px;padding:5px 40px;font-size:20px}.card .btn-choice{margin:15px;padding:5px 20px;font-size:24px}.action-buttons{gap:10px;margin-top:15px}.card .action-buttons button{padding:5px 30px}.page-three .card{padding:30px 20px}.page-four-preview{min-height:360px}.split-card{padding:2%}.share-section h3{margin-bottom:20px}.share-subtitle{font-size:16px}.error-message{font-size:24px}}@media (width<=768px){header{gap:30px;width:95%;margin:0 auto;padding:20px 0}header:before{height:60px;left:51%}header .left{gap:.4px;margin-right:-11px}header .left .eid-elfeter{width:120px;margin-bottom:-10px}.logo{width:55px}header .right img{max-width:200px}.page-one,.page-two{width:95%;min-height:unset;aspect-ratio:1693/2348;background-size:100% 70%;border-radius:0;margin:-70px auto 0}.page-four{margin-top:-70px}.page-three{background-image:url(/assets/design-page-3-mob-DIN5lxJ1.png);width:90%;min-height:470px;margin:20px auto;padding:20px 0}.card{border-radius:0;width:100%;padding:15% 5%}.input-container,.card-content{flex-direction:column;margin-top:15px;margin-left:30px;display:flex}.page-one .card{padding:15% 5%}.page-one .input-container{margin-bottom:40%;margin-left:40px;top:50%!important}.page-two .card-content{margin-top:15px}.page-two .card{padding:10% 5%}.page-three .card{width:100%;padding:8% 5%}.page-four .card{width:100%}.card h3{margin-bottom:50px}.page-two .card h3{margin-top:20%;margin-bottom:0}.card h3 svg{width:255px}.card input{max-width:260px;padding:10px 30px;font-size:16px;font-weight:500}.card input::placeholder{font-size:14px;font-weight:500}.card button{font-size:16px}.card .btn-choice{width:85%;min-width:100px;margin:-35px 10px 10px;padding:5px 20px;font-size:16px}.card .btn-choice.blue{margin-top:0;margin-bottom:0}.action-buttons{gap:10px;margin-top:10px;margin-bottom:90px;margin-left:50px}.page-two .action-buttons{margin-bottom:44%}.page-three .action-buttons{margin-bottom:150px}.grid-container{grid-template-columns:repeat(1,minmax(50px,138px));gap:5px;width:70%;min-height:2000px;margin-top:30px;margin-bottom:15px;margin-right:-150px}.btn-view{min-width:0;margin-top:90px!important;padding:1px 30px!important;font-size:18px!important}.btn-select{min-width:0;margin-top:-5px!important;padding:1px 30px!important;font-size:18px!important}.name-overlay{font-size:14px}.btn-close-popup{top:-20px;right:-10px}.page-four{width:95%;min-height:unset;background-repeat:no-repeat;background-size:100% 80%;border-radius:0;margin:20px auto;padding:15px 5px}.page-four .canvas-section canvas{border-radius:0;min-width:130px}.page-four .canvas-section{margin-top:-80px;margin-left:-15px;margin-right:24px}.page-four-preview{width:100%;min-height:170px;padding:1px}.page-four .card h3 svg,.page-four .card p svg{width:120px;margin-left:-20px}.page-four .card p svg{margin-top:-20px}.split-card{direction:rtl;margin-top:45px;margin-left:80px;padding:10px}.canvas-section{order:-1;width:100%}.share-section{width:50%;margin-top:-80px}.share-section h3{margin-top:-35px;margin-bottom:-30px;font-size:0}.share-section p{margin-bottom:0}.share-buttons-grid{grid-template-columns:repeat(2,minmax(54px,66px));gap:5px;max-width:100%;margin-bottom:10px;margin-left:-22px}.share-buttons-grid svg,.share-buttons-grid .share-btn img{width:12px!important;height:12px!important}.share-btn{padding:3px 4px!important}.page-one .error-message{font-size:14px;position:absolute;top:40%;left:-25%}.page-three .error-message{margin-right:40px;font-size:14px}.page-two .error-message{margin:0;font-size:14px}.error-message .error-svg{width:100%;max-width:319px}.error-message .error-svg--arabic{margin-top:-21%}footer{margin-top:-70px}.foot{margin-top:0}.btn-download-overlay{left:50%}.btn-download-overlay svg{width:115px;padding:2px}.error-message .space{max-width:310px}.page-one .card h3{margin-top:8%;margin-bottom:0}.btn-download-overlay{position:absolute;bottom:5px;padding:0!important}}@media (width<=480px){.page-one .card h3{margin-top:2%;margin-bottom:0;position:absolute;top:18%}.page-one .card button{margin-top:10px}.error-message .error-svg--arabic{margin-top:-2px;margin-left:80px;margin-right:-66px}.error-message .space{margin-top:-12px}}
