a, p, li, td, label {
    font-size: 1.1rem;
}

a, .btn-link {
    color: #00397a;
}

a:hover, a:focus, .btn-link:hover, .btn-link:focus {
    background-color: #00397a;
    color: white;
}

a#link-logo-guest:hover {
    background-color: transparent;
}

a#link-logo-guest:hover img {
    background-color: #00397a;
}

h1 {
    padding-bottom: 1rem;
}

h2 {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

img {
    max-width: 100%;
}

#change-data-form table tr td:first-child, #change-data-index table tr td:first-child {
    width: 20%;
}

#contact-page table tr td:first-child {
    width: 15%;
}

.card-header {
    background-color: white;
}

.thead, .table > :not(caption) > * > * {
    background-color: white!important;
}

.info-head {
    font-weight: bold;
    margin-bottom: 0;
}

#main-nav .nav-link {
    color: black;
    font-size: 1.2rem;
}

#mobile-nav a {
    font-size: 1.2rem;
}

#main-nav .active.nav-link, #main-nav .active.dropdown-item {
    background-color: transparent;
    font-weight: bolder;
}

#main-nav .dropdown-item {
    color: black;
}

#main-nav a.nav-link:hover, #main-nav .dropdown-item:hover, #main-nav a.nav-link:focus, #main-nav .dropdown-item:focus {
    background-color: black!important;
    color: white!important;
}

#breadcrumb {
    background-color: black;
    color: white;
    padding-top: 1rem;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
}

#breadcrumb ol {
    margin-bottom: 0;
}

#breadcrumb .breadcrumb-item, #breadcrumb .breadcrumb-item a {
    color: white!important;
    text-decoration: none;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: white!important;
}

@media (max-width: 500px) {
    a.navbar-brand {
        max-width: 75%;
    }
}

.navbar-brand:hover, .navbar-brand:focus {
    background-color: transparent!important;
}

.dropdown-toggle.without-icon::after {
    display: none !important;
}

/*#customer-portal-company-area #breadcrumb {*/
/*    background-color: black!important;*/
/*}*/

 .own-user-info .dropdown-menu {
     min-width: 250px;
     border: none;
     box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
     border-radius: 0.5rem;
 }
.own-user-info .dropdown-item {
    padding: 0.5rem 1rem;
}
.own-user-info .dropdown-item:active {
    background-color: #f8f9fa;
}
.own-user-info .user-info {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #eee;
    color: #333;
}
.own-user-info .user-name {
    font-weight: 600;
    margin-bottom: 0.25rem;
}
.own-user-info .user-email {
    font-size: 0.875rem;
    color: #666;
}

.info-and-action-card svg {
    width: 25px;
    height: auto;
}

/* Kundenchat Styles */
.chat-container {
    max-width: 900px;
    margin: 0 auto;
}

.chat-message {
    display: flex;
    margin-bottom: 1rem;
}

.chat-message-company {
    justify-content: flex-start;
}

.chat-message-company .card {
    background-color: #f8f9fa;
    border-left: 4px solid #0d6efd;
    max-width: 85%;
}

.chat-message-customer {
    justify-content: flex-end;
}

.chat-message-customer .card {
    background-color: #e7f3ff;
    border-right: 4px solid #198754;
    max-width: 85%;
}

@media (max-width: 768px) {
    .chat-message-company .card,
    .chat-message-customer .card {
        max-width: 100%;
    }
}



/* Chat Styling - Schwarz-Weiß Design */
#mailbox-chat .chat-container {
    max-width: 900px;
    margin: 0 auto;
}

#mailbox-chat .chat-message {
    display: flex;
    margin-bottom: 1.5rem;
}

#mailbox-chat .chat-message-company {
    justify-content: flex-start;
}

#mailbox-chat .chat-message-customer {
    justify-content: flex-end;
}

#mailbox-chat .chat-message-company .card {
    min-width: 35%!important;
    max-width: 75%;
    background: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 12px 12px 12px 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

#mailbox-chat .chat-message-customer .card {
    min-width: 35%!important;
    max-width: 75%;
    background: white;
    color: #212529;
    border: 1px solid #ced4da;
    border-radius: 12px 12px 4px 12px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

#mailbox-chat .chat-message-company .card-header {
    background: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    border-radius: 11px 11px 0 0;
    color: #495057;
}

#mailbox-chat .chat-message-customer .card-header {
    background: #dee2e6;
    border-bottom: 1px solid #ced4da;
    border-radius: 11px 11px 0 0;
    color: #495057;
}

#mailbox-chat .chat-message-company .card-footer {
    background: #f8f9fa;
    border-top: 1px solid #dee2e6;
    color: #6c757d;
}

#mailbox-chat .chat-message-customer .card-footer {
    background: #dee2e6;
    border-top: 1px solid #ced4da;
    color: #6c757d;
}

#mailbox-chat .chat-message-customer .card-body {
    color: #212529;
}

#mailbox-chat .chat-message-customer .card-body strong,
#mailbox-chat .chat-message-customer .card-body a {
    color: #212529;
}

/* Buttons */
/*
to-contract-button -> Vertragsübersicht zum vollen Vertrag
customer-button -> Buttons für die Kundenansicht
link-as-button -> link der wie ein Button aussieht
send-form-button -> Formulare absenden
*/

.customer-button {
    background-color: #000;
    color: #fff;
    border-radius: 0.5rem;
    border: 2px solid #000;
    transition: all 0.3s ease;
}

.customer-button:hover {
    background-color: #fff;
    color: #000;
    border-color: #000;
}

.toggle-offcanvas-button {
    background-color: #fff;
    color: #000;
    border-color: #000;
    font-weight: bold;
}

.toggle-offcanvas-button:hover {
    background-color: #000;
    color: #fff;
    border-color: #000;
}

.breadcrumb-link {
    color: white;
}

/* Slider für Abschlagsänderung */
#installment_slider::-webkit-slider-thumb {
    background-color: #000 !important;
}
#installment_slider::-moz-range-thumb {
    background-color: #000 !important;
}
#installment_slider::-ms-thumb {
    background-color: #000 !important;
}