﻿@charset "UTF-8";

:root {
    --palette-color-1: #8721c5; /*left-right menu background*/
    --palette-color-2: #791db1; /*left-right menu active item background*/
    --palette-color-3: #AB50E2; /*top navbar background*/
    --palette-color-4: #AB50E2; /*btn info ,btn primary background*/
    --palette-color-5: #791db1; /*btn info ,btn primary hover background*/
    --palette-color-6: #ff0505; /*btn danger ,btn warning background */
    --palette-color-7: #9e2b2a; /*btn danger ,btn warning hover background */
    --palette-color-8: #AB50E2; /*link color */
    --palette-color-9: #caecea;
    --palette-color-10: rgba(180, 233, 226, 0.60);
    --palette-color-11: #01676b; /*operation-menu-title*/
    --palette-color-12: rgb(230, 230, 230); /*toolbar-row*/
    --palette-color-13: #fff; /*nav li color*/
    --palette-color-14: #ecf0f5 /*table header*/;
    --palette-color-15: #FEFEFE /* Medica White */;
    --palette-color-16: #4B4B4B; /* Medica Black */
    --palette-color-17: #E4E5E7;
    --palette-color-18: #AB50E2; /* Medica Main Color */
    --palette-color-19: #DDFFE4; /* Medica Status Background Green */
    --palette-color-20: #37BF4D; /* Medica Status Color Green */
    --palette-color-21: #DDD; /* Medica Border Color */
    --palette-color-22: #FFFFFF;
    --palette-color-23: #848A95; /* Medica Minor Color */
    --palette-color-24: #F5E4FF; /* Medica Main Light Color */
    --palette-color-25: #f0e8f9; /* Medica Table background color Alternative - #faf8fd */
    --palette-color-26: #392F40; /*ახალი იისფერი ოდნავ გამუქებული ჰედერისთვის*/
    --palette-color-27: #302B34; /*ახალი იისფერი ოდნავ გამუქებული მარცხენა მენიუსთის*/
    --palette-color-28: #F1F1F1; /*ანაცრისფერი პალეტი თეიბლის ჰედერისთვის*/
    --palette-color-29: #E5BAFF; /* Medica Light border color */
    --palette-color-30: #3DCB2B; /* Medica Color Green*/
    --palette-color-31: #FDFAFF; /* Medica Color Light Purple */
    --palette-color-32: #4B4B4B; /* Text color */
    --palette-color-33: #FF594D; /* Medica Color Red */
    --palette-color-34: #F8F8F8; /* Grid header/alt colors */
    --palette-color-35: #AB50E2; /* ჩაწერილი */
    --palette-color-36: #f20426b0; /* შესრულებული */
    --palette-color-37: #9F9F9F; /* გადახდილი */
    --palette-color-38: #FF7E47; /* მოსული */
    --palette-color-39: #37BF4D; /* პროცესი */
    --palette-color-40: #23C0EB; /* კომუნიკაცია */
}


@font-face {
    font-family: "FiraGo";
    src: url("../fonts/FiraGO-Regular.ttf");
}

@font-face {
    font-family: "FiraGo-B";
    src: url("../fonts/FiraGO-Bold.ttf");
    font-weight: bold;
}





/* Noto-Fonts */
@font-face {
    font-family: 'NotoSansGeorgian-VF';
    /*src: url(../fonts/noto/NotoSansGeorgian-VariableFont.ttf);*/
		src: url(/static/wshf-sm/fonts_sm/Helvetica_Neue_LT_GEO_55_Nus_Regular.ttf);
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'NotoSansGeorgian-Regular';
    /*src: url(../fonts/noto/NotoSansGeorgian-Regular.ttf);*/
		src: url(/static/wshf-sm/fonts_sm/Helvetica_Neue_LT_GEO_55_Nus_Regular.ttf);
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'NotoSansGeorgian-Medium';
    /*src: url(../fonts/noto/NotoSansGeorgian-Medium.ttf);*/
		src: url(/static/wshf-sm/fonts_sm/Helvetica_Neue_LT_GEO_55_Nus_Regular.ttf);
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'NotoSansGeorgian-SemiBold';
    src: url(../fonts/noto/NotoSansGeorgian-SemiBold.ttf);
		/*src: url(/static/wshf-sm/fonts_sm/Helvetica_Neue_LT_GEO_55_Nus_Regular.ttf);*/
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



@font-face {
    font-family: 'NotoSansGeorgian-Bold';
    /*src: url(../fonts/noto/NotoSansGeorgian-Bold.ttf);*/
		src: url(/static/wshf-sm/fonts_sm/Helvetica_Neue_LT_GEO_55_Nus_Regular.ttf);
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
/* .Noto-Fonts */




 






/*:root {
    --palette-color-1: #09425a;  
    --palette-color-2: #072e3e;  
    --palette-color-3: #009abb; 
    --palette-color-4: #009abb;  
    --palette-color-5: #007d92;  
    --palette-color-6: #ff5956;  
    --palette-color-7: #9e2b2a;  
    --palette-color-8: #009abb;  
    --palette-color-9: #b8c7ce;
    --palette-color-10: rgba(0, 154, 187, 0.15);
    --palette-color-11: #09425a;  
    --palette-color-12: rgba(0, 154, 187, 0.05); 
}*/
* {
    outline: 0 !important;
}



select {
    cursor: pointer;
}

html, body {
    /*font-family: "FiraGo", sans-serif !important; */
    font-family: 'NotoSansGeorgian-VF';
    font-size: 15px !important;
    height: 100%;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'NotoSansGeorgian-VF';
}
strong {
    font-family: 'NotoSansGeorgian-VF';
}

.menu-block-height {
    height: calc(100% - 5px);
}

.menu-block-body-height {
    height: calc(100% - 41px);
}

.baselist-row-height {
   /* height: calc(100% - 80px); */
	height: 100%;
}

.baselist-height {
    /*height: calc(100% - 7px); */
	height: 100%;
}

.jqx-grid-cell-right-align {
    margin-right: 7px;
    overflow: visible;
}

.jqx-splitter {
    border: 0 !important;
}

 
.main-sidebar, #settings-sidebar {
    height: 100%;
}

.service-out {
    -webkit-box-shadow: 0px 0px 3px 0px rgba(184,184,184,1);
    -moz-box-shadow: 0px 0px 3px 0px rgba(184,184,184,1);
    box-shadow: 0px 0px 3px 0px rgba(184,184,184,1);
    margin-bottom: 0;
    padding: 10px;
}

.main-header .navbar-toggle {
    float: left;
}

.dropdown-menu {
    /*border-radius: 0;*/
    border-color: #DEDEDE;
	
	border-radius: 6px;   
	 
	/*max-height: 358px;*/
    overflow-y: auto; 
	 
	
	padding: 0px;  
	
	
	/*
    padding-left: 12px;
    padding-top: 12px;
    padding-bottom: 12px;
	*/
	
}
.dropdown-menu>li>a {
    display: block;
    padding: 10px 20px;
    clear: both;
    font-weight: 400;
    line-height: 20px;
    color: #4B4B4B;
    white-space: nowrap;
}

.dropdown-menu > li > a:hover{
    color: var(--palette-color-4)!important;
    background-color: #f5e4ff !important; 
}


.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover {
    color: #fff;
    text-decoration: none;
    background-color: #ab50e2;
}

/*
.modal-body {
    padding-top: 10px;
    padding-bottom: 10px;
}
*/

.modal-toolbar {
    padding: 5px;
    border-bottom: 1px solid #d7d7d7;
    min-height: 45px;
}

.close {
    margin-top: 1px;
    color: #fff;
    opacity: .9;
}

.close-icon {
    border: 1px solid #8B919C;
    border-radius: 6px;
    padding: 8px;
    color: #8B919C;
    height: 32px;
    width: 32px;
}

.modal-title {
    font-size: 17px;
    letter-spacing: 1px;
}

/*.btn-save {
    background-color: #27b787;
    color: #fff;
}

    .btn-save:hover {
        background-color: #32cf9b;
    }

    .btn-save:focus {
        background-color: #27b787;
    }

    .btn-save:active {
        background-color: #27b787;
    }

    .btn-save:hover:focus {
        background-color: #27b787;
    }*/

.right-dropdown-menu {
    float: right;
}

.dropdown-menu .divider {
    margin: 4px 0;
}

#single-button {
    float: right;
}

    #single-button i {
        color: var(--palette-color-4);
    }

.input-block {
    margin-bottom: 10px;
}

.input-block-label {
    font-weight: normal;
    font-size: 15px;
    margin-top: 6px;
    padding-right: 0;
    text-align: right;
}

.input-block-last {
    margin-bottom: 0;
}

.control-label {
    padding-top: 0 !important;
}

textarea {
     resize: vertical; 
	/*height: fit-content;*/
}

/*---*/


.insurance-label {
    /*padding: 2px;*/
    font-size: 13px;
    border: 1px solid #d9d9d9;
    background-color: #f5f5f5;
    border-radius: 3px;
    cursor: pointer;
    float: left;
    margin-right: 5px;
    padding: 7px;
}

.insurance-label-icon {
    color: #b9b9b9;
    font-size: 12px;
}

.insurance-label:hover {
    border-color: #b9b9b9;
}

.insurance-label-icon:hover {
    color: #9a9a9a;
}

.ng-aside {
    margin-top: 50px;
}

