:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}body{background-color:#05051e;color:#fff;margin:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.page-enter{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;animation:fadeIn 1s ease-in-out forwards}.intro{display:flex;align-items:center;justify-content:center;gap:20px}.intro img{width:50px;height:50px;display:inline-block}.intro h1{font-size:2rem;margin:0;color:#fff;opacity:0;animation:fadeIn 1s ease-in-out forwards;white-space:nowrap}.fade-in{animation:fadeIn 1s ease-in-out forwards}body{font-family:Poppins,sans-serif;background-color:#0f0a1c;color:#f0e6ff;scroll-behavior:smooth}a{text-decoration:none;color:inherit}ul{list-style:none}.navbar{background-color:#1b1030;padding:20px 40px;position:sticky;top:0;z-index:1000;box-shadow:0 4px 15px #0000004d}.navbar-container{display:flex;justify-content:space-between;align-items:center}.navbar-logo{font-size:2rem;font-weight:700;color:#a36bff}.navbar-menu{display:flex;gap:30px}.navbar-item .navbar-link{color:#c9aaff;font-weight:500;transition:color .3s ease}.navbar-link:hover{color:#fff}.button-group{display:flex;gap:10px}.signup-button,.login-button{background-color:#340f91;color:#fff;border:none;padding:8px 16px;border-radius:8px;cursor:pointer;transition:background .3s ease}.signup-button:hover,.login-button:hover{background-color:#5219cc}.mobile-menu-toggle{display:none;background:none;border:none;font-size:24px;color:#fff}.pengantar{background:linear-gradient(135deg,#0e0619,#331b57);text-align:center;padding:80px 20px}.pengantar h1{font-size:2.8rem;margin-bottom:20px;color:#d3baff}.pengantar p{font-size:1.2rem;color:#e4d8ff}.intro{display:flex;flex-wrap:wrap;align-items:center;padding:60px 20px}.intro-text{flex:1;min-width:280px;padding:20px}.intro-text h1{font-size:2rem;color:#d9b3ff}.intro-text h2{font-size:1.2rem;color:#e7dbff;margin-top:10px}.intro-image{flex:1;min-width:280px;padding:20px}.intro-image img{width:100%;height:auto;border-radius:15px;object-fit:contain;display:block}.content{border-top:5px solid #a36bff;padding:60px 20px;text-align:center}.content h1{font-size:2.5rem;color:#e0c3fc;margin-bottom:40px}.grid-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;padding-top:20px}.grid-container img{width:100%;height:250px;object-fit:cover;border-radius:15px;transition:transform .3s ease;box-shadow:0 8px 25px #00000026}.grid-container img:hover{transform:scale(1.03)}.promotions{color:#fff;padding:60px 20px;text-align:center;border-top:5px solid #a36bff;border-bottom:5px solid #a36bff}.promotions h1{font-size:2.5rem;margin-bottom:40px;color:#e0c3fc;text-shadow:1px 1px 5px rgba(0,0,0,.4)}.promotion-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;max-width:1000px;margin:0 auto}.promotion-card{background-color:#ffffff0d;border:2px solid #a36bff;border-radius:15px;padding:25px;transition:transform .3s ease,box-shadow .3s ease;box-shadow:0 8px 25px #00000026}.promotion-card:hover{transform:translateY(-8px);box-shadow:0 12px 30px #a36bff4d}.promotion-card h2{color:#d9b3ff;font-size:1.5rem;margin-bottom:10px}.promotion-card p{color:#f3e9ff;font-size:1rem}.events{color:#fff;padding:60px 20px;text-align:center;border-bottom:5px solid #a36bff}.events h1{font-size:2.5rem;margin-bottom:40px;color:#e0c3fc;text-shadow:1px 1px 5px rgba(0,0,0,.4)}.event-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;max-width:1000px;margin:0 auto}.event-card{background-color:#ffffff0d;border:2px solid #a36bff;border-radius:15px;padding:20px;text-align:left;box-shadow:0 8px 25px #0003;transition:transform .3s ease,box-shadow .3s ease}.event-card:hover{transform:translateY(-8px);box-shadow:0 12px 30px #a36bff4d}.event-image{width:100%;height:180px;object-fit:cover;border-radius:10px;margin-bottom:15px}.event-card h2{color:#d9b3ff;font-size:1.5rem;margin-bottom:10px}.event-card p{color:#f3e9ff;font-size:1rem;margin:5px 0}.testimonials{padding:60px 20px;color:#f3e9ff;text-align:center}.testimonials h1{font-size:2.5rem;margin-bottom:30px;color:#e0c3fc}.tag-list{display:flex;flex-direction:column;gap:20px;overflow:hidden}.loop-slider{--direction: normal;--duration: 20s;overflow:hidden;position:relative}.loop-slider .inner{display:flex;gap:20px;width:max-content;animation:scroll var(--duration) linear infinite;animation-direction:var(--direction)}.tag{background-color:#a36bff;color:#fff;padding:10px 20px;border-radius:50px;font-weight:500;white-space:nowrap;box-shadow:0 4px 15px #0000004d;transition:background .3s}.tag:hover{background-color:#8e4dff}@keyframes scroll{to{transform:translate(-50%)}}.location{padding:60px 20px;text-align:center;color:#fff}.location h1{font-size:2.5rem;color:#e0c3fc;margin-bottom:30px}.map-container{width:100%;max-width:900px;margin:0 auto;border-radius:15px;overflow:hidden;box-shadow:0 8px 25px #00000040}.footer-container{background:linear-gradient(135deg,#1e1133,#331b57);padding:40px 20px;text-align:center;color:#ccc}.footer-content{max-width:900px;margin:0 auto}.footer-content .information p{margin-bottom:8px;font-size:14px;line-height:1.5}@media (max-width: 768px){.navbar-menu{display:none;flex-direction:column;background-color:#2d1b4e;position:absolute;top:70px;right:20px;padding:20px;border-radius:10px}.navbar-menu.active{display:flex}.mobile-menu-toggle{display:block}.intro{flex-direction:column}.button-group{flex-direction:column;gap:5px}}body{background-color:#05051e;color:#fff;margin:0;display:flex;align-items:center;justify-content:center}.login-outsideContainer{background-color:#15162f;display:flex;justify-content:center;align-items:center;width:100%;max-width:1200px;padding:40px;box-sizing:border-box;border-radius:8px;flex-direction:row}.login-container{margin:auto;padding:40px;border-radius:8px;max-width:450px;width:100%;box-sizing:border-box}.login-container h1{margin-bottom:24px;color:#fff;font-size:28px}.login-container input{padding:12px;margin-bottom:16px;border:1px solid #ccc;border-radius:8px;font-size:16px;color:#000}.login-container button{background-color:#640ef1;color:#fff;padding:14px;border-radius:8px;border:none;cursor:pointer;margin-bottom:24px;width:70%;box-sizing:border-box}.login-gambar img{max-width:400px;height:auto;object-fit:cover;border-radius:12px;box-sizing:border-box}.form-group{margin-bottom:16px}@media (max-width: 768px){.login-outsideContainer{flex-direction:column;padding:0 20px}.login-container{margin-left:0;max-width:100%}.login-gambar img{width:100%;height:auto}}@media (max-width: 480px){.login-gambar img{display:none}}*{box-sizing:border-box;margin:0;padding:0}body{background-color:#05051e;color:#fff;display:flex;justify-content:center;align-items:center}.signup-outsideContainer{background-color:#15162f;display:flex;justify-content:center;align-items:center;width:100%;max-width:1280px;padding:40px;border-radius:8px;box-shadow:0 4px 15px #0003}.signup-container{justify-content:center;margin:auto;padding:40px;border-radius:8px;max-width:450px;width:100%}.signup-container h1{margin-bottom:24px;color:#fff;font-size:28px}.signup-container input{padding:12px;margin-bottom:16px;border:1px solid #ccc;border-radius:8px;font-size:16px;color:#000;background-color:#fff}.signup-container button{background-color:#640ef1;color:#fff;padding:14px;border-radius:8px;border:none;cursor:pointer;margin-bottom:24px;width:70%;box-sizing:border-box}.signup-gambar img{max-width:400px;height:auto;object-fit:cover;border-radius:12px}.line-or{display:flex;align-items:center;text-align:center;margin:20px 0}.line-or:before,.line-or:after{content:"";flex:1;border-bottom:1px solid #CFDFE2}.line-or:before{margin-right:10px}.line-or:after{margin-left:10px}.line-or span{padding:0 10px;font-size:16px;color:#fff}@media (max-width: 768px){.signup-outsideContainer{flex-direction:column;padding:0 20px}.signup-container{margin-left:0;max-width:100%}.signup-gambar img{width:100%;height:auto}}@media (max-width: 480px){.signup-gambar img{display:none}}*{margin:0;padding:0;box-sizing:border-box}body{background-color:#05051e;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;overflow-x:hidden}.app-container{min-height:100vh;display:flex;flex-direction:column}.navbar{background-color:#05051ef2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(152,173,246,.1);position:sticky;top:0;z-index:1000;padding:1rem 0}.navbar-container{max-width:1200px;margin:0 auto;padding:0 1rem;display:flex;align-items:center;justify-content:space-between}.navbar-brand{display:flex;align-items:center}.navbar-logo{width:40px;height:40px;border-radius:8px}.navbar-toggle{display:none;background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:.5rem;border-radius:4px;transition:color .3s ease}.navbar-toggle:hover{color:#98adf6}.navbar-menu{list-style:none;display:flex;align-items:center;gap:2rem;margin:0;padding:0}.navbar-item{position:relative}.navbar-link{color:#fff;text-decoration:none;font-size:1rem;font-weight:500;padding:.5rem 1rem;border-radius:6px;transition:all .3s ease;display:flex;align-items:center;gap:.5rem}.navbar-link:hover{color:#98adf6;background-color:#98adf61a}.logout-btn{background:none;border:none;cursor:pointer}.logout-btn:hover{color:#ff6b6b;background-color:#ff6b6b1a}.logout-icon{font-size:.9rem}.main-content{flex:1;padding:2rem 0}.home-content{max-width:1200px;margin:0 auto;padding:0 1rem}.main-title{font-size:clamp(2rem,5vw,3rem);background:linear-gradient(135deg,#4066ef,#98adf6);-webkit-background-clip:text;background-clip:text;color:transparent;text-align:center;margin-bottom:3rem;font-weight:700}.pc-selection-container{margin-bottom:4rem}.pc-cards-wrapper{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:1000px;margin:0 auto}.pc-card{background:linear-gradient(145deg,#15162f,#1a1b35);border-radius:16px;overflow:hidden;box-shadow:0 10px 30px #0000004d;transition:all .4s cubic-bezier(.4,0,.2,1);border:1px solid rgba(152,173,246,.1);position:relative}.pc-card:hover{transform:translateY(-10px);box-shadow:0 20px 40px #4066ef33;border-color:#98adf64d}.card-header{padding:1.5rem 1.5rem 1rem}.card-title{color:#fff;font-size:1.25rem;font-weight:600;margin-bottom:1rem}.progress-bar{width:100%;height:4px;background-color:#2e303380;border-radius:2px;overflow:hidden}.progress-fill{height:100%;width:0;background:linear-gradient(90deg,#dd2d4a,#ff4757);border-radius:2px;transition:width .6s ease-out}.pc-card:hover .progress-fill{width:80%}.card-link{display:block;text-decoration:none}.card-image-container{position:relative;overflow:hidden}.card-image{width:100%;height:200px;object-fit:cover;transition:transform .4s ease}.pc-card:hover .card-image{transform:scale(1.05)}.card-content{padding:1.5rem}.card-description{color:#fffc;font-size:.95rem;line-height:1.5}.section-title{font-size:clamp(1.5rem,4vw,2rem);background:linear-gradient(135deg,#4066ef,#98adf6);-webkit-background-clip:text;background-clip:text;color:transparent;text-align:center;margin-bottom:2rem;font-weight:600}.price-section{margin-bottom:4rem}.price-list-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:800px;margin:0 auto}.price-card{background:linear-gradient(145deg,#15162f,#1a1b35);border-radius:16px;padding:1rem;border:1px solid rgba(152,173,246,.1);transition:all .3s ease}.price-card:hover{transform:translateY(-5px);border-color:#98adf64d}.price-image{width:100%;height:auto;border-radius:12px;display:block}.booking-queue-section{background:linear-gradient(145deg,#15162f,#1a1b35);border-radius:16px;padding:2rem;border:1px solid rgba(152,173,246,.1);margin-top:2rem}.queue-container{max-width:600px;margin:0 auto}.empty-queue{text-align:center;padding:2rem;color:#fff9;font-style:italic}.queue-list{display:flex;flex-direction:column;gap:1rem}.queue-item{background:#05051e80;border-radius:12px;padding:1rem 1.5rem;display:flex;justify-content:space-between;align-items:center;border:1px solid rgba(152,173,246,.1);transition:all .3s ease}.queue-item:hover{background:#05051eb3;border-color:#98adf633}.queue-info{display:flex;flex-direction:column;gap:.25rem}.queue-user{font-weight:600;color:#98adf6}.queue-pc{color:#fffc;font-size:.9rem}.queue-countdown{font-weight:600;color:#4caf50;font-size:.95rem}@media screen and (max-width: 1024px){.pc-cards-wrapper{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.price-list-container{grid-template-columns:1fr;gap:1.5rem}.navbar-menu{gap:1.5rem}}@media screen and (max-width: 768px){.navbar-toggle{display:block}.navbar-menu{position:fixed;top:100%;left:0;width:100%;background:#05051efa;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);flex-direction:column;align-items:center;padding:2rem 1rem;gap:1rem;transform:translateY(-100%);opacity:0;visibility:hidden;transition:all .3s cubic-bezier(.4,0,.2,1);border-top:1px solid rgba(152,173,246,.1)}.navbar-menu.open{transform:translateY(0);opacity:1;visibility:visible}.navbar-link{padding:.75rem 1.5rem;width:200px;text-align:center;border-radius:8px;border:1px solid rgba(152,173,246,.1)}.main-content{padding:1rem 0}.pc-cards-wrapper{grid-template-columns:1fr;gap:1.5rem}.pc-card{max-width:400px;margin:0 auto}.card-image{height:180px}.queue-item{flex-direction:column;align-items:flex-start;gap:.5rem;text-align:left}.queue-info{width:100%}.queue-countdown{align-self:flex-end}}@media screen and (max-width: 480px){.home-content{padding:0 .75rem}.main-title{margin-bottom:2rem}.pc-cards-wrapper{grid-template-columns:1fr;gap:1rem}.pc-card{max-width:100%}.card-header{padding:1rem 1rem .75rem}.card-content{padding:1rem}.card-title{font-size:1.1rem}.card-image{height:160px}.booking-queue-section{padding:1.5rem 1rem}.queue-item{padding:1rem}.navbar-container{padding:0 .75rem}.navbar-logo{width:35px;height:35px}}@media screen and (max-width: 360px){.navbar-link{width:180px;padding:.5rem 1rem}.card-image{height:140px}.price-card{padding:.75rem}}.grid-container{display:flex;flex-wrap:wrap;gap:5px}.grid-item{background-color:#fff;padding:10px;text-align:center;border-radius:4px;flex:0 0 calc(16.66% - 5px);box-sizing:border-box}.grid-item.unavailable{background-color:#222;color:#aaa;cursor:not-allowed}.navbar-menu{list-style:none;display:flex;gap:15px;margin:0}.container{display:flex;justify-content:space-between;padding:20px}.pc-list{flex:2;margin-right:20px;background-color:#15162f;padding:20px;color:#000}.note-item{color:#fff;display:flex;align-items:center;margin:0 10px}.color-box.purple{background-color:purple}.color-box.black{background-color:#000}.color-box.white{background-color:#fff}.info-panel{text-align:center;flex:1;background-color:#15162f;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.grid-item{background-color:#fff;padding:20px;text-align:center;border-radius:4px}.info-panel p{color:gray}.order-item.alpha{background-image:url(/img/imgOrderPage/alpha.png);background-size:cover;background-position:center;color:#fff;height:400px}.order-item.beta{background-image:url(/img/imgOrderPage/beta.png);background-size:cover;background-position:center;color:#fff}.order-item.driving{background-image:url(/img/imgOrderPage/driving.png);background-size:cover;background-position:center;color:#fff}.order-container{padding:20px;max-width:1200px;margin:auto}.order-content{display:grid;grid-template-columns:1fr;gap:20px}@media screen and (min-width: 768px){.order-content{grid-template-columns:3fr 1fr}}.order-list{display:flex;flex-direction:column;gap:15px}.order-item{display:flex;flex-direction:column;justify-content:space-between;background-color:#15162f;padding:20px;border-radius:12px;gap:10px;height:auto;min-height:120px;background-size:cover;background-position:center;color:#fff;position:relative}.order-details{display:flex;flex-wrap:wrap;gap:16px}.order-details label{font-size:14px;margin-bottom:4px}.order-details input{padding:6px 10px;border-radius:6px;border:none;background-color:#2c2d59;color:#fff;width:150px}.order-details input:focus{outline:none;box-shadow:0 0 5px #640ef1}.order-item h2{margin-bottom:10px;font-size:20px;font-weight:700;text-shadow:1px 1px 4px rgba(0,0,0,.6)}.order-title{font-size:16px;font-weight:700}.order-price{margin:5px 0;color:#0f9;font-weight:700}.order-time,.order-duration{background-color:#2c2d59;border:none;border-radius:5px;color:#fff;padding:8px;width:80px;box-sizing:border-box}.order-time:focus,.order-duration:focus{outline:none;box-shadow:0 0 5px #ffffff80}.order-summary{background-color:#15162f;padding:20px;border-radius:8px;text-align:center}.order-total{font-size:18px;margin:15px 0}.order-inputs{display:flex;gap:10px;margin-top:10px}.order-input-group{display:flex;flex-direction:column;flex:1}.order-input-group label{font-size:14px;color:#ccc;margin-bottom:5px}.voucher-btn,.buy-btn{display:flex;align-items:center;justify-content:center;gap:10px;background-color:#640ef1;color:#fff;border:none;padding:10px 20px;border-radius:8px;cursor:pointer;transition:background-color .3s ease;width:100%}.voucher-btn:hover,.buy-btn:hover{background-color:#5200cc}.modal.open{display:block;position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-end;justify-content:center;z-index:1000}.modal{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#2c2d59e6;display:flex;align-items:flex-end;justify-content:center;z-index:1000}.modal-content{background-color:#2c2d59;width:100%;max-width:500px;border-radius:16px 16px 0 0;padding:20px;position:relative}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-title{font-size:18px;font-weight:600}.close-button{background:none;border:none;color:#fff;font-size:24px;cursor:pointer}.payment-method{background-color:#15162f;border-radius:12px;padding:16px;margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;cursor:pointer}.payment-method.selected{border:2px solid #640EF1}.method-info{display:flex;align-items:center;gap:12px}.method-icon{width:32px;height:32px}.radio-indicator{width:20px;height:20px;border:2px solid #640EF1;border-radius:50%;display:flex;align-items:center;justify-content:center}.radio-indicator.selected:after{content:"";width:10px;height:10px;background-color:#640ef1;border-radius:50%}.payment-summary{margin-top:24px}.summary-title{color:#9999a5;font-size:14px;margin-bottom:12px}.summary-item{display:flex;justify-content:space-between;margin-bottom:8px}.total-amount{display:flex;justify-content:space-between;margin:20px 0;font-weight:600}.pay-button{background-color:#640ef1;color:#fff;width:100%;padding:16px;border:none;border-radius:12px;font-weight:600;font-size:16px;cursor:pointer;transition:background-color .3s}.pay-button:hover{background-color:#5200cc}@media (min-width: 768px){.modal{align-items:center}.modal-content{border-radius:16px;margin:20px}}button,input{transition:background-color .3s ease,box-shadow .3s ease}@media screen and (max-width: 480px){.order-item{flex-direction:column;align-items:flex-start}.order-time,.order-duration{width:100%}}.navbar{background-color:#05051e;padding:10px 20px;color:#fff}.navbar-link{color:#fff;text-decoration:none;transition:color .3s ease}.navbar-link:hover{color:#00a8ff}.text-judul{color:#fff;text-align:center;margin-top:20px}.profile-container{max-width:400px;margin:50px auto;background-color:#17141d;border-radius:8px;box-shadow:0 4px 8px #0000004d;overflow:hidden;text-align:center;position:relative}.profile-header{padding:20px;color:#fff;position:relative;z-index:1}.profile-container img{position:absolute;top:20px;left:50%;transform:translate(-50%);width:450px;opacity:.2;z-index:0}.profile-info{padding:20px}.profile-details{text-align:left;margin-top:20px}.detail-item{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #333}.detail-label{font-weight:700;color:#888}.detail-value{color:#fff}.btn-edit,.btn-topup{padding:10px 20px;background-color:#00a8ff;border:none;border-radius:5px;color:#fff;cursor:pointer;transition:background-color .3s ease;margin-top:15px}.btn-edit:hover,.btn-topup:hover{background-color:#005f7f}.voucher-section{background-color:#1f1b24;padding:20px;margin-top:20px;border-radius:8px}.voucher-item{display:flex;justify-content:space-between;align-items:center;margin-top:10px}.voucher-name{font-weight:700;color:#00a8ff}.voucher-expiry{color:#888}.btn-view-voucher{padding:5px 10px;background-color:#333;border:1px solid #00A8FF;border-radius:4px;color:#00a8ff;cursor:pointer;transition:background-color .3s ease}.btn-view-voucher:hover{background-color:#00a8ff;color:#fff}.modal{display:none;position:fixed;z-index:100;left:0;top:0;width:100%;height:100%;background-color:#000000b3}.modal.open{display:block}.modal-content{position:relative;background-color:#1f1b24;margin:10% auto;padding:20px;border-radius:8px;width:80%;max-width:400px;text-align:center;color:#fff}.close-btn{position:absolute;top:10px;right:20px;color:#888;font-size:24px;cursor:pointer}.close-btn:hover{color:#fff}#editProfileModal label{display:block;margin:10px 0 5px;color:#ddd;text-align:left}#editProfileModal input[type=text],#editProfileModal input[type=email]{width:80%;padding:10px;margin:5px 0 15px;border:1px solid #555;border-radius:5px;background-color:#333;color:#fff}.btn-save{background-color:#00a8ff;color:#fff;padding:10px 20px;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s ease}.btn-save:hover{background-color:#005f7f}@media (max-width: 768px){.navbar-menu{flex-direction:column;gap:10px}.profile-container{max-width:90%}.modal-content{width:95%}}body{background-color:#05051e;color:#fff;font-family:Open Sans,sans-serif;margin:0}.pc-list{margin-top:10px}.pc-table-wrapper{overflow-x:auto}.pc-table{width:100%;border-collapse:collapse;margin-top:10px;font-size:14px;color:#fff}.pc-table th,.pc-table td{border:1px solid #3a3a4d;padding:8px;text-align:center}.pc-table th{background-color:#2a2a3b;font-weight:600}.pc-table tr:nth-child(2n){background-color:#1a1a2a}.pc-table tr:hover{background-color:#33334a}.navbar{padding:10px 20px}.navbar-menu{list-style:none;display:flex;gap:15px}.navbar-link{color:#fff;text-decoration:none}.history-container{padding:20px;color:#fff}.history-list{display:flex;flex-direction:column;gap:16px}.history-item{background-color:#1f1f2f;padding:16px;border-radius:8px;cursor:pointer;transition:background-color .3s ease}.history-item:hover{background-color:#2a2a3b}.history-item h4{margin:0;font-size:18px}.history-item p{margin:4px 0}.history-item p span{font-weight:700}.home-admin-container{padding:20px;font-family:Arial,sans-serif}h1{color:#fff;text-align:center;margin-bottom:20px}.error-message{color:red;text-align:center;margin-bottom:10px}.booking-list{display:flex;flex-direction:column;gap:20px}.booking-item{background:#fff;border-radius:8px;box-shadow:0 4px 8px #0000001a;padding:20px;display:flex;flex-direction:column}.booking-header{display:flex;justify-content:space-between;align-items:center}.booking-header h3{font-size:1.2rem;color:#333}.delete-btn{background-color:#ff4c4c;color:#fff;border:none;padding:5px 15px;border-radius:4px;cursor:pointer;font-size:1rem}.delete-btn:hover{background-color:#f44336}.booking-details{margin-top:15px;display:grid;grid-template-columns:1fr 1fr;gap:20px;color:#555}.booking-details div{margin-bottom:10px}.status{font-weight:700;padding:2px 6px;border-radius:4px}.status.pending{background-color:#f9a825;color:#fff}.status.cancelled{background-color:#d32f2f;color:#fff}.status.confirmed{background-color:#388e3c;color:#fff}.pcs-details{grid-column:span 2;margin-top:15px}.pc-item{margin-bottom:8px;font-size:.9rem;color:#333}.pc-item strong{color:#2c3e50}@media (max-width: 768px){.booking-details{grid-template-columns:1fr}}.complete-btn{background-color:#4caf50;color:#fff;border:none;padding:8px 12px;border-radius:5px;cursor:pointer;margin-left:10px}.complete-btn:hover{background-color:#45a049}body{background-color:#05051e;color:#fff;font-family:Arial,sans-serif;margin:0;padding:0}.navbar{background-color:#05051e;padding:10px 20px}.navbar-container{display:flex;align-items:center;justify-content:space-between}.navbar-logo{width:40px;height:40px}.navbar-menu{list-style:none;display:flex;gap:15px;margin:0;padding:0}.navbar-item .navbar-link{color:#fff;text-decoration:none}.navbar-item .navbar-link:hover{text-decoration:underline}.container{display:flex;padding:20px}.flex-container{display:flex;width:100%}.pc-list{flex:2;margin-right:20px;background-color:#15162f;padding:20px;border-radius:8px}.grid-container{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.grid-item{padding:15px;text-align:center;cursor:pointer;border-radius:8px;margin:5px}.grid-item.available{background-color:#fff;color:#000}.grid-item.unavailable{background-color:#000;color:#fff;cursor:not-allowed}.grid-item.selected{background-color:purple;color:#fff}.color-note{background-color:#2c2d59;padding:10px;border-radius:5px;margin-bottom:15px;display:flex;justify-content:center}.note-item{display:flex;align-items:center;color:#fff;margin:0 10px}.color-box{width:20px;height:20px;border-radius:3px;margin-right:10px}.color-box.green{background-color:#fff}.color-box.red{background-color:#000}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0009;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:#1e1e2f;padding:20px;border-radius:10px;width:300px;text-align:center;color:#fff;box-shadow:0 0 10px #0000004d}.modal-content h3{margin-top:0;color:#00b894}.modal-content button{margin:10px 5px 0;padding:8px 15px;border:none;border-radius:6px;cursor:pointer}.modal-content button:first-of-type{background-color:#00b894;color:#fff}.cancel-btn{background-color:#ff4757;color:#fff}.confirm-btn{background-color:#640ef1;color:#fff;border:none;padding:10px 20px;border-radius:5px;cursor:pointer}.confirm-btn:hover{background-color:#5200cc}.user-management-container{padding:20px}h1{font-size:2rem;margin-bottom:20px}.search-container{margin-bottom:20px}.search-input{width:100%;padding:10px;font-size:16px;border:1px solid #ccc;border-radius:5px;box-sizing:border-box;background-color:#fff;color:#000}.users-table{margin-top:20px;width:100%;border-collapse:collapse}.users-table table{width:100%;border:1px solid #ddd;margin-top:20px}.users-table th,.users-table td{padding:12px;text-align:left;border-bottom:1px solid #ddd}.users-table th{background-color:#333;text-align:center}.edit-btn,.delete-btn{background-color:#007bff;color:#fff;padding:6px 12px;border:none;border-radius:5px;cursor:pointer;margin-right:10px}.edit-btn:hover{background-color:#0056b3}.delete-btn{background-color:red}.delete-btn:hover{background-color:#c00}.error-message{color:red;font-size:1rem;margin-top:20px}@media (max-width: 768px){.search-input{width:100%}.users-table table{font-size:14px}}.container{padding:2rem;background-color:#1e1e1e;min-height:100vh;color:#fff}.stats-card{background-color:#222;padding:2rem;border-radius:10px;text-align:center;color:#fff;margin-top:2rem;box-shadow:0 4px 8px #ffffff1a}
