.calculation_edit_header h1 {
  display: flex;
  align-items: center;
}

.calculation_edit_header.edit h1 .header_display {
  display: none;
}

.calculation_edit_header:not(.edit) h1 .header_edit {
  display: none;
}

.calculation_edit_header.edit .subheader {
  display: none;
}

.calculation_edit_header:not(.edit) .subheader_edit {
  display: none;
}

.calculation_edit_header:not(.edit) #btn_calculation_rename_exec {
  display: none;
}

.calculation_edit_header .subheader_edit {
  width: 100%;
  resize: none;
}

.calculation_edit_header h1 i {
  font-size: 1.5rem;
  opacity: 0.5;
  cursor: pointer;
  margin-left: 0.5rem;
}

.calculation_edit_header h1 i:hover {
  opacity: 1.0;
}

.calculation_edit_header h1 i.enabled {
  opacity: 1.0;
  color: #0A0;
  cursor: default;
}

.calculation_edit_header h1 .header_display_proj {
  margin-right: 1rem;
  color: #888;
  text-decoration: none;
}

.calculation_edit_header h1 .header_display_proj:hover {
  color: #44F;
}

.calculation_edit_header h1 .header_display {
}

.calculation_edit_header h1 .header_display, .calculation_edit_header h1 .header_edit {
  flex-grow: 1;
}

.calculation_edit_header .header_edit input {
  font-size: 1.5rem;
  width: calc(100% - 32px);
}

.calculation_edit_header textarea {
  box-sizing: border-box;
  line-height: 1.5;
}

.calculation_edit_header .div_rename {
  float: right;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.calculation_edit_header .div_rename .spinner {
  margin-right: 1rem;
}

.calculation_edit_header .subheader_type span {
  border: 1px solid #666;
  background-color: #CCC;
  font-size: 1rem;
  padding: 0;
  border-radius: 4px;
  line-height: 1.2;
  padding: 0 0.25rem;
}

#calculation_edit_image svg {
  width: 100%;
  height: auto;
}

#calculation_edit_image {
  padding-top: 0.5rem;
}

.calculation_edit_card_data .card_header_spinner .spinner {
  border-top-color:    #cccccc;
  border-right-color:  #cccccc;
  border-bottom-color: #cccccc;
  border-left-color:   #aaaaaa;
}

.calculation_edit_card_data .card_header_spinner .spinner.ajax_active {
  border-top-color:    #bbbbbb;
  border-right-color:  #bbbbbb;
  border-bottom-color: #bbbbbb;
  border-left-color:   #222222;
}

.calculation_edit_card_image {
  background: #f8f8f8;
}

.calculation_edit_card_image .buttons {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}

@media only screen and (max-width: 45rem) { /* < 720px */
  .card.calculation_edit_card_image .buttons { display: flex !important; flex-direction: column; }
  .calculation_edit_card_image .buttons .btn { margin-top: 4px; }
}

.calculation_edit_card_image .card_header.content-collapsed .buttons {
  visibility: hidden;
}

.calculation_edit_card_image .image-flip-button {

}

.calculation_edit_card_image .image-flip-button.btn-flip-active {
  background-color: #666;
  border-color: #000;
  cursor: default;
}

/* -------------------------------------- */

.calculation_edit_card_data .card_tabheaderrow .card_tabheader.tab_status_none .icon_error { display: none; }
.calculation_edit_card_data .card_tabheaderrow .card_tabheader.tab_status_none .icon_okay  { display: none; }

