@import url("/assets/versions/2.2.2/build-768/css/Field.css");
@import url("/assets/versions/2.2.2/build-768/css/SelectMenu.css");
@import url("/assets/versions/2.2.2/build-768/css/Checkbox.css");
@import url("/assets/versions/2.2.2/build-768/css/CsoBladeStack.css");
@import url("/assets/versions/2.2.2/build-768/css/CsoImpactBaselineChart.css");
@import url("/assets/versions/2.2.2/build-768/css/CsoTable.css");
@import url("/assets/versions/2.2.2/build-768/css/CsoTablePanel.css");
@import url("/assets/versions/2.2.2/build-768/css/CsoTablePanelFooter.css");
@import url("/assets/versions/2.2.2/build-768/css/ConsequencePicker.css");
@import url("/assets/versions/2.2.2/build-768/css/CustomAttributesPanel.css");
@import url("/assets/versions/2.2.2/build-768/css/CustodianEditorPanel.css");
@import url("/assets/versions/2.2.2/build-768/css/EnvironmentEditorPanel.css");
@import url("/assets/versions/2.2.2/build-768/css/InformationAssetEditorPanel.css");
@import url("/assets/versions/2.2.2/build-768/css/InformationAssetClassificationPanel.css");
@import url("/assets/versions/2.2.2/build-768/css/InformationAssetCollectionPanel.css");
@import url("/assets/versions/2.2.2/build-768/css/InformationAssetsPanel.css");
@import url("/assets/versions/2.2.2/build-768/css/SystemAssetEditorPanel.css");
@import url("/assets/versions/2.2.2/build-768/css/SystemAssetsPanel.css");
@import url("/assets/versions/2.2.2/build-768/css/Custodians.css");

/* Main foooter */

#copyrightHomeLink:hover {
  color: #4E4E4F;
  cursor: pointer;
}

.googleChartsTableSelectedCellClass {
  background-color: rgba(10, 132, 255) !important;
  color: #FFFFFF;
}

.google-visualization-table-tr-sel td {
  background-color: rgba(10, 132, 255);
  color: #FFFFFF;
}

.googleChartsTableAlreadySelectedCellClass {
  background-color: rgba(10, 132, 255) !important;
  color: #FFFFFF;
}

.googleChartsTableTargetInheritedSelectedCellClass {
  background-color: rgba(3, 67, 85) !important;
  color: #FFFFFF;
}

.googleChartsTableTargetSelectedCellClass {
  background-color: rgba(0, 108, 101) !important;
  color: #FFFFFF;
}

.googleChartsTableRiskSelectedCellClass {
  background-color: rgba(237, 34, 13) !important;
  color: #FFFFFF;
}

.googleChartsTableDeSelectedCellClass {
  background-color: null;
  color: #000000;
}

.googleChartsTableControlAssessmentHeaderRow {
  background-color: rgba(229, 234, 245) !important;
  color: #000000;
}

.controlObjectiveTableContainer .google-visualization-table-tr-odd {
  background-color: #FFFFFF;
}

/* Custom CSS for Disabled Menu Items */

.dropdown-item.disabled, .dropdown-item:disabled {
  color: #abb5bd !important;
  font-style: italic;
}

.form-range {
}

input[type=range][orient=vertical] {
  writing-mode: bt-lr;
  width: 8px;
  height: 100%;
  padding: 0 5px;
}

.breadcrumb {
  border: none;
}

.sectionGroup {
  border: 1px solid rgb(38,143,207);
  padding: 5px;
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: 5px;
  margin-right: 5px;
}

.content-panel {
  border: 1px solid rgb(232,232,232);
}

/* Provides a sliding tab option */

.tab-content {
  background-color: white;
  position: relative;
  z-index: 0;
}

@keyframes slideInLeft {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0);
  }
}

@keyframes slideOutRight {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(100%);
  }
}

@keyframes slideInRight {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}

@keyframes slideOutLeft {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

.slide-in-left {
  animation: slideInLeft 0.5s forwards;
}

.slide-out-right {
  animation: slideOutRight 0.5s forwards;
}

.slide-in-right {
  animation: slideInRight 0.5s forwards;
}

.slide-out-left {
  animation: slideOutLeft 0.5s forwards;
}

@keyframes slideInUp {
  from {
    transform: translateY(100%);
  }
  to {
    transform: translateY(0);
  }
}

@keyframes slideOutUp {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-100%);
  }
}