.sidebar-menu {
     /*height: 101%; */
	
	 background: #302b34;
	
     overflow-y: auto !important; 
	
	height: calc(100dvh - 120px);
 
 	border-right: 1px solid #302b34;
	
	
	padding-bottom: 20px;
	
	overflow-x: hidden !important; 
}
 

    .sidebar-menu::-webkit-scrollbar {
        width: 5px;
        /* background-color: #fefefe !important;*/
        padding: 5px;
    }

    .sidebar-menu::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background-color: #2c2531;
    }


    .sidebar-menu > li:not(.header) > a {
       /* padding: 9px 5px 9px 12px;*/
		
		 padding: 9px 15px 9px 12px;
    }

.header {
    font-size: 15px !important;
    font-weight: bold;
}

/* DATEPICKERS*/
.choices a {
    cursor: pointer;
}

.choices {
    left: -150% !important;
}

.toolbar-divider {
    height: 48px;
    width: 0px;
    /*margin: 0 1px;*/
    background-color: #ccc;
    display: inline-block;
    /* vertical-align: middle;*/
	 
}

.tree-node-content {
    margin: 1px;
    cursor: initial;
}

    .tree-node-content i {
        cursor: pointer;
    }

.tree-node {
    border: 1px solid #dae2ea;
    background: #f8faff;
    color: #7c9eb2;
}

.angular-ui-tree-handle {
    background: #f8faff;
    border: 1px solid #dae2ea;
    color: #7c9eb2;
    padding: 4px 4px;
}
/*
.basetree_toolbox {
    width: 255px;
    display: inline-block;
}
*/

.base_tree {
    border-top: 1px solid #dcdcdc;
    overflow-y: auto;
}

    .base_tree li {
        font-size: 15px;
        color: #585858;
    }

    .base_tree .jqx-widget-content, .base_tree #panelWrapperpaneljqxTree1 {
        background-color: #e6e6e6 !important;
    }



/* custom alert modals */
.bootbox {
    z-index: 9999;
}

.btn-ok, .btn-yes, .btn-no, .btn-cancel {
    width: 100px;
    border: 1px solid #979797;
}

    .btn-ok:hover, .btn-yes:hover, .btn-no:hover, .btn-cancel:hover {
        border: 1px solid #000;
        background-color: #cacaca;
    }
/* --- */



.custom-info-block {
    padding-top: 0;
    padding-bottom: 10px;
}



.table > tbody > tr:hover {
    cursor: pointer;
}

.remove-icon {
    opacity: .5;
}

    .remove-icon:hover {
        opacity: 1;
    }

.padding-right_0 {
    padding-right: 0;
}

.padding-left_0 {
    padding-left: 0;
}

.payment_header {
    background-color: #fcf8e3;
    color: #8a6d3b;
    padding: 10px;
    font-size: 15px;
}

.table tbody td {
    vertical-align: middle !important;
}

.schedules-times-table > tbody > tr > th div:first-child {
    margin-top: -10px;
}

.schedules-times-table > tbody > tr > th div {
    font-size: 15px;
    height: 42px;
}

/*
::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

::-webkit-scrollbar-button {
    width: 7px;
    height: 7px;
}

::-webkit-scrollbar-thumb {
    background: #E4E5E7;
}

::-webkit-scrollbar-corner {
    background: transparent;
}

*/

.form-group {
    margin-bottom: 5px !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
}

    .form-group > .btn {
        margin-bottom: 3px !important;
    }

.uib-tab, .uib-tab > a {
    border-radius: 0px !important;
}

    .uib-tab:hover, .uib-tab > a:hover {
        border-radius: 0px !important;
        border-color: transparent !important;
        background-color: transparent !important;
    }

.jqxStatusBar {
    background: #fff !important;
    border: none !important;
}

    .jqxStatusBar > div > div {
        /*background: #fff !important;*/
        border: none !important;
        line-height: 34px;
        vertical-align: middle;
    }

.jqx-grid-cell-alt {
    background-color: #F8F8F8;
}

.doc_height {
    min-height: 650px;
}

/* Vertical Tabset  */

/* custom inclusion of right, left and below tabs */

.tabs-left .tab-content {
    float: left;
    width: 75%;
}

.tabs-below > .nav-tabs,
.tabs-right > .nav-tabs,
.tabs-left > .nav-tabs {
    border-bottom: 0;
}

.tab-content > .tab-pane,
.pill-content > .pill-pane {
    display: none;
}

.tab-content > .active,
.pill-content > .active {
    display: block;
    position: relative;
}

.tabs-below > .nav-tabs {
    border-top: 1px solid #ddd;
}

    .tabs-below > .nav-tabs > li {
        margin-top: -1px;
        margin-bottom: 0;
    }

        .tabs-below > .nav-tabs > li > a {
            -webkit-border-radius: 0 0 4px 4px;
            -moz-border-radius: 0 0 4px 4px;
            border-radius: 0 0 4px 4px;
        }

            .tabs-below > .nav-tabs > li > a:hover,
            .tabs-below > .nav-tabs > li > a:focus {
                border-top-color: #ddd;
                border-bottom-color: transparent;
            }

    .tabs-below > .nav-tabs > .active > a,
    .tabs-below > .nav-tabs > .active > a:hover,
    .tabs-below > .nav-tabs > .active > a:focus {
        border-color: transparent #ddd #ddd #ddd;
    }

.tabs-left > .nav-tabs > li,
.tabs-right > .nav-tabs > li {
    float: none;
}

    .tabs-left > .nav-tabs > li > a,
    .tabs-right > .nav-tabs > li > a {
        min-width: 74px;
        margin-right: 0;
        margin-bottom: 3px;
    }

.tabs-left > .nav-tabs {
    float: left;
    /*margin-right: 19px;*/
    border-right: 1px solid #ddd;
    width: 25%;
}

    .tabs-left > .nav-tabs > li > a {
        margin-right: -1px;
        -webkit-border-radius: 4px 0 0 4px;
        -moz-border-radius: 4px 0 0 4px;
        border-radius: 4px 0 0 4px;
    }

        .tabs-left > .nav-tabs > li > a:hover,
        .tabs-left > .nav-tabs > li > a:focus {
            border-color: #eeeeee #dddddd #eeeeee #eeeeee;
        }

    .tabs-left > .nav-tabs .active > a,
    .tabs-left > .nav-tabs .active > a:hover,
    .tabs-left > .nav-tabs .active > a:focus {
        border-color: #ddd transparent #ddd #ddd;
        border-right-color: #ffffff;
    }

.tabs-right > .nav-tabs {
    float: right;
    margin-left: 19px;
    border-left: 1px solid #ddd;
}

    .tabs-right > .nav-tabs > li > a {
        margin-left: -1px;
        -webkit-border-radius: 0 4px 4px 0;
        -moz-border-radius: 0 4px 4px 0;
        border-radius: 0 4px 4px 0;
    }

        .tabs-right > .nav-tabs > li > a:hover,
        .tabs-right > .nav-tabs > li > a:focus {
            border-color: #eeeeee #eeeeee #eeeeee #dddddd;
        }

    .tabs-right > .nav-tabs .active > a,
    .tabs-right > .nav-tabs .active > a:hover,
    .tabs-right > .nav-tabs .active > a:focus {
        border-color: #ddd #ddd #ddd transparent;
        border-left-color: #ffffff;
    }

.input-group-sm > .form-control, .input-group-sm > .input-group-addon, .input-group-sm > .input-group-btn > .btn {
    border-radius: 0;
}

.form-control {
    font-size: 15px;
    border-color: var(--palette-color-21) !important;
    padding: 6px 8px;
}

    .form-control:focus {
        /*border-color: var(--palette-color-4) !important;*/
        box-shadow: none;
    }

.input-group-btn > .btn {
    background-color: var(--palette-color-4) !important;
    color: var(--palette-color-15) !important;
}

    .input-group-btn > .btn:hover {
        background-color: var(--palette-color-5) !important;
        color: var(--palette-color-15) !important;
    }

/**
 * Checkbox style
 */
.fina_checkbox, .fina_radio {
    position: relative;
    float: left;
    width: 30px;
}

.checkbox_label, .radio_label {
    float: left;
}

    .checkbox_label > label, .radio_label > label {
        font-weight: normal;
    }

.fina_checkbox label, .fina_radio label {
    cursor: pointer;
    position: absolute;
    width: 20px;
    height: 20px;
    top: 0;
    left: 0;
    background: var(--palette-color-8);
    color: white;
    border: 1px solid #ddd;
}