.calculation_edit_card_data .card_tabheaderrow .card_tabheader.tab_status_error .icon_error { color: #880000; }
.calculation_edit_card_data .card_tabheaderrow .card_tabheader.tab_status_error .icon_okay  { display: none;  }

.calculation_edit_card_data .card_tabheaderrow .card_tabheader.tab_status_missing .icon_error { color: #BB4;   }
.calculation_edit_card_data .card_tabheaderrow .card_tabheader.tab_status_missing .icon_okay  { display: none; }

.calculation_edit_card_data .card_tabheaderrow .card_tabheader.tab_status_validated .icon_error { display: none; }
.calculation_edit_card_data .card_tabheaderrow .card_tabheader.tab_status_validated .icon_okay  { color: #080;   }

/* -------------------------------------- */


.calculation_edit_card_data .tab {
  display: grid;

  align-items: flex-start;

  border-radius: var(--border-radius-medium);
}
.calculation_edit_card_data .tab.tab_1 {  grid-template-columns: 1fr 32px 1fr; }
.calculation_edit_card_data .tab.tab_2 {  grid-template-columns: 2fr 32px 1fr; }
.calculation_edit_card_data .tab.tab_3 {  grid-template-columns: 8fr 32px 7fr; }

.calculation_edit_card_data .tab .left {
  grid-column: 1;

  display: grid;
  grid-template-columns: auto auto 1fr auto 1fr auto;
  grid-column-gap: 0.25rem;
  grid-row-gap: 0.5rem;
}

.calculation_edit_card_data span, .calculation_edit_card_data label {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  white-space: nowrap;
}

.calculation_edit_card_data .tab .left label {
  margin-right: 1rem;
}

.calculation_edit_card_data .tab .left .prefix {
  justify-content: flex-end;
}



.calculation_edit_card_data .tab .left .display_image img.empty_image {
  visibility: hidden;
}

.calculation_edit_card_data .tab .left .display_image img {
  height:100%;
}

.calculation_edit_card_data .tab .left .data_wrapper {
  grid-column: 3 / 6;
}

.calculation_edit_card_data .tab .left .data_wrapper.halfwidth {
  grid-column: unset;
}

/* -------------------------------------- */

.calculation_edit_card_data .tab .right {
  grid-column: 3;

  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-column-gap: 0.25rem;
}

.calculation_edit_card_data .tab .right.right-c3 {
  grid-template-columns: auto minmax(0, 1fr) auto;
}



.calculation_edit_card_data .tab .right.right-c3 .category {
  grid-column-start: 1;
  grid-column-end: -1;

  justify-content: center;
}

.calculation_edit_card_data .tab .right.right-c3 .text {
  text-decoration: underline;
}

.calculation_edit_card_data .tab .right label {
  justify-content: flex-end;
}

/* -------------------------------------- */

.calculation_edit_card_data .tab .category {
  grid-column: 1 / -1;

  justify-content: center;
}

.inline_data_tooltip {
  grid-column-start: 1;
  grid-column-end: 5;

  background: #FFE;
  border: 1px solid #444;
  padding: 0.5rem;

  position: relative;

  white-space: pre-wrap;

  &.full-col { grid-column-end: 6; }
}

.inline_data_tooltip > .fas {
  position: absolute;
  left: -4px;
  top: -4px;
  background: #FFE;
}

.calculation_edit_card_data .tab .category .text {
  text-decoration: underline;
}

.calculation_edit_card_data .tab .spacer {
  grid-column-start: 1;
  grid-column-end: -1;
  height: 3.5rem;
}

.calculation_edit_card_data .tab .spacer.small {
  height: 0.5rem;
}

.calculation_edit_card_data .tab .spacer.middle {
  height: 1.5rem;
}

.calculation_edit_card_data .tab .spacer.bug {
  height: 2.5rem;
}

.calculation_edit_card_data .tab.tab_3 .right label {
  min-width: 216px;
}


.calculation_edit_card_data .tab .left .display_image {
  grid-column: 1/-1;

  height: 200px;
  text-align: center;
}

@media only screen and (max-width: 60rem) { /* < 960px */
  .calculation_edit_card_data .tab {
    grid-template-columns: 100%;
    grid-template-rows: auto 2rem auto;
  }

  .calculation_edit_card_data .tab.tab_1 { grid-template-columns: 100%; }
  .calculation_edit_card_data .tab.tab_2 { grid-template-columns: 100%; }
  .calculation_edit_card_data .tab.tab_3 { grid-template-columns: 100%; }

  .calculation_edit_card_data .tab .left {
    grid-column: 1;
    grid-row: 1;

    grid-template-columns: 200px calc(60px - 0.25rem) minmax(0, 1fr) auto minmax(0, 1fr) 50px;
  }
  .calculation_edit_card_data .tab .right {
    grid-column: 1;
    grid-row: 3;

    grid-template-columns: 260px minmax(0, 1fr);
    margin-right: calc(50px + 0.25rem);
  }
  .calculation_edit_card_data .tab .right.right-c3 {
    grid-template-columns: 260px minmax(0, 1fr) 50px;
    margin-right: 0;
  }

  .calculation_edit_card_data .tab .right label {
    justify-content: flex-start;
  }

}

@media only screen and (max-width: 45rem) { /* < 720px */
  .calculation_edit_card_data .tab .left {
    grid-column: 1;
    grid-row: 1;

    grid-template-columns: auto minmax(0, 1fr) auto;
  }
  .calculation_edit_card_data .tab .right {
    grid-column: 1;
    grid-row: 3;

    grid-template-columns: minmax(0, 1fr);
    margin-right: calc(50px + 0.25rem);
  }
  .calculation_edit_card_data .tab .right.right-c3 {
    grid-template-columns: minmax(0, 1fr) auto;
    margin-right: 0;
  }
  .calculation_edit_card_data .tab label {
    margin-top: 1em;
    grid-column: 1/-1;
  }
  .calculation_edit_card_data .tab .left .display_image { grid-column: 1/-1; }
  .calculation_edit_card_data .tab .category { grid-column: 1/-1; word-break: break-all; white-space: pre; max-width: 100%; overflow-wrap: break-word; overflow-x: hidden; }
  .calculation_edit_card_data .tab .category .text { word-wrap:break-word; white-space: normal; word-break: break-word; text-align: center; }
  .calculation_edit_card_data .tab label span { word-wrap:break-word; white-space: normal; word-break: break-word; }


  .calculation_edit_card_data .tab .left .data_wrapper {
    grid-column: unset;
  }

  .calculation_edit_card_data .tab .left .data_wrapper.halfwidth {
    grid-column: unset;
  }

  .calculation_edit_card_data .tab .left .data_wrapper.halfwidth {
    grid-column: unset;
  }

  .calculation_edit_card_data .tab .left .prefix.prefix-middle {
    grid-column: 1;
  }
}


.calculation_edit_card_data .tab .info-popup-btn {
  font-size: 0.8rem;
  align-self: flex-start;
  margin-top: 0.4rem;
  margin-left: 0.2rem;

  text-decoration: none;

  cursor: pointer;

  user-select: none;
}

.calculation_edit_card_data .tab .left .info-popup-btn:hover {
  color: #00F;
}


/* ---------------------------------------*/

.calculation_edit_card_data .data_wrapper {
  position: relative;

  display: inline-flex;

  padding: 0;
  margin:  0;
}

.calculation_edit_card_data .data_wrapper .data:not(.data-checkbox) {
  width: 100%;
  box-sizing: border-box;
}

.calculation_edit_card_data .data_wrapper .icon_error {
  position: absolute;

  pointer-events: none;

  right: 0.35rem;
  top:   0;
  bottom: 0;

  /*display: flex;*/
  display: none;

  align-items: center;
  justify-content: center;

  color: #880000;
}

.calculation_edit_card_data .select_wrapper.data_wrapper .icon_error
{
  right: 1.75rem;
}

.calculation_edit_card_data .data_wrapper .icon_okay {
  position: absolute;

  pointer-events: none;

  right: 0.55rem;
  top:   0;
  bottom: 0;

  /*display: flex;*/
  display: none;

  align-items: center;
  justify-content: center;

  color: #008800;
}

.calculation_edit_card_data .btn_data_collapse {
  margin-left: 0.2rem;
  margin-right: 0.2rem;
  cursor: pointer;
}
.calculation_edit_card_data .btn_data_collapse:hover {
  color: #00B;
}
.calculation_edit_card_data .btn_data_collapse {
  min-width: 20px;
}

/* ---------------------------------------------------------------------------- */

.calculation_edit_card_data .data_wrapper.input_ok .data:not(.data-checkbox) { border-color: inherit; background-color: inherit; }

.calculation_edit_card_data .data_wrapper.input_error .data { border-color: #F00; background-color: #FCC; }
.calculation_edit_card_data .data_wrapper.input_error .icon_error { display: flex; }
.calculation_edit_card_data .data_wrapper.input_error .data { padding-right: 28px; }

.calculation_edit_card_data .data_wrapper.input_missing .data { background-color: #FFC; border-color: #880; }

.calculation_edit_card_data .data_wrapper.output_none .data { }

.calculation_edit_card_data .data_wrapper.output_missinginput .data { background-color: #FFE; }

.calculation_edit_card_data .data_wrapper.output_calcerror .data { border-color: #F00; background-color: #FDD; }
.calculation_edit_card_data .data_wrapper.output_calcerror .icon_error { display: flex; }
.calculation_edit_card_data .data_wrapper.output_calcerror .data { padding-right: 28px; }

.calculation_edit_card_data .data_wrapper.output_validationerror .data { border-color: #F00; background-color: #FDD; }
.calculation_edit_card_data .data_wrapper.output_validationerror .icon_error { display: flex; }
.calculation_edit_card_data .data_wrapper.output_validationerror .data { padding-right: 28px; }

.calculation_edit_card_data .data_wrapper.output_validated .data { border-color: #080; }
.calculation_edit_card_data .data_wrapper.output_validated .icon_okay { display: flex; }
.calculation_edit_card_data .data_wrapper.output_validated .data { padding-right: 28px; }

.calculation_edit_card_data .data_wrapper.input_ok         .data[readonly] { border-color: #AAA; color: #AAA; }
.calculation_edit_card_data .data_wrapper.output_none      .data[readonly] { border-color: #AAA; color: #AAA; }
.calculation_edit_card_data .data_wrapper.output_validated .data[readonly] { border-color: #AAA; color: #AAA; }


/* ---------------------------------------------------------------------------- */

.calculation_edit_save_btn {
  background-color: var(--col-btn-disabled-background);
  color: var(--col-btn-disabled-foreground);
  border-color: var(--col-btn-disabled-border);
}
.calculation_edit_save_btn:hover {
  color: var(--col-btn-default-foreground);
  border: 1px solid var(--col-btn-default-border);
}

.calculation_edit_save_btn.dirty {
  color: var(--col-btn-default-foreground);
  background-color: var(--col-btn-default-background);
  border: 1px solid var(--col-btn-default-border);
}

/* ---------------------------------------------------------------------------- */

#calculation_inspect_card {
}

#calculation_inspect_card .card_content {
  display: grid;
  grid-template-columns: calc(16px + 0.25rem + 0.25rem) auto auto 1fr auto;

  font-family: monospace;

  padding: 0;

  overflow-x: hidden;
}

#calculation_inspect_card .card_content .col {
  border-bottom: 1px solid var(--col-card-border);
  box-sizing: border-box;
}

#calculation_inspect_card .card_content .col_icons {
  display: flex;
  flex-direction: column;
  justify-content: center;

  padding-left:  0.25rem;
  padding-right: 0.25rem;
}

#calculation_inspect_card .card_content .col_var {
  display: flex;
  flex-direction: column;
  justify-content: center;

  font-weight: bold;

  padding-left: 0.25rem;
  border-left: 1px solid var(--col-card-border);
}

#calculation_inspect_card .card_content .col_equal {
  display: flex;
  flex-direction: column;
  justify-content: center;

  padding-left:  0.5rem;
  padding-right: 0.5rem;
}

#calculation_inspect_card .card_content .col_formula {
  display: block;
  flex-direction: column;
  justify-content: center;

  font-size: 0.8rem;

  padding-right: 0.25rem;
}

#calculation_inspect_card .card_content .inline_var {
  display: inline;
  color: #0000aa;
  font-weight: bold;
  cursor:  help;
}

#calculation_inspect_card .card_content .inline_var:hover {
  color: #0000ff;
}

#calculation_inspect_card .card_content .col_result {
  padding-left: 0.25rem;
  padding-right: 0.25rem;

  border-left: 1px solid var(--col-card-border);
}

#calculation_inspect_card .card_content .col.last {
  border-bottom: none;
}

#calculation_inspect_card .card_content .col.missing {
  background-color: #FFC;
}

