@import"https://fonts.googleapis.com/css2?family=Almarai:wght@300;400;700;800&family=Cairo:wght@200..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";@tailwind base;@tailwind components;@tailwind utilities;:root{--saudi-green: #245c36;--saudi-green-light: #2d7a47;--saudi-green-dark: #1a4a2a;--saudi-gold: #ffd700;--saudi-white: #ffffff;--saudi-black: #000000;--saudi-gray: #f5f5f5;--saudi-gray-dark: #666666;--saudi-shadow: rgba(36, 92, 54, .3)}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;font-family:Cairo,sans-serif;direction:rtl;overflow:hidden}.background-pattern{position:absolute;inset:0;background:linear-gradient(135deg,var(--saudi-green) 0%,var(--saudi-green-light) 30%,var(--saudi-green-dark) 100%);z-index:-3}.pattern-overlay{position:absolute;inset:0;background-image:radial-gradient(circle at 20% 80%,rgba(255,255,255,.15) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(255,255,255,.08) 0%,transparent 50%);z-index:-2}.geometric-pattern{position:absolute;inset:0;background-image:linear-gradient(45deg,rgba(255,255,255,.05) 25%,transparent 25%),linear-gradient(-45deg,rgba(255,255,255,.05) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(255,255,255,.05) 75%),linear-gradient(-45deg,transparent 75%,rgba(255,255,255,.05) 75%);background-size:60px 60px;background-position:0 0,0 30px,30px -30px,-30px 0px;z-index:-1;animation:patternMove 20s linear infinite}@keyframes patternMove{0%{transform:translate(0)}to{transform:translate(60px,60px)}}.login-content{position:relative;z-index:1;padding:20px;animation:fadeInUp .8s ease-out}.login-card{background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;border:1px solid rgba(255,255,255,.3);box-shadow:0 25px 50px #00000026,0 0 0 1px #ffffff1a,inset 0 1px #fff3;overflow:hidden;position:relative}.login-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--saudi-green) 0%,var(--saudi-gold) 50%,var(--saudi-green) 100%)}.login-card-content{padding:50px!important}.logo-section{text-align:center;margin-bottom:40px}.faainex-logo{position:relative;width:120px;height:120px;margin:0 auto 25px;display:flex;align-items:center;justify-content:center}.logo-circle{position:relative;width:100px;height:100px;background:linear-gradient(135deg,var(--saudi-green) 0%,var(--saudi-green-light) 50%,var(--saudi-gold) 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px #245c364d,0 0 0 4px #ffffff1a,inset 0 2px 4px #fff3;transition:all .3s ease;animation:logoPulse 2s ease-in-out infinite}.logo-circle:hover{transform:scale(1.1) rotate(5deg);box-shadow:0 15px 40px #245c3666,0 0 0 6px #fff3,inset 0 2px 4px #ffffff4d}@keyframes logoPulse{0%,to{box-shadow:0 10px 30px #245c364d,0 0 0 4px #ffffff1a,inset 0 2px 4px #fff3}50%{box-shadow:0 15px 40px #245c3666,0 0 0 6px #fff3,inset 0 2px 4px #ffffff4d}}.logo-text{font-size:36px;font-weight:800;color:var(--saudi-green);text-shadow:0 2px 4px rgba(0,0,0,.1);font-family:Cairo,sans-serif;letter-spacing:-2px;animation:textGlow 3s ease-in-out infinite alternate}@keyframes textGlow{0%{text-shadow:0 2px 4px rgba(0,0,0,.1);transform:scale(1)}to{text-shadow:0 2px 8px rgba(36,92,54,.3);transform:scale(1.05)}}.faainex-logo:before{content:"";position:absolute;inset:-10px;background:linear-gradient(45deg,transparent,rgba(255,215,0,.1),transparent);border-radius:50%;animation:logoRotate 4s linear infinite;z-index:-1}@keyframes logoRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.faainex-logo:after{content:"";position:absolute;top:50%;left:50%;width:120px;height:120px;background:radial-gradient(circle,rgba(255,215,0,.1) 0%,transparent 70%);border-radius:50%;transform:translate(-50%,-50%);animation:logoGlow 2s ease-in-out infinite alternate;z-index:-2}@keyframes logoGlow{0%{opacity:.3;transform:translate(-50%,-50%) scale(.8)}to{opacity:.6;transform:translate(-50%,-50%) scale(1.2)}}.app-title{color:var(--saudi-green);font-weight:800;margin-bottom:10px;text-shadow:0 2px 4px rgba(0,0,0,.1);letter-spacing:1px}.app-subtitle{color:var(--saudi-gray-dark);font-weight:500;margin-bottom:0;opacity:.9}.login-form{margin-top:20px}.login-title{color:var(--saudi-green);font-weight:700;text-align:center;margin-bottom:35px;position:relative}.login-title:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:60px;height:3px;background:linear-gradient(90deg,var(--saudi-green) 0%,var(--saudi-gold) 100%);border-radius:2px}.login-input{margin-bottom:25px}.login-input .MuiOutlinedInput-root{border-radius:16px;background:#ffffffe6;transition:all .3s cubic-bezier(.4,0,.2,1);font-size:16px}.login-input .MuiOutlinedInput-root:hover{background:#fffffff2;transform:translateY(-2px);box-shadow:0 8px 20px #0000001a}.login-input .MuiOutlinedInput-root.Mui-focused{background:#fff;box-shadow:0 0 0 3px #245c3633;transform:translateY(-2px)}.input-icon{color:var(--saudi-green);transition:color .3s ease}.login-input .MuiOutlinedInput-root:hover .input-icon{color:var(--saudi-green-dark)}.password-toggle{color:var(--saudi-gray-dark);transition:all .3s ease}.password-toggle:hover{color:var(--saudi-green);background:#245c361a}.error-alert{border-radius:16px;background:#f443361a;border:1px solid rgba(244,67,54,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.login-button{background:linear-gradient(135deg,var(--saudi-green) 0%,var(--saudi-green-light) 100%);border-radius:16px;padding:16px 32px;font-weight:700;font-size:18px;text-transform:none;box-shadow:0 8px 20px var(--saudi-shadow);transition:all .3s cubic-bezier(.4,0,.2,1);margin-bottom:25px;position:relative;overflow:hidden}.login-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.login-button:hover:before{left:100%}.login-button:hover{background:linear-gradient(135deg,var(--saudi-green-dark) 0%,var(--saudi-green) 100%);transform:translateY(-3px);box-shadow:0 12px 28px var(--saudi-shadow)}.login-button:active{transform:translateY(-1px)}.login-button:disabled{background:var(--saudi-gray-dark);transform:none;box-shadow:none}.login-footer{text-align:center;margin-top:25px}.forgot-password{color:var(--saudi-green);cursor:pointer;margin-bottom:15px;transition:all .3s ease;font-weight:500}.forgot-password:hover{color:var(--saudi-green-dark);text-decoration:underline;transform:translateY(-1px)}.register-link{color:var(--saudi-gray-dark);font-weight:400}.register-link span{color:var(--saudi-green);cursor:pointer;font-weight:600;transition:all .3s ease;position:relative}.register-link span:after{content:"";position:absolute;bottom:-2px;left:0;width:0;height:2px;background:var(--saudi-green);transition:width .3s ease}.register-link span:hover:after{width:100%}.register-link span:hover{color:var(--saudi-green-dark)}.login-info{text-align:center;margin-top:40px;color:var(--saudi-white)}.info-text{margin-bottom:15px;font-weight:500;text-shadow:0 2px 4px rgba(0,0,0,.3);font-size:16px}.copyright-text{font-size:14px;opacity:.8;text-shadow:0 1px 2px rgba(0,0,0,.3)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.login-card{animation:fadeInUp .8s ease-out}@media (min-width: 1200px){.login-content{max-width:500px}.login-card-content{padding:60px!important}}@media (max-width: 1024px){.login-content{padding:15px}.login-card-content{padding:45px!important}.saudi-flag{width:90px;height:68px}}@media (max-width: 768px){.login-container{padding:10px}.login-content{padding:10px;max-width:100%}.login-card{border-radius:20px;margin:0 10px}.login-card-content{padding:35px 25px!important}.app-title{font-size:2rem;margin-bottom:8px}.app-subtitle{font-size:1rem;margin-bottom:0}.login-title{font-size:1.5rem;margin-bottom:30px}.faainex-logo{width:100px;height:100px;margin-bottom:20px}.logo-circle{width:80px;height:80px}.logo-inner{width:60px;height:60px}.logo-text{font-size:30px}.login-input{margin-bottom:20px}.login-button{padding:14px 28px;font-size:16px;margin-bottom:20px}.login-footer{margin-top:20px}.info-text{font-size:15px}.copyright-text{font-size:13px}}@media (max-width: 600px){.login-container,.login-content{padding:5px}.login-card{border-radius:16px;margin:0 5px}.login-card-content{padding:30px 20px!important}.app-title{font-size:1.8rem;margin-bottom:6px}.app-subtitle{font-size:.95rem}.login-title{font-size:1.4rem;margin-bottom:25px}.faainex-logo{width:90px;height:90px;margin-bottom:18px}.logo-circle{width:70px;height:70px}.logo-inner{width:50px;height:50px}.logo-text{font-size:26px}.login-input .MuiOutlinedInput-root{border-radius:12px;font-size:15px}.login-input .MuiInputLabel-root{font-size:15px}.login-button{padding:12px 24px;font-size:15px;border-radius:12px}.login-footer{margin-top:18px}.forgot-password{font-size:14px;margin-bottom:12px}.register-link{font-size:14px}.info-text{font-size:14px;margin-bottom:12px}.copyright-text{font-size:12px}}@media (max-width: 480px){.login-container{padding:0}.login-content{padding:0;margin:0}.login-card{border-radius:12px;margin:10px;box-shadow:0 15px 35px #0000001a}.login-card-content{padding:25px 18px!important}.app-title{font-size:1.6rem;margin-bottom:5px}.app-subtitle{font-size:.9rem}.login-title{font-size:1.3rem;margin-bottom:20px}.faainex-logo{width:80px;height:80px;margin-bottom:15px}.logo-circle{width:60px;height:60px}.logo-inner{width:40px;height:40px}.logo-text{font-size:22px}.login-input{margin-bottom:18px}.login-input .MuiOutlinedInput-root{border-radius:10px;font-size:14px}.login-input .MuiInputLabel-root{font-size:14px}.login-button{padding:10px 20px;font-size:14px;border-radius:10px;margin-bottom:18px}.login-footer{margin-top:15px}.forgot-password{font-size:13px;margin-bottom:10px}.register-link{font-size:13px}.info-text{font-size:13px;margin-bottom:10px}.copyright-text{font-size:11px}}@media (max-width: 360px){.login-card{margin:5px;border-radius:10px}.login-card-content{padding:20px 15px!important}.app-title{font-size:1.4rem;margin-bottom:4px}.app-subtitle{font-size:.85rem}.login-title{font-size:1.2rem;margin-bottom:18px}.faainex-logo{width:70px;height:70px;margin-bottom:12px}.logo-circle{width:50px;height:50px}.logo-inner{width:35px;height:35px}.logo-text{font-size:18px}.login-input{margin-bottom:15px}.login-input .MuiOutlinedInput-root{border-radius:8px;font-size:13px}.login-input .MuiInputLabel-root{font-size:13px}.login-button{padding:8px 16px;font-size:13px;border-radius:8px;margin-bottom:15px}.login-footer{margin-top:12px}.forgot-password{font-size:12px;margin-bottom:8px}.register-link{font-size:12px}.info-text{font-size:12px;margin-bottom:8px}.copyright-text{font-size:10px}}@media (max-width: 768px){.background-pattern{background:linear-gradient(135deg,var(--saudi-green) 0%,var(--saudi-green-light) 50%,var(--saudi-green-dark) 100%)}.geometric-pattern{background-size:40px 40px;animation:patternMove 15s linear infinite}.pattern-overlay{background-image:radial-gradient(circle at 20% 80%,rgba(255,255,255,.1) 0%,transparent 40%),radial-gradient(circle at 80% 20%,rgba(255,255,255,.08) 0%,transparent 40%)}}@media (max-width: 480px){.geometric-pattern{background-size:30px 30px;animation:patternMove 12s linear infinite}.pattern-overlay{background-image:radial-gradient(circle at 20% 80%,rgba(255,255,255,.08) 0%,transparent 35%),radial-gradient(circle at 80% 20%,rgba(255,255,255,.06) 0%,transparent 35%)}.login-card:before{height:3px}}@media (max-width: 768px) and (orientation: landscape){.login-container{min-height:100vh;padding:5px}.login-content{padding:5px}.login-card-content{padding:20px 25px!important}.logo-section{margin-bottom:20px}.saudi-flag{width:60px;height:45px;margin-bottom:10px}.app-title{font-size:1.5rem;margin-bottom:5px}.app-subtitle{font-size:.9rem}.login-title{font-size:1.3rem;margin-bottom:20px}.login-input{margin-bottom:15px}.login-button{padding:10px 20px;font-size:14px;margin-bottom:15px}.login-footer{margin-top:15px}.login-info{margin-top:20px}}.login-input .MuiInputLabel-root{color:var(--saudi-gray-dark);font-weight:600;font-size:16px}.login-input .MuiInputLabel-root.Mui-focused{color:var(--saudi-green)}.login-input .MuiOutlinedInput-notchedOutline{border-color:#00000026;border-width:2px;transition:all .3s ease}.login-input .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline{border-color:var(--saudi-green)}.login-input .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline{border-color:var(--saudi-green);border-width:3px}.saudi-flag{animation:flagWave 3s ease-in-out infinite}@keyframes flagWave{0%,to{transform:rotate(0)}50%{transform:rotate(2deg)}}.app-title{animation:titleGlow 2s ease-in-out infinite alternate}@keyframes titleGlow{0%{text-shadow:0 2px 4px rgba(0,0,0,.1)}to{text-shadow:0 2px 8px rgba(36,92,54,.3)}}:root{--saudi-green: #245C36;--saudi-green-light: #2D7A47;--saudi-green-dark: #1A4A2A;--saudi-gold: #FFD700;--saudi-white: #FFFFFF;--saudi-black: #000000;--saudi-gray: #F5F5F5;--saudi-gray-dark: #666666;--saudi-shadow: rgba(36, 92, 54, .3);--logout-red: #d32f2f;--logout-red-light: #f44336;--logout-red-dark: #b71c1c}.logout-container{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;font-family:Cairo,sans-serif;direction:rtl;overflow:hidden;background:linear-gradient(135deg,var(--saudi-green) 0%,var(--saudi-green-light) 50%,var(--saudi-green-dark) 100%)}.logout-background{position:absolute;inset:0;z-index:-2}.background-pattern{position:absolute;inset:0;background-image:radial-gradient(circle at 20% 80%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(255,255,255,.08) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(255,255,255,.05) 0%,transparent 50%);animation:backgroundPulse 8s ease-in-out infinite}@keyframes backgroundPulse{0%,to{opacity:.8}50%{opacity:1}}.floating-elements{position:absolute;inset:0;overflow:hidden}.floating-circle{position:absolute;border-radius:50%;background:#ffffff1a;animation:float 6s ease-in-out infinite}.circle-1{width:80px;height:80px;top:20%;left:10%;animation-delay:0s}.circle-2{width:120px;height:120px;top:60%;right:15%;animation-delay:2s}.circle-3{width:60px;height:60px;top:40%;left:80%;animation-delay:4s}@keyframes float{0%,to{transform:translateY(0) rotate(0);opacity:.7}50%{transform:translateY(-20px) rotate(180deg);opacity:1}}.logout-content{position:relative;z-index:1;padding:20px;animation:slideInUp .8s ease-out}@keyframes slideInUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}.logout-card{background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;border:1px solid rgba(255,255,255,.3);box-shadow:0 25px 50px #00000026,0 0 0 1px #ffffff1a,inset 0 1px #fff3;overflow:hidden;position:relative;transition:all .3s ease}.logout-card:hover{transform:translateY(-5px);box-shadow:0 35px 70px #0003,0 0 0 1px #fff3,inset 0 1px #ffffff4d}.logout-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--logout-red) 0%,var(--saudi-gold) 50%,var(--logout-red) 100%)}.logout-card-content{padding:50px!important;text-align:center}.logout-icon-section{margin-bottom:30px}.logout-icon-wrapper{position:relative;display:inline-block;width:100px;height:100px;background:linear-gradient(135deg,var(--logout-red) 0%,var(--logout-red-light) 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px #d32f2f4d,0 0 0 4px #ffffff1a;transition:all .3s ease;animation:iconPulse 2s ease-in-out infinite}.logout-icon-wrapper:hover{transform:scale(1.1);box-shadow:0 15px 40px #d32f2f66,0 0 0 6px #fff3}@keyframes iconPulse{0%,to{box-shadow:0 10px 30px #d32f2f4d,0 0 0 4px #ffffff1a}50%{box-shadow:0 15px 40px #d32f2f66,0 0 0 6px #fff3}}.logout-icon{font-size:48px!important;color:#fff;animation:iconRotate 3s linear infinite}@keyframes iconRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.logout-title{color:var(--logout-red);font-weight:800;margin-bottom:15px;text-shadow:0 2px 4px rgba(0,0,0,.1);letter-spacing:1px;position:relative}.logout-title:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:80px;height:3px;background:linear-gradient(90deg,var(--logout-red) 0%,var(--saudi-gold) 100%);border-radius:2px}.logout-subtitle{color:var(--saudi-gray-dark);font-weight:500;margin-bottom:30px;opacity:.9;line-height:1.6}.logout-info{margin-bottom:40px}.logout-info-text{color:var(--saudi-gray-dark);background:#245c360d;padding:15px 20px;border-radius:12px;border-left:4px solid var(--saudi-green);font-weight:500}.logout-actions{display:flex;gap:15px;justify-content:center;flex-wrap:wrap;margin-bottom:30px}.cancel-button{background:#ffffffe6;color:var(--saudi-green);border:2px solid var(--saudi-green);font-weight:600;text-transform:none;transition:all .3s ease;box-shadow:0 4px 12px #245c3633}.cancel-button:hover{background:var(--saudi-green);color:#fff;transform:translateY(-2px);box-shadow:0 6px 16px #245c364d}.logout-button{background:linear-gradient(135deg,var(--logout-red) 0%,var(--logout-red-light) 100%);color:#fff;font-weight:700;text-transform:none;transition:all .3s ease;box-shadow:0 6px 16px #d32f2f4d;position:relative;overflow:hidden}.logout-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.logout-button:hover:before{left:100%}.logout-button:hover{background:linear-gradient(135deg,var(--logout-red-dark) 0%,var(--logout-red) 100%);transform:translateY(-3px);box-shadow:0 8px 20px #d32f2f66}.logout-button:active{transform:translateY(-1px)}.logout-button:disabled{background:var(--saudi-gray-dark);transform:none;box-shadow:none}.logout-progress{text-align:center;margin-top:30px;padding:20px;background:#245c360d;border-radius:12px;border:1px solid rgba(36,92,54,.1)}.progress-spinner{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.progress-text{color:var(--saudi-green);font-weight:600;margin-top:15px}.logout-footer{text-align:center;margin-top:40px;color:var(--saudi-white)}.footer-text{margin-bottom:10px;font-weight:500;text-shadow:0 2px 4px rgba(0,0,0,.3)}.footer-copyright{opacity:.8;text-shadow:0 1px 2px rgba(0,0,0,.3)}.confirm-dialog .MuiDialog-paper{background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.3);box-shadow:0 25px 50px #00000026}.dialog-title{background:linear-gradient(135deg,var(--logout-red) 0%,var(--logout-red-light) 100%);color:#fff;padding:20px 24px;border-radius:12px 12px 0 0}.dialog-icon{color:#fff;font-size:28px}.dialog-content{padding:24px;text-align:center}.dialog-actions{padding:16px 24px 24px;gap:12px;justify-content:center}.confirm-logout-button{background:linear-gradient(135deg,var(--logout-red) 0%,var(--logout-red-light) 100%);color:#fff;font-weight:600;text-transform:none;transition:all .3s ease;box-shadow:0 4px 12px #d32f2f4d}.confirm-logout-button:hover{background:linear-gradient(135deg,var(--logout-red-dark) 0%,var(--logout-red) 100%);transform:translateY(-2px);box-shadow:0 6px 16px #d32f2f66}@media (max-width: 768px){.logout-card-content{padding:30px 25px!important}.logout-icon-wrapper{width:80px;height:80px}.logout-icon{font-size:40px!important}.logout-actions{flex-direction:column;gap:12px}.cancel-button,.logout-button{width:100%}}@media (max-width: 480px){.logout-card-content{padding:25px 20px!important}.logout-icon-wrapper{width:70px;height:70px}.logout-icon{font-size:36px!important}.logout-title{font-size:1.6rem}.logout-subtitle{font-size:.95rem}.logout-info-text{padding:12px 16px;font-size:.9rem}}.logout-card{animation:cardFloat 6s ease-in-out infinite}@keyframes cardFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.logout-title{animation:titleGlow 3s ease-in-out infinite alternate}@keyframes titleGlow{0%{text-shadow:0 2px 4px rgba(0,0,0,.1)}to{text-shadow:0 2px 8px rgba(211,47,47,.3)}}.cancel-button,.logout-button{position:relative;overflow:hidden}.cancel-button:after,.logout-button:after{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:#ffffff4d;border-radius:50%;transform:translate(-50%,-50%);transition:width .6s,height .6s}.cancel-button:active:after,.logout-button:active:after{width:300px;height:300px}:root{--dynamic-font-family: "Almarai", sans-serif}html,body,#root,h6,p,*{font-family:var(--dynamic-font-family);margin-top:0}#root{background-color:#fffdfb;box-sizing:border-box;margin:0}.app-container{display:flex;gap:1vw;height:100%;margin-bottom:40px}.sidebar{width:8vw;height:270px;overflow-y:auto;background:#fff;padding:.7vw;border-radius:8px;box-shadow:0 2px 8px #0000001a}.sidebar h2{margin-top:0;font-size:18px}.create-invoice{color:#28b1ae;font-size:28px}.invoice-config{display:flex;padding-left:10px;gap:16px;align-items:center;position:relative;margin-bottom:45px}.invoice-config label{font-size:20px;font-weight:700}.invoice-config label:before{content:" ";left:0;top:50%;transform:translateY(-50%);background-color:#28b1ae;width:4px;height:100%;position:absolute;border-radius:1px}.invoice-config select{padding:6px 8px;font-size:16px;border-radius:4px;border:1px solid #313131}.draggable-item{padding:16px 12px;margin-bottom:10px;cursor:grab;border-radius:6px;border:1px solid #e3e3e3}.sub .draggable-item{background-color:#f5f5f5;width:60%;margin:8px auto}.draggable-item:hover{background:#f1f1f1}.draggable-element{display:flex;align-items:center;justify-content:center;width:100%;gap:8px;flex-direction:column}.canvas{background:#fff;border:2px dashed #ccc;padding:0!important;position:relative;border-radius:8px;box-sizing:border-box}.rnd-box{border:1px solid transparent;background-color:transparent;position:absolute;box-shadow:none;border-radius:4px;padding:0!important;box-sizing:border-box;min-height:fit-content!important}.rnd-box.selected{border:1px solid #b4b4b4}.rnd-box:has(>.h-line){height:fit-content!important}.rnd-box:has(>.v-line){width:fit-content!important}.editable{width:100%;height:100%;outline:none}.price-field{font-size:20px;color:green;font-family:monospace}.delete-button{position:absolute;top:-10px;right:-10px;background-color:red;color:#fff;border:none;width:14px;height:14px;font-size:12px;border-radius:50%;cursor:pointer;z-index:1000000;display:flex;align-items:center;justify-content:center}.text-center{text-align:center}.custom-button{display:flex;height:52px;width:227px;justify-content:center;align-items:center;border-radius:8px;font-size:18px;font-weight:700;background-color:transparent;cursor:pointer}.cancel-btn{border:1.5px solid #fa7171;color:#fa7171}.preview-btn{border:1.5px solid #28b1ae;color:#28b1ae}.save-btn{border:1.5px solid #28b1ae;background-color:#28b1ae;color:#fff}.action-buttons{display:flex;gap:16px;align-items:center;justify-content:center}