/*html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}*/

.arzt-header {
    background-color: #fff !important;
    background-position-x: 0%;
    background-position-y: 0%;
    background-repeat: repeat;
    background-image: none;
    box-shadow: 0 0 10px rgba(0,0,0,0.2);
    border-radius: 0 0 1.2rem 1.2rem;
    margin-bottom: 1.25rem;
    padding-left: 2rem !important;
    /*padding-right: 5rem !important;*/
    height: 130px;
    background-image: url("/assets/img/title.l1.png");
    background-repeat: no-repeat;
    background-position: left;
    text-shadow: 1px 2px 3px #777;
    /*opacity: 1.0;*/
}

h1 span, .akzentfarbe1 {
    color: #c3d66a;
}

#logo {
    /*    margin-top: 1rem;*/
    font-size: 2rem;
    font-style: italic;
    font-weight: normal;
    text-decoration: none;
}

#logo-a {
    margin: 0 0 0 0;
    color: #58585a;
}

@media only screen and (min-width: 380px) {
    .arzt-header {
        padding-left: 10rem !important;
        /*        padding-right: 5rem !important;*/
    }
}

@media only screen and (min-width: 470px) {
    .arzt-header {
        padding-left: 10rem !important;
        /*        padding-right: 5rem !important;*/
    }

    #logo {
        font-size: 2.5rem;
        margin: -0.5rem 0 0 0;
    }

    #logo-a {
        margin: 0 0 0 15%;
    }
}

@media only screen and (min-width: 768px) {
    .arzt-header {
        background-image: url("/assets/img/title.l1.png"), url("/assets/img/title.r1.png");
        background-repeat: no-repeat, no-repeat;
        background-position: left, right;
        padding-left: 10rem !important;
        padding-right: 15rem !important;
        /*opacity: 1.0;*/
    }

    #logo {
        font-size: 2.5rem;
        margin: -0.5rem 0 0 0;
    }

    #logo-a {
        margin: 0 0 0 18%;
    }
}

@media only screen and (min-width: 992px) {

    #logo {
        margin: 0 0 0 0;
        font-size: 3.5rem;
    }

    #logo-a {
        margin: 0 0 0 0;
    }
}

@media only screen and (min-width: 1200px) {

    #logo {
        margin: 0 0 0 12%;
    }
}

.min-height-page-header {
    min-height: 21rem !important;
}

.bg-my-brown {
    background-color: #e1d5c9 !important;
}

.border-btm1 {
    border-bottom: 1px solid #848d95 !important;
}

hr {
    color: #647c91;
    opacity: 0.7;
    height: 0.9px;
}


/* primary colors */
.bg-gradient-primary { /*purple-blue dark*/
    background-image: linear-gradient(195deg, #40B4EC 0%, #8B1BD8 100%);
}
/*.btn-primary:hover, .btn.bg-gradient-primary:hover {
    background-color: #671ee9;
    border-color: #841ee9;
    box-shadow: 0 8px 14px -8px rgba(151, 30, 233, 0.3), 0 3px 18px 0 rgba(141, 30, 233, 0.1), 0 7px 8px -4px rgba(141, 30, 233, 0.18);
}*/

/* primary color blue  (purple original: #e91e63 ) */
.btn-primary {
    --bs-btn-color: #0a0a0a;
    /*--bs-btn-bg: #5ea3c4;*/
    --bs-btn-bg: #318dba;
    --bs-btn-border-color: #318dba;
    --bs-btn-hover-color: #0a0a0a;
    --bs-btn-hover-bg: #318dba;
    --bs-btn-hover-border-color: #318dba;
    --bs-btn-focus-shadow-rgb: 200, 27, 86;
    --bs-btn-active-color: #0a0a0a;
    --bs-btn-active-bg: #318dba;
    --bs-btn-active-border-color: #318dba;
    --bs-btn-active-shadow: none;
    --bs-btn-disabled-color: #0a0a0a;
    --bs-btn-disabled-bg: #318dba;
    --bs-btn-disabled-border-color: #318dba;
}

/* hover shadow color blue */
.btn-primary:hover, .btn.bg-gradient-primary:hover {
    background-color: #318dba;
    border-color: #318dba;
    box-shadow: 0 8px 14px -8px rgba(30, 138, 233, 0.3), 0 3px 18px 0 rgba(30, 138, 233, 0.1), 0 7px 8px -4px rgba(30, 157, 233, 0.18);
}

/* shadow color blue */
.btn-primary, .btn.bg-gradient-primary {
    box-shadow: 0 2px 2px 0 rgba(30, 128, 233, 0.1), 0 3px 1px -2px rgba(30, 147, 233, 0.18), 0 1px 5px 0 rgba(30, 147, 233, 0.15);
}
/* klicked-active */
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle,
.btn.bg-gradient-primary:not(:disabled):not(.disabled).active,
.btn.bg-gradient-primary:not(:disabled):not(.disabled):active,
.show > .btn.bg-gradient-primary.dropdown-toggle {
    color: #318dba;
    background-color: #318dba;
}

.btn-outline-primary {
    --bs-btn-color: #318dba;
    --bs-btn-border-color: #318dba;
    --bs-btn-hover-color: #0a0a0a;
    --bs-btn-hover-bg: #318dba;
    --bs-btn-hover-border-color: #318dba;
    --bs-btn-focus-shadow-rgb: 233, 30, 99;
    --bs-btn-active-color: #0a0a0a;
    --bs-btn-active-bg: #318dba;
    --bs-btn-active-border-color: #318dba;
    --bs-btn-active-shadow: none;
    --bs-btn-disabled-color: #318dba;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #318dba;
    --bs-gradient: none;
}

.btn-outline-primary:hover:not(.active) {
    background-color: transparent;
    opacity: 0.75;
    box-shadow: none;
    color: #318dba;
}



.text-danger {
    color: #BB362B !important;
}

/* input and forms */
.input-group.input-group-dynamic.is-focused label, .input-group.input-group-static.is-focused label {
    /*color: #0a8bca;*/
    color: #318dba;
    /*font-weight: bold;*/
    /*font-size: 1rem !important;
    margin-top: 0;*/
}

.form-check-input {
    --bs-form-check-bg: #c7d2d9;
}

.form-check-input:checked[type="checkbox"] {
    --bs-form-check-bg-image: linear-gradient(195deg, #65aed2 0%, #318dba 100%);
}

.form-check:not(.form-switch) .form-check-input[type="checkbox"]:checked {
    background: #318dba;
}

.form-check:not(.form-switch) .form-check-input[type="checkbox"]:checked, .form-check:not(.form-switch) .form-check-input[type="radio"]:checked {
    border-color: #318dba;
}

.input-group select, .input-group input {
    padding-left: 0.5rem !important;
}


label {
    color: #90959a;
    font-weight: 600;
    padding-bottom: 0.25rem;
}

/*fix for selected input line right edge*/
.input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu), .input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n+3) {
    border-top-right-radius: 0.375rem !important;
    border-bottom-right-radius: 0rem !important;
}