#calculation_inspect_card .card_content .col.error {
  background-color: #FCC;
}

#calculation_inspect_card .card_content .unused {
  opacity: 0.5;
}

/* ---------------------------------------------------------------------------- */

.tooltip {
  position: absolute;
  z-index: 300;
  background: #FFE;
  border: 1px solid #444;
  padding: 0.5rem;
  margin-left: 1rem;
  margin-top: 1rem;
  box-shadow: 0 0 10px -2px #000;
  max-width: 30rem;
}

.tooltip.doublesize { max-width: 60rem; }

.tooltip.tttype_table {
  max-width: 60rem;
}

.tooltip.tttype_table table {
	font-size: 0.75rem;
	border: 1px solid #CCC;
	font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
}

.tooltip.tttype_table table td {
		padding: 4px;
		border: 1px solid var(--col-input-border);
}

.tooltip.tttype_table table th {
        padding-left: 4px;
        padding-right: 4px;

		background-color: var(--col-input-background);
		font-size: 12px;
		color: var(--col-input-foreground);
		font-weight: bold;

		border: 1px solid var(--col-input-border);
}

.tooltip span {
  white-space: pre-wrap;
}

#inspect_tooltip {
  visibility: hidden;

  position: absolute;

  display: flex;
  flex-direction: column;
  align-content: center;

  border-bottom: 1px solid #888;

  background-color: #EEE;
  z-index: 500;
}

#inspect_tooltip span {
  border: 1px solid #888;
  border-bottom: none;
  padding: 0 4px;
}

.icon_dependency.master_dependency { color: #F89406; }