@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

html {
    font-family: 'Poppins', Arial, Helvetica, sans-serif;
    font-weight: 300; /* Light */
}

/* ============================================================
 * Styling Colors
 * ============================================================ */

.client-header {
    text-align: center;
    top: 0;
    background-color: #EBEADF;
    height: 200px;
    width: 100%;
    z-index: 1000;
    padding-top: 40px;
    box-shadow: none;
}

.text-darken-1 div {
    color: #728B2A;
}

.services .service .blue-grey.white-text.card {
    background-color: #728B2A !important;
}

.service .card .card-content .flow-text.costs {
    color: white;
}

.client-header .logo {
    height: 1450px !important;
}

body {
    background: #EBEADF;
}

.blue-grey.lighten-5 {
    background-color: #ACB944 !important;
}

footer.page-footer .footer-copyright {
    overflow: hidden;
    min-height: 50px;
    display: flex;
    align-items: center;
    padding: 10px 0px;
    color: rgba(255, 255, 255, 0.8);
    background-color: rgba(255, 255, 255, 0);
}

.footer-copyright .grey-text {
    color: white !important;
}

.grey-text.text-darken-2 {
    color: #ACB944 !important;
}

.categories.tabs-vertical a {
    color: #ACB944 !important;
    background-color: #EBEADF;
}

.categories.tabs-vertical .active {
    color: #728B2A !important;
    border-right: 3px solid #728B2A;
}

.tabs .tab a.active {
    color: #728B2A !important;
}

.tabs-vertical .tab .active {
    background: #EBEADF !important;
}

.card .card-action a:not(.btn):not(.btn-large):not(.btn-floating) {
    color: #A2B02C;
}

.grey-text.text-darken-1 {
    color: black !important;
}

.provider {
    background-color: #A2B02C;
    color: #EBEADF;
}

.provider.teal.lighten-2.white-text.chip {
    background-color: #728B2A !important;
}

.slot.teal.lighten-1.white-text {
    background-color: #A2B02C !important;
}

.selected.orange.white-text {
    background-color: #728B2A !important;
}

.slottime-item.collection-item.selected {
    background-color: #728B2A !important;
}

.chip.teal.lighten-1.white-text {
    background-color: #728B2A !important;
}

#submit_booking {
    background-color: #728B2A !important;
}

/* ============================================================
 * Styling Colors END
 * ============================================================ */


/* ============================================================
 * Styling Leistungen / Service Cards
 *
 * Layout-Korrektur: Vorher war grid-template-columns: auto 70%
 * gesetzt, was dazu führte, dass der Beschreibungstext auf die
 * "auto"-Minimalbreite gequetscht wurde, während die Dauer
 * ("25 Minuten") 70% der Kartenbreite beanspruchte.
 *
 * Neu: Beschreibung nimmt volle Breite (grid-area: content),
 * Aktion und Dauer bilden eine kompakte Fußzeile via
 * grid-template-areas. So wird der Platz sinnvoll genutzt.
 * ============================================================ */

.services.row .service .card {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas:
        "content  content"
        "action   duration";
    align-items: stretch;
    padding-top: 10px;
    padding-left: 10px;
    border-radius: 20px;
}

/* Beschreibungsbereich: volle Breite über beide Spalten */
.services.row .service .card > .card-content:not(.facts) {
    grid-area: content;
}

/* Dauer-Badge: kompakt, rechts unten, kein Zeilenumbruch */
.services.row .service .card > .card-content.facts {
    grid-area: duration;
    align-self: center;
    text-align: right;
    padding: 8px 16px;
    white-space: nowrap; /* verhindert Umbruch bei "25 Minuten" */
}

/* Aktions-Link: links unten */
.services.row .service .card > .card-action {
    grid-area: action;
    align-self: center;
    border-radius: 0 0 0 15px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.service .card-image {
    min-width: 200px;
}

.services.row .service .blue-grey.white-text.card .card-content .card-title,
.services.row .service .blue-grey.white-text.card .card-content {
    background-color: #728B2A !important;
    color: white !important;
}

.services.row .service .card .card-content .card-title {
    color: #728B2A;
    font-family: "AvenirBold", Arial, Helvetica, sans-serif;
}

.service .card-content {
    color: #929292;
}

.card .card-action a:not(.btn):not(.btn-large):not(.btn-floating):hover {
    color: #A2B02C;
}

.card .card-action {
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}

.services.row {
    display: flex;
    flex-direction: column;
}

.services.row .service .card .card-content .flow-text.costs {
    color: #728B2A;
}

.services.row .service .blue-grey.white-text.card .card-content .flow-text.costs {
    color: white;
}

.services.row .service .blue-grey.white-text.card .card-action a {
    color: white !important;
}

.services .service .card .card-content.facts {
    text-align: center;
}

/* ============================================================
 * Styling Leistungen END
 * ============================================================ */


/* ============================================================
 * Footer
 * ============================================================ */

.page-footer.blue-grey.lighten-5.text-darken-2.grey-text {
    color: white !important;
}

.white-text {
    color: white !important;
}

/* ============================================================
 * Tabs & Calendar
 * ============================================================ */

.row .col.s12.m6.calendar .tabs .tab a {
    color: #728B2A !important;
    border-bottom-color: pink !important;
}

.tabs .indicator {
    background-color: #728B2A !important;
}

/* ============================================================
 * Forms & Inputs
 * ============================================================ */

.secondary-content span {
    color: #728B2A;
}

.input-field {
    color: #728B2A !important;
}

.input-field label {
    color: #728B2A;
}

input:not([type]):focus:not([readonly]) + label,
input[type=text]:focus:not([readonly]) + label,
input[type=password]:focus:not([readonly]) + label,
input[type=email]:focus:not([readonly]) + label,
input[type=url]:focus:not([readonly]) + label,
input[type=time]:focus:not([readonly]) + label,
input[type=date]:focus:not([readonly]) + label,
input[type=datetime]:focus:not([readonly]) + label,
input[type=datetime-local]:focus:not([readonly]) + label,
input[type=tel]:focus:not([readonly]) + label,
input[type=number]:focus:not([readonly]) + label,
input[type=search]:focus:not([readonly]) + label,
textarea.materialize-textarea:focus:not([readonly]) + label {
    color: #728B2A;
}

.dropdown-content span {
    color: #728B2A !important;
}

.provider.chip img {
    display: none;
}