/* ============================================================================
   Athenian CSR Cart / Customer Portal — Token-Bridge Ready
   • Scoped to .accb-portal so it can live anywhere (Bricks, blocks, etc.)
   • Reads global AB tokens if present, falls back to dark theme if not.
   ============================================================================ */

/* ===================== SCOPE + LOCAL ALIASES ===================== */
:where(.accb-portal) {
  /* Brand / accent colors (cool teal/blue bias for CSR UI) */
  --brand-1: var(--ctl-c1, #4fd1c5);
  --brand-2: var(--ctl-c2, #63b3ed);
  --brand-3: var(--ctl-c3, #22c55e);

  /* Foreground */
  --fg:      var(--text-high,  #f5f5f5);
  --fg-mid:  var(--text-mid,   #a0a3ad);
  --fg-low:  var(--text-low,   #8b8f99);

  /* Surfaces */
  --bg-1:    var(--surface-1,  #0b0c10);
  --bg-2:    var(--surface-2,  #15161b);
  --bg-3:    var(--surface-3,  #1b1c22);

  /* Borders / focus / semantic */
  --bd:      var(--border,     #2c2e36);
  --ring:    var(--focus-ring, color-mix(in oklch, var(--brand-1) 55%, transparent));
  --danger:  var(--danger,     #f56565);

  /* Radii & shadows */
  --radius:    var(--radius,    1.5rem);
  --radius-sm: var(--radius-sm, 0.75rem);
  --drop-sm:   var(--drop-sm,   0 8px 20px rgba(0,0,0,.6));
  --drop-md:   var(--drop-md,   0 20px 45px rgba(0,0,0,.75));

  /* Convenience aliases */
  --accent:       var(--brand-1);
  --accent-soft:  color-mix(in oklch, var(--brand-1) 20%, transparent);
  --accent-soft-2: color-mix(in oklch, var(--brand-2) 18%, transparent);

  --input-bg:     color-mix(in oklch, var(--bg-2) 92%, black 8%);
  --panel-bg:     color-mix(in oklch, var(--bg-2) 96%, black 4%);
  --card-bg:      color-mix(in oklch, var(--bg-2) 92%, black 8%);
  --card-bg-soft: color-mix(in oklch, var(--bg-3) 92%, black 8%);
}

/* ===================== ROOT LAYOUT ===================== */
.accb-portal {
  color: var(--fg);
  background:
    radial-gradient(160% 140% at 0% 0%,
      color-mix(in oklch, var(--accent) 14%, transparent) 0%,
      transparent 45%
    ),
    radial-gradient(160% 140% at 100% 100%,
      color-mix(in oklch, var(--accent-soft-2) 16%, transparent) 0%,
      transparent 55%
    ),
    linear-gradient(135deg,
      color-mix(in oklch, var(--bg-2) 85%, transparent),
      color-mix(in oklch, var(--bg-1) 95%, transparent)
    );
  padding: 1.75rem;
  border-radius: var(--radius);
  border: 1px solid color-mix(in oklch, var(--bd) 80%, transparent);
  box-shadow: var(--drop-md);
  font-size: 0.9rem;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  color-scheme: dark;
}

.accb-portal__columns {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 1.5rem;
}

@media (max-width: 960px) {
  .accb-portal__columns {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ===================== PANELS ===================== */
.accb-panel {
  background: var(--panel-bg);
  border-radius: 1.25rem;
  border: 1px solid var(--bd);
  padding: 1rem 1.25rem 1.25rem;
  box-shadow: var(--drop-sm);
  position: relative;
  overflow: hidden;
}

.accb-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at top right, var(--accent-soft) 0, transparent 55%);
  opacity: 0.7;
}

.accb-panel__header {
  position: relative;
  z-index: 1;
  margin-bottom: 0.75rem;
}

.accb-panel__title {
  margin: 0;
  font-size: 1.1rem;
  letter-spacing: 0.03em;
  color: var(--fg);
}

.accb-panel__subtitle {
  margin: 0.15rem 0 0;
  color: var(--fg-mid);
  font-size: 0.85rem;
}

/* ===================== INPUTS & BUTTONS ===================== */
.accb-input {
  width: 100%;
  border-radius: 999px;
  border: 1px solid var(--bd);
  background: var(--input-bg);
  color: var(--fg);
  padding: 0.5rem 0.8rem;
  font-size: 0.9rem;
  outline: none;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background 0.15s ease;
}

.accb-input::placeholder {
  color: var(--fg-low);
}

.accb-input:focus {
  border-color: var(--accent);
  box-shadow:
    0 0 0 1px color-mix(in oklch, var(--accent) 50%, transparent),
    0 0 10px color-mix(in oklch, var(--accent) 40%, transparent);
  background: color-mix(in oklch, var(--bg-2) 85%, var(--bg-3) 15%);
}

/* Base button */
.accb-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid transparent;
  padding: 0.4rem 0.9rem;
  font-size: 0.9rem;
  line-height: 1.2;
  cursor: pointer;
  background: color-mix(in oklch, var(--bg-3) 90%, black 10%);
  color: var(--fg);
  transition:
    background 0.15s ease,
    transform 0.1s ease,
    box-shadow 0.15s ease,
    border-color 0.15s ease,
    filter 0.12s ease;
  text-decoration: none;
  white-space: nowrap;
}

/* Primary button */
.accb-button--primary {
  background: linear-gradient(135deg, var(--brand-1), var(--brand-2));
  color: #05060a;
  font-weight: 600;
  box-shadow: 0 2px 12px color-mix(in oklch, var(--brand-1) 40%, transparent);
}

.accb-button--primary:hover:not(.accb-button--disabled) {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow: 0 4px 16px color-mix(in oklch, var(--brand-1) 50%, transparent);
}

.accb-button--primary:active:not(.accb-button--disabled) {
  transform: translateY(0);
  box-shadow: 0 1px 8px color-mix(in oklch, var(--brand-1) 35%, transparent);
}

/* Secondary button */
.accb-button--secondary {
  background: transparent;
  border-color: var(--bd);
  color: var(--fg);
}

.accb-button--secondary:hover:not(.accb-button--disabled) {
  border-color: var(--accent);
  box-shadow:
    0 0 0 1px color-mix(in oklch, var(--accent) 40%, transparent),
    0 0 10px color-mix(in oklch, var(--accent) 35%, transparent);
}

/* Size + icon variants */
.accb-button--small {
  padding: 0.3rem 0.65rem;
  font-size: 0.8rem;
}

.accb-button--icon {
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  border-radius: 999px;
  background: transparent;
  border-color: var(--bd);
}

.accb-button--icon:hover:not(.accb-button--disabled) {
  border-color: var(--danger);
  color: var(--danger);
}

/* Disabled */
.accb-button--disabled {
  opacity: 0.45;
  cursor: not-allowed;
  box-shadow: none;
}

/* ===================== SEARCH SECTION ===================== */
.accb-search__control {
  position: relative;
  margin-bottom: 0.75rem;
}

.accb-search__results {
  position: relative;
  max-height: 24rem;
  overflow-y: auto;
  display: grid;
  gap: 0.6rem;
}

.accb-search__empty,
.accb-search__loading {
  margin-top: 0.25rem;
  font-size: 0.8rem;
  color: var(--fg-mid);
}

/* ===================== PRODUCT CARDS ===================== */
.accb-product-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.6rem;
  align-items: center;
  padding: 0.55rem 0.6rem;
  border-radius: 0.75rem;
  background: var(--card-bg);
  border: 1px solid color-mix(in oklch, var(--bd) 70%, transparent);
}

.accb-product-card__media {
  width: 44px;
  height: 44px;
  border-radius: 0.5rem;
  overflow: hidden;
  background: var(--bg-3);
  display: flex;
  align-items: center;
  justify-content: center;
}

.accb-product-card__thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.accb-product-card__body {
  min-width: 0;
}

.accb-product-card__name {
  font-size: 0.9rem;
  color: var(--fg);
  text-decoration: none;
}

.accb-product-card__name:hover {
  text-decoration: underline;
}

.accb-product-card__sku {
  font-size: 0.75rem;
  color: var(--fg-mid);
  margin-top: 0.15rem;
}

.accb-product-card__price {
  font-size: 0.8rem;
  margin-top: 0.25rem;
}

.accb-product-card__stock {
  font-size: 0.75rem;
  margin-top: 0.25rem;
}

.accb-product-card__stock--out {
  color: var(--danger);
}

.accb-product-card__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

/* ===================== PREVIOUS PURCHASES ===================== */
.accb-previous__loading,
.accb-previous__empty {
  font-size: 0.8rem;
  color: var(--fg-mid);
}

.accb-previous__list {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  max-height: 18rem;
  overflow-y: auto;
  display: grid;
  gap: 0.5rem;
}

.accb-previous__item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.6rem;
  align-items: center;
  padding: 0.5rem 0.6rem;
  border-radius: 0.75rem;
  background: var(--card-bg-soft);
  border: 1px solid color-mix(in oklch, var(--bd) 65%, transparent);
}

.accb-previous__media {
  width: 40px;
  height: 40px;
  border-radius: 0.5rem;
  overflow: hidden;
  background: var(--bg-3);
  display: flex;
  align-items: center;
  justify-content: center;
}

.accb-previous__thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.accb-previous__body {
  min-width: 0;
}

.accb-previous__name {
  font-size: 0.9rem;
  color: var(--fg);
  text-decoration: none;
}

.accb-previous__name:hover {
  text-decoration: underline;
}

.accb-previous__sku {
  font-size: 0.75rem;
  color: var(--fg-mid);
  margin-top: 0.15rem;
}

.accb-previous__price {
  font-size: 0.8rem;
  margin-top: 0.25rem;
}

.accb-previous__meta {
  font-size: 0.75rem;
  color: var(--fg-mid);
  margin-top: 0.25rem;
}

.accb-previous__actions {
  display: flex;
  align-items: center;
}

/* ===================== CART TABLE ===================== */
.accb-cart {
  position: relative;
}

.accb-cart__items {
  margin-bottom: 0.75rem;
}

.accb-cart__empty {
  font-size: 0.85rem;
  color: var(--fg-mid);
}

.accb-cart-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}

.accb-cart-table th,
.accb-cart-table td {
  padding: 0.35rem 0.25rem;
}

.accb-cart-table thead th {
  font-weight: 500;
  color: var(--fg-mid);
  border-bottom: 1px solid var(--bd);
}

/* Cart rows */
.accb-cart-row__main {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.accb-cart-row__thumb {
  width: 40px;
  height: 40px;
  border-radius: 0.5rem;
  overflow: hidden;
  background: var(--bg-3);
  flex-shrink: 0;
}

.accb-cart-row__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.accb-cart-row__info {
  min-width: 0;
}

.accb-cart-row__name {
  font-size: 0.85rem;
  color: var(--fg);
}

.accb-cart-row__sku {
  font-size: 0.75rem;
  color: var(--fg-mid);
}

.accb-cart-row__qty input {
  max-width: 4rem;
}

.accb-cart-row__total-value {
  font-weight: 500;
}

/* Cart summary */
.accb-cart__summary {
  margin-top: 0.5rem;
}

.accb-cart-summary__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 0.25rem;
  font-size: 0.85rem;
}

.accb-cart-summary__row--total {
  margin-top: 0.4rem;
  padding-top: 0.4rem;
  border-top: 1px dashed var(--bd);
  font-weight: 600;
}

.accb-cart-summary__label {
  color: var(--fg-mid);
}

.accb-cart-summary__row--total .accb-cart-summary__label {
  color: var(--fg);
}

/* ===================== CART ACTIONS / NOTICES ===================== */
.accb-cart__actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.75rem;
}

@media (max-width: 640px) {
  .accb-cart__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .accb-cart__actions .accb-button {
    width: 100%;
    justify-content: center;
  }
}

.accb-cart__notice {
  margin-top: 0.5rem;
  font-size: 0.8rem;
  min-height: 1em;
}

.accb-cart__notice--error {
  color: var(--danger);
}

.accb-cart__notice--success {
  color: var(--accent);
}

/* ===================== LOGIN-REQUIRED VARIANT ===================== */
.accb-portal--requires-login {
  text-align: left;
}
/* =====================================================================
   Athenian Custom Cart Builder — Token-Bridge Ready
   Scoped to .accb-portal so it plays nice in Bricks.
   ===================================================================== */

:where(.accb-portal) {
  /* Local aliases to theme tokens (adjust to match your theme vars) */
  --brand-1: var(--ctl-c1);
  --brand-2: var(--ctl-c2);
  --brand-3: var(--ctl-c3);

  --fg:      var(--text-high, #f5f5f5);
  --fg-mid:  var(--text-mid, #c0c0c0);
  --fg-low:  var(--text-low, #8a8a8a);

  --bg-1:    var(--surface-1, #111218);
  --bg-2:    var(--surface-2, #181923);
  --bg-3:    var(--surface-3, #1f202b);

  --bd-subtle:   var(--border-subtle, #ffffff10);
  --bd-strong:   var(--border-strong, #ffffff26);
  --ring:        var(--focus-ring, rgba(0, 200, 255, .35));

  --radius-sm:   var(--radius-sm, 0.4rem);
  --radius-md:   var(--radius-md, 0.7rem);
  --radius-lg:   var(--radius-lg, 1rem);

  --shadow-soft: 0 14px 45px rgba(0, 0, 0, 0.45);
  --shadow-soft-sm: 0 8px 25px rgba(0, 0, 0, 0.35);

  --gap-sm: 0.5rem;
  --gap-md: 0.75rem;
  --gap-lg: 1rem;

  --font-xs: 0.75rem;
  --font-sm: 0.8rem;
  --font-md: 0.9rem;
  --font-lg: 1.05rem;

  --chip-radius: 999px;
}

/* Root portal layout tweaks */
.accb-portal {
  color: var(--fg);
}

.accb-portal__columns {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 1.25rem;
}

/* Panel shells */
.accb-panel {
  background: radial-gradient(circle at top left, #ffffff09, transparent 55%),
              radial-gradient(circle at bottom right, #000000aa, #000000f0);
  border-radius: var(--radius-lg);
  border: 1px solid var(--bd-subtle);
  box-shadow: var(--shadow-soft-sm);
  padding: 1rem;
}

.accb-panel__header {
  margin-bottom: 0.75rem;
}

.accb-panel__title {
  margin: 0 0 0.25rem;
  font-size: var(--font-lg);
  letter-spacing: 0.02em;
}

.accb-panel__subtitle {
  margin: 0;
  font-size: var(--font-sm);
  color: var(--fg-low);
}

/* =====================================================================
   Cart: compact, modern rows
   ===================================================================== */

.accb-cart {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

/* Cart rows container */
.accb-cart__items {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-height: 420px;
  overflow-y: auto;
  padding-right: 0.25rem;
}

/* Individual row */
.accb-cart-row {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) auto auto auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.6rem 0.75rem;
  border-radius: var(--radius-md);
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.03),
    rgba(0, 0, 0, 0.35)
  );
  border: 1px solid var(--bd-subtle);
  transition:
    background 140ms ease-out,
    border-color 140ms ease-out,
    transform 140ms ease-out,
    box-shadow 140ms ease-out;
}

.accb-cart-row:hover {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.06),
    rgba(0, 0, 0, 0.4)
  );
  border-color: var(--bd-strong);
  box-shadow: var(--shadow-soft-sm);
  transform: translateY(-1px);
}

/* Left block: thumb + text */
.accb-cart-row__left {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-width: 0;
}

.accb-cart-row__thumb {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-sm);
  object-fit: cover;
  flex-shrink: 0;
  box-shadow: 0 0 0 1px #000000aa;
}

.accb-cart-row__meta {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}

.accb-cart-row__name {
  font-size: var(--font-md);
  font-weight: 500;
  line-height: 1.25;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.accb-cart-row__sku {
  font-size: var(--font-xs);
  color: var(--fg-low);
}

/* Qty column */
.accb-cart-row__qty {
  display: flex;
  align-items: center;
  justify-content: center;
}

.accb-cart-row__qty-input {
  width: 3.3rem;
  padding: 0.2rem 0.3rem;
  font-size: var(--font-sm);
  text-align: center;
  border-radius: var(--radius-sm);
  border: 1px solid var(--bd-subtle);
  background: var(--bg-2);
  color: var(--fg);
}

.accb-cart-row__qty-input:focus {
  outline: none;
  border-color: var(--brand-2);
  box-shadow: 0 0 0 1px var(--ring);
}

/* Price column */
.accb-cart-row__prices {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.15rem;
  font-size: var(--font-sm);
}

.accb-cart-row__subtotal {
  color: var(--fg-low);
}

.accb-cart-row__total {
  font-weight: 600;
}

/* Actions column */
.accb-cart-row__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

/* Cart notice */
.accb-cart__notice {
  margin-top: 0.25rem;
  font-size: var(--font-sm);
  min-height: 1.2em;
  display: none;
}

.accb-cart-notice--info {
  color: var(--fg-mid);
}

.accb-cart-notice--success {
  color: var(--brand-2);
}

.accb-cart-notice--error {
  color: #ff6b81;
}

/* Summary block */
.accb-cart__summary {
  border-radius: var(--radius-md);
  border: 1px solid var(--bd-subtle);
  padding: 0.75rem 0.9rem;
  background: linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.03),
    rgba(0, 0, 0, 0.45)
  );
}

.accb-summary {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.accb-summary__row {
  display: flex;
  justify-content: space-between;
  font-size: var(--font-sm);
  color: var(--fg-mid);
}

.accb-summary__row--discount {
  color: #ff9ca6;
}

.accb-summary__row--total {
  margin-top: 0.25rem;
  padding-top: 0.25rem;
  border-top: 1px dashed var(--bd-subtle);
  font-weight: 600;
  font-size: var(--font-md);
  color: var(--fg);
}

/* Buttons already exist; just tighten a bit if desired */
.accb-cart__actions {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  align-items: center;
}

/* =====================================================================
   Search results: compact cards
   ===================================================================== */

.accb-search {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.accb-search__control {
  position: relative;
}

.accb-search__input {
  width: 100%;
  border-radius: var(--radius-md);
  border: 1px solid var(--bd-subtle);
  background: var(--bg-2);
  color: var(--fg);
  padding: 0.45rem 0.7rem;
  font-size: var(--font-sm);
}

.accb-search__input::placeholder {
  color: var(--fg-low);
}

.accb-search__input:focus {
  outline: none;
  border-color: var(--brand-2);
  box-shadow: 0 0 0 1px var(--ring);
}

/* Results list */
.accb-search__results {
  max-height: 420px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

/* Search card */
.accb-product-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1.9fr) auto;
  gap: 0.6rem;
  align-items: center;
  padding: 0.5rem 0.6rem;
  border-radius: var(--radius-md);
  border: 1px solid var(--bd-subtle);
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.02),
    rgba(0, 0, 0, 0.4)
  );
  transition:
    background 140ms ease-out,
    border-color 140ms ease-out,
    transform 140ms ease-out,
    box-shadow 140ms ease-out;
  cursor: pointer;
}

.accb-product-card:hover {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.05),
    rgba(0, 0, 0, 0.5)
  );
  border-color: var(--brand-2);
  box-shadow: var(--shadow-soft-sm);
  transform: translateY(-1px);
}

.accb-product-card__thumb img {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-sm);
  object-fit: cover;
}

/* Middle column */
.accb-product-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
  min-width: 0;
}

.accb-product-card__breadcrumbs {
  font-size: var(--font-xs);
  color: var(--fg-low);
  text-transform: uppercase;
  letter-spacing: 0.07em;
}

.accb-product-card__label {
  font-size: var(--font-md);
  font-weight: 500;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.accb-product-card__sku {
  font-size: var(--font-xs);
  color: var(--fg-low);
}

.accb-product-card__meta {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.1rem;
  font-size: var(--font-xs);
}

.accb-product-card__price {
  font-weight: 600;
}

.accb-product-card__stock {
  padding: 0.1rem 0.5rem;
  border-radius: var(--chip-radius);
  border: 1px solid var(--bd-subtle);
  background: rgba(0, 0, 0, 0.35);
  color: var(--fg-mid);
}

/* Right column (qty + add) */
.accb-product-card__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.3rem;
}

.accb-product-card__qty {
  width: 3rem;
  padding: 0.2rem 0.3rem;
  border-radius: var(--radius-sm);
  border: 1px solid var(--bd-subtle);
  background: var(--bg-2);
  color: var(--fg);
  font-size: var(--font-xs);
  text-align: center;
}

.accb-product-card__qty:focus {
  outline: none;
  border-color: var(--brand-2);
  box-shadow: 0 0 0 1px var(--ring);
}

/* Empty / loading */
.accb-search__empty,
.accb-search__loading {
  font-size: var(--font-xs);
  color: var(--fg-low);
}

/* Previous purchases list */
.accb-previous__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.accb-previous__item {
  padding: 0.35rem 0.45rem;
  border-radius: var(--radius-sm);
  border: 1px solid var(--bd-subtle);
  background: rgba(0, 0, 0, 0.4);
  font-size: var(--font-sm);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.accb-previous__name {
  font-weight: 500;
}

.accb-previous__meta {
  font-size: var(--font-xs);
  color: var(--fg-low);
}