﻿
/*@import url('themes5/cosmos-light-theme.css');*/
@import url('bootstrap.min.css');

@import url('Cosmos.Common.AspNetCore.Colors.css');
@import url('Cosmos.Common.AspNetCore.Compact.css');

:root,
[data-bs-theme=dark],
[data-bs-theme=light] {
  --bs-body-font-family: "Segoe UI";
  --bs-breadcrumb-divider: '>';
  --cosmos-form-control-corner-radius: 4px;
  --bs-breadcrumb-margin-bottom: 0rem;
}

.accordion {
  /*--bs-accordion-active-bg: var(--cosmos-primary-neon-blue-opaque-10);*/
  --bs-accordion-active-bg: color-mix(in srgb, var(--cosmos-body-color) 25%, var(--cosmos-body-bg));
  --bs-accordion-active-color: var(--cosmos-primary-dark-blue);
}

.accordion-button {
  color: var(--cosmos-primary-dark-blue);
}

  .accordion-button.selected {
    color: var(--bs-accordion-active-color);
    background-color: var(--bs-accordion-active-bg);
    /*box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);*/
  }

  .accordion-button:not(.collapsed) {
    color: var(--bs-accordion-active-color);
    background-color: var(--bs-accordion-active-bg);
    box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
  }


.bg-primary {
  background-color: var(--cosmos-primary-neon-blue-opaque-10) !important;
  color: var(--cosmos-primary-dark-blue);
}

.btn {
  --bs-btn-line-height: 1.3;
}

.btn-primary {
  --bs-btn-color: var(--bs-white);
  --bs-btn-bg: var(--cosmos-primary-neon-blue);
  --bs-btn-border-color: var(--cosmos-primary-neon-blue);
  --bs-btn-hover-color: var(--bs-white);
  --bs-btn-hover-bg: var(--cosmos-primary-neon-blue);
  --bs-btn-hover-border-color: var(--cosmos-primary-neon-blue);
  --bs-btn-focus-shadow: 0px 0px 8px var(--cosmos-primary-neon-blue);
  --bs-btn-active-color: var(--bs-white);
  --bs-btn-active-bg: var(--cosmos-primary-neon-blue);
  --bs-btn-active-border-color: var(--cosmos-primary-neon-blue);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-white);
  --bs-btn-disabled-bg: var(--cosmos-grey-tone-stainless-grey-opaque-45);
  --bs-btn-disabled-border-color: var(--cosmos-grey-tone-stainless-grey-opaque-45);
}

.btn-secondary {
  --bs-btn-color: var(--cosmos-primary-neon-blue);
  --bs-btn-bg: var(--bs-white);
  --bs-btn-border-color: var(--cosmos-primary-neon-blue);
  --bs-btn-hover-color: var(--cosmos-primary-neon-blue);
  --bs-btn-hover-bg: var(--cosmos-primary-neon-blue-opaque-10);
  --bs-btn-hover-border-color: var(--cosmos-primary-neon-blue);
  --bs-btn-focus-shadow: 0px 0px 8px var(--cosmos-primary-neon-blue);
  --bs-btn-active-color: var(--bs-white);
  --bs-btn-active-bg: var(--cosmos-primary-neon-blue);
  --bs-btn-active-border-color: var(--cosmos-primary-neon-blue);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-white);
  --bs-btn-disabled-bg: var(--cosmos-grey-tone-stainless-grey-opaque-45);
  --bs-btn-disabled-border-color: var(--cosmos-grey-tone-stainless-grey-opaque-45);
}

.btn-link {
  --bs-btn-color: var(--cosmos-primary-neon-blue);
  --bs-btn-hover-color: var(--cosmos-primary-neon-blue);
  --bs-btn-active-color: var(--cosmos-primary-neon-blue);
  --bs-btn-disabled-color: var(--cosmos-grey-tone-reflective-grey-opaque-100);
  text-decoration: none;
}

  .btn-link:hover {
    text-decoration: underline;
  }

.btn-outline-link {
  --bs-btn-color: var(--cosmos-primary-neon-blue);
  --bs-btn-hover-color: var(--cosmos-primary-neon-blue);
  --bs-btn-active-color: var(--cosmos-primary-neon-blue);
  --bs-btn-disabled-color: var(--bs-white);
  text-decoration: none;
}

.form-label {
  color: var(--cosmos-primary-dark-blue);
}

.form-control,
.form-select {
  background-color: var(--cosmos-primary-neon-blue-opaque-10);
  border-color: var(--cosmos-primary-neon-blue);
  color: var(--cosmos-primary-neon-blue);
  border-radius: var(--cosmos-form-control-corner-radius);
  outline: none;
}

  .form-control:hover,
  .form-select:hover {
    background-color: var(--cosmos-primary-neon-blue-opaque-10);
    border-color: var(--cosmos-primary-dark-blue);
    color: var(--cosmos-primary-dark-blue);
    border-radius: var(--cosmos-form-control-corner-radius);
  }

  .form-control:active,
  .form-select:active {
    background-color: var(--cosmos-primary-neon-blue-opaque-10);
    border-color: var(--cosmos-primary-neon-blue);
    color: var(--cosmos-primary-dark-blue);
    border-radius: var(--cosmos-form-control-corner-radius);
    outline: none;
  }

  .form-control:disabled,
  .form-select:disabled {
    background-color: var(--cosmos-grey-tone-reflective-grey);
    border-color: var(--cosmos-primary-neon-blue-opaque-45);
    color: var(--cosmos-grey-tone-stainless-grey-opaque-75);
    border-radius: var(--cosmos-form-control-corner-radius);
    outline: none;
  }

  .form-control:read-only,
  .form-select:disabled {
    background-color: var(--cosmos-body-bg);
    border-color: var(--cosmos-primary-neon-blue);
    color: var(--cosmos-body-color);
    font-weight: bold;
    /*border: none;*/
    outline: none;
  }

    .form-control:read-only::placeholder
    .form-select:read-only::placeholder {
      background-color: var(--cosmos-body-bg);
      color: var(--cosmos-body-color);
      font-weight: bold;
      border: none;
      outline: none;
    }

