:root{--color-primary:#03045e;--color-primary-light:#0077b6;--color-primary-medium:#00b4d8;--color-accent:#90e0ef;--color-accent-light:#caf0f8;--font-primary:"Roboto",sans-serif;--font-secondary:"Space Grotesk",sans-serif;--font-weight-normal:400;--font-weight-medium:500;--font-weight-bold:700;--heading-font:var(--font-secondary);--body-font:var(--font-primary)}::selection{background-color:var(--color-primary);color:var(--color-accent-light);-webkit-background-clip:text;background-clip:text}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{box-shadow:inset 0 0 2px var(--color-accent);border-radius:1px}::-webkit-scrollbar-thumb{background:var(--color-accent-light);cursor:-webkit-grab;border-radius:1px}::-webkit-scrollbar-thumb:hover{background:var(--color-accent-light)}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{font-family:var(--body-font)}html,body{margin:0;padding:0}input[type=checkbox],input[type=radio]{cursor:pointer;border:2px solid var(--color-primary)}input[type=checkbox]:checked,input[type=radio]:checked{background-color:var(--color-primary);border-color:var(--color-primary)}input[type=text]:read-only,input[type=email]:read-only,input.input-list:read-only{opacity:1;background-color:#e9ecef;pointer-events:none!important}.btn-primary:disabled{background-color:var(--color-primary);color:#e0e0e0}.btn-primary:focus{background-color:var(--color-primary-light);color:#e0e0e0}.btn-secondary{background-color:var(--color-primary-light);color:#fff;border:none}.btn-secondary:disabled,.btn-secondary:focus{background-color:var(--color-primary-light);color:#e0e0e0}.btn-secondary:hover{color:#fff}.btn-outline-primary:disabled{border:1px solid var(--color-primary);color:var(--color-primary);background-color:#0000}.btn-outline-primary:focus{border:2px solid var(--color-primary-light);color:var(--color-primary-light);background-color:#0000}.btn-outline-primary.active{background-color:var(--color-primary);border:1px solid var(--color-primary);color:#fff}.btn-outline-secondary{border:1.5px solid var(--color-primary-light);color:var(--color-primary-light);background-color:#0000}.btn-outline-secondary:disabled{border:1px solid var(--color-primary-light);color:var(--color-primary-light);background-color:#0000}.btn-outline-secondary:focus{border:1.5px solid var(--color-primary-light)!important;color:var(--color-primary-light)!important;background-color:#0000!important}.btn-outline-secondary:hover{border:1.5px solid var(--color-primary-light);color:var(--color-primary-light);opacity:.8;background-color:#0000}.navbar{background-color:#05668d;justify-content:space-between;align-items:center;padding:1rem 2rem;display:flex}.nav-container{background:0 0!important;max-width:80vw!important}.navbar-left{align-items:center;display:flex}.custom-logout-btn{background-color:var(--color-primary);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:8px 14px;font-size:14px}.header{background-color:#05668d;justify-content:space-between;align-items:center;padding:1rem 2rem;display:flex}.header-left{align-items:center;display:flex}.header-container{justify-content:space-between;align-items:center;width:100%;max-width:80vw;margin:0 auto;display:flex}.logo-container{background-color:var(--color-accent);border-radius:20px;align-items:center;gap:.75rem;padding:.5rem 1rem;display:flex}.logo-container img{object-fit:contain;width:40px;height:40px}.logo-container h3{font-size:.9rem;font-weight:var(--font-weight-bold);color:var(--color-primary);margin:0;line-height:1.2}.logo-container .text-logo{flex-direction:column;display:flex}.header-right button{background-color:var(--color-primary);color:#fff;font-weight:var(--font-weight-bold);cursor:pointer;border:none;border-radius:5px;padding:.6rem 2rem;font-size:.9rem}.welcome-section{margin:50px 40px}.welcome-section .top-section{flex-direction:row;justify-content:space-between;display:flex}.breadcrumb ul{align-items:center;margin:0;padding:0;list-style:none;display:flex}.breadcrumb li.breadcrumb-item{font-size:1.8rem;font-weight:var(--font-weight-bold);color:var(--color-primary);cursor:pointer;text-decoration:underline;transition:all .3s}.breadcrumb li.breadcrumb-item.active{opacity:.8;cursor:default;text-decoration:none}.breadcrumb li.breadcrumb-item .slash{color:var(--color-primary);opacity:.7;margin:0 .4rem}body{background-color:var(--color-accent-light);font-family:var(--font-secondary)}.left-img{object-fit:cover;border-radius:40px;width:100%;height:100%}.logo-text{color:var(--color-primary);font-size:30px}.text-under{color:var(--color-primary)}.field-label{font-size:18px}.break-line{border:2px solid var(--color-primary);border-radius:2px}.btn-login,.btn-verify{background-color:var(--color-primary);color:#fff;font-weight:var(--font-weight-medium)}.btn-login:hover,.btn-verify:hover{background-color:var(--color-primary-light);color:#fff}.btn-back{border:2px solid var(--color-primary);color:var(--color-primary);font-weight:var(--font-weight-medium);background-color:#0000}.btn-back:hover{border:2px solid var(--color-primary-light);color:var(--color-primary-light)}.logo-circle{width:80px;height:80px}.title-text{color:var(--color-primary)}.divider{border-top:2px solid var(--color-primary)}.form-check-input{border:2px solid var(--color-primary);background-color:var(--color-accent-light)}.access-btn{width:80%}.text-under{color:#000;font-size:12px}.text-middle{font-size:15px}.id-number{color:var(--color-primary);font-size:24px}.btn-next,.btn-submit{background-color:var(--color-primary);color:#fff;font-weight:var(--font-weight-medium)}.btn-next:hover,.btn-submit:hover{background-color:var(--color-primary-light);color:#fff}.btn-previous{border:2px solid var(--color-primary);color:var(--color-primary)!important;background-color:#0000!important}.btn-previous:hover{color:var(--bs-primary);border:2px solid var(--bs-primary)}.invalid-feedback{font-size:12px}.error-message{margin-bottom:20px}.error-message.recaptcha{color:var(--bs-form-invalid-color);text-align:center;margin-top:-20px;font-size:14px}.step-circle{border:4px solid var(--color-primary);width:50px;height:50px;color:var(--color-primary);font-weight:var(--font-weight-bold);background:#fff;border-radius:50%;justify-content:center;align-items:center;display:flex}.step-circle.active{background:var(--color-accent)}.step-circle.completed{background:var(--color-accent);border-color:var(--color-primary)}.step-line{width:100px}.dashboard-container{max-width:92vw;margin:0 auto}.main-content-width{max-width:92vw;margin:0 auto;padding-left:12px;padding-right:12px}.profile-consult-row{align-items:stretch}.card-equal{background-color:var(--color-accent);border:.5px solid var(--color-primary);box-sizing:border-box;border-radius:10px;flex-direction:column;justify-content:flex-start;height:auto;min-height:240px;padding:18px;display:flex}.consultation-card{align-items:center;gap:18px;padding:14px 18px;display:flex}.consultation-image{object-fit:cover;border-radius:10px;width:180px;max-width:180px;height:auto}.consultation-text{flex-direction:column;justify-content:center;gap:8px;display:flex}.consultation-title{margin:0;font-size:30px;line-height:1.15;color:var(--color-primary)!important;font-weight:700!important}.consultation-description{color:#000;margin:0;font-size:15px;line-height:1.3}.dashboard-to-appointment-btn{color:#fff;text-decoration:none}@media (max-width:992px){.card-equal,.consultation-card{height:auto;min-height:auto}.consultation-card{text-align:center;flex-direction:column;align-items:center}.consultation-image{width:auto;max-width:60%}.custom-btn{width:100%}.main-content-width{max-width:95vw}}@media (max-width:576px){.consultation-title{font-size:16px}.consultation-description{font-size:12.5px}.custom-btn{padding:7px 12px;font-size:13px}}.profile-card{box-sizing:border-box;background:0 0;border:none;flex-direction:column;gap:10px;width:100%;height:100%;padding:0;display:flex}.profile-header .section-title{color:var(--color-primary);font-size:30px;font-weight:var(--font-weight-bold);margin:0 0 4px}.profile-header .section-subtitle{color:#000;margin:0 0 10px;font-size:15px}.profile-row{justify-content:center;align-items:center;gap:5.5rem;width:100%;display:flex}.left-section{flex-direction:column;flex:none;gap:8px;width:auto;display:flex}.profile-container{background-color:var(--color-accent-light);box-sizing:border-box;border-radius:10px;justify-content:center;align-items:center;width:110px;height:110px;padding:4px;display:flex;overflow:hidden}.profile-image{object-fit:cover;border-radius:8px;width:100%;height:100%}.right-section{flex-direction:column;flex:0 auto;justify-content:space-between;min-width:0;display:flex}.profile-name,.profile-info,.profile-email{color:#000;margin:0;font-size:15px}.custom-btn{background-color:var(--color-primary);color:#fff;white-space:nowrap;border:none;border-radius:6px;padding:7px 14px;font-size:13.5px}.appointment-container{background-color:var(--color-accent);border:.5px solid var(--color-primary);box-sizing:border-box;border-radius:10px;margin:0 auto 40px;padding:20px}.appointment-table{background-color:#fff;border-radius:18px;margin:10px 0;padding:18px}.my-profile-container{border-radius:10px;margin:0 auto;padding:30px 0;background-color:var(--color-accent)!important;border:.5px solid var(--color-primary)!important}.my-profile-content-wrapper{max-width:91.5vw;margin:0 auto;padding:0 20px}.my-profile-top-section{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:15px;margin-bottom:25px;display:flex}.my-profile-header-text{flex:1}.my-profile-title{color:var(--color-primary);font-size:32px;font-weight:var(--font-weight-bold);margin:0 0 5px}.my-profile-subtitle{color:#000;margin:0;font-size:15px}.my-profile-back-btn{background-color:var(--color-primary);color:#fff;white-space:nowrap;cursor:pointer;border:none;border-radius:6px;padding:10px 24px;font-size:14px}.my-profile-back-btn .my-profile-back-link{color:#fff;text-decoration:none}@media (max-width:992px){.my-profile-top-section{flex-direction:column}.my-profile-back-btn{width:100%}.my-profile-title{font-size:26px}}@media (max-width:576px){.my-profile-container{padding:20px 0}.my-profile-content-wrapper{padding:0 12px}.my-profile-title{font-size:22px}.my-profile-subtitle{font-size:13px}}.account-form-section{width:100%}.section-title{margin-bottom:1.5rem;font-weight:700}.form-group{margin-bottom:1.5rem}.form-label{margin-bottom:.5rem;font-weight:500}.ai-email-group{margin-bottom:1rem}.update-account-btn{margin-top:1rem}.profile-image-section,.profile-image-form{width:100%}.profile-image-wrapper{background-color:#f5f5f5;border:3px solid #e0e0e0;justify-content:center;align-items:center;width:300px;height:300px;display:flex;overflow:hidden}.profile-img{object-fit:cover;width:100%;height:100%}.profile-upload-controls{flex-direction:column;gap:.5rem;width:100%;display:flex}.file-select-input{width:100%}.profile-upload-actions{justify-content:center;gap:.5rem;display:flex}.save-file-btn{min-width:100px}.select-reason{margin-top:-270px!important}.appointment-form{margin-top:-65px!important}.appointment-confirmation{margin-top:-180px!important}.followup-form{margin-top:-65px!important}.followup-confirmation{margin-top:-180px!important}.appointment-container{background-color:var(--color-accent);border:.5px solid var(--color-primary);border-radius:10px;padding:30px}.step-circle.active,.step-circle.completed{background-color:var(--color-primary);color:#fff}.section-heading{color:var(--color-primary);letter-spacing:.5px;font-size:18px}.form-select,.form-control{background-color:#fff;border-radius:6px;padding:10px 12px;font-size:14px}.form-select:focus,.form-control:focus{border-color:var(--color-primary);outline:none}.btn-outline-primary:hover{background-color:var(--color-primary);color:#fff}.text-description{font-size:.75rem}.reason-card{cursor:pointer;background-color:#fff;border-radius:8px;height:100%;transition:all .3s}.reason-card:hover{border-color:var(--color-primary);box-shadow:0 2px 8px #0000001a}.reason-card input[type=radio]:checked~div{border-color:var(--color-primary)}.reason-card:has(input[type=radio]:checked){border-color:var(--color-primary)}.appointment-form-title,.followup-form-title{color:var(--color-primary)}.appointment-details-container,.booking-details-container{background-color:var(--color-accent);border-radius:10px}.dotted-divider{border-top:2px dotted var(--color-primary);margin:20px 0}.confirmation-container{background-color:var(--color-accent);border:.5px solid var(--color-primary);width:100%;max-width:900px;color:var(--color-primary);border-radius:10px;margin:40px auto;padding:40px;box-shadow:0 2px 6px #0000001a}.section-title{font-size:1.8rem;font-weight:700}.section-subtitle{color:var(--color-primary);margin-bottom:30px;font-size:1rem}.stepper-container{justify-content:center;align-items:center;gap:12px;margin-bottom:30px;display:flex}.stepper-container .step{border:2px solid var(--color-primary);width:40px;height:40px;color:var(--color-primary);border-radius:50%;justify-content:center;align-items:center;font-weight:700;display:flex}.stepper-container .step-line{background-color:var(--color-primary);border:none;flex:1;height:2px;margin:0}.stepper-container .step.active,.stepper-container .step.completed{background-color:var(--color-primary);color:var(--color-accent)}.confirmation-title{margin-bottom:15px;font-size:1.5rem;font-weight:700}.confirmation-message{font-size:1rem}.confirmation-details{color:#2e2c2c;padding:0 200px;font-size:.8rem}.reminder-text{margin-top:10px;font-style:italic}.btn-done{background-color:var(--color-primary);color:var(--color-accent);border:none;border-radius:8px;padding:10px 30px;font-size:1rem;font-weight:700;transition:all .3s}.btn-done:hover{opacity:.9;transform:scale(1.03)}.list li{margin-top:20px}@media (max-width:768px){.step-line{width:50px}.step-circle{width:40px;height:40px;font-size:16px}.section-heading{font-size:16px}.section-title{font-size:1.5rem}.confirmation-title{font-size:1.3rem}}.btn-primary{background-color:var(--color-primary);color:#fff;border:none}.btn-primary:hover{color:#fff}.btn-outline-primary{border:2px solid var(--color-primary);color:var(--color-primary);background-color:#0000}.btn-outline-primary:hover{border:2px solid var(--color-primary-light);color:var(--color-primary-light);background-color:#0000}.container{font-family:var(--font-secondary);background-color:var(--color-accent-light);color:var(--color-primary);max-width:78vw}.patient-table-container,.appointment-table-container{background-color:var(--color-accent);border:.5px solid var(--color-primary);box-sizing:border-box;border-radius:10px;margin:0 auto 40px;padding:20px}.staff-dashboard-container{max-width:91.5vw;margin:0 auto}.patient-info-card{align-items:center;gap:18px;padding:14px 18px;display:flex}.top-card-text{flex-direction:column;justify-content:center;gap:8px;display:flex}.top-card-title{color:var(--color-primary);margin:0;font-size:30px;font-weight:700;line-height:1.15}.top-card-description{color:#000;margin:0;font-size:15px;line-height:1.3}.custom-btn{background-color:var(--color-primary);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:8px 14px;font-size:14px}@media (max-width:992px){.card-equal,.patient-info-card{height:auto;min-height:auto}.patient-info-card{text-align:center;flex-direction:column;align-items:center}.custom-btn{width:100%}}@media (max-width:576px){.top-card-title{font-size:16px}.top-card-description{font-size:12.5px}.custom-btn{padding:7px 12px;font-size:13px}}.total-appointment-container{position:relative}.total-appointment-container i{z-index:1000;font-size:24px;position:absolute;top:15px;right:20px}.patient-container{position:relative}.top-card-text{padding:20px}.patient-container i{z-index:1000;font-size:24px;position:absolute;top:15px;right:20px}.top-card-title{color:#000;font-weight:var(--font-weight-normal)}.patient-registered-list-table,.patient-appointment-list-table{background-color:#fff;border-radius:18px;margin:10px 0;padding:18px}.patient-profile-container{border-radius:10px;margin:0 auto;padding:30px 0;background-color:var(--color-accent)!important;border:.5px solid var(--color-primary)!important}.patient-profile-wrapper{max-width:91.5vw;margin:0 auto;padding:0 20px}.appointment-history-container{box-sizing:border-box;padding:30px}.step-circle{border:2px solid var(--color-primary);width:50px;height:50px;font-size:20px;font-weight:var(--font-weight-bold);color:var(--color-primary);background-color:#fff;border-radius:50%;justify-content:center;align-items:center;margin:0 auto;display:flex}.step-circle.active,.step-circle.completed{background-color:var(--color-primary);color:#fff}.step-line{border-top:2px solid var(--color-primary);flex-grow:0;width:100px;margin:0 1rem}
