.l-msg{height:2vh;width:90vw;text-wrap:wrap;color:red;font-weight:700;text-shadow:1px 1px 1px purple;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:x-large;text-align:center}.login-page{height:100vh;width:100vw;display:flex;flex-direction:column;align-items:center;justify-content:center;background:url(/assets/rgbg-DxNg4b_u.jpeg);background-position:center;background-size:cover;overflow:hidden}.login-inputs{width:40%;height:40%;background-color:#1c0221d0;padding:2%;display:flex;flex-direction:column;align-items:center;border-radius:15px;gap:5px}.login-heading{font-size:5rem;color:#1c0221;text-shadow:1px 1px 1px white}.login-otp{width:100%;display:flex;align-items:center;justify-content:space-evenly;height:30%}.l-button{all:unset;width:35%;height:45%;background-color:#fff;border-radius:7px;display:flex;align-items:center;justify-content:center;position:relative;font-weight:700;font-family:monospace;font-size:125%;padding:1%}.l-button:hover{cursor:pointer;background-color:#5a045a;color:#f0fff0}.login-type{display:flex;align-items:center;justify-content:center;text-align:center;background-color:#e9eb87}.login-pswd{display:flex;align-items:center;justify-content:space-evenly;width:100%;gap:5%}.otp-btn{display:flex;align-items:center;justify-content:center;flex:10;font-family:monospace;font-size:150%;padding:2%;border-radius:7px;margin-top:2%;font-weight:700;margin-left:5%;height:80%}.otp-btn:hover,.login-btn-pswd:hover{cursor:pointer;background-color:#5a045a;color:#f0fff0}.login-btn-pswd{display:flex;flex:9;align-items:center;justify-content:center;font-family:monospace;font-size:150%;padding:2%;border-radius:7px;margin-top:2%;font-weight:700;background-color:#fff;margin-right:5%;height:80%}.login-btn-otp{display:flex;align-items:center;justify-content:center;font-family:monospace;font-size:150%;padding:2%;border-radius:7px;margin-top:2%;font-weight:700;background-color:#fff;width:40%}.login-btn-otp:hover{cursor:pointer;background-color:#5a045a;color:#f0fff0}@media(max-width:768px){.login-page{padding:20px}.login-heading{font-size:2.2rem;margin-bottom:15px;text-align:center}.login-inputs{width:100%;max-width:400px;height:auto;padding:20px;gap:15px}.input-box{flex-direction:column;align-items:flex-start;gap:6px;height:auto;font-size:.9rem}.input-box>label{width:100%;margin:0;font-size:.85rem;opacity:.8}.input-box>input{width:100%;height:42px;margin:0;font-size:.95rem;border:none;outline:none}.l-msg{width:100%;font-size:.9rem;margin-bottom:10px}.login-type{width:100%;height:40px;font-size:.9rem;border-radius:6px}.login-otp{flex-direction:column;width:100%;gap:10px}.otp-btn{width:100%;height:42px;font-size:.95rem;margin:0}.login-btn-otp{width:100%;height:42px;font-size:.95rem}.login-pswd{flex-direction:column;width:100%;gap:10px}.login-btn-pswd{width:100%;height:42px;font-size:.95rem;margin:0}.l-button{width:100%;height:42px;font-size:.95rem}}.register-page{height:100vh;width:100vw;display:flex;flex-direction:column;align-items:center;justify-content:center;background:url(/assets/rgbg-DxNg4b_u.jpeg);background-position:center;background-size:cover;overflow:hidden}.r-msg{height:2vh;width:90vw;text-wrap:wrap;color:red;font-weight:700;text-shadow:1px 1px 1px white;font-family:monospace;font-size:x-large;text-align:center}.register-inputs{width:40%;height:40%;background-color:#1c0221d0;padding:2%;display:flex;flex-direction:column;align-items:center;border-radius:15px;gap:5px}.input-box{width:100%;height:30%;display:flex;align-items:center;border-radius:10px;color:#fff;font-weight:700;font-size:1.5rem;text-transform:uppercase}.input-box>label{width:50%;margin-left:5%;display:flex;align-items:center}.input-box>input{height:60%;width:50%;border-radius:10px;padding-left:2%;margin-right:5%;font-size:large}.r-buttons{width:100%;display:flex;height:15%;justify-content:space-evenly;margin-top:2%}.r-buttons>*{all:unset;width:35%;background-color:#fff;border-radius:10px;display:flex;align-items:center;justify-content:center;position:relative;font-weight:700;font-family:monospace;font-size:125%;cursor:pointer}.r-buttons>*:nth-child(1){background-color:#e9eb87}.r-buttons>*:hover{background-color:#5a045a;color:#f0fff0}.register-heading{font-size:5rem;color:#1c0221;text-shadow:1px 1px 1px white}@media(max-width:768px){.register-heading{font-size:2.5rem;text-align:center}.register-inputs{width:90%;height:auto;padding:20px 10px}.input-box{flex-direction:column;height:auto;gap:5px;font-size:1rem}.input-box>label{width:100%;margin-left:0;justify-content:flex-start}.input-box>input{width:100%;height:40px;margin:0;font-size:1rem}.r-msg{height:auto;font-size:1rem;width:90%}.r-buttons{flex-direction:column;height:auto;gap:10px}.r-buttons>*{width:100%;height:45px;font-size:1rem}}@media(max-width:480px){.register-heading{font-size:2rem}.register-inputs{width:95%}}*{padding:0;margin:0;box-sizing:border-box}.home-page{width:100%;height:100vh;display:flex;flex-direction:column}.home-page>nav{display:flex;flex:1;width:100%;background-color:#daefb3;align-items:center;justify-content:space-between;position:relative}.profile-icon{width:max(3vh,3vw);height:max(3vh,3vw);max-height:100%;border-radius:50%;color:#030101}.profile-icon:hover{background-color:#fff;color:#b7b5b680}.logo{margin-left:2%;height:50px;width:50px;background:url(/logo.png);background-size:contain;background-position:center}.logo:hover{opacity:.9;cursor:pointer}.home-page>.main{display:flex;flex-direction:column;width:100%;flex:9;background-color:#eef4d4;background:url(https://static.wikitide.net/rainworldwiki/9/9f/Survivor_intro_scene_4_%28walking%29.png);background-position:center;background-size:cover}.row1,.row2{display:flex;align-items:center;justify-content:space-evenly;width:100%;margin-top:5%;flex:5}.donate,.request{width:30%;height:80%;background-color:#fff;border-radius:25px;display:flex;gap:10%;flex-direction:column;align-items:center;background-color:#dc143c9f}.donate>div,.request>div{width:100%;flex:8;border-radius:25px;text-align:center;font-weight:700;font-size:2rem;color:#fff;display:flex;align-items:center;justify-content:center;margin-top:10px;margin-left:2px;margin-right:2px;background-color:#dc143cb2;border:1px solid white}.donate>button,.request>button{all:unset;width:80%;flex:2;background-color:#fff;border-radius:25px;margin-bottom:10%;text-align:center;font-weight:700;padding:5px;transition:transform .5s}.donate>button:hover,.request>button:hover{color:#000;background-color:#daefb3;cursor:pointer;transform:scale(1.05)}.donors-in-area,.requests-in-area{width:30%;height:80%;border-radius:25px;display:flex;gap:10%;flex-direction:column;align-items:center;background-color:#daefb3be}.donors-in-area>div,.requests-in-area>div{width:100%;flex:8;border-radius:25px;text-align:center;font-weight:700;font-size:2rem;color:#1c2826;display:flex;align-items:center;justify-content:center;border-bottom:1px solid black}.donors-in-area>button,.requests-in-area>button{all:unset;width:50%;flex:2;margin-bottom:10%;text-align:center;color:#1c2826;font-size:2rem}.requests-in-area{position:relative}.requests-in-area>.view-btn{all:unset;position:absolute;width:30%;bottom:10%;right:0;transform:translate(-10%);background-color:#f96767;color:#fff;font-weight:700;border-radius:20px;padding:8px 16px;font-size:1.1rem;box-shadow:0 2px 5px #0003;transition:transform .3s,background-color .3s;text-align:center}.requests-in-area>.view-btn:hover{background-color:#daefb3;color:#f96767;transform:translate(-10%) scale(1.05);cursor:pointer}@media(max-width:768px){.row1,.row2{flex-direction:column;align-items:center;margin-top:8%;gap:16px}.donate,.request,.donors-in-area,.requests-in-area{width:85%;min-height:160px}.requests-in-area>.view-btn{position:static;margin-bottom:12px;width:60%}}@media(max-width:480px){.home-page>nav{padding:8px 12px}.logo{height:38px;width:38px}.donate,.request,.donors-in-area,.requests-in-area{width:95%;border-radius:18px}.donate>div,.request>div{font-size:1.1rem}.donors-in-area>div,.requests-in-area>div:not(.view-btn){font-size:1rem}.requests-in-area>.view-btn{position:static;width:70%;font-size:.9rem}}.profile-popup-card{position:absolute;top:70px;right:15px;width:340px;background-color:#fff;border-radius:15px;box-shadow:0 10px 25px #0003;padding:20px;z-index:100;font-family:Segoe UI,sans-serif;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.popup-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.popup-header h2{font-size:1.5rem;font-weight:700;margin:0;color:#1c2826}.close-btn{background:none;border:none;font-size:1.5rem;font-weight:700;cursor:pointer;color:#555;transition:color .2s}.close-btn:hover{color:red}.popup-content{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.info-row{display:flex;align-items:center;gap:10px;font-size:1rem;color:#333;padding:8px 0}.icon{color:#da4167;font-size:1.2rem}.popup-actions{display:flex;flex-direction:column;gap:10px}.request-btn{background-color:#daefb3;color:#1c2826;width:100%;border:none;border-radius:12px;padding:10px 0;font-weight:700;font-size:1rem;cursor:pointer;transition:all .3s}.request-btn:hover{background-color:#c5e294;transform:scale(1.03)}.update-btn{background-color:#ffc107;color:#1c2826;width:100%;border:none;border-radius:12px;padding:10px 0;font-weight:700;font-size:1rem;cursor:pointer;transition:all .3s}.update-btn:hover{background-color:#e6b800;transform:scale(1.03)}.your-requests-btn{background-color:#9fd3c7;color:#1c2826;width:100%;border:none;border-radius:12px;padding:10px 0;font-weight:700;font-size:1rem;cursor:pointer;transition:all .3s}.your-requests-btn:hover{background-color:#82c3b0;transform:scale(1.03)}.logout-btn{background-color:#f56565;color:#fff;display:flex;justify-content:center;align-items:center;gap:8px;width:100%;border:none;border-radius:12px;padding:10px 0;font-weight:700;font-size:1rem;cursor:pointer;transition:all .3s}.logout-btn:hover{background-color:#e53e3e;transform:scale(1.03)}.icon-small{font-size:.9rem}@media(max-width:768px){.profile-popup-card{width:290px;top:60px;right:10px;padding:16px}}@media(max-width:480px){.profile-popup-card{width:calc(100vw - 24px);top:56px;right:12px;left:12px;padding:14px;border-radius:12px}.popup-header h2{font-size:1.2rem}.info-row{font-size:.9rem}.request-btn,.update-btn,.your-requests-btn,.logout-btn{font-size:.95rem;padding:9px 0}}*{box-sizing:border-box;margin:0;padding:0}.landing-page{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:start;overflow:hidden}.landing-hero{height:80vh;width:100%;background:url(/assets/home-DMwikcd1.jpg);background-position:center;background-repeat:no-repeat;background-size:cover;display:flex;flex-direction:column}.landing-hero>nav{height:10%;width:100%;background-color:#000000a6;display:flex;align-items:center;justify-content:end;gap:2%;font-size:x-large}nav>*{margin-right:2%;background-color:beige;border-radius:5px;height:60%;width:min(100px,10vw);color:#000;display:flex;align-items:center;justify-content:center}nav>div:hover{background-color:#000;color:beige;cursor:pointer}.landing-page-body{height:60%;flex-grow:1;display:flex;align-items:center;justify-content:center}.hero{width:40%;height:40%;transform:translate(20%)}.hero>div{width:100%;height:40%;color:#fff;text-shadow:2px 2px 2px purple;font-size:min(10vh,10vw);text-wrap:wrap;font-weight:700;font-family:monospace,Arial,Helvetica,sans-serif}.mission{width:100%;background-color:#000c;color:#fff;text-align:center;padding:4vh 10vw}.mission h2{font-size:2em;margin-bottom:1vh;color:#fcc}.mission p{font-size:1.2em;max-width:800px;margin:0 auto}.how-it-works{background-color:#ffffffe6;width:100%;text-align:center;padding:5vh 0}.how-it-works h2{font-size:2em;margin-bottom:2vh;color:#b30000}.steps{display:flex;flex-direction:column;gap:1.5vh;font-size:1.2em;color:#333}.footer{background-color:#000000e6;color:#fff;width:100%;text-align:center;padding:2vh 0;font-size:1em}@media(max-width:768px){.landing-hero{height:auto;background-position:top}nav{justify-content:center;gap:15%;font-size:large;height:60px}nav>*{width:20%;height:60%;margin-right:0}.landing-page-body{padding:10vh 0;flex-direction:column;justify-content:center}.hero{width:90%;height:auto;transform:none;text-align:center}.hero>div{font-size:clamp(2rem,8vw,4rem);text-shadow:1px 1px 2px #000}.mission,.how-it-works,.footer{padding:5vh 5vw}.steps{font-size:1em;gap:1vh}.mission p{font-size:1em}.how-it-works h2,.mission h2{font-size:1.6em}}@media(max-width:480px){nav{height:auto;padding:10px 0;width:100%}nav>*{width:20%;height:40px;font-size:1em;margin-right:2%}.hero>div{font-size:clamp(1.8rem,9vw,3rem)}.mission p{font-size:.9em}.steps div{padding:0 1rem}}.donate-page{min-height:100vh;width:100%;background:linear-gradient(to bottom right,#eef4d4,#daefb3);display:flex;flex-direction:column;align-items:center;padding:5vh 2vw}.donate-page-heading{font-size:2rem;font-weight:700;color:#fff;background-color:#dc143ccc;padding:15px 25px;border-radius:25px;text-align:center;margin-bottom:40px;box-shadow:0 4px 10px #00000040}.donate-form-item{display:flex;flex-direction:column;gap:8px}.donate-form-item label{font-weight:700;color:#1c2826}.donate-form-item select,.donate-form-item input{padding:10px;border:2px solid #DAEFB3;border-radius:10px;background-color:#f9fff5;font-size:1rem;outline:none;transition:border-color .3s,box-shadow .3s}.donate-form-item select:focus,.donate-form-item input:focus{border-color:#dc143c99;box-shadow:0 0 6px #dc143c66}.donate-form-submit-btn{all:unset;cursor:pointer;text-align:center;background-color:#dc143ccc;color:#fff;padding:12px;border-radius:20px;font-weight:700;font-size:1.1rem;transition:all .3s ease}.donate-form-submit-btn:hover{background-color:#daefb3;color:#1c2826;transform:scale(1.05)}@media(max-width:600px){.donate-page-heading{font-size:1.5rem;padding:10px 15px}form{width:95%;padding:20px}.donate-form-item select,.donate-form-item input{font-size:.95rem}.donate-form-submit-btn{font-size:1rem;padding:10px}}.request-page{min-height:100vh;width:100%;background:linear-gradient(to bottom right,#eef4d4,#daefb3);display:flex;flex-direction:column;align-items:center;padding:5vh 2vw}.request-page-heading{font-size:2rem;font-weight:700;color:#fff;background-color:#dc143ccc;padding:15px 25px;border-radius:25px;text-align:center;margin-bottom:40px;box-shadow:0 4px 10px #00000040}.request-page form{width:90%;max-width:500px;background-color:#ffffffe6;border-radius:25px;padding:30px;box-shadow:0 4px 12px #0003;display:flex;flex-direction:column;gap:20px}.request-form-item select{padding:10px;border:2px solid #DAEFB3;border-radius:10px;background-color:#f9fff5;font-size:1rem;outline:none;transition:border-color .3s,box-shadow .3s}.request-form-item select:focus{border-color:#dc143c99;box-shadow:0 0 6px #dc143c66}.results-section{margin-top:40px;width:90%;max-width:600px}.error-message{color:#dc143c;text-align:center;font-weight:700}.donor-results{background-color:#ffffffe6;border-radius:15px;padding:20px;box-shadow:0 4px 10px #00000026}.donor-results h3{text-align:center;color:#1c2826;margin-bottom:15px}.donor-results ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:15px}.donor-results li{background-color:#f9fff5;padding:15px;border-radius:10px;border:1.5px solid #DAEFB3;color:#1c2826}@media(max-width:600px){.request-page-heading{font-size:1.5rem;padding:10px 15px}.request-page form{width:95%;padding:20px}.request-form-item select{font-size:.95rem}.request-form-submit-btn{font-size:1rem;padding:10px}.donor-results li{font-size:.95rem}}.donor-name{font-weight:700;color:#1c2826}.donor-blood{color:#dc143ccc;font-weight:600;margin-top:2px}.donor-location,.donor-contact{font-size:.95rem;color:#1c2826}.request-form-page{min-height:100vh;width:100%;background:linear-gradient(to bottom right,#eef4d4,#daefb3);display:flex;flex-direction:column;align-items:center;padding:5vh 2vw}.request-form-heading{font-size:2rem;font-weight:700;color:#fff;background-color:#dc143ccc;padding:15px 25px;border-radius:25px;text-align:center;margin-bottom:40px;box-shadow:0 4px 10px #00000040}form{width:90%;max-width:500px;background-color:#ffffffe6;border-radius:25px;padding:30px;box-shadow:0 4px 12px #0003;display:flex;flex-direction:column;gap:20px}.request-form-item{display:flex;flex-direction:column;gap:8px}.request-form-item label{font-weight:700;color:#1c2826}.request-form-item select,.request-form-item input{padding:10px;border:2px solid #DAEFB3;border-radius:10px;background-color:#f9fff5;font-size:1rem;outline:none;transition:border-color .3s,box-shadow .3s}.request-form-item select:focus,.request-form-item input:focus{border-color:#dc143c99;box-shadow:0 0 6px #dc143c66}.request-form-submit-btn{all:unset;cursor:pointer;text-align:center;background-color:#dc143ccc;color:#fff;padding:12px;border-radius:20px;font-weight:700;font-size:1.1rem;transition:all .3s ease}.request-form-submit-btn:hover{background-color:#daefb3;color:#1c2826;transform:scale(1.05)}.success-message{color:green;font-weight:700;text-align:center}.error-message{color:#dc143c;font-weight:700;text-align:center}@media(max-width:768px){.request-form-heading{font-size:1.6rem;padding:12px 20px;margin-bottom:28px}form{width:95%;padding:24px}}@media(max-width:480px){.request-form-page{padding:4vh 4vw}.request-form-heading{font-size:1.3rem;padding:10px 16px;margin-bottom:20px;border-radius:18px}form{width:100%;padding:18px;border-radius:18px;gap:16px}.request-form-item select,.request-form-item input{font-size:.95rem;padding:9px}.request-form-submit-btn{font-size:1rem;padding:11px}}.update-page{min-height:100vh;display:flex;flex-direction:column;align-items:center;background:linear-gradient(to bottom right,#eef4d4,#daefb3);padding:5vh 2vw;font-family:Segoe UI,sans-serif}.update-page h2{font-size:2rem;font-weight:700;margin-bottom:30px;color:#1c2826;text-shadow:0 2px 4px rgba(0,0,0,.1)}.update-form{width:100%;max-width:500px;background-color:#fffffff2;border-radius:25px;padding:30px;box-shadow:0 6px 15px #0003;display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-weight:700;color:#1c2826}.form-group input,.form-group select{padding:10px;border:2px solid #DAEFB3;border-radius:12px;font-size:1rem;outline:none;transition:border-color .3s,box-shadow .3s,transform .2s;background-color:#f9fff5}.form-group input:disabled{background-color:#f0f0f0;color:#555}.form-group input:focus,.form-group select:focus{border-color:#dc143cb3;box-shadow:0 0 8px #dc143c4d;transform:scale(1.02)}.update-form button{all:unset;cursor:pointer;text-align:center;background-color:#da4167;color:#fff;padding:12px 0;border-radius:20px;font-weight:700;font-size:1.1rem;transition:all .3s ease}.update-form button:hover{background-color:#ff6b81;transform:scale(1.05)}.form-message{margin-top:10px;text-align:center;font-weight:700;color:#da4167}@media(max-width:600px){.update-page h2{font-size:1.5rem}.update-form{width:95%;padding:20px}.form-group input,.form-group select{font-size:.95rem}.update-form button{font-size:1rem;padding:10px 0}}.my-requests-page{min-height:100vh;width:100%;padding:5vh 2vw;display:flex;flex-direction:column;align-items:center;background:linear-gradient(to bottom right,#eef4d4,#daefb3);font-family:Segoe UI,sans-serif}.my-requests-page h2{font-size:2rem;font-weight:700;color:#1c2826;margin-bottom:30px}.loading-message,.error-message,.no-requests{font-weight:700;color:#da4167;margin-top:20px}.request-card{background:linear-gradient(135deg,#daefb3,#c5e294);border-radius:20px;padding:20px;box-shadow:0 8px 18px #0003;transition:transform .2s ease;display:flex;flex-direction:column;gap:12px}.request-row{display:flex;justify-content:space-between;font-size:1rem;color:#1c2826;font-weight:500}.status.pending{background-color:#f56565}.status.fulfilled{background-color:#38a169}.status.cancelled{background-color:#ed8936}@media(max-width:600px){.my-requests-page h2{font-size:1.5rem}.request-card{padding:15px}.request-row{font-size:.95rem}}.area-requests-page{min-height:100vh;width:100%;padding:5vh 2vw;display:flex;flex-direction:column;align-items:center;background:linear-gradient(to bottom right,#fff0f3,#ffe5e9);font-family:Segoe UI,sans-serif}.area-requests-page h2{font-size:2rem;font-weight:700;color:#3b0a0a;margin-bottom:30px}.loading-message,.error-message,.no-requests{font-weight:700;color:#dc143c;margin-top:20px}.requests-list{width:100%;max-width:500px;display:flex;flex-direction:column;gap:20px}.request-card{background:linear-gradient(135deg,#ffe5e9,#ffc6cf);border-radius:20px;padding:20px;box-shadow:0 8px 18px #8b000033;transition:transform .2s ease;display:flex;flex-direction:column;gap:12px}.request-card:hover{transform:scale(1.03)}.request-row{display:flex;justify-content:space-between;font-size:1rem;color:#3b0a0a;font-weight:500}.label{font-weight:700}.status{font-weight:700;text-transform:capitalize;padding:2px 8px;border-radius:12px;color:#fff}.status.pending{background-color:#dc143c}.status.fulfilled{background-color:#b51a3a}.status.cancelled{background-color:#ff6b6b}@media(max-width:600px){.area-requests-page h2{font-size:1.5rem}.request-card{padding:15px}.request-row{font-size:.95rem}}
