/* Copyright 2026 My Digital Sovereignty Ltd. All rights reserved. Proprietary and confidential; unauthorised copying, use or distribution is prohibited. */

/* email-decision-record-capture.css: the owner console's Capture section
   (public/js/email-decision-record-capture.js draws every element styled here; the shell page
   public/email-decision-record.html links this file after the Policy tab's stylesheet), and the
   "Incoming, not yet sorted" section beneath it (email-decision-record-correspondents.js), which shares every rule.

   Tokens only, so light, dark and AUTO themes all work (village-tokens.css loaded first). States are never colour
   alone: an error has a bar at its left edge AND bold weight; a fault is labelled by its own sentence. Keyboard
   focus is a visible ring on every control. */

#edr-capture-tab, #edr-correspondents-section {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 var(--s-4) var(--s-7);
  overflow-wrap: anywhere;
}
#edr-capture-tab h2, #edr-correspondents-section h2 { font: var(--text-h2); margin: var(--s-5) 0 var(--s-3); }
#edr-capture-tab h3, #edr-correspondents-section h3 { font: var(--text-h3); margin: 0 0 var(--s-2); }
#edr-capture-tab h4, #edr-correspondents-section h4 { font: var(--text-h3); margin: 0 0 var(--s-2); }
#edr-capture-tab p, #edr-correspondents-section p { margin: 0 0 var(--s-3); }
#edr-capture-tab .edr-capture-note, #edr-correspondents-section .edr-capture-note { color: var(--muted); font: var(--text-small); }

.edr-capture-list { list-style: none; margin: 0; padding: 0; }
.edr-capture-item {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--raised);
  padding: var(--s-4);
  margin: 0 0 var(--s-3);
}
#edr-capture-tab .edr-capture-state, #edr-correspondents-section .edr-capture-state { font-weight: 600; }
#edr-capture-tab .edr-capture-waiting, #edr-correspondents-section .edr-capture-waiting { font-weight: 600; }
#edr-capture-tab .edr-capture-fault, #edr-correspondents-section .edr-capture-fault {
  border-left: 3px solid var(--danger);
  padding: var(--s-1) 0 var(--s-1) var(--s-3);
}
.edr-capture-facts { display: grid; grid-template-columns: max-content 1fr; gap: var(--s-1) var(--s-4); margin: 0 0 var(--s-3); }
.edr-capture-facts dt { color: var(--muted); font: var(--text-small); }
.edr-capture-facts dd { margin: 0; }

.edr-capture-form, .edr-capture-panel { display: grid; gap: var(--s-3); }
.edr-capture-panel {
  border-top: 1px solid var(--border);
  margin-top: var(--s-3);
  padding-top: var(--s-3);
}
.edr-capture-field { display: grid; gap: var(--s-1); }
.edr-capture-field label { font-weight: 600; }
.edr-capture-field input, .edr-capture-field select {
  min-height: 40px;
  padding: var(--s-2) var(--s-3);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-md);
  background: var(--surface, var(--raised));
  color: var(--text);
  font: inherit;
  max-width: 100%;
}
.edr-capture-field input:focus-visible, .edr-capture-field select:focus-visible {
  outline: 2px solid var(--focus); outline-offset: 0; border-color: var(--accent);
}

#edr-capture-tab button, #edr-correspondents-section button {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 40px; padding: var(--s-2) var(--s-4);
  border-radius: var(--r-md);
  font-weight: 600; font-size: 15px;
  background: var(--raised);
  border: 1px solid var(--border-strong);
  color: var(--text);
  margin: var(--s-1) var(--s-2) var(--s-1) 0;
}
#edr-capture-tab button:hover, #edr-correspondents-section button:hover { background: var(--sunken); }
#edr-capture-tab button:focus-visible, #edr-correspondents-section button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
#edr-capture-tab button[disabled], #edr-correspondents-section button[disabled] { opacity: .5; cursor: not-allowed; }
#edr-capture-tab .edr-capture-primary, #edr-correspondents-section .edr-capture-primary {
  background: var(--accent); border-color: var(--accent); color: var(--on-accent);
}
#edr-capture-tab .edr-capture-primary:hover, #edr-correspondents-section .edr-capture-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
@media (pointer: coarse) {
  #edr-capture-tab button, #edr-correspondents-section button { min-height: 44px; }
}

#edr-capture-tab .edr-capture-error, #edr-correspondents-section .edr-capture-error {
  color: var(--danger);
  font-weight: 600;
  border-left: 3px solid var(--danger);
  padding: var(--s-1) 0 var(--s-1) var(--s-3);
}
#edr-capture-tab .edr-capture-success, #edr-correspondents-section .edr-capture-success {
  color: var(--success);
  font-weight: 600;
  border-left: 3px solid var(--success);
  padding: var(--s-1) 0 var(--s-1) var(--s-3);
}
#edr-capture-tab .edr-capture-confirm, #edr-correspondents-section .edr-capture-confirm { border-top: 2px solid var(--danger); }

@media (max-width: 480px) {
  .edr-capture-facts { grid-template-columns: 1fr; }
}