.fina_radio label {
    border-radius: 12px;
}

    .fina_checkbox label:after, .fina_radio label:after {
        opacity: 0;
        content: '';
        position: absolute;
        width: 10px;
        height: 6px;
        background: transparent;
        top: 5px;
        left: 5px;
        border: 3px solid #333;
        border-top: none;
        border-right: none;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    .fina_radio label:after {
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        transform: rotate(-90deg);
        width: 4px;
        height: 4px;
        border: 4px solid #333 !important;
        border-radius: 4px;
    }

    .fina_checkbox label:hover::after, .fina_radio label:hover::after {
        opacity: 0;
    }

.fina_checkbox input[type=checkbox]:checked + label:after, .fina_radio input[type=radio]:checked + label:after {
    opacity: 1;
}

.fina_checkbox > div, .fina_radio > div {
    float: right;
    margin-left: 10px;
    cursor: default;
}

.fina_checkbox input, .fina_radio input {
    margin: 4px !important;
}

.bottom-separator {
    border-bottom: 1px solid #ddd;
}

.report-parent-row__color {
    background-color: #D3D3D3;
}

/*
.operation-menu-title {
    font-size: 15px;
    margin-top: 10px;
    margin-bottom: 10px;
    line-height: 1.1;
    font-weight: 500;
}
*/

.base-search {
    /*width:300px;*/
}

.table-icon:before {
    /*content: "\f00a" !important;*/
}

.main-header .main-toggle:before {
    content: "\f00a";
}

.main-header .settings-toggle:before {
    content: "\f085";
}


/*-------------------- New FinaMedica Styles --------------------*/
/*.medical-modal-form {
    font-family: "Noto Sans Georgian", 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    padding: 0.4rem 1.2rem !important;
}*/
/*---------- Header ----------*/
/*.medica-modal-header {
    margin: 0.8rem 0;
}

.medica-modal-title {
    display: flex !important;
    align-items: baseline !important;
    font-weight: 600;
    font-size: 20px;
    color: var(--palette-color-16);
    width: 106% !important;
}

.medica-close-btn {
    border: 1px solid #8B919C;
    border-radius: 6px;
    padding: 8px;
    width: 32px;
    height: 32px;
    float: inline-end;
    margin: 0 1.2rem 0.8rem 0;
}

    .medica-close-btn a {
        padding: 0;
        margin: 0;
        display: flex;
        justify-content: center;
        cursor: pointer;
    }

.medical-modal-title-info {
    display: flex !important;
    align-items: center !important;
}
.medical-modal-title-status {
    height: 40px;
    width: 14em;
    background-color: var(--palette-color-19);
    border: 1px solid var(--palette-color-19);
    border-radius: 37px;
    vertical-align: baseline;
    padding: 7px 12px;
    font-weight: 600;
    font-size: 15px;
    color: var(--palette-color-20);
    text-align: center;
}

.medical-modal-title-frame {
    display: flex;
    justify-content: flex-end;
    padding-right: 0 !important;
    cursor: pointer;
}

.medical-modal-title-branch {
    margin: 0.8rem 0;
    display: flex;
    justify-content: flex-end;
    padding-right: 0 !important;
}

.medical-modal-title-branch select {
    border: none;
}*/

/*---------- New Visit Registration ----------*/

/*.medica-new-visit-time {
    font-weight: 400 !important;
    font-size: 15px;
    display: flex;
    vertical-align: baseline;
    padding: 1rem 0;
    padding-top: 1.6rem;
    border-top: 1px solid var(--palette-color-21);
}

    .medica-new-visit-time button {
        border: none;
        background: transparent;
    }

    .medica-new-visit-time input {
        margin: 0 0.6rem 0 0.8rem;
        border: none;
    }

    .medica-new-visit-time select {
        border: none;
    }

    .medica-new-visit-time label {
        font-weight: 400;
        font-size: 15px;
        padding: 8px;
        padding-left: 0;
    }

.medica-new-visit-service-picker {
    height: 48px;
    font-weight: 400 !important;
    font-size: 15px;
    border: 1px solid var(--palette-color-21);
    border-radius: 12px;
    margin: 0.8rem 0 !important;
    display: flex !important;
    align-items: center !important;
}

    .medica-new-visit-service-picker input{
        border:none;
    }

.medica-new-visit-time-element {
    border: 1px solid var(--palette-color-21);
    border-radius: 12px;
    padding: 0.6rem;
}

.custom-icon {
    display: flex;
    justify-content: end;
    padding: 0;
    margin: 0;
    width: fit-content !important;
}

.custom-icon-end {
    display: flex;
    padding: 0;
    margin: 0;
    width: fit-content !important;
    align-items: baseline;
    justify-items: end;
}

    .custom-icon-end img{
        margin-right: 12px;
    }

.sp-button {
    height: 48px;
    width: 20%;
    border: 1px solid var(--palette-color-18);
    border-radius: 4px;
    font-weight: 400;
    font-size: 15px;
    color: var(--palette-color-17);
    background-color: var(--palette-color-18);
    margin: 0.8rem 0 !important;
    padding: 0.5rem;
}

    .sp-button a{
        background-color: transparent;
        border: none;
        color: var(--palette-color-15);
    }

    .sp-button > i{
        color: var(--palette-color-15);
        margin: 0 1rem;
    }

.sp-button-cm {
    height: 48px;
    width: 20%;
    border: 1px solid var(--palette-color-18);
    border-radius: 4px;
    font-weight: 400;
    font-size: 15px;
    color: var(--palette-color-17);
    background-color: var(--palette-color-18);
    margin: 0.8rem 0 !important;
    padding: 0.5rem;
}

    .sp-button-cm a {
        background-color: transparent;
        border: none;
        color: var(--palette-color-15);
    }

    .sp-button-cm > i {
        color: var(--palette-color-15);
        margin: 0 1rem;
    }

    .btn-default:hover {
        background-color: transparent !important;
        border: none !important;
        color: var(--palette-color-15) !important;
    }

.open > .dropdown-toggle.btn-default {
    color: var(--palette-color-15);
    background-color: transparent !important;
    border-color: transparent !important;
}

.open > .dropdown-toggle.btn-default:hover {
    color: var(--palette-color-15);
    background-color: transparent !important;
    border-color: transparent !important;
}

.col-md-10-custom-width {
    width: 90% !important;
}

.pl-0 {
    padding-left: 0 !important;
}

pr-0{
    padding-right: 0 !important;
}

.ml-0{
    margin-left: 0 !important;
}

.mr-0{
    margin-right: 0 !important;
}
}*/

.frame-xl {
    height: 48px;
    width: 48px;
}

.frame-lg {
    height: 32px;
    width: 32px;
}

.frame-ml {
    height: 28px;
    width: 28px;
}

.frame-md {
    height: 24px;
    width: 24px;
}

.frame-sm {
    height: 18px;
    width: 18px;
}

.frame-xs {
    height: 16px;
    width: 16px;
}

.styled-input-group {
    /*
    position: relative;
    margin: 10px 0;

    height: 46px; 
    border: 1px solid #ddd;

    border-radius: 5px;
    padding: 8px 0 4px 0;
    */

    position: relative;
    margin: 10px 0;
    height: 48px;
    border: 1px solid #ddd;
    border-radius: 5px;
    /* padding: 8px 0 4px 0; */

    padding-left: 12px;
    padding-right: 8px;
    padding-top: 8px;
    padding-bottom: 8px;

    display: inline-flex;
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.styled-input-warning-group {
    position: relative;
    margin: 10px 0;
    border: 1px solid var(--palette-color-6) !important;
    border-radius: 5px;
    /* padding: 8px 0 4px 0; */
}

    .styled-input-warning-group > .label-text {
        position: absolute;
        top: -10px;
        left: 12px;
        background: #fff;
        padding: 0 5px;
        color: var(--palette-color-6) !important;
        font-size: 12px;
        font-weight: 400;
        z-index: 2;
        width: fit-content !important;
    }

    .styled-input-group input {
        border: none;
        padding: 6px 0 4px 0;
        font-size: 15px !important;
        color: var(--palette-color-16) !important;
        font-weight: 400 !important;
    }


.label-text {
    position: absolute;
    top: -10px;
    left: 12px;
    background: #fff;
    padding: 0 5px;
    color: var(--palette-color-16);
    /*font-size: 15px;*/
    font-size: 12px; 
    font-weight: 400;
    z-index: 2;
    width: fit-content !important;
} 

.styled-input-group.has-error label {
    color: #dd4b39;
}
.styled-input-group.has-error .label-text {
    color: #dd4b39;
}


.medica-footer {
    padding: 10px 18px;
    padding-bottom: 18px;
    min-height: 45px;
    margin-top: 35px;
}

.btn-medica-save {
    background-color: var(--palette-color-18);
    border: none;
    border-radius: 8px;
    font-weight: 500;
    font-size: 16px;
    text-align: center;
    color: var(--palette-color-22);
    height: 48px !important;
    width: 100%;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}
    .btn-medica-save:hover {
        background-color: #963FCC;
    }


.btn-medica-save[disabled]{
	background-color: #E5BAFF;
	 cursor: default;
}


    .btn-medica-transparent {
        background-color: transparent;
        border: 1px solid var(--palette-color-18);
        border-radius: 8px;
        font-weight: 400;
        font-size: 15px;
        text-align: center;
        color: var(--palette-color-18);
        height: 36px !important;
        cursor: pointer;
        padding: 2px 20px;
    }

.btn-medica-save-white {
    background-color: var(--palette-color-15);
    border: 1px solid var(--palette-color-18);
    border-radius: 8px; 
    font-size: 16px;
	font-weight: 500;
    text-align: center;
    color: var(--palette-color-18);
    height: 48px !important;
    width: 100%;
    cursor: pointer;
	
	transition: all 0.3s ease;
}

.btn-medica-save-white[disabled] {
    cursor: default;
	border: 1px solid #E5BAFF;
	color: #E5BAFF;
}


.btn-medica-save-white:hover { border: 1px solid #E5BAFF; }

.suffix-price-center {
    position: absolute;
    right: 35% !important;
    top: 43%;
    transform: translateY(-42%);
    pointer-events: none;
    color: #333;
}

.suffix-price-start {
    position: absolute;
    right: 66% !important;
    top: 45%;
    transform: translateY(-42%);
    pointer-events: none;
    color: #333;
}


.suffix-time {
    position: absolute;
    right: 33% !important;
    top: 49%;
    transform: translateY(-42%);
    pointer-events: none;
    color: #333;
}

.styled-img-group {
    position: relative;
    margin: 10px 0;
    padding: 0;
}

/*---------- Info ----------*/
/*.main-information {
    border: 1px solid var(--palette-color-21);
    border-radius: 6px;
    font-weight: 400;
    font-size: 15px;
    padding: 18px 0;
    margin: 0.8rem 0 !important;
    width: 100%;
    box-shadow: 0px 4px 12px 0px #0000000A;
    color: var(--palette-color-16);
}*/

/*---------- Medica Medica ----------*/
/*@media(max-width:992px) {
    .medica-modal-title {
        width: 192% !important;
    }

    .sp-button-cm {
        margin: 0.8rem 0 !important;
    }
}*/

@media (max-width:1360px) {
    .navbar-img li a {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .main-header > .logo {
        height: 98px !important;
    }
}

@media (max-width: 960px) {
    .main-header .navbar {
        margin-left: 0px !important;
    }
}


.main-header {

	max-height: 102px !important;
    background-color: var(--palette-color-26) !important;
    height: 102px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
	
}

@media (max-width: 767px) {
	/*
    .operation-menu-title {
        font-size: 15px;
        margin-top: 15px;
        text-align: center;
    }
	*/
	
    .main-menu {
        display: none;
        margin-left: 0 !important;
    }

    .main-header .sidebar-toggle {
        display: block !important;
    }
	
	/*

    .content-wrapper {
        height: calc(100% - 50px);
        padding-top: 5px !important;
    }
	*/

    .main-sidebar, #settings-sidebar {
        height: calc(100% - 5px);
        padding-top: 50px !important;
    }

    .baselist-row-height {
        height: calc(100% - 113px);
        overflow-y: auto;
    }

    .text-sm-center {
        text-align: center;
    }

    .dashboard-sm-filter {
        float: none !important;
    }

        .dashboard-sm-filter .input-group {
            margin-bottom: 2px !important;
        }

        .dashboard-sm-filter button.btn-flat {
            width: 100%;
        }

        .dashboard-sm-filter div[name="timepicker"].datetimepicker-wrapper {
            display: none !important;
        }

        .dashboard-sm-filter .search {
            float: none !important;
            margin-bottom: 2px !important;
            margin-right: 0 !important;
        }

        .dashboard-sm-filter .export-button {
            display: none;
        }

        .dashboard-sm-filter .filter-dynamic-controls {
            float: none !important;
        }

            .dashboard-sm-filter .filter-dynamic-controls .right-margin {
                margin-right: 0 !important;
            }
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
    .text-sm-center {
        text-align: center;
    }

    .dashboard-sm-filter {
        float: none !important;
    }

        .dashboard-sm-filter .input-group {
            margin-bottom: 2px !important;
        }

        .dashboard-sm-filter button.btn-flat {
            width: 100%;
        }

        .dashboard-sm-filter div[name="timepicker"].datetimepicker-wrapper {
            display: none !important;
        }

        .dashboard-sm-filter .search {
            float: none !important;
            margin-bottom: 2px !important;
            margin-right: 0 !important;
        }


        .dashboard-sm-filter .filter-dynamic-controls {
            float: none !important;
        }

            .dashboard-sm-filter .filter-dynamic-controls .right-margin {
                margin-right: 0 !important;
            }
}

@media (min-width: 992px) {
	/*
    .operation-menu-title {
        font-size: 17px;
    }
	*/

    .datepickers {
        width: 340px;
    }

    .datetimepicker-wrapper > input {
        width: 110px !important;
    }

    .settings-size {
        font-size: 24px;
    }
}

@media (min-width: 1200px) {
 

    .datepickers {
        width: 450px;
    }

    .datetimepicker-wrapper > input {
        width: 110px !important;
    }

    .settings-size {
        font-size: 24px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .settings-size, .sidebar-toggle {
        font-size: 24px;
    }
	/*
    .operation-menu-title {
        text-align: center !important;
    }
	*/
}

/* Notifications */
.jqx-notification-container {
    z-index: 2000000;
}

.picture_upload_block {
    border: 1px solid var(--palette-color-18);
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--palette-color-18);
    height: 120px;
    border-radius: 6px;
    cursor: pointer;
    width: 160px;
    justify-content: space-evenly;
}

    .picture_upload_block:hover {
        border: 1px solid var(--palette-color-18);
    }

    .picture_upload_block small {
		font-size: 14px;
		font-weight: 400;
		text-align: center;
		line-height: 15px;
		padding: 1px;
    }

        .picture_upload_block:hover i {
            color: var(--palette-color-18) !important;
        }

        .picture_upload_block:hover small {
            color: var(--palette-color-18) !important;
            text-decoration: underline;
        }

.picture_upload_remove_image {
    cursor: pointer;
    position: absolute;
    top: 5px;
    right: 5px;
    display: none;
    border-radius: 1px;
    width: 20px;
    height: 20px;
    background-color: black;
    text-align: center;
}

    .picture_upload_remove_image > i {
        color: #fff;
    }

.picture_upload_image_block {
    display: table;
    width: 160px;
    height: 120px;
    margin: 0px 41px 12px 0px;
}


    .picture_upload_image_block img {
        width: 160px;
        height: 120px;
        border: none;
        border-radius: 6px;
    }

    .picture_upload_image_block:hover .picture_upload_remove_image {
        display: block;
        margin-top: 5px;
    }

    .picture_upload_remove_image {
        cursor: pointer;
        position: absolute;
        top: 0px;
        right: 15px;
        display: none;
        border-radius: 1px;
        width: 20px;
        height: 20px;
        background-color: black;
        text-align: center;
    }

.head_menu_img {
    height: auto !important;
}

.small-box h3 {
    font-size: 30px;
}

.control-sidebar-menu {
    padding: 0px 15px !important;
}

.control-sidebar-heading {
    color: #4b646f;
    font-weight: bold;
    background: #1a2226;
    padding: 10px 15px !important;
    margin-bottom: 0 !important;
}

input[type="password"].jqx-input-bootstrap, input[type="password"].jqx-widget-content-bootstrap, input[type="textarea"].jqx-widget-content-bootstrap, textarea.jqx-input-bootstrap {
    padding-left: 12px !important;
}

.jqx-rc-all-bootstrap {
    border-radius: 0px !important;
}

.jqx-input-bootstrap:focus {
    border-color: var(--palette-color-3) !important;
}

.datetimepicker-wrapper .form-group {
    margin-bottom: 0 !important;
}




.jqx-menu-wrapper {
    z-index: 1100 !important;
}

input[type='checkbox'] {
    cursor: pointer;
}

.settings-checkbox-label {
    color: var(--palette-color-3) !important;
   /*
	margin-top: -5px;
    margin-bottom: -5px;*/
	 
	margin-bottom: 5px;
    font-family: 'NotoSansGeorgian-SemiBold';
}

.settings-checkbox-sublabel {
    color: #93969F;
    font-size: 14px;
    font-weight: normal;
    font-style: italic;
    margin-top: -2px;
    margin-bottom: -5px;
}

.settings-row-bottom {
     border-bottom: 1px solid #D9D9D9; 
	        box-shadow: 0px 4px 16px 0px #0000000F;
}



/*   


*/

.skin-blue .sidebar-menu > li > a, .control-sidebar-dark .control-sidebar-menu > li > a {
    color: var(--palette-color-13) !important;
	
	font-size: 14px;
}
 /*
.skin-blue .wrapper, .skin-blue .main-sidebar, .skin-blue .left-side, .control-sidebar-dark, .control-sidebar-dark + .control-sidebar-bg {
   background-color: var(--palette-color-27) !important; 
	 
}
*/

.skin-blue .wrapper {
	background: #fefefe;
}
 .skin-blue .main-sidebar, .skin-blue .left-side, .control-sidebar-dark, .control-sidebar-dark + .control-sidebar-bg {
   background-color: var(--palette-color-27) !important; 
	 
}

    .skin-blue .sidebar-menu > li:hover > a, .skin-blue .sidebar-menu > li.active > a, .control-sidebar-dark .control-sidebar-menu > li > a:hover {
        color: #fff !important;
        background: var(--palette-color-2) !important;
        border-left-color: var(--palette-color-1) !important;
    }

.control-sidebar-heading {
    color: var(--palette-color-9) !important;
    font-weight: bold;
    background: var(--palette-color-1) !important;
    padding: 10px 15px !important;
    margin-bottom: 0 !important;
}

.skin-blue .sidebar-menu > li.header {
    color: var(--palette-color-13) !important;
    font-weight: normal !important;
    background: var(--palette-color-26) !important;
    border-bottom: 1px solid var(--palette-color-26);
    margin-top: 25px;
}

.btn {
    transition: background-color 0.3s ease-in-out !important;
    transition: color 0.2s ease-in-out !important;
    transition: border-color 0.2s ease ease-in-out !important;
    border-radius: 0px !important;
    margin: 0 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    height: 34px;
}

.skin-blue .main-header .navbar {
    background-color: var(--palette-color-26) !important;
    border-color: var(--palette-color-26) !important;
}


.btn-primary, .btn-info, .btn-success, .popover-title, .btn.btn-success.btn-lg.btn-flat {
    background-color: var(--palette-color-4) !important;
    border-color: var(--palette-color-4) !important;
    border-radius: 8px !important;
    font-size: 13px !important;
}


    .btn-primary:hover, .btn-info:hover, .btn-success:hover, .btn.btn-success.btn-lg.btn-flat:hover {
        background-color: var(--palette-color-5) !important;
        border-color: var(--palette-color-5) !important;
    }

::-webkit-scrollbar-thumb {
    /*background: var(--palette-color-17) !important;*/
}

.jqx-progressbar-value-bootstrap, .jqx-splitter-collapse-button-horizontal-bootstrap,
.jqx-splitter-collapse-button-vertical-bootstrap, .jqx-progressbar-value-vertical-bootstrap {
    background-color: var(--palette-color-3) !important;
}

.control-sidebar-heading {
    color: var(--palette-color-9) !important;
    font-weight: normal !important;
    background: var(--palette-color-2) !important;
}


a {
    color: var(--palette-color-8);
}

#single-button i, .patient-item-heading, .settings-checkbox-label {
    color: var(--palette-color-15);
}

.btn-danger, .btn-warning {
    background-color: var(--palette-color-6) !important;
    border-color: var(--palette-color-6) !important;
    border-radius: 6px !important;
    height: 34px;
    font-size: 13px;
}

    .btn-danger:hover, .btn-warning:hover {
        background-color: var(--palette-color-7) !important;
        border-color: var(--palette-color-7) !important;
    }


.skin-blue .main-header .logo {
    background-color: var(--palette-color-26) !important;
}

.skin-blue .main-header .navbar .sidebar-toggle:hover {
    background: rgba(0,0,0,0.1) !important;
}

div .jqx-listitem-state-selected-bootstrap,
div .jqx-menu-item-selected-bootstrap, 
div .jqx-calendar-cell-selected-bootstrap,
div .jqx-grid-cell-selected-bootstrap,
div .jqx-menu-vertical-bootstrap .jqx-menu-item-top-selected-bootstrap,
div .jqx-grid-selectionarea-bootstrap {
    color: #ab50e2 !important;
    background-color: #f5e4ff !important;
    border-color: #f5e4ff !important;
 
     
}


div .label-primary, div .label-info, div .label-success {
    background-color: var(--palette-color-4) !important;
    color: #ffffff !important;
    border-radius: 0px !important;
    font-size: 15px !important;
    font-weight: normal !important;
}

div .label-warning, div .label-danger {
    --background-color: var(--palette-color-6) !important;
    color: #ffffff !important;
    border-radius: 25px !important;
    font-size: 12px !important;
    font-weight: 100 !important;
    padding: 2px 12px 3px 12px;
    line-height: 12px;
    border: none;
	
}

.jqx-widget-header .jqx-widget-header-bootstrap .jqx-grid-header .jqx-grid-header-bootstrap
{
    border-bottom: 0px;
}

.days li a.checked {
    background-color: var(--palette-color-18) !important;
}

.specialities li.active {
    background-color: var(--palette-color-4) !important;
}

.panel-primary > .panel-heading {
    background-color: var(--palette-color-4) !important;
    border-color: var(--palette-color-4) !important;
    border-radius: 0px !important;
    font-size: 15px !important;
}

.panel.panel-primary {
    border-color: var(--palette-color-10) !important;
}

/*
.list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover, .patient-item:hover {
    background-color: var(--palette-color-10) !important;
}
*/

.staffs > .list-group-item.active {
    background-color: var(--palette-color-3) !important;
}

.list-group-item {
    position: relative;
    display: block;
    padding: 10px 15px;
    margin-bottom: -1px;
    background-color: transparent !important;
    border: 1px solid transparent !important;
}

.custom-info-block-base {
    background-color: var(--palette-color-10) !important;
    color: var(--palette-color-11) !important;
    border: none !important;
    padding: 10px !important;
}

.custom-info-block-base-new {
    background-color: transparent !important;
    color: var(--palette-color-16) !important;
    border: 1px solid #CCCCCC !important;
    border-radius: 6px !important;
    padding: 10px !important;
    box-shadow: 0px 4px 12px 0px #0000000A !important;
}

.list-group-item-heading.patient-item-heading {
    color: var(--palette-color-11) !important;
}

.patient-item-code, .birthdate {
    color: #3f3f46 !important;
}



.jqx-widget-header-bootstrap {
    border-bottom: 0px;
    /*background-color: rgba(64, 204, 221, 0.30) !important;*/
}


.tabs li.active {
    background-color: var(--palette-color-4) !important;
}

#info-table tr td:first-child {
    background-color: var(--palette-color-10) !important;
    color: var(--palette-color-11) !important;
    font-weight: normal !important;
}

/*
.operation-menu-title {
    color: var(--palette-color-11) !important;
}
*/

/*

.toolbar-row { 
    background-color: #fefefe!important;
}
*/

.jqx-fill-state-pressed-office, .jqx-fill-state-hover-office, .jqx-fill-state-hover {
    /*border-color: var(--palette-color-4) !important;
    background: var(--palette-color-4) !important;
    color: var(--palette-color-15) !important;*/
    color: var(--palette-color-18) !important;
    background-color: var(--palette-color-24) !important;
    border-color: var(--palette-color-24) !important;
}

.jqx-combobox-arrow-normal {
    border-color: transparent !important;
    background: transparent !important;
    color: var(--palette-color-15) !important;
}

.popover {
    font-family: 'NotoSansGeorgian-VF' !important;
    border-top: none !important;
}

    /* .popover > .arrow:after {
        border-bottom-color: transparent !important;
    } */

.page-header {
    margin-top: 0px !important;
    margin-bottom: 5px !important;
    font-size: 16px !important;
    /*font-family: "FiraGo", sans-serif !important;*/
    font-family: 'NotoSansGeorgian-VF';

    font-weight: 400 !important;
}

.popover-title {
    background-color: var(--palette-color-3) !important;
}

.btn.btn-link:hover {
    cursor: pointer !important;
}

.btn-link {
    border: none !important;
    color: var(--palette-color-18) !important;
}



    .btn-link:hover, .btn-link:focus {
        text-decoration: none !important;
        border: none !important;
        box-shadow: none !important;
        background-color: transparent !important;
        /*color: var(--palette-color-11) !important;*/
    }

/*.btn-default {
    background-color: var(--palette-color-4) !important;
    color: var(--palette-color-15) !important;
    border-color: var(--palette-color-4) !important;
}


    .btn-default:hover, .btn-default:focus .btn-default:active {
        background-color: var(--palette-color-5) !important;
        color: var(--palette-color-15) !important;
        border-color: var(--palette-color-5) !important;
    }*/

/*



.jqx-grid-column-header.jqx-grid-column-header-bootstrap.jqx-widget-header.jqx-widget-header-bootstrap {
    background-color: var(--palette-color-28) !important;
    color: var(--palette-color-16) !important;
    font-weight: 500;
    border: none;

    
}
*/


.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.list-group#patient_list {
    margin-bottom: 20px;
}


