/*
* custom.css
* File include item demo only specific css only
******************************************************************************/

/* アバター画像の円形保持 */
.avatar-circle {
    width: 35px !important;
    height: 35px !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    display: block !important;
}

.avatar-circle img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

.menu .app-brand.demo {
    height: 64px;
    margin-top: 12px;
  }

  .app-brand-logo.demo svg {
    width: 22px;
    height: 38px;
  }

  .app-brand-text.demo {
    font-size: 1.75rem;
    letter-spacing: -0.5px;
    text-transform: lowercase;
  }

  /* ! For .layout-navbar-fixed added fix padding top tpo .layout-page */
  /* Detached navbar */
  .layout-navbar-fixed .layout-wrapper:not(.layout-horizontal):not(.layout-without-menu) .layout-page {
    padding-top: 76px !important;
  }
  /* Default navbar */
  .layout-navbar-fixed .layout-wrapper:not(.layout-without-menu) .layout-page {
    padding-top: 64px !important;
  }

  /* Navbar page z-index issue solution */
  .content-wrapper .navbar {
    z-index: auto;
  }

  /*
  * Content
  ******************************************************************************/

  .demo-blocks > * {
    display: block !important;
  }

  .demo-inline-spacing > * {
    margin: 1rem 0.375rem 0 0 !important;
  }

  /* ? .demo-vertical-spacing class is used to have vertical margins between elements. To remove margin-top from the first-child, use .demo-only-element class with .demo-vertical-spacing class. For example, we have used this class in forms-input-groups.html file. */
  .demo-vertical-spacing > * {
    margin-top: 1rem !important;
    margin-bottom: 0 !important;
  }
  .demo-vertical-spacing.demo-only-element > :first-child {
    margin-top: 0 !important;
  }

  .demo-vertical-spacing-lg > * {
    margin-top: 1.875rem !important;
    margin-bottom: 0 !important;
  }
  .demo-vertical-spacing-lg.demo-only-element > :first-child {
    margin-top: 0 !important;
  }

  .demo-vertical-spacing-xl > * {
    margin-top: 5rem !important;
    margin-bottom: 0 !important;
  }
  .demo-vertical-spacing-xl.demo-only-element > :first-child {
    margin-top: 0 !important;
  }

  .rtl-only {
    display: none !important;
    text-align: left !important;
    direction: ltr !important;
  }

  [dir='rtl'] .rtl-only {
    display: block !important;
  }

  /*
  * Layout demo
  ******************************************************************************/

  .layout-demo-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 1rem;
  }
  .layout-demo-placeholder img {
    width: 900px;
  }
  .layout-demo-info {
    text-align: center;
    margin-top: 1rem;
  }

  /*
  * Custom primary color overrides
  ******************************************************************************/

  /* Primary color variables override */
  :root {
    --bs-primary: rgb(0, 128, 128);
    --bs-primary-rgb: 5, 162, 173;
    --bs-info: #48D1CC;
    --bs-success: #CCC294;
    --bs-warning: #FFE44B;
    --bs-danger: #FF7F7F;
    --bs-dark: #003D3D;
    --bs-light: #F1EFE4;
  }

  /* Bootstrap primary class overrides */
  .btn-primary,
  .btn-outline-primary:hover,
  .btn-outline-primary:focus,
  .btn-outline-primary:active,
  .btn-outline-primary.active {
    background-color: rgb(0, 128, 128) !important;
    border-color: rgb(0, 128, 128) !important;
    color: white !important;
  }
  .btn-outline-primary:focus {
      color: white !important;
  }

  /* Primary button hover effects */
  .btn-primary:hover,
  .btn-primary:focus {
    background-color: rgba(0, 128, 128, 0.9) !important;
    border-color: rgba(0, 128, 128, 0.9) !important;
    color: white !important;
  }

  .btn-primary:active,
  .btn-primary.active {
    background-color: rgb(0, 128, 128) !important;
    border-color: rgb(0, 128, 128) !important;
    color: white !important;
  }

  .btn-check:checked + .btn-primary,
  .btn-check:active + .btn-primary,
  .btn-primary.show.dropdown-toggle,
  .show > .btn-primary.dropdown-toggle {
    background-color: rgb(0, 128, 128) !important;
    border-color: rgb(0, 128, 128) !important;
    color: white !important;
  }

  .btn-check:checked + .btn-primary:focus,
  .btn-check:active + .btn-primary:focus,
  .btn-primary:active:focus,
  .btn-primary.active:focus,
  .btn-primary.show.dropdown-toggle:focus,
  .show > .btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 128, 128, 0.25) !important;
  }

  /* Primary button shadow effects */
  .btn-primary:focus,
  .btn-primary.focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 128, 128, 0.25) !important;
  }

  .btn-outline-primary {
    color: rgb(0, 128, 128) !important;
    border-color: rgb(0, 128, 128) !important;
    background-color: transparent !important;
  }

  .btn-outline-primary:hover,
  .btn-outline-primary:focus {
    background-color: rgb(0, 128, 128) !important;
    border-color: rgb(0, 128, 128) !important;
    color: white !important;
  }

  .btn-outline-primary:active,
  .btn-outline-primary.active {
    background-color: rgb(0, 128, 128) !important;
    border-color: rgb(0, 128, 128) !important;
    color: white !important;
  }

  .btn-check:checked + .btn-outline-primary,
  .btn-check:active + .btn-outline-primary,
  .btn-outline-primary.dropdown-toggle.show {
    background-color: rgb(0, 128, 128) !important;
    border-color: rgb(0, 128, 128) !important;
    color: white !important;
  }

  .btn-outline-primary:focus,
  .btn-outline-primary.focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 128, 128, 0.25) !important;
  }

  .btn-outline-primary:active:focus,
  .btn-outline-primary.active:focus,
  .btn-check:checked + .btn-outline-primary:focus,
  .btn-check:active + .btn-outline-primary:focus,
  .btn-outline-primary.dropdown-toggle.show:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 128, 128, 0.25) !important;
  }

  /* Button label primary */
  .btn-label-primary {
    color: rgb(0, 128, 128) !important;
    border-color: transparent !important;
    background: rgba(0, 128, 128, 0.16) !important;
  }

  .btn-label-primary:hover {
    border-color: transparent !important;
    background: rgb(0, 128, 128) !important;
    color: white !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 128, 128, 0.4) !important;
    transform: translateY(-1px) !important;
  }

  .btn-label-primary:focus,
  .btn-label-primary.focus {
    color: white !important;
    background: rgb(0, 128, 128) !important;
    box-shadow: none !important;
    transform: translateY(0) !important;
  }

  .btn-label-primary:active,
  .btn-label-primary.active,
  .btn-label-primary.show.dropdown-toggle,
  .show > .btn-label-primary.dropdown-toggle {
    color: white !important;
    background-color: rgb(0, 128, 128) !important;
    border-color: transparent !important;
  }

  .btn-label-primary:active:focus,
  .btn-label-primary.active:focus,
  .btn-label-primary.show.dropdown-toggle:focus,
  .show > .btn-label-primary.dropdown-toggle:focus {
    box-shadow: none !important;
  }

  .btn-label-primary.disabled,
  .btn-label-primary:disabled {
    box-shadow: none !important;
  }

  .text-primary {
    color: rgb(0, 128, 128) !important;
  }

  .bg-primary {
    background-color: rgb(0, 128, 128) !important;
  }

  .border-primary {
    border-color: rgb(0, 128, 128) !important;
  }

  /* Alert primary color */
  .alert-primary {
    color: #fff !important;
    background-color: rgb(0, 128, 128) !important;
    border-color: rgba(0, 128, 128, 0.8) !important;
  }

  /* Form control focus color */
  .form-control:focus,
  .form-select:focus {
    border-color: rgba(0, 128, 128, 0.5) !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 128, 128, 0.25) !important;
  }

  /* Link colors */
  a.text-primary:hover,
  a.text-primary:focus {
    color: rgba(0, 128, 128, 0.8) !important;
  }

  /* Badge primary */
  .badge-primary,
  .badge.bg-primary {
    background-color: rgb(0, 128, 128) !important;
  }

  /* Badge label colors (bg-label-*) */
  .bg-label-primary {
    background-color: rgba(0, 128, 128, 0.16) !important;
    color: rgb(0, 128, 128) !important;
  }

  .bg-label-info {
    background-color: rgba(72, 209, 204, 0.16) !important;
    color: #48D1CC !important;
  }

  .bg-label-success {
    background-color: rgba(204, 194, 148, 0.16) !important;
    color: #CCC294 !important;
  }

  .bg-label-warning {
    background-color: rgba(255, 228, 75, 0.16) !important;
    color: #FFE44B !important;
  }

  .bg-label-danger {
    background-color: rgba(255, 127, 127, 0.16) !important;
    color: #FF7F7F !important;
  }

  /* Badge notification */
  .badge-notification,
  .badge.badge-notification,
  .badge.badge-notifications {
    background-color: rgb(0, 128, 128) !important;
    color: white !important;
  }

  /* Progress bar primary */
  .progress-bar-primary,
  .progress-bar.bg-primary {
    background-color: rgb(0, 128, 128) !important;
  }

  /* Progress bar default (when no color class specified) */
  .progress-bar {
    background-color: rgb(0, 128, 128) !important;
  }

  /* Layout menu toggle button */
  .app-brand .layout-menu-toggle {
    background-color: rgb(0, 128, 128) !important;
    border: 7px solid #f5f5f9 !important;
  }

  .app-brand .layout-menu-toggle:hover {
    background-color: rgba(0, 128, 128, 0.85) !important;
  }

  .input-group:focus-within .input-group-text {
      border-color: rgb(0, 128, 128) !important;
  }
  .input-group:focus-within .form-control {
    border-color: rgb(0, 128, 128) !important;
  }

  /* Dropdown and navigation hover effects */
  .dropdown-item:not(.disabled).active,
  .dropdown-item:not(.disabled):active {
      background-color: rgba(0, 128, 128, 0.08);
      color: rgb(0, 128, 128) !important;
  }


  .dropdown-item:active {
    background-color: rgba(0, 128, 128, 0.1) !important;
    color: rgb(0, 128, 128) !important;
  }

  /* Menu item hover effects */
  .menu-item .menu-link:hover,
  .menu-item .menu-link:focus {
    background-color: rgba(0, 128, 128, 0.1) !important;
  }

  .bg-menu-theme .menu-inner > .menu-item.active > .menu-link {
    background-color: rgba(0, 128, 128, 0.16) !important;
  }
  .menu-item.active .menu-link {
    /* background-color: rgba(0, 128, 128, 0.1) !important; */
    color: rgb(0, 128, 128) !important;
  }

  .bg-menu-theme .menu-inner > .menu-item.active:before {
      background: rgb(0, 128, 128) !important;
  }


  /* Tab hover effects */
  .nav-tabs .nav-link:hover,
  .nav-tabs .nav-link:focus {
    border-color: rgba(0, 128, 128, 0.3) !important;
    color: rgb(0, 128, 128) !important;
  }

  .nav-tabs .nav-link.active {
    border-color: rgb(0, 128, 128) !important;
    color: rgb(0, 128, 128) !important;
  }

  /* Pagination */
  .page-link {
    color: rgb(0, 128, 128) !important;
  }

  .page-link:hover,
  .page-link:focus {
    color: rgba(0, 128, 128, 0.8) !important;
    background-color: rgba(0, 128, 128, 0.1) !important;
    border-color: rgba(0, 128, 128, 0.3) !important;
  }

  .page-item.active .page-link {
    background-color: rgb(0, 128, 128) !important;
    border-color: rgb(0, 128, 128) !important;
    color: white !important;
  }

  /* Table striped hover */
  .table-striped tbody tr:hover {
    background-color: rgba(0, 128, 128, 0.05) !important;
  }

  /* Check and radio button colors */
  .form-check-input:checked {
    background-color: rgb(0, 128, 128) !important;
    border-color: rgb(0, 128, 128) !important;
  }

  .form-check-input:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 128, 128, 0.25) !important;
  }

  /* Switch colors */
  .form-switch .form-check-input:checked {
    background-color: rgb(0, 128, 128) !important;
    border-color: rgb(0, 128, 128) !important;
  }
  .form-switch .form-check-input:active {
    color: rgb(0, 128, 128) !important;
  }

  /* Spinner colors */
  .spinner-border-primary,
  .spinner-border.text-primary {
    color: rgb(0, 128, 128) !important;
  }

  /* Card header with primary background */
  .card-header.bg-primary {
    background-color: rgb(0, 128, 128) !important;
  }

  /* List group item active */
  .list-group-item.active {
    background-color: rgb(0, 128, 128) !important;
    border-color: rgb(0, 128, 128) !important;
    color: #fff !important;
  }
  .list-group-item.active .text-muted {
    color: #fff !important;
  }

  .list-group-item:hover {
    background-color: rgba(0, 128, 128, 0.05) !important;
    color: rgb(0, 128, 128) !important;
  }

  .nav-pills .nav-link.active,
  .nav-pills .nav-link.active:hover,
  .nav-pills .nav-link.active:focus {
    background-color: rgb(0, 128, 128) !important;
    color: #fff !important;
    box-shadow: 0 2px 4px 0 rgba(0, 128, 128, 0.4) !important;
  }
  .nav-link:hover, .nav-link:focus {
    color: rgb(0, 128, 128) !important;
  }

  .form-switch .form-check-input:focus {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2305a2ad'/%3e%3c/svg%3e");
  }
  .form-switch .form-check-input:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
  }

  /* Badge inside btn-outline-primary */
  .btn-outline-primary .badge {
    color: rgb(0, 128, 128) !important;
    background-color: transparent !important;
  }

  .btn-outline-primary:hover .badge,
  .btn-outline-primary:focus .badge,
  .btn-outline-primary:active .badge,
  .btn-outline-primary.active .badge {
    color: white !important;
    background-color: transparent !important;
  }


  /* Disabled elements color */
  .btn:disabled,
  .btn.disabled,
  .form-control:disabled,
  .form-select:disabled,
  .dropdown-item.disabled {
    color: rgba(255, 255, 255, 0.9) !important;
  }

  /* Link colors */
  a:not(.menu-link):not(.btn) {
    color: rgb(0, 128, 128) !important;
  }

  a:not(.menu-link):not(.btn):hover,
  a:not(.menu-link):not(.btn):focus {
    color: rgba(0, 128, 128, 0.8) !important;
  }

  a:not(.menu-link):not(.btn):active {
    color: rgba(0, 128, 128, 0.9) !important;
  }

  a:not(.menu-link):not(.btn):visited {
    color: rgba(0, 128, 128, 0.7) !important;
  }

  /*
  * Custom info/success/warning/danger color overrides
  ******************************************************************************/

  /* Info color */
  .btn-info {
    background-color: #48D1CC !important;
    border-color: #48D1CC !important;
    color: white !important;
  }

  .btn-outline-info {
    color: #48D1CC !important;
    border-color: #48D1CC !important;
    background-color: transparent !important;
  }

  .btn-outline-info:hover,
  .btn-outline-info:focus,
  .btn-outline-info:active,
  .btn-outline-info.active {
    background-color: #48D1CC !important;
    border-color: #48D1CC !important;
    color: white !important;
  }

  .btn-outline-info .badge {
    color: #48D1CC !important;
    background-color: transparent !important;
  }

  .btn-outline-info:hover .badge,
  .btn-outline-info:focus .badge,
  .btn-outline-info:active .badge,
  .btn-outline-info.active .badge {
    color: white !important;
    background-color: transparent !important;
  }

  .btn-info:hover,
  .btn-info:focus {
    background-color: rgba(72, 209, 204, 0.9) !important;
    border-color: rgba(72, 209, 204, 0.9) !important;
    color: white !important;
  }

  .btn-info:active,
  .btn-info.active {
    background-color: #48D1CC !important;
    border-color: #48D1CC !important;
    color: white !important;
  }

  .text-info {
    color: #48D1CC !important;
  }

  .bg-info {
    background-color: #48D1CC !important;
  }

  .border-info {
    border-color: #48D1CC !important;
  }

  .alert-info {
    color: #003D3D !important;
    background-color: rgba(72, 209, 204, 0.1) !important;
    border-color: rgba(72, 209, 204, 0.3) !important;
  }

  .badge.bg-info {
    background-color: #48D1CC !important;
    color: #003D3D !important;
  }

  /* Button label info */
  .btn-label-info {
    color: #48D1CC !important;
    border-color: transparent !important;
    background: rgba(72, 209, 204, 0.16) !important;
  }

  .btn-label-info:hover {
    border-color: transparent !important;
    background: #48D1CC !important;
    color: white !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(72, 209, 204, 0.4) !important;
    transform: translateY(-1px) !important;
  }

  .btn-label-info:focus,
  .btn-label-info.focus {
    color: white !important;
    background: #48D1CC !important;
    box-shadow: none !important;
    transform: translateY(0) !important;
  }

  .btn-label-info:active,
  .btn-label-info.active,
  .btn-label-info.show.dropdown-toggle,
  .show > .btn-label-info.dropdown-toggle {
    color: white !important;
    background-color: #48D1CC !important;
    border-color: transparent !important;
  }

  .btn-label-info:active:focus,
  .btn-label-info.active:focus,
  .btn-label-info.show.dropdown-toggle:focus,
  .show > .btn-label-info.dropdown-toggle:focus {
    box-shadow: none !important;
  }

  .btn-label-info.disabled,
  .btn-label-info:disabled {
    box-shadow: none !important;
  }

  /* Success color */
  .btn-success {
    background-color: #CCC294 !important;
    border-color: #CCC294 !important;
    color: white !important;
  }

  .btn-outline-success {
    color: #CCC294 !important;
    border-color: #CCC294 !important;
    background-color: transparent !important;
  }

  .btn-outline-success:hover,
  .btn-outline-success:focus,
  .btn-outline-success:active,
  .btn-outline-success.active {
    background-color: #CCC294 !important;
    border-color: #CCC294 !important;
    color: white !important;
  }

  .btn-outline-success .badge {
    color: #CCC294 !important;
    background-color: transparent !important;
  }

  .btn-outline-success:hover .badge,
  .btn-outline-success:focus .badge,
  .btn-outline-success:active .badge,
  .btn-outline-success.active .badge {
    color: white !important;
    background-color: transparent !important;
  }

  .btn-success:hover,
  .btn-success:focus {
    background-color: rgba(204, 194, 148, 0.9) !important;
    border-color: rgba(204, 194, 148, 0.9) !important;
    color: white !important;
  }

  .btn-success:active,
  .btn-success.active {
    background-color: #CCC294 !important;
    border-color: #CCC294 !important;
    color: white !important;
  }

  .text-success {
    color: #CCC294 !important;
  }

  .bg-success {
    background-color: #CCC294 !important;
  }

  .border-success {
    border-color: #CCC294 !important;
  }

  .alert-success {
    color: #003D3D !important;
    background-color: rgba(204, 194, 148, 0.1) !important;
    border-color: rgba(204, 194, 148, 0.3) !important;
  }

  .alert-success .btn-close {
    background-image: none !important;
  }

  .badge.bg-success {
    background-color: #CCC294 !important;
    color: #003D3D !important;
  }

  /* Button label success */
  .btn-label-success {
    color: #CCC294 !important;
    border-color: transparent !important;
    background: rgba(204, 194, 148, 0.16) !important;
  }

  .btn-label-success:hover {
    border-color: transparent !important;
    background: #CCC294 !important;
    color: white !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(204, 194, 148, 0.4) !important;
    transform: translateY(-1px) !important;
  }

  .btn-label-success:focus,
  .btn-label-success.focus {
    color: white !important;
    background: #CCC294 !important;
    box-shadow: none !important;
    transform: translateY(0) !important;
  }

  .btn-label-success:active,
  .btn-label-success.active,
  .btn-label-success.show.dropdown-toggle,
  .show > .btn-label-success.dropdown-toggle {
    color: white !important;
    background-color: #CCC294 !important;
    border-color: transparent !important;
  }

  .btn-label-success:active:focus,
  .btn-label-success.active:focus,
  .btn-label-success.show.dropdown-toggle:focus,
  .show > .btn-label-success.dropdown-toggle:focus {
    box-shadow: none !important;
  }

  .btn-label-success.disabled,
  .btn-label-success:disabled {
    box-shadow: none !important;
  }

  /* Warning color */
  .btn-warning {
    background-color: #FFE44B !important;
    border-color: #FFE44B !important;
    color: white !important;
  }

  .btn-outline-warning {
    color: #FFE44B !important;
    border-color: #FFE44B !important;
    background-color: transparent !important;
  }

  .btn-outline-warning:hover,
  .btn-outline-warning:focus,
  .btn-outline-warning:active,
  .btn-outline-warning.active {
    background-color: #FFE44B !important;
    border-color: #FFE44B !important;
    color: white !important;
  }

  .btn-outline-warning .badge {
    color: #FFE44B !important;
    background-color: transparent !important;
  }

  .btn-outline-warning:hover .badge,
  .btn-outline-warning:focus .badge,
  .btn-outline-warning:active .badge,
  .btn-outline-warning.active .badge {
    color: white !important;
    background-color: transparent !important;
  }

  .btn-warning:hover,
  .btn-warning:focus {
    background-color: rgba(255, 228, 75, 0.9) !important;
    border-color: rgba(255, 228, 75, 0.9) !important;
    color: white !important;
  }

  .btn-warning:active,
  .btn-warning.active {
    background-color: #FFE44B !important;
    border-color: #FFE44B !important;
    color: white !important;
  }

  .text-warning {
    color: #FFE44B !important;
  }

  .bg-warning {
    background-color: #FFE44B !important;
  }

  .border-warning {
    border-color: #FFE44B !important;
  }

  .alert-warning {
    color: #003D3D !important;
    background-color: rgba(255, 228, 75, 0.1) !important;
    border-color: rgba(255, 228, 75, 0.3) !important;
  }

  .badge.bg-warning {
    background-color: #FFE44B !important;
    color: #003D3D !important;
  }

  /* Button label warning */
  .btn-label-warning {
    color: #FFE44B !important;
    border-color: transparent !important;
    background: rgba(255, 228, 75, 0.16) !important;
  }

  .btn-label-warning:hover {
    border-color: transparent !important;
    background: #FFE44B !important;
    color: white !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(255, 228, 75, 0.4) !important;
    transform: translateY(-1px) !important;
  }

  .btn-label-warning:focus,
  .btn-label-warning.focus {
    color: white !important;
    background: #FFE44B !important;
    box-shadow: none !important;
    transform: translateY(0) !important;
  }

  .btn-label-warning:active,
  .btn-label-warning.active,
  .btn-label-warning.show.dropdown-toggle,
  .show > .btn-label-warning.dropdown-toggle {
    color: white !important;
    background-color: #FFE44B !important;
    border-color: transparent !important;
  }

  .btn-label-warning:active:focus,
  .btn-label-warning.active:focus,
  .btn-label-warning.show.dropdown-toggle:focus,
  .show > .btn-label-warning.dropdown-toggle:focus {
    box-shadow: none !important;
  }

  .btn-label-warning.disabled,
  .btn-label-warning:disabled {
    box-shadow: none !important;
  }

  /* Danger color */
  .btn-danger {
    background-color: #FF7F7F !important;
    border-color: #FF7F7F !important;
    color: white !important;
  }

  .btn-outline-danger {
    color: #FF7F7F !important;
    border-color: #FF7F7F !important;
    background-color: transparent !important;
  }

  .btn-outline-danger:hover,
  .btn-outline-danger:focus,
  .btn-outline-danger:active,
  .btn-outline-danger.active {
    background-color: #FF7F7F !important;
    border-color: #FF7F7F !important;
    color: white !important;
  }

  .btn-outline-danger .badge {
    color: #FF7F7F !important;
    background-color: transparent !important;
  }

  .btn-outline-danger:hover .badge,
  .btn-outline-danger:focus .badge,
  .btn-outline-danger:active .badge,
  .btn-outline-danger.active .badge {
    color: white !important;
    background-color: transparent !important;
  }

  .btn-danger:hover,
  .btn-danger:focus {
    background-color: rgba(255, 127, 127, 0.9) !important;
    border-color: rgba(255, 127, 127, 0.9) !important;
    color: white !important;
  }

  .btn-danger:active,
  .btn-danger.active {
    background-color: #FF7F7F !important;
    border-color: #FF7F7F !important;
    color: white !important;
  }

  .text-danger {
    color: #FF7F7F !important;
  }

  .bg-danger {
    background-color: #FF7F7F !important;
  }

  .border-danger {
    border-color: #FF7F7F !important;
  }

  .alert-danger {
    color: #003D3D !important;
    background-color: rgba(255, 127, 127, 0.1) !important;
    border-color: rgba(255, 127, 127, 0.3) !important;
  }

  .badge.bg-danger {
    background-color: #FF7F7F !important;
    color: #003D3D !important;
  }

  /* Button label danger */
  .btn-label-danger {
    color: #FF7F7F !important;
    border-color: transparent !important;
    background: rgba(255, 127, 127, 0.16) !important;
  }

  .btn-label-danger:hover {
    border-color: transparent !important;
    background: #FF7F7F !important;
    color: white !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(255, 127, 127, 0.4) !important;
    transform: translateY(-1px) !important;
  }

  .btn-label-danger:focus,
  .btn-label-danger.focus {
    color: white !important;
    background: #FF7F7F !important;
    box-shadow: none !important;
    transform: translateY(0) !important;
  }

  .btn-label-danger:active,
  .btn-label-danger.active,
  .btn-label-danger.show.dropdown-toggle,
  .show > .btn-label-danger.dropdown-toggle {
    color: white !important;
    background-color: #FF7F7F !important;
    border-color: transparent !important;
  }

  .btn-label-danger:active:focus,
  .btn-label-danger.active:focus,
  .btn-label-danger.show.dropdown-toggle:focus,
  .show > .btn-label-danger.dropdown-toggle:focus {
    box-shadow: none !important;
  }

  .btn-label-danger.disabled,
  .btn-label-danger:disabled {
    box-shadow: none !important;
  }

  /*
  * Custom dark and light color overrides
  ******************************************************************************/

  /* Dark color */
  .text-dark {
    color: #003D3D !important;
  }

  .bg-dark {
    background-color: #003D3D !important;
  }

  .border-dark {
    border-color: #003D3D !important;
  }

  .btn-dark,
  .btn-outline-dark:hover,
  .btn-outline-dark:focus,
  .btn-outline-dark:active,
  .btn-outline-dark.active {
    background-color: #003D3D !important;
    border-color: #003D3D !important;
    color: #F1EFE4 !important;
  }

  .btn-outline-dark {
    color: #003D3D !important;
    border-color: #003D3D !important;
    background-color: transparent !important;
  }

  .btn-outline-dark:hover,
  .btn-outline-dark:focus {
    background-color: #003D3D !important;
    border-color: #003D3D !important;
    color: #F1EFE4 !important;
  }

  .btn-outline-dark:active,
  .btn-outline-dark.active {
    background-color: #003D3D !important;
    border-color: #003D3D !important;
    color: #F1EFE4 !important;
  }

  .btn-dark:hover,
  .btn-dark:focus {
    background-color: rgba(0, 61, 61, 0.9) !important;
    border-color: rgba(0, 61, 61, 0.9) !important;
    color: #F1EFE4 !important;
  }

  .btn-dark:active,
  .btn-dark.active {
    background-color: #003D3D !important;
    border-color: #003D3D !important;
    color: #F1EFE4 !important;
  }

  .badge.bg-dark {
    background-color: #003D3D !important;
    color: #F1EFE4 !important;
  }

  /* Light color */
  .text-light {
    color: #F1EFE4 !important;
  }

  .bg-light {
    background-color: #F1EFE4 !important;
  }

  .border-light {
    border-color: #F1EFE4 !important;
  }

  .btn-light,
  .btn-outline-light:hover,
  .btn-outline-light:focus,
  .btn-outline-light:active,
  .btn-outline-light.active {
    background-color: #F1EFE4 !important;
    border-color: #F1EFE4 !important;
    color: #003D3D !important;
  }

  .btn-outline-light {
    color: #F1EFE4 !important;
    border-color: #F1EFE4 !important;
    background-color: transparent !important;
  }

  .btn-outline-light:hover,
  .btn-outline-light:focus {
    background-color: #F1EFE4 !important;
    border-color: #F1EFE4 !important;
    color: #003D3D !important;
  }

  .btn-outline-light:active,
  .btn-outline-light.active {
    background-color: #F1EFE4 !important;
    border-color: #F1EFE4 !important;
    color: #003D3D !important;
  }

  .btn-light:hover,
  .btn-light:focus {
    background-color: rgba(241, 239, 228, 0.9) !important;
    border-color: rgba(241, 239, 228, 0.9) !important;
    color: #003D3D !important;
  }

  .btn-light:active,
  .btn-light.active {
    background-color: #F1EFE4 !important;
    border-color: #F1EFE4 !important;
    color: #003D3D !important;
  }

  .badge.bg-light {
    background-color: #F1EFE4 !important;
    color: #003D3D !important;
  }

  /* Body and general text colors */
  body {
    color: #003D3D !important;
  }

  /* Progress bars */
  .progress-bar.bg-info {
    background-color: #48D1CC !important;
  }

  .progress-bar.bg-success {
    background-color: #CCC294 !important;
  }

  .progress-bar.bg-warning {
    background-color: #FFE44B !important;
  }

  .progress-bar.bg-danger {
    background-color: #FF7F7F !important;
  }

  /* List group items */
  .list-group-item.active.info {
    background-color: #48D1CC !important;
    border-color: #48D1CC !important;
    color: #003D3D !important;
  }

  .list-group-item.active.success {
    background-color: #CCC294 !important;
    border-color: #CCC294 !important;
    color: #003D3D !important;
  }

  .list-group-item.active.warning {
    background-color: #FFE44B !important;
    border-color: #FFE44B !important;
    color: #003D3D !important;
  }

  .list-group-item.active.danger {
    background-color: #FF7F7F !important;
    border-color: #FF7F7F !important;
    color: #003D3D !important;
  }