@keyframes slideInDown {
  from {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(0);
  }
}

@keyframes slideOutDown {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(100%);
  }
}

.slide-in-up {
  animation: slideInUp 0.5s forwards;
}

.slide-out-up {
  animation: slideOutUp 0.5s forwards;
}

.slide-in-down {
  animation: slideInDown 0.5s forwards;
}

.slide-out-down {
  animation: slideOutDown 0.5s forwards;
}

.tab-content > .tab-pane.transitioning {
  padding: 15px;
}

.tab-pane.transitioning {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.tab-pane.active {
  z-index: 2;
}

.tab-pane:not(.active) {
  z-index: 1;
}

.nav-tabs {
  z-index: 1;
}

.assistant-suggestion-banner {
  background-color: rgb(16,163,127);
  color: white;
}

/* A means to set the scroll container without using the 'overflow' style */

.scroll-container {
  overflow-y: auto;
}

/* Control assessment layout styles */

.grid-content-scroll-container {
  height: calc(50vh - 180px);
  overflow-y: auto;
}

/* For desktop view */

.quad-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  grid-gap: 10px;
  height: calc(100vh - 131);
  margin: 20px;
  grid-template-rows: 1fr 1fr;
}

.top-left, .top-right {
  overflow-y: hidden;
  overflow-x: hidden;
  max-height: 50vh;
  min-height: auto;
}

.bottom-left, .bottom-right {
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 200px;
}

.top-left {
  grid-row: 1 / 2;
}

.top-right {
  display: flex;
  flex-direction: column;
  grid-row: 1 / 2;
  grid-column: 2 / 3;
}

.bottom-left {
  grid-row: 2 / 3;
}

.bottom-right {
  grid-row: 2 / 3;
  grid-column: 2 / 3;
}

/* For mobile view (adjust the breakpoint as needed) */

@media screen and (max-width: 768px) {
  .quad-container {
    display: flex;
    flex-direction: column;
    height: auto;
  }
}

/* Reset the grid layout and order for all items */

@media screen and (max-width: 768px) {
  .top-left, .top-right, .bottom-left, .bottom-right {
    grid-area: auto;
    order: unset;
  }
}

/* Allows for automatically hiding and showing elements */

.authenticated-only.unauthenticated {
  display: none;
}

.unauthenticated-only.authenticated {
  display: none;
}

/* Subscription Styles */

.subscriptionPlan {
  background-color: rgb(250, 250, 250) !important;
  min-height: 88px;
  margin-bottom: 0px;
  text-align: center;
  font-weight: bolder;
}

.subscriptionPlan.recommendedPlan {
  background-color: rgb(38,143,207) !important;
  color: #FFFFFF;
  min-height: 88px;
  margin-bottom: 0px;
  text-align: center;
  font-weight: bold;
}

.addOnPack {
  background-color: rgb(100, 100, 100) !important;
  color: #FFFFFF;
  min-height: 88px;
  margin-bottom: 0px;
  text-align: center;
  font-weight: bolder;
}

.addOnPack.recommendedPlan {
  background-color: rgb(38,143,207) !important;
  color: #FFFFFF;
  min-height: 88px;
  margin-bottom: 0px;
  text-align: center;
  font-weight: bold;
}

.perUserSubscriptionPrice {
  font-size: 36px;
  margin-bottom: 0px;
  text-align: center;
  font-weight: bold;
}

.perUserSubscriptionLabel {
  margin-bottom: 0px;
  text-align: center;
}

.perUserSubscriptionCalculatedPrice {
  font-size: 14px;
  margin-bottom: 0px;
  font-weight: bold;
  text-align: center;
}

.subscriptionCell {
  border: 1px solid rgb(250, 250, 250);
}

.subscriptionRolesCell {
  min-height: 162px;
}

.directSubscribeButton {
  margin: auto;
  display: block;
  border-radius: 20px;
  font-size: inherit;
  color: #000;
  box-shadow: none;
  border: none;
  text-shadow: none;
  padding: .5rem 1rem;
  transition: background-color 0.25s;
  font-size: inherit;
}

