/*
 * CulturaFlow — Camada de consistência visual
 * Componentes compartilhados entre painel, demandas, programação,
 * artistas, fiscalização, pagamentos e relatórios.
 *
 * Mantém estilos de layout/cores de avaliação definidos em styles.css.
 * Para novos componentes, use os tokens e padrões descritos
 * em docs/design-system.md. Carregar após styles.css.
 */

/* 1. Tokens de interface */
:root {
  --ui-brand: #177b6d;
  --ui-brand-hover: #116f62;
  --ui-brand-dark: #155b53;
  --ui-brand-soft: #e8f6f1;
  --ui-heading: #233c49;
  --ui-text: #2b4050;
  --ui-muted: #5e737e;
  --ui-subtle: #7d909b;
  --ui-bg: #f5f7f8;
  --ui-surface: #ffffff;
  --ui-surface-hover: #f6faf9;
  --ui-border: #dce6e9;
  --ui-border-soft: #e8eef1;
  --ui-focus: #6ecbb5;
  --ui-danger: #b73a43;
  --ui-danger-hover: #922b34;
  --ui-radius-control: 9px;
  --ui-radius-card: 13px;
  --ui-radius-modal: 16px;
  --ui-shadow-card: 0 2px 10px rgba(28, 57, 70, .035);
  --ui-shadow-hover: 0 6px 18px rgba(28, 57, 70, .10);
  --ui-transition: 150ms ease;
  --ui-control-height: 40px;
}
html { color-scheme: light; }
body { background: var(--ui-bg); color: var(--ui-text); }
small,.muted { color: var(--ui-muted); }
h1,h2,h3 { color: var(--ui-heading); }
button,input,select,textarea { -webkit-tap-highlight-color: transparent; }
:where(p,small,.muted) { overflow-wrap: anywhere; }