.row:not(tr) {
    margin-left: -10px;
    margin-right: -10px;
    display: block;
}


.patient-item {
	/*
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
	*/
}

.jqx-combobox-arrow-normal {
    border-radius: 0px !important;
}

.cal-one1 > .month1 {
    background-color: transparent !important;
}

.duration-dropdown li a {
    padding: 6px 0px !important;
}


.duration-dropdown > ul.dropdown-menu {
    min-width: 50px !important;
    width: 57px !important;
    padding: 0px !important;
}

    .duration-dropdown > ul.dropdown-menu > li > a {
        color: white !important;
    }

a.btn.btn-primary.active, .btn.btn-primary.duration-dropdown.dropdown.active {
    background-color: var(--palette-color-5) !important;
}

.label-success {
    background-color: var(--palette-color-8);
}

/*Medica*/
.modal-main-header {
    padding: 20px 20px 0 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}

.modal-content {
    border-radius: 12px !important;
}

.modal-medica-title {
    font-weight: 500;
    font-size: 18px;
    line-height: 27.2px;
    color: var(--palette-color-16);
	
	font-family: 'NotoSansGeorgian-SemiBold' !important;
}

.modal-medica-body {
     padding: 10px 18px;     
    color: var(--palette-color-16);
}

.medica-toolbar {
    padding: 20px 18px;
    min-height: 45px;
}

