/* Root Variables for Modernization */
:root {
    /* Colors */
    --primary-color: #19b0f7;
    --primary-hover: #1599d6;
    --text-color: #333;
    --text-muted: #666;
    --bg-color: #fff;
    --bg-alt: #f8f9fa;
    --border-color: #ddd;
    --shadow-sm: 0 2px 4px rgba(0,0,0,0.05);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.1);
    --shadow-lg: 0 10px 15px rgba(0,0,0,0.1);
    
    /* Status Colors */
    --status-green: #0a9109;
    --status-yellow: #d7b000;
    --status-red: #a80000;
    
    /* Fonts */
    --font-family-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    
    /* Transitions */
    --transition-base: all 0.2s ease-in-out;
}

/* Local Inter font */
@font-face {
    font-family: 'Inter';
    src: url('/fonts/Inter-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Inter 600 (SemiBold) */
@font-face {
    font-family: 'Inter';
    src: local('Inter SemiBold'), local('Inter-SemiBold'), local('Inter Display SemiBold'), local('InterDisplay-SemiBold'), url('/fonts/InterDisplay-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* Global font override */
html, body, h1, h2, h3, h4, h5, h6,
button, input, select, textarea,
.btn, .navbar, .modal, .form-control, .table,
.dropdown-menu, .popover, .tooltip, .panel, .panel-body,
.list-group, .label, .badge {
    font-family: var(--font-family-base) !important;
}

/* Material Icons Local */
@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url('/fonts/MaterialIcons-Regular.ttf') format('truetype');
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
}

@view-transition {
    navigation: auto;
}

.navbar-brand img {
    height: 100%;
}

/* Global Alert Overlay Wrapper: zentriert horizontal & vertikal */
#alert-overlay-wrapper {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 16px;
    pointer-events: none;
}

.alert-overlay {
    box-shadow: var(--shadow-lg);
    max-width: 90vw;
    pointer-events: auto;
}

.floatleft {
    float: left;
}

.rightspace20 {
    margin-right: 20px;
}

.rightspace10 {
    margin-right: 10px;
}

.clear {
    clear: both;
}

.colorblack {
    color: var(--text-color);
}

.positionRelative {
    position: relative;
}

.line-height30 {
    line-height: 30px;
}

.mailboxnewitem {
    width: 30px;
    height: 30px;
    display: block;
    background: transparent url(/img/mailbox_new.png) 0 0 no-repeat;
    background-size: contain;
    margin-top: -5px;
}

.gdprDeleteIcon {
    width: 20px;
    height: 20px;
    display: block;
    background: transparent url(/img/monitoring.png) 0 0 no-repeat;
    background-size: contain;
    margin-right: -70px;
    margin-top: -22px;
    }
.monitoringIcon {
    width: 20px;
    height: 20px;
    display: block;
    background: transparent url(/img/monitoring.png) 0 0 no-repeat;
    background-size: contain;
    margin-right: -70px;
    margin-top: -22px;
	padding-right: 10px;
}

.monitoringIcon-expired {
    filter: invert(20%) sepia(90%) saturate(3000%) hue-rotate(350deg) brightness(80%) contrast(110%);
    opacity: 0.9;
}

.monitoringPlusIcon {
    width: 20px;
    height: 20px;
    display: block;
    background: transparent url(/img/monitoring_plus.png) 0 0 no-repeat;
    background-size: contain;
    margin-right: -75px;
    margin-top: -22px;
	padding-right: 10px;
    }

.monitoringExtIcon {
    width: 20px;
    height: 20px;
    display: block;
    background: transparent url(/img/monitoring_ext.png) 0 0 no-repeat;
    background-size: contain;
    margin-right: -75px;
    margin-top: -22px;
	padding-right: 10px;
    }
.monitoringDisabledIcon {
    width: 24px;
    height: 24px;
    display: block;
    background: transparent url(/img/no-monitoring.png) 0 0 no-repeat;
    background-size: contain;
   margin-right: -75px;
    margin-top: -22px;
	padding-right: 10px;
    }
.trafficlight {
    width: 16px;
    height: 16px;
    display: block;
    background: transparent url(/img/trafficlight_gray.png) 0 0 no-repeat;
    background-size: contain;
}

.trafficlight-good {
    background: transparent url(/img/trafficlight_green.png) 0 0 no-repeat;
    background-size: contain;
}

.trafficlight-neutral {
    background: transparent url(/img/trafficlight_yellow.png) 0 0 no-repeat;
    background-size: contain;
}

.trafficlight-bad {
    background: transparent url(/img/trafficlight_red.png) 0 0 no-repeat;
    background-size: contain;
}

.margin0 {
    margin: 0px !important;
}

.archiveDetailsBox table.dataTable.margin0 {
    margin-bottom: 0px !important;
    margin-top: 0px !important;
}

.progress {
    margin-bottom: 0px;
}

.progress-bar-solvencyIndex {
    width: 9.82%;
}

.progress-bar-solvencyIndexClass {
    width: 16.5%;
}

.progress-bar-solvencyTrafficlightClass {
    width: 33%;
}

.progress-bar-solvencyTrafficLight-space {
    margin-right: 0.2%;
}

.progress-bar-solvencyIndex-space {
    margin-right: 0.2%;
}

/* Ampelauskunft */
.progress-bar-solvencyTrafficLightClass1 {
    background-image: linear-gradient(to right, var(--status-green) 0px, var(--status-green) 100%);
}

.progress-bar-solvencyTrafficLightClass2 {
    background-image: linear-gradient(to right, var(--status-yellow) 0px, var(--status-yellow) 100%);
}

.progress-bar-solvencyTrafficLightClass3 {
    background-image: linear-gradient(to right, var(--status-red) 0px, var(--status-red) 100%);
}

/* Ampelauskunft */

.progress-bar-solvencyIndex1 {
    background-image: linear-gradient(to right, var(--status-green) 0px, var(--status-green) 100%);
}

.progress-bar-solvencyIndex2 {
    background-image: linear-gradient(to right, #45a703 0px, #7dbd00 100%);
}

.progress-bar-solvencyIndex3 {
    background-image: linear-gradient(to right, #87c110 0px, #b6d410 100%);
}

.progress-bar-solvencyIndex4 {
    background-image: linear-gradient(to right, #b3d200 0px, #e9ea22 100%);
}

.progress-bar-solvencyIndex5 {
    background-image: linear-gradient(to right, #e5e300 0px, var(--status-yellow) 100%);
}

.progress-bar-solvencyIndex6 {
    background-image: linear-gradient(to right, #d6ad00 0px, #cc8100 100%);
}

.progress-bar-solvencyIndex7 {
    background-image: linear-gradient(to right, #ce8710 0px, #be4e00 100%);
}

.progress-bar-solvencyIndex8 {
    background-image: linear-gradient(to right, #bd4c00 0px, #b32600 100%);
}

.progress-bar-solvencyIndex9 {
    background-image: linear-gradient(to right, #b22100 0px, #b01600 100%);
}

.progress-bar-solvencyIndex10 {
    background-image: linear-gradient(to right, #b01600 0px, var(--status-red) 100%);
}

.progress-bar-solvencyIndexClass1 {
    background-image: linear-gradient(to right, #0a9109 0px, #2a9c00 100%);
}

.progress-bar-solvencyIndexClass2 {
    background-image: linear-gradient(to right, #35a207 0px, #5eb100 100%);
}

.progress-bar-solvencyIndexClass3 {
    background-image: linear-gradient(to right, #64b300 0px, #a5cc00 100%);
}

.progress-bar-solvencyIndexClass4 {
    background-image: linear-gradient(to right, #abcf00 0px, #e2d111 100%);
}

.progress-bar-solvencyIndexClass5 {
    background-image: linear-gradient(to right, #dec900 0px, #b42701 100%);
}

.progress-bar-solvencyIndexClass6 {
    background-image: linear-gradient(to right, #b22000 0px, #aa0101 100%);
}

.solvencyIndexBox, .solvencyIndexClassBox, . solvencyTrafficLightBox {
    margin-top: 5px;
}

.popover-solvencyIndex, .popover-solvencyIndexClass, .popover-solvencyTrafficLight {
    position: relative;
    display: block;
    margin: 0px;
    margin-bottom: 10px;
    margin-left: 0px;
}

.popover-solvencyIndex .popover, .popover-solvencyIndexClass .popover, .popover-solvencyTrafficLight .popover {
    position: relative;
    display: block;
    width: 100%;
    max-width: 100%;
    margin-left: -20px;
    margin: 0px;
    z-index: 0;
}

.popover-solvencyIndex .popover-content, .popover-solvencyIndexClass .popover-content, .popover-solvencyTrafficLight .popover-content {

}

.popover-solvencyIndex .popover.top > .arrow, .popover-solvencyIndexClass .popover.top > .arrow, .popover-solvencyTrafficLight .popover.top > .arrow {
    left: 20px;
}

.archiveDetailsBox .tab-pane.boxed {
    background-color: #fff;
    padding: 10px 0px;
}

.dropdown-menu > li > span {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: var(--text-color);
    white-space: nowrap;
    cursor: pointer;
}

.dropdown-menu > li > span:hover,
.dropdown-menu > li > span:focus {
    background-color: #e8e8e8;
    background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
    background-repeat: repeat-x;
}

.form-control.bureauDriverSelector {
    height: 22px;
    line-height: 1.0;
    padding: 0px 10px;
}

nobr {
    white-space: nowrap;
}

.padding0 {
    padding: 0px;
}

label.required:after {
    content: ' *';
    color: #c00;
}

label.error {
    color: #843534;
    font-weight: normal;
}

input[type="number"].mod::-webkit-outer-spin-button,
input[type="number"].mod::-webkit-inner-spin-button {
    -webkit-appearance: none;
    /*background: #FFF url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKUlEQVQYlWNgwAT/sYhhKPiPT+F/LJgEsHv37v+EMGkmkuImoh2NoQAANlcun/q4OoYAAAAASUVORK5CYII=) no-repeat center center;*/
    background: #FFF url('http://i.stack.imgur.com/YYySO.png') no-repeat 50% 50%;
    width: 10px;
    height: 10px;
    padding: 4px;
    border-left: 1px solid #01a8f7;
    opacity: 1; /* shows Spin Buttons per default (Chrome >= 39) */
    position: absolute;
    top: 0;
    right: 4px;
    bottom: 0;
}

input[type="number"].mod::-webkit-inner-spin-button:hover,
input[type="number"].mod::-webkit-inner-spin-button:active {
    box-shadow: 0 0 0 0 #BBB;
    opacity: 1;
}

.isDisabled {
    cursor: not-allowed;
    opacity: 0.5;
    }

.isDisabled > a {
    color: currentColor;
    display: inline-block;  /* For IE11/ MS Edge bug */
    pointer-events: none;
    text-decoration: none;
    }

a[aria-disabled="true"] {
    color: currentColor;
    display: inline-block;  /* For IE11/ MS Edge bug */
    pointer-events: none;
    text-decoration: none;
    }
/* Abstand zwischen dem "Zeige" Label und dem Select */
.dataTables_length label {
    display: flex;
    align-items: center;
    gap: 10px; /* z. B. 8px */
}

/* Styling für das Select-Menü mit Bootstrap-Klasse */
.dataTables_length select {
    width: auto;
    display: inline-block;
    margin: 0;
}
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
    margin-top: 1.5rem !important;  /* oder z. B. 32px */
}

/* ==============================
   DataTables pagination (Bootstrap 3): borderless look
   Scope: Only inside DataTables wrappers to avoid affecting other paginations
   Related: DataTables 1.13.x with dataTables.bootstrap integration
   ============================== */
.dataTables_wrapper .pagination>li>a,
.dataTables_wrapper .pagination>li>span {
  border: 0 !important;
  box-shadow: none;
  background-color: transparent;
}
.dataTables_wrapper .pagination>li>a:hover,
.dataTables_wrapper .pagination>li>span:hover {
  border: 0 !important;
  background-color: #f5f5f5; /* subtle hover without border */
}
.dataTables_wrapper .pagination>.active>a,
.dataTables_wrapper .pagination>.active>span,
.dataTables_wrapper .pagination>.active>a:hover,
.dataTables_wrapper .pagination>.active>span:hover,
.dataTables_wrapper .pagination>.active>a:focus,
.dataTables_wrapper .pagination>.active>span:focus {
  border: 0 !important;
  background-color: #337ab7; /* Bootstrap primary */
  color: #fff;
}
.dataTables_wrapper .pagination>.disabled>span,
.dataTables_wrapper .pagination>.disabled>span:hover,
.dataTables_wrapper .pagination>.disabled>span:focus,
.dataTables_wrapper .pagination>.disabled>a,
.dataTables_wrapper .pagination>.disabled>a:hover,
.dataTables_wrapper .pagination>.disabled>a:focus {
  border: 0 !important;
  background-color: transparent;
  color: #777;
}
/* Keep keyboard accessibility: visible focus ring */
.dataTables_wrapper .pagination>li>a:focus,
.dataTables_wrapper .pagination>li>span:focus {
  outline: 2px solid #66afe9;
  outline-offset: 0;
}


/* ==============================
   DataTables controls layout and pagination sizing (Bootstrap 3)
   Goal: pagination on the right; record count (info) and page-size (length) on the left; smaller pagination font
   Scope: Only inside DataTables wrappers
   ============================== */
/* Left-align info + length (record count and page-size) */
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_length {
  text-align: left;
}
/* Right-align pagination block */
.dataTables_wrapper .dataTables_paginate {
  text-align: right;
}
/* Reduce pagination font-size to 85% without changing clickable padding */
.dataTables_wrapper .dataTables_paginate .pagination {
  font-size: 1.0em;
}
/* Responsive: stack nicely on small screens */
@media (max-width: 767px) {
  .dataTables_wrapper .dataTables_info,
  .dataTables_wrapper .dataTables_paginate,
  .dataTables_wrapper .dataTables_length,
  .dataTables_wrapper .dataTables_filter {
    text-align: left;
  }
}


/* Typography: ensure <strong> and <b> render as Inter 600 */
strong, b {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Liberation Sans', sans-serif !important;
    font-weight: 600;
}