/* =========================================
   10-COMPONENTS / ACCORDION
   - Bootstrap accordion theming + custom grids
   - Drag & drop helpers, card header actions
   - Location Servicing badges
   - Edit-mode and compact row utilities
   ========================================= */
@layer components {

  /* -----------------------------------------
     Local component vars (accordion-specific)
     ----------------------------------------- */
  .accordion {
    --accordion-active-bg: #e6ecf5;     /* only used here */
    --accordion-body-bg: var(--clr-trash-bg); /* = #d5b3c4 from settings */
  }

  /* =========================
     ======= Accordion =======
     ========================= */
  /* Applies everywhere — overrides Bootstrap white default */
  .accordion-button {
    background-color: transparent !important;
    box-shadow: none;
  }
  /* Compact sizing for /locations only */
  [id^="accordion-b"] .accordion-button,
  [id^="accordion-unassigned"] .accordion-button {
    font-weight: 300;
    font-size: var(--fs-xs-s);
    transition: all 0.1s;
    border-radius: 5px;
    padding: 2px 2px;
    max-height: 15px;
    line-height: 1;
  }
  /* Caret icon — /locations only */
  [id^="accordion-b"] .accordion-button::after,
  [id^="accordion-b"] .accordion-button:not(.collapsed)::after,
  [id^="accordion-unassigned"] .accordion-button::after,
  [id^="accordion-unassigned"] .accordion-button:not(.collapsed)::after {
    filter: brightness(0) invert(1);
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
  }
  [id^="accordion-b"] .accordion-button:not(.collapsed),
  [id^="accordion-unassigned"] .accordion-button:not(.collapsed) {
    background-color: var(--accordion-active-bg);
    color: var(--clr-text);
    box-shadow: none;
  }

  .accordion-item {
    border: none;
    margin-bottom: 5px;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 2px 5px var(--black-a06);
  }

  /* /locations accordion header */
  [id^="accordion-b"] .accordion-header,
  [id^="accordion-unassigned"] .accordion-header {
    background-color: var(--clr-berry-800);
    padding: 0.5rem 1rem;
    color: var(--clr-white);
    margin: 0;
  }

  .accordion-header-row {
    display: flex;
    align-items: center;
    width: 100%;
    font-weight: 700;
  }
  .accordion-header-row .cell {
    padding: 0 10px;
    font-size: var(--fs-base-s);
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--clr-black);
  }

  /* Location Records – header cell sizing */
  .accordion-header-row .cell-1 { flex: 1.1; font-weight: 400; color: var(--clr-white); }
  .accordion-header-row .cell-2 { flex: 0.6; text-transform: uppercase; font-weight: 700; color: var(--clr-white); }
  .accordion-header-row .cell-3 { flex: 0.6; font-weight: 400; color: var(--clr-white); }
  .accordion-header-row .cell-4 { flex: 0.25; font-weight: 400; color: var(--clr-white); }
  .accordion-header-row .status-cell { flex: 0.25; font-weight: 400; }
  .accordion-header-row .cell-6 { flex: 0.25; font-weight: 400; }

  /* Accordion Body — /locations compact sizing */
  [id^="accordion-b"] .accordion-body,
  [id^="accordion-unassigned"] .accordion-body {
    background-color: var(--accordion-body-bg);
    padding: 15px;
    font-size: var(--fs-sm-s);
    line-height: 1;
  }

  /* Location Team header sizes */
  .accordion-header-row .loc-cell-1 { flex: 0.75; font-weight: 400; color: var(--clr-white); font-size: var(--fs-md-s); }
  .accordion-header-row .loc-cell-2 { flex: 0.9;  text-transform: uppercase; font-weight: 700; color: var(--clr-white); font-size: var(--fs-md-s); }
  .accordion-header-row .loc-cell-3 { flex: 0.6;  font-weight: 400; color: var(--clr-white); font-size: var(--fs-md-s); }
  .accordion-header-row .loc-cell-4 { flex: 1;    font-weight: 400; color: var(--clr-white); font-size: var(--fs-md-s); }

  /* =================
     ===== Cards =====
     ================= */
  .card { margin-bottom: 0; border-radius: 4px; }
  .card-header { padding: 5px 10px; font-size: var(--fs-md-s); }
  .card-body { padding: 10px 10px; font-size: var(--fs-sm-s); }
  .col-main { padding: 2px 2px; min-height: 45px; }

  /* Card Header variants */
  .card-header-location-id        { margin-bottom: 0; background-color: var(--clr-success); color: var(--clr-white); border-bottom: 1px solid var(--black-a12); }
  .card-header-scripted           { margin-bottom: 0; background-color: rgba(0, 0, 0, 0.03); border-bottom: 1px solid var(--black-a12); }
  .card-header-location-category  { margin-bottom: 0; background-color: var(--clr-warning); color: var(--clr-white); border-bottom: 1px solid var(--black-a12); }
  .card-header-featured-blocks    { margin-bottom: 0; background-color: var(--clr-primary-dark); color: var(--clr-white); border-bottom: 1px solid var(--black-a12); }

  /* Checkbox */
  .checkbox-margin { margin-left: 10px; }

  /* ==============================
     Drag & Drop (Contacts lists)
     ============================== */
  .contacts-list .contact-item { cursor: grab; }
  .contacts-list .contact-item.dragging { opacity: 0.6; }
  .contacts-list .drop-spacer { height: 10px; border: 1px dashed var(--gray-300); margin: .25rem 0; }
  .drag-handle { cursor: grab; user-select: none; }
  .drag-handle:active { cursor: grabbing; }

  /* Unified spacer (visual gap while dragging) */
  .drop-spacer{
    height: 12px;
    margin: 4px 0;
    border: 2px dashed var(--bs-secondary);
    border-radius: 6px;
  }

  /* Visual affordance for the dragging item */
  .contact-item.dragging { opacity: .6; }

  /* ================================
     CARD HEADERS (tiny action btns)
     ================================ */
  .card-header .edit-section,
  .card-header .save-btn,
  .card-header .cancel-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    padding: 0;
    margin-left: 4px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    box-shadow: none;
  }
  .card-header .edit-section .bi,
  .card-header .save-btn .bi,
  .card-header .cancel-btn .bi {
    font-size: var(--fs-xl-s);
    line-height: 1;
  }

  /* Save (✓) */
  .card-header .save-btn         { border-color: #19875422; }
  .card-header .save-btn .bi     { color: var(--clr-success); }
  .card-header .save-btn:hover   { background: #19875414; border-color: #19875444; }

  /* Cancel (×) */
  .card-header .cancel-btn       { border-color: #dc354522; }
  .card-header .cancel-btn .bi   { color: var(--clr-danger); }
  .card-header .cancel-btn:hover { background: #dc354514; border-color: #dc354544; }

  /* Keep it behaving like a plain span */
  span.card-title {
    display: inline;
    margin: 0;
    line-height: inherit;
    vertical-align: middle;
    align-self: center;
  }

  /* Optional icon sizing overrides */
  .bi.bi-check-lg { font-size: var(--fs-xl-s); color: var(--clr-success); background: transparent; }
  .bi.bi-x-lg     { font-size: var(--fs-xl-s); color: var(--clr-danger); background: transparent; }

  .field-group { display: contents; }

  /* ==================================
     Tri-state sub-field helpers
     ================================== */
  .ls-hide { display: none !important; }
  .ls-field { display: inline-flex; align-items: center; gap: 6px; }
  .ls-field input.form-control {
    height: 28px;
    padding: 2px 6px;
    font-size: var(--fs-base-s);
  }
  .ls-label {
    white-space: nowrap;
    font-size: var(--fs-sm-s);
    color: var(--white-a50);
  }

  /* ================================
     Block Dividers (sticky labels)
     ================================ */
  :root{
    --divider-bg: rgba(0,0,0,.40);
    --divider-blur: 4px;
    --divider-top-offset: 0px;
    --divider-radius: .5rem;
    --divider-z: 3;
    --divider-accent: var(--clr-berry-800);
  }
  /* ================================
     Edit Mode Styling (global-ish)
     ================================ */
  .edit-mode .edit-field,
  .edit-mode .form-control.edit-field,
  .edit-mode select.edit-field,
  .edit-mode textarea.edit-field { background-color: var(--edit-bg) !important; border-color: var(--edit-border); }
  .edit-mode .form-label { color: #23507a; font-weight: 600; margin-bottom: .25rem; }
  .scene-line { break-inside: avoid; -webkit-column-break-inside: avoid; }

  .card .edit-mode :where(input, select, textarea)[data-field],
  .card :where(input, select, textarea).edit-mode[data-field] { background-color: var(--edit-bg) !important; border-color: var(--edit-border) !important; }
  .card .edit-mode :where(input, select, textarea)[data-field]:focus,
  .card :where(input, select, textarea).edit-mode[data-field]:focus { box-shadow: var(--focus-shadow); }
  .card .view-mode .view-field { user-select: text; color: inherit; }

  /* ===========================================
     Locations: Block Grid + Accordion (scoped)
     =========================================== */
  .page-locations .sb-page .card.h-100 { border: 1px solid var(--black-a08); box-shadow: 0 4px 14px var(--black-a06); border-radius: .75rem; }
  .page-locations .sb-page .card > .card-header { background: #f8f9fa; border-bottom: 1px solid var(--black-a06); font-weight: 600; }

  /* Berry-themed accordions */
  .accordion[id^="accordion-b"] .accordion-header { background: var(--clr-berry-800); }
  .accordion[id^="accordion-b"]{
    --bs-accordion-bg: var(--clr-white);
    --bs-accordion-border-color: var(--black-a08);
    --bs-accordion-btn-padding-x: .5rem;
    --bs-accordion-btn-padding-y: .4rem;
    --bs-accordion-btn-color: var(--clr-white);
    --bs-accordion-btn-bg: var(--clr-berry-800);
    --bs-accordion-active-color: var(--clr-white);
    --bs-accordion-active-bg: var(--clr-berry-900-deep);
    --bs-accordion-btn-focus-box-shadow: 0 0 0 .2rem var(--berry-a25);
  }
  .accordion[id^="accordion-b"] .accordion-button::after { filter: invert(1) brightness(1.2); }
  .accordion[id^="accordion-b"] .accordion-item { border: 1px solid var(--bs-accordion-border-color); border-radius: .5rem; overflow: hidden; }
  .accordion[id^="accordion-b"] .accordion-button { border-radius: 0; }
  .accordion[id^="accordion-b"] .accordion-button:focus { box-shadow: var(--bs-accordion-btn-focus-box-shadow); }
  .accordion[id^="accordion-b"] .accordion-button > .d-flex { min-width: 0; }
  .accordion[id^="accordion-b"] .accordion-button .text-truncate { min-width: 0; max-width: 70%; }
  @media (min-width: 992px)  { .accordion[id^="accordion-b"] .accordion-button .text-truncate { max-width: 60%; } }
  @media (min-width: 1200px) { .accordion[id^="accordion-b"] .accordion-button .text-truncate { max-width: 100%; } }
  .accordion[id^="accordion-b"] .accordion-body { padding: .75rem .75rem 1rem; }

  /* Unassigned variant (same theming) */
  .accordion[id^="accordion-unassigned"] .accordion-header { background: var(--clr-berry-800); }
  .accordion[id^="accordion-unassigned"]{
    --bs-accordion-bg: var(--clr-white);
    --bs-accordion-border-color: var(--black-a08);
    --bs-accordion-btn-padding-x: .5rem;
    --bs-accordion-btn-padding-y: .4rem;
    --bs-accordion-btn-color: var(--clr-white);
    --bs-accordion-btn-bg: var(--clr-berry-800);
    --bs-accordion-active-color: var(--clr-white);
    --bs-accordion-active-bg: var(--clr-berry-900-deep);
    --bs-accordion-btn-focus-box-shadow: 0 0 0 .2rem var(--berry-a25);
  }
  .accordion[id^="accordion-unassigned"] .accordion-button::after { filter: invert(1) brightness(1.2); }
  .accordion[id^="accordion-unassigned"] .accordion-item { border: 1px solid var(--bs-accordion-border-color); border-radius: .5rem; overflow: hidden; }
  .accordion[id^="accordion-unassigned"] .accordion-button { border-radius: 0; }
  .accordion[id^="accordion-unassigned"] .accordion-button:focus { box-shadow: var(--bs-accordion-btn-focus-box-shadow); }
  .accordion[id^="accordion-unassigned"] .accordion-button > .d-flex { min-width: 0; }
  .accordion[id^="accordion-unassigned"] .accordion-button .text-truncate { min-width: 0; max-width: 70%; }
  @media (min-width: 992px)  { .accordion[id^="accordion-unassigned"] .accordion-button .text-truncate { max-width: 60%; } }
  @media (min-width: 1200px) { .accordion[id^="accordion-unassigned"] .accordion-button .text-truncate { max-width: 100%; } }
  .accordion[id^="accordion-unassigned"] .accordion-body { padding: .75rem .75rem 1rem; }

  /* Scene list grid */
  .scenes-computed {
    display: grid;
    grid-template-columns: repeat(var(--cols, 1), minmax(0, 1fr));
    gap: .25rem .75rem;
  }
  .scenes-computed .scene-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

  /* Grid density helpers */
  [data-grid-mode="1"] .block-col { flex: 0 0 100% !important; max-width: 100% !important; }
  @media (min-width: 768px)  { [data-grid-mode="2"] .block-col { flex: 0 0 50% !important; max-width: 50% !important; } }
  @media (min-width: 768px)  { [data-grid-mode="3"] .block-col { flex: 0 0 50% !important; max-width: 50% !important; } }
  @media (min-width: 992px)  { [data-grid-mode="3"] .block-col { flex: 0 0 33.333333% !important; max-width: 33.333333% !important; } }
  @media (min-width: 768px)  { [data-grid-mode="4"] .block-col { flex: 0 0 50% !important; max-width: 50% !important; } }
  @media (min-width: 1200px) { [data-grid-mode="4"] .block-col { flex: 0 0 25% !important; max-width: 25% !important; } }

  /* Block card header/border theming hooks */
  .block-col .card { --bs-card-border-color: var(--clr-berry-800); }
  .block-col .card .card-header {
    --bs-card-cap-bg: var(--tint-berry-50);
    --bs-card-cap-color: var(--clr-berry-800);
    border-bottom-color: var(--clr-berry-800);
  }
  .loc-block-col .card { --bs-card-border-color: var(--clr-berry-800); }
  .loc-block-col .card .card-header {
    --bs-card-cap-bg: var(--tint-berry-50);
    --bs-card-cap-color: var(--clr-berry-800);
    border-bottom-color: var(--clr-berry-800);
  }

  /* Compact switch labels in headers */
  .card .form-check.form-switch .form-check-label { font-size: var(--fs-sm-s); opacity: .9; }
  .card .form-check.form-switch .form-check-input { cursor: pointer; }

  /* ==========================================
     Compact inline edit rows (Fees / Prep-Strike)
     ========================================== */
  .card[data-section="fees"] .card-body .mb-2,
  .card[data-section="prepstrike"] .card-body .mb-2 {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
    line-height: 1.2;
  }
  .card[data-section="fees"] .card-body .mb-2 > strong,
  .card[data-section="prepstrike"] .card-body .mb-2 > strong {
    flex: 0 0 88px;
    text-align: left;
    font-weight: 600;
  }
  .view-mode.view-field {
    display: inline-block;
    margin-left: 4px;
    vertical-align: middle;
  }
  .card .edit-field.form-control {
    display: inline-block;
    width: 10ch;
    min-width: 7ch;
    max-width: 16ch;
    padding: 1px 4px;
    box-shadow: none;
  }
  .card[data-section="fees"] .card-body,
  .card[data-section="prepstrike"] .card-body {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .card .edit-mode:not(.d-none) ~ .card-body .edit-field.form-control:focus,
  .card .edit-field.form-control:focus {
    box-shadow: var(--focus-shadow);
  }
  @media (max-width: 480px) {
    .card[data-section="fees"] .card-body .mb-2,
    .card[data-section="prepstrike"] .card-body .mb-2 {
      flex-wrap: wrap;
      gap: 4px 6px;
    }
    .card[data-section="fees"] .card-body .mb-2 > strong,
    .card[data-section="prepstrike"] .card-body .mb-2 > strong {
      flex: 0 0 78px;
    }
  }

  /* ===============================
     Contact row icon buttons
     =============================== */
  .contact-fav,
  .contact-add,
  .contact-remove {
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    background-color: transparent;
    cursor: pointer;
    text-decoration: none;
    border-radius: 6px;
    transition: color 150ms ease, opacity 150ms ease, transform 120ms ease;
  }
  .contact-fav .bi,
  .contact-add .bi,
  .contact-remove .bi {
    font-size: var(--fs-xl-s) !important;
    line-height: 1;
  }

  /* Favourite star */
  .contact-fav[aria-pressed="false"],
  .contact-fav:not(.active)[aria-pressed="false"] {
    background-color: transparent;
    color: var(--gray-600);
    opacity: 0.9;
  }
  .contact-fav[aria-pressed="false"]:hover {
    color: var(--clr-attn);
    opacity: 1;
    transform: translateY(-1px);
  }
  .contact-fav.active,
  .contact-fav[aria-pressed="true"] {
    background-color: transparent;
    color: var(--clr-attn);
    opacity: 1;
  }
  .contact-fav.active:hover,
  .contact-fav[aria-pressed="true"]:hover {
    color: #ffcd39;
  }

  /* Add / Remove */
  .contact-add .bi { color: var(--clr-success); opacity: .95; }
  .contact-add .bi:hover { color: var(--clr-success-dark); opacity: 1; transform: translateY(-1px); }
  .contact-remove { color: var(--clr-danger); opacity: .95; }
  .contact-remove:hover { color: var(--clr-danger-dark); opacity: 1; transform: translateY(-1px); }

  /* Drag handle style */
  .drag-handle { color: var(--gray-600); opacity: .75; cursor: grab; }
  .dragging .drag-handle { cursor: grabbing; }
  .drag-handle:hover { opacity: 1; }

  /* Focus ring (accessible) */
  .contact-fav:focus-visible,
  .contact-add:focus-visible,
  .contact-remove:focus-visible,
  .drag-handle:focus-visible {
    outline: var(--focus-outline);
    box-shadow: var(--focus-shadow);
  }
  /* Disabled */
  .contact-fav:disabled,
  .contact-add:disabled,
  .contact-remove:disabled {
    opacity: .4;
    cursor: not-allowed;
    pointer-events: none;
  }

  /* Status cell icons */
  .status-cell .status { font-size: var(--fs-h3-s); line-height: 1; margin-left: 8px; }
  .status-warn { color: var(--orange-500); }
  .status-cell .text-danger { color: var(--clr-white) !important; opacity: .8; }
  .status-cell .text-danger:hover { color: var(--clr-danger-light) !important; }

  /* ================================
     Inline edit rows (generic)
     ================================ */
  .inline-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 4px;
  }
  .inline-label {
    font-size: var(--fs-sm-s);
    text-transform: uppercase;
    letter-spacing: .04em;
    opacity: .85;
    white-space: nowrap;
    margin-right: 2px;
  }
  .inline-input { display: inline-block; width: auto; max-width: 260px; }
  .inline-input.form-control,
  .inline-input.form-select {
    padding: 2px 6px;
    height: 28px;
    font-size: var(--fs-base-s);
    line-height: 1.2;
    border-radius: 4px;
  }
  .inline-input--xs   { max-width: 140px; }
  .inline-input--sm   { max-width: 200px; }
  .inline-input--md   { max-width: 260px; }
  .inline-input--lg   { max-width: 320px; }
  .inline-input--wide { max-width: 380px; }

  .card .edit-mode { margin-top: 2px; }
  .card .edit-mode .inline-row:last-child { margin-bottom: 0; }
  .view-mode p { margin-bottom: 4px; }

  /* =========================================
     Generic 2-col rows (view + edit)
     ========================================= */
  .card .card-body .mb-2:has(> strong) {
    display: grid;
    grid-template-columns: var(--label-w, 9rem) 1fr;
    align-items: center;
    column-gap: .5rem;
    margin-bottom: .35rem;
  }
  .card .card-body .mb-2 > strong {
    font-weight: 600;
    text-align: left;
    white-space: nowrap;
  }
  .card .card-body .mb-2 > .view-mode,
  .card .card-body .mb-2 > .view-field,
  .card .card-body .mb-2 > a.view-field,
  .card .card-body .mb-2 > .edit-mode .form-control,
  .card .card-body .mb-2 > .form-control {
    width: 100%;
    max-width: none;
  }
  .edit-mode .form-control.edit-field {
    width: 100%;
    max-width: none;
    padding-block: .3rem;
    font-size: .9rem;
  }
  .edit-mode .mb-2 { margin-bottom: .3rem; }
  .card[data-section="address"] { --label-w: 10rem; }
  .card[data-section="contact"] { --label-w: 6.5rem; }
  .card .card-body .mb-2 .view-mode a {
    word-break: break-word;
    text-decoration: underline;
    text-underline-offset: 2px;
  }


  /* =========================================
    Grid mode (no-flash) overrides for blocks
    (keeps your :root[data-grid-mode] behavior)
    ========================================= */
  /* 1 per row (all breakpoints) */
  :root[data-grid-mode="1"] .loc-block-col {
    flex: 0 0 100%;
    max-width: 100%;
  }

  /* Modes 2/3/4: mobile stays 1 per row */
  :root[data-grid-mode="2"] .loc-block-col,
  :root[data-grid-mode="3"] .loc-block-col,
  :root[data-grid-mode="4"] .loc-block-col {
    flex: 0 0 100%;
    max-width: 100%;
  }

  /* ≥ md: 2 per row for modes 2/3/4 */
  @media (min-width: 768px) {
    :root[data-grid-mode="2"] .loc-block-col,
    :root[data-grid-mode="3"] .loc-block-col,
    :root[data-grid-mode="4"] .loc-block-col {
      flex: 0 0 50%;
      max-width: 50%;
    }
  }

  /* ≥ lg: 3 per row for mode 3 */
  @media (min-width: 992px) {
    :root[data-grid-mode="3"] .loc-block-col {
      flex: 0 0 33.333333%;
      max-width: 33.333333%;
    }
  }

  /* ≥ xl: 4 per row for mode 4 */
  @media (min-width: 1200px) {
    :root[data-grid-mode="4"] .loc-block-col {
      flex: 0 0 25%;
      max-width: 25%;
    }
  }
  /* "auto" uses your Bootstrap classes (no override) */

  /* Team positions grid/cards */
  .tm-position-card { --bs-card-border-color: var(--white-a14); }
  .tm-position-card > .card-header {
    background: var(--clr-berry-700);
    color: var(--clr-white);
    border-bottom: 1px solid var(--white-a14);
    font-size: var(--fs-base-s);
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    padding: 8px 14px;
  }
  .tm-position-card > .card-header .badge {
    background: var(--white-a12) !important;
    color: var(--clr-white) !important;
    font-size: var(--fs-base-s);
  }

.page-locations .sb-page .card > .card-header {
  border-bottom-color: var(--white-a12, var(--white-a12));
}

/* 1) Kill item borders for these accordions */
.accordion[id^="accordion-b"] .accordion-item,
.accordion[id^="accordion-unassigned"] .accordion-item {
  border: 0 !important;
}

/* 2) Add auth-like faint inset border on the header only */
.accordion[id^="accordion-b"] .accordion-header,
.accordion[id^="accordion-unassigned"] .accordion-header {
  position: relative;
  border-radius: .5rem .5rem 0 0;
  overflow: hidden;
}

.accordion[id^="accordion-b"] .accordion-header::after,
.accordion[id^="accordion-unassigned"] .accordion-header::after {
  content: "";
  position: absolute;
  inset: 0;
  box-shadow: inset 0 0 0 1px var(--white-a12, var(--white-a12));
  pointer-events: none;
  border-radius: inherit;
}

}