.medica-input-elements {
    padding: 10px 0;
}

.medica-nav > ul {
    border: none !important;
}

    .medica-nav > ul > li {
        border: none !important;
    }

        .medica-nav > ul > li > a {
            /* color: var(--palette-color-23) !important;*/
            /*font-weight: 500 !important;*/


            font-family: 'NotoSansGeorgian-Medium';

            color: var(--palette-color-23) !important;
            font-size: 17px !important;
            cursor: pointer !important;
            background-color: transparent !important;
            border: none !important;
            padding: 10px 10px 10px 0 !important;
            margin-bottom: 20px !important;
        }

        .medica-nav > ul > li.active > a,
        .medica-nav > ul > li.active > a:focus,
        .medica-nav > ul > li.active > a:hover {
            /*color: var(--palette-color-18) !important;*/
            /*font-weight: 500 !important;*/

            font-family: 'NotoSansGeorgian-SemiBold';
            color: var(--palette-color-18) !important;
            font-size: 17px !important;
            cursor: default !important;
            background-color: var(--palette-color-22) !important;
            border-color: transparent !important;
            border-bottom: 2px solid var(--palette-color-18) !important;
            padding: 10px 10px 10px 0 !important;
            /*width: 60% !important;*/

            width: calc(100% - 25px);
        }

 

        .medica-nav > .nav-tabs {
            display: flex;
            flex-direction: row;
/*            flex-wrap: wrap;*/
        }


