.cae-execution-center {
  --execution-primary:
    var(--primary, #b91c1c);

  --execution-primary-soft:
    #fef2f2;

  --execution-border:
    #dfe4ea;

  --execution-surface:
    #ffffff;

  --execution-text:
    #172033;

  --execution-muted:
    #667085;

  color:
    var(--execution-text);
}

.cae-execution-center * {
  box-sizing:
    border-box;
}

.cae-execution-center button,
.cae-execution-center input,
.cae-execution-center select {
  font:
    inherit;
}

.cae-execution-center button {
  cursor:
    pointer;
}

.cae-execution-center button:disabled {
  cursor:
    not-allowed;

  opacity:
    0.6;
}

.cae-execution-center__header {
  display:
    flex;

  align-items:
    flex-start;

  justify-content:
    space-between;

  gap:
    24px;

  margin-bottom:
    20px;
}

.cae-execution-center__eyebrow {
  margin-bottom:
    6px;

  color:
    var(--execution-primary);

  font-size:
    11px;

  font-weight:
    800;

  letter-spacing:
    0.12em;

  text-transform:
    uppercase;
}

.cae-execution-center__title {
  margin:
    0;

  color:
    var(--execution-text);

  font-size:
    clamp(
      25px,
      3vw,
      34px
    );

  line-height:
    1.1;

  letter-spacing:
    -0.035em;
}

.cae-execution-center__description {
  max-width:
    760px;

  margin:
    10px 0 0;

  color:
    var(--execution-muted);

  font-size:
    14px;

  line-height:
    1.55;
}

.cae-execution-center__actions {
  display:
    flex;

  gap:
    9px;

  flex-wrap:
    wrap;

  justify-content:
    flex-end;
}

.cae-execution-center__button {
  min-height:
    40px;

  padding:
    0 15px;

  border:
    1px solid transparent;

  border-radius:
    9px;

  font-weight:
    750;
}

.cae-execution-center__button--primary {
  background:
    var(--execution-primary);

  color:
    #ffffff;
}

.cae-execution-center__button--secondary {
  border-color:
    var(--execution-border);

  background:
    #ffffff;

  color:
    var(--execution-text);
}

.cae-execution-center__metrics {
  display:
    grid;

  grid-template-columns:
    repeat(
      4,
      minmax(
        0,
        1fr
      )
    );

  gap:
    12px;

  margin-bottom:
    18px;
}

.cae-execution-center__metric {
  padding:
    17px;

  border:
    1px solid
    var(--execution-border);

  border-radius:
    14px;

  background:
    var(--execution-surface);
}

.cae-execution-center__metric-label {
  margin-bottom:
    8px;

  color:
    var(--execution-muted);

  font-size:
    11px;

  font-weight:
    800;

  letter-spacing:
    0.05em;

  text-transform:
    uppercase;
}

.cae-execution-center__metric-value {
  font-size:
    27px;

  font-weight:
    850;

  letter-spacing:
    -0.04em;
}

.cae-execution-center__workspace {
  display:
    grid;

  grid-template-columns:
    minmax(
      0,
      1.55fr
    )
    minmax(
      350px,
      0.85fr
    );

  gap:
    18px;

  align-items:
    start;
}

.cae-execution-center__panel {
  overflow:
    hidden;

  border:
    1px solid
    var(--execution-border);

  border-radius:
    15px;

  background:
    var(--execution-surface);

  box-shadow:
    0 8px 24px
    rgba(
      15,
      23,
      42,
      0.06
    );
}

.cae-execution-center__panel-header {
  min-height:
    66px;

  padding:
    16px 18px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    16px;

  border-bottom:
    1px solid
    var(--execution-border);
}

.cae-execution-center__panel-title {
  margin:
    0;

  font-size:
    16px;

  font-weight:
    820;
}

.cae-execution-center__panel-caption {
  margin-top:
    3px;

  color:
    var(--execution-muted);

  font-size:
    11px;
}

.cae-execution-center__filters {
  display:
    flex;

  align-items:
    center;

  gap:
    8px;

  flex-wrap:
    wrap;
}

.cae-execution-center__input,
.cae-execution-center__select {
  min-height:
    38px;

  padding:
    0 10px;

  border:
    1px solid
    var(--execution-border);

  border-radius:
    8px;

  background:
    #ffffff;

  color:
    var(--execution-text);
}

.cae-execution-center__table-wrap {
  overflow-x:
    auto;
}

.cae-execution-center__table {
  width:
    100%;

  border-collapse:
    collapse;
}

.cae-execution-center__table th {
  padding:
    12px 13px;

  border-bottom:
    1px solid
    var(--execution-border);

  background:
    #f8fafc;

  color:
    var(--execution-muted);

  font-size:
    10px;

  font-weight:
    800;

  letter-spacing:
    0.05em;

  text-align:
    left;

  text-transform:
    uppercase;

  white-space:
    nowrap;
}

.cae-execution-center__table td {
  padding:
    14px 13px;

  border-bottom:
    1px solid
    #edf0f3;

  font-size:
    12px;

  vertical-align:
    middle;
}

.cae-execution-center__row {
  cursor:
    pointer;
}

.cae-execution-center__row:hover,
.cae-execution-center__row--selected {
  background:
    var(--execution-primary-soft);
}

.cae-execution-center__company {
  font-weight:
    780;
}

.cae-execution-center__secondary {
  margin-top:
    3px;

  color:
    var(--execution-muted);

  font-size:
    10px;
}

.cae-execution-center__status {
  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  min-width:
    86px;

  padding:
    5px 8px;

  border-radius:
    999px;

  font-size:
    10px;

  font-weight:
    850;
}

.cae-execution-center__status--completed {
  background:
    #f0fdf4;

  color:
    #15803d;
}

.cae-execution-center__status--created,
.cae-execution-center__status--queued,
.cae-execution-center__status--processing {
  background:
    #eff6ff;

  color:
    #1d4ed8;
}

.cae-execution-center__status--partially-completed {
  background:
    #fffbeb;

  color:
    #b45309;
}

.cae-execution-center__status--failed,
.cae-execution-center__status--cancelled {
  background:
    #fef2f2;

  color:
    #b91c1c;
}

.cae-execution-center__progress-label {
  margin-bottom:
    5px;

  font-size:
    10px;

  font-weight:
    780;
}

.cae-execution-center__progress-track {
  min-width:
    90px;

  height:
    6px;

  overflow:
    hidden;

  border-radius:
    999px;

  background:
    #e9edf2;
}

.cae-execution-center__progress-bar {
  width:
    0;

  height:
    100%;

  border-radius:
    inherit;

  background:
    linear-gradient(
      90deg,
      var(--execution-primary),
      #ef4444
    );

  transition:
    width 0.3s ease;
}

.cae-execution-center__empty {
  padding:
    48px 18px;

  color:
    var(--execution-muted);

  line-height:
    1.55;

  text-align:
    center;
}

.cae-execution-center__detail {
  padding:
    18px;
}

.cae-execution-center__detail-header {
  display:
    flex;

  align-items:
    flex-start;

  justify-content:
    space-between;

  gap:
    12px;

  margin-bottom:
    16px;
}

.cae-execution-center__detail-company {
  margin:
    0;

  font-size:
    19px;

  font-weight:
    850;
}

.cae-execution-center__detail-period {
  margin-top:
    4px;

  color:
    var(--execution-muted);

  font-size:
    12px;
}

.cae-execution-center__detail-progress {
  padding:
    15px;

  margin-bottom:
    15px;

  border:
    1px solid
    var(--execution-border);

  border-radius:
    12px;

  background:
    #f8fafc;
}

.cae-execution-center__detail-progress-header {
  display:
    flex;

  justify-content:
    space-between;

  gap:
    12px;

  margin-bottom:
    9px;

  font-size:
    12px;

  font-weight:
    800;
}

.cae-execution-center__detail-grid {
  display:
    grid;

  grid-template-columns:
    repeat(
      2,
      minmax(
        0,
        1fr
      )
    );

  gap:
    9px;
}

.cae-execution-center__field {
  min-height:
    66px;

  padding:
    11px;

  border:
    1px solid
    var(--execution-border);

  border-radius:
    10px;
}

.cae-execution-center__field-label {
  margin-bottom:
    5px;

  color:
    var(--execution-muted);

  font-size:
    9px;

  font-weight:
    800;

  letter-spacing:
    0.05em;

  text-transform:
    uppercase;
}

.cae-execution-center__field-value {
  font-size:
    12px;

  font-weight:
    730;

  word-break:
    break-word;
}

.cae-execution-center__run-id {
  margin-top:
    12px;

  padding:
    10px;

  border-radius:
    9px;

  background:
    #111827;

  color:
    #e5e7eb;

  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Consolas,
    monospace;

  font-size:
    10px;

  word-break:
    break-all;
}

.cae-execution-center__error {
  margin:
    12px 16px 16px;

  padding:
    11px;

  border:
    1px solid
    #fecaca;

  border-radius:
    9px;

  background:
    #fef2f2;

  color:
    #b91c1c;

  font-size:
    11px;

  line-height:
    1.45;
}

.cae-execution-center__technical-search {
  display:
    flex;

  gap:
    7px;

  margin-top:
    14px;

  padding-top:
    14px;

  border-top:
    1px solid
    var(--execution-border);
}

.cae-execution-center__technical-search
.cae-execution-center__input {
  flex:
    1;

  min-width:
    0;
}

.cae-execution-center__hidden {
  display:
    none !important;
}

@media (
  max-width:
    1120px
) {
  .cae-execution-center__workspace {
    grid-template-columns:
      1fr;
  }
}

@media (
  max-width:
    800px
) {
  .cae-execution-center__header {
    flex-direction:
      column;
  }

  .cae-execution-center__actions {
    justify-content:
      flex-start;
  }

  .cae-execution-center__metrics {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }
}

@media (
  max-width:
    520px
) {
  .cae-execution-center__metrics,
  .cae-execution-center__detail-grid {
    grid-template-columns:
      1fr;
  }

  .cae-execution-center__technical-search {
    flex-direction:
      column;
  }
}
