/* ----------------------------------------------------------------------------
 * Easy!Appointments - Open Source Web Scheduler
 * 
 * @package     EasyAppointments
 * @author      A.Tselegidis <alextselegidis@gmail.com>
 * @copyright   Copyright (c) 2013 - 2015, Alex Tselegidis
 * @license     http://opensource.org/licenses/GPL-3.0 - GPLv3 
 * @link        http://easyappointments.org
 * @since       v1.0.0
 * ---------------------------------------------------------------------------- */

/****    
     FILE VERSIONING  
     Version:  v4.3.2
****/
a {
    color: #0589ff;
}
a:hover, a:focus {
    color: #0848c1;
    text-decoration: underline;
}
.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline,
.has-error.radio label,
.has-error.checkbox label,
.has-error.radio-inline label,
.has-error.checkbox-inline label ,
.has-error .terms-control{
  color: #ff0000;
}
.checkbox-error {
    box-shadow: inset 0px 0px 1px 2px #ff0000;
}
.text-danger {
    color: var(--wizard-txt-color-inactive);
    font-weight: bold;
}
.border-error {
    border: 2px solid var(--wizard-txt-color-inactive) !important;
}
body .custom-qtip {
    border: none;
    border-radius: 0;
    padding: 10px;
    font-size: 12px;
    line-height: 20px;
}

body .ui-widget {
    font-family: var(--main-font);
    font-size: 1.1em;
}

body .ui-widget-overlay {
    background: #000 50% 50% repeat-x;
    opacity: .5;
    filter: Alpha(Opacity=50);
}

body .ui-dialog .ui-dialog-titlebar-close {
    display: none;
}

body .ui-draggable .ui-dialog-titlebar {
/*    background: var(--main-bg-color);*/
/*    color: var(--main-txt-color);*/
    font-size: 1.5em;
/*    text-shadow: 1px 1px 0px var(--main-bg-color-border-shadow);*/
    padding: 14px 10px;
/*    border-bottom: 4px solid var(--main-bg-color-border);*/
    margin-bottom: 10px;
}

body .ui-dialog {
    padding: 0;
    z-index: 2000;
    border: none !important;
    box-shadow: 0 0 10px #333;
    background: white;
}
#message_box {
    padding-left: 30px;
    padding-right: 30px;
}
body .ui-dialog .ui-dialog-buttonpane {
    padding: .3em 1em .3em .4em;
    border: none;
}

body .ui-button .ui-icon,
body .ui-button:hover .ui-icon {
    background-image: url('../ext/jquery-ui/images/ui-icons_222222_256x240.png');
}

body .ui-dialog #error-technical {
    max-width: 500px;
}

body .ui-datepicker {
    border: none;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    width: 100%;
    background: var(--calendar-default-bg-color);
    margin: auto;
    padding: 0;
    border: 1px solid;
    box-shadow: 0px 0px 16px 0px #a5a5a5;
}

body .ui-datepicker .ui-widget-header {
    border-left: none;
    border-right: none;
    border-top:none;
    border-bottom: 1px solid var(--main-bg-color-border);
    border-top-left-radius: 4px !important;
    border-top-right-radius: 4px !important;
    height: 40px;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
}

body .ui-datepicker td a,
body .ui-datepicker td span {
    text-align: center !important;
    box-sizing: border-box;
    height: 32px;
}

.ui-datepicker table {
    min-height: 300px;
}

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    position: absolute;
    top: 2px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
}

.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
    border-radius: 20px;
    background-color: black;
}

.breaks tr:hover td {
    background: #FFFFC2 !important;
}

.working-plan td {
    vertical-align: middle;
}

.breaks td  {
    vertical-align: middle;
}

li.language:hover {
    cursor: pointer;
    color: #005580;
}

#select-language {
    cursor: pointer;
    display: inline-block;
    padding: 4px 5px;
}

#select-language.active {
    box-shadow: 0 0 20px #1A865F;
}

#language-list {
    list-style: none;
    padding-left: 0px;
}


/* JQUERY UI DATETIME PICKER ADDON
   ------------------------------------------------------------------------- */
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; }
.ui-timepicker-rtl dl dd { margin: 0 65px 10px 10px; }


/* BOOTSTRAP THEME FIXES
   ------------------------------------------------------------------------- */
.clickable-link {
    text-decoration-line: underline;
    text-decoration-color: blue;
}
.select2-container--classic .select2-selection--single .select2-selection__rendered {
	line-height: 18px;
        white-space: normal;
}