.tag {
    margin: 2px;
    border: 1px solid var(--palette-color-18);
    border-radius: 32px;
    padding: 4px 12px;
    color: var(--palette-color-18);
    cursor: pointer;
}

    .tag a {
        color: var(--palette-color-18);
        margin-left: 6px;
    }


.custom-addon {
    border: none !important;
}

.custom-empty-addon {
    border: none !important;
    padding: 6px 8px !important;
}

.custom-addon-select {
    border: none !important;
    padding-left: 0 !important;
}

.custom-addon-select-p {
    border: none !important;
    padding-left: 10px !important;
}

.medica-checkbox {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    justify-content: flex-start !important;
    margin: 4px 0 !important;
}

.medica-checkbox-input {
    height: 24px;
    width: 24px;
}

    .medica-checkbox > input[type="checkbox"] {
        border-radius: 6px !important;
        border-color: var(--palette-color-21) !important;
        margin: 0;
        height: 20px;
        width: 20px;
        accent-color: var(--palette-color-18) !important;
    }

.medica-checkbox-label {
    display: inline-block !important;
    font-weight: 400 !important;
    font-size: 15px !important;
    margin-top: 4px !important;
    color: var(--palette-color-16) !important;
}

.modal-main-subheader {
    padding: 10px 20px 0 20px;
}

.subheader-branch {
    display: flex;
    flex-direction: row-reverse;
}

    .subheader-branch > select {
        border: none;
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        height: 40px;
        width: 150px;
    }

.subheader-status {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-left: 12px;
	padding-right: 12px;
    font-size: 15px;
    border-radius: 38px;
    height: 32px;
    min-width: 150px;
    font-weight: 500;
}

