/*
 * Operafy aplicado à app (sobrepõe o fluent.css).
 * Mantém a estrutura e os nomes das classes; só muda cores, raios e sombras.
 * Carregar sempre depois de fluent.css.
 */

:root {
  --bg-base: #f7f7f7;
  --surface: #ffffff;
  --surface-subtle: #fafafa;
  --surface-hover: #f7f7f7;
  --surface-pressed: #efefef;
  --border-subtle: #efefef;
  --border-default: #e6e6e6;

  --brand: #111111;              /* botão principal e estados ativos */
  --brand-hover: #2a2a2a;
  --brand-pressed: #000000;
  --brand-subtle: #f2f2f2;       /* fundo de linha selecionada */

  --text-primary: #111111;
  --text-secondary: #5f5f5f;
  --text-tertiary: #8c8c8c;
  --danger: #d1283a;
  --success: #059669;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;

  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-flyout: 0 8px 24px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
}

/* Botões e campos em pílula */
.btn,
.btn-primary,
.search-box {
  border-radius: 999px;
}

/* Cartões e painéis com o raio do Operafy */
.files-card,
.inspector-pane,
.auth-card,
.batch-bar,
.fluent-dialog,
.fluent-context-menu,
.upload-dropzone,
.command-bar {
  border-radius: var(--radius-lg);
}

/* Estados selecionados: cinzento claro, sem o azul de antes */
.file-table tr.selected,
.file-table tr.selected td {
  background: var(--brand-subtle) !important;
}
.grid-item.selected {
  background: var(--brand-subtle);
}