.select2-container .select2-selection--single {
    height: auto;
}

/*  Color themes  */
body {
    background-color: var(--main-bg-color);
    color: var(--main-txt-color);
}
#book-appointment-wizard #header {
    border-bottom: 1px solid var(--main-bg-color-border);
}
#book-appointment-wizard #company-name { 
    color: var(--header-txt-color);
}
#book-appointment-wizard #frame-footer {
   border-top: 1px solid var(--wizard-footer-bg-color-border);
   background: var(--wizard-footer-bg-color);
}
body .ui-datepicker td a.ui-state-active,
body .ui-datepicker td a.ui-state-highlight {
    border: 2px solid var(--control-active-bg-color-border);
    color: var(--control-active-txt-color);
    font-weight: bolder;
}
.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single,
/*.select2-container .select2-selection--single .select2-selection__rendered,*/
.select2-selection__arrow,
.ui-widget-header a{
    background: var(--control-default-bg-color);
    color: var(--control-default-txt-color);
}

.select2-container--classic .select2-selection--single .select2-selection__placeholder {
    background-color: var(--control-default-bg-color);
    color: var(--main-txt-color);
}

.form-control[disabled], .form-control[readonly], fieldset[disabled] {
    background-color: var(--control-inactive-bg-color);
}
.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single,
.select2-container--classic.select2-container--open .select2-selection--single,
.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single,
.select2-container--classic .select2-selection--single {
    background: var(--control-default-bg-color);
    background-color: white;
    color: var(--control-default-txt-color);
    background-image: none;
    border: 1px solid var(--control-default-bg-color-border);
    background-repeat: none;
    filter: none;
}
.select2-results__option,
body .ui-draggable .ui-dialog-titlebar,
.label-success,
 .btn-primary, .btn-primary:focus,
.button-provider, .button-provider:focus,
.button-insurance, .button-insurance:focus,
/*.service-button-container,*/
.button-service, .button-service:focus,
.button-location, .button-location:focus,
.label-success[href]:hover,
.label-success[href]:focus,

.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    background: var(--control-default-bg-color);
    color: var(--control-default-txt-color);
    outline: none;
}
.text-primary {
    color: var(--wizard-txt-color);
}

body .ui-draggable .ui-dialog-titlebar {
	color: var(--wizard-txt-color);
	text-shadow: 1px 1px 0px var(--wizard-txt-color-shadow);
        border-left: none;
        border-top: none;
        border-right: none;
	border-bottom-color: var(--wizard-bg-color-border);
        text-align: center;
}
.ui-dialog .ui-dialog-title {
    width: 100%;
    overflow: unset; 
    overflow: visible;
}
.ui-dialog .ui-dialog-buttonpane button {
    padding: 10px;
    width: 100px;
    border: 1px solid gray;
}
.ui-dialog .ui-dialog-buttonpane button:hover {
    background: whitesmoke;
}
/*.ui-state-default, .ui-widget-content .ui-state-default, */
.ui-widget-header .ui-state-default {
    border: 1px solid var(--control-default-bg-color-border);
    font-weight: normal;
}

.command-buttons .button-next {
    background: var(--command-next-bg-color);
    color: var(--command-next-txt-color);
}

.command-buttons .button-back {
    Background: var(--command-back-bg-color);
    color: var(--command-back-txt-color);
}

.btn-primary {
    border-color: transparent;
}
textarea:focus, textarea.form-control:focus, input.form-control:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="number"]:focus, .form-control[type="text"]:focus, .form-control[type="password"]:focus, .form-control[type="email"]:focus, .form-control[type="tel"]:focus, .form-control[contenteditable]:focus {
    box-shadow: 0px -2px 0px var(--control-hover-bg-color-border) inset;
}
ul.checkout-bar li, 
ul.checkout-bar li:before , 
ul.checkout-bar li.active, ul.checkout-bar:before,
ul.checkout-bar li.visited::before,
ul.checkout-bar li.active:before {
  background-color: var(--control-active-bg-color);
}
ul.checkout-bar li.visited {
  color: var(--control-default-txt-color);
}
@media all and (min-width: 620px) {
    ul.checkout-bar li.visited:after {
        background-color: var(--control-default-bg-color);
    }
    ul.checkout-bar li.active:after {
        background-color: var(--control-active-bg-color);
    }
}
body .ui-datepicker td a.ui-state-highlight {
    color: var(--control-default-txt-color);
    background: var(--control-default-bg-color);
}

