@import url('./account.css');
@import url('./delivery-report.css');

/* The report was drawn for the editors; these map its colours onto the site's own. */
:root {
  --studio-text: #f5f5f7;
  --studio-dim: #a1a1a6;
  --studio-hairline: #ffffff17;
  --accent: #d8b46a;
  --accent-strong: #e3c68e;
  --warn: #e6a95e;
  --control-text: 14px;
  --caption-text: 12px;
}

.check-layout { display: grid; gap: 22px; max-width: 860px; }
.check-layout .lede { max-width: 640px; }
.nav-link { color: #e3c68e; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; white-space: nowrap; }
.nav-link:hover { text-decoration: underline; text-underline-offset: 3px; }
input[type="file"] { padding: 10px; min-height: 48px; cursor: pointer; }
#check-form select { background: #1d1d1f; color: #f5f5f7; border: 1px solid #424245; border-radius: 12px; padding: 10px 12px; }
#check-form .delivery-profile-form input { font-size: 16px; }
#check-form select, #check-form .delivery-profile-actions button { min-height: 44px; }
#check-form .delivery-profiles > summary { padding: 12px 0; }
.check-report:empty { display: none; }
#check-result { background: #161617; border-radius: 28px; box-shadow: inset 0 0 0 1px #ffffff12; padding: 12px 32px 26px; }
.check-report .delivery-report > summary { font-size: 16px; }
.check-list { list-style: none; margin: 0; padding: 0; }
.check-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; padding: 14px 0; border-top: 1px solid #ffffff17; }
.check-name { overflow-wrap: anywhere; color: #f5f5f7; }
.check-when { grid-column: 1; color: #a1a1a6; font-size: 12px; }
.check-actions { grid-column: 2; grid-row: 1 / span 2; display: flex; gap: 8px; align-items: center; }
.check-actions button { min-height: 44px; }
@media (max-width: 560px) {
  #check-result { padding: 4px 18px 18px; }
  .check-item { grid-template-columns: minmax(0, 1fr); }
  .check-actions { grid-column: 1; grid-row: auto; }
}