/* CSS mit Anpassungen des Kunden */ /* Vor die btn Klasse noch ein "e-cut_" einf�gen*/ #button-wrap-inner { border: 0 solid #ccc; padding: 35px 0; text-align: center; } body { background: url(../../salons_api2/respiro_oberndorf/images/background_1534673861.jpg) no-repeat center center fixed; background-color: #ffffff; /* Default: #000000; */ -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #logoimage { /*max-width: 245px; Default: 350px; */ width: 100%; } #subheadline { display: block; width: 100%; text-align: center !important; margin-left: auto !important; margin-right: auto !important; margin-top: 10px; margin-bottom: 30px; padding-top: 30px; padding-bottom: 30px; background-color: rgba(247, 238, 214, 0.5); color: #ffffff; font-size: 14px; font-weight: normal; text-align: center; } .table-striped>tbody>tr:nth-child(odd)>td, .table-striped>tbody>tr:nth-child(odd)>th { background-color: #000000; /* Default: #A7EAFF; */ color: #7a6565; /* Default: #333333; */ } .table-striped>tbody>tr:nth-child(even)>td, .table-striped>tbody>tr:nth-child(even)>th { background-color: #d9d4bf; /* Default: #FFFFFF; */ color: #000000; /* Default: #333333; */ } .sektion_ueberschrift_buchung { background-color: #6A876F; /* Default: #666666 */ } .sidebar_header, #historie_mehr_zukunft, #historie_mehr_vergangenheit, #historie_mehr_vergangenheit_modal, #historie_minimize, #historie_minimize_modal, #ozeiten { background-color: #4A4A48; /* Default: #666666 */ color: #ffffff; } .termin_zukunft { background-color: #e7ba35; /* Default: #00ff99; */ } .termin_vergangenheit { background-color: #ababab; /* Default: #ababab; */ } #slideit label.open { background: none repeat scroll 0 0 #6E8B74; /* Default: #0096d6; */ color: #ffffff; /* Default: #0096d6; */ } #slideit .nav-labels, #slideit input.send, #slideit a.reset-pass { background: none repeat scroll 0 0 #ababab; /* Default: #0096d6; */ } /* Slideit Login / Registration */ /* Schriftfarbe im Login und Registrierungsfenster */ /* Default #999999 */ #slideit a.reset-pass { color: #000000; /* Default: #999999; */ } #slideit input.send { color: #000000; /* Default: #999999; */ } #slideit input#login:checked ~ .nav-labels label.log-lb, #slideit input#register:checked ~ .nav-labels label.reg-lb { color: #000000; /* Default: #999999; */ } #slideit .nav-labels label { color: #ffffff; /* Default: #999999; */ } #slideit p.info { color: #000000; /* Default: #999999; */ } #slideit p.info.small { color: #000000; /* Default: #999999; */ } #slideit label.open:hover, #slideit label.open:focus, #slideit input.send:hover, #slideit input.send:focus, #slideit a.reset-pass:hover, #slideit a.reset-pass:focus { background: #9e9fa0; /* Default: #757786; */ color: #ffffff; /* Default: #0096d6; */ } #terms-open .terms-window span.title { background: none repeat scroll 0 0 #6E8B74; /* Default: #0096d6; */ color: #ffffff; /* Default: #0096d6; */ } /* --------------------------------------------------- SCHRIFTEN - Sidebar �berschrift - Sidebar n�chste Termine - Sidebar vergangene Termine - Dropdown Box - Sidebar Inhalte - Login Box - Login Header ------------------------------------------------------*/ .sidebar_header { color: #ffffff;} .termin_zukunft { color: #000000;} .termin_vergangenheit { color: #000000;} .sektion_ueberschrift_buchung { color: #ffffff;} /* Spezifische Regel für Accordion-Buttons um style.css zu überschreiben */ #dienstleistungen_accordion .accordion-button:not(.collapsed).sektion_ueberschrift_buchung { background-color: #6A876F; !important /* Überschreibt style.css und Bootstrap */ color: #ffffff; !important /* Überschreibt style.css und Bootstrap */ } /* Accordion-Text linksbündig ausrichten und Icons rechts positionieren */ #dienstleistungen_accordion .accordion-button { display: flex; justify-content: flex-start; align-items: center; } #dienstleistungen_accordion .accordion-text { text-align: left; } #sidebar_sektion_salon_adresse, #sidebar_sektion_salon_zeiten { color: #4E5E53;} /* ------------------------------------------------------ Eigenes Webdesigner-CSS aus den Einstellungen ------------------------------------------------------ */ /* ========================================================== RESPIRO Hair | Natural Spa e-cut Theme Version: 4.2 STABLE Stand: Juli 2026 Änderungen gegenüber 4.0 - Nur konservative Bereinigung - Offensichtlichen Testrest ohne Selektor entfernt - Keine funktionierenden Selektoren geändert - Keine Reihenfolge geändert - Keine doppelten Regeln entfernt ========================================================== *//*==========================================================RESPIRO Hair | Natural Spae-cut ThemeVersion: 4.0Stand: Juli 2026==========================================================/* ========================================================== RESPIRO Hair | Natural Spa e-cut Buchungsseite Version 3.1 ========================================================== *//* ========================================================== Farben ========================================================== */:root{ --respiro-green:#78A86A; --respiro-green-dark:#3F6F3C; --respiro-green-light:#EEF8EB; --respiro-green-hover:#BFD9B3; --badge-green:#679462;}/* ========================================================== Dienstleistungs-Badges ========================================================== */#selected_services_badges .service-badge,#selected_services_badges .service-badge.paket-badge{ background:var(--badge-green)!important; color:#fff!important; border:none!important; box-shadow:none!important;}/* ========================================================== Dienstleistungen ========================================================== */.dienstleistung-item,.dienstleistung-item *{ color:#000!important; }.dienstleistung-item{ cursor:pointer; transition:.18s ease; }.dienstleistung-item:not(.selected):hover{ background:var(--respiro-green-hover)!important; transform:translateY(-1px); box-shadow:0 3px 8px rgba(120,168,106,.18)!important;}.dienstleistung-item:not(.selected):hover .dienstleistung-name{ color:var(--respiro-green-dark)!important;}.dienstleistung-item.selected,.dienstleistung-item[data-wa="on"]{ background:var(--respiro-green-light)!important; border-left:4px solid var(--respiro-green)!important;}.dienstleistung-item.selected .dienstleistung-info,.dienstleistung-item[data-wa="on"] .dienstleistung-info{ background:transparent!important;}.dienstleistung-item.selected .dienstleistung-name,.dienstleistung-item[data-wa="on"] .dienstleistung-name{ color:var(--respiro-green-dark)!important; font-weight:600!important;}.dienstleistung-item.selected:hover,.dienstleistung-item[data-wa="on"]:hover{ background:var(--respiro-green-light)!important; transform:none!important; box-shadow:none!important;}.dienstleistung-item.selected::after,.dienstleistung-item[data-wa="on"]::after{ color:var(--respiro-green)!important; background:#fff!important;}.dienstleistung-item:focus,.dienstleistung-item:focus-visible,.dienstleistung-item:focus-within,.taet_checkbox:focus,.taet_checkbox:focus-visible{ outline:none!important; box-shadow:none!important;}/* ========================================================== Termine ========================================================== */.termine-grid-date{ color:var(--respiro-green-dark)!important; font-weight:700!important;}.termine-grid-block-label{ color:var(--respiro-green-dark)!important; font-weight:700!important;}.termine-grid-timeslot{ background:var(--respiro-green-light)!important; color:var(--respiro-green-dark)!important; border:none!important; box-shadow:none!important;}.termine-grid-timeslot:hover{ background:var(--respiro-green-hover)!important; color:var(--respiro-green-dark)!important;}.termine-grid-timeslot:focus,.termine-grid-timeslot:focus-visible,.termine-grid-timeslot:active{ outline:none!important; box-shadow:none!important;}/* ========================================================== Bootstrap ========================================================== */.border-primary{ border-color:var(--respiro-green)!important; }.text-primary{ color:var(--respiro-green)!important; }.btn-primary{ background:var(--respiro-green)!important; border-color:var(--respiro-green)!important;}.btn-primary:hover{ background:var(--respiro-green-dark)!important; border-color:var(--respiro-green-dark)!important;}html body #selected_services_badges .service-badge,html body #selected_services_badges .service-badge.paket-badge{ background:#679462 !important; background-color:#679462 !important; color:#fff !important;}html body #selected_services_badges .service-badge .remove-service,html body #selected_services_badges .service-badge button,html body #selected_services_badges .service-badge .close{ color:#fff !important;}/* Häkchen in Respiro-Grün */html body .dienstleistung-item.selected::after,html body .dienstleistung-item[data-wa="on"]::after{ color:#78A86A !important; background:#fff !important; border:2px solid #78A86A !important;}/* Ausgewählte Dienstleistung hervorheben */html body .dienstleistung-item.selected,html body .dienstleistung-item[data-wa="on"]{ border-left:8px solid #78A86A !important; box-shadow:inset 2px 0 0 #3F6F3C !important;}/* Termin-Hover in Respiro-Grün */html body .termine-grid-timeslot:hover{ background:#78A86A !important; background-color:#78A86A !important; color:#fff !important; border-color:#78A86A !important; transform:translateY(-1px); box-shadow:0 3px 8px rgba(120,168,106,.25) !important;}/* ========================================================== Buchungsfenster Respiro ========================================================== *//* Kopfbereich */html body .booking-ticket-header{ background:#d1b053!important; background-image:none !important; color:#fff !important;}/* Überschrift */html body .booking-ticket-header h4,html body .booking-ticket-header h5,html body .booking-ticket-header,html body #term_vorschlag_datum{ color:#fff !important;}/* Zusammenfassung */html body .booking-ticket-body{ background:#fff !important;}/* Trennlinie */html body .booking-ticket-divider{ background:#78A86A !important;}/* Footer */html body .modal-footer{ background:#F8FBF7 !important; border-top:1px solid #D9ECD1 !important;}/* Modal */html body .modal-content{ border-radius:16px !important; overflow:hidden !important; border:none !important; box-shadow:0 12px 30px rgba(63,111,60,.18) !important;}.booking-ticket-body strong{ color:#6E8B74 !important; font-weight:700;}/* Schrift und Links im Buchungsfenster */html body .booking-ticket-message-btn,html body .booking-ticket-message-btn:link,html body .booking-ticket-message-btn:visited,html body .booking-ticket-message-btn:hover{ color:#6E8B74 !important; text-decoration:none !important;}html body .modal-content a{ color:#6E8B74 !important;}html body .modal-content a:hover{ color:#58715D !important;}/* ========================================================== RESPIRO - Buchungsfenster Feinschliff ========================================================== *//* Modal */html body .modal-content{ border-radius:16px !important; overflow:hidden !important; border:none !important; box-shadow:0 12px 30px rgba(63,111,60,.18) !important;}/* Kopf */html body .booking-ticket-header{ background:#6E8B74 !important; background-image:none !important; color:#fff !important;}/* Überschrift im Modal */html body .modal-title{ color:#3F4F42 !important; font-size:1.8rem !important; font-weight:600 !important; letter-spacing:.3px;}/* Text im Buchungsfenster */html body .booking-ticket-body,html body .booking-ticket-body *{ color:#3F4F42 !important;}/* Icons */html body .booking-ticket-icon,html body .booking-ticket-body i,html body .booking-ticket-body svg,html body .booking-ticket-body .bi{ color:#6E8B74 !important; fill:#6E8B74 !important;}/* Durchschnittspreis hervorheben */html body .booking-ticket-body strong{ color:#6E8B74 !important; font-weight:700 !important;}/* "Nachricht hinzufügen" */html body .booking-ticket-message-btn,html body .booking-ticket-message-btn:hover{ color:#6E8B74 !important; text-decoration:none !important;}/* Links */html body .modal-body a{ color:#6E8B74 !important; font-weight:600 !important; text-decoration:none !important;}html body .modal-body a:hover{ text-decoration:underline !important;}/* AGB / Widerruf */html body .modal-body label,html body .modal-body p,html body .modal-body li{ color:#3F4F42 !important; font-weight:500 !important; line-height:1.5 !important;}/* Checkboxen */html body .modal-body input[type="checkbox"]{ accent-color:#6E8B74 !important;}/* Überschrift */html body .modal-title{ color:#3F4F42 !important; font-size:1.35rem !important; font-weight:600 !important; line-height:1.2 !important;}html body .btn-primary{ background:#78A86A !important; border:none !important; border-radius:10px !important; font-weight:600 !important; letter-spacing:.2px; box-shadow:0 4px 10px rgba(120,168,106,.20) !important;}html body .btn-primary:hover{ background:#58715D !important; transform:translateY(-1px); box-shadow:0 6px 14px rgba(88,113,93,.25) !important;}/* Buchungsbutton */html body .modal-footer .btn,html body .modal-footer button,html body .modal-footer .btn-primary{ background:#78A86A !important; border:none !important; border-radius:10px !important; min-height:44px !important; color:#fff !important; font-weight:600 !important; box-shadow:0 4px 10px rgba(120,168,106,.20) !important;}html body .modal-footer .btn:hover,html body .modal-footer button:hover,html body .modal-footer .btn-primary:hover{ background:#58715D !important;}/* ========================================================== Footer-Links Respiro ========================================================== */html body #impressum_datenschutz_links_container a,html body #impressum_datenschutz_links_container a:link,html body #impressum_datenschutz_links_container a:visited{ color:#78A86A !important; text-decoration:none !important;}html body #impressum_datenschutz_links_container a:hover{ color:#58715D !important; text-decoration:underline !important;}/* ========================================================== Mobile Optimierung Buchungsfenster ========================================================== */@media (max-width: 768px){ html body .modal-dialog{ margin:.5rem !important; } html body .modal-content{ border-radius:12px !important; } html body .modal-title{ font-size:1.1rem !important; line-height:1.2 !important; } html body .booking-ticket-body, html body .booking-ticket-body *{ font-size:.92rem !important; line-height:1.4 !important; } html body .booking-ticket-body strong{ font-size:1rem !important; } html body .modal-footer .btn{ width:100% !important; min-height:48px !important; }}/* ========================================================== RESPIRO ? Kundenprofil ========================================================== *//* Karten */#modalProfil .filter-card{ background:#FFFFFF !important; border:1px solid #E2E8E0 !important; border-radius:16px !important; box-shadow:0 8px 24px rgba(63,79,66,.08) !important; padding:1.35rem !important; margin-bottom:1.4rem !important;}/* Überschrift */#modalProfil .filter-card-header{ display:flex !important; align-items:center !important; gap:.65rem !important; background:linear-gradient(90deg,#EEF8EB 0%,#F8FBF7 100%) !important; border-left:5px solid #78A86A !important; border-radius:12px !important; padding:.85rem 1rem !important; margin:-.35rem -.35rem 1.25rem -.35rem !important; color:#3F4F42 !important; font-size:1.08rem !important; font-weight:600 !important;}/* Alles in der Überschrift */#modalProfil .filter-card-header,#modalProfil .filter-card-header *,#modalProfil .filter-card-header a,#modalProfil .filter-card-header span,#modalProfil .filter-card-header strong{ color:#3F4F42 !important; text-decoration:none !important;}/* Icon */#modalProfil .filter-card-header i,#modalProfil .filter-card-header svg{ color:#78A86A !important; fill:#78A86A !important; font-size:1.25rem !important;}/* Feldbezeichnungen */#modalProfil label{ color:#3F4F42 !important; font-weight:600 !important; margin-bottom:.45rem !important;}/* Eingabefelder */#modalProfil .form-control{ border:1px solid #DCE8D8 !important; border-radius:12px !important; background:#FFFFFF !important; color:#3F4F42 !important; min-height:46px !important;}#modalProfil .form-control:focus{ border-color:#78A86A !important; box-shadow:0 0 0 .18rem rgba(120,168,106,.18) !important; outline:none !important;}/* Iconbox links */#modalProfil .input-group-text{ background:#F8FBF7 !important; border:1px solid #DCE8D8 !important; border-right:none !important; color:#78A86A !important; border-radius:12px 0 0 12px !important; min-width:48px; display:flex; align-items:center; justify-content:center;}/* Abstand zwischen Feldern */#modalProfil .mb-4,#modalProfil .mb-3{ margin-bottom:1.25rem !important;}/* Mobile */@media (max-width:768px){ #modalProfil .filter-card{ padding:1rem !important; } #modalProfil .filter-card-header{ font-size:1rem !important; padding:.75rem .9rem !important; } #modalProfil .form-control{ min-height:42px !important; font-size:.95rem !important; }}/* Respiro Filter CSS v1.0 */html body #modalFilter .modal-content{border:none;border-radius:18px;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.15);}html body #modalFilter .filter-card{background:#fff;border-left:4px solid #78A86A;border-radius:14px;margin-bottom:18px;box-shadow:0 3px 12px rgba(0,0,0,.06);}html body #modalFilter .filter-card-header{background:#F8FBF7;color:#3F4F42!important;font-weight:600;padding:14px 18px;border-bottom:1px solid #E5EEE3;}html body #modalFilter .filter-card-header *,html body #modalFilter .filter-card-header span{color:#3F4F42!important;}html body #modalFilter .filter-card-header i{color:#78A86A!important;}html body #modalFilter input,html body #modalFilter select{border:1px solid #D8E4D4;border-radius:10px;padding:.65rem .8rem;transition:.2s;}html body #modalFilter input:focus,html body #modalFilter select:focus{border-color:#78A86A;box-shadow:0 0 0 .18rem rgba(120,168,106,.18);outline:none;}html body #modalFilter .form-check-input{border:1px solid #C8D9C2!important;border-radius:.35rem!important;background-color:#fff!important;}html body #modalFilter .form-check-input:checked{background-color:#6E8B74!important;border-color:#6E8B74!important;}html body #modalFilter .btn-toggle,html body #modalFilter .btn-outline-primary{background:#F8FBF7!important;border:1px solid #CFE0CA!important;color:#3F4F42!important;border-radius:10px!important;}html body #modalFilter .btn-toggle.active,html body #modalFilter .btn-check:checked + .btn-outline-primary,html body #modalFilter .btn-outline-primary.active{background:#78A86A!important;border-color:#78A86A!important;color:#fff!important;}html body #modalFilter .btn-primary{background:#78A86A!important;border-color:#78A86A!important;}html body #modalFilter .btn-primary:hover{background:#58715D!important;border-color:#58715D!important;}@media (max-width:768px){html body #modalFilter .filter-card{margin-bottom:14px;}html body #modalFilter .filter-card-header{padding:12px 15px;}html body #modalFilter .btn-outline-primary{margin-bottom:6px;}}/* Termineübersicht */html body .modal-header.bg-primary{ background:#78A86A!important; border-bottom:none!important;}html body .modal-header.bg-primary .modal-title,html body .modal-header.bg-primary i,html body .modal-header.bg-primary svg,html body .modal-header.bg-primary .btn-close{ color:#fff!important;}html body .modal-header.bg-primary .btn-close{ filter:brightness(0) invert(1);}/* ========================================================== Sidebar ? E-Mail-Link Respiro ========================================================== */html body #sidebar_left a[href^="mailto:"],html body #sidebar_left a[href^="mailto:"]:link,html body #sidebar_left a[href^="mailto:"]:visited{ color:#6E8B74 !important; text-decoration:none !important;}html body #sidebar_left a[href^="mailto:"]:hover{ color:#58715D !important; text-decoration:underline !important;}#modalLogin .modal-header{ background:#78A86A!important; color:#fff!important; border-bottom:none!important;}#modalLogin .modal-title,#modalLogin .modal-header i{ color:#fff!important;}#modalLogin .btn-close{ filter:brightness(0) invert(1);}/* ========================================================== Login / Registrierung Tabs ========================================================== */html body #modalLogin .nav-tabs .nav-link{ color:#6E8B74 !important;}html body #modalLogin .nav-tabs .nav-link:hover{ color:#58715D !important;}html body #modalLogin .nav-tabs .nav-link.active{ color:#3F4F42 !important; background:#F8FBF7 !important; border-color:#DCE8D8 !important; border-bottom:3px solid #78A86A !important;}/* ========================================================== DSGVO Kartenkopf ? Respiro Gold ========================================================== */html body #modal_ds_formular #kommunikation_section .card-header.bg-primary,html body #modal_ds_formular #marketing_section .card-header.bg-primary{ background:linear-gradient(90deg,#FFFCF5 0%,#FFF7EA 100%) !important; background-color:#FFF7EA !important; background-image:none !important; border:none !important; border-bottom:1px solid #F2E5C5 !important;}/* komplette Schrift */html body #modal_ds_formular #kommunikation_section .card-header.bg-primary,html body #modal_ds_formular #kommunikation_section .card-header.bg-primary *,html body #modal_ds_formular #marketing_section .card-header.bg-primary,html body #modal_ds_formular #marketing_section .card-header.bg-primary *{ color:#8A6500 !important; fill:#8A6500 !important;}/* text-white komplett neutralisieren */html body #modal_ds_formular .card-header.text-white,html body #modal_ds_formular .card-header.text-white *{ color:#8A6500 !important;}/* ========================================================== RESPIRO Hair | Natural Spa Datenschutz / Kommunikation Finale Version 1.0 ========================================================== *//* ---------------------------------------------------------- Karten---------------------------------------------------------- */html body #modal_ds_formular #kommunikation_section .card,html body #modal_ds_formular #marketing_section .card{ background:#FFFDFB !important; border:1px solid #E7D6A6 !important; border-radius:16px !important; overflow:hidden !important; box-shadow:0 6px 18px rgba(210,170,80,.05) !important; margin-bottom:1.6rem !important;}/* ---------------------------------------------------------- Kartenkopf---------------------------------------------------------- */html body #modal_ds_formular #kommunikation_section .card-header.bg-primary,html body #modal_ds_formular #marketing_section .card-header.bg-primary{ background:linear-gradient(90deg,#FFFCF5 0%,#FFF7EA 100%) !important; background-color:#FFF7EA !important; background-image:none !important; border:none !important; border-bottom:1px solid #E7D6A6 !important;}/* ---------------------------------------------------------- Überschriften---------------------------------------------------------- */html body #modal_ds_formular .card-header h5,html body #modal_ds_formular .card-header small,html body #modal_ds_formular .card-header i,html body #modal_ds_formular .card-header svg,html body #modal_ds_formular .card-header.text-white,html body #modal_ds_formular .card-header.text-white *{ color:#8A6500 !important; fill:#8A6500 !important;}/* ---------------------------------------------------------- Karteninhalt---------------------------------------------------------- */html body #modal_ds_formular .card-body{ background:#FFFDFB !important;}/* ---------------------------------------------------------- DSGVO Auswahlfelder---------------------------------------------------------- */html body #modal_ds_formular .dsgvo-tile{ background:#FFFFFF !important; border:2px solid #D4AF37 !important; border-radius:14px !important; color:#8A6500 !important; transition:all .20s ease; box-shadow:none !important;}/* Bootstrap border-primary überschreiben */html body #modal_ds_formular .dsgvo-tile.border-primary{ border-color:#D4AF37 !important;}/* Hover */html body #modal_ds_formular .dsgvo-tile:hover{ background:#FFF8EB !important; border-color:#C99B2A !important;}/* Ausgewählt */html body #modal_ds_formular .dsgvo-tile.selected{ background:#FFF6E5 !important; border-color:#C99B2A !important;}/* Schrift */html body #modal_ds_formular .dsgvo-tile,html body #modal_ds_formular .dsgvo-tile span,html body #modal_ds_formular .dsgvo-tile label{ color:#8A6500 !important;}/* Icons */html body #modal_ds_formular .dsgvo-tile i,html body #modal_ds_formular .dsgvo-tile .fas,html body #modal_ds_formular .dsgvo-tile svg{ color:#A97900 !important; fill:#A97900 !important; transform:none !important;}/* Auch im ausgewählten Zustand */html body #modal_ds_formular .dsgvo-tile.selected i,html body #modal_ds_formular .dsgvo-tile.selected .fas,html body #modal_ds_formular .dsgvo-tile.selected svg{ color:#A97900 !important; fill:#A97900 !important; transform:none !important;}/* ---------------------------------------------------------- Fokus---------------------------------------------------------- */html body #modal_ds_formular .dsgvo-tile:focus{ outline:none !important; box-shadow:0 0 0 .18rem rgba(212,175,55,.18) !important;}/* ---------------------------------------------------------- Abstand---------------------------------------------------------- */html body #modal_ds_formular #kommunikation_section{ margin-top:1rem;}/* Ausgewählte Kommunikationsbuttons */html body #modal_ds_formular .dsgvo-tile.selected,html body #modal_ds_formular .dsgvo-tile.selected *,html body #modal_ds_formular .dsgvo-tile.selected span,html body #modal_ds_formular .dsgvo-tile.selected label,html body #modal_ds_formular .dsgvo-tile.selected i,html body #modal_ds_formular .dsgvo-tile.selected svg{ color:#8A6500 !important; fill:#8A6500 !important;}/* ========================================================== Login ? Fokus der Eingabefelder ========================================================== */html body #modalLogin .form-control:focus,html body #modalLogin .form-select:focus,html body #modalLogin input:focus{ border-color:#78A86A !important; box-shadow:0 0 0 .18rem rgba(120,168,106,.15) !important; outline:none !important;}/* ========================================================== RESPIRO MOBILE Login | Registrierung | Passwort FINAL========================================================== */@media (max-width:767.98px){ /* ---------- Tabs ---------- */ html body #modalLogin .nav-tabs{ border-bottom:1px solid #DCE8D8!important; } html body #modalLogin .nav-tabs .nav-link{ background:#ffffff!important; color:#58715D!important; border:none!important; border-bottom:3px solid transparent!important; border-radius:0!important; box-shadow:none!important; outline:none!important; transition:.25s; } html body #modalLogin .nav-tabs .nav-link:hover{ background:#F8FBF7!important; color:#58715D!important; } html body #modalLogin .nav-tabs .nav-link.active{ background:#E6F1E2!important; color:#3F4F42!important; border:none!important; border-bottom:3px solid #78A86A!important; box-shadow:none!important; outline:none!important; } html body #modalLogin .nav-tabs .nav-link.active:hover, html body #modalLogin .nav-tabs .nav-link.active:focus, html body #modalLogin .nav-tabs .nav-link.active:active{ background:#E6F1E2!important; color:#3F4F42!important; border:none!important; border-bottom:3px solid #78A86A!important; box-shadow:none!important; outline:none!important; } html body #modalLogin .nav-tabs .nav-link span, html body #modalLogin .nav-tabs .nav-link i{ color:inherit!important; fill:currentColor!important; } /* ---------- Eingabefelder ---------- */ html body #modalLogin .form-control, html body #modalLogin .form-select, html body #modalLogin .input-group-text{ border-color:#DCE8D8!important; box-shadow:none!important; } html body #modalLogin .form-control:focus, html body #modalLogin .form-select:focus{ border-color:#78A86A!important; box-shadow:0 0 0 .15rem rgba(120,168,106,.15)!important; } /* ---------- Buttons ---------- */ html body #modalLogin .btn-success{ background:#78A86A!important; border-color:#78A86A!important; } html body #modalLogin .btn-success:hover{ background:#58715D!important; border-color:#58715D!important; }}/* /* ========================================================== RESPIRO FINAL THEME Bootstrap Override ========================================================== */:root{ --respiro-green:#78A86A; --respiro-green-dark:#58715D; --respiro-text:#3F4F42; --respiro-border:#D9C89A; --respiro-bg:#FCFBF7; --respiro-card:#FDF9EF;}/* ---------------------------------------------------------- Outline Buttons---------------------------------------------------------- */html body .btn-outline-primary{ color:var(--respiro-green) !important; border:2px solid var(--respiro-green) !important; background:#fff !important; box-shadow:none !important;}html body .btn-outline-primary:hover,html body .btn-outline-primary:focus,html body .btn-outline-primary:active{ color:#fff !important; background:var(--respiro-green) !important; border-color:var(--respiro-green) !important; box-shadow:none !important;}/* Bootstrap Variablen */html body .btn-outline-primary{ --bs-btn-color:var(--respiro-green); --bs-btn-border-color:var(--respiro-green); --bs-btn-hover-color:#fff; --bs-btn-hover-bg:var(--respiro-green); --bs-btn-hover-border-color:var(--respiro-green); --bs-btn-active-color:#fff; --bs-btn-active-bg:var(--respiro-green-dark); --bs-btn-active-border-color:var(--respiro-green-dark); --bs-btn-focus-shadow-rgb:120,168,106;}/* ---------------------------------------------------------- Links---------------------------------------------------------- */html body a,html body a:visited{ color:var(--respiro-green) !important;}html body a:hover{ color:var(--respiro-green-dark) !important;}/* ---------------------------------------------------------- Aktive Tabs---------------------------------------------------------- */html body .nav-tabs .nav-link.active{ background:#EEF6EC !important; color:var(--respiro-text) !important; border-color:var(--respiro-border) !important; border-bottom:3px solid var(--respiro-green) !important; box-shadow:none !important;}html body .nav-tabs .nav-link.active:hover{ background:#E6F1E4 !important; color:var(--respiro-text) !important;}/* ---------------------------------------------------------- Tab Icons---------------------------------------------------------- */html body .nav-tabs .nav-link.active i,html body .nav-tabs .nav-link.active svg{ color:var(--respiro-green) !important; fill:var(--respiro-green) !important;}/* ---------------------------------------------------------- Outline Cards---------------------------------------------------------- */html body .border-primary{ border-color:var(--respiro-border)!important;}/* ---------------------------------------------------------- Bootstrap Primary---------------------------------------------------------- */html body .text-primary{ color:var(--respiro-green)!important;}html body .bg-primary{ background:var(--respiro-green)!important;}html body #dienstleistungen_accordion .accordion-button:not(.collapsed) .accordion-text{ color:#ffffff !important;}/* ========================================================== RESPIRO Geöffnete Kategorie ========================================================== */html body #dienstleistungen_accordion .accordion-button:not(.collapsed){ background:#6E8B74 !important; border-color:#6E8B74 !important; color:#ffffff !important;}html body #dienstleistungen_accordion .accordion-button:not(.collapsed) .accordion-text{ color:#ffffff !important; font-weight:600 !important;}html body #dienstleistungen_accordion .accordion-button:not(.collapsed) .accordion-text *{ color:#ffffff !important;}/* Pfeil */html body #dienstleistungen_accordion .accordion-button:not(.collapsed)::after{ filter:brightness(0) invert(1) !important; opacity:1 !important;}----------------------------------aus hier-----------------/* Cleaned Respiro Sidebar CSS */html body #sidebar_left,html body #hide_no_session{border-radius:14px!important;overflow:hidden!important;}html body #main_title_header{font-size:17px!important;font-weight:600!important;border-radius:14px 14px 0 0!important;margin:0!important;border-bottom:1px solid rgba(255,255,255,.12)!important;}html body #hide_no_session{border-radius:0 0 14px 14px!important;margin-top:0!important;}html body #user_name_box,html body #filter_einblenden_btn,html body #terminhistorie_btn{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:18px!important;min-height:54px!important;padding:8px 24px!important;color:#fff!important;font-size:16px!important;font-weight:500!important;transition:background-color .2s ease!important;}html body #user_name_box,html body #filter_einblenden_btn{border-bottom:1px solid rgba(255,255,255,.14)!important;}html body #terminhistorie_btn{border-bottom:none!important;}html body #user_name_box i,html body #filter_einblenden_btn i,html body #terminhistorie_btn i,html body #user_name_box svg,html body #filter_einblenden_btn svg,html body #terminhistorie_btn svg{order:-1!important;flex:0 0 28px!important;width:28px!important;font-size:24px!important;margin-right:16px!important;color:#F3F7F2!important;}html body #user_name_box span,html body #filter_einblenden_btn span,html body #terminhistorie_btn span{flex:1!important;text-align:left!important;}html body #sidebar_left .sidebar_header:hover,html body #user_name_box:hover,html body #filter_einblenden_btn:hover,html body #terminhistorie_btn:hover{background:#60605D!important;cursor:pointer;}html body #sidebar_left .sidebar_header:hover *{color:#fff!important;background:transparent!important;}html body #user_name_box:active,html body #filter_einblenden_btn:active,html body #terminhistorie_btn:active{background:rgba(255,255,255,.10)!important;transform:scale(.98);}html body #dienstleistungen_accordion .accordion-item{border:1px solid #E8ECE7!important;border-radius:14px!important;box-shadow:0 3px 12px rgba(0,0,0,.04)!important;overflow:hidden;margin-bottom:12px!important;}html body .dienstleistung_aktiv,html body .service_selected{border-left:4px solid #78A86A!important;background:#F8FBF7!important;}html body #dienstleistungen_accordion{gap:10px;}---------------hier------------/* ========================================== Filter elegant hervorheben ========================================== */html body #filter_einblenden_btn{ padding-top:16px !important; padding-bottom:16px !important;}html body #user_name_box{ padding-bottom:14px !important;}html body #terminhistorie_btn{ padding-top:14px !important;}html body #filter_einblenden_btn span{ font-weight:600 !important; letter-spacing:.2px;}html body #filter_einblenden_btn i{ color:#78A86A !important;}/* ========================================== Premium Navigation ========================================== *//* normale Icons etwas dezenter */html body #user_name_box i,html body #terminhistorie_btn i{ color:#A8B0A9 !important;}/* Filter hervorheben */html body #filter_einblenden_btn{ padding-top:16px !important; padding-bottom:16px !important;}html body #filter_einblenden_btn span{ color:#78A86A !important; font-weight:600 !important; letter-spacing:.2px;}html body #filter_einblenden_btn i{ color:#78A86A !important; transform:scale(1.12);}/* Normale Navigation dezenter */html body #user_name_box,html body #terminhistorie_btn{ color:#A8B0A9 !important;}html body #user_name_box span,html body #terminhistorie_btn span{ color:#A8B0A9 !important;}html body #user_name_box i,html body #terminhistorie_btn i{ color:#A8B0A9 !important;}/* ========================================== Überschrift dezenter ========================================== */html body #main_title_header{ font-size:14px !important; font-weight:400 !important; min-height:48px !important; padding:10px 14px !important; display:flex !important; align-items:center !important; justify-content:center !important;}html body #main_title_header,html body #main_title_header *{ font-weight:400 !important;}----------------------hier----------/* ========================================== Linke Spalte als eine Premium-Karte ========================================== */html body #sidebar_left{ background:#4A4A48 !important; border-radius:16px !important; padding:0 0 18px 0 !important; overflow:hidden !important;}/* Abstand zwischen Navigation und Services */html body #dienstleistungen_accordion{ margin:18px 14px 0 14px !important;}/* Servicekarten */html body #dienstleistungen_accordion .accordion-item{ background:#ffffff !important; border:1px solid #E8ECE7 !important; border-radius:14px !important; margin-bottom:12px !important; overflow:hidden !important;}#subheadline{ display:block; max-width:980px; width:90%; margin:30px auto 40px auto; padding:30px 42px; border-radius:18px; text-align:center !important; font-size:17px; line-height:1.8; color:#3F4F42; font-weight:400; box-shadow:0 10px 24px rgba(0,0,0,.06); overflow:hidden;}/* /* ========================================================== RESPIRO Premium Hinweisbanner ========================================================== */ #subheadline{ display:block; width:85%; max-width:720px; margin:28px auto 34px auto; padding:16px 28px; border-radius:18px; text-align:center !important; color:#3F4F42; font-size:16px; line-height:1.3; font-weight:400; box-shadow:0 6px 18px rgba(0,0,0,.05); overflow:hidden; } #selected_services_badges .service-badge, #selected_services_badges .service-badge.paket-badge { background: none !important; background-color: #6A876F !important; /* wie .sektion_ueberschrift_buchung */; color: #ffffff !important; /* wie .sektion_ueberschrift_buchung */; } #selected_services_badges .service-badge .remove-service { color: #ffffff !important; /* wie .sektion_ueberschrift_buchung */; } #selected_mitarbeiter_badges .mitarbeiter-badge { background: none !important; background-color: #6A876F !important; /* wie .sektion_ueberschrift_buchung */; color: #ffffff !important; /* wie .sektion_ueberschrift_buchung */; } #selected_mitarbeiter_badges .mitarbeiter-badge .mitarbeiter-name { color: #ffffff !important; /* wie .sektion_ueberschrift_buchung */; } #selected_mitarbeiter_badges .mitarbeiter-badge .remove-mitarbeiter { color: #ffffff !important; /* wie .sektion_ueberschrift_buchung */; } /* Statistik-Farben für Meine Termine Modal */ #termine_zukunft_count { color: #e7ba35 !important; /* wie .termin_zukunft background-color */ } #termine_vergangenheit_count { color: #ababab !important; /* wie .termin_vergangenheit background-color */ } /* Icons für die Statistik-Karten */ .col-6:nth-child(1) .bi { color: #e7ba35 !important; /* wie .termin_zukunft background-color */ } .col-6:nth-child(2) .bi { color: #ababab !important; /* wie .termin_vergangenheit background-color */ } /* Login Button Farben aus Settings übernehmen */ #floating_login_btn.btn-primary { background-color: #6E8B74 !important; /* Hintergrundfarbe Login Button */ border-color: #6E8B74 !important; /* Rahmenfarbe Login Button */ color: #ffffff !important; /* Schriftfarbe Login Button */ min-height: 45px !important; /* Gleiche Höhe wie Barrierefreiheit Button */ height: 45px !important; /* Explizite Höhe wie Barrierefreiheit Button */ } #floating_login_btn.btn-primary:hover, #floating_login_btn.btn-primary:focus { /* Hover-Effekt: Etwas dunklere Variante der Login Button Farbe */ background-color: #6E8B74 !important; /* Hintergrundfarbe Login Button */ border-color: #6E8B74 !important; /* Rahmenfarbe Login Button */ color: #ffffff !important; /* Schriftfarbe Login Button */ opacity: 0.85; /* Leichter Transparenz-Effekt beim Hover */ } #floating_login_btn.btn-primary:active, #floating_login_btn.btn-primary.active { background-color: #6E8B74 !important; /* Hintergrundfarbe Login Button */ border-color: #6E8B74 !important; /* Rahmenfarbe Login Button */ color: #ffffff !important; /* Schriftfarbe Login Button */ opacity: 0.75; /* Noch stärkerer Transparenz-Effekt beim Klick */ } /* Auch die Icon-Farbe entsprechend anpassen */ #floating_login_btn.btn-primary i { color: #ffffff !important; /* Icon-Farbe wie Schriftfarbe */ } #floating_login_btn.btn-primary .btn-text { color: #ffffff !important; /* Text-Farbe wie Schriftfarbe */ } /* Logout Button Farben aus Settings übernehmen */ #floating_logout_btn.btn-danger { background-color: #6E8B74 !important; /* Hintergrundfarbe Login Button */ border-color: #6E8B74 !important; /* Rahmenfarbe Login Button */ color: #ffffff !important; /* Schriftfarbe Login Button */ min-height: 45px !important; /* Gleiche Höhe wie Barrierefreiheit Button */ height: 45px !important; /* Explizite Höhe wie Barrierefreiheit Button */ } #floating_logout_btn.btn-danger:hover, #floating_logout_btn.btn-danger:focus { /* Hover-Effekt: Etwas dunklere Variante der Login Button Farbe */ background-color: #6E8B74 !important; /* Hintergrundfarbe Login Button */ border-color: #6E8B74 !important; /* Rahmenfarbe Login Button */ color: #ffffff !important; /* Schriftfarbe Login Button */ opacity: 0.85; /* Leichter Transparenz-Effekt beim Hover */ } #floating_logout_btn.btn-danger:active, #floating_logout_btn.btn-danger.active { background-color: #6E8B74 !important; /* Hintergrundfarbe Login Button */ border-color: #6E8B74 !important; /* Rahmenfarbe Login Button */ color: #ffffff !important; /* Schriftfarbe Login Button */ opacity: 0.75; /* Noch stärkerer Transparenz-Effekt beim Klick */ } /* Auch die Icon-Farbe für Logout-Button entsprechend anpassen */ #floating_logout_btn.btn-danger i { color: #ffffff !important; /* Icon-Farbe wie Schriftfarbe */ } #floating_logout_btn.btn-danger .btn-text { color: #ffffff !important; /* Text-Farbe wie Schriftfarbe */ }