:root { --color-primary: #aa3924; }
/* DMCON 2026 — pretalx event theme
   Upload via: Event settings → Display → Custom Event CSS
   Set "Primary colour" in the same tab first; it drives buttons and links. */

/* ---- Edit these four, everything below follows ---- */
:root {
  --dm-bg:      #0E0E10;  /* page background */
  --dm-surface: #1A1A1E;  /* cards, panels, table rows */
  --dm-text:    #EDEDEF;  /* body text */
  --dm-accent:  #A8382A;  /* brand red — match Primary colour */

  --dm-muted:  #9A9AA2;
  --dm-border: #2C2C33;
}

/* ---- Base ---- */
body,
#main-container {
  background: var(--dm-bg);
  color: var(--dm-text);
}

a { color: var(--dm-accent); }

a:hover,
a:focus {
  color: var(--dm-text);
  text-decoration: underline;
}

/* ---- Event header ---- */
.header {
  background: var(--dm-bg);
  border-bottom: 1px solid var(--dm-border);
}

.header h1,
.header a {
  color: var(--dm-text);
}

/* ---- Cards and panels ---- */
.card,
.panel,
.submission-list,
.table {
  background: var(--dm-surface);
  border: 1px solid var(--dm-border);
  color: var(--dm-text);
}

/* ---- Forms: the CFP submission flow ---- */
.form-control,
select,
textarea,
input[type="text"],
input[type="email"],
input[type="url"] {
  background: var(--dm-surface);
  border: 1px solid var(--dm-border);
  color: var(--dm-text);
}

.form-control:focus,
select:focus,
textarea:focus {
  border-color: var(--dm-accent);
  box-shadow: 0 0 0 2px rgba(168, 56, 42, 0.35);
  outline: none;
}

::placeholder { color: var(--dm-muted); }

label,
.form-text,
.help-block {
  color: var(--dm-text);
}

/* ---- Buttons ---- */
.btn-primary,
.btn-success {
  background: var(--dm-accent);
  border-color: var(--dm-accent);
  color: #FFFFFF;
}

.btn-primary:hover,
.btn-success:hover {
  filter: brightness(1.15);
}

.btn-outline-primary {
  border-color: var(--dm-accent);
  color: var(--dm-accent);
}

/* ---- Keyboard focus: keep it visible ---- */
a:focus-visible,
button:focus-visible,
.btn:focus-visible {
  outline: 2px solid var(--dm-accent);
  outline-offset: 2px;
}

/* ---- Steps indicator on the CFP wizard ---- */
.steps .step.is-active .step-icon {
  background: var(--dm-accent);
  border-color: var(--dm-accent);
}