/* 2. Botões: primário, secundário, terciário e destrutivo */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: var(--ui-control-height);
  padding: 9px 15px;
  border: 1px solid transparent;
  border-radius: var(--ui-radius-control);
  background: var(--ui-brand);
  color: #fff;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  transition: background var(--ui-transition), border-color var(--ui-transition),
    box-shadow var(--ui-transition), transform var(--ui-transition);
}
.btn:hover:not(:disabled) { background: var(--ui-brand-hover); color: #fff; }
.btn:active:not(:disabled) { transform: translateY(1px); }
.btn.mini {
  min-height: 32px;
  padding: 6px 11px;
  font-size: 11px;
}
.btn.secondary {
  color: #385465;
  background: var(--ui-surface);
  border-color: var(--ui-border);
}
.btn.secondary:hover:not(:disabled) {
  color: var(--ui-brand-dark);
  background: var(--ui-brand-soft);
  border-color: #a8d5c9;
}
.btn.ghost {
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid transparent;
  color: var(--ui-brand-dark);
  background: transparent;
}
.btn.ghost:hover:not(:disabled) {
  background: var(--ui-brand-soft);
  color: var(--ui-brand-dark);
}
.btn.danger {
  background: var(--ui-danger);
  border-color: var(--ui-danger);
  color: #fff;
}
.btn.danger:hover:not(:disabled) {
  background: var(--ui-danger-hover);
  border-color: var(--ui-danger-hover);
}
.btn.danger-outline {
  border-color: #e9bac0;
  background: #fff;
  color: #9a323c;
}
.btn.danger-outline:hover:not(:disabled) {
  background: #fff0f1;
  border-color: #d98b96;
  color: #8d222d;
}
.btn.full { width: 100%; }
button:disabled,.btn:disabled {
  opacity: .55;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}
.btn:disabled:hover { background: var(--ui-brand); }
.btn.secondary:disabled:hover { background: #fff; }
.btn.danger:disabled:hover { background: var(--ui-danger); }

/* 3. Foco de teclado consistente em todos os componentes interativos */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex="0"]:focus-visible {
  outline: 3px solid var(--ui-focus);
  outline-offset: 2px;
}
button:focus:not(:focus-visible) { outline: none; }

/* 4. Campos de formulário e controles de filtro */
.field {
  gap: 7px;
  color: #526b78;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}
.field input:not([type="checkbox"]):not([type="range"]),
.field select,
.field textarea,
.search,
#month-filter,
#payment-select,
.activity select {
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  min-height: var(--ui-control-height);
  padding: 9px 11px;
  font-size: 12px;
  line-height: 1.45;
  transition: border-color var(--ui-transition), box-shadow var(--ui-transition),
    background var(--ui-transition);
}
.field input:not([type="checkbox"]):not([type="range"]):hover,
.field select:hover,.field textarea:hover,
.search:hover,#month-filter:hover,#payment-select:hover,.activity select:hover {
  border-color: #acc6ce;
}
.field input:not([type="checkbox"]):not([type="range"]):focus,
.field select:focus,.field textarea:focus,
.search:focus,#month-filter:focus,#payment-select:focus,.activity select:focus {
  border-color: #42a795;
  box-shadow: 0 0 0 3px rgba(66,167,149,.10);
}
.field textarea {
  min-height: 92px;
  resize: vertical;
}
::placeholder { color: #637783; opacity: 1; }
.search {
  width: 100%;
  margin-bottom: 12px;
}
#month-filter,#payment-select { width: 100%; }
.page-head>.field { min-width: 180px; }
.checkboxline { gap: 12px; min-height: 42px; align-items: center; }
.checkboxline input,
.activity-check input {
  accent-color: var(--ui-brand);
  min-width: 17px;
  width: 17px;
  height: 17px;
  flex-shrink: 0;
}
.rating-row input { accent-color: var(--ui-brand); }
.form-expand {
  border-radius: var(--ui-radius-card);
  border-color: var(--ui-border);
  background: var(--ui-surface-hover);
}
.form-expand summary { color: var(--ui-brand-dark); }
.audience-picker {
  border-radius: var(--ui-radius-control);
  border-color: var(--ui-border);
  background: #f7fbfa;
}
.audience-chip {
  min-height: 38px;
  min-width: 52px;
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius-control);
  background: #fff;
  color: #3e6472;
  font-size: 12px;
  transition: background var(--ui-transition), border-color var(--ui-transition);
}
.audience-chip:hover {
  background: var(--ui-brand-soft);
  border-color: #91cabe;
}
.audience-chip.selected {
  background: var(--ui-brand);
  border-color: var(--ui-brand);
  color: #fff;
}
.planning-switch {
  border-radius: var(--ui-radius-control);
  border-color: var(--ui-border);
  background: #edf3f3;
}
.planning-switch-btn {
  min-height: 34px;
  border-radius: 7px;
  font-size: 12px;
  color: #556f7e;
  transition: background var(--ui-transition), color var(--ui-transition);
}
.planning-switch-btn:hover:not(.selected) { background: #e0edeb; }
.planning-switch-btn.selected {
  color: var(--ui-brand-dark);
  background: #fff;
  box-shadow: 0 1px 5px rgba(22, 56, 65, .12);
}

/* 5. Contêineres, cartões e superfícies */
.panel,
.metric,
.dashboard-home-grid .agenda-area {
  border: 1px solid var(--ui-border-soft);
  border-radius: var(--ui-radius-card);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-card);
}
.metric { padding: 21px; }
.metric .number { color: var(--ui-heading); }
.panelhead { align-items: center; }
.panelhead h2 { color: var(--ui-heading); }
.page-head h1 { color: var(--ui-heading); }
.eyebrow { color: var(--ui-brand-dark); }
.subhead {
  border-color: var(--ui-border-soft);
  gap: 12px;
}
.activity {
  border-color: var(--ui-border-soft);
  border-radius: var(--ui-radius-control);
  background: #fbfdfc;
}
.artist-card {
  border-radius: var(--ui-radius-card);
  border-color: var(--artist-card-outline, var(--ui-border));
  background: var(--artist-card-bg, #fff);
  box-shadow: var(--ui-shadow-card);
}
.artist-card:hover { box-shadow: var(--ui-shadow-hover); }
.artist-card .artist-card-name { color: var(--artist-card-title, var(--ui-heading)); }
.artist-credential,.artist-rating { overflow-wrap: anywhere; }
.delete-artist-summary {
  border-color: var(--ui-border);
  border-radius: var(--ui-radius-control);
}
.delete-artist-dependencies>div { border-radius: var(--ui-radius-control); }
.notice {
  border-radius: var(--ui-radius-control);
  border-color: #cee5e6;
  background: #edf7f8;
  color: #426975;
}
.notice.warning {
  border-color: #edd59e;
  background: #fff7e9;
  color: #78551d;
}

/* 6. Menu, listas e cartões clicáveis */
.nav {
  min-height: 42px;
  border-radius: var(--ui-radius-control);
  transition: background var(--ui-transition);
}
.nav.active,.nav[aria-current="page"] { background: #285263; color: #fff; }
.nav:hover { background: #244757; }
.list-item,
.demand-option,
.dashboard-home-grid .agenda-card {
  transition: background var(--ui-transition),
    border-color var(--ui-transition), box-shadow var(--ui-transition);
}
.list-item { padding: 14px 8px; border-radius: 6px; }
.list-item:hover { background: var(--ui-surface-hover); }
.demand-option {
  border-radius: var(--ui-radius-control);
  padding: 15px 12px;
  border-left: 0;
}
.demand-option.selected {
  border-left: 0;
  background: var(--ui-brand-soft);
  box-shadow: inset 3px 0 0 var(--ui-brand);
}
.demand-option:hover { background: #f0f8f5; }
.dashboard-home-grid .agenda-card {
  border-color: var(--ui-border);
  border-radius: var(--ui-radius-card);
}
.dashboard-home-grid .agenda-card:hover {
  border-color: #88c4b5;
  box-shadow: var(--ui-shadow-hover);
}
.dashboard-home-grid .agenda-area .dashboard-area-head .btn {
  min-height: 32px;
  padding: 6px 11px;
  font-size: 11px;
  border-radius: var(--ui-radius-control);
}

/* 7. Tabelas e indicadores de situação */
.table th {
  padding: 13px 12px;
  border-color: var(--ui-border-soft);
  background: #f5f8f9;
  color: #566e7b;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .55px;
}
.table td {
  padding: 14px 12px;
  border-color: var(--ui-border-soft);
  color: var(--ui-text);
}
.table tbody tr:hover { background: #f8fbfa; }
.table tbody tr:focus-within { background: #f4faf8; }
.tablewrap,.plan-wide-scroll { scrollbar-width: thin; }
.plan-wide-scroll { border-color: var(--ui-border); border-radius: var(--ui-radius-control); }
.badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.35;
  padding: 5px 9px;
  text-align: center;
  white-space: normal;
}
.badge.info,.badge.blue { background:#e1efff; color:#275c96; }
.badge.success,.badge.green { background:#dff3e7; color:#206a45; }
.badge.warn,.badge.yellow { background:#fff0d5; color:#90611a; }
.badge.danger,.badge.red { background:#fce6e8; color:#a12f3b; }

/* 8. Modais, mensagens e ações de formulário */
.form-modal { background: rgba(16, 36, 47, .70); backdrop-filter: blur(3px); }
.dialog {
  border: 1px solid var(--ui-border-soft);
  border-radius: var(--ui-radius-modal);
  box-shadow: 0 22px 64px rgba(9, 29, 39, .22);
}
.modalhead { align-items: flex-start; }
.modalhead h2 { color: var(--ui-heading); }
.close {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  min-width: 36px;
  width: 36px;
  height: 36px;
  border: 1px solid var(--ui-border-soft);
  border-radius: var(--ui-radius-control);
  background: #f6f9fa;
  color: #5c7280;
  font-size: 22px;
  transition: background var(--ui-transition);
}
.close:hover { background: #e9f1f2; }
.actions {
  align-items: center;
  flex-wrap: wrap;
  border-color: var(--ui-border-soft);
  gap: 10px;
}
.dialog .actions .btn { min-width: 106px; }
.draft {
  border-color: var(--ui-border);
  border-radius: var(--ui-radius-control);
  background: #f8fafb;
}
#toast {
  border-radius: var(--ui-radius-control);
  background: #183847;
  box-shadow: 0 9px 27px rgba(12, 38, 48, .18);
  line-height: 1.5;
}

/* 9. Ajustes para tablets, celulares e acessibilidade */
@media (max-width: 820px) {
  .nav { min-height: 39px; }
  .topbar { gap: 10px; }
  .top-actions { flex-shrink: 0; }
  .dashboard-home-grid .agenda-area .dashboard-area-head { gap: 10px; }
}
@media (max-width: 560px) {
  .page-head { gap: 14px; }
  .page-head>.field { width: 100%; }
  .page-head>.field input { width: 100%; }
  .panelhead { align-items: flex-start; flex-wrap: wrap; }
  .actions { flex-direction: column-reverse; align-items: stretch; }
  .dialog .actions .btn { width: 100%; }
  .dashboard-home-grid .agenda-area { padding: 15px; }
  .top-actions { gap: 5px; }
  .top-actions .badge { display: none; }
  .topbar { padding: 0 12px; }
  .crumb { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) {
  .btn,.nav,.list-item,.demand-option,.audience-chip,.planning-switch-btn,
  .dashboard-home-grid .agenda-card,.artist-card,.close {
    transition: none !important;
  }
}


/* Busca de artistas e sugestões de instituições / locais */
.artist-search-panel{
 display:grid;
 gap:9px;
 background:var(--ui-surface);
 border:1px solid var(--ui-border-soft);
 border-radius:var(--ui-radius-card);
 padding:17px 19px;
 margin:0 0 16px;
 box-shadow:var(--ui-shadow-card);
}
.artist-search-controls{display:flex;align-items:stretch;gap:10px;}
.artist-search-controls .search{flex:1;min-width:0;margin:0;min-height:var(--ui-control-height);}
.artist-search-controls .btn{flex:0 0 auto;}
.search-feedback{font-size:11px;color:var(--ui-muted);font-weight:650;}
.artist-search-empty{
 grid-column:1/-1;
 padding:29px 20px;
 text-align:center;
 border:1px dashed var(--ui-border);
 border-radius:var(--ui-radius-card);
 color:var(--ui-muted);
 background:#fff;
 font-size:12px;
 line-height:1.65;
}
.artist-picker{
 display:grid;
 gap:10px;
 padding:13px 14px;
 border:1px solid var(--ui-border);
 border-radius:var(--ui-radius-control);
 background:#f7fbfa;
}
.artist-picker select{width:100%;}
.field-hint{font-size:10.5px;color:var(--ui-muted);line-height:1.55;font-weight:450;}
@media (max-width:560px){
 .artist-search-panel{padding:14px;}
 .artist-search-controls{gap:8px;}
 .artist-search-controls .btn{padding:8px 12px;}
 .artist-picker{padding:12px;}
}



/* Relatórios: indicadores, filtros, tabelas e impressão */
.reports-workspace .report-tools{padding:18px 20px;margin-bottom:19px;}
.report-tools-heading{display:flex;flex-direction:column;gap:5px;margin-bottom:14px;}
.report-tools-heading strong{font-size:14px;color:var(--ui-heading);}
.report-tools-heading span{font-size:11px;color:var(--ui-muted);line-height:1.5;}
.report-filters{display:flex;align-items:end;gap:10px;flex-wrap:wrap;}
.report-filters .field{min-width:185px;flex:0 1 245px;}
.report-filters>.btn{align-self:end;}
.report-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:15px;padding-top:13px;border-top:1px solid var(--ui-border-soft);}
.report-tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:18px;}
.report-tab{border:1px solid var(--ui-border);border-radius:var(--ui-radius-control);background:#fff;color:#4c6572;font-size:12px;font-weight:750;min-height:39px;padding:9px 13px;}
.report-tab:hover:not(.selected){background:var(--ui-brand-soft);border-color:#acd7ca;}
.report-tab.selected{background:var(--ui-brand);border-color:var(--ui-brand);color:#fff;}
.report-current{display:grid;gap:18px;}
.report-metrics{margin:0;grid-template-columns:repeat(4,minmax(0,1fr));}
.report-metrics .metric{min-width:0;}
.report-metrics .metric .number{font-size:27px;overflow-wrap:anywhere;}
.report-columns{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(255px,.75fr);gap:18px;align-items:start;}
.report-columns .panel{height:100%;}
.report-bars{display:grid;gap:13px;margin-top:14px;}
.report-bar-row{display:grid;grid-template-columns:minmax(120px,1.15fr) minmax(60px,1fr) 43px;gap:13px;align-items:center;font-size:11px;}
.report-bar-label{font-weight:700;color:var(--ui-text);line-height:1.35;overflow-wrap:anywhere;}
.report-bar-row>strong{text-align:right;font-size:11px;color:var(--ui-heading);font-variant-numeric:tabular-nums;}
.report-bar-track{position:relative;background:#e9f1f3;height:12px;border-radius:999px;overflow:hidden;}
.report-bar-fill{display:block;height:100%;background:var(--ui-brand);border-radius:999px;}
.report-definition{display:grid;gap:4px;margin-top:12px;border-bottom:1px solid var(--ui-border-soft);padding-bottom:11px;}
.report-definition:last-child{border:0;padding-bottom:0;}
.report-definition strong{font-size:11px;color:var(--ui-heading);}
.report-definition span{font-size:11px;color:var(--ui-muted);line-height:1.5;}
.report-tablewrap{border:1px solid var(--ui-border-soft);border-radius:var(--ui-radius-control);margin-top:8px;}
.report-table{min-width:780px;}
.report-table td,.report-table th{white-space:normal;line-height:1.5;}
.report-table td:not(:first-child){font-variant-numeric:tabular-nums;}
.report-table th:first-child,.report-table td:first-child{min-width:170px;}
.report-table-link{border:0;background:none;padding:2px 0;text-align:left;font-weight:800;font-size:12px;color:var(--ui-brand-dark);text-decoration:underline;text-underline-offset:3px;white-space:normal;}
.report-table-link:hover{color:var(--ui-brand);}
.report-drilldown-list{display:grid;gap:6px;}
.report-demand-link{width:100%;display:flex;justify-content:space-between;align-items:center;gap:15px;background:#fbfdfc;border:1px solid var(--ui-border-soft);border-radius:var(--ui-radius-control);padding:11px 14px;text-align:left;color:var(--ui-text);}
.report-demand-link:hover{border-color:#9ad0c0;background:var(--ui-brand-soft);}
.report-demand-link>span{display:grid;gap:5px;min-width:0;}
.report-demand-link strong{font-size:12px;overflow-wrap:anywhere;}
.report-demand-link small{font-size:10px;color:var(--ui-muted);line-height:1.45;}
.report-demand-status{text-align:right;flex-shrink:0;}
.report-empty{padding:21px 0;font-size:12px;color:var(--ui-muted);}
.report-print-heading{display:none;}
.report-footer-note{margin-top:20px;font-size:10px;color:var(--ui-muted);line-height:1.5;}
@media(max-width:1220px){.report-columns{grid-template-columns:1fr;}.report-metrics .metric .number{font-size:24px;}}
@media(max-width:820px){.report-metrics{grid-template-columns:repeat(2,minmax(0,1fr));}.report-filters .field{flex:1 1 165px;}}
@media(max-width:560px){
 .report-metrics .metric .number{font-size:22px;}
 .report-tools .report-actions .btn{flex:1 1 100%;}
 .report-tab{flex:1 1 42%;min-height:40px;font-size:11px;}
 .report-bar-row{grid-template-columns:minmax(90px,.95fr) minmax(40px,1fr) 31px;gap:8px;}
 .report-demand-link{align-items:start;flex-direction:column;}
 .report-demand-status{text-align:left;}
}
@media print{
 @page{size:A4;margin:14mm;}
 html,body{background:#fff!important;color:#111!important;}
 .sidebar,.topbar,.inline-footer,#toast,.report-tools,.report-tabs,
 .report-current .btn,.report-footer-note{display:none!important;}
 .layout{display:block!important;min-height:0!important;}
 .main{width:100%!important;}
 .content{max-width:100%!important;padding:0!important;margin:0!important;}
 .reports-workspace>.page-head{margin:0 0 7mm!important;}
 .reports-workspace>.page-head .eyebrow{color:#333!important;}
 .reports-workspace>.page-head h1{font-size:20pt!important;}
 .reports-workspace>.page-head p{font-size:9pt!important;}
 .report-print-heading{display:block!important;border-bottom:1px solid #ccc;margin-bottom:7mm;padding-bottom:4mm;}
 .report-print-heading h2{font-size:15pt;margin:0 0 5px;}
 .report-print-heading p{font-size:9pt;margin:0;}
 .reports-workspace .report-current{display:block!important;}
 .reports-workspace .report-current .panel,
 .reports-workspace .report-current .metric{break-inside:avoid;box-shadow:none!important;border-color:#bbb!important;}
 .reports-workspace .report-current .metrics,.report-columns{gap:8px!important;margin:0 0 8mm!important;}
 .reports-workspace .report-current .panel{margin-bottom:6mm!important;}
 .report-tablewrap{overflow:visible!important;}
 .report-table{min-width:0!important;font-size:8pt!important;}
 .report-table th,.report-table td{padding:6px 5px!important;word-break:break-word;}
 .report-bar-fill{background:#555!important;print-color-adjust:exact;-webkit-print-color-adjust:exact;}
 .report-table-link{text-decoration:none!important;color:#111!important;}
 .report-metrics .metric .number{font-size:19pt!important;}
 .report-drilldown{display:none!important;}
 .reports-workspace .notice{background:#fff!important;color:#333!important;border:1px solid #ccc!important;}
}


/* Modalidade de contratação: filtros de artistas, sem alterar cor de avaliação */
.artist-type-filters{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-top:3px;}
.artist-type-filter{display:inline-flex;align-items:center;justify-content:center;min-height:35px;min-width:68px;padding:7px 12px;border:1px solid var(--ui-border);border-radius:var(--ui-radius-control);background:var(--ui-surface);color:#526b79;font-size:11px;font-weight:750;transition:background var(--ui-transition),border-color var(--ui-transition);}
.artist-type-filter:hover:not(.selected){background:var(--ui-brand-soft);border-color:#8ecab9;}
.artist-type-filter.selected{background:var(--ui-brand);border-color:var(--ui-brand);color:#fff;}
.artist-filter-help{display:block;color:var(--ui-muted);font-size:10px;line-height:1.5;}
.artist-type-line{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:10px 0 7px;}
.artist-modality-badge{display:inline-flex;max-width:100%;align-items:center;}
.artist-modality-badge .badge{font-size:10px;}
@media(max-width:560px){.artist-type-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}.artist-type-filter{width:100%;}}


/* Importação local de credenciamento e catálogo de propostas */
.artist-header-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.artist-imported-summary{display:flex;flex-direction:column;gap:8px;margin:10px 0 8px;font-size:10.5px;color:var(--ui-muted);line-height:1.5;}
.artist-imported-summary .btn{align-self:flex-start;}
.credential-import-intro{display:grid;gap:13px;font-size:12px;color:var(--ui-text);line-height:1.55;}
.credential-import-intro p{margin:0;}
.credential-import-intro small{font-size:11px;color:var(--ui-muted);}
.credential-import-review{display:grid;gap:14px;font-size:12px;line-height:1.65;}
.credential-import-review>p{margin:0;color:var(--ui-muted);}
.credential-import-counts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;}
.credential-import-counts>div{display:grid;justify-items:center;gap:5px;border:1px solid var(--ui-border);background:#f7faf9;padding:15px 8px;border-radius:var(--ui-radius-control);}
.credential-import-counts strong{font-size:23px;color:var(--ui-brand-dark);font-variant-numeric:tabular-nums;}
.credential-import-counts span{font-size:10px;color:var(--ui-muted);text-align:center;}
.credential-proposal-list{display:grid;gap:11px;max-height:57vh;overflow:auto;padding-right:4px;}
.credential-proposal{border:1px solid var(--ui-border);border-radius:var(--ui-radius-control);padding:13px;background:#fbfdfc;}
.credential-proposal>strong{display:block;font-size:12px;line-height:1.5;margin-bottom:9px;color:var(--ui-heading);overflow-wrap:anywhere;}
.credential-proposal-fields{display:flex;flex-wrap:wrap;gap:5px 13px;font-size:10px;color:var(--ui-muted);line-height:1.5;}
.credential-proposal-fields span{overflow-wrap:anywhere;}
.credential-proposal-fields b{color:var(--ui-heading);}
.artist-picker>[data-apply-credential-proposal]{justify-self:start;}
@media(max-width:560px){
 .artist-header-actions{width:100%;}.artist-header-actions .btn{flex:1 1 auto;}
 .credential-import-counts{gap:5px;}.credential-import-counts>div{padding:11px 5px;}
 .credential-import-counts strong{font-size:19px;}
}

.artist-import-history{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;background:#eff8f6;border:1px solid #c7e5dc;border-radius:var(--ui-radius-card);padding:13px 16px;margin-bottom:15px;}
.artist-import-history>div{display:grid;gap:4px;}
.artist-import-history strong{font-size:12px;color:var(--ui-heading);}
.artist-import-history small{font-size:10.5px;color:var(--ui-muted);line-height:1.5;}
.artist-import-history .artist-import-warning{color:#94552a;}