/*
.navbar-nav span {
  color: var(--cosmos-primary-dark-blue);
  cursor: pointer;
}
*/

.nav-link {
  --bs-nav-link-color: var(--cosmos-primary-dark-blue);
  --bs-nav-link-hover-color: var(--cosmos-primary-neon-blue);
  --bs-nav-link-disabled-color: var(--cosmos-black-tone-carbon-black-opaque-75);
}

  .nav-link.otk-custom-nav-horizontal:hover, .nav-link.otk-custom-nav-horizontal:active {
    background-color: var(--cosmos-primary-neon-blue-opaque-10);
    border-left: 3px solid var(--cosmos-primary-neon-blue-opaque-75);
    padding-left: 5px;
  }

.page-link.active {
  --bs-pagination-active-bg: var(--cosmos-primary-neon-blue);
}

.page-link {
  --bs-pagination-color: var(--cosmos-primary-neon-blue);
}

footer {
  background-color: var(--cosmos-primary-neon-blue-opaque-10);
  color: var(--cosmos-primary-dark-blue);
  font-size: 12px;
}

.table > thead > tr > th {
  background-color: var(--cosmos-primary-neon-blue-opaque-10);
  color: var(--cosmos-primary-dark-blue);
}






html,
body {
  font-family: 'Segoe UI';
}

[data-bs-theme="light"] .table {
  --bs-table-color: var(--cosmos-body-color);
  --bs-table-border-color: var(--cosmos-grey-tone-stainless-grey-opaque-75);
  --bs-table-accent-bg: transparent;
  /*--bs-table-striped-bg: var(--cosmos-primary-neon-blue-opaque-10);*/
  /*--bs-table-striped-bg: var(--cosmos-grey-tone-stainless-grey-opaque-20);*/

  /* Selected row */
  /*
  --bs-table-active-bg: var(--cosmos-primary-neon-blue-opaque-20);
  --bs-table-active-color: var(--cosmos-body-color);
  */
  --bs-table-active-bg: var(--cosmos-primary-neon-blue-opaque-20);
  --bs-table-active-color: var(--cosmos-body-bg);

  /* Hovered row */
  /*
  --bs-table-hover-bg: var(--cosmos-primary-neon-blue-opaque-10);
  --bs-table-hover-color: var(--cosmos-body-color);
  */
  --bs-table-hover-bg: var(--cosmos-primary-neon-blue-opaque-45);
  --bs-table-hover-color: var(--cosmos-body-bg);
}


[data-bs-theme="dark"] .table {
  --bs-table-color: var(--cosmos-body-color);
  --bs-table-border-color: var(--cosmos-grey-tone-stainless-grey-opaque-75);
  --bs-table-accent-bg: transparent;
  /*--bs-table-striped-bg: var(--cosmos-primary-neon-blue-opaque-10);*/
  /*--bs-table-striped-bg: var(--cosmos-grey-tone-stainless-grey-opaque-20);*/

  /* Selected row */
  /*
  --bs-table-active-bg: var(--cosmos-primary-neon-blue-opaque-20);
  --bs-table-active-color: var(--cosmos-body-bg);
  */
  --bs-table-active-bg: var(--cosmos-primary-neon-blue-opaque-20);
  --bs-table-active-color: var(--cosmos-body-bg);

  /* Hovered row */
  /*
  --bs-table-hover-bg: var(--cosmos-primary-neon-blue-opaque-10);
  --bs-table-hover-color: var(--cosmos-body-bg);
  */
  --bs-table-hover-bg: var(--cosmos-primary-neon-blue-opaque-10);
  --bs-table-hover-color: var(--cosmos-body-bg);
}





.shadow-sm {
  box-shadow: 0 0.125rem 0.25rem var(--cosmos-black-tone-carbon-black-opaque-20) !important
}

.gridRowYellow {
  background-color: yellow !important;
  --bs-table-active-color: yellow;
  --bs-table-hover-bg: yellow;
  --bs-table-active-bg: yellow !important;
  --bs-table-bg-state: yellow !important;
}

.spinner {
  border: 16px solid var(--cosmos-grey-tone-reflective-grey);
  border-top: 16px solid var(--cosmos-primary-neon-blue);
  border-radius: 50%;
  width: 80px;
  height: 80px;
  animation: spin 700ms linear infinite;
  position: fixed;
  z-index: 1;
  top: 50%;
  left: 50%;
}


.position {
  position: fixed;
  height: 100%;
  width: 100%;
  z-index: 1;
  background-color: #87ceeb1f;
  display: flex;
  justify-content: center;
  align-items: center;
}

@keyframes spin {
  0% {
    transform: rotate(0deg)
  }

  100% {
    transform: rotate(360deg)
  }
}
