/* apps/web/src/legacy/app/approval-management-v1.css */
.apv1-root {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}
.apv1-root h2,
.apv1-root h3 {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0;
}
.apv1-root button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.apv1-root small {
  color: var(--mis-ui-muted,#75859b);
}
.apv1-panel {
  display: block;
  min-width: 0;
  padding: 0;
  overflow: hidden;
}
.apv1-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
}
.apv1-panel > header svg {
}
.apv1-filters {
  display: flex;
  gap: 12px;
  align-items: flex-end;
  flex-wrap: wrap;
  padding: 14px 16px;
}
.apv1-filters label,
.apv1-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
}
.apv1-filters input,
.apv1-filters select {
  min-height: 32px;
  max-width: 100%;
}
.apv1-table {
  overflow: auto;
  max-width: 100%;
  scrollbar-width: thin;
}
.apv1-table table {
  width: 100%;
}
.apv1-table th,
.apv1-table td {
  padding: 12px;
  text-align: left;
  vertical-align: middle;
}
.apv1-table th {
  white-space: nowrap;
  color: var(--mis-ui-muted,#75859b);
}
.apv1-table td > strong,
.apv1-table td > small {
  display: block;
}
.apv1-table td > small {
  margin-top: 5px;
}
.apv1-table select {
  min-height: 30px;
}
.apv1-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 32px 20px;
}
.apv1-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
}
.apv1-pager > div {
  display: flex;
  gap: 8px;
}
.apv1-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.apv1-bi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.apv1-bi-grid > .apv1-panel:last-child {
  grid-column: 1/-1;
}
.apv1-report-meta {
  display: flex;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
  padding: 16px;
}
.apv1-catalog {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.apv1-catalog > article:first-child {
  min-height: 350px;
}
.apv1-stack {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}
.apv1-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 16px;
}
.apv1-field input,
.apv1-field select,
.apv1-field textarea {
  min-height: 32px;
  width: 100%;
  min-width: 0;
}
.apv1-actions {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
  padding: 14px 16px;
}
.apv1-field-plan {
  padding: 14px 16px;
  border-top: 1px solid var(--mis-ui-line,#e5eaf2);
  line-height: 1.85;
  color: var(--mis-ui-muted,#75859b);
}
.apv1-field-plan p {
  margin: 6px 0;
}
.apv1-flow-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 14px;
  padding: 16px;
}
.apv1-flow-layout .apv1-fields {
  padding: 0;
}
.apv1-node-list {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  padding-right: 14px;
  border-right: 1px solid var(--mis-ui-line,#e5eaf2);
}
.apv1-node-list > span {
  text-align: center;
  color: var(--mis-ui-muted,#75859b);
  padding: 8px;
}
.apv1-node-list > button {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  text-align: left;
  padding: 12px;
}
.apv1-node-list small {
  display: block;
  flex-basis: 100%;
  margin-left: 20px;
}
.apv1-presets {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.apv1-swatch {
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
}
.apv1-thumb {
  height: 170px;
  position: relative;
  overflow: hidden;
  margin: 16px 16px 0;
  background: #edf2f8;
  border-radius: 9px;
  padding: 14px;
  color: #8292a9;
}
.apv1-thumb-window {
  position: absolute;
  right: 8px;
  top: 8px;
  width: 45%;
  height: 154px;
  border-radius: 5px;
  overflow: hidden;
  background: #e8eef5;
  box-shadow: 0 5px 16px #27456720;
}
.apv1-thumb-window > header {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 7px;
  background: var(--approval-color,#365f8d);
  color: #fff;
}
.apv1-thumb-window > i {
  display: block;
  height: 25px;
  margin: 8px;
  background: #f7f9fc;
  border-radius: 4px;
}
.apv1-thumb-window > div {
  position: absolute;
  bottom: 9px;
  right: 6px;
  color: var(--approval-color,#365f8d);
}
.thumb-wide .apv1-thumb-window {
  width: 65%;
}
.thumb-center .apv1-thumb-window {
  left: 25%;
  right: auto;
  width: 50%;
}
.thumb-center {
  background: #d6dfe9;
}
.thumb-full .apv1-thumb-window {
  width: auto;
  left: 8px;
}
.thumb-floating .apv1-thumb-window {
  height: 122px;
  top: auto;
  bottom: 8px;
  width: 40%;
}
.thumb-floating .apv1-thumb-window > i {
  height: 15px;
}
.thumb-split .apv1-thumb-window {
  width: 50%;
  height: 100%;
  top: 0;
  right: 0;
  border-radius: 0;
}
.apv1-time-contract {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding: 16px;
}
.apv1-time-contract > div {
  padding: 15px;
  background: var(--mis-ui-soft,#f3f6fb);
  border-radius: 8px;
  line-height: 1.8;
}
.apv1-time-contract strong {
  margin-left: 7px;
}
.apv1-time-contract p {
  margin: 8px 0 0;
  color: var(--mis-ui-muted,#75859b);
}
.apv1-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--mis-ui-line,#e5eaf2);
}
.apv1-action-status {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 15px;
  border: 1px solid var(--mis-ui-line,#dce5f2);
  border-radius: 8px;
  background: var(--mis-ui-soft,#f3f6fb);
}
.apv1-action-status > button {
  margin-left: auto;
}
.apv1-window-stage {
  height: 500px;
  position: relative;
  background: #edf2f8;
  overflow: auto;
  border-radius: 9px;
}
.apv1-business-demo {
  position: absolute;
  inset: 12px;
  padding: 12px;
  background: #f8fafd;
  color: #7e90a9;
  border-radius: 8px;
}
.apv1-business-demo strong {
  display: flex;
  gap: 7px;
  align-items: center;
}
.apv1-business-demo i {
  display: block;
  height: 30px;
  margin-top: 14px;
  border: 1px solid #e0e7f0;
  background: #eff3f9;
}
.apv1-approval-window {
  position: relative;
  margin: var(--approval-inset,5px);
  margin-left: auto;
  width: 65%;
  background: #e8eef5;
  border: 1px solid #c5d3e3;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 12px 30px #213c602b;
  z-index: 2;
}
.apv1-approval-window > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: var(--approval-color,#365f8d);
  padding: 12px;
}
.apv1-approval-window > header > div {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}
.apv1-approval-window > header button {
  padding: 4px;
}
.apv1-window-body {
  padding: 14px;
}
.apv1-window-body h3 {
  margin: 8px 0;
}
.apv1-window-body p {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #647b96;
}
.apv1-window-body textarea {
  width: 100%;
  min-height: 70px;
  padding: 10px;
  resize: vertical;
}
.apv1-decisions {
  display: flex;
  gap: 7px;
  justify-content: flex-end;
  padding: 10px 0;
}
.apv1-decisions button {
  padding: 7px 11px;
}
.apv1-decisions button:nth-child(2) {
}
.apv1-decisions button:nth-child(3) {
}
.apv1-approval-window > footer {
  margin: 0 14px 14px;
  padding: 10px;
  display: flex;
  justify-content: center;
  gap: 7px;
  background: #d5e1ef;
  color: #4a6381;
  border-radius: 6px;
}
.mode-wide .apv1-approval-window {
  width: 82%;
}
.mode-center:before {
  content: "";
  position: absolute;
  inset: 0;
  background: #263b5540;
  z-index: 1;
}
.mode-center .apv1-approval-window {
  width: 75%;
  margin: 35px auto;
}
.mode-full .apv1-approval-window {
  width: calc(100% - 10px);
  min-height: 490px;
}
.mode-split .apv1-approval-window {
  width: 50%;
  margin: 0 0 0 auto;
  min-height: 500px;
  border-radius: 0;
}
.mode-split .apv1-business-demo {
  right: 51%;
}
.apv1-approval-window.is-collapsed.has-glass {
  background: #365f8d18;
  backdrop-filter: blur(3px);
}
.apv1-approval-window.is-collapsed.has-glass > header {
  background: #365f8d40;
}
.apv1-approval-window.is-collapsed .apv1-decisions {
  padding: 7px 12px;
}
@media (max-width: 1100px) {
  .apv1-presets {
    grid-template-columns: 1fr 1fr;
  }
  .apv1-metrics {
    grid-template-columns: 1fr 1fr;
  }
  .apv1-catalog {
    grid-template-columns: 185px minmax(0, 1fr);
  }
}
@media (max-width: 760px) {
  .apv1-catalog,
  .apv1-flow-layout,
  .apv1-bi-grid,
  .apv1-time-contract,
  .apv1-fields,
  .apv1-presets {
    grid-template-columns: minmax(0, 1fr);
  }
  .apv1-catalog > article:first-child {
    min-height: 0;
  }
  .apv1-node-list {
    border-right: 0;
    padding: 0;
  }
  .apv1-filters > * {
    max-width: 100%;
    flex: 1 1 140px;
  }
  .apv1-table table {
    min-width: 620px;
  }
  .apv1-approval-window {
    width: 90%;
  }
  .mode-split .apv1-approval-window {
    width: 65%;
  }
  .mode-split .apv1-business-demo {
    right: 66%;
  }
  .apv1-pager {
    flex-wrap: wrap;
  }
}
.apv1-approval-window.has-reminder > header > div > svg {
  animation: apv1-reminder 1.6s ease-in-out infinite;
}
@keyframes apv1-reminder {
  0%, 45%, 100% {
    transform: rotate(0);
  }
  10%, 30% {
    transform: rotate(-10deg);
  }
  20%, 40% {
    transform: rotate(10deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .apv1-approval-window.has-reminder > header > div > svg {
    animation: none;
  }
}

/* apps/web/src/legacy/app/approval-center-dashboard-v1.css */
.apv1-center-dashboard {
  gap: 10px;
}
.apv1-center-filters {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.6fr) auto;
  align-items: center;
  padding: 10px 14px;
}
.apv1-center-filters .apv1-center-filter {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
}
.apv1-center-charts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}
.apv1-center-chart-slot {
  display: grid;
  min-width: 0;
  align-content: start;
}
.apv1-center-times {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.apv1-center-record {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.apv1-center-items > header {
  flex-wrap: wrap;
}
.apv1-center-page-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.apv1-center-report-details {
  margin: 0 16px 12px;
  min-width: 0;
}
.apv1-center-report-details > summary {
  display: flex;
  align-items: center;
  gap: 7px;
}
.apv1-center-report-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 0 16px 16px;
}
.apv1-center-report-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px;
  padding: 0 16px 16px;
}
@media (max-width: 900px) {
  .apv1-center-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .apv1-center-charts,
  .apv1-center-report-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .apv1-center-report-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 540px) {
  .apv1-center-filters,
  .apv1-center-times,
  .apv1-center-report-metrics {
    grid-template-columns: minmax(0, 1fr);
  }
}
