/*
  Nested form: Product hierarchy (Business Group → Company → Separate Account → Product)
  Grid layout, compact field widths, card sections, accordion-friendly.
*/

/* Section wrapper – compact */
.nested-form-section {
  margin-top: 0.75rem;
  padding-top: 0.5rem;
}

.nested-form-section__title {
  font-size: 1rem;
  font-weight: 600;
  color: #2c5f8d;
  margin: 0 0 0.35rem 0;
}

.nested-form-section__desc {
  font-size: 0.875rem;
  color: #6c757d;
  margin: 0 0 0.5rem 0;
}

.nested-form-hierarchy {
  margin-top: 0.5rem;
}

.nested-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.nested-list--companies {
  margin-bottom: 0.75rem;
}

/* Card-style nested entries */
.nested-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.nested-card--company {
  border-left: 3px solid #2c5f8d;
}

.nested-card--product {
  border-left: 3px solid #94a3b8;
  margin-left: 1rem;
}

.nested-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem 0.75rem;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  cursor: pointer;
}

.nested-card__header--sub {
  padding: 0.4rem 0.75rem;
  background: #f1f5f9;
}

.nested-card__title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #334155;
}

.nested-card__body {
  padding: 0.5rem 0.75rem;
}

.nested-card__actions {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.35rem;
}

.nested-card__actions .btn-icon {
  flex-shrink: 0;
}

/* Allocation group: delete inside card top-right (no extra row), card identifier */
.allocation-group-entry__card {
  position: relative;
  min-width: 0;
  border-left: 2px solid #2c5f8d;
}

.allocation-group-entry__remove {
  position: absolute;
  top: 0.5rem;
  right: 0.75rem;
  z-index: 1;
}

.allocation-group-entry__row {
  display: block;
}

/* Investment Options: section header, delete inside card aligned with body padding */
.nested-section--inv-options .section-header-compact {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.nested-section--inv-options .section-header-compact__actions {
  margin-left: auto;
  justify-content: flex-end;
}

.nested-section--inv-options .inv-option-entry__card {
  position: relative;
  border-left: 2px solid #0d9488;
}

.nested-section--inv-options .inv-option-entry__remove {
  position: absolute;
  top: 0.5rem;
  right: 0.75rem;
  z-index: 1;
}

/* Card type labels: quick identification of Allocation Group vs Investment Option */
.card-type-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 0.5rem;
  padding-bottom: 0.25rem;
  border-bottom: 1px solid #e2e8f0;
}

.card-type-label--allocation-group {
  color: #2c5f8d;
}

.card-type-label--inv-option {
  color: #0d9488;
}

/* Centralized form-row grids inside nested cards – aligned, minimal gap */
.nested-card__body .form-row {
  display: grid;
  gap: 0.35rem 0.75rem;
  margin-bottom: 0.5rem;
}

.nested-card__body .form-row .form-group {
  margin-bottom: 0;
}

.nested-card__body .form-group--end {
  display: flex;
  justify-content: flex-end;
}

.nested-card__body .form-row--2 {
  grid-template-columns: repeat(2, 1fr);
}

.nested-card__body .form-row--3 {
  grid-template-columns: repeat(3, 1fr);
}

.nested-card__body .form-row--4 {
  grid-template-columns: repeat(4, 1fr);
}

.nested-card__body .form-row--5,
.nested-card__body .form-row--five {
  grid-template-columns: repeat(5, 1fr);
}

.nested-card__body .form-row--6 {
  grid-template-columns: repeat(6, 1fr);
}

.nested-card__body .form-row--1 {
  grid-template-columns: 1fr;
}

@media (max-width: 992px) {
  .nested-card__body .form-row--3,
  .nested-card__body .form-row--4,
  .nested-card__body .form-row--5,
  .nested-card__body .form-row--five,
  .nested-card__body .form-row--6 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .nested-card__body .form-row--2,
  .nested-card__body .form-row--3,
  .nested-card__body .form-row--4,
  .nested-card__body .form-row--5,
  .nested-card__body .form-row--five,
  .nested-card__body .form-row--6 {
    grid-template-columns: 1fr;
  }
}

.nested-card__body:not(.is-open) {
  display: none;
}

.nested-card__body.is-open {
  display: block;
}