.directSubscribeButton.recommendedPlan {
  margin: auto;
  display: block;
  background: #56c6c6;
  border-radius: 20px;
  font-size: inherit;
  color: #fff;
  box-shadow: none;
  border: none;
  text-shadow: none;
  padding: .5rem 1rem;
  transition: background-color 0.25s;
  font-size: inherit;
}

.directSubscribeButton:hover {
  background: #66d7d7;
}

.addOnPackColumn {
  border: 1px solid rgb(100, 100, 100);
}

.leftSubscriptionPlanColumn {
  border-left: 1px solid rgb(100, 100, 100);
}

.subscriptionPlanColumn {
  border-top: 1px solid rgb(100, 100, 100);
  border-bottom: 1px solid rgb(100, 100, 100);
}

/* Information asset dialog custom attributes accordion */

#informationAssetDialog #informationAssetCustomAttributesAccordion {
  margin-top: 1rem;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion > .accordion-item {
  border: 1px solid #d2d9e1;
  border-radius: 12px;
  overflow: hidden;
  background-color: #ffffff;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .accordion-button {
  background-color: #ffffff;
  color: #1f2937;
  font-size: 1.25rem;
  font-weight: 300;
  line-height: 1.2;
  box-shadow: none;
  padding: 0.75rem 1rem;
  padding-right: 4.75rem;
  position: relative;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .accordion-button::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin-right: 0.6rem;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 6px solid #111827;
  transform: rotate(0deg);
  transform-origin: center;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .accordion-button:not(.collapsed)::before {
  transform: rotate(90deg);
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .accordion-button::after {
  background-image: none;
  content: "Show";
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  width: auto;
  height: auto;
  margin-left: 0;
  color: #111827;
  font-size: 0.95rem;
  font-weight: 700;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .accordion-button:not(.collapsed)::after {
  content: "Hide";
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .accordion-button:not(.collapsed) {
  background-color: #ffffff;
  color: #1f2937;
  box-shadow: none;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .accordion-button:focus {
  border-color: transparent;
  box-shadow: none;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .accordion-body {
  background-color: #ffffff;
  border-top: 1px solid #d2d9e1;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .table-responsive {
  border: 1px solid #d2d9e1;
  border-radius: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  background-color: #ffffff;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributesTable {
  margin-bottom: 0;
  width: 100%;
  table-layout: fixed;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributesTable thead th {
  background-color: #ebf0f5;
  background-image: linear-gradient(180deg, #f7f9fc 0%, #e7edf3 100%);
  color: #222222;
  border-bottom: 0;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: normal;
  text-transform: none;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributesTable > :not(:first-child) {
  border-top: 0;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributesTable tbody tr:first-child td {
  border-top: 0;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributesTable > :not(caption) > * > * {
  border-color: #d2d9e1;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributesTable th:nth-child(1),
#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributesTable td:nth-child(1) {
  width: 22% !important;
  min-width: 8rem;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributesTable th:nth-child(2),
#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributesTable td:nth-child(2) {
  width: 16% !important;
  min-width: 7rem;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributesTable th:nth-child(4),
#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributesTable td:nth-child(4) {
  width: 9rem !important;
  min-width: 9rem;
  white-space: nowrap;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributeValueCell {
  min-width: 0;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributeUrlControl {
  min-width: 0;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributeUrlControl .customAttributeUrlDisplayLink,
#informationAssetDialog #informationAssetCustomAttributesAccordion .customAttributeUrlControl .customAttributeUrlValueField {
  min-width: 0;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .removeCustomAttributeButton {
  width: 100%;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .accordion-body > .text-end {
  margin-top: 0.75rem;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .addCustomAttributeButton {
  background-color: #eeeeee;
  border-color: #d6d6d6;
  color: #222222;
}

#informationAssetDialog #informationAssetCustomAttributesAccordion .addCustomAttributeButton:hover,
#informationAssetDialog #informationAssetCustomAttributesAccordion .addCustomAttributeButton:focus {
  background-color: #e0e0e0;
  border-color: #c8c8c8;
  color: #222222;
}

/* Sales Enquiry Form */

#Description {
  height: 250px;
}
