/* H82 (2026-11-05) contact/join form file field + message box.
   1. Empty Bricks .message box hidden; text messages kept (role=alert stays in markup).
   2. Attached state: prompt/icon hidden, one clean row per file, remove button clickable (input no longer covers it).
   3. Focus ring for the file group and the page focus-within outline only for keyboard users (html[data-ics-kbd], set by ics-form-file.js).
   Rollback: delete this file and its manifest entry (see backup folder ROLLBACK.md). */

/* 1. Message box: hide when it has no text */
html body .brxe-form .message:not(:has(.text:not(:empty))) { display: none !important; }
html body .brxe-form .message .text { padding: var(--sp-s) var(--sp-m); }

/* 2. Attached state: group becomes a column, prompt/icon pseudo boxes hidden */
html body .brxe-form .form-group.file:has(> .file-result.show) {
  display: flex !important; flex-direction: column !important; align-items: stretch !important;
  gap: var(--sp-xs) !important; grid-template-rows: none !important; grid-template-columns: none !important;
  position: relative !important; height: auto !important; min-height: 0 !important;
}
html body .brxe-form .form-group.file:has(> .file-result.show)::before,
html body .brxe-form .form-group.file:has(> .file-result.show)::after { display: none !important; content: none !important; }
html body .brxe-form .form-group.file:has(> .file-result.show) > input[type=file] {
  position: absolute !important; left: 0 !important; top: 0 !important; width: 1px !important; height: 1px !important;
  min-height: 0 !important; margin: 0 !important; padding: 0 !important; opacity: 0 !important;
  pointer-events: none !important; z-index: 0 !important; overflow: hidden;
}
html body .brxe-form .form-group.file > .file-result.show {
  position: relative !important; z-index: 3 !important; pointer-events: auto !important;
  grid-row: auto !important; grid-column: auto !important; align-self: stretch !important; justify-self: stretch !important;
  display: flex !important; align-items: center !important; gap: var(--sp-xs) !important;
  box-sizing: border-box; width: 100%; min-height: 44px; margin: 0 !important; padding: var(--sp-xs) var(--sp-s) !important;
}
html body .brxe-form .form-group.file > .file-result.show:not(.danger) {
  background: #fbfbfb !important; color: var(--neutral-800) !important;
  border: 1px solid var(--neutral-200) !important; border-radius: var(--radius-m) !important;
}
html body .brxe-form .form-group.file > .file-result.show:not(.danger)::before {
  content: ''; flex: none; width: 20px; height: 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='9' cy='9' r='2'/%3E%3Cpath d='M21 15l-5-5L5 21'/%3E%3C/svg%3E") no-repeat center / contain;
}
html body .brxe-form .form-group.file > .file-result.show > .text {
  flex: 1 1 auto; min-width: 0; padding: 0 !important; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; font-family: inherit; font-size: var(--fs-body); line-height: var(--lh-body);
}
html body .brxe-form .form-group.file > .file-result.show.danger > .text { white-space: normal; }
html body .brxe-form .form-group.file > .file-result.show.danger > svg { flex: none; width: 1em; height: 1em; cursor: pointer; }
html body .brxe-form .form-group.file > .file-result.show > .remove {
  position: relative; flex: none; display: inline-flex !important; align-items: center; justify-content: center;
  box-sizing: border-box; height: 36px !important; min-height: 36px !important; margin: 0 !important; padding: 0 var(--sp-s) !important;
  font-family: inherit; font-size: var(--fs-small, 14px); font-weight: 600; line-height: 1 !important; text-transform: none;
  color: var(--neutral-800) !important; background: transparent !important;
  border: 1px solid var(--neutral-200) !important; border-radius: var(--radius-m) !important; cursor: pointer;
}
html body .brxe-form .form-group.file > .file-result.show > .remove::after {
  content: ''; position: absolute; inset: -6px -4px;
}
html body .brxe-form .form-group.file > .file-result.show > .remove:hover { background: rgba(0, 0, 0, .05) !important; color: var(--neutral-900) !important; }

/* 3. Focus: no ring after mouse/touch; keyboard ring kept, thinner inside the group */
html:not([data-ics-kbd]) body .brxe-form .form-group.file:has(> input[type=file]:focus-visible),
html:not([data-ics-kbd]) body .brxe-form .form-group.file:focus-within::before,
html:not([data-ics-kbd]) body .brxe-form .form-group.file input[type=file]:focus-visible {
  outline: none !important; box-shadow: none !important;
}
html[data-ics-kbd] body .brxe-form .form-group.file:has(> input[type=file]:focus-visible) {
  outline: 2px solid var(--neutral-900, #000) !important; outline-offset: -4px !important; box-shadow: none !important;
}