#book-appointment-wizard #available-hours .available-hour:focus,
body .ui-datepicker td a:focus,
body .ui-datepicker-header a:focus,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
    color: var(--control-default-txt-color);
    text-decoration: none;
    background: var(--control-default-bg-color) !important;
    font-weight: normal;
    border-bottom-color: var(--control-default-bg-color-border) !important;
}
#book-appointment-wizard #header,
.ui-widget-header a,
.ui-widget-header {
    background: var(--header-bg-color); 
    color: var(--header-txt-color);
}
#book-appointment-wizard .wizard-frame {
	 background-color: var(--wizard-bg-color); 
	 border-color: var(--wizard-bg-color-border); 
/*	 box-shadow: 0px 23px 72px 6px var(--wizard-bg-color-shadow); */
}
/*.select2-container--classic .select2-selection--single .select2-selection__rendered,*/
/*.Zebra_DatePicker td.dp_selected {
    background: var(--control-default-txt-color) ;
    color: var(--control-default-bg-color);   
}
.Zebra_DatePicker td.dp_hover {
    background: var(--control-hover-bg-color) ;
    color: var(--control-hover-txt-color);
    
}*/
.select2-container--classic .select2-results__option--highlighted[aria-selected],
#book-appointment-wizard #available-hours .selected-hour ,
.provider-selected, 
.service-selected, 
.button-selected, 
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
body .ui-datepicker td a.ui-state-active, .btn-success {
    background: var(--control-active-bg-color) !important;
    color: var(--control-active-txt-color) !important;
    border-color: var(--control-active-bg-color-border) !important;
    font-weight: bold;
    box-shadow: 0px 2px 7px var(--control-active-box-shadow-color);
    border-radius: 4px;
}
body .ui-datepicker td a.ui-state-active {
    border-bottom-color: var(--control-active-bg-color-border) !important;
}
.btn-danger:active, .btn-danger.active, .open>.dropdown-toggle.btn-danger {
    background-color: var(--control-default-bg-color);
}
.ui-icon, 
.ui-widget-content .ui-icon,
.ui-widget-header .ui-icon {
    /*background-image: url("../ext/jquery-uiimages/ui-icons_ffffff_256x240.png");*/
/*    background-image: url("../ext/jquery-ui/images/ui-icons_062126_256x240.png");*/
    /*background-image: url("../ext/jquery-uiimages/ui-icons_222222_256x240.png");*/
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
#book-appointment-wizard #available-hours .available-hour:hover,
.button-selected:focus,
.button-provider:hover, .button-provider:active:hover, .button-provider:focus,
.button-location:hover, .button-location:active:hover, .button-location:focus,
.button-service:hover, .button-service:active:hover, .button-service:focus,
.button-insurance:hover, .button-insurance:active:hover, .button-insurance:focus,
.btn-primary:hover, .btn-primary:active:hover, .btn-primary:focus {
    background: var(--control-hover-bg-color);
    color: var(--control-hover-txt-color);
    outline: none;
}

.gm-style-iw-d {
    max-width: 300px;
/*    min-width: 300px;*/
    padding: 0px !important;
    width: 100%;
    height: 100%;
    margin: auto;
    overflow: hidden !important;
}

.gm-style-iw.gm-style-iw-c {
    padding: 0px !important;
    min-width: 230px !important;
}

.goog-te-gadget span {
    display: none;
}

/*jQuery Message Pop-up Modification */
    .ui-dialog .appt-edit-dialog {
        text-align: center !important;
        padding-bottom: 10px !important;
    }

    .ui-dialog .appt-edit-dialog .ui-dialog-buttonset {
        float: none !important;
    }

    .ui-dialog .btn-appt-edit {
        width: auto !important;
        font-family: var(--main-font) !important;
    }

/* Mobile Devices */
    @media(max-width: 768px) {
        
        .gm-style-iw-d {
            max-width: 300px;
            min-width: 260px;
            padding: 0px !important;
            width: 100%;
            height: 100%;
            margin: auto;
            overflow: hidden !important;
            max-height: 170px !important;
        }

        .gm-style-iw.gm-style-iw-c {
            padding: 0px !important;
            max-height: 160px !important;
            max-width: 260px !important;
        }

    }