/* Smart Bcc (B-081): the deal sidebar section and the Settings > Email templates address box.
   The section head reuses .fields-section-head from fields.css so it lines up with Summary/Intake. */
.smart-bcc-body { display: flex; flex-direction: column; gap: var(--sp-5); padding: var(--sp-2) var(--sp-4) 0; }
.smart-bcc.is-collapsed .smart-bcc-body, .smart-bcc-body[hidden] { display: none; }
.fields.is-filtering .smart-bcc { display: none; } /* not a field: out of the way while filtering */

.smart-bcc-row { display: flex; flex-direction: column; gap: var(--sp-3); }
.smart-bcc-label {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4);
  font-size: var(--fs-md); line-height: var(--lh-md); color: var(--text);
}
.smart-bcc-info {
  display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px;
  color: var(--text-2); border-radius: 50%; cursor: help; flex: none;
  transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.smart-bcc-info:hover { background: var(--bg-hover); color: var(--text); }
.smart-bcc-info:focus-visible { outline: 2px solid var(--border-focus); outline-offset: 0; }
.smart-bcc-info .ic, .smart-bcc-info svg { width: 16px; height: 16px; display: block; }

.smart-bcc-field { position: relative; display: flex; align-items: center; }
.smart-bcc-input.input {
  flex: 1; min-width: 0; height: var(--control-h); padding-right: 36px;
  background: var(--bg-app); color: var(--text); font-size: var(--fs-md);
  text-overflow: ellipsis; cursor: text;
}
.smart-bcc-input.input:focus { border-color: var(--border-focus); outline: none; background: var(--bg-surface); }
.smart-bcc-copy {
  position: absolute; right: 2px; top: 50%; transform: translateY(-50%);
  display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px;
  border: 0; border-radius: var(--r-md); background: none; color: var(--text-2); cursor: pointer;
  transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.smart-bcc-copy:hover:not(:disabled) { background: var(--bg-hover); color: var(--text); }
.smart-bcc-copy:active:not(:disabled) { background: var(--bg-selected); color: var(--blue); }
.smart-bcc-copy:focus-visible { outline: 2px solid var(--border-focus); outline-offset: -2px; }
.smart-bcc-copy:disabled { opacity: 0.4; cursor: default; }
.smart-bcc-copy .ic, .smart-bcc-copy svg { width: 16px; height: 16px; display: block; }
.smart-bcc[data-loaded='0'] .smart-bcc-input.input {
  background: linear-gradient(90deg, var(--bg-hover) 25%, var(--bg-app) 50%, var(--bg-hover) 75%);
  background-size: 200% 100%; animation: smart-bcc-shimmer 1.2s linear infinite;
}
@keyframes smart-bcc-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .smart-bcc[data-loaded='0'] .smart-bcc-input.input { animation: none; } }
.smart-bcc-error { color: var(--red); font-size: var(--fs-sm); line-height: var(--lh-sm); }
.smart-bcc-error[hidden] { display: none; }

/* Settings > Email templates: the universal address above the template list. */
.settings-smart-bcc {
  display: flex; align-items: center; gap: var(--sp-6); margin-bottom: var(--sp-6); padding: var(--sp-5) var(--sp-6);
  border: 1px solid var(--border); border-radius: var(--r-md); background: var(--bg-surface);
}
.settings-smart-bcc-text { flex: 1; min-width: 0; }
.settings-smart-bcc-title { margin: 0 0 var(--sp-1); font-size: var(--fs-md); font-weight: var(--fw-semibold); }
.settings-smart-bcc-hint { margin: 0; color: var(--text-2); font-size: var(--fs-sm); line-height: var(--lh-sm); }
.settings-smart-bcc .smart-bcc-row { flex: 0 1 360px; min-width: 220px; }
@media (max-width: 720px) {
  .settings-smart-bcc { flex-direction: column; align-items: stretch; }
  .settings-smart-bcc .smart-bcc-row { flex-basis: auto; }
}