.nested-card__row {
  display: flex;
  align-items: flex-end;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.nested-card__row .nested-form-remove {
  flex-shrink: 0;
  margin-left: auto;
}

/* Form grid: 2 columns, controlled widths */
.form-grid {
  display: grid;
  gap: 0.5rem 1rem;
  margin-bottom: 0.75rem;
}

.form-grid--2 {
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}

.form-grid--inline {
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  align-items: end;
}

/* Field width classes – avoid full-width for short fields */
.form-group--w-short {
  max-width: 200px;
}

.form-group--w-narrow {
  max-width: 120px;
}

.form-group--w-medium {
  max-width: 260px;
}

.form-group--w-date {
  max-width: 150px;
}

.form-group--w-select {
  max-width: 200px;
}

.form-group--w-full {
  max-width: none;
}

.form-grid--allocation {
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  align-items: end;
}

.form-grid .form-group {
  margin-bottom: 0;
}

/* Nested subsection (Separate Accounts, Products) */
.nested-section {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
}

.nested-section--products {
  margin-left: 0;
  padding-top: 0.5rem;
}

.nested-section__title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
  margin: 0 0 0.5rem 0;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.nested-section__title h5,
.nested-section__title h6 {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
}

/* Remove button */
.nested-form-remove {
  white-space: nowrap;
}

.btn-outline-danger {
  background: transparent;
  color: #dc3545;
  border: 1px solid #dc3545;
}

.btn-outline-danger:hover {
  background: #dc3545;
  color: #fff;
}

/* Accordion: panel hidden when not .is-open */
[data-accordion-target="panel"]:not(.is-open) {
  display: none;
}

/* M&E fields: states dropdown uses full width of its cell (shared partial has width: 50%) */
.me-fields .state-dual-selector {
  width: 100% !important;
}

/* CDSC fields: states dropdown uses full width of its cell (shared partial has width: 50%) */
.cdsc-fields .state-dual-selector {
  width: 100% !important;
}

/* -------------------------------------------------------------------------
   Charge form: identification same as Investment (section titles, card labels, left border)
   ------------------------------------------------------------------------- */
.charges-form-container .section-header-compact {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
}
.charges-form-container .section-header-compact__actions {
  margin-left: auto;
}
.charges-form-container .nested-form-section__title {
  font-size: 1rem;
  font-weight: 600;
  color: #2c5f8d;
  margin: 0;
}
/* Charge form: same pattern as Investment (parent vs child). Borders on entry __card classes. */
/* Parent cards: blue (#2c5f8d) – Initial Sale, M&E Charge, CDSC Charge */
.charges-form-container .sale-entry__card,
.charges-form-container .me-charge-entry__card,
.charges-form-container .cdsc-charge-entry__card {
  position: relative;
  min-width: 0;
  border-left: 2px solid #2c5f8d !important;
}
/* Child card: green (#0d9488) – Initial Sales Case */
.charges-form-container .case-entry__card {
  position: relative;
  min-width: 0;
  margin-left: 0.75rem;
  border-left: 2px solid #0d9488 !important;
}
/* Parent card label: blue */
.charges-form-container .card-type-label--charge {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #2c5f8d;
  margin-bottom: 0.5rem;
  padding-bottom: 0.25rem;
  border-bottom: 1px solid #e2e8f0;
}
/* Child card label: green (Initial Sales Case) */
.charges-form-container .card-type-label--charge-case {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #0d9488;
  margin-bottom: 0.5rem;
  padding-bottom: 0.25rem;
  border-bottom: 1px solid #e2e8f0;
}
.charges-form-container .nested-card__body {
  position: relative;
  padding: 0.5rem 2.5rem 0.5rem 0.75rem;
}
.charges-form-container .remove-sale-btn,
.charges-form-container .remove-case-btn,
.charges-form-container .remove-me-btn,
.charges-form-container .remove-cdsc-btn {
  position: absolute;
  top: 0.5rem;
  right: 0.75rem;
  z-index: 1;
}
.charges-form-container .nested-form-header,
.charges-form-container .nested-case-header {
  padding-right: 2.5rem;
}

/* Responsive */
@media (max-width: 768px) {
  .form-grid--2,
  .form-grid--inline {
    grid-template-columns: 1fr;
  }

  .form-group--w-short,
  .form-group--w-narrow,
  .form-group--w-medium,
  .form-group--w-date,
  .form-group--w-select {
    max-width: none;
  }

  .nested-card__row {
    flex-direction: column;
    align-items: stretch;
  }

  .nested-card__row .nested-form-remove {
    margin-left: 0;
  }
}
