/*latest-style.css*/
@import "primeicons/primeicons.css";

:root {
    --box_shadow: 0 0 #0000, 0 0 #0000, 0 1px 2px 0 rgba(18, 18, 23, 0.05);
    --box_shadow-sm: 4px 4px 7px 0 #FAF9FF;
    --box_shadow-md: 0px 3px 7px 3px #29578126;
    /*border-radius*/
    --border_radius_sm: 0.25rem;
    --border_radius_md: 0.375rem;
    --border_radius_xl: 1rem;
    --border_radius_xxl: 1.5rem;
    --border_radius_2xl: 2rem;
    /*end-border-radius*/
    /*bg-colors*/
    /* --primary_color: #D23367; */
    --primary_color: #176fa2;
    --secondary_color: #f14340;
    --su_white_color: #ffffff;
    --su_black_color: #444444;
    --su_background_color: #FAF9FF;
    --su_orange: #F66100;
    --su_red: #dc3544;
    --su_green: #198754;
    --su_purple: #855797;
    --su_cyanblue: #1199D5;
    --su_periwinkleblue: #809CCB;
    --su_blue: #305AAB;
    --su_green_500: #00B94E;
    --su_skyblue_300: #0dcaee;
    --su_body_color:#444444;
    --su_text_01: #333333;
    --su_text_02: #FAF9FF;
    --su_text_03: #3d3d3d;
    --su_text_04: #4d4d4d;
    --su_text_05: #5e5e5e;
    --su_text_06: #7F7F7F;
    --su_text_07: #CCCCCC;
    --su_text_08: #cacaca;
    --su_text_09: #6c757d;
    /*end-bg-colors*/
    /*padding*/
    --font_size_xs: 9px;
    --font_size_sm: 10px;
    --font_size_mr_sm: 11px;
    --font_size_mr: 12px;
    --font_size_md: 13px;
    --font_size_lg: 16px;
    /*end-padding*/
}