/*set input line when not selected (darker gray)*/
.input-group.input-group-dynamic .form-control, .input-group.input-group-dynamic .form-control:focus, .input-group.input-group-static .form-control, .input-group.input-group-static .form-control:focus {
    background-image: linear-gradient(0deg, #318dba 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #c8c8c8 1px, hsla(0, 0%, 82%, 0) 0);
    border-radius: 0 !important;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}


/* tables */
.table thead th {
    padding: 0.5rem 0;
}

.table > :not(:last-child) > :last-child > * {
    border-bottom-color: #a1b9ce;
}

.table {
    --bs-table-border-color: #bdccd9;
}

/* blur + transparency */
.blur.card, .blur.card-body {
    background-color: rgba(219, 228, 234, 0.6) !important;
    -webkit-backdrop-filter: saturate(100%) blur(24px);
    backdrop-filter: saturate(100%) blur(24px);
}

.blur {
    box-shadow: inset 0px 0px 2px rgba(254, 254, 254, 0.8);
    -webkit-backdrop-filter: saturate(100%) blur(16px);
    backdrop-filter: saturate(100%) blur(16px);
    background-color: rgba(255, 255, 255, 0.8) !important;
    /*fix white border around card*/
}

/* NAV BAR */
.blur-nav {
    -webkit-backdrop-filter: saturate(100%) blur(16px);
    backdrop-filter: saturate(100%) blur(16px);
    background-color: rgba(255, 255, 255, 0.2) !important;
}

.navbar-toggler {
    border: 0;
}


.card {
    border: 0px !important;
    background-color: #efeae0;
    --bs-card-border-radius: 1.25rem;
}

.card-home {
    border: 0px !important;
    --bs-card-border-radius: 0.75rem;
    background-color: #efeae0b2;
}

.card-header-1 {
    border: 0px !important;
    --bs-card-border-radius: 0.75rem;
    background-color: rgba(128, 171, 185, 0.46);
}

.card-header-2 {
    border: 0px !important;
    --bs-card-border-radius: 3rem;
    background-color: rgba(73, 156, 181, 0.46);
}

.content-header {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}


.shadow-blur {
    box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.07) !important;
}

.shadow-blur-sm {
    box-shadow: 1px 3px 9px 0 rgba(0, 0, 0, 0.05) !important;
}

.dropdown .dropdown-menu:before {
    font-family: "Font Awesome 6 Free";
    content: "\f0d8";
    position: absolute;
    top: 0;
    left: 28px;
    right: auto;
    font-size: 22px;
    color: #fff;
    transition: top 0.35s ease;
    margin-top: 1px;
}

/* dateTime picker */
.tempus-dominus-widget {
    border-radius: 20px !important;
}

/* time slot buttons */
.btn-timeslot {
    padding: 0.05rem;
    margin-bottom: 0.25rem !important;
    font-size: 0.75rem;
    border-radius: 1rem;
    width: 5rem;
}

.btn-doc {
    padding: 0.375rem 1rem 0.375rem 1rem;
    font-size: 0.75rem;
    border-radius: 3rem;
}

/* allocation timslot table */
@media only screen and (max-width: 620px) {
    .font-timeslot {
        font-size: 0.8rem;
    }
    .btn-timeslot {
        width: 3.5rem;
        margin-bottom: 0.5rem !important;
    }
}

@media only screen and (max-width: 500px) {
    .font-timeslot {
        font-size: 0.7rem;
    }
    .btn-timeslot {
        font-size: 0.6rem;
        width: 2.7rem;
        padding: 0.05rem 0.2rem;
        margin-bottom: 0.7rem !important;
    }
    .btn-doc {
        padding: 0.25rem 0.75rem 0.25rem 0.75rem;
        font-size: 0.6rem;
        border-radius: 3rem;
    }
}

/* custom radius */
.btn {
    --bs-btn-border-radius: 0.75rem;
}

.border-radius-xl {
    border-radius: 1.2rem;
}

.btn-sm-2 {
    --bs-btn-padding-y: 0.3rem;
    --bs-btn-padding-x: .8rem;
    --bs-btn-font-size: 0.75rem;
    --bs-btn-border-radius: 0.75rem;
}

.bottom-buttons {
    margin-bottom: 1rem;
    margin-top: 0.5rem;
    display: flex;
}