.subheader-icons {
    display: flex;
    height: 40px;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.subheader-dropdown-menu{

}

.client-info-left {
    /*border-right: 1px solid var(--palette-color-21) !important;*/
}

    .client-info-left > .row {
        margin: 10px 0;
    }

.client-picture {
    display: flex;
    align-items: center;
    border-radius: 38px;
    background-color: var(--palette-color-24);
    height: 34px;
    width: 34px;
}

    .client-picture > img {
        margin: auto;
    }

.client-search-frame {
    height: 48px;
    display: flex;
    align-items: center;
}

.medica-search-element {
    display: flex;
    border: none;
    align-items: center;
    left: 10px;
}

    .medica-search-element > input {
        border: none;
        height: 48px;
    }

.medica-default-selector-element {
    display: flex;
    border: none;
    align-items: center;
}

    .medica-default-selector-element > input {
        border: none;
        height: 48px;
    }

    .client-create {
        height: 48px;
        display: flex;
        align-items: center;
    }

.client-find-label{
    border: 1px solid var(--palette-color-21);
    border-radius: 6px;
}

/*
.client-personal-note {
    border: none;
}

    .client-personal-note:focus {
        border: none;
    }

*/

.client-main-info {
    border: 1px solid var(--palette-color-21);
    border-radius: 6px;
    padding: 0;
    margin: 0 10px;
    width: 98%;
    color: var(--palette-color-16);
    font-weight: 400;
    font-size: 16px;
}

.selected-patient-info {
    display: flex;
    font-size: 18px;
    color: var(--palette-color-16);
    font-weight: 500;
    height: 48px;
    align-items: center;
}

/*
.selected-patient-phone {
    font-weight: 400;
    font-size: 15px;
    padding-left: 8px;
}
*/

.client-info-right {
    border-left: 1px solid var(--palette-color-21) !important;
}

.client-info-right > div {
    margin: 5px 0;
}

    .client-info-right > div > div > div {
        margin: 5px 0;
    }

.green-paragraph{
    color: var(--palette-color-20);
    font-weight: 500;
	font-size: 14px; line-height: 15px;
}

.purple-paragraph {
    color: var(--palette-color-18);
    font-weight: 500;
	font-size: 14px; line-height: 15px;
}

.visit-note {
    display: flex;
    align-items: center;
    margin: 10px 0px;
    border: 1px solid var(--palette-color-21);
    border-radius: 6px;
    height: 48px;
    padding: 0 10px;
}

    .visit-note textarea {
        border: none;
    }

.bordered-element {
    border: 1px solid var(--palette-color-21);
    border-radius: 6px;
}

.service-button {
    height: 48px;
    background-color: var(--palette-color-18);
    color: var(--palette-color-15);
    font-weight: 400;
    font-size: 15px;
    width: 180px;
    display: flex;
    margin: auto;
    align-items: center;
    left: 10px;
    border-radius: 6px;
    justify-content: flex-end;
}

    .service-button > a {
        background: var(--palette-color-18) !important;
        border: var(--palette-color-18) !important;
        color: var(--palette-color-15) !important;
    }

    .service-button a:hover,
    .service-button a:active,
    .service-button a:focus {
        background: var(--palette-color-18) !important;
        border: var(--palette-color-18) !important;
        color: var(--palette-color-15) !important;
    }

            .service-button a > i {
                padding: 0px 24px;
            }

.service-list-headers {
    padding: 10px 2px;
    margin: 10px 0;
    background-color: #F8F8F8;
    font-size: 15px;
    color: #4B4B4B;
    font-weight: 500;
}

    .service-list-headers div:not(:first-child) {
        display: flex;
        justify-content: center;
    }

    .service-list-headers div:last-child{
        display: flex;
        justify-content: end;
    }

.doctor-name-element {
    border: 1px solid var(--palette-color-18);
    padding: 0px 12px;
    display: inline-flex;
    border-radius: 25px;
    color: var(--palette-color-16);
    font-size: 15px;
	line-height: 17px;
    font-weight: 400;
    min-height: 27px;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
	
	background: #fff;
}

    .doctor-name-element:hover, .doctor-name-element:active, .doctor-name-element:focus {
        color: var(--palette-color-16);
    }

.medica-payment-info > div {
    display: flex;
    justify-content: flex-end;
    height: 32px;
}

.medica-info-label{
    color: var(--palette-color-18);
    margin-top: 10px;
}

.medica-temp-image {
    border: 1px solid var(--palette-color-18);
    border-radius: 8px;
    height: 200px;
    width: 205px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin-top: 10px;
}

    .medica-temp-image > img {
        width: 205px;
        height: 200px;
        border-radius: 8px;
        border: 1px solid var(--palette-color-18);
    }

.medica-image-remove {
    position: absolute;
    top: 0px;
    width: inherit;
    display: flex;
    justify-content: flex-end;
    padding: 18px 6px;
}

.medica-picture {
    display: flex;
    flex-direction: row-reverse;
}

.prices-btn {
    background-color: #AB50E2;
    height: 48px;
    text-align: center;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

    .prices-btn a {
        color: #FFFFFF;
        font-size: 16px;
        font-weight: 500;
    }

.medica-amount-right {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    height: 48px;
}

.medica-turnover-grid-header {
    background-color: transparent !important;
    color: red !important;
    font-weight: 500;
    border-bottom: 2px solid #ddd;
    /* text-align: center; */
    text-align: left;
    padding: 10px;
}

    .medica-turnover-grid-header:hover {
        background-color: #e5e5e5; 
    }

.medica-submodal-btn {
    width: 100%;
    border: none;
    background-color: var(--palette-color-18);
    color: var(--palette-color-15);
    font-weight: 400;
    font-size: 15px;
    height: 38px;
    text-align: center;
    border-radius: 8px;
}

.jqx-fill-state-normal{
    font-size: 15px !important;
}

.medica-normal-text{
    font-weight: 400;
    font-size: 15px;
    color: var(--palette-color-16);
}

.medica-success-text {
    font-weight: 400;
    font-size: 15px;
    color: var(--palette-color-20);
}

.medica-title-input-border {
    border: 1px solid #ddd !important;
    border-radius: 6px !important;
}

/*
.jqx-menu-item-arrow-down-bootstrap, .jqx-icon-arrow-down-bootstrap, .jqx-icon-arrow-down-hover-bootstrap, .jqx-icon-arrow-down-selected-bootstrap {
    background-image: url(/static/images/Icons/arrow_down_frame.svg);

    position:absolute; right: 5px;
}
*/


/*

select {
    background-image: url(/static/images/Icons/arrow_down_frame.svg) !important;
    background-repeat: no-repeat !important;
    background-position-x: 100% !important;
    background-position-y: 50% !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}
*/

.medica-border {
    border: 1px solid var(--palette-color-21) !important;
    border-radius: 10px !important;
}

.medica-border-secendary {
    border: 1px solid var(--palette-color-22) !important;
    border-radius: 6px !important;
}

.medica-border-pink {
    border: 1px solid var(--palette-color-29) !important;
    border-radius: 6px !important;
}


.medica-main-nav-btn {
    width: fit-content;
    padding-right: 0;
    padding-left: 0;
}

.medica-base-calendar {
    border: 1px solid var(--palette-color-21) !important;
    border-radius: 6px !important;
    background-color: var(--palette-color-4);
    color: var(--palette-color-15);
}

    .medica-base-calendar:hover, .medica-base-calendar:active, .medica-base-calendar:focus {
        background-color: var(--palette-color-5);
        color: var(--palette-color-15);
    }


.branch-dropdown-container {
    position: relative;
    width: 250px;
}

.branch-dropdown-button {
    width: 100%;
    padding: 5px;
    padding-left: 10px;
    border: 1px solid var(--palette-color-21);
    border-radius: 6px;
    cursor: pointer;
    background-color: var(--palette-color-15);
    height: 34px;
}

    .branch-dropdown-button:after {
        content: url(/static/images/Icons/arrow_down_frame.svg);
        float: right;
    }

.custom-select-ul {
    padding: 0;
    margin: 0;
    width: 100%;
    border: 1px solid var(--palette-color-21);
    border-radius: 6px;
    position: absolute;
    background-color: var(--palette-color-15);
    z-index: 1000;
    max-height: 200px;
    overflow-y: auto;
}

    .custom-select-ul li {
        padding: 5px;
        padding-left: 10px;
        cursor: pointer;
        border-bottom: 1px solid var(--palette-color-21);
    }

        .custom-select-ul li:hover {
            background-color: var(--palette-color-4);
            color: var(--palette-color-15);
        }

.row-custom {
    display: flex !important;
    margin: 0 6px !important;
    align-items: center !important;
    height: 48px !important;
}
.custom--btn {
    background-color: var(--palette-color-8);
    border-radius: 6px !important;
    font-size: 13px;
    color: white;
    width: 36px;
}
@media (max-width: 1188px) {
    .row-custom {
        height: 96px !important;
    }
}

.custom--dropdown-btn {
    border: 1px solid #CCC !important;
    border-radius: 6px !important;
    background-color: var(--palette-color-4) !important;
    color: var(--palette-color-15) !important;
}
select option:hover{
    background-color: var(--palette-color-1) !important;
}
 

.medica-choose-option {
    height: 7rem;
    width: 10rem;
    border: 1px solid var(--palette-color-22);
    border-radius: 12px;
    margin: 0px 6px;
    flex-direction: column;
    gap: 8px;
    min-width: 30%;
    width: 33.3333%;
    box-shadow: 0px 4px 16px 0px #0000000F;
}

.medica-selected-border {
    border: 2px solid var(--palette-color-18) !important;
}

.medica-central-elements {
    display: flex !important;
    justify-content: center;
    align-items: center;
}

.medica-service-info {
    border: 1px solid var(--palette-color-22);
    border-radius: 12px;
    box-shadow: 0px 4px 16px 0px #0000000F;
    margin-left: 8px;
    width: 38rem;
}

.medica-info-text-lg {
    line-height: 24px;
    font-weight: 500;
    font-size: 16px;
}

.text-medica-green {
    color: var(--palette-color-30);
}

.text-medica-grey {
    color: var(--palette-color-16);
}

.text-medica-purple {
    color: var(--palette-color-18);
}

.text-medica-red {
    color: var(--palette-color-6);
}

.text-medica-bold {
    font-weight: 600;
    font-size: 16px;
}

.text-medica-semi-bold {
    font-weight: 500;
    font-size: 16px;
}

.text-medica-normal {
    font-weight: 400;
    font-size: 16px;
}

.text-medica-small {
    font-weight: 400;
    font-size: 15px;
}

.text-medica-big {
    font-weight: 500;
    font-size: 18px;
}

.tooltip-container {
    position: relative;
    display: inline-block;
    cursor: pointer;
}
.tltp {
    position: relative;
}

.tooltip-text {
    visibility: hidden;
    width: auto;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 5px;
    padding: 5px;
    position: absolute;
    z-index: 1;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    white-space: break-spaces;
    font-size: 14px;
    line-height: 1.4;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}
.tooltip-text.bottom {
    top: 100%;
    bottom: auto;
}
.tooltip-text.medical {
    width: 200px;
    min-height: 50px;
    white-space: initial;
}

.tltp:hover .tooltip-text, .tooltip-container:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

.select__custom__head {
    width: 100%;
    height: 46px;
    margin: 1px 0px 1px 0px;
    /*border: 1px solid #EDEDF3;*/
    border: 0px solid #ddd;
    border-radius: 8px;
    padding: 13px 14px;
    font-size: 15px;
    line-height: 18px;
    color: #4B4B4B;
    cursor: pointer;
    /*background: #fff;*/

    background: transparent;
    display: inline-flex;
    flex-direction: row;
    align-items: center;
}

    .select__custom__head:hover {
        border: 0px solid #EDEDF3;
    }


    .select__custom__head::after {
        width: 15px;
        height: 9px;
        background: #FAFAFA url("data:image/svg+xml,%3Csvg width='13' height='7' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.50495 5.78413L0.205241 1.25827C-0.0684138 0.970375 -0.0684138 0.503596 0.205241 0.215836C0.478652 -0.0719461 0.922098 -0.071946 1.19549 0.215837L5.00007 4.22052L8.80452 0.215953C9.07805 -0.0718292 9.52145 -0.0718292 9.79486 0.215953C10.0684 0.503736 10.0684 0.970492 9.79486 1.25839L5.49508 5.78425C5.35831 5.92814 5.17925 6 5.00009 6C4.82085 6 4.64165 5.928 4.50495 5.78413Z' fill='grey'/%3E%3C/svg%3E%0A") no-repeat center / cover;
        position: absolute;
        right: 22px;
        bottom: 50%;
        transform: translateY(50%);
        content: '';
        display: block;
        transition: .2s ease-in;
    }

    .select__custom__head.open::after {
        transform: translateY(50%) rotate(180deg);
    }

    .modal-huge {
      /*  min-width: 1107px; */
		min-width: 1200px; 
    }





    .new-btn {
        border-radius: 6px;
        border: none;
		
		height: 32px;
    }
    .new-btn.secondary {
        background-color: var(--palette-color-24);
        color: var(--palette-color-4);
    }
    /* .new-btn.primary or .new-btn.active */
    .new-btn.primary, .new-btn.active {
        background-color: var(--palette-color-18);
        color: var(--palette-color-15);
    }




    .pop-statuses {
        display:flex; 
        align-items: stretch; 
        justify-content:space-between; 
        gap:0.675rem; 
        flex-direction: column; 
        font-size: 1rem;
    }
    .pop-statuses strong {
        color: var(--palette-color-32);
        height: 34px !important;
        /* center horizontically and vertically */
        display: flex;
        align-items: center;
        justify-content: center;
    }



    .new-dropdown {
        list-style-type: none; 
        padding: 10px;
        margin: 0;
        background-color: var(--palette-color-15);
        border-radius: 6px;
        overflow: hidden;
        box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
    }
    .new-dropdown li {
		color: var(--palette-color-32);
		padding: 7px 12px;
		line-height: 20px;
		cursor: pointer;
		transition: all 0.3s ease;
		
		
    }

    .new-dropdown li:hover {
		color: #ab50e2;
    }

    .new-dropdown .cancel-item {
		color: var(--palette-color-33);
		transition: all 0.3s ease;
		display: flex;
		width: 100%;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: flex-start;
		align-items: center;
    }
    .new-dropdown .cancel-item svg{ fill: var(--palette-color-33); transition: all 0.3s ease; margin-left: -7px;  margin-right: 7px; }
    .new-dropdown .cancel-item:hover {
        color: red;  
    }
   .new-dropdown .cancel-item:hover svg{ fill: red; }



    .new-dropdown .wli-item {
		color: var(--palette-color-32);
		transition: all 0.3s ease;
		display: flex;
		width: 100%;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: flex-start;
		align-items: center;
    }
    .new-dropdown .wli-item svg{ 
		fill: #ab50e2; transition: all 0.3s ease; margin-left: -7px;  margin-right: 7px; 
		
		padding: 4px;
		border-radius: 25px;
		background: #dddddd91;
		width: 24px;
		height: 24px;

		}
    .new-dropdown .wli-item:hover {
        color: #ab50e2;  
    }
   .new-dropdown .wli-item:hover svg{ fill: #ab50e2; }


.new-dropdown__subttle {
	    height: 32px;
    width: 100%;
    display: inline-flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    color: #607d8b;
    font-size: 15px;
}
.new-dropdown__subttle svg { fill: #607d8b; margin-right: 5px; }


.close_btn_dfs1 {
	height: 26px;
	width: 26px;
	position: absolute;
	right: -3px;
	top: 0px;
	background: #dddddd91;
	border-radius: 100px;
	
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
	
	transition: all 0.3s ease;
}

.close_btn_dfs1 svg {
	fill: #607d8b !important;
	transition: all 0.3s ease;
}

.close_btn_dfs1:hover   {	background: #ddd;  }
.close_btn_dfs1:hover svg {	fill: #fefefe !important;  }

/*********. **************************/

   /* payment-finished-window-template.html */
   .payment-finished {
        display: grid;
        padding: 1.5rem;
        grid-template-rows: 1fr 1fr 2.5fr 6fr 1fr;
   }
   .payment-finished.err {
        grid-template-rows: 1fr 2fr 3fr 1fr;
   }
   .payment-finished .actions {
        display: flex;
        justify-content: end;
        align-items: start;
        gap: 12px;
   }
   .payment-finished .check-success {
        display: flex;
        justify-content: center;
        align-items: center;
   }
   .payment-finished .main-message {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 1.75rem;
   }
   .payment-finished .main-message strong {
        font-size: 1.5rem;
   }
    .payment-finished .main-message span {
        font-size: 1.25rem;
    }
   .payment-finished .cash-info {
        display: flex;
        flex-direction: column;
        justify-content: stretch;
        align-items: stretch;
        gap: 1rem;
   }
   .payment-finished .cash-info .cash-info-row {
        display: flex;
        justify-content: space-between;
        align-items: start;
   }
   .payment-finished .cash-info-row:not(:last-of-type) {
        border-bottom: 1px solid var(--palette-color-21);
        padding-bottom: 1rem;
   }
   .payment-finished .service {
        display: flex;
        flex-direction: column;
        gap: 0.675rem;
   }
   .payment-finished .cash-info-row .service:nth-of-type(2) strong {
        text-align: end;
   }
   .colored {
        color: var(--palette-color-18);
   }
   .payment-finished .submit-btn {
        display: flex;
        justify-content: center;
        align-items: center;
   }



   aside.time-off {
        display: flex;
        flex-direction: column;
        gap: 3rem;
        padding: 1.5rem;
        border-radius: 12px;
        background-color: var(--palette-color-15);
        box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
   }

   aside.time-off .time-off-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 1rem;
   }
   aside.time-off .time-range {
        display: flex;
        align-items: center;
        gap: 1rem;
   }
   aside.time-off .line {
        height: 2px;
        width: 14px;
        background-color: var(--palette-color-23);
   }
   aside.time-off .time-off-header .title {
		font-weight: 600;
		font-size: 20px;
		line-height: 27.2px;
		color: var(--palette-color-16);
   	}


   aside.time-off .period {
        font-size: 14px;
        color: #7E818C;
        margin-top: -3.2rem;
   }
	aside.time-off .time-off-bottom {
		width: 100%;
		margin-top: 25px;
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: flex-end;
		align-items: center;

	}
   aside.time-off  .btn-medica-save {
        
	    width: 180px; 
   }


   aside.time-off .times {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
   }

   aside.time-off .description {
   }



   .red-line {
        border-bottom: 2px solid var(--palette-color-39);
   }

 



   .calendar-visit {
        width: 100%;
        height: 100%;
        text-align: left;
        padding-left: 6px;
        padding-top: 2px;
        overflow: hidden;
        border-radius: 8px 8px 2px 2px;
   }


   /* Calendar styles */


	/*
	   .wrapper {
		width: 100%;
		height: 60dvh;
		overflow: auto;
		position: relative;
		scrollbar-width: thin;
		-webkit-overflow-scrolling: touch;
		}
	*/
   .calendar-wrapper {
    width: 100%;
    height: 100dvh; 
    /*overflow-y: scroll;*/
    position: relative;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch; 
 
	}

/* Calendar Table Styling */
.calendar-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.calendar-table th,
.calendar-table td {
    padding: 0;
    text-align: center;
    vertical-align: top;
    position: relative;
    width: 500px;
	
	
}

.calendar-table th {
    font-size: 18px;
    padding: 10px;
    position: sticky;
    top: 0px;
    z-index: 5;
	
	background: #fff;
	
	border-bottom: 0px dashed #ccc;
}

/* Calendar Cell Styling */
.calendar-cell {
    position: relative;
    cursor: pointer;
}

.sub-slot {
    height: 35px;
    position: relative;
    border: 1px solid #f3f3f3;
}

.sub-slot__underline { border-bottom: 1px solid red;  }
/* Slot Time Styling */
.slot-time {
    cursor: initial;
    border: none;
    background-color: white;
}

th.slot-time {
    width: 60px;
    z-index: 100;
    position: sticky;
    left: 0;
    background-color: white;
}

th.slot-time:last-child,
td.slot-time:last-child {
    right: 0;
}

td.slot-time {
    position: sticky;
    left: 0;
    top: -10px;
    text-align: end;
    z-index: 103;
}

td.slot-time:last-child {
    text-align: start;
}

td.slot-time:last-child span.time {
    padding-left: 1rem;
}

span.time {
    position: relative;
    top: -10px;
    z-index: 104;
    padding-right: 0.7rem;
}

/* Event Styling */
.doctor-event {
    position: absolute;
    background-color: #6a52ff;
    color: #0e0e0e;
    padding: 5px;
    font-size: 12px;
    box-sizing: border-box;
    z-index: 3;
    /*transition: background-color 0.3s;*/
    transition: all 0.3s ease;
    overflow: hidden;
    border: 1px dotted white;
    border-radius: 5px;
    /*  min-height: 42px;*/
    /*  min-height: 45px;*/
    /*    min-width: 120px;*/


    border: 1px solid #ffffff;
   
}
    .doctor-event:hover {
        z-index: 15;
        /* border: 1px dotted #404040;
        border: 1px dashed #404040;
           */
        box-shadow: 0 4px 16px 2px #607D8B;
        overflow: visible;
        min-width: 120px !important;
    }

.doctor-cell { border : 3px solid #607d8b1f; border-top: 0px solid red;  border-left: 0px solid red;    }

/* Hover Time Styling */
.hover-time {
    opacity: 0;
    display: flex;
    position: absolute;
    inset: 0;
    border: 2px solid #555555;
    background-color: rgba(255, 255, 255, 0.8);
    color: #333;
    font-size: 14px;
    justify-content: end;
    padding: 0.5rem;
    align-items: center;
    z-index: 1;
    transition: opacity 0.1s;
    border-radius: 6px;
}

.sub-slot:hover .hover-time {
    opacity: 1;
}

/* Time Off Styling */
.time-off-event {
    position: absolute;
    background-color: #cfcece;
    color: white;
    padding: 5px;
    border-radius: 3px;
    font-size: 12px;
    box-sizing: border-box;
    z-index: 2;
    transition: background-color 0.3s;
}

.time-off-event:hover {
    background-color: #34495e;
}
.sub-slot.not-work {
    background-color: #e5e5f788;
    background-size: 7px 7px;
    background-image: repeating-linear-gradient(45deg, #a0a0a075 0, #a0a0a0 0.7000000000000001px, #e5e5f766 0, #e5e5f769 50%);
}

.custom-tooltip {
    opacity: 1 !important;
    width: 300px; 
	
	font-family: 'NotoSansGeorgian-VF';
}


.custom-tooltip.right .tooltip-arrow {
    border-right-color: #fefefe !important;
}
.custom-tooltip.left .tooltip-arrow {
    border-left-color: #fefefe !important;
}
.custom-tooltip.top .tooltip-arrow {
    border-top-color: #fefefe !important;
}
.custom-tooltip.bottom .tooltip-arrow {
    border-bottom-color: #fefefe !important;
}

    .custom-tooltip .tooltip-inner {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        align-items: stretch;
        background: #fefefe;
        color: var(--palette-color-16);
        box-shadow: 0 6px 12px rgba(0,0,0,.25);
        opacity: 1 !important;
        width: 300px;
        max-width: 300px;
        padding: 0 !important;
        border-radius: 6px;
        overflow: hidden;
    }
.custom-tooltip  strong {
    /*font-size: 1.25em ;  */
	font-size: 14px !important;
	font-weight: 500;
	font-family: 'NotoSansGeorgian-SemiBold'; 
}

.custom-tooltip  span {
    font-size: 1em ;
}
.custom-tooltip .person-image {
    border-radius: 50%;
    width: 28px;
    height: 28px;
}
/* Tooltip Header */
.tooltip-header {
    display: flex;
    justify-content: space-between; /* Space between time and status */
    font-weight: bold; /* Bold header text */
    width: 100%;
    background-color: #21c14e;
    padding: 10px;
    color: #fefefe;
    box-sizing: border-box;
    margin: 0;

}

.tooltip-content {
    padding-left: 10px;
    padding-right: 10px;
    display: flex;
    flex-direction: column; /* Content in column */
    align-items: stretch;
}

.tooltip-content .name {
    font-size: 1.25em;
    font-weight: bold;
}

.tooltip-content .phone, .tooltip-content .service, .tooltip-content .price, .tooltip-content .person-name {
    font-size: 14px;
	color: #4B4B4B;
}

.tooltip-content .name, .custom-tooltip .phone, .custom-tooltip .comment-icon{
    align-self: flex-start;
}

.tooltip-content .comment-icon {
    font-size: 1.25em;
    color: #21c14e;
}

.flex-space-between {
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.flex-gap-1-center  {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.loader-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
  }
  
  .spinner {
    border: 6px solid #f3f3f3;
    border-top: 6px solid var(--palette-color-18);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
  }
  
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }

  .colored-tbmark-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
  }
  .colored-tbmark-container .colored-tbmark {
    width: 24px;
    height: 24px;
  }
  
  .modal-container {
    width: 600px;
    margin: 0 auto;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    position: relative;
}


.close-button {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
}

.modal-body {
    padding: 20px;
}

.color-palette {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.color-options {
    display: flex;
    gap: 10px;
}

.color-box {
    width: 40px;
    height: 40px;
    cursor: pointer;
    border-radius: 6px;
    transition: transform 0.2s;
}

.color-box:hover {
    transform: scale(1.1);
}

.color-picker-container {
    width: 80px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.color-picker-button {
    border: none;
    background: none;
}

.action-buttons {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
}

.selected-color {
    box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 4px #AB50E2;
    -moz-box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 4px #AB50E2;
}

.sell-modal-width .modal-dialog {
    width: 1154px;
    max-width: 100%;
}

.modal-md-salary-settings .modal-dialog .modal-content {
    width: 600px;
    left: calc(50% - 300px);
    top: 150px;
}