.primary-color{color: var(--primary_color);}
.secondary-color{color: var(--secondary_color);}
.black-color{color: var(--su_black_color);}
.text-color4{color: var(--su_text_04);}
.text-color5{color: var(--su_text_05);}
.text-color6{color: var(--su_text_06);}
.text-color7{color: var(--su_text_07);}
.text-color8{color: var(--su_text_08);}
.text-color9{color: var(--su_text_09);}
.text-white{color: var(--su_white_color);}
.text-green{color: var(--su_green);}
.text-red{color: var(--su_red);}
.text-blue{color: var(--su_blue);}
.bg-blue{background-color: var(--su_blue);}
.text-purple{color: var(--su_purple);}
.bg-purple{background-color: var(--su_purple);}
.bg-cyanblue{background-color: var(--su_cyanblue);}
.bg-periwinkleblue{background-color: var(--su_periwinkleblue);}
.text_warning{color:#ffc107}
.dark_text{color: #212529;}
.primary_background{background-color: var(--primary_color);}
.success_bg{background-color: var(--su_green_500);}
.danger_bg{background-color: var(--su_red);}
.white_bg{background-color: var(--su_white_color);}
.Completed_bg{background-color: var(--su_green);}
.p-error{font-size: 12px;}
div{scrollbar-face-color:var(--su_gray_500);scrollbar-highlight-color:var(--su_gray_500);scrollbar-3dlight-color:var(--su_gray_500);scrollbar-darkshadow-color:var(--su_gray_500);scrollbar-shadow-color:var(--su_gray_500);scrollbar-arrow-color:#333333;scrollbar-track-color:#EAEAEA;}                               
/* Scrollbar Styling */
::-webkit-scrollbar {width:5px; height:5px;}
::-webkit-scrollbar-track {background-color: var(--su_white_color);-webkit-border-radius: 10px;border-radius: 10px;}
::-webkit-scrollbar-thumb {-webkit-border-radius: 10px;border-radius: 10px;background: var(--primary_color); }
.scrollbar {height: 100%;overflow: auto;-webkit-overflow-scrolling: touch;}
/* end-Scrollbar Styling */

* {margin: 0;box-sizing: border-box;font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";}
html,body {width: 100%;height: 100%;  display: flex;
    flex-direction: column;font-size: 14px; color: var(--su_body_color); overflow: hidden;font-family: "Inter var", sans-serif; background-color: var(--su_background_color);}
h1,h2,h3,h4,h5,h6{color: var(--su_black_color); font-weight: 500;}
ul,ol,p,h1,h2,h3,h4,h5,h6 {margin: 0;padding: 0;line-height: 21px;}
ul {list-style: none;}
a {text-decoration: none;}
.field {margin-bottom: 0rem !important;}
.field>label {margin-bottom: 0.3rem !important;font-weight: 400; display: inline-block;}
.pointer{cursor: pointer !important;}
.p-inputtext::placeholder{color: var(--su_text_08);}
.p-dropdown .p-dropdown-label.p-placeholder {color: var(--su_text_08);}
.p-dropdown{border-radius: var(--border_radius_xl);}
.p-calendar{width: 100%;}
.p-calendar .p-button-icon-only {border-top-right-radius: var(--border_radius_xl);border-bottom-right-radius: var(--border_radius_xl);padding: .375rem .75rem;}
.p-autocomplete{width: 100%;}
.p-calendar .p-inputtext{border-top-left-radius: var(--border_radius_xl); border-bottom-left-radius: var(--border_radius_xl); border-top-right-radius: 0px; border-bottom-right-radius: 0px;}
.p-inputtext{border: 1px solid var(--su_text_08);box-shadow: var(--box_shadow);display: block;width: 100%;padding: .375rem .75rem;font-weight: 400;line-height: 1.5;color: var(--su_body_color);-webkit-appearance: none;-moz-appearance: none;appearance: none;background-color: var(--su_white_color);background-clip: padding-box;border-radius: var(--border_radius_xl);transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;}
.p-inputtext:hover{border: 1px solid var(--primary_color);}
.p-inputtext:focus{color: var(--su_body_color);background-color: var(--su_white_color);border-color: var(--primary_color);outline: 0;box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);}
.p-dropdown .p-inputtext{border: none; border-radius: var(--border_radius_xl); width: 100%;}
.p-dropdown:hover{border: 1px solid var(--primary_color);}
.p-dropdown .p-inputtext:focus{outline: none;box-shadow: none;}
.p-dropdown{width: 100%;}

.p-dialog .p-dialog-header {border-top-right-radius: 0.5rem;border-top-left-radius: 0.5rem;padding: 1rem;}
.p-dialog .p-dialog-content:last-of-type {border-bottom-right-radius: 0.5rem;border-bottom-left-radius: 0.5rem;padding: 0 1rem 1rem 1rem;}

.p-datepicker table td > span {width: 1.4rem;height: 1.4rem;}
.p-datepicker table td, .p-datepicker table th {text-align: left;padding: 0.2rem;}
.p-datepicker {padding: 0.2rem;}
.p-datepicker .p-datepicker-header {padding: 0rem;}
.p-calendar .p-datepicker-icon{top: 9px;}
.theme_btn{background-color: var(--primary_color);color: var(--su_white_color);border-radius: var(--border_radius_xxl);border: none;line-height: 1;}
.theme_btn1{color: var(--su_white_color);border-radius: var(--border_radius_xxl); border: none;line-height: 1;}
.theme_btn .p-button-label,.theme_btn1 .p-button-label{line-height: 1;}
.p-button-icon-right{margin-left: 5px;}
.border-1{border: 1px solid var(--su_text_06);}
.p-button.p-button-danger{border-radius: var(--border_radius_md);}
.p-button {padding: 11.3px 1rem;}
.child_card:hover{border: 1px solid var(--su_skyblue_300);box-shadow: rgb(222 222 222 / 20%) 0px 5px 20px;background-color: #effaff;}
.p-toast-message-content{align-items: center; gap: 10px;}
.p-message-wrapper{align-items: center;gap: 0.5rem;width: 100%;}
.p-message-wrapper .p-message-icon{height: 22px;}
.p-message .p-message-icon {font-size: 0.5rem;}
app-mmr-prescriptiondetails{height: 100%;overflow: hidden;display: flex;flex-direction: column;}
app-mmr-appointments{overflow-y: auto !important;}

.custom-img {
  width: 100%;
  height: 100%;
  object-fit: cover;     /* Ensures image fills the container without stretching */
  object-position: center; /* Centers the image */
  display: block;
  border-radius: 0.35rem;
}
.primary-btn{background-color: #3b82f6;}
.pt-profile{
     width: 100px;
    height: 100px;
   border-radius: 1.15rem;
    overflow: hidden;
    display: flex;
    flex-direction: column;

}

/*colors*/
.text-theme {color: var(--primary_color);}
.text-success{color: var(--su_green);}
.text-dark{color: #212529;}
.selected-border {border-color: #0000ff;background-color: #f2f2ff;}
.error{border: 1px solid #f44336 !important;}
.errorc .p-checkbox-box{border: 1px solid #f44336 !important;}
.error1>.p-calendar>input{border: 1px solid #f44336 !important;}
.error2 .p-dropdown {border: 1px solid #f44336 !important;}
.errorautocomplete {border: 1px solid #f44336 !important;}
/*end-colors*/

/* app-root,app-dashboardinfo,app-signup-screen,app-login-otp,app-add-child,app-investigation-report1,app-admin-details,app-favourites,app-successfully-added,app-bookingconfirmed-2,app-appointmentsdetails,app-appointment-summary,app-vaccine-card,app-prescriptions,app-investigation-reports,app-prescriptions-1,app-invoices-1,app-invoices,app-health-records,{display: flex;flex-direction: column;height: 100%;width: 100%; overflow: hidden;} */
app-root,app-dashboardinfo,app-mmr-mangechild,app-mmr-appointment-summary,app-signup-screen,app-login-otp,app-suvarna-signup,app-login,app-suvarna-login,app-suvarna-add-child,app-mmr-dashboard,app-suvarna-dashboard,app-mmr-main-dashboard,app-mmr-favourites,app-mmr-doctorprofile,app-mmr-doctorselection,app-mmr-successfully-added,app-add-child,app-mmr-appointments,app-mmr-prescriptionlist,app-mmr-investigationreports,app-mmr-healthrecords,app-mmr-invoices,app-mmr-vaccinecard,app-mmr-investigationdetails,app-mmr-invoicedetails{display: flex;flex-direction: column;height: 100%;width: 100%; overflow: hidden;}
/*header-component*/
.header_wrapper, .expand_view{background-color: var(--su_white_color);
padding: 12px 10px;
border-top: 5px solid transparent;
border-image: linear-gradient(90deg, #855796, #0A317C, #1199D4, #0B9625, #F5D82A, #DC7505, #E36298) 1;}
.h_leftside{}
.c-logo{height: 40px;}
.search_box{width: 40rem;}
.search_box input{border-radius: var(--border_radius_xxl);}
.h_rightside{}
.custom_btn{border: 1px solid var(--su_text_08);line-height: 1.3;font-weight: 500;cursor: pointer;padding: 8.3px 1rem;border-radius: var(--border_radius_xxl);}
.custom_btn:hover {color: var(--su_white_color);background-color: var(--primary_color);border-color: var(--primary_color);}
.icon i{font-size: 1.25rem;}
.header_mobile,.expand_view{display: none;}
.mobile_menu i{font-size: 28px;}
/*end-header-component*/
/*login-page*/
.left-panel {flex: 1;background: url(/assets/mmr/images/signup-bg.png) center / cover no-repeat;width: 100%;height: 100%;}
.left-panel1 {
    flex: 1;
    background: url(/assets/mmr/images/mother.png) center / cover no-repeat;
    width: 100%;
    height: 100%;
}
.login-div {width: 100%;max-width: 400px;padding: 20px;margin: auto;}
.or-container {display: flex;align-items: center;justify-content: center;}
.or-text {background: #E9E7F1;border-radius: 0.75rem;padding: 8px 10px;font-size: 14px;text-align: center;font-weight: 500;line-height: 1;}

.or-container::before,
.or-container::after {
    content: "";
    flex: 1;
    border-bottom: 1px solid #ccc;
}
/*end-login-page*/
/*page-body*/
.su_main_container{display: flex;flex-direction: column; height: 100%;overflow: hidden;}
.su_content_body {display: flex;flex-direction: column;height: 100%;overflow: hidden;width: 100%;padding: 0px 10px;}
.suv-subody {display: flex;overflow-y: auto;height: 100%;padding: 0px 5px;}
.img-fluid{
    max-width: 100%;
    height: auto;
    border-radius: 10px;
}
img{
    vertical-align: middle;
}
.suv-left {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
#pn_id_12 .p-carousel-item {
    flex: 1 0 32.4% !important;
}
.sidebar {
    background: var(--su_white_color);
    border: 1px solid var(--su_text_07);
    border-radius: var(--border_radius_xxl);
}
.profile {
    background-color: #E8F1FF;
    padding: 10px;
    border-radius: var(--border_radius_xxl) var(--border_radius_xxl) 0px 0px;
}

.list-group-item {
    border: none;
}
.list-group-item:hover {
    background: #bcbcbc;
    color: var(--su_white_color);
}
.list-group-item:first-child {
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}
.list-group-item.active {
    background: var(--primary_color) !important;
}
.list-group-item {
    border: none;
}
.suv-right {
    display: flex;
    height: 100%;
    flex-direction: column;
}
.card-custom {
    background: var(--su_white_color);
    padding: 15px;
    border-radius: var(--border_radius_xxl);
    border: 1px solid var(--su_text_07);
}
.card-custom h3 {
    padding-bottom: 10px !important;
}
.suvsmcard {
    padding: 10px;
        height: 82px;
    text-align: center;
    border-radius: 5px;
    border: 1px solid var(--su_text_08);
}
.date_hover1 {
    background-color: var(--su_text_02);
    border-radius: var(--border_radius_xl);
}
.add_child_card {
    box-shadow: rgb(222 222 222 / 20%) 0px 5px 20px;
}
.siv-doccard {
    border-radius: 10px;
}
.list-group-item:first-child {
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}
.list-group-item {
    border: none;
}
.list-group-item {
    position: relative;
    display: block;
    padding: 0.5rem 1rem;
    text-decoration: none;
}
.validate_btn{margin-top: 35.1px;}
.card-footer {
    background-color: #333333 !important;
}
.dailog_body,.dailog_footer{
    padding: 1rem 0rem;
}
.dailog_footer{
    padding: 1rem 0rem 0rem 0rem;
}

.date-active {
    background: var(--primary_color);
    color: #fff;
    text-align: center;
    border-radius: 5px;
}
.date_hover {
    border-radius: 5px;
    border: 1px solid var(--su_text_07);
}

.modal-body-contant {
    border: 1px solid #CCCCCC;
    padding: 10px;
}

.cus_badge{
color: var(--su_white_color);
display: inline-block;
padding: 6px 10px;
border-radius: var(--border_radius_xl);
line-height: 1;
    font-size: 14px;
}

.cus_badge1{
    color: var(--su_white_color);
    display: inline-block;
    padding: 6px 10px;
    border-radius: var(--border_radius_xl);
    line-height: 1;
    font-size: 14px;
    
    }

.su-download {
    padding: 3px 5px;
    border: 1px solid var(--primary_color);
    border-radius: 3px;
    color: var(--primary_color) !important;
    margin-right: 5px;
}

.su-download:hover {
    background-color: var(--primary_color);
    color: white !important;
    cursor: pointer;
}

.su-delete {
    padding: 3px 5px;
    border: 1px solid rgb(220 53 68);
    border-radius: 3px;
    color: rgb(220 53 68) !important;
}

.su-delete:hover {
    background-color: rgb(220 53 68);
    color: white !important;
    cursor: pointer;
}

.su-eye {
    padding: 3px 5px;
    border: 1px solid rgb(25 135 84);
    border-radius: 3px;
    color: rgb(25 135 84) !important;margin-right: 5px;
}

.su-eye:hover {
    background-color: rgb(25 135 84);
    color: white !important;
    cursor: pointer;
}
.su-file {
    padding: 3px 5px;
    border: 1px solid rgb(13 202 238);
    border-radius: 3px;
    color: rgb(13 202 238) !important;
}

.su-file:hover {
    background-color: rgb(13 202 238);
    color: white !important;
    cursor: pointer;
}
.val-div{height: 15px;}
.calendar-wrapper .p-calendar .p-inputtext{
    border-radius:   var(--border_radius_xl);
    cursor: pointer;
    }

    
.action_icons i{
    border: 1px solid var(--su_text_08);
    border-radius: var(--border_radius_md);
    padding: 4px;
}
.manage_child_wrapper{border: 1px solid var(--su_text_07);border-radius: var(--border_radius_xxl);}
/*end-page-body*/

/*table*/
.p-datatable .p-datatable-tbody > tr > td .p-inputtext{    padding: 0.15rem 0.15rem;}
.table-scroll-wrapper {flex: 1;overflow-y: auto;height: 100%;position: relative;}
:host ::ng-deep .p-datatable-scrollable-header {position: sticky !important;top: 0;z-index: 10;background: white;}
.card-custom-2 {background: white;padding: 0px 0px 0px 0px;border-radius: var(--border_radius_xl);border: 1px solid var(--su_text_07);overflow-x: auto;}
.table-radius tr:last-child td {border-bottom: none;}
.table-radius tr th:nth-child(1) {border-radius: 10px 0px 0px 0px;}
.table-radius tr th:last-child {border-radius: 0px 10px 0px 0px;}
.card-custom-2 .p-datatable .p-datatable-thead > tr > th {text-align: left;padding: 8px;border: 1px solid #e9ecef;border-width: 0 0 1px 0;font-weight: 500;color: var(--su_black_color);background: var(--su_white_color);transition: box-shadow 0.2s;}
.card-custom-2 .p-datatable .p-datatable-tbody > tr > th:nth-child(1) {border-radius: 10px 0px 0px 0px;text-align: left;padding: 8px;border: 1px solid #e9ecef;border-width: 0 0 1px 0;font-weight: 500;color: var(--su_black_color);
}
.card-custom-2 .p-datatable .p-datatable-tbody > tr > td {text-align: left;border: 1px solid #e9ecef;color: var(--su_black_color);border-width: 0 0 1px 0;padding: 8px;}
.p-datatable-tbody tr:hover{background-color: #d6ecff;}
/*end-table*/
/*table-footer*/
.p-paginator {
    background: none;
    padding: 0.5rem 1rem 0rem 1rem;
}
.p-paginator-pages{
    display: flex;
    gap: 0.3rem;
}
.p-paginator .p-paginator-first, .p-paginator .p-paginator-prev, .p-paginator .p-paginator-next, .p-paginator .p-paginator-last{
    min-width: 2rem;
    height: 2rem;
}
    ::ng-deep  .custom-paginator .p-paginator {
      justify-content: center;
      gap: 0.3rem;
      padding: 1rem 0;
    }
  
    .p-paginator-page
   {
      border: 1px solid #e0e0e0;
      background-color: white;
      color: #333;
      border-radius: 0.5rem;
      min-width: 2rem;
      height: 2rem;
      font-weight: 500;
      transition: all 0.2s ease;
    }
  
    .p-paginator-page.p-highlight {
      background-color: #2e2e2e;
      color: white;
      border: 1px solid #2e2e2e;
    }
  
    .p-paginator-element:disabled,
    .p-disabled {
      opacity: 0.4;
      pointer-events: none;
    }
  
    .p-paginator-icon {
      font-size: 1rem;
    }
  
  
/*table-end-footer*/

/*tabs*/
p-tabview,.p-tabview{display: flex;flex-direction: column;height: 100%;overflow: hidden;flex: 1;}
.custom_tab .p-tabview-panels{height: 100%;overflow: hidden;}
.custom_tab>.p-tabview-panels>.p-element{height: 100%;overflow: hidden;flex: 1;}
.custom_tab  .p-tabview-panel{height: 100%;overflow: hidden;flex: 1;}
.custom_tab .p-tabview .p-tabview-nav {background: none;border: none;border-width: 0px;width: 100%;overflow: auto;}
.custom_tab .p-tabview .p-tabview-nav li.p-highlight .p-tabview-nav-link {background: none;}
.custom_tab .p-tabview .p-tabview-nav li .p-tabview-nav-link {background: none;}
.custom_tab .p-tabview .p-tabview-nav li .p-tabview-nav-link {border-width: 0px;}
.custom_tab .p-tabview .p-tabview-panels {background: none;padding: 0px;}
.custom_tab .p-tabview .p-tabview-nav li .p-tabview-nav-link {padding: 0rem 0.5rem 0.5rem 0rem;text-wrap-mode: nowrap;}
/*tabs*/
.children_logo img{height: 250px;}

/*media-querier*/
@media only screen and (min-width: 1601px){
.children_logo img{height: 250px;}
}
@media only screen and (min-width: 1300px) and (max-width: 1600px){
    .children_logo img{height: 200px;}
}
@media only screen and (min-width: 1301px){
    .su_header{width: 90%;margin: auto;}
    .su_container{width: 90%;margin: 16px auto 5px auto;}
    .profile_wrapper{
        width: 90%;
        margin: auto !important;
    }
}
@media only screen and (max-width: 1300px){
    .su_container{padding: 10px;}
    .profile_wrapper{padding: 10px;}
}

@media only screen and (min-width: 1023px) and (max-width: 1300px){
.search_box {width: 30rem;}
}

@media only screen and (max-width: 1023px){
    .header_web{display: none;}
    .header_mobile,.expand_view{display: block;}
    .su_main_container{background-image: none !important;}
    .children_logo img{display: none;}
}
@media only screen and (min-width: 1024px) and (max-width: 1200px){
}

@media only screen and (min-width: 768px) and (max-width: 1023px){
    app-mmr-prescriptiondetails{height: 100%; overflow: auto; overflow-x: hidden;display: flex;flex-direction: column;}
}

@media only screen and (min-width: 576px) and (max-width: 767px){
}
@media only screen and (min-width: 576px){
    .custom_dailog{max-width: 600px; min-width: 500px; margin: auto;}
    .custom1_dailog{max-width: 300px; min-width: 400px; margin: auto;}

}
@media only screen and (max-width: 768px){
    h1{
        font-size: 1.6rem;
    }
    h2{
        font-size: 1.4rem;
    }
    h3{
        font-size: 1.2rem;
    }
    h4{
        font-size: 1rem;
    }
    h5{
        font-size: 0.8rem;
    }
    * {
        font-size: 13px;
    }
    .suv-header {
        padding: 10px 0px;
        gap: 5px;
    }
    .p-inputtext {
        padding: .275rem .75rem;
        line-height: 1;
    }
    .p-button {
        padding: 10px 6px;
    }
    .card-custom
    {
    padding: 8px;
    }
    :host ::ng-deep .input-icon .p-input-icon {
        top: 9px !important;
    }
  
}
@media only screen and (max-width: 767px){
    .signup_left {
        display: none;
    }


  
    .custom_dailog{margin: 0px 10px;}
    .custom1_dailog{margin: 0px 10px;}
   
}


@media only screen and (max-width: 575px){
    .validate_btn{margin-top: 5px;}
}

/*end-media-querier*/
.active_item {
    background: var(--primary_color) !important;
    color: var(--su_white_color);
    border: 1px solid var(--primary_color);
}

.icon_bg {
    background-color: var(--su_white_color);
    height: 33px;
    width: 33px;
    padding: 7px 10px;
    border-radius: 50%;
    margin: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}