/*
- bleu turquoise : #63cbce : (99,203,206)
- bleu foncé : #3452ac : (52,82,172)
- rouge : #d01d26 : (208,29,38)
- jaune : #fad21b : (250,210,27)
- gris : #b9b8b8 : (185,184,184)
- vert : #70ad47 : (112, 173, 71)
- orange : #ffc000 : (255, 192, 0)
*/

.text-centered{
  text-align: center;
}

.notificationSeen{
  cursor: pointer;
}

/* Tooltip container */
.tip {
    position: relative;
    display: inline-block;
}
.nav>li>a:hover, .nav>li>a:focus {
  text-decoration: none;
  background-color: #eee;
}

.navbar-dp {
  background-color: #ffffff;
  margin-bottom: 0 !important;
}
.navbar-dp .navbar-text {
  color: #222222;
}
.nav > li > a {
  color: #222222;
}
.navbar-dp .nav > .active > a,
.navbar-dp .nav > .active > a:hover,
.navbar-dp .nav > .active > a:focus {
  color: #ffffff;
  background-color: #3452ac;
}
.navbar-dp .nav > .disabled > a,
.navbar-dp .nav > .disabled > a:hover,
.navbar-dp .nav > .disabled > a:focus {
  color: #444444;
}
.navbar-dp .navbar-toggle {
  border-color: #3452ac;
}
.navbar-dp .navbar-toggle:hover {
  background-color: #3452ac;
}
.navbar-dp .navbar-toggle .icon-bar {
  background-color: #3452ac;
}
.navbar-dp .navbar-toggle:hover .icon-bar {
  background-color: #ffffff;
}
.navbar-dp .navbar-collapse,
.navbar-dp .navbar-form {
  border-color: #101010;
}
.navbar-dp .nav > .open > a,
.navbar-dp .nav > .open > a:hover,
.navbar-dp .nav > .open > a:focus {
  color: #3452ac;
}
@media (max-width: 767px) {
  .navbar-dp .nav-pills .open .dropdown-menu > .dropdown-header {
    border-color: #dddddd;
  }
  .navbar-dp .nav-pills .open .dropdown-menu .divider {
    background-color: #dddddd;
  }
  .navbar-dp .nav-pills .open .dropdown-menu > li > a {
    color: #222222;
  }
  .navbar-dp .nav-pills .open .dropdown-menu > li > a:hover,
  .navbar-dp .nav-pills .open .dropdown-menu > li > a:focus {
    color: #3452ac;
    background-color: transparent;
  }
  .navbar-dp .nav-pills .open .dropdown-menu > .active > a,
  .navbar-dp .nav-pills .open .dropdown-menu > .active > a:hover,
  .navbar-dp .nav-pills .open .dropdown-menu > .active > a:focus {
    color: #3452ac;
    background-color: #080808;
  }
  .navbar-dp .nav-pills .open .dropdown-menu > .disabled > a,
  .navbar-dp .nav-pills .open .dropdown-menu > .disabled > a:hover,
  .navbar-dp .nav-pills .open .dropdown-menu > .disabled > a:focus {
    color: #444;
    background-color: transparent;
  }
}
.navbar-dp .navbar-link {
  color: #222222;
}
.navbar-dp .navbar-link:hover {
  color: #3452ac;
}
.navbar-dp .btn-link {
  color: #222222;
}
.navbar-dp .btn-link:hover,
.navbar-dp .btn-link:focus {
  color: #3452ac;
}
.navbar-dp .btn-link[disabled]:hover,
fieldset[disabled] .navbar-dp .btn-link:hover,
.navbar-dp .btn-link[disabled]:focus,
fieldset[disabled] .navbar-dp .btn-link:focus {
  color: #444;
}

.nav-pills>li.currentView>a{
  background-color: #f5f5f5;
  border-style: solid;
  border-width: 0.063rem;
  border-color: #ddd;
}

.thead-dp{
  background-color: #3452ac;
  color: white;
}
.c{
  border-style: solid;
  border-width: 0.188rem;
  padding: 0.313rem;
  text-align: center;
}
.c-small{
  width: 6.25rem;
  text-align: center;
}
.c-0-white{
  font-weight: bold;
  background-color: #fff;
  border-color: #fff;
}
.c-0-dark{
  font-weight: bold;
  background-color: #ccc;
  border-color: #fff;
}
.c-1-dark{
  font-weight: bold;
  background-color: #b6d7a8;
  border-color: #fff;
}
.c-2-dark{
  font-weight: bold;
  background-color: #a2c4c9;
  border-color: #fff;
}
.c-3-dark{
  font-weight: bold;
  background-color: #9fc5e8;
  border-color: #fff;
}
.c-4-dark{
  font-weight: bold;
  background-color: #d5a6bd;
  border-color: #fff;
}
.c-5-dark{
  font-weight: bold;
  background-color: #ffe599;
  border-color: #fff;
}
.c-0-light{
  background-color: #ddd;
  border-color: #fff;

}
.c-1-light{
  background-color: #d9ead3;
  border-color: #fff;
  text-align: center;
}
.c-2-light{
  background-color: #d0e0e3;
  border-color: #fff;
  text-align: center;
}
.c-3-light{
  background-color: #cfe2f3;
  border-color: #fff;
  text-align: center;
}
.c-4-light{
  background-color: #ead1dc;
  border-color: #fff;
  text-align: center;
}
.c-5-light{
  background-color: #fff2cc;
  border-color: #fff;
  text-align: center;
}
.img-modal{
  max-width: 100%;
  max-height: 100%;
}
.modal-body-img{
  text-align: center;
}
.modal-body{
  max-height: 80vh;
  overflow-y: auto;
}

.centering-object {
  text-align: center;
}
.centered-object {
  position: absolute;
  top: 25%;
}

@media (max-width: 991px) {
  .fixed-left{
    margin-bottom: 3.125rem;
  }
}
@media (min-width: 992px) {
  .fixed-left{
    position: fixed;
    overflow-y: auto;
  }
  .fixed-right{
    position: fixed;
    overflow-y: auto;
    padding-left: 0.313rem;
    padding-right: 0.313rem;
  }
  .left-bordered{
    border-left: 0.063rem solid #eee;
    overflow: auto !important;
  }
  .right-bordered{
    border-right: 0.063rem solid #eee;
  }
  .bottom-bordered{
    border-bottom: 0.063rem solid #eee;
  }
  .top-bordered{
    border-top: 0.063rem solid #eee;
  }
}

.errorMessage{
  display: block;
  padding: 0.313rem;
  text-align: center;
  background-color: #d01d26;
  color: white;
  font-weight: bold;
  font-size: 1.875rem;
}

.documentation-body h1,
.documentation-body h2,
.documentation-body h3,
.documentation-body h4 {
  color: #3452ac;
  font-weight: bold;
  margin-top: 1rem;
}

.bad-trend-value{
  color: red !important;/*#d01d26;*/
}

.good-trend-value{
  color: green !important;/*#70ad47;*/
}

/*===== For checkbox input style =====*/
.sliderSwitch {
  position: relative;
  display: inline-block;
  width: 2rem;
  height:  1rem;
  margin-bottom: 0;
}
.sliderSwitch input {display:none;}
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #b9b8b8;
  -webkit-transition: .4s;
  transition: .4s;
}
.slider:before {
  position: absolute;
  content: "";
  height: 0.75rem;
  width: 0.75rem;
  left: 0.125rem;
  bottom: 0.125rem;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}
input:checked + .slider {
  background-color: #3452ac;
}
input:focus + .slider {
  box-shadow: 0 0 0.063rem #3452ac;
}
input:checked + .slider:before {
  -webkit-transform: translateX( 1rem);
  -ms-transform: translateX( 1rem);
  transform: translateX( 1rem);
}
.form-control-inset-dark-blue:focus {
    border-color: rgba(52, 82, 172, 0.5) !important;
    outline: 0 !important;
    box-shadow: inset 0 0 0.313rem rgba(52, 82, 172, 0.75) !important;
}
.slider.round {
  border-radius: 2.125rem;
}
.slider.round:before {
  border-radius: 50%;
}
.checkBoxLabel {
  font-weight: normal;
}
button {
  white-space: normal !important;
}
.lightBackgroundColor{
  background-image: linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0.5),
    rgba(255, 255, 255, 0.5)
  );
}
.deactivatedItem *, .disabledObject *, .unreliableObject *{
  font-style: italic !important;
  color: #b9b8b8 !important;
}
.disabledItem td{
  font-style: italic !important;
  color: #d01d26 !important;
}
.unreliableRequest{
  color: rgb(208, 29, 38) !important;
}
.reliableRequest{
  color: rgb(52, 82, 172) !important;
}

.home-a{
  padding: 0.313rem !important;
}

.notificationRowSeen{
  font-style: italic;
  opacity: 0.6;
}
.notificationRowUnSeen{
  font-weight: bold;
}
.multi-select option {
  font-family: Consolas, monospace;
}

.keywordsFilter {
  font-family: Consolas, monospace;
}

.dateFilter {
  font-family: Consolas, monospace;
}

.autocomplete-suggestions {
  font-family: Consolas, monospace;
  font-size: 0.875rem;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border: 0.063rem solid #999;
  background: #FFF;
  cursor: default;
  overflow: auto;
  -webkit-box-shadow: 0.063rem 0.25rem 0.188rem rgba(50, 50, 50, 0.64);
  -moz-box-shadow: 0.063rem 0.25rem 0.188rem rgba(50, 50, 50, 0.64);
  box-shadow: 0.063rem 0.25rem 0.188rem rgba(50, 50, 50, 0.64);
}
.autocomplete-suggestion {
  padding: 0.125rem 0.313rem;
  white-space: nowrap;
  overflow: hidden;
}
.autocomplete-no-suggestion {
  padding: 0.125rem 0.313rem;
}
.autocomplete-selected {
  background: #F0F0F0;
}
.autocomplete-suggestions strong {
  font-weight: bold;
  color: #3452ac;
}
.autocomplete-group {
  padding: 0.125rem 0.313rem;
  font-weight: bold;
  color: #000;
  display: block;
  border-bottom: 0.063rem solid #000;
}

.filter-tile{
  height: 6.563rem;
}
.active-filter-tile{
  box-shadow: 0 0 0.313rem 0.063rem rgba(52, 82, 172, 1) !important;
}
.btn-active{
  background-color: #3452ac !important;
  color: #ffffff !important;
}
.btn-active:hover{
 cursor:default !important;
}

.nav-tabs>li{
  border-bottom: 0;
}

.nav-tabs>li.active>a{
  font-weight: bold;
}

.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {
  vertical-align: middle !important;
}

.small-centered-form-control {
  text-align: center !important;
  height: auto !important;
  padding: 0.125rem 0.75rem !important;
}

.badge-blue{
  background-color: transparent !important;
  border: solid;
  border-width: 0.125rem;
  border-color: #3452ac;
  border-radius: 0.25rem !important;
  color: #3452ac !important;
  vertical-align: text-top !important;
}

.badge-danger{
  background-color: #f2dede !important;
  border: solid;
  border-width: 0.125rem;
  border-color: #ebccd1;
  border-radius: 0.25rem !important;
  color: #a94441 !important;
  vertical-align: text-top !important;
}

.badge-success{
  background-color: #dff0d8 !important;
  border: solid;
  border-width: 0.125rem;
  border-color: #d6e9c6;
  border-radius: 0.25rem !important;
  color: #3c763d !important;
  vertical-align: text-top !important;
}

.badge-dp-purple{
  background-color: #ece0f3 !important;
  border: solid;
  border-width: 0.125rem;
  border-color: #d7bde2;
  border-radius: 0.25rem !important;
  color: #76448a !important;
  vertical-align: text-top !important;
}

.badge-pool-selected-store{
  background-color: #d7bde2 !important;
  border: solid;
  border-width: 0.125rem;
  border-color: #c39bd3;
  border-radius: 0.25rem !important;
  color: #76448a !important;
  vertical-align: text-top !important;
}

.badge-pool-excluded-store{
  background-color: #d5d4d4 !important;
  border: solid;
  border-width: 0.125rem;
  border-color: #b9b8b8;
  border-radius: 0.25rem !important;
  color: #6f6e6e !important;
  vertical-align: text-top !important;
}

.badge-lg-white{
  color: white !important;
  background-color: #d01d26 !important;
  font-size:  1rem !important;
}

/* Styles for portfolio popover */
.highlighted-cell {
  box-shadow: 0 0 0.313rem 0.063rem rgba(52, 82, 172, 0.8) !important;
  background-color: rgba(52, 82, 172, 0.1) !important;
  border: 1px solid rgba(52, 82, 172, 0.5) !important;
}

#portfoliosPopover {
  max-width: 500px;
  box-shadow: 0 0.313rem 0.625rem rgba(0, 0, 0, 0.2);
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0.375rem;
}

#portfoliosPopover .popover-header {
  background-color: #f7f7f7;
  border-bottom: 1px solid #ebebeb;
  padding: 0.625rem;
  font-weight: 500;
}

#portfoliosPopover .popover-body {
  padding: 0.625rem;
  max-height: 300px;
  overflow-y: auto;
}

#portfoliosPopover .popover-footer {
  background-color: #f7f7f7;
  padding: 0.5rem;
}

#portfoliosPopover .popover-arrow {
  position: absolute;
  width: 1rem;
  height: 1rem;
  background-color: #fff;
  transform: rotate(45deg);
  left: -0.5rem;
  top: 1rem;
  border-left: 1px solid rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

/* Base Pill Shape */
.badge-pill {
    display: inline-block;
    padding: 0.35em 0.8em;
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 50rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Role badges — consistent pill shape + category colors (WCAG AA) */
.role-badge {
    border: 1px solid transparent;
    /* Roles must keep their original casing (no forced uppercase) */
    text-transform: none;
    letter-spacing: normal;
}

/* DPIM: Light green background with dark green text */
.role-dpim {
    background-color: var(--bs-success-bg-subtle, #d1e7dd) !important;
    color: var(--bs-success-text-emphasis, #0a3622) !important;
    border-color: var(--bs-success-border-subtle, #a3cfbb) !important;
}

/* Pooling: Purple background with white text (brand) */
.role-pooling {
    background-color: var(--bs-dp-purple, #9b59b6) !important;
    color: #ffffff !important;
    border-color: var(--bs-dp-purple-dark, #623475) !important;
}

/* Core: Solid black with white text */
.role-core {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #000000 !important;
}

/* DPOP: Warning orange background with dark text for readability */
.role-dpop {
    background-color: var(--bs-warning-bg-subtle, #fff3cd) !important;
    color: var(--bs-warning-text-emphasis, #664d03) !important;
    border-color: var(--bs-warning-border-subtle, #ffe69c) !important;
}

/* Documents: Navy blue with white text */
.role-docs {
    background-color: #1f3a5f !important; /* Navy */
    color: #ffffff !important;
    border-color: #16263d !important;
}

/* Custom/Other: Neutral gray with dark text */
.role-custom {
    background-color: #e5e7eb !important; /* Gray-200 */
    color: #374151 !important; /* Gray-700 */
    border-color: #d1d5db !important; /* Gray-300 */
}

/* Removed role variant: keep color but strike through label */
.role-removed {
    text-decoration: line-through;
}

/* OPEN: Light Blue Background + FORCED Dark Blue Text */
.badge-soft-open {
    background-color: #e0f2fe;      /* Light Blue */
    color: #0c4a6e !important;      /* Dark Blue (Forced) */
    border: 1px solid #bae6fd;
}

/* CLOSED: Light Gray Background + FORCED Dark Gray Text */
.badge-soft-closed {
    background-color: #f3f4f6;      /* Light Gray */
    color: #374151 !important;      /* Dark Gray (Forced) */
    border: 1px solid #e5e7eb;
}
/* Light theme Toast overrides aligned with alert-like design */
/* Flatten toasts: no drop shadow, subtle radius, readable colors */
.toast {
  box-shadow: none !important; /* Remove drop shadow */
  border-radius: 4px !important; /* Match reference radius */
  /* Keep toast readable and within viewport on all viewports */
  max-width: min(420px, calc(100vw - 2rem));
  word-wrap: break-word;
  overflow-wrap: anywhere;
}

/* Success (light green) */
.toast.text-bg-success,
.toast.text-bg-success .toast-header {
  background-color: #d4edda !important; /* Light green */
  color: #155724 !important; /* Dark green text */
  border-color: #c3e6cb !important; /* Border */
}
.toast.text-bg-success {
  border: 1px solid #c3e6cb !important;
}
.toast.text-bg-success .toast-body,
.toast.text-bg-success strong,
.toast.text-bg-success .bi,
.toast.text-bg-success i {
  color: #155724 !important;
}

/* Add breathable padding and unified typography for success toast */
.toast .toast-body { padding: 0.875rem 1rem !important; }
.toast.text-bg-success .toast-body, .toast.text-bg-success .toast-body * { font-weight: 400 !important; }
.toast .btn-close { align-self: center; }

/* Toast typography — SINGLE SOURCE OF TRUTH (matches My account toast) */
:root { --dp-toast-font-size: 1.25rem; } /* equals Bootstrap fs-5 */
.toast,
.toast .toast-body,
.toast .toast-header,
.toast .toast-message,
.toast .btn,
.toast .btn-link,
.toast .toast-actions {
  font-size: var(--dp-toast-font-size, 1.25rem) !important;
  line-height: 1.5 !important;
}
/* Ensure nested elements don’t shrink the text via local rules */
.toast .toast-body *,
.toast .toast-header * {
  font-size: inherit !important;
}

/* Toast typography — SINGLE SOURCE OF TRUTH (matches My account toast) */
:root { --dp-toast-font-size: 1.25rem; } /* equals Bootstrap fs-5 */
.toast,
.toast .toast-body,
.toast .toast-header,
.toast .toast-message,
.toast .btn,
.toast .btn-link,
.toast .toast-actions {
  font-size: var(--dp-toast-font-size, 1.25rem) !important;
  line-height: 1.5 !important;
}
/* Ensure nested elements don’t shrink the text via local rules */
.toast .toast-body *,
.toast .toast-header * {
  font-size: inherit !important;
}

/* Danger/Error (light red) */
.toast.text-bg-danger,
.toast.text-bg-danger .toast-header {
  background-color: #f8d7da !important; /* Light red */
  color: #842029 !important; /* Dark red */
  border-color: #f5c2c7 !important;
}
.toast.text-bg-danger {
  border: 1px solid #f5c2c7 !important;
}
.toast.text-bg-danger .toast-body,
.toast.text-bg-danger strong,
.toast.text-bg-danger .bi,
.toast.text-bg-danger i {
  color: #842029 !important;
}

/* Warning (light yellow) */
.toast.text-bg-warning,
.toast.text-bg-warning .toast-header {
  background-color: #fff3cd !important; /* Light yellow */
  color: #664d03 !important; /* Dark brown/yellow */
  border-color: #ffe69c !important;
}
.toast.text-bg-warning {
  border: 1px solid #ffe69c !important;
}
.toast.text-bg-warning .toast-body,
.toast.text-bg-warning strong,
.toast.text-bg-warning .bi,
.toast.text-bg-warning i {
  color: #664d03 !important;
}

/* Optional: Info (light blue) to keep consistency if used */
.toast.text-bg-info,
.toast.text-bg-info .toast-header {
  background-color: #cff4fc !important; /* Light blue */
  color: #055160 !important; /* Dark blue */
  border-color: #b6effb !important;
}
.toast.text-bg-info {
  border: 1px solid #b6effb !important;
}
.toast.text-bg-info .toast-body,
.toast.text-bg-info strong,
.toast.text-bg-info .bi,
.toast.text-bg-info i {
  color: #055160 !important;
}

/* Header + close button: keep close icon dark and visible on light headers */
.toast .toast-header {
  border-bottom-width: 1px !important;
}
.toast .toast-header .btn-close {
  filter: none !important; /* ensure dark close icon */
  opacity: .8;
}
.toast .toast-header .btn-close:hover { opacity: 1; }

/* Make any inline icons match text color for cleanliness */
.toast i,
.toast .bi {
  color: inherit !important;
}

/* Ensure multi-line messages wrap nicely and remain readable */
.toast .toast-message {
  white-space: normal !important;
  line-height: 1.25rem; /* harmonize with body text */
}