/* /Components/Account/Pages/Manage/ProfileImageUpload.razor.rz.scp.css */
.profile-image-upload[b-6g4slq289y] {
  margin: 10px 0 28px;
}

.profile-image-upload__box[b-6g4slq289y] {
  border: 1px solid var(--border-300);
  border-radius: var(--radius-1);
  background: var(--bg-surface);
  padding: 10px 18px 5px 18px;
}

.profile-image-upload__top-row[b-6g4slq289y] {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 18px;
  flex-wrap: wrap;
  margin-bottom: 5px;
}

.profile-image-upload__title-group[b-6g4slq289y] {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

.profile-image-upload__label[b-6g4slq289y] {
  display: block;
  margin: 0;
  color: var(--text-900);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
}

.profile-image-upload__helper[b-6g4slq289y] {
  margin-top: 0;
  color: var(--text-500);
  font-size: 13px;
  line-height: 1.35;
}

.profile-image-upload__picker-inline[b-6g4slq289y] {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.profile-image-upload__content-row[b-6g4slq289y] {
  display: flex;
  align-items: center;
  gap: 14px;
}

.profile-image-upload__input[b-6g4slq289y] {
  flex: 0 0 auto;
}

.profile-image-upload__actions[b-6g4slq289y] {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.profile-image-upload__remove-btn[b-6g4slq289y] {
  appearance: none;
  border: 1px solid var(--border-300);
  background: #fff;
  color: var(--text-700);
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}

  .profile-image-upload__remove-btn:hover[b-6g4slq289y] {
    background: rgba(220, 53, 69, 0.06);
    border-color: rgba(220, 53, 69, 0.24);
    color: #b42318;
  }

.profile-image-upload__preview-wrap[b-6g4slq289y] {
  flex: 0 0 auto;
  margin-bottom: 0;
}

.profile-image-upload__preview[b-6g4slq289y],
.profile-image-upload__placeholder[b-6g4slq289y] {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  border: 1px solid var(--border-300);
  box-shadow: var(--shadow-1);
  background: var(--bg-surface);
}

.profile-image-upload__preview[b-6g4slq289y] {
  display: block;
  object-fit: cover;
}

.profile-image-upload__placeholder[b-6g4slq289y] {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-400);
  background: radial-gradient(circle at top, rgba(37, 99, 235, 0.08), transparent 55%), var(--bg-surface);
}

.profile-image-upload__placeholder-icon[b-6g4slq289y] {
  font-size: 27px;
  line-height: 1;
  opacity: 0.9;
}

.profile-image-upload__meta[b-6g4slq289y] {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.profile-image-upload__file-name[b-6g4slq289y] {
  color: var(--text-700);
  font-size: 14px;
  line-height: 1.35;
  word-break: break-word;
}

.profile-image-upload__message[b-6g4slq289y] {
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.35;
}

  .profile-image-upload__message.is-info[b-6g4slq289y] {
    color: var(--text-500);
  }

  .profile-image-upload__message.is-error[b-6g4slq289y] {
    color: #dc3545;
  }

@media (max-width: 576px) {
  .profile-image-upload__top-row[b-6g4slq289y],
  .profile-image-upload__content-row[b-6g4slq289y] {
    align-items: flex-start;
    flex-direction: column;
  }

  .profile-image-upload__preview[b-6g4slq289y],
  .profile-image-upload__placeholder[b-6g4slq289y] {
    width: 80px;
    height: 80px;
  }

  .profile-image-upload__placeholder-icon[b-6g4slq289y] {
    font-size: 25px;
  }

  .profile-image-upload__actions[b-6g4slq289y] {
    width: 100%;
  }
}
/* /Components/Account/Shared/ManageLayout.razor.rz.scp.css */
.manage-page[b-mjg4inhgz6] {
  padding-top: 10px;
}

.manage-header[b-mjg4inhgz6] {
  margin-bottom: 20px;
}

.manage-title[b-mjg4inhgz6] {
  margin: 0;
  color: var(--text-900);
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.manage-divider[b-mjg4inhgz6] {
  margin-top: 16px;
  height: 1px;
  background: var(--border-200);
}

.manage-grid[b-mjg4inhgz6] {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}

.manage-sidebar[b-mjg4inhgz6],
.manage-content[b-mjg4inhgz6] {
  min-width: 0;
}

.profile-save-row[b-mjg4inhgz6] {
  margin-top: 8px;
}

@media (max-width: 992px) {
  .manage-grid[b-mjg4inhgz6] {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
/* /Components/Account/Shared/ManageNavMenu.razor.rz.scp.css */
.manage-nav[b-js8xog55ug] {
  position: sticky;
  top: 6px;
}

.manage-nav-list[b-js8xog55ug] {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.manage-nav-item[b-js8xog55ug]  .nav-link {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0 18px;
  border-radius: var(--radius-1);
  color: var(--text-600);
  text-decoration: none;
  font-weight: 500;
  transition: background 140ms ease, color 140ms ease, box-shadow 140ms ease;
}

  .manage-nav-item[b-js8xog55ug]  .nav-link:hover {
    background: rgba(37, 99, 235, 0.08);
    color: var(--text-900);
  }

.manage-nav-item[b-js8xog55ug]  a.active {
  color: var(--text-900);
  background: rgba(37, 99, 235, 0.12);
  box-shadow: inset 3px 0 0 var(--brand-600);
}
/* /Components/Layout/AuthLayout.razor.rz.scp.css */
.auth-shell[b-gmsko12lou] {
  min-height: 100vh;
  background: linear-gradient(180deg, #f5f7fb 0%, #eef1f6 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 48px 20px 32px;
  box-sizing: border-box;
}

/* logo area */
.auth-header[b-gmsko12lou] {
  margin-bottom: 26px;
}

.auth-logo[b-gmsko12lou] {
  height: 58px;
  max-width: 100%;
  display: block;
}

/* auth card */
.auth-content[b-gmsko12lou] {
  width: 100%;
  max-width: 640px;
  background: #ffffff;
  border-radius: 16px;
  padding: 40px 42px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.08), 0 3px 10px rgba(0, 0, 0, 0.04);
  box-sizing: border-box;
}

  /* make routed auth pages use full card width */
  .auth-content[b-gmsko12lou]  .row {
    margin-left: 0;
    margin-right: 0;
  }

  .auth-content[b-gmsko12lou]  .col,
  .auth-content[b-gmsko12lou]  .col-12,
  .auth-content[b-gmsko12lou]  .col-md-6,
  .auth-content[b-gmsko12lou]  .col-lg-4,
  .auth-content[b-gmsko12lou]  .col-lg-6,
  .auth-content[b-gmsko12lou]  [class*="col-"] {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
    padding-left: 0;
    padding-right: 0;
  }

  .auth-content[b-gmsko12lou]  section {
    width: 100%;
    max-width: 100%;
  }

  .auth-content[b-gmsko12lou]  form {
    width: 100%;
  }

  /* headings */
  .auth-content[b-gmsko12lou]  h1 {
    margin: 0 0 22px;
    font-size: 3rem;
    line-height: 1.05;
  }

  /* fields */
  .auth-content[b-gmsko12lou]  .form-floating {
    margin-bottom: 18px;
  }

  .auth-content[b-gmsko12lou]  input.form-control {
    height: 52px;
  }

  .auth-content[b-gmsko12lou]  .form-control,
  .auth-content[b-gmsko12lou]  .form-select {
    width: 100%;
    box-sizing: border-box;
  }

  /* button */
  .auth-content[b-gmsko12lou]  .btn-primary {
    /*height: 50px;*/
    font-weight: 500;
  }

  /* links */
  .auth-content[b-gmsko12lou]  p a {
    font-size: 0.95rem;
  }

.auth-secondary-link[b-gmsko12lou] {
  margin-top: 18px;
  font-size: 0.9rem;
}

  .auth-secondary-link a[b-gmsko12lou] {
    color: #4a6fa5;
    text-decoration: none;
  }

    .auth-secondary-link a:hover[b-gmsko12lou] {
      text-decoration: underline;
    }

/*.auth-footer {
  margin-top: 22px;
  text-align: center;
  font-size: 13px;
  color: #6c757d;
}

  .auth-footer a {
    color: #6c757d;
    text-decoration: none;
  }

    .auth-footer a:hover {
      text-decoration: underline;
    }

.footer-separator {
  margin: 0 8px;
  color: #adb5bd;
}*/

/* responsive */
/*@media (max-width: 768px) {
  .auth-shell {
    padding: 28px 14px 24px;
  }

  .auth-header {
    margin-bottom: 18px;
  }

  .auth-logo {
    height: 50px;
  }

  .auth-content {
    max-width: 100%;
    padding: 28px 24px;
    border-radius: 14px;
  }

    .auth-content ::deep h1 {
      font-size: 2.35rem;
    }
}*/


.auth-footer[b-gmsko12lou] {
  width: 100%;
  max-width: 640px;
  margin-top: 22px;
  padding: 8px 4px 0;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  font-size: 11px;
  color: #6b7280;
  box-sizing: border-box;
}

.auth-footer-left[b-gmsko12lou] {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.auth-footer-center[b-gmsko12lou] {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  white-space: nowrap;
}

.auth-footer-powered-by[b-gmsko12lou] {
  color: #94a3b8;
  font-weight: 500;
  white-space: nowrap;
}

.auth-footer-company-name[b-gmsko12lou] {
  color: #5b6778;
  font-weight: 650;
}

.auth-footer a[b-gmsko12lou] {
  color: #6b7280;
  text-decoration: none;
  white-space: nowrap;
}

  .auth-footer a:hover[b-gmsko12lou] {
    text-decoration: underline;
  }

.footer-separator[b-gmsko12lou] {
  margin: 0 8px;
  color: #cbd5e1;
}

@media (max-width: 768px) {
  .auth-footer[b-gmsko12lou] {
    max-width: 100%;
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    gap: 6px;
  }

  .auth-footer-left[b-gmsko12lou],
  .auth-footer-center[b-gmsko12lou] {
    justify-content: center;
  }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* =========================================================
   MainLayout.razor.css
   Shell / chrome only
   ---------------------------------------------------------
   Scope:
   - App shell
   - Top bar
   - Sidebar / content columns
   - Sidebar toggle behavior
   - Blazor error UI

   Notes:
   - Layout-only styles stay here.
   - UserArea-specific selectors from an earlier iteration were
     commented out because MainLayout CSS isolation does not style
     child component internals unless `::deep` is used.
   ========================================================= */

html[b-uk27ge7syk],
body[b-uk27ge7syk] {
  height: 100%;
  overflow: hidden; /* prevent body/page scroll; content scrolls inside .content */
}

/* =========================================================
   App shell
   ========================================================= */
.app-shell[b-uk27ge7syk] {
  --sidebar-width: 205px;
  --sidebar-collapsed-width: 71.2px;
  height: 100vh;
  display: grid;
  grid-template-rows: auto 1fr;
  background: var(--bg-app);
}

/* =========================================================
   Top bar
   ========================================================= */
.topbar[b-uk27ge7syk] {
  position: sticky;
  top: 0;
  z-index: 50;
  display: grid;
  grid-template-columns: var(--sidebar-width) 1fr;
  align-items: stretch;
  /*min-height: 58px;*/
  padding-top:2px;
  background: var(--bg-surface);
  border-bottom: 1px solid transparent;
}

.topbar-left[b-uk27ge7syk] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 2px 12px;
  background: var(--bg-surface);
  border-right: 1px solid transparent;
}

  .topbar-left .brand-logo[b-uk27ge7syk] {
    display: block;
    width: auto;
    object-fit: contain;
  }

  .topbar-left .brand-logo--full[b-uk27ge7syk] {
    max-width: 188px;
    height: 40px;
  }

  .topbar-left .brand-logo--compact[b-uk27ge7syk] {
    display: none;
    max-width: 64px;
    height: 40px;
  }

.topbar-right[b-uk27ge7syk] {
  height: 100%;
  display: flex;
  align-items: stretch;
}

.topbar-right-inner[b-uk27ge7syk] {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 4px 0;
}

.topbar-title-wrap[b-uk27ge7syk] {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  min-width: 0;
  flex: 1 1 auto;
}

.topbar-page-heading[b-uk27ge7syk] {
  min-width: 0;
  display: flex;
  align-items: center;
}

.page-title-shell[b-uk27ge7syk] {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
}

.page-title-main[b-uk27ge7syk] {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  min-width: 0;
  font-size: 18px;
  line-height: 1.15;
  font-weight: 700;
  color: var(--text-900);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page-title-subtitle[b-uk27ge7syk] {
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
  color: var(--text-600);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sidebar-toggle[b-uk27ge7syk] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  padding: 0;
  border: 1px solid rgba(25, 35, 68, 0.10);
  border-radius: 8px;
  background: #fff;
  color: var(--text-900);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
}

  .sidebar-toggle:hover[b-uk27ge7syk] {
    background: rgba(25, 35, 68, 0.03);
  }

.sidebar-toggle-input[b-uk27ge7syk] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 0;
  height: 0;
  appearance: none;
}

.top-actions[b-uk27ge7syk] {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-left: var(--space-2);
}

/*Action links in the top bar (e.g. "Back to Promotions") */
.topbar-page-action[b-uk27ge7syk] {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  margin-left: auto;
  padding-left: 1rem;
}

.topbar-page-action-link[b-uk27ge7syk] {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.35rem 0.55rem;
  border-radius: 999px;
  border: 0;
  background: transparent;
  font-size: 13px;
  line-height: 1.2;
  font-weight: 700;
  color: var(--text-700);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: color 120ms ease, background-color 120ms ease, opacity 120ms ease;
}

  .topbar-page-action-link:hover[b-uk27ge7syk] {
    color: var(--text-900);
    background: rgba(25, 35, 68, 0.06);
    text-decoration: none;
  }

  .topbar-page-action-link:focus-visible[b-uk27ge7syk] {
    outline: none;
    color: var(--text-900);
    background: rgba(25, 35, 68, 0.08);
  }

.topbar-page-action-icon[b-uk27ge7syk] {
  font-size: 14px;
  line-height: 1;
  transform: translateY(-0.5px);
}

.topbar-page-action-link.is-disabled[b-uk27ge7syk] {
  color: var(--text-400);
  opacity: 0.7;
  cursor: default;
  pointer-events: none;
  background: transparent;
}

/* =========================================================
   Shell body
   ========================================================= */
.shell-body[b-uk27ge7syk] {
  position: relative;
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(720px, 1fr);
  min-height: 0;
  height: 100%;
}

.sidebar[b-uk27ge7syk] {
  min-height: 0;
  background: var(--bg-surface);
  border-right: 1px solid transparent;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
}

.content[b-uk27ge7syk] {
  position: relative;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  margin: 0 6px 6px 0;
  padding: 4px 4px 0px 4px;
  background: #F8FAFC;
  border-radius: 0 var(--radius-2) var(--radius-2) 0;
  box-shadow: var(--shadow-1);
  display: flex;
  flex-direction: column;
}

.page-host[b-uk27ge7syk] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.content-scroll[b-uk27ge7syk] {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 4px 4px 4px 10px;
}

/* =========================================================
   Sidebar collapse
   ---------------------------------------------------------d
   Manual collapse is driven by the hidden #sidebar-toggle.
   Auto-collapse is handled with media queries below.
   ========================================================= */

#sidebar-toggle:checked ~ .app-shell[b-uk27ge7syk] {
  --sidebar-width: var(--sidebar-collapsed-width);
}

  #sidebar-toggle:checked ~ .app-shell .topbar[b-uk27ge7syk] {
    min-height: 40px;
  }

  #sidebar-toggle:checked ~ .app-shell .page-title-main[b-uk27ge7syk] {
    font-size: 16px;
    line-height: 1.15;
  }

  #sidebar-toggle:checked ~ .app-shell .page-title-subtitle[b-uk27ge7syk] {
    font-size: 11px;
  }

  #sidebar-toggle:checked ~ .app-shell .topbar-left[b-uk27ge7syk] {
    padding: 2px 8px;
  }

    #sidebar-toggle:checked ~ .app-shell .topbar-left .brand[b-uk27ge7syk] {
      justify-content: center;
    }

    #sidebar-toggle:checked ~ .app-shell .topbar-left .brand-logo--full[b-uk27ge7syk] {
      display: none;
    }

    #sidebar-toggle:checked ~ .app-shell .topbar-left .brand-logo--compact[b-uk27ge7syk] {
      display: block;
    }

  #sidebar-toggle:checked ~ .app-shell .topbar-right-inner[b-uk27ge7syk] {
    gap: 10px;
  }

  #sidebar-toggle:checked ~ .app-shell .topbar-title-wrap[b-uk27ge7syk] {
    gap: 0.4rem;
  }

  #sidebar-toggle:checked ~ .app-shell .page-title[b-uk27ge7syk] {
    font-size: 16px;
    line-height: 1.2;
  }

  #sidebar-toggle:checked ~ .app-shell .sidebar[b-uk27ge7syk]  .nav-scrollable,
  #sidebar-toggle:checked ~ .app-shell .sidebar[b-uk27ge7syk]  .nav-bottom {
    padding-left: 8px;
    padding-right: 8px;
  }

  #sidebar-toggle:checked ~ .app-shell .sidebar[b-uk27ge7syk]  .nav-link {
    justify-content: center;
    gap: 0;
    padding-left: 0;
    padding-right: 0;
  }

  #sidebar-toggle:checked ~ .app-shell .sidebar[b-uk27ge7syk]  .nav-label {
    display: none;
  }

  #sidebar-toggle:checked ~ .app-shell .sidebar[b-uk27ge7syk]  .nav-icon {
    margin: 0;
  }

  #sidebar-toggle:checked ~ .app-shell .sidebar[b-uk27ge7syk]  a.active {
    box-shadow: none;
    background: rgba(37, 99, 235, 0.16);
  }

  #sidebar-toggle:checked ~ .app-shell .edge-toggle-open[b-uk27ge7syk] {
    display: none;
  }

  #sidebar-toggle:checked ~ .app-shell .edge-toggle-closed[b-uk27ge7syk] {
    display: inline;
  }

.sidebar-edge-toggle[b-uk27ge7syk] {
  position: absolute;
  left: var(--sidebar-width);
  top: 45%;
  transform: translate(-50%, -50%);
  z-index: 40;
  width: 16px;
  height: 74px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(37, 99, 235, 0.07);
  border-radius: 999px;
  background: #f5f8fc;
  color: var(--text-700);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.07);
  cursor: pointer;
  user-select: none;
  transition: left 70ms ease, background 160ms ease, color 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

  .sidebar-edge-toggle:hover[b-uk27ge7syk] {
    background: #edf4fb;
    color: var(--text-900);
    border-color: rgba(37, 99, 235, 0.12);
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.10);
  }

.edge-toggle-icon[b-uk27ge7syk] {
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  opacity: .82;
}

.edge-toggle-closed[b-uk27ge7syk] {
  display: none;
}

/*keeps the link on the topbar slightly more compact when the left nav is collapsed*/
#sidebar-toggle:checked ~ .app-shell .topbar-page-action-link[b-uk27ge7syk] {
  font-size: 12px;
}

/* =========================================================
   Responsive shell
   ========================================================= */
@media (max-width: 1024px) {
  .app-shell[b-uk27ge7syk] {
    --sidebar-width: var(--sidebar-collapsed-width);
  }

  .topbar-left[b-uk27ge7syk] {
    padding: 3px 8px;
  }

    .topbar-left .brand[b-uk27ge7syk] {
      justify-content: center;
    }

    .topbar-left .brand-logo--full[b-uk27ge7syk] {
      display: none;
    }

    .topbar-left .brand-logo--compact[b-uk27ge7syk] {
      display: block;
    }


  .topbar-right-inner[b-uk27ge7syk] {
    gap: 10px;
  }

  .topbar-title-wrap[b-uk27ge7syk] {
    gap: 0.4rem;
  }

  .page-title[b-uk27ge7syk] {
    font-size: 15px;
    line-height: 1.2;
  }

  .page-title-main[b-uk27ge7syk] {
    font-size: 15px;
    line-height: 1.15;
  }

  .page-title-subtitle[b-uk27ge7syk] {
    font-size: 11px;
    line-height: 1.3;
  }

  .content[b-uk27ge7syk] {
    margin: 0 4px 4px 0;
    padding: 4px 8px 8px;
  }

  .content-scroll[b-uk27ge7syk] {
    padding: 4px 8px 4px;
  }

  .app-footer[b-uk27ge7syk] {
    min-height: 34px;
    padding: 4px 12px;
    font-size: 10px;
    grid-template-columns: 1fr auto;
    gap: 8px;
  }

  .app-footer-logo[b-uk27ge7syk] {
    height: 17px;
  }

  .app-footer-left[b-uk27ge7syk] {
    justify-content: flex-start;
  }

  .app-footer-center[b-uk27ge7syk] {
    justify-content: flex-end;
  }

  .app-footer-right[b-uk27ge7syk] {
    display: none;
  }

  .sidebar-edge-toggle[b-uk27ge7syk] {
    display: none;
  }

  .sidebar[b-uk27ge7syk]  .nav-scrollable,
  .sidebar[b-uk27ge7syk]  .nav-bottom {
    padding-left: 8px;
    padding-right: 8px;
  }

  .sidebar[b-uk27ge7syk]  .nav-link {
    justify-content: center;
    gap: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .sidebar[b-uk27ge7syk]  .nav-label {
    display: none;
  }

  .sidebar[b-uk27ge7syk]  .nav-icon {
    margin: 0;
  }

  .sidebar[b-uk27ge7syk]  a.active {
    box-shadow: none;
    background: rgba(37, 99, 235, 0.16);
  }
}

.app-footer[b-uk27ge7syk] {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 4px 16px;
  margin: 0;
  border-top: 1px solid rgba(229, 231, 235, 0.8);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 12px;
  font-size: 11px;
  color: #6b7280;
  background: #F8FAFC;
}

.app-footer-left[b-uk27ge7syk] {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.app-footer-center[b-uk27ge7syk] {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  margin-left: 100px;
}

.app-footer-right[b-uk27ge7syk] {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.app-footer-right--brand[b-uk27ge7syk] {
  justify-self: end;
}

.app-footer-powered-by[b-uk27ge7syk] {
  color: #94a3b8;
  font-weight: 500;
  white-space: nowrap;
}

.app-footer-company-name[b-uk27ge7syk] {
  color: #5b6778;
  font-weight: 650;
}

.app-footer-logo[b-uk27ge7syk] {
  display: block;
  width: auto;
  height: 20px;
  object-fit: contain;
  opacity: 0.96;
}

.app-footer a[b-uk27ge7syk] {
  color: #6b7280;
  text-decoration: none;
  white-space: nowrap;
}

  .app-footer a:hover[b-uk27ge7syk] {
    text-decoration: underline;
  }

.app-footer-link[b-uk27ge7syk] {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  color: #6b7280;
  font: inherit;
  line-height: inherit;
  white-space: nowrap;
  cursor: pointer;
}

  .app-footer-link:hover[b-uk27ge7syk] {
    text-decoration: underline;
  }

.footer-policy-modal-backdrop[b-uk27ge7syk] {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
  background: rgba(15, 23, 42, 0.42);
}

.footer-policy-modal[b-uk27ge7syk] {
  width: min(840px, calc(100vw - 48px));
  max-height: min(880px, calc(100vh - 48px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(25, 35, 68, 0.12);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 22px 60px rgba(15, 23, 42, 0.24);
}

.footer-policy-modal-header[b-uk27ge7syk] {
  flex: 0 0 auto;
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 20px;
  border-bottom: 1px solid rgba(229, 231, 235, 0.95);
  background: #ffffff;
}

  .footer-policy-modal-header h2[b-uk27ge7syk] {
    margin: 0;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 750;
    letter-spacing: 0.01em;
    color: var(--text-900);
  }

.footer-policy-modal-close[b-uk27ge7syk] {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #94a3b8;
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
}

  .footer-policy-modal-close:hover[b-uk27ge7syk] {
    background: rgba(25, 35, 68, 0.06);
    color: var(--text-900);
  }

.footer-policy-modal-body[b-uk27ge7syk] {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 18px 26px 20px;
  color: #4b5563;
  font-size: 15px;
  line-height: 1.55;
  text-align: justify;
}

  .footer-policy-modal-body h3[b-uk27ge7syk] {
    margin: 18px 0 7px;
    color: var(--wam-honest-blue);
    font-size: 17px;
    line-height: 1.3;
    font-weight: 650;
    letter-spacing: 0.03em;
  }

    .footer-policy-modal-body h3:first-child[b-uk27ge7syk] {
      margin-top: 0;
    }

  .footer-policy-modal-body p[b-uk27ge7syk] {
    margin: 0 0 12px;
  }

.footer-policy-modal-actions[b-uk27ge7syk] {
  flex: 0 0 auto;
  display: flex;
  justify-content: flex-end;
  padding: 16px 20px;
  border-top: 1px solid rgba(229, 231, 235, 0.95);
  background: #ffffff;
}

.footer-policy-done-btn[b-uk27ge7syk] {
  min-width: 96px;
  min-height: 34px;
  padding: 0.4rem 1.1rem;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.footer-separator[b-uk27ge7syk] {
  margin: 0 8px;
  color: #cbd5e1;
}

.page-title[b-uk27ge7syk] {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  color: var(--text-900);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page-title-base[b-uk27ge7syk] {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-900);
}

.page-title-separator[b-uk27ge7syk] {
  color: rgba(25, 35, 68, 0.45);
  font-weight: 400;
}

.page-title-mode[b-uk27ge7syk] {
  font-weight: 700;
  letter-spacing: 0.01em;
}

/* Open-Stock: stronger berry/plum accent */
.page-title-mode-openstock[b-uk27ge7syk] {
  color: #8e3b67;
}

/* Pre-Pack: stronger slate/blue accent */
.page-title-mode-prepack[b-uk27ge7syk] {
  color: #3f6f9f;
}

/* =========================================================
   Blazor error UI
   ========================================================= */
#blazor-error-ui[b-uk27ge7syk] {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 1000;
  display: none;
  width: 100%;
  padding: 0.6rem 1.25rem 0.7rem;
  box-sizing: border-box;
  color-scheme: light only;
  background: lightyellow;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
}

  #blazor-error-ui .dismiss[b-uk27ge7syk] {
    position: absolute;
    top: 0.5rem;
    right: 0.75rem;
    cursor: pointer;
  }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* =========================================================
   NavMenu.razor.css
   Navigation-only styles
   ---------------------------------------------------------
   Scope:
   - Sidebar nav layout
   - Nav links / active state
   - Icon + label base styling
   - Bottom nav section

   Notes:
   - Collapse state is owned by MainLayout.razor.css
   - This file should not contain responsive collapse logic
   ========================================================= */

.nav-menu[b-nzlwfawtsv] {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: var(--bg-surface);
  min-width: 0;
  overflow-x: hidden;
  margin-bottom: 4px;
  margin-right: 2px;
}

.nav-scrollable[b-nzlwfawtsv] {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: var(--space-2) calc(var(--space-2) + 6px) var(--space-2) var(--space-2);
}

.nav-bottom[b-nzlwfawtsv] {
  padding: var(--space-3) calc(var(--space-3) + 6px) var(--space-3) var(--space-3);
  border-top: 1px solid transparent;
  overflow-x: hidden;
}

.nav-item[b-nzlwfawtsv]  .nav-link {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 44px;
  padding: 0 12px;
  color: var(--text-600);
  text-decoration: none;
  border-radius: var(--radius-1);
  transition: background 140ms ease, color 140ms ease;
}

  .nav-item[b-nzlwfawtsv]  .nav-link:hover {
    background: rgba(37, 99, 235, 0.08);
    color: var(--text-900);
  }

.nav-item[b-nzlwfawtsv]  a.active {
  color: var(--text-900);
  background: rgba(37, 99, 235, 0.12);
  box-shadow: inset 3px 0 0 var(--brand-600);
}

.nav-icon[b-nzlwfawtsv] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  min-width: 18px;
  margin: 0;
}

.nav-label[b-nzlwfawtsv] {
  display: inline-block;
  white-space: nowrap;
}

.bi[b-nzlwfawtsv] {
  width: 18px;
  height: 18px;
  opacity: 0.9;
}

.nav-item[b-nzlwfawtsv] {
  position: relative;
}

  .nav-item[b-nzlwfawtsv]  .nav-link {
    position: relative;
  }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-lc4ruxp51h],
.components-reconnect-repeated-attempt-visible[b-lc4ruxp51h],
.components-reconnect-failed-visible[b-lc4ruxp51h],
.components-pause-visible[b-lc4ruxp51h],
.components-resume-failed-visible[b-lc4ruxp51h],
.components-rejoining-animation[b-lc4ruxp51h] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-lc4ruxp51h],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-lc4ruxp51h],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-lc4ruxp51h],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-lc4ruxp51h],
#components-reconnect-modal.components-reconnect-retrying[b-lc4ruxp51h],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-lc4ruxp51h],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-lc4ruxp51h],
#components-reconnect-modal.components-reconnect-failed[b-lc4ruxp51h],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-lc4ruxp51h] {
    display: block;
}


#components-reconnect-modal[b-lc4ruxp51h] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-lc4ruxp51h 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-lc4ruxp51h 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-lc4ruxp51h 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-lc4ruxp51h]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-lc4ruxp51h 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-lc4ruxp51h {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-lc4ruxp51h {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-lc4ruxp51h {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-lc4ruxp51h] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-lc4ruxp51h] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-lc4ruxp51h] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-lc4ruxp51h] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-lc4ruxp51h] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-lc4ruxp51h] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-lc4ruxp51h] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-lc4ruxp51h 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-lc4ruxp51h] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-lc4ruxp51h {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Admin/Activity.razor.rz.scp.css */
/* =========================================================
   Activity.razor.css
   ---------------------------------------------------------
   Scope:
   - Activity page shell
   - Card shell
   - Toolbar controls
   - Table region
   - Sort controls
   - Timeline / detail rows
   - Pager
   - JSON modal
   - Responsive layout
   ========================================================= */

/* =========================================================
   Page shell
   ========================================================= */

.activity-page[b-2exxswr1n3] {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
  padding-top: 2px;
  container-type: inline-size;
  container-name: activity-page;
}

.activity-shell[b-2exxswr1n3] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.activity-main-card[b-2exxswr1n3] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-200);
  border-radius: 18px;
  /*box-shadow: var(--shadow-1);*/
  overflow: hidden;
}

.activity-card-header[b-2exxswr1n3] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 12px 8px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.activity-card-header-actions[b-2exxswr1n3] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.activity-title[b-2exxswr1n3] {
  margin: 0;
  color: var(--text-900, #0f172a);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.2;
}

.activity-subtitle[b-2exxswr1n3] {
  margin: 4px 0 0;
  color: var(--text-500, #64748b);
  font-size: 13px;
  line-height: 1.35;
}

/* =========================================================
   Loading
   ========================================================= */

.activity-loading[b-2exxswr1n3] {
  min-height: 240px;
  display: grid;
  place-items: center;
  gap: 10px;
}

.activity-loading-spinner[b-2exxswr1n3] {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 3px solid rgba(25, 35, 68, 0.10);
  border-top-color: var(--brand-600, #2563eb);
  animation: activity-spin-b-2exxswr1n3 0.8s linear infinite;
}

.activity-loading-text[b-2exxswr1n3] {
  font-size: 13px;
  color: var(--text-600);
}

@keyframes activity-spin-b-2exxswr1n3 {
  to {
    transform: rotate(360deg);
  }
}

/* =========================================================
   Main body
   ========================================================= */

.activity-body[b-2exxswr1n3] {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  padding: 0;
}

/* =========================================================
   Toolbar
   ========================================================= */

.activity-toolbar[b-2exxswr1n3] {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(280px, 1fr) 150px 170px 88px;
  gap: 10px;
  align-items: end;
  padding: 14px 12px 10px;
  margin-bottom: 0;
  flex: 0 0 auto;
}

  .activity-toolbar > div[b-2exxswr1n3],
  .activity-toolbar > label[b-2exxswr1n3],
  .activity-toolbar > span[b-2exxswr1n3] {
    min-width: 0;
  }

.activity-search[b-2exxswr1n3],
.activity-select[b-2exxswr1n3],
.activity-page-size[b-2exxswr1n3] {
  width: 100%;
  min-height: 38px;
}

/* =========================================================
   Table region
   ========================================================= */

.activity-table-region[b-2exxswr1n3] {
  min-height: 0;
  height: 100%;
  margin: 0 12px 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 10px;
}

.activity-table-wrap[b-2exxswr1n3] {
  min-height: 0;
  position: relative;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  background: #ffffff;
}

.activity-table[b-2exxswr1n3] {
  width: 100%;
  min-width: 1060px;
  margin: 0;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.82rem;
}

  .activity-table thead th[b-2exxswr1n3] {
    position: sticky;
    top: 0;
    z-index: 12;
    padding: 0.58rem 0.55rem;
    border-bottom: 0;
    background: #ffffff;
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.035em;
    text-transform: uppercase;
    white-space: nowrap;
    box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
  }

  .activity-table tbody td[b-2exxswr1n3] {
    padding: 0.56rem 0.55rem;
    vertical-align: middle;
    border-bottom: 1px solid #edf2f7;
    background: #ffffff;
    color: var(--text-900, #0f172a);
    font-size: 0.82rem;
    line-height: 1.35;
  }

  .activity-table tbody tr:hover td[b-2exxswr1n3] {
    background: #fbfdff;
  }

  /* Align table content with the filter row and pager inset. */
  .activity-table thead th:first-child[b-2exxswr1n3],
  .activity-table tbody td:first-child[b-2exxswr1n3] {
    padding-left: 12px;
  }

  .activity-table thead th:last-child[b-2exxswr1n3],
  .activity-table tbody td:last-child[b-2exxswr1n3] {
    padding-right: 12px;
  }

/* =========================================================
   Sort controls
   ========================================================= */

.activity-sort-button[b-2exxswr1n3] {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
  white-space: nowrap;
}

  .activity-sort-button:hover[b-2exxswr1n3],
  .activity-sort-button--active[b-2exxswr1n3] {
    color: #2563eb;
  }

.activity-sort-indicator[b-2exxswr1n3] {
  font-size: 0.72rem;
  line-height: 1;
}

/* =========================================================
   Column sizing
   ---------------------------------------------------------
   Fixed activity table columns keep stream, type, event,
   timestamp, count, and actor values from crowding each
   other. Long badge values must clip inside their columns
   instead of expanding into neighboring cells.
   ========================================================= */

.activity-table td.activity-col-entity[b-2exxswr1n3] {
  min-width: 0;
  overflow: hidden;
  max-width: 0;
}

.activity-col-expand[b-2exxswr1n3] {
  width: 34px;
  min-width: 34px;
  text-align: center;
}

.activity-col-entity[b-2exxswr1n3] {
  width: auto;
  min-width: 280px;
}

.activity-col-type[b-2exxswr1n3] {
  width: 142px;
  min-width: 136px;
}

.activity-col-latest[b-2exxswr1n3] {
  width: 188px;
  min-width: 178px;
}

.activity-col-last[b-2exxswr1n3] {
  width: 150px;
  min-width: 142px;
}

.activity-col-count[b-2exxswr1n3] {
  width: 72px;
  min-width: 68px;
  text-align: center;
}

.activity-col-actor[b-2exxswr1n3] {
  width: 210px;
  min-width: 190px;
}

.activity-table td.activity-col-type[b-2exxswr1n3],
.activity-table td.activity-col-latest[b-2exxswr1n3],
.activity-table td.activity-col-last[b-2exxswr1n3],
.activity-table td.activity-col-count[b-2exxswr1n3] {
  overflow: hidden;
  white-space: nowrap;
}

/* =========================================================
   Row presentation
   ========================================================= */

.activity-stream-row[b-2exxswr1n3] {
  cursor: pointer;
}

  .activity-stream-row.is-open td[b-2exxswr1n3] {
    background: #fcfdff;
  }

  .activity-stream-row.is-open td[b-2exxswr1n3] {
    border-bottom-color: rgba(219, 228, 239, 0.9);
  }

.activity-expand-btn[b-2exxswr1n3] {
  width: 24px;
  min-width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 7px;
  background: #f3f6fb;
  color: var(--link-600, #2563eb);
  box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.82);
  font-size: 0.9rem;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  transition: background-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}

  .activity-stream-row:hover .activity-expand-btn[b-2exxswr1n3],
  .activity-expand-btn:hover[b-2exxswr1n3] {
    background: #edf4ff;
    color: #1d4ed8;
    box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.68);
  }

.activity-entity-primary[b-2exxswr1n3] {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  color: var(--text-900, #0f172a);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.activity-entity-secondary[b-2exxswr1n3] {
  margin-top: 4px;
  font-size: 12px;
  color: var(--text-600);
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[b-2exxswr1n3] .activity-tooltip-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

  [b-2exxswr1n3] .activity-tooltip-wrap .activity-entity-primary {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

.activity-last-time[b-2exxswr1n3] {
  white-space: nowrap;
}

.activity-type-badge[b-2exxswr1n3] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  width: 100%;
  max-width: 112px;
  min-width: 0;
  padding: 0 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.16);
  color: #475569;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.activity-col-type[b-2exxswr1n3],
.activity-col-latest[b-2exxswr1n3] {
  min-width: 0;
  overflow: hidden;
}

  .activity-col-type .activity-type-badge[b-2exxswr1n3],
  .activity-col-latest .event-badge[b-2exxswr1n3] {
    max-width: 100%;
    white-space: nowrap;
  }

.activity-count-badge[b-2exxswr1n3] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
  background: #eef2ff;
  color: #3730a3;
}

.activity-empty[b-2exxswr1n3] {
  text-align: center;
  color: var(--text-500, #667085);
  padding: 2rem 1rem !important;
}

.activity-inline-loading[b-2exxswr1n3] {
  color: var(--text-600);
  font-size: 13px;
  padding: 4px 0 8px;
}

.activity-actor-text[b-2exxswr1n3] {
  display: inline-block;
  max-width: 100%;
  color: var(--text-900, #0f172a);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}

.activity-actor-wrap[b-2exxswr1n3] {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.activity-actor-secondary[b-2exxswr1n3] {
  color: var(--text-500, #64748b);
  font-size: 12px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* =========================================================
   Detail row / timeline
   ========================================================= */

.activity-detail-row td[b-2exxswr1n3] {
  background: #fcfdff;
  border-top: none;
}

.activity-detail-cell[b-2exxswr1n3] {
  padding: 0.35rem 0.75rem 0.85rem 3.15rem !important;
}

.activity-timeline[b-2exxswr1n3] {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.70rem;
  padding: 0.20rem 0 0.10rem;
}

.activity-timeline-item[b-2exxswr1n3] {
  display: grid;
  grid-template-columns: 170px 16px minmax(0, 1fr);
  gap: 0.75rem;
  align-items: start;
}

.activity-timeline-time[b-2exxswr1n3] {
  color: var(--text-500, #667085);
  font-size: 0.85rem;
  white-space: nowrap;
  padding-top: 0.1rem;
}

.activity-timeline-marker[b-2exxswr1n3] {
  position: relative;
  width: 12px;
  min-height: 100%;
}

  .activity-timeline-marker[b-2exxswr1n3]::before {
    content: "";
    position: absolute;
    top: 0.25rem;
    left: 4px;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #98a2b3;
  }

  .activity-timeline-marker[b-2exxswr1n3]::after {
    content: "";
    position: absolute;
    top: 0.95rem;
    left: 7px;
    bottom: -0.85rem;
    width: 1px;
    background: rgba(152, 162, 179, 0.45);
  }

.activity-timeline-item:last-child .activity-timeline-marker[b-2exxswr1n3]::after {
  display: none;
}

.activity-timeline-content[b-2exxswr1n3] {
  min-width: 0;
}

.activity-timeline-top[b-2exxswr1n3] {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.activity-timeline-actor[b-2exxswr1n3] {
  font-size: 12px;
  color: var(--text-600);
  line-height: 1.35;
}

.activity-timeline-summary[b-2exxswr1n3] {
  margin-top: 5px;
  color: var(--text-700, #334155);
  font-size: 13px;
  line-height: 1.4;
}

.activity-timeline-actions[b-2exxswr1n3] {
  margin-top: 8px;
}

.json-link-btn[b-2exxswr1n3] {
  border: 0;
  background: transparent;
  padding: 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--link-600, #2563eb);
  text-decoration: none;
  cursor: pointer;
}

  .json-link-btn:hover[b-2exxswr1n3] {
    text-decoration: underline;
  }

/* =========================================================
   Pager
   ========================================================= */

.activity-pager[b-2exxswr1n3] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 6px 14px 4px;
  background: #f8fafc;
  border-top: 1px solid rgba(25, 35, 68, 0.06);
  flex-wrap: wrap;
}

.activity-pager-meta[b-2exxswr1n3] {
  font-size: 12px;
  color: var(--text-600);
}

.activity-pager-actions[b-2exxswr1n3] {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.activity-pager-page[b-2exxswr1n3] {
  min-width: 88px;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-700, #334155);
}

/* =========================================================
   Event badge colors
   ========================================================= */

.event-badge[b-2exxswr1n3] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  width: 100%;
  max-width: 170px;
  min-width: 0;
  padding: 0 8px;
  overflow: hidden;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

  .event-badge.accepted[b-2exxswr1n3] {
    background: rgba(34, 197, 94, 0.14);
    color: #15803d;
  }

  .event-badge.created[b-2exxswr1n3] {
    background: rgba(59, 130, 246, 0.14);
    color: #2563eb;
  }

  .event-badge.expired[b-2exxswr1n3] {
    background: rgba(148, 163, 184, 0.18);
    color: #475569;
  }

  .event-badge.rejected[b-2exxswr1n3] {
    background: rgba(239, 68, 68, 0.14);
    color: #b91c1c;
  }

  .event-badge.approved[b-2exxswr1n3] {
    background: rgba(34, 197, 94, 0.14);
    color: #15803d;
  }

  .event-badge.submitted[b-2exxswr1n3] {
    background: rgba(14, 165, 233, 0.14);
    color: #0369a1;
  }

  .event-badge.resubmitted[b-2exxswr1n3] {
    background: rgba(99, 102, 241, 0.14);
    color: #4338ca;
  }

  .event-badge.openfordrafting[b-2exxswr1n3] {
    background: rgba(59, 130, 246, 0.14);
    color: #1d4ed8;
  }

  .event-badge.openforsubmission[b-2exxswr1n3] {
    background: rgba(14, 165, 233, 0.14);
    color: #0369a1;
  }

  .event-badge.wamreview[b-2exxswr1n3] {
    background: rgba(245, 158, 11, 0.16);
    color: #b45309;
  }

  .event-badge.distributorreview[b-2exxswr1n3] {
    background: rgba(16, 185, 129, 0.16);
    color: #047857;
  }

  .event-badge.locked[b-2exxswr1n3] {
    background: rgba(107, 114, 128, 0.16);
    color: #374151;
  }

  .event-badge.published[b-2exxswr1n3] {
    background: rgba(34, 197, 94, 0.18);
    color: #166534;
  }

  .event-badge.cycle-status[b-2exxswr1n3] {
    background: rgba(99, 102, 241, 0.14);
    color: #4338ca;
  }

/* =========================================================
   JSON modal
   ========================================================= */

.json-modal-backdrop[b-2exxswr1n3] {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  z-index: 1040;
}

.json-modal[b-2exxswr1n3] {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: grid;
  place-items: center;
  padding: 1rem;
}

.json-modal-card[b-2exxswr1n3] {
  width: min(900px, 96vw);
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.25);
  overflow: hidden;
}

.json-modal-header[b-2exxswr1n3],
.json-modal-footer[b-2exxswr1n3] {
  padding: 0.85rem 1rem;
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.json-modal-footer[b-2exxswr1n3] {
  border-bottom: none;
  border-top: 1px solid rgba(25, 35, 68, 0.08);
  display: flex;
  justify-content: flex-end;
  gap: 15px;
}

.json-modal-title[b-2exxswr1n3] {
  font-weight: 700;
  color: var(--text-900);
}

.json-modal-close[b-2exxswr1n3] {
  border: none;
  background: transparent;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  color: var(--text-500);
}

.json-modal-header[b-2exxswr1n3] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.json-modal-body[b-2exxswr1n3] {
  padding: 1rem;
  overflow: auto;
}

.json-pretty[b-2exxswr1n3] {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--text-900);
  white-space: pre-wrap;
  word-break: break-word;
}

.activity-time-trigger[b-2exxswr1n3] {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 1100px) {
  .activity-toolbar[b-2exxswr1n3] {
    grid-template-columns: minmax(220px, 1fr) 150px 170px 88px;
  }
}

@media (max-width: 900px) {
  .activity-toolbar[b-2exxswr1n3] {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }

  .activity-timeline-item[b-2exxswr1n3] {
    grid-template-columns: 1fr;
    gap: 0.4rem;
  }

  .activity-timeline-marker[b-2exxswr1n3] {
    display: none;
  }

  .activity-detail-cell[b-2exxswr1n3] {
    padding-left: 1rem !important;
  }
}

@media (max-width: 640px) {
  .activity-toolbar[b-2exxswr1n3] {
    grid-template-columns: 1fr;
  }

  .activity-card-header[b-2exxswr1n3],
  .activity-pager[b-2exxswr1n3] {
    padding-left: 12px;
    padding-right: 12px;
  }

  .activity-table-region[b-2exxswr1n3] {
    margin-left: 10px;
    margin-right: 10px;
  }
}
/* /Components/Pages/Admin/Billing.razor.rz.scp.css */
/* ==========================================================================
   Billing Page
   --------------------------------------------------------------------------
   WAM Admin billing review workspace for published final books.
   Styles are scoped to Billing.razor through Blazor CSS isolation.
   ========================================================================== */


/* ==========================================================================
   Page Shell
   --------------------------------------------------------------------------
   Maintains the same full-height admin page behavior used across WAM Admin
   queue/list pages.
   ========================================================================== */

.billing-page[b-dsiomfyxbk] {
  flex: 1 1 auto;
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #f8fafc;
  color: #0f172a;
  overflow: hidden;
  box-sizing: border-box;
  container-type: inline-size;
  container-name: billing-page;
}

.billing-workspace[b-dsiomfyxbk] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
}

/* ==========================================================================
   Summary Cards
   --------------------------------------------------------------------------
   Compact operational summary cards aligned with Dashboard and grid pages.
   Uses container queries so wrapping responds to sidebar space.
   ========================================================================== */

.billing-summary-strip[b-dsiomfyxbk] {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.billing-summary-card[b-dsiomfyxbk] {
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--border-200, rgba(25, 35, 68, 0.12));
  border-radius: 13px;
  background: #ffffff;
  box-shadow: var(--shadow-1, 0 1px 4px rgba(15, 23, 42, 0.08));
  text-align: left;
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

  .billing-summary-card:hover[b-dsiomfyxbk] {
    transform: translateY(-1px);
    border-color: #bfdbfe;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.07);
  }

  .billing-summary-card.is-active[b-dsiomfyxbk] {
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.12);
  }

.billing-summary-card--success[b-dsiomfyxbk] {
  border-color: rgba(91, 196, 191, 0.38);
  background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.billing-summary-card--warning[b-dsiomfyxbk] {
  border-color: rgba(250, 169, 75, 0.32);
  background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

.billing-summary-card--info[b-dsiomfyxbk] {
  border-color: rgba(59, 130, 246, 0.22);
  background: linear-gradient(180deg, rgba(59, 130, 246, 0.045), #fff);
}

.billing-summary-card--neutral[b-dsiomfyxbk] {
  border-color: rgba(25, 35, 68, 0.12);
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.9), #fff);
}

.billing-summary-label[b-dsiomfyxbk] {
  margin: 0 0 6px;
  overflow: hidden;
  color: var(--text-600, #475569);
  font-size: 13.5px;
  line-height: 1.3;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.billing-summary-value[b-dsiomfyxbk] {
  margin: 0;
  color: var(--text-900, #0f172a);
  font-size: 21px;
  line-height: 1;
  font-weight: 800;
}

.billing-summary-meta[b-dsiomfyxbk] {
  margin-top: 5px;
  overflow: hidden;
  color: var(--text-500, #64748b);
  font-size: 12px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}


/* ==========================================================================
   Main Billing Card
   --------------------------------------------------------------------------
   Contains the Billing Queue header, default rate panel, controls, table,
   and pager.
   ========================================================================== */

.billing-card[b-dsiomfyxbk] {
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
}

.billing-list-section[b-dsiomfyxbk] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.billing-panel-header[b-dsiomfyxbk] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 12px 8px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.07);
  flex: 0 0 auto;
}

.billing-card-title[b-dsiomfyxbk] {
  margin: 0;
  color: var(--text-900, #0f172a);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.01em;
}

.billing-card-subtitle[b-dsiomfyxbk] {
  margin: 4px 0 0;
  color: var(--text-500, #64748b);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
}

.billing-panel-header-actions[b-dsiomfyxbk] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.billing-primary-button[b-dsiomfyxbk],
.billing-secondary-button[b-dsiomfyxbk] {
  min-height: 2.05rem;
  min-width: 108px;
  padding: 0.34rem 0.75rem;
  border-radius: 0.55rem;
  font-size: 0.84rem;
  font-weight: 750;
  line-height: 1.2;
}

/* ==========================================================================
   Column sizing / sticky actions
   --------------------------------------------------------------------------
   Billing has more detail than Products but less width pressure than reports.
   Table waits until 1060px before horizontal scroll.
   ========================================================================== */

.billing-col-billto[b-dsiomfyxbk] {
  width: 130px;
  min-width: 120px;
}

.billing-col-period[b-dsiomfyxbk] {
  width: 138px;
  min-width: 128px;
}

.billing-col-type[b-dsiomfyxbk] {
  width: 104px;
  min-width: 96px;
}

.billing-col-book[b-dsiomfyxbk] {
  width: auto;
  min-width: 300px;
}

.billing-col-pages[b-dsiomfyxbk] {
  width: 72px;
  min-width: 66px;
  text-align: right;
}

.billing-col-amount[b-dsiomfyxbk] {
  width: 96px;
  min-width: 90px;
  text-align: right;
}

.billing-col-status[b-dsiomfyxbk] {
  width: 112px;
  min-width: 104px;
}

.billing-col-actions[b-dsiomfyxbk] {
  width: 104px;
  min-width: 104px;
  max-width: 104px;
}

/* Actions column is pinned to the right edge of the table scroll viewport.
   The sticky cell stays neutral; the inner action zone owns emphasis. */
.billing-table th.billing-col-actions[b-dsiomfyxbk],
.billing-table td.billing-col-actions[b-dsiomfyxbk] {
  position: sticky;
  right: 0;
  z-index: 10;
  padding-left: 0.64rem;
  padding-right: 12px;
  text-align: left;
  white-space: nowrap;
  background: #ffffff;
  background-clip: padding-box;
  box-shadow: none;
}

.billing-table thead th.billing-col-actions[b-dsiomfyxbk] {
  z-index: 18;
  background: #ffffff;
  color: #64748b;
  box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
}

.billing-table tbody tr:hover td.billing-col-actions[b-dsiomfyxbk] {
  background: #fbfdff;
}

/* ==========================================================================
   Rate Panel
   --------------------------------------------------------------------------
   Displays the default rate used for unadjusted billing rows.
   ========================================================================== */

.billing-rate-panel[b-dsiomfyxbk] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc;
  padding: 9px 12px;
}

.billing-rate-title[b-dsiomfyxbk] {
  color: var(--text-900, #0f172a);
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.005em;
}

.billing-rate-helper[b-dsiomfyxbk] {
  margin-top: 3px;
  color: var(--text-500, #64748b);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.25;
}

.billing-rate-input-wrap[b-dsiomfyxbk] {
  display: flex;
  align-items: center;
  width: 150px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #ffffff;
  overflow: hidden;
}

.billing-rate-prefix[b-dsiomfyxbk] {
  padding: 0 10px;
  color: #64748b;
  font-weight: 800;
}

.billing-rate-input[b-dsiomfyxbk] {
  border: 0;
  box-shadow: none;
  font-weight: 700;
}


/* ==========================================================================
   Filters
   --------------------------------------------------------------------------
   Compact desktop-first control bar sized for the expanded sidebar content
   width.
   ========================================================================== */

.billing-list-body[b-dsiomfyxbk] {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  min-width: 0;
  padding: 0;
}

.billing-controls[b-dsiomfyxbk] {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(118px, 0.36fr) minmax(104px, 0.28fr) minmax(118px, 0.34fr) minmax(118px, 0.34fr) minmax(128px, 0.38fr) minmax(86px, 0.22fr);
  gap: 10px;
  align-items: end;
  padding: 12px 12px 10px;
  border-bottom: 0;
  background: #ffffff;
  flex: 0 0 auto;
}

.billing-control-label[b-dsiomfyxbk] {
  display: block;
  margin-bottom: 5px;
  color: #0f172a;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.1;
}

.billing-search[b-dsiomfyxbk],
.billing-select[b-dsiomfyxbk] {
  min-height: 2.15rem;
  font-size: 0.84rem;
  border-color: #d7e0ec;
  border-radius: 9px;
  color: #1e293b;
}


/* ==========================================================================
   Billing Table
   --------------------------------------------------------------------------
   Sticky table header and fixed-height region keep the page stable above the
   footer.
   ========================================================================== */

.billing-table-region[b-dsiomfyxbk] {
  min-height: 0;
  height: 100%;
  margin: 0 12px 0;
  background: #ffffff;
  overflow: hidden;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 10px;
}

.billing-table-wrap[b-dsiomfyxbk] {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  position: relative;
  background: #ffffff;
}

.billing-table[b-dsiomfyxbk] {
  width: 100%;
  margin: 0;
  min-width: 1010px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  color: #0f172a;
  font-size: 0.82rem;
}

  .billing-table thead th[b-dsiomfyxbk] {
    position: sticky;
    top: 0;
    z-index: 12;
    background: #ffffff;
    border-bottom: 0;
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    white-space: nowrap;
    padding: 0.58rem 0.55rem;
    box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
  }

  .billing-table tbody td[b-dsiomfyxbk] {
    vertical-align: middle;
    border-bottom: 1px solid #edf2f7;
    padding: 0.56rem 0.55rem;
    background: #ffffff;
  }

  .billing-table tbody tr:hover td[b-dsiomfyxbk] {
    background: #fbfdff;
  }

  /* Align the first table cell with the filter edge. */
  .billing-table thead th:first-child[b-dsiomfyxbk],
  .billing-table tbody td:first-child[b-dsiomfyxbk] {
    padding-left: 12px;
  }

.billing-sort-button[b-dsiomfyxbk] {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
  white-space: nowrap;
}

  .billing-sort-button:hover[b-dsiomfyxbk],
  .billing-sort-button--active[b-dsiomfyxbk] {
    color: #2563eb;
  }

.billing-sort-indicator[b-dsiomfyxbk] {
  font-size: 0.72rem;
  line-height: 1;
}

.billing-primary[b-dsiomfyxbk] {
  color: #0f172a;
  font-weight: 700;
}

.billing-secondary[b-dsiomfyxbk] {
  margin-top: 2px;
  color: #64748b;
  font-size: 0.8rem;
}

.billing-cell-stack[b-dsiomfyxbk] {
  min-width: 0;
}

.billing-truncate[b-dsiomfyxbk] {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[b-dsiomfyxbk] .billing-tooltip-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

[b-dsiomfyxbk] .billing-book-title-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.billing-book-title[b-dsiomfyxbk] {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  color: #0f172a;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.billing-book-meta[b-dsiomfyxbk] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.billing-number[b-dsiomfyxbk] {
  font-weight: 800;
  color: #0f172a;
}

.billing-row-actions[b-dsiomfyxbk] {
  width: 100%;
  min-height: 28px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 4px 8px;
  border-radius: 7px;
  background: #f3f6fb;
  box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.82);
  white-space: nowrap;
  transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.billing-table tbody tr:hover .billing-row-actions[b-dsiomfyxbk] {
  background: #edf4ff;
  box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.68);
}

.billing-link-action[b-dsiomfyxbk] {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--link-600, #2563eb);
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
}

  .billing-link-action:hover[b-dsiomfyxbk] {
    color: #1d4ed8;
    text-decoration: underline;
    text-underline-offset: 2px;
  }

.billing-action-sep[b-dsiomfyxbk] {
  color: #94a3b8;
}

.billing-empty-cell[b-dsiomfyxbk],
.billing-inline-state[b-dsiomfyxbk] {
  padding: 28px;
  text-align: center;
  color: #64748b;
}

.billing-empty-state-card[b-dsiomfyxbk] {
  align-self: start;
  margin: 14px;
  padding: 18px 18px 16px;
  border: 1px dashed rgba(29, 58, 109, 0.18);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(29, 58, 109, 0.025), rgba(91, 196, 191, 0.02));
  color: var(--text-600, #475569);
  font-size: 13px;
  line-height: 1.6;
  text-align: center;
}

.billing-inline-state-error[b-dsiomfyxbk] {
  color: #b91c1c;
}


/* ==========================================================================
   Pager
   --------------------------------------------------------------------------
   Matches the lower table pager used on other WAM Admin list pages.
   ========================================================================== */

.billing-pager[b-dsiomfyxbk] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 6px 14px 4px;
  background: #f8fafc;
  border-top: 1px solid rgba(25, 35, 68, 0.06);
}

.billing-pager-summary[b-dsiomfyxbk] {
  color: var(--text-600, #475569);
  font-size: 12px;
  font-weight: 500;
}

.billing-pager-page[b-dsiomfyxbk] {
  min-width: 88px;
  color: var(--text-700, #334155);
  font-size: 12px;
  font-weight: 600;
  text-align: center;
}

.billing-pager-actions[b-dsiomfyxbk] {
  display: flex;
  align-items: center;
  gap: 12px;
}


/* ==========================================================================
   Badges
   --------------------------------------------------------------------------
   Billing type/status pills align with Promotions and Promotion Pricing.
   ========================================================================== */

.billing-type-badge[b-dsiomfyxbk],
.billing-status-badge[b-dsiomfyxbk] {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

.billing-type-badge[b-dsiomfyxbk] {
  min-width: 76px;
}

.billing-status-badge[b-dsiomfyxbk] {
  min-width: 88px;
}

.billing-type-badge--openstock[b-dsiomfyxbk] {
  border-color: rgba(142, 59, 103, 0.16);
  background: rgba(142, 59, 103, 0.10);
  color: rgb(142, 59, 103);
}

.billing-type-badge--prepack[b-dsiomfyxbk] {
  border-color: rgba(63, 111, 159, 0.16);
  background: rgba(63, 111, 159, 0.12);
  color: rgb(63, 111, 159);
}

.billing-type-badge--mixed[b-dsiomfyxbk] {
  border-color: rgba(109, 40, 217, 0.14);
  background: rgba(109, 40, 217, 0.10);
  color: #6d28d9;
}

.billing-type-badge--default[b-dsiomfyxbk] {
  border-color: rgba(148, 163, 184, 0.18);
  background: rgba(148, 163, 184, 0.14);
  color: #475569;
}

.billing-status-badge--ready[b-dsiomfyxbk] {
  background: rgba(245, 158, 11, 0.16);
  color: #b45309;
}

.billing-status-badge--reviewed[b-dsiomfyxbk] {
  background: rgba(34, 197, 94, 0.16);
  color: #15803d;
}

.billing-status-badge--exported[b-dsiomfyxbk] {
  background: rgba(59, 130, 246, 0.14);
  color: #1d4ed8;
}

.billing-status-badge--hold[b-dsiomfyxbk] {
  background: rgba(239, 68, 68, 0.14);
  color: #b91c1c;
}

.billing-status-badge--notbillable[b-dsiomfyxbk] {
  background: rgba(148, 163, 184, 0.14);
  color: #475569;
}


/* ==========================================================================
   Details Modal
   --------------------------------------------------------------------------
   Modal used for charge review, bill-to selection, page/rate adjustment,
   and internal billing notes.
   ========================================================================== */

.billing-modal-backdrop[b-dsiomfyxbk] {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(15, 23, 42, 0.55);
  padding: 24px;
}

.billing-details-modal[b-dsiomfyxbk] {
  width: min(980px, calc(100vw - 48px));
  max-height: calc(100vh - 48px);
  display: flex;
  flex-direction: column;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.24);
  overflow: hidden;
}

.billing-details-modal-header[b-dsiomfyxbk],
.billing-details-modal-footer[b-dsiomfyxbk] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px;
  border-bottom: 1px solid #e2e8f0;
}

.billing-details-modal-footer[b-dsiomfyxbk] {
  justify-content: flex-end;
  border-top: 1px solid #e2e8f0;
  border-bottom: 0;
}

.billing-modal-title[b-dsiomfyxbk] {
  margin: 0;
  color: #0f172a;
  font-size: 1.25rem;
  font-weight: 800;
}

.billing-modal-subtitle[b-dsiomfyxbk] {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 0.9rem;
}

.billing-modal-close[b-dsiomfyxbk] {
  border: 0;
  background: transparent;
  color: #64748b;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
}

.billing-details-modal-body[b-dsiomfyxbk] {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px 20px;
  overflow: auto;
}

.billing-detail-title-row-compact[b-dsiomfyxbk] {
  margin-bottom: 0.65rem;
}

.billing-modal-status-stack[b-dsiomfyxbk] {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex: 0 0 auto;
}

.billing-modal-total[b-dsiomfyxbk] {
  color: #0f172a;
  font-size: 1.1rem;
  font-weight: 850;
  white-space: nowrap;
}

.billing-context-summary[b-dsiomfyxbk] {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.75rem;
  border: 1px solid #e5edf7;
  border-radius: 0.8rem;
  background: #f8fafc;
}

.billing-context-main[b-dsiomfyxbk] {
  min-width: 0;
}

.billing-context-title[b-dsiomfyxbk] {
  color: #0f172a;
  font-size: 0.98rem;
  font-weight: 780;
  line-height: 1.25;
}

.billing-context-meta[b-dsiomfyxbk] {
  margin-top: 0.2rem;
  color: #64748b;
  font-size: 0.8rem;
}

.billing-context-pill-row[b-dsiomfyxbk] {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.35rem;
  flex: 0 0 auto;
}

.billing-context-pill[b-dsiomfyxbk] {
  display: inline-flex;
  align-items: center;
  min-height: 1.45rem;
  padding: 0.18rem 0.65rem;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #ffffff;
  color: #475569;
  font-size: 0.72rem;
  font-weight: 750;
  white-space: nowrap;
}

.billing-detail-compact-grid[b-dsiomfyxbk] {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 0.8fr;
  gap: 0.5rem;
  margin-top: 0.65rem;
}

.billing-detail-compact-item[b-dsiomfyxbk] {
  min-width: 0;
  border: 1px solid #e5edf7;
  border-radius: 0.7rem;
  background: #ffffff;
  padding: 0.55rem 0.65rem;
}

.billing-detail-compact-item-wide[b-dsiomfyxbk] {
  min-width: 0;
}

.billing-details-section[b-dsiomfyxbk] {
  border: 1px solid #e2e8f0;
  border-radius: 0.9rem;
  background: #ffffff;
  padding: 0.85rem;
}

.billing-detail-title-row[b-dsiomfyxbk] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}

.billing-detail-section-title[b-dsiomfyxbk] {
  color: #0f172a;
  font-size: 0.8rem;
  font-weight: 850;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.billing-detail-section-helper[b-dsiomfyxbk] {
  margin-top: 0.12rem;
  color: #64748b;
  font-size: 0.76rem;
}

.billing-detail-grid[b-dsiomfyxbk],
.billing-edit-grid[b-dsiomfyxbk] {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.billing-edit-grid-compact[b-dsiomfyxbk] {
  grid-template-columns: 1.1fr 0.75fr 0.75fr 0.8fr 1fr 0.95fr;
  gap: 0.5rem;
}

.billing-detail-item[b-dsiomfyxbk],
.billing-edit-field[b-dsiomfyxbk] {
  border: 1px solid #e5edf7;
  border-radius: 0.7rem;
  background: #f8fafc;
  padding: 0.55rem 0.65rem;
}

.billing-detail-item-wide[b-dsiomfyxbk] {
  grid-column: span 2;
}

.billing-edit-field-wide[b-dsiomfyxbk] {
  grid-column: span 6;
}

.billing-detail-label[b-dsiomfyxbk],
.billing-edit-label[b-dsiomfyxbk] {
  display: block;
  color: #64748b;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.billing-detail-value[b-dsiomfyxbk] {
  display: block;
  margin-top: 0.28rem;
  color: #0f172a;
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.25;
}

.billing-detail-amount[b-dsiomfyxbk] {
  color: #0f172a;
  font-size: 1.1rem;
  font-weight: 850;
}

.billing-edit-select[b-dsiomfyxbk],
.billing-edit-input[b-dsiomfyxbk],
.billing-edit-textarea[b-dsiomfyxbk] {
  margin-top: 0.35rem;
  min-height: 2rem;
  border-color: #d7e0ec;
  border-radius: 0.55rem;
  font-size: 0.84rem;
  font-weight: 650;
}

.billing-note-block[b-dsiomfyxbk] {
  margin-top: 0.65rem;
  border: 1px solid #e5edf7;
  border-radius: 0.75rem;
  background: #f8fafc;
  padding: 0.65rem;
}

.billing-edit-amount[b-dsiomfyxbk] {
  background: #ffffff;
  color: #0f172a;
}

.billing-promotion-list[b-dsiomfyxbk] {
  display: grid;
  gap: 6px;
}

.billing-promotion-line[b-dsiomfyxbk] {
  border: 1px solid #edf2f7;
  border-radius: 0.65rem;
  background: #f8fafc;
  padding: 0.45rem 0.6rem;
  color: #334155;
  font-size: 0.78rem;
  line-height: 1.25;
}


/* ==========================================================================
   Responsive Adjustments
   --------------------------------------------------------------------------
   Secondary breakpoint for narrower admin content widths and collapsed
   browser/dev tools scenarios.
   ========================================================================== */

@container billing-page (max-width: 980px) {
  .billing-summary-strip[b-dsiomfyxbk] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .billing-controls[b-dsiomfyxbk] {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }

  .billing-control-search[b-dsiomfyxbk] {
    grid-column: 1 / -1;
  }

  .billing-detail-grid[b-dsiomfyxbk],
  .billing-edit-grid[b-dsiomfyxbk] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .billing-detail-item-wide[b-dsiomfyxbk],
  .billing-edit-field-wide[b-dsiomfyxbk] {
    grid-column: span 2;
  }

  .billing-detail-compact-grid[b-dsiomfyxbk],
  .billing-edit-grid-compact[b-dsiomfyxbk] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .billing-context-summary[b-dsiomfyxbk] {
    flex-direction: column;
  }

  .billing-context-pill-row[b-dsiomfyxbk] {
    justify-content: flex-start;
  }
}
/* /Components/Pages/Admin/Books.razor.rz.scp.css */
/* =========================================================
   Admin Books
   ---------------------------------------------------------
   Books layout is maintained by:
   Components/Shared/Books/BookShared.razor.css

   Add styles here only when behavior or layout is unique to:
   Pages/Admin/Books.razor
   ========================================================= */
/* /Components/Pages/Admin/Companies.razor.rz.scp.css */
/* =========================================================
   Companies.razor.css
   ---------------------------------------------------------
   Scope:
   - Companies page shell
   - Summary cards
   - Company list card
   - Company modal
   - Toolbar / filters
   - Table shell
   - Sort controls
   - Sticky Actions column
   - Pager
   - Responsive layout
   ========================================================= */

/* =========================================================
   Page shell
   ========================================================= */

.companies-page[b-gdbvp38lor] {
  flex: 1 1 auto;
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 2px;
  overflow: hidden;
  container-type: inline-size;
  container-name: companies-page;
}

.companies-workspace[b-gdbvp38lor] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
}

.companies-header[b-gdbvp38lor] {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.companies-header-copy[b-gdbvp38lor] {
  min-width: 0;
  flex: 1 1 auto;
}

.companies-title[b-gdbvp38lor] {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: var(--text-900);
}

.companies-subtitle[b-gdbvp38lor] {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--text-500);
}

.companies-primary-button[b-gdbvp38lor] {
  min-width: 150px;
  min-height: 30px;
  padding: 4px 16px;
  font-size: 14px;
  border-radius: 8px;
  font-weight: 600;
}

/* =========================================================
   Companies + Users module tabs
   ---------------------------------------------------------
   Compact left-aligned pill navigation for switching between
   company and user administration workspaces. Match the
   Reports and Books tab behavior while using a wider tab
   width for this two-option administration module.
   ========================================================= */

.companies-users-tabs[b-gdbvp38lor] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  width: fit-content;
  max-width: 100%;
  gap: 4px;
  padding: 4px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 999px;
  background: #f8fafc;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
  min-width: 0;
  flex-wrap: wrap;
}

  /* NavLink renders an anchor from inside another component, so ::deep is required. */
  .companies-users-tabs[b-gdbvp38lor]  a.companies-users-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    min-width: 150px;
    padding: 0 18px;
    border-radius: 999px;
    color: var(--text-600, #475569);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
  }

    .companies-users-tabs[b-gdbvp38lor]  a.companies-users-tab:hover {
      color: #1d3a6d;
      background: rgba(37, 99, 235, 0.06);
      text-decoration: none;
    }

    .companies-users-tabs[b-gdbvp38lor]  a.companies-users-tab.active {
      background: #fff;
      color: #1d4ed8;
      box-shadow: 0 1px 5px rgba(15, 23, 42, 0.12);
    }

    .companies-users-tabs[b-gdbvp38lor]  a.companies-users-tab:focus-visible {
      outline: none;
      box-shadow: var(--focus-ring);
    }

/* =========================================================
   Summary cards
   ========================================================= */

.companies-summary-strip[b-gdbvp38lor] {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.companies-summary-card[b-gdbvp38lor] {
  min-width: 0;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid var(--border-200, rgba(25, 35, 68, 0.12));
  border-radius: 13px;
  box-shadow: var(--shadow-1, 0 1px 4px rgba(15, 23, 42, 0.08));
}

.companies-summary-card-button[b-gdbvp38lor] {
  appearance: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

  .companies-summary-card-button:hover[b-gdbvp38lor] {
    border-color: rgba(29, 58, 109, 0.18);
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.06);
  }

  .companies-summary-card-button.is-active[b-gdbvp38lor] {
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.04), 0 3px 10px rgba(15, 23, 42, 0.06);
  }

  .companies-summary-card-button:focus-visible[b-gdbvp38lor] {
    outline: none;
    box-shadow: var(--focus-ring);
  }

.companies-summary-label[b-gdbvp38lor] {
  margin: 0 0 6px;
  overflow: hidden;
  color: var(--text-600, #475569);
  font-size: 13.5px;
  line-height: 1.3;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.companies-summary-value[b-gdbvp38lor] {
  margin: 0;
  color: var(--text-900, #0f172a);
  font-size: 21px;
  line-height: 1;
  font-weight: 800;
}

.companies-summary-meta[b-gdbvp38lor] {
  margin-top: 5px;
  overflow: hidden;
  color: var(--text-500, #64748b);
  font-size: 12px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.companies-summary-card--neutral[b-gdbvp38lor] {
  border-color: rgba(117, 140, 167, 0.22);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.035), #fff);
}

.companies-summary-card--info[b-gdbvp38lor] {
  border-color: rgba(117, 140, 167, 0.24);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.04), #fff);
}

.companies-summary-card--success[b-gdbvp38lor] {
  border-color: rgba(91, 196, 191, 0.38);
  background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.companies-summary-card--warning[b-gdbvp38lor] {
  border-color: rgba(250, 169, 75, 0.32);
  background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

.companies-summary-card--neutral.is-active[b-gdbvp38lor] {
  border-color: rgba(117, 140, 167, 0.34);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.08), #fff);
}

.companies-summary-card--info.is-active[b-gdbvp38lor] {
  border-color: rgba(117, 140, 167, 0.34);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.08), #fff);
}

.companies-summary-card--success.is-active[b-gdbvp38lor] {
  border-color: rgba(91, 196, 191, 0.48);
  background: linear-gradient(180deg, rgba(91, 196, 191, 0.10), #fff);
}

.companies-summary-card--warning.is-active[b-gdbvp38lor] {
  border-color: rgba(250, 169, 75, 0.42);
  background: linear-gradient(180deg, rgba(250, 169, 75, 0.10), #fff);
}

/* =========================================================
   Shared card shell
   ========================================================= */

.companies-card[b-gdbvp38lor] {
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-200);
  border-radius: 18px;
  /*box-shadow: var(--shadow-1);*/
  overflow: hidden;
}

.companies-card-title[b-gdbvp38lor] {
  margin: 0;
  color: var(--text-900, #0f172a);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
}

.companies-card-subtitle[b-gdbvp38lor] {
  margin: 4px 0 0;
  color: var(--text-500, #64748b);
  font-size: 13px;
  line-height: 1.35;
}

/* =========================================================
   Company list card
   ========================================================= */

.companies-list-section[b-gdbvp38lor] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.companies-manage-card[b-gdbvp38lor] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.companies-panel-header[b-gdbvp38lor] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 12px 8px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.companies-panel-header-copy[b-gdbvp38lor] {
  min-width: 0;
  flex: 1 1 auto;
}

.companies-panel-header-actions[b-gdbvp38lor] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.companies-access-body[b-gdbvp38lor] {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  overflow: hidden;
  margin-bottom: 0;
  padding: 0;
}

.companies-state[b-gdbvp38lor] {
  padding: 18px 16px;
  color: var(--text-600);
}

/* =========================================================
   Controls
   ========================================================= */

.companies-controls[b-gdbvp38lor] {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(320px, 1fr) 170px 170px 108px;
  gap: 10px;
  align-items: end;
  padding: 14px 12px 10px;
  margin-bottom: 0;
  flex: 0 0 auto;
}

.companies-control[b-gdbvp38lor] {
  min-width: 0;
}

.companies-control-label[b-gdbvp38lor] {
  display: block;
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-700, #334155);
}

.companies-search[b-gdbvp38lor],
.companies-select[b-gdbvp38lor],
.companies-page-size[b-gdbvp38lor] {
  width: 100%;
  min-height: 38px;
}

.companies-page-size[b-gdbvp38lor] {
  min-width: 108px;
}

.companies-select[b-gdbvp38lor] {
  min-width: 0;
}

/* =========================================================
   Table shell
   ========================================================= */

.companies-table-region[b-gdbvp38lor] {
  min-height: 0;
  height: 100%;
  margin: 0 12px 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 10px;
}

.companies-table-wrap[b-gdbvp38lor] {
  min-height: 0;
  position: relative;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  background: #ffffff;
}

.companies-table[b-gdbvp38lor] {
  width: 100%;
  margin: 0;
  min-width: 1060px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.82rem;
}

  .companies-table thead th[b-gdbvp38lor] {
    position: sticky;
    top: 0;
    z-index: 12;
    padding: 0.58rem 0.55rem;
    border-bottom: 0;
    background: #ffffff;
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.035em;
    text-transform: uppercase;
    white-space: nowrap;
    box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
  }

  .companies-table tbody td[b-gdbvp38lor] {
    padding: 0.56rem 0.55rem;
    vertical-align: middle;
    border-bottom: 1px solid #edf2f7;
    background: #ffffff;
    color: var(--text-900, #0f172a);
    font-size: 0.82rem;
    line-height: 1.35;
  }

  .companies-table tbody tr:hover td[b-gdbvp38lor] {
    background: #fbfdff;
  }

  /* Align table content with the filter row and pager inset. */
  .companies-table thead th:first-child[b-gdbvp38lor],
  .companies-table tbody td:first-child[b-gdbvp38lor] {
    padding-left: 12px;
  }

  .companies-table thead th:last-child[b-gdbvp38lor],
  .companies-table tbody td:last-child[b-gdbvp38lor] {
    padding-right: 12px;
  }

/* =========================================================
   Sort controls
   ========================================================= */

.companies-sort-button[b-gdbvp38lor] {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
  white-space: nowrap;
}

  .companies-sort-button:hover[b-gdbvp38lor],
  .companies-sort-button--active[b-gdbvp38lor] {
    color: #2563eb;
  }

.companies-sort-indicator[b-gdbvp38lor] {
  font-size: 0.72rem;
  line-height: 1;
}

/* =========================================================
   Column sizing / behavior
   ---------------------------------------------------------
   Company table waits until 980px before horizontal scroll.
   Company name stays flexible while utility columns remain
   compact and predictable.
   ========================================================= */

.companies-company-col[b-gdbvp38lor] {
  width: auto;
  min-width: 180px;
}

.companies-type-col[b-gdbvp38lor] {
  width: 128px;
  min-width: 120px;
}

.companies-users-col[b-gdbvp38lor] {
  width: 96px;
  min-width: 90px;
}

.companies-city-col[b-gdbvp38lor] {
  width: 130px;
  min-width: 100px;
}

.companies-state-col[b-gdbvp38lor] {
  width: 64px;
  min-width: 60px;
}

.companies-status-col[b-gdbvp38lor] {
  width: 112px;
  min-width: 104px;
}

.companies-created-col[b-gdbvp38lor] {
  width: 128px;
  min-width: 120px;
}

.companies-actions-col[b-gdbvp38lor] {
  width: 176px;
  min-width: 176px;
  max-width: 176px;
}

.companies-table th[b-gdbvp38lor],
.companies-table td[b-gdbvp38lor] {
  overflow: hidden;
}

  .companies-table td.companies-type-col[b-gdbvp38lor],
  .companies-table td.companies-users-col[b-gdbvp38lor],
  .companies-table td.companies-state-col[b-gdbvp38lor],
  .companies-table td.companies-status-col[b-gdbvp38lor],
  .companies-table td.companies-created-col[b-gdbvp38lor],
  .companies-table td.companies-actions-col[b-gdbvp38lor] {
    white-space: nowrap;
  }

  .companies-table td.companies-company-col[b-gdbvp38lor],
  .companies-table td.companies-city-col[b-gdbvp38lor] {
    white-space: normal;
  }

  /* Actions column is pinned to the right edge of the table scroll viewport.
   The sticky cell stays neutral; the inner action zone owns emphasis. */
  .companies-table th.companies-actions-col[b-gdbvp38lor],
  .companies-table td.companies-actions-col[b-gdbvp38lor] {
    position: sticky;
    right: 0;
    z-index: 10;
    padding-left: 0.64rem;
    padding-right: 0.64rem;
    text-align: left;
    white-space: nowrap;
    background: #ffffff;
    background-clip: padding-box;
    box-shadow: none;
  }

.companies-table thead th.companies-actions-col[b-gdbvp38lor] {
  z-index: 18;
  background: #ffffff;
  color: #64748b;
  box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
}

.companies-table tbody tr:hover td.companies-actions-col[b-gdbvp38lor] {
  background: #fbfdff;
}

/* Inline action links use compact spacing because this column has three actions. */
.companies-page .ua-inline-actions[b-gdbvp38lor] {
  width: 100%;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0 6px;
  border-radius: 7px;
  background: #f3f6fb;
  box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.82);
  flex-wrap: nowrap;
  white-space: nowrap;
  transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.companies-table tbody tr:hover .ua-inline-actions[b-gdbvp38lor] {
  background: #edf4ff;
  box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.68);
}

/* Action buttons render as text links, not browser-default buttons. */
.companies-page .ua-inline-action[b-gdbvp38lor] {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--link-600, #2563eb); /* standard blue action link */
  text-decoration: none;
  cursor: pointer;
}

  /* Simple underline affordance, consistent with Products actions. */
  .companies-page .ua-inline-action:hover[b-gdbvp38lor] {
    color: #1d4ed8;
    text-decoration: underline;
  }

  /* Keyboard focus keeps the link style without adding button chrome. */
  .companies-page .ua-inline-action:focus-visible[b-gdbvp38lor] {
    outline: none;
    text-decoration: underline;
    border-radius: 4px;
  }

/* Destructive action matches Products deactivate styling. */
.companies-page .ua-inline-action-danger[b-gdbvp38lor] {
  color: #dc2626; /* red destructive action */
}

/* Dot separator keeps action links readable without taking extra width. */
.companies-page .ua-action-sep[b-gdbvp38lor] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 5px;
  color: rgba(100, 116, 139, 0.62);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  pointer-events: none;
  user-select: none;
}

/* =========================================================
   Row content
   ========================================================= */

.companies-users-compact[b-gdbvp38lor] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  white-space: nowrap;
}

.companies-users-active[b-gdbvp38lor] {
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--text-900);
}

/* Active user count is a button for company-filter navigation,
   but should visually remain compact table text. */
.companies-users-active-link[b-gdbvp38lor] {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  box-shadow: none;
  color: var(--text-900);
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

  .companies-users-active-link:hover[b-gdbvp38lor] {
    color: #1d4ed8;
    text-decoration: underline;
  }

  .companies-users-active-link:focus[b-gdbvp38lor] {
    outline: none;
    box-shadow: none;
  }

  .companies-users-active-link:focus-visible[b-gdbvp38lor] {
    outline: 2px solid rgba(37, 99, 235, 0.35);
    outline-offset: 2px;
    color: #1d4ed8;
    text-decoration: underline;
  }

.companies-users-info[b-gdbvp38lor] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 1px solid rgba(37, 99, 235, 0.35);
  background: rgba(37, 99, 235, 0.08);
  color: #2563eb;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  cursor: help;
  user-select: none;
}

.companies-users-tooltip-lines[b-gdbvp38lor] {
  display: grid;
  gap: 2px;
  white-space: nowrap;
}

  .companies-users-info:focus-visible[b-gdbvp38lor] {
    outline: 2px solid rgba(37, 99, 235, 0.35);
    outline-offset: 2px;
  }

.companies-users-trigger:focus-visible[b-gdbvp38lor] {
  outline: none;
}

  .companies-users-trigger:focus-visible .companies-users-total[b-gdbvp38lor] {
    text-decoration: underline;
  }

.companies-empty[b-gdbvp38lor] {
  text-align: center;
  color: var(--text-500, #667085);
  padding: 2rem 1rem !important;
}

.companies-company-text[b-gdbvp38lor],
.companies-city-text[b-gdbvp38lor] {
  max-width: 100%;
  line-height: 1.3;
  vertical-align: middle;
}

.companies-company-text[b-gdbvp38lor] {
  display: -webkit-box;
  overflow: hidden;
  color: var(--text-900, #0f172a);
  font-size: 13.5px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: normal;
  overflow-wrap: anywhere;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.companies-table-tooltip-cell[b-gdbvp38lor] {
  position: relative;
  display: block;
  min-width: 0;
  max-width: 100%;
}

.companies-city-text[b-gdbvp38lor] {
  display: inline-block;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.companies-state-text[b-gdbvp38lor],
.companies-created-text[b-gdbvp38lor] {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}

.companies-state-text[b-gdbvp38lor] {
  min-width: 24px;
  text-align: left;
}

.companies-created-text[b-gdbvp38lor] {
  color: var(--text-700, #334155);
  font-size: 12px;
  line-height: 1.25;
}

.companies-field-error[b-gdbvp38lor] {
  margin-top: 0.2rem;
  color: #b5474f;
  font-size: 0.82rem;
  line-height: 1.2;
}

/* =========================================================
   Company status and type badges
   ========================================================= */

/* Company status badge base */
.companies-status-badge[b-gdbvp38lor] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  min-width: 70px;
  padding: 0 2px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.companies-status-badge--active[b-gdbvp38lor] {
  background: rgba(91, 196, 191, 0.18); /* soft teal status background */
  color: #206a66; /* dark teal status text */
}

.companies-status-badge--inactive[b-gdbvp38lor] {
  background: rgba(241, 95, 87, 0.14); /* soft red status background */
  color: #9d423c; /* muted red status text */
}

.companies-type-badge[b-gdbvp38lor] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  min-width: 100px;
  padding: 0 2px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

/* WAM type - navy executive/company-owner category. */
.companies-type-badge--wam[b-gdbvp38lor] {
  background: #e0e7ff; /* soft navy-indigo type background */
  color: #1e1b4b; /* deep navy type text */
}

/* Manufacturer type - muted purple production/vendor category. */
.companies-type-badge--manufacturer[b-gdbvp38lor] {
  background: #ede9fe; /* soft purple type background */
  color: #4c1d95; /* deep purple type text */
}

/* Distributor type - steel blue logistics/channel category. */
.companies-type-badge--distributor[b-gdbvp38lor] {
  background: #e2e8f0; /* soft steel blue-gray type background */
  color: #334155; /* slate type text */
}

/* Broker type - muted brown intermediary/category label. */
.companies-type-badge--broker[b-gdbvp38lor] {
  background: #f1e7dc; /* soft taupe type background */
  color: #6b3f1d; /* muted brown type text */
}

/* Default type - neutral fallback for unexpected company type values. */
.companies-type-badge--default[b-gdbvp38lor] {
  background: #f1f5f9; /* neutral fallback background */
  color: #475569; /* neutral fallback text */
}

/* =========================================================
   Pager
   ========================================================= */

.companies-pager[b-gdbvp38lor] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 6px 14px 4px;
  background: #f8fafc;
  border-top: 1px solid rgba(25, 35, 68, 0.06);
  flex-wrap: wrap;
}

.companies-pager-meta[b-gdbvp38lor] {
  font-size: 12px;
  color: var(--text-600);
}

.companies-pager-actions[b-gdbvp38lor] {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.companies-pager-page[b-gdbvp38lor] {
  min-width: 88px;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-700, #334155);
}

/* =========================================================
   Modal shell
   ========================================================= */

.companies-modal-backdrop[b-gdbvp38lor] {
  position: fixed;
  inset: 0;
  z-index: 1040;
  background: rgba(15, 23, 42, 0.35);
}

.companies-modal[b-gdbvp38lor] {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.companies-modal-card[b-gdbvp38lor] {
  width: min(980px, calc(100vw - 2rem));
  max-height: calc(100vh - 2rem);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.22);
  border: 1px solid rgba(25, 35, 68, 0.08);
}

.companies-modal-header[b-gdbvp38lor] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px 10px;
  border-bottom: 1px solid var(--border-200);
}

.companies-modal-title[b-gdbvp38lor] {
  font-size: 15px;
  font-weight: 600;
  color: var(--text-900);
}

.companies-modal-body[b-gdbvp38lor] {
  overflow: auto;
  padding: 16px 18px 14px;
}

.companies-modal-footer[b-gdbvp38lor] {
  margin-top: 16px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

/* Detail modal subtitle shown below the modal title. */
.companies-modal-subtitle[b-gdbvp38lor] {
  margin-top: 3px;
  font-size: 12px;
  color: var(--text-500);
}

/* Detail modal uses a narrower shell than the edit form modal. */
.companies-modal-card--details[b-gdbvp38lor] {
  width: min(860px, calc(100vw - 2rem));
}

/* Company detail fields use the same two-column pattern as Products detail. */
.companies-detail-grid[b-gdbvp38lor] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 18px;
}

.companies-detail-item[b-gdbvp38lor] {
  min-width: 0;
}

.companies-detail-item--full[b-gdbvp38lor] {
  grid-column: 1 / -1;
}

.companies-detail-label[b-gdbvp38lor] {
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--text-500);
}

.companies-detail-value[b-gdbvp38lor] {
  font-size: 14px;
  line-height: 1.45;
  color: var(--text-900);
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Audit section separates record metadata from company information. */
.companies-detail-section-title[b-gdbvp38lor] {
  grid-column: 1 / -1;
  margin-top: 6px;
  padding-top: 14px;
  border-top: 1px solid rgba(25, 35, 68, 0.08);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--text-600);
}

/* Audit values are slightly smaller because they are support metadata. */
.companies-detail-item--audit .companies-detail-value[b-gdbvp38lor] {
  font-size: 13px;
  line-height: 1.45;
  color: var(--text-800);
}

.companies-form-body[b-gdbvp38lor] {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.companies-form-actions[b-gdbvp38lor] {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
}

  .companies-form-actions .btn[b-gdbvp38lor] {
    min-height: 32px;
    padding: 0.24rem 0.72rem;
    font-size: 0.9rem;
    line-height: 1.15;
    border-radius: 0.45rem;
  }

.companies-page .form-label[b-gdbvp38lor] {
  font-weight: 600;
  margin-bottom: 0.25rem;
}

.companies-form-body .row.g-3[b-gdbvp38lor] {
  --bs-gutter-y: 0.7rem;
}

.companies-page .form-control[b-gdbvp38lor],
.companies-page .form-check-input[b-gdbvp38lor],
.companies-page .form-select[b-gdbvp38lor] {
  min-height: 34px;
}

.companies-page .form-check-input[b-gdbvp38lor] {
  min-height: auto;
}

.company-field-label-row[b-gdbvp38lor] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.company-field-meta[b-gdbvp38lor] {
  flex: 0 0 auto;
  font-size: 12px;
  line-height: 1.2;
  color: var(--text-500);
  white-space: nowrap;
  padding-right: 5px;
}

/* =========================================================
   Responsive
   ========================================================= */

@container companies-page (max-width: 960px) {
  .companies-summary-strip[b-gdbvp38lor] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container companies-page (max-width: 980px) {
  .companies-controls[b-gdbvp38lor] {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }

  .companies-page-size[b-gdbvp38lor] {
    width: 100%;
    min-width: 0;
  }
}

@media (max-width: 900px) {
  .companies-panel-header[b-gdbvp38lor] {
    align-items: flex-start;
    flex-direction: column;
  }

  .companies-panel-header-actions[b-gdbvp38lor] {
    width: 100%;
    justify-content: flex-start;
  }
}

@media (max-width: 768px) {
  .companies-table-region[b-gdbvp38lor] {
    margin-left: 10px;
    margin-right: 10px;
  }

  .companies-modal-card[b-gdbvp38lor] {
    width: calc(100vw - 1rem);
    max-height: calc(100vh - 1rem);
  }

  .companies-modal-body[b-gdbvp38lor] {
    padding: 14px 14px 12px;
  }

  /* Detail modal stacks fields on small screens. */
  .companies-detail-grid[b-gdbvp38lor] {
    grid-template-columns: 1fr;
  }

  .companies-modal-footer[b-gdbvp38lor] {
    justify-content: stretch;
  }

    .companies-modal-footer .btn[b-gdbvp38lor] {
      width: 100%;
    }
}

@container companies-page (max-width: 640px) {
  .companies-summary-strip[b-gdbvp38lor] {
    grid-template-columns: 1fr;
  }

  .companies-controls[b-gdbvp38lor] {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .companies-table-region[b-gdbvp38lor] {
    margin-left: 12px;
    margin-right: 12px;
  }

  .companies-pager[b-gdbvp38lor] {
    padding-left: 12px;
    padding-right: 12px;
  }
}
/* /Components/Pages/Admin/CompanyOnboarding.razor.rz.scp.css */
/* =========================================================
   CompanyOnboarding.razor.css
   ---------------------------------------------------------
   Scope:
   - Page shell
   - Wizard card shell
   - Stepper
   - Section headers
   - Company selection
   - Company form
   - Invite defaults summary
   - Add Users tabs
   - Paste / upload / manual user entry
   - Review table
   - Status badges
   - Send summary
   - Footer actions
   - Field metadata
   - Responsive layout
   ========================================================= */


/* =========================================================
   Page shell
   ========================================================= */

.company-onboarding-page[b-kcgyknrac8] {
  flex: 1 1 auto;
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 2px;
  overflow: hidden;
}

.company-onboarding-workspace[b-kcgyknrac8] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow: hidden;
}

.company-onboarding-header[b-kcgyknrac8] {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.company-onboarding-title[b-kcgyknrac8] {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: var(--text-900);
}

.company-onboarding-subtitle[b-kcgyknrac8] {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--text-500);
}

.company-onboarding-header-actions[b-kcgyknrac8] {
  flex: 0 0 auto;
}

.company-onboarding-secondary-button[b-kcgyknrac8] {
  min-height: 30px;
  padding: 4px 14px;
  font-size: 14px;
  border-radius: 8px;
  font-weight: 600;
}


/* =========================================================
   Wizard card shell
   ========================================================= */

.company-onboarding-card[b-kcgyknrac8] {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  background: #fff;
  border: 1px solid var(--border-200);
  border-radius: 18px;
  overflow: hidden;
}

.company-onboarding-body[b-kcgyknrac8] {
  min-height: 0;
  overflow: auto;
  padding: 18px;
}

.company-onboarding-section[b-kcgyknrac8] {
  max-width: 1180px;
}


/* =========================================================
   Stepper
   ========================================================= */

.company-onboarding-stepper[b-kcgyknrac8] {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
  background: #f8fafc;
}

.company-onboarding-step[b-kcgyknrac8] {
  appearance: none;
  border: 0;
  border-right: 1px solid rgba(25, 35, 68, 0.08);
  background: transparent;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  text-align: left;
  color: var(--text-600);
  cursor: pointer;
}

  .company-onboarding-step:last-child[b-kcgyknrac8] {
    border-right: 0;
  }

  .company-onboarding-step.is-active[b-kcgyknrac8] {
    background: #fff;
    color: var(--text-900);
    box-shadow: inset 0 -2px 0 #1d4ed8;
  }

  .company-onboarding-step.is-complete[b-kcgyknrac8] {
    color: #206a66;
  }

.company-onboarding-step-number[b-kcgyknrac8] {
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #e2e8f0;
  font-size: 12px;
  font-weight: 700;
}

.company-onboarding-step.is-active .company-onboarding-step-number[b-kcgyknrac8] {
  background: #dbeafe;
  color: #1d4ed8;
}

.company-onboarding-step.is-complete .company-onboarding-step-number[b-kcgyknrac8] {
  background: rgba(91, 196, 191, 0.18);
  color: #206a66;
}

.company-onboarding-step-text[b-kcgyknrac8] {
  min-width: 0;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
}


/* =========================================================
   Section headers
   ========================================================= */

.company-onboarding-section-header[b-kcgyknrac8] {
  margin-bottom: 16px;
}

  .company-onboarding-section-header h2[b-kcgyknrac8] {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--text-900);
  }

  .company-onboarding-section-header p[b-kcgyknrac8] {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--text-500);
  }


/* =========================================================
   Company selection
   ========================================================= */

.company-onboarding-choice-grid[b-kcgyknrac8] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.company-onboarding-choice[b-kcgyknrac8] {
  appearance: none;
  border: 1px solid rgba(25, 35, 68, 0.10);
  border-radius: 12px;
  background: #fff;
  padding: 14px 16px;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 4px;
  cursor: pointer;
}

  .company-onboarding-choice.is-selected[b-kcgyknrac8] {
    border-color: rgba(29, 78, 216, 0.38);
    background: linear-gradient(180deg, rgba(219, 234, 254, 0.55), #fff);
    box-shadow: 0 0 0 1px rgba(29, 78, 216, 0.10);
  }

.company-onboarding-choice-title[b-kcgyknrac8] {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-900);
}

.company-onboarding-choice-copy[b-kcgyknrac8] {
  font-size: 13px;
  color: var(--text-500);
}


/* =========================================================
   Company form
   ========================================================= */

.company-onboarding-form-grid[b-kcgyknrac8] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}

.company-onboarding-field[b-kcgyknrac8] {
  min-width: 0;
}

.company-onboarding-field--span-2[b-kcgyknrac8] {
  grid-column: 1 / -1;
}

.company-onboarding-field-error[b-kcgyknrac8] {
  margin-top: 0.25rem;
  color: #b5474f;
  font-size: 0.82rem;
  line-height: 1.2;
}


/* =========================================================
   Field label metadata
   ========================================================= */

.company-field-label-row[b-kcgyknrac8] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.company-field-meta[b-kcgyknrac8] {
  flex: 0 0 auto;
  font-size: 12px;
  line-height: 1.2;
  color: var(--text-500);
  white-space: nowrap;
  padding-right: 5px;
}


/* =========================================================
   Invite defaults summary
   ========================================================= */

.company-onboarding-summary-band[b-kcgyknrac8] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
  padding: 12px 14px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 12px;
  background: #f8fafc;
}

.company-onboarding-summary-label[b-kcgyknrac8] {
  display: block;
  margin-bottom: 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--text-500);
}


/* =========================================================
   Add Users tabs
   ========================================================= */

.company-onboarding-tabs[b-kcgyknrac8] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 12px;
  padding: 4px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 999px;
  background: #f8fafc;
}

.company-onboarding-tab[b-kcgyknrac8] {
  appearance: none;
  border: 0;
  border-radius: 999px;
  background: transparent;
  padding: 6px 14px;
  font-size: 13px;
  font-weight: 700;
  color: var(--text-600);
  cursor: pointer;
}

  .company-onboarding-tab.is-active[b-kcgyknrac8] {
    background: #fff;
    color: #1d4ed8;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.10);
  }


/* =========================================================
   User input header
   ========================================================= */

.company-onboarding-user-input-header[b-kcgyknrac8] {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.company-onboarding-muted[b-kcgyknrac8] {
  margin-top: 2px;
  font-size: 12px;
  color: var(--text-500);
}


/* =========================================================
   Paste Emails input
   ========================================================= */

.company-onboarding-email-paste[b-kcgyknrac8] {
  min-height: 220px;
  resize: vertical;
}


  /* =========================================================
   Placeholder text
   ========================================================= */

  .company-onboarding-email-paste[b-kcgyknrac8]::placeholder,
  .company-onboarding-manual-entry-row input[b-kcgyknrac8]::placeholder {
    color: rgba(100, 116, 139, 0.52);
    font-style: italic;
    font-weight: 400;
  }

  .company-onboarding-email-paste[b-kcgyknrac8]::-webkit-input-placeholder,
  .company-onboarding-manual-entry-row input[b-kcgyknrac8]::-webkit-input-placeholder {
    color: rgba(100, 116, 139, 0.52);
    font-style: italic;
    font-weight: 400;
  }

  .company-onboarding-email-paste[b-kcgyknrac8]::-moz-placeholder,
  .company-onboarding-manual-entry-row input[b-kcgyknrac8]::-moz-placeholder {
    color: rgba(100, 116, 139, 0.52);
    font-style: italic;
    font-weight: 400;
    opacity: 1;
  }


/* =========================================================
   Upload and empty-state panels
   ========================================================= */

.company-onboarding-upload-box[b-kcgyknrac8],
.company-onboarding-placeholder[b-kcgyknrac8],
.company-onboarding-complete-card[b-kcgyknrac8] {
  border: 1px dashed rgba(25, 35, 68, 0.18);
  border-radius: 12px;
  background: #f8fafc;
  padding: 18px;
  color: var(--text-600);
}

.company-onboarding-upload-title[b-kcgyknrac8],
.company-onboarding-complete-title[b-kcgyknrac8] {
  margin-bottom: 4px;
  font-size: 15px;
  font-weight: 700;
  color: var(--text-900);
}

.company-onboarding-upload-copy[b-kcgyknrac8],
.company-onboarding-complete-copy[b-kcgyknrac8] {
  margin-bottom: 12px;
  font-size: 13px;
  color: var(--text-500);
}

.company-onboarding-template-actions[b-kcgyknrac8] {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.company-onboarding-template-warning[b-kcgyknrac8] {
  margin: -4px 0 12px;
  padding: 8px 10px;
  border: 1px solid rgba(250, 169, 75, 0.30);
  border-radius: 8px;
  background: rgba(250, 169, 75, 0.08);
  color: #8a5a12;
  font-size: 12px;
  font-weight: 600;
}


/* =========================================================
   Manual user entry
   ========================================================= */

.company-onboarding-manual-box[b-kcgyknrac8] {
  border: 1px dashed rgba(25, 35, 68, 0.18);
  border-radius: 12px;
  background: #f8fafc;
  padding: 18px;
}

.company-onboarding-manual-entry-row[b-kcgyknrac8] {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 12px;
}

.company-onboarding-manual-list[b-kcgyknrac8] {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.company-onboarding-manual-row[b-kcgyknrac8] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 8px;
  background: #fff;
}

  .company-onboarding-manual-row span[b-kcgyknrac8] {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--text-900);
  }


/* =========================================================
   Review summary
   ========================================================= */

.company-onboarding-preview-summary[b-kcgyknrac8] {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}

  .company-onboarding-preview-summary span[b-kcgyknrac8] {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 9px;
    border-radius: 999px;
    background: #f1f5f9;
    color: var(--text-700);
    font-size: 12px;
    font-weight: 700;
  }


/* =========================================================
   Review table
   ========================================================= */

.company-onboarding-preview-table[b-kcgyknrac8] {
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 12px;
  overflow: hidden;
}

  .company-onboarding-preview-table th[b-kcgyknrac8] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-500);
    background: #f8fafc;
  }


/* =========================================================
   Status badges
   ========================================================= */

.company-onboarding-status-ready[b-kcgyknrac8],
.company-onboarding-status-error[b-kcgyknrac8] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  min-width: 72px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}

.company-onboarding-status-ready[b-kcgyknrac8] {
  background: rgba(91, 196, 191, 0.18);
  color: #206a66;
}

.company-onboarding-status-error[b-kcgyknrac8] {
  background: rgba(241, 95, 87, 0.14);
  color: #9d423c;
}

.company-onboarding-status-warning[b-kcgyknrac8] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  min-width: 72px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: rgba(245, 158, 11, 0.16);
  color: #92400e;
}

.company-onboarding-status-sent[b-kcgyknrac8] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  min-width: 72px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: rgba(59, 130, 246, 0.14);
  color: #1d4ed8;
}


/* =========================================================
   Send summary
   ========================================================= */

.company-onboarding-send-summary-grid[b-kcgyknrac8] {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

  .company-onboarding-send-summary-grid > div[b-kcgyknrac8] {
    padding: 10px 12px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #fff;
  }


/* =========================================================
   Footer actions
   ========================================================= */

.company-onboarding-footer[b-kcgyknrac8] {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border-top: 1px solid rgba(25, 35, 68, 0.08);
  background: #f8fafc;
}

.company-onboarding-footer-spacer[b-kcgyknrac8] {
  flex: 1 1 auto;
}


/* =========================================================
   Responsive layout
   ========================================================= */

@media (max-width: 900px) {
  .company-onboarding-send-summary-grid[b-kcgyknrac8] {
    grid-template-columns: 1fr;
  }

  .company-onboarding-stepper[b-kcgyknrac8],
  .company-onboarding-choice-grid[b-kcgyknrac8],
  .company-onboarding-form-grid[b-kcgyknrac8],
  .company-onboarding-summary-band[b-kcgyknrac8] {
    grid-template-columns: 1fr;
  }

  .company-onboarding-step[b-kcgyknrac8] {
    border-right: 0;
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
  }
}

@media (max-width: 700px) {
  .company-onboarding-manual-entry-row[b-kcgyknrac8] {
    grid-template-columns: 1fr;
  }

  .company-onboarding-manual-row[b-kcgyknrac8] {
    align-items: flex-start;
    flex-direction: column;
  }
}
/* /Components/Pages/Admin/DistributorPricingDetail.razor.rz.scp.css */
/* Admin Distributor Pricing Review */
/* ---------------------------------------------------------
   Provides WAM Admin-only pricing review workflow styling.
   Shared detail layout rules remain in
   DistributorPricingDetailShared.razor.css.
   --------------------------------------------------------- */

.admin-pricing-review-page-host[b-relqsr78qc] {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* WAM Review projected card shell */

.admin-pricing-review-card[b-relqsr78qc] {
    flex: 0 0 auto;
    background: var(--bg-surface);
    border: 1px solid var(--border-200);
    border-radius: var(--radius-2);
    box-shadow: var(--shadow-1);
    overflow: hidden;
    margin-bottom: 6px;
}

.admin-pricing-review-card-header[b-relqsr78qc] {
    padding: 7px 14px 6px;
    border-bottom: 1px solid var(--border-200);
}

.admin-pricing-review-card-header-split[b-relqsr78qc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.admin-pricing-review-card-title[b-relqsr78qc] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-900);
}

.admin-pricing-review-card-body[b-relqsr78qc] {
    padding: 7px 14px 8px;
}

/* WAM Review header and content layout */
/* ---------------------------------------------------------
   Controls the projected WAM Review heading, field grid,
   review text areas, and supporting guidance.
   --------------------------------------------------------- */

.admin-pricing-review-title-block[b-relqsr78qc] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.admin-pricing-review-helper[b-relqsr78qc] {
    font-size: 12px;
    line-height: 1.2;
    color: var(--text-600);
}

.admin-pricing-review-grid[b-relqsr78qc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
}

.admin-pricing-review-field[b-relqsr78qc] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

    .admin-pricing-review-field .form-label[b-relqsr78qc] {
        margin-bottom: 3px;
    }

.admin-pricing-review-page-host[b-relqsr78qc]  textarea.admin-pricing-review-textarea,
.admin-pricing-review-card--review textarea.admin-pricing-review-textarea[b-relqsr78qc] {
    min-height: 32px !important;
    height: 32px;
    max-height: none;
    line-height: 1.15 !important;
    padding: 5px 10px !important;
    resize: vertical;
    overflow-y: auto;
    box-sizing: border-box;
}

.admin-pricing-review-helper-text[b-relqsr78qc] {
    margin-top: 4px;
    color: var(--text-500);
    font-size: 11px;
    line-height: 1.25;
}

/* WAM Review actions */
/* ---------------------------------------------------------
   Aligns Return for Correction and Mark Complete actions
   inside the projected review card header.
   --------------------------------------------------------- */

.admin-pricing-review-actions[b-relqsr78qc] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.admin-pricing-review-actions--header[b-relqsr78qc] {
    align-items: center;
    margin-top: 0;
}

.admin-pricing-review-actions .btn[b-relqsr78qc] {
    min-height: 30px;
    padding: 4px 14px;
    font-size: 14px;
    line-height: 1.15;
    border-radius: 8px;
}

    .admin-pricing-review-actions .btn:disabled[b-relqsr78qc] {
        cursor: not-allowed;
        opacity: 0.55;
    }

/* WAM Review emphasis */
/* ---------------------------------------------------------
   Applies the restrained review-state border and header treatment.
   --------------------------------------------------------- */

.admin-pricing-review-card--review[b-relqsr78qc] {
    border-color: rgba(234, 179, 8, 0.16);
}

    .admin-pricing-review-card--review .admin-pricing-review-card-header[b-relqsr78qc] {
        background: rgba(234, 179, 8, 0.07);
        border-bottom: 1px solid rgba(234, 179, 8, 0.14);
    }

/* Responsive behavior */
/* ---------------------------------------------------------
   Stacks review fields and preserves compact review controls
   for narrower workspaces.
   --------------------------------------------------------- */

@media (max-width: 992px) {
    .admin-pricing-review-card-header[b-relqsr78qc] {
        padding: 8px 12px 7px;
    }

    .admin-pricing-review-card-body[b-relqsr78qc] {
        padding: 9px 12px 10px;
    }

    .admin-pricing-review-grid[b-relqsr78qc] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .admin-pricing-review-page-host[b-relqsr78qc]  textarea.admin-pricing-review-textarea,
    .admin-pricing-review-card--review textarea.admin-pricing-review-textarea[b-relqsr78qc] {
        min-height: 32px !important;
        height: 32px;
    }

    .admin-pricing-review-actions--header[b-relqsr78qc] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* /Components/Pages/Admin/DistributorPricingQueue.razor.rz.scp.css */
/* =========================================================
   Admin Distributor Pricing Queue
   ---------------------------------------------------------
   Queue layout is maintained by:
   Components/Shared/Promotions/DistributorPricingQueueShared.razor.css

   This file remains available for Admin-page-only overrides.
   Add styles here only when behavior or layout is unique to:
   Pages/Admin/DistributorPricingQueue.razor
   ========================================================= */
/* /Components/Pages/Admin/Products.razor.rz.scp.css */
/* Admin Products page host */
/* ---------------------------------------------------------
   Provides the page-scoped height and overflow host required for
   ProductsShared to own internal table scrolling and keep pagination
   anchored above the application footer.

   This rule remains in Admin/Products.razor.css because
   .products-page-host is rendered by Admin/Products.razor and Blazor
   CSS isolation applies only to markup from the matching component.
   --------------------------------------------------------- */

.products-page-host[b-209mxzdlk3] {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-top: 5px;
}

    .products-page-host > *[b-209mxzdlk3] {
        flex: 1 1 auto;
        min-height: 0;
    }

/* Admin Distributor Product Settings modal */
/* ---------------------------------------------------------
   Styles the Distributor Product Settings workflow rendered directly
   by Admin/Products.razor. These rules remain page-scoped because
   ProductsShared.razor.css isolation does not apply to this markup.
   --------------------------------------------------------- */

.products-modal-backdrop[b-209mxzdlk3] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.42);
    z-index: 12400;
}

.products-modal-shell[b-209mxzdlk3] {
    position: fixed;
    inset: 0;
    z-index: 12410;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px 24px;
}

.products-modal-card[b-209mxzdlk3] {
    width: min(920px, calc(100vw - 64px));
    max-height: calc(100vh - 48px);
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--border-200, rgba(25, 35, 68, 0.12));
    border-radius: 20px;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.20);
    overflow: hidden;
}

.products-modal-header[b-209mxzdlk3] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px 12px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.products-modal-title[b-209mxzdlk3] {
    margin: 0;
    color: var(--text-900, #0f172a);
    font-size: 22px;
    line-height: 1.15;
    font-weight: 700;
}

.products-modal-subtitle[b-209mxzdlk3] {
    margin: 4px 0 0;
    color: var(--text-500, #64748b);
    font-size: 13px;
    line-height: 1.35;
}

.products-modal-body[b-209mxzdlk3] {
    flex: 1 1 auto;
    min-height: 0;
    padding: 16px 20px;
    overflow-y: auto;
    overflow-x: hidden;
}

.products-modal-footer[b-209mxzdlk3] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 12px 20px 16px;
    border-top: 1px solid rgba(25, 35, 68, 0.07);
    background: #fff;
}

/* Product context summary */
/* ---------------------------------------------------------
   Displays the selected Product image, Manufacturer, and UPC
   context inside Distributor Product Settings.
   --------------------------------------------------------- */

.products-book-assets-product-summary[b-209mxzdlk3] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px;
    border: 1px solid rgba(25, 35, 68, 0.10);
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.92), #fff);
}

.products-book-assets-product-image[b-209mxzdlk3] {
    flex: 0 0 auto;
    width: 72px;
    height: 72px;
}

.products-book-assets-product-empty[b-209mxzdlk3] {
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    border: 1px dashed var(--border-300, rgba(25, 35, 68, 0.16));
    border-radius: 12px;
    background: #f8fafc;
    color: var(--text-500, #64748b);
    font-size: 11px;
    text-align: center;
}

.products-book-assets-product-copy[b-209mxzdlk3] {
    min-width: 0;
    flex: 1 1 auto;
}

.products-book-assets-product-kicker[b-209mxzdlk3] {
    color: var(--text-500, #64748b);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.products-book-assets-product-title[b-209mxzdlk3] {
    margin-top: 3px;
    color: var(--text-900, #0f172a);
    font-size: 15px;
    line-height: 1.25;
    font-weight: 700;
}

.products-book-assets-product-meta[b-209mxzdlk3] {
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    color: var(--text-600, #475569);
    font-size: 12px;
    line-height: 1.35;
}

/* Distributor setting audit details */
/* ---------------------------------------------------------
   Displays the current participation default, Distributor Item #,
   and latest update metadata.
   --------------------------------------------------------- */

.products-detail-audit-strip[b-209mxzdlk3] {
    padding: 10px 12px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 14px;
    background: #f8fafc;
}

.products-detail-audit-grid[b-209mxzdlk3] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px 14px;
}

    .products-detail-audit-grid span[b-209mxzdlk3] {
        display: block;
        color: var(--text-500, #64748b);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.03em;
        text-transform: uppercase;
    }

    .products-detail-audit-grid strong[b-209mxzdlk3] {
        display: block;
        margin-top: 2px;
        color: var(--text-800, #1f2937);
        font-size: 12.5px;
        line-height: 1.3;
        font-weight: 600;
        word-break: break-word;
    }

/* Responsive modal behavior */
/* ---------------------------------------------------------
   Adapts the Distributor Product Settings modal and audit grid
   for narrower browser viewports.
   --------------------------------------------------------- */

@media (max-width: 760px) {
    .products-modal-shell[b-209mxzdlk3] {
        align-items: stretch;
        padding: 12px;
    }

    .products-modal-card[b-209mxzdlk3] {
        width: 100%;
        max-height: calc(100vh - 24px);
    }

    .products-book-assets-product-summary[b-209mxzdlk3] {
        align-items: flex-start;
    }

    .products-detail-audit-grid[b-209mxzdlk3] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* /Components/Pages/Admin/PromotionCycles.razor.rz.scp.css */
/* PromotionCycles.razor.css */
/* ---------------------------------------------------------
   Controls the WAM Admin Promotion Cycles list, calendar,
   filters, workflow-date forms, modals, and responsive layout.
   The fixed-height workspace keeps table and calendar scrolling
   inside their respective content regions.
   --------------------------------------------------------- */

/* Page shell */
/* ---------------------------------------------------------
   Fills the shared application content area and responds to the
   available width after sidebar expansion or collapse.
   --------------------------------------------------------- */

.promotion-cycles-page[b-g7ftbvxern] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 2px;
    overflow: hidden;
    container-type: inline-size;
    container-name: promotion-cycles-page;
}

.promotion-cycles-workspace[b-g7ftbvxern] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow: hidden;
}

/* Promotion Cycle summary cards */
/* ---------------------------------------------------------
   Provides compact operational totals aligned with shared WAM
   Admin dashboard and Books presentation patterns.
   --------------------------------------------------------- */

.promotion-cycles-stat-grid[b-g7ftbvxern] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.promotion-cycles-stat-card[b-g7ftbvxern] {
    min-width: 0;
    padding: 8px 10px;
    background: #fff;
    border: 1px solid var(--border-200);
    border-radius: 13px;
    box-shadow: var(--shadow-1);
}

.promotion-cycles-stat-card-button[b-g7ftbvxern] {
    appearance: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

    .promotion-cycles-stat-card-button:hover[b-g7ftbvxern] {
        border-color: rgba(29, 58, 109, 0.18);
        box-shadow: 0 3px 10px rgba(15, 23, 42, 0.06);
    }

    .promotion-cycles-stat-card-button.is-active[b-g7ftbvxern] {
        box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.04), 0 3px 10px rgba(15, 23, 42, 0.06);
    }

    .promotion-cycles-stat-card-button:focus-visible[b-g7ftbvxern] {
        outline: none;
        box-shadow: var(--focus-ring);
    }

.promotion-cycles-stat-label[b-g7ftbvxern] {
    margin: 0 0 6px;
    overflow: hidden;
    color: var(--text-600);
    font-size: 13.5px;
    line-height: 1.3;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotion-cycles-stat-value[b-g7ftbvxern] {
    margin: 0;
    color: var(--text-900);
    font-size: 21px;
    line-height: 1;
    font-weight: 800;
}

.promotion-cycles-stat-meta[b-g7ftbvxern] {
    margin-top: 5px;
    overflow: hidden;
    color: var(--text-500);
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotion-cycles-stat-card--success[b-g7ftbvxern] {
    border-color: rgba(91, 196, 191, 0.38);
    background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.promotion-cycles-stat-card--warning[b-g7ftbvxern] {
    border-color: rgba(250, 169, 75, 0.32);
    background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

.promotion-cycles-stat-card--info[b-g7ftbvxern] {
    border-color: rgba(117, 140, 167, 0.24);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.04), #fff);
}

.promotion-cycles-stat-card--neutral[b-g7ftbvxern] {
    border-color: rgba(117, 140, 167, 0.22);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.035), #fff);
}

    .promotion-cycles-stat-card--neutral.is-active[b-g7ftbvxern],
    .promotion-cycles-stat-card--info.is-active[b-g7ftbvxern] {
        border-color: rgba(117, 140, 167, 0.34);
        background: linear-gradient(180deg, rgba(117, 140, 167, 0.08), #fff);
    }

.promotion-cycles-stat-card--success.is-active[b-g7ftbvxern] {
    border-color: rgba(91, 196, 191, 0.48);
    background: linear-gradient(180deg, rgba(91, 196, 191, 0.10), #fff);
}

.promotion-cycles-stat-card--warning.is-active[b-g7ftbvxern] {
    border-color: rgba(250, 169, 75, 0.42);
    background: linear-gradient(180deg, rgba(250, 169, 75, 0.10), #fff);
}

/* Promotion Cycle list workspace */
/* ---------------------------------------------------------
   Keeps the header, filters, table region, and pager stable so
   the page does not become the primary scrolling surface.
   --------------------------------------------------------- */

.promotion-cycles-list-card[b-g7ftbvxern] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--border-200);
    border-radius: 18px;
    overflow: hidden;
}

.promotion-cycles-panel-header[b-g7ftbvxern] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 12px 12px 8px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.promotion-cycles-header-copy[b-g7ftbvxern] {
    min-width: 0;
    flex: 1 1 auto;
}

.promotion-cycles-header-actions[b-g7ftbvxern] {
    display: contents;
}

.promotion-cycles-header-right-actions[b-g7ftbvxern] {
    grid-column: 3;
    justify-self: end;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.promotion-cycles-panel-title[b-g7ftbvxern] {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--text-900);
}

.promotion-cycles-panel-subtitle[b-g7ftbvxern] {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--text-500);
}

.promotion-cycles-primary-button[b-g7ftbvxern] {
    grid-column: 3;
    justify-self: end;
    min-width: 150px;
    min-height: 30px;
    padding: 4px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
}

.promotion-cycles-primary-button[b-g7ftbvxern] {
    min-width: 150px;
    min-height: 30px;
    padding: 4px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
}

.promotion-cycles-list-body[b-g7ftbvxern] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    margin-bottom: 0;
    padding: 0;
}

.promotion-cycles-list-body--calendar[b-g7ftbvxern] {
    grid-template-rows: minmax(0, 1fr);
    margin-bottom: 0;
    padding-bottom: 0;
}

/* List and calendar view toggle */
/* ---------------------------------------------------------
   Centers the segmented view control while preserving the
   established button dimensions and tab presentation.
   --------------------------------------------------------- */

.promotion-cycles-view-toggle[b-g7ftbvxern] {
    grid-column: 2;
    justify-self: center;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 999px;
    background: #f8fafc;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

.promotion-cycles-view-toggle-button[b-g7ftbvxern] {
    min-height: 30px;
    min-width: 112px;
    padding: 0 16px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--text-600, #475569);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    text-align: center;
    white-space: nowrap;
    transition: color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

    .promotion-cycles-view-toggle-button:hover[b-g7ftbvxern] {
        color: #1d3a6d;
        background: rgba(37, 99, 235, 0.06);
    }

    .promotion-cycles-view-toggle-button.is-active[b-g7ftbvxern] {
        background: #fff;
        color: #1d4ed8;
        box-shadow: 0 1px 5px rgba(15, 23, 42, 0.12);
    }

    .promotion-cycles-view-toggle-button:focus-visible[b-g7ftbvxern] {
        outline: none;
        box-shadow: var(--focus-ring);
    }

/* Promotion Cycle filters */
/* ---------------------------------------------------------
   Aligns search, status, availability, Promotion Entry, and page
   size controls with the list workspace and table edge.
   --------------------------------------------------------- */

.promotion-cycles-toolbar[b-g7ftbvxern] {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(280px, 1fr) 180px 150px 170px 108px;
    gap: 10px;
    align-items: end;
    padding: 14px 12px 10px;
}

.promotion-cycles-control[b-g7ftbvxern],
.promotion-cycles-control-search[b-g7ftbvxern],
.promotion-cycles-control-availability[b-g7ftbvxern],
.promotion-cycles-control-eligible[b-g7ftbvxern],
.promotion-cycles-control-page-size[b-g7ftbvxern] {
    min-width: 0;
}

.promotion-cycles-control-label[b-g7ftbvxern] {
    display: block;
    margin-bottom: 4px;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 600;
}

.promotion-cycles-search-input[b-g7ftbvxern],
.promotion-cycles-filter-select[b-g7ftbvxern] {
    width: 100%;
    min-height: 38px;
}

.promotion-cycles-filter-select[b-g7ftbvxern] {
    min-width: 0;
}

.promotion-cycles-control-page-size .promotion-cycles-filter-select[b-g7ftbvxern] {
    min-width: 108px;
}

.promotion-cycles-toolbar-checkbox[b-g7ftbvxern] {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: var(--text-900);
    font-weight: 500;
}

/* Loading, empty, and error states */
/* ---------------------------------------------------------
   Renders list states inside the table workspace without changing
   the fixed-height outer page layout.
   --------------------------------------------------------- */

.promotion-cycles-state[b-g7ftbvxern] {
    padding: 18px 16px;
    color: var(--text-600);
}

.promotion-cycles-state-wrap[b-g7ftbvxern] {
    width: 100%;
    min-height: 0;
    height: auto;
    align-self: start;
    justify-self: stretch;
    box-sizing: border-box;
}

.promotion-cycles-state-wrap--error[b-g7ftbvxern] {
    padding: 8px 12px 0;
}

    .promotion-cycles-state-wrap--error .alert[b-g7ftbvxern] {
        display: inline-flex;
        align-items: center;
        width: auto;
        max-width: 720px;
        min-height: 0;
        height: auto;
        margin: 0;
        padding: 10px 14px;
        border-radius: 10px;
    }

/* Promotion Cycle table workspace */
/* ---------------------------------------------------------
   Owns vertical and horizontal table scrolling while the header,
   filters, and pager remain stable.
   --------------------------------------------------------- */

.promotion-cycles-table-region[b-g7ftbvxern] {
    min-height: 0;
    height: 100%;
    margin: 0 12px 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
}

.promotion-cycles-table-scroll[b-g7ftbvxern] {
    min-height: 0;
    position: relative;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    background: #ffffff;
}

.promotion-cycles-table[b-g7ftbvxern] {
    width: 100%;
    margin: 0;
    min-width: 1040px;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.82rem;
}

    .promotion-cycles-table thead th[b-g7ftbvxern] {
        position: sticky;
        top: 0;
        z-index: 12;
        padding: 0.58rem 0.55rem;
        border-bottom: 0;
        background: #ffffff;
        color: #64748b;
        font-size: 0.7rem;
        font-weight: 850;
        letter-spacing: 0.035em;
        text-transform: uppercase;
        white-space: nowrap;
        box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
    }

    .promotion-cycles-table tbody td[b-g7ftbvxern] {
        padding: 0.56rem 0.55rem;
        vertical-align: middle;
        border-bottom: 1px solid #edf2f7;
        background: #ffffff;
        color: var(--text-900);
    }

    .promotion-cycles-table tbody tr:hover td[b-g7ftbvxern] {
        background: #fbfdff;
    }

    /* Table content alignment */
    /* ---------------------------------------------------------
     Aligns the first and last table cells with the filter and
     pager insets.
     --------------------------------------------------------- */
    .promotion-cycles-table thead th:first-child[b-g7ftbvxern],
    .promotion-cycles-table tbody td:first-child[b-g7ftbvxern] {
        padding-left: 12px;
    }

    .promotion-cycles-table thead th:last-child[b-g7ftbvxern],
    .promotion-cycles-table tbody td:last-child[b-g7ftbvxern] {
        padding-right: 12px;
    }

/* Compact Cycle operational summaries */
/* ---------------------------------------------------------
   Keeps Promotion and downstream counts understandable inside
   the fixed-width Cycle table while detailed status information
   remains available through Cycle Summary.
   --------------------------------------------------------- */

.promotion-cycles-compact-summary[b-g7ftbvxern] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.promotion-cycles-compact-summary-row[b-g7ftbvxern] {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 5px;
}

.promotion-cycles-compact-summary-label[b-g7ftbvxern] {
    overflow: hidden;
    color: var(--text-500, #64748b);
    font-size: 10.5px;
    line-height: 1.2;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotion-cycles-compact-summary-value[b-g7ftbvxern] {
    color: var(--text-900, #0f172a);
    font-size: 11.5px;
    line-height: 1.2;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

.promotion-cycles-compact-summary-value--success[b-g7ftbvxern] {
    color: #087f5b;
}

.promotion-cycles-link-action--summary[b-g7ftbvxern] {
    color: #1d4ed8;
    font-weight: 750;
}

/* Sort controls */
/* ---------------------------------------------------------
   Uses compact table-header actions with blue active-sort
   emphasis.
   --------------------------------------------------------- */

.promotion-cycles-sort-button[b-g7ftbvxern] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    max-width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    cursor: pointer;
    white-space: nowrap;
}

    .promotion-cycles-sort-button:hover[b-g7ftbvxern],
    .promotion-cycles-sort-button--active[b-g7ftbvxern] {
        color: #2563eb;
    }

.promotion-cycles-sort-indicator[b-g7ftbvxern] {
    font-size: 0.72rem;
    line-height: 1;
}

/* Promotion Cycle table columns */
/* ---------------------------------------------------------
   Preserves the 1040px internal table target while balancing
   flexible cycle names with compact workflow and utility columns.
   --------------------------------------------------------- */

.promotion-cycles-col-name[b-g7ftbvxern] {
    width: 23%;
    min-width: 238px;
}

.promotion-cycles-col-period[b-g7ftbvxern] {
    width: 6.5%;
    min-width: 68px;
}

.promotion-cycles-col-status[b-g7ftbvxern] {
    width: 12%;
    min-width: 126px;
}

.promotion-cycles-col-promotions[b-g7ftbvxern] {
    width: 10%;
    min-width: 96px;
}

.promotion-cycles-col-downstream[b-g7ftbvxern] {
    width: 10%;
    min-width: 100px;
}

.promotion-cycles-col-key-dates[b-g7ftbvxern] {
    width: 16%;
    min-width: 164px;
}

.promotion-cycles-col-updated[b-g7ftbvxern] {
    width: 8%;
    min-width: 82px;
}

.promotion-cycles-col-actions[b-g7ftbvxern] {
    width: 14.5%;
    min-width: 142px;
}

/* Promotion Cycle column behavior */
/* ---------------------------------------------------------
   Supports the cycle-name hierarchy, compact workflow summaries,
   and the sticky Actions column.
   --------------------------------------------------------- */

.promotion-cycles-table th.promotion-cycles-col-name[b-g7ftbvxern],
.promotion-cycles-table td.promotion-cycles-col-name[b-g7ftbvxern] {
    vertical-align: top;
}

.promotion-cycles-table td.promotion-cycles-col-period[b-g7ftbvxern],
.promotion-cycles-table td.promotion-cycles-col-actions[b-g7ftbvxern] {
    white-space: nowrap;
}

.promotion-cycles-table td.promotion-cycles-col-promotions[b-g7ftbvxern],
.promotion-cycles-table td.promotion-cycles-col-downstream[b-g7ftbvxern],
.promotion-cycles-table td.promotion-cycles-col-key-dates[b-g7ftbvxern],
.promotion-cycles-table td.promotion-cycles-col-updated[b-g7ftbvxern] {
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.25;
}

/* Sticky Actions column */
/* ---------------------------------------------------------
   Pins Actions to the right edge of the table scroll viewport.
   The cell remains neutral while the inner action surface provides
   emphasis.
   --------------------------------------------------------- */
.promotion-cycles-table th.promotion-cycles-col-actions[b-g7ftbvxern],
.promotion-cycles-table td.promotion-cycles-col-actions[b-g7ftbvxern] {
    position: sticky;
    right: 0;
    z-index: 10;
    text-align: center;
    white-space: nowrap;
    background: #ffffff;
    background-clip: padding-box;
    box-shadow: none;
}

.promotion-cycles-table td.promotion-cycles-col-actions[b-g7ftbvxern] {
    vertical-align: middle;
}

.promotion-cycles-table thead th.promotion-cycles-col-actions[b-g7ftbvxern] {
    z-index: 18;
    background: #ffffff;
    box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
}

.promotion-cycles-table tbody tr:hover td.promotion-cycles-col-actions[b-g7ftbvxern] {
    background: #fbfdff;
}

/* Row action surface */
/* ---------------------------------------------------------
   Provides a compact action zone inside the sticky cell without
   tinting the full Actions column.
   --------------------------------------------------------- */
.promotion-cycles-row-actions[b-g7ftbvxern] {
    width: 100%;
    min-width: 0;
    min-height: 28px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 0 7px;
    border-radius: 7px;
    background: #f3f6fb;
    box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.82);
    white-space: nowrap;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.promotion-cycles-row-actions--stacked[b-g7ftbvxern] {
    min-height: 42px;
    gap: 5px;
    padding-top: 4px;
    padding-bottom: 4px;
}

.promotion-cycles-row-action-line[b-g7ftbvxern] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    line-height: 1;
}

.promotion-cycles-row-action-line--secondary[b-g7ftbvxern] {
    min-height: 14px;
}

.promotion-cycles-table tbody tr:hover .promotion-cycles-row-actions[b-g7ftbvxern] {
    background: #edf4ff;
    box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.68);
}

.promotion-cycles-link-action[b-g7ftbvxern] {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 0;
    margin: 0;
    color: var(--link-600, #2563eb);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}

    .promotion-cycles-link-action:hover:not(:disabled)[b-g7ftbvxern] {
        color: #1d4ed8;
        text-decoration: underline;
        text-underline-offset: 2px;
    }

.promotion-cycles-link-action-danger[b-g7ftbvxern] {
    color: #dc2626;
}

.promotion-cycles-link-action:disabled[b-g7ftbvxern] {
    opacity: 0.5;
    cursor: default;
    text-decoration: none;
}

.promotion-cycles-action-separator[b-g7ftbvxern] {
    color: var(--text-400, #94a3b8);
    font-size: 12px;
    line-height: 1;
}

/* Workflow date stacks */
/* ---------------------------------------------------------
   Keeps open and close dates compact while color distinguishes
   their workflow purpose.
   --------------------------------------------------------- */

.promotion-cycles-date-stack[b-g7ftbvxern] {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.promotion-cycles-date-stack-value[b-g7ftbvxern] {
    display: block;
    min-width: 0;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.15;
    white-space: nowrap;
}

.promotion-cycles-date-stack-value-open[b-g7ftbvxern] {
    color: #15803d;
}

.promotion-cycles-date-stack-value-close[b-g7ftbvxern] {
    color: #c2410c;
}

.promotion-cycles-date-stack-empty[b-g7ftbvxern] {
    color: var(--text-400, #94a3b8);
    font-size: 12px;
    line-height: 1.2;
}

/* Promotion Cycle activity summaries */
/* ---------------------------------------------------------
   Presents Promotions, Promotion Pricing, and Final Books status
   context without adding additional table columns.
   --------------------------------------------------------- */

.promotion-cycles-count-cell[b-g7ftbvxern],
.promotion-cycles-downstream-cell[b-g7ftbvxern],
.promotion-cycles-key-date-stack[b-g7ftbvxern] {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.promotion-cycles-count-primary[b-g7ftbvxern] {
    color: var(--text-900);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.1;
}

.promotion-cycles-count-secondary[b-g7ftbvxern],
.promotion-cycles-downstream-line[b-g7ftbvxern],
.promotion-cycles-key-date-row[b-g7ftbvxern] {
    min-width: 0;
    color: var(--text-600);
    font-size: 11.25px;
    font-weight: 500;
    line-height: 1.25;
}

.promotion-cycles-count-secondary[b-g7ftbvxern] {
    font-size: 11.25px;
    letter-spacing: -0.005em;
}

.promotion-cycles-count-secondary[b-g7ftbvxern],
.promotion-cycles-downstream-line[b-g7ftbvxern] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

    .promotion-cycles-downstream-line:first-child[b-g7ftbvxern] {
        color: var(--text-800);
        font-weight: 700;
    }

.promotion-cycles-downstream-line-muted[b-g7ftbvxern] {
    color: var(--text-500);
}

.promotion-cycles-key-date-row[b-g7ftbvxern] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 7px;
    align-items: baseline;
}

.promotion-cycles-key-date-label[b-g7ftbvxern] {
    color: var(--text-500);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.015em;
    text-transform: uppercase;
}

.promotion-cycles-key-date-value[b-g7ftbvxern] {
    overflow: hidden;
    color: var(--text-700);
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: -0.01em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotion-cycles-updated-stack[b-g7ftbvxern] {
    display: grid;
    gap: 1px;
    min-width: 0;
    color: var(--text-700);
    font-size: 10.75px;
    font-weight: 500;
    line-height: 1.15;
    white-space: normal;
}

.promotion-cycles-updated-time[b-g7ftbvxern] {
    color: var(--text-500);
}

/* Promotion Cycle row content */
/* ---------------------------------------------------------
   Controls cycle titles, supporting text, status badges,
   CustomTooltip triggers, and row actions.
   --------------------------------------------------------- */

[b-g7ftbvxern] .promotion-cycles-primary-title-wrap {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.promotion-cycles-primary[b-g7ftbvxern] {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    color: var(--text-900);
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotion-cycles-secondary[b-g7ftbvxern] {
    margin-top: 3px;
    color: var(--text-600);
    font-size: 12px;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.promotion-cycles-secondary-success[b-g7ftbvxern],
.promotion-cycles-secondary-muted[b-g7ftbvxern] {
    color: var(--text-600);
}

.promotion-cycles-badge[b-g7ftbvxern],
.promotion-cycles-active-pill[b-g7ftbvxern] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    white-space: nowrap;
}

.promotion-cycles-badge[b-g7ftbvxern] {
    min-height: 20px;
    min-width: 0;
    width: 100%;
    padding: 0 8px;
    overflow: hidden;
    font-size: 10.75px;
    font-weight: 600;
    line-height: 1;
    text-overflow: ellipsis;
}

.promotion-cycles-active-pill[b-g7ftbvxern] {
    min-height: 20px;
    min-width: 60px;
    padding: 0 6px;
    font-size: 11px;
    font-weight: 600;
}

.promotion-cycles-badge-planned[b-g7ftbvxern],
.promotion-cycles-badge-default[b-g7ftbvxern] {
    background: #f1f5f9;
    color: #475569;
}

.promotion-cycles-badge-drafting[b-g7ftbvxern] {
    background: #dbeafe;
    color: #1d4ed8;
}

.promotion-cycles-badge-submission[b-g7ftbvxern],
.promotion-cycles-active-pill--active[b-g7ftbvxern] {
    background: rgba(91, 196, 191, 0.18);
    color: #206a66;
}

.promotion-cycles-badge-review[b-g7ftbvxern] {
    background: rgba(250, 169, 75, 0.20);
    color: #9a5a12;
}

.promotion-cycles-badge-distributor[b-g7ftbvxern] {
    background: #ede9fe;
    color: #5b21b6;
}

.promotion-cycles-badge-locked[b-g7ftbvxern] {
    background: #e2e8f0;
    color: #334155;
}

.promotion-cycles-badge-published[b-g7ftbvxern] {
    background: #dcfce7;
    color: #166534;
}

.promotion-cycles-badge-archived[b-g7ftbvxern],
.promotion-cycles-active-pill--inactive[b-g7ftbvxern] {
    background: rgba(241, 95, 87, 0.14);
    color: #9d423c;
}

/* Sticky pager */
/* ---------------------------------------------------------
   Keeps pagination anchored at the bottom of the Promotion Cycle
   list workspace.
   --------------------------------------------------------- */

.promotion-cycles-pager[b-g7ftbvxern] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 6px 14px 4px;
    background: #f8fafc;
    border-top: 1px solid rgba(25, 35, 68, 0.06);
}

.promotion-cycles-pager-meta[b-g7ftbvxern] {
    color: var(--text-600, #475569);
    font-size: 12px;
    font-weight: 500;
}

.promotion-cycles-pager-page[b-g7ftbvxern] {
    min-width: 88px;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 600;
    text-align: center;
}

.promotion-cycles-pager-actions[b-g7ftbvxern] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* Promotion Cycle modal shell */
/* ---------------------------------------------------------
   Provides the local modal backdrop and fixed shell used by
   create, edit, confirmation, guide, and calendar-day dialogs.
   --------------------------------------------------------- */

.promotion-cycles-modal-backdrop[b-g7ftbvxern] {
    position: fixed;
    inset: 0;
    z-index: 1040;
    background: rgba(15, 23, 42, 0.35);
}

.promotion-cycles-modal[b-g7ftbvxern] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.promotion-cycles-modal-card[b-g7ftbvxern] {
    width: min(1180px, calc(100vw - 2rem));
    max-height: calc(100vh - 2rem);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 12px;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.22);
}

.promotion-cycles-modal-header[b-g7ftbvxern] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px 10px;
    border-bottom: 1px solid var(--border-200);
}

.promotion-cycles-modal-title[b-g7ftbvxern] {
    color: var(--text-900);
    font-size: 15px;
    font-weight: 600;
}

.promotion-cycles-modal-body[b-g7ftbvxern] {
    overflow: auto;
    padding: 16px 18px 14px;
}

.promotion-cycles-modal-footer[b-g7ftbvxern] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
}

.promotion-cycles-confirm-summary--danger[b-g7ftbvxern] {
    border-color: rgba(220, 38, 38, 0.24);
    background: linear-gradient(180deg, rgba(220, 38, 38, 0.08), rgba(220, 38, 38, 0.04));
    color: #991b1b;
}

.promotion-cycles-delete-modal-card[b-g7ftbvxern] {
    width: min(560px, calc(100vw - 2rem));
}

/* Create and edit Promotion Cycle forms */
/* ---------------------------------------------------------
   Uses a two-column desktop form layout for Promotion Cycle
   details and workflow dates.
   --------------------------------------------------------- */

.promotion-cycles-form-layout[b-g7ftbvxern] {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.promotion-cycles-form-section[b-g7ftbvxern] {
    min-width: 0;
    padding: 14px 14px 12px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: rgba(248, 250, 252, 0.55);
}

.promotion-cycles-form-section-title[b-g7ftbvxern] {
    margin-bottom: 10px;
    color: var(--text-900);
    font-size: 14px;
    font-weight: 600;
}

.promotion-cycles-form-section-subtitle[b-g7ftbvxern] {
    margin-top: -4px;
    margin-bottom: 10px;
    color: var(--text-600);
    font-size: 12px;
}

.promotion-cycles-section-heading-row[b-g7ftbvxern],
.promotion-cycles-field-label-row[b-g7ftbvxern] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.promotion-cycles-section-heading-row[b-g7ftbvxern] {
    align-items: flex-start;
    margin-bottom: 10px;
}

.promotion-cycles-section-heading-copy[b-g7ftbvxern] {
    display: grid;
    gap: 2px;
    min-width: 0;
}

    .promotion-cycles-section-heading-copy .promotion-cycles-form-section-title[b-g7ftbvxern] {
        margin-bottom: 0;
    }

    .promotion-cycles-section-heading-copy .promotion-cycles-form-section-subtitle[b-g7ftbvxern] {
        margin-top: 0;
        margin-bottom: 0;
    }

.promotion-cycles-checkbox[b-g7ftbvxern] {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding-top: 6px;
}

.promotion-cycles-checkbox-box[b-g7ftbvxern] {
    min-height: 38px;
    padding: 0 12px;
    border: 1px solid var(--border-200);
    border-radius: 8px;
    background: #fff;
}

.promotion-cycles-checkbox-label[b-g7ftbvxern] {
    color: var(--text-900);
    font-weight: 500;
}

/* Promo period guidance */
/* ---------------------------------------------------------
   Displays compact Promo Month and Promo Year rule guidance
   inside create and edit dialogs.
   --------------------------------------------------------- */

.promotion-cycles-field-hint[b-g7ftbvxern] {
    margin-top: 4px;
    color: var(--text-500);
    font-size: 11.5px;
    line-height: 1.35;
}

/* Promotion Cycle guides */
/* ---------------------------------------------------------
   Styles contextual help actions and guide dialogs for cycle
   details and workflow dates.
   --------------------------------------------------------- */

.promotion-cycles-help-link[b-g7ftbvxern] {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--link-600, #2563eb);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

    .promotion-cycles-help-link:hover[b-g7ftbvxern] {
        text-decoration: underline;
    }

.promotion-cycles-help-link--placeholder[b-g7ftbvxern] {
    min-width: 96px;
    visibility: hidden;
    pointer-events: none;
}

.promotion-cycles-help-modal-shell[b-g7ftbvxern] {
    align-items: flex-start;
    padding-top: 8rem;
}

.promotion-cycles-help-modal-card[b-g7ftbvxern] {
    width: min(460px, calc(100vw - 2rem));
}

.promotion-cycles-help-modal-body[b-g7ftbvxern] {
    padding: 16px 18px 18px;
}

.promotion-cycles-help-list[b-g7ftbvxern] {
    display: grid;
    gap: 10px;
    color: var(--text-700);
    font-size: 13px;
    line-height: 1.5;
}

.promotion-cycles-guide-modal-card[b-g7ftbvxern] {
    width: min(640px, calc(100vw - 2rem));
}

.promotion-cycles-guide-section + .promotion-cycles-guide-section[b-g7ftbvxern] {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid rgba(25, 35, 68, 0.08);
}

.promotion-cycles-guide-heading[b-g7ftbvxern] {
    margin-bottom: 8px;
    color: var(--text-900);
    font-size: 13px;
    font-weight: 700;
}

/* Publish and delete confirmations */

.promotion-cycles-confirm-modal-card[b-g7ftbvxern] {
    width: min(620px, calc(100vw - 2rem));
}

    .promotion-cycles-confirm-modal-card .promotion-cycles-modal-header[b-g7ftbvxern] {
        padding: 14px 18px 12px;
    }

.promotion-cycles-confirm-modal-body[b-g7ftbvxern] {
    padding: 18px 20px 16px;
}

.promotion-cycles-confirm-summary[b-g7ftbvxern] {
    padding: 14px 16px;
    border: 1px solid rgba(250, 169, 75, 0.34);
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(250, 169, 75, 0.10), rgba(250, 169, 75, 0.06));
    color: #8a5a00;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}

.promotion-cycles-confirm-copy[b-g7ftbvxern] {
    margin-top: 14px;
    color: var(--text-700);
    font-size: 14px;
    line-height: 1.5;
}

.promotion-cycles-confirm-copy--secondary[b-g7ftbvxern] {
    margin-top: 8px;
    color: var(--text-600);
}

.promotion-cycles-confirm-modal-footer[b-g7ftbvxern] {
    margin-top: 0;
    padding: 12px 20px 18px;
    border-top: 1px solid rgba(25, 35, 68, 0.08);
}

/* Promotion Cycle calendar workspace */
/* ---------------------------------------------------------
   Uses the shared list host with an internal fixed-height
   calendar and deadline summary workspace.
   --------------------------------------------------------- */

.promotion-cycles-calendar-body[b-g7ftbvxern] {
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 240px;
    gap: 10px;
    align-items: stretch;
    overflow: hidden;
    box-sizing: border-box;
    padding: 12px 12px 8px;
}

.promotion-cycles-calendar-main[b-g7ftbvxern] {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 12px;
    background: #fff;
}

.promotion-cycles-calendar-header[b-g7ftbvxern] {
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.promotion-cycles-calendar-title[b-g7ftbvxern] {
    color: var(--text-900);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.15;
}

.promotion-cycles-calendar-subtitle[b-g7ftbvxern] {
    margin-top: 3px;
    color: var(--text-500);
    font-size: 12px;
}

.promotion-cycles-calendar-nav[b-g7ftbvxern] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
}

.promotion-cycles-calendar-footnote[b-g7ftbvxern] {
    padding: 7px 12px;
    border-top: 1px solid rgba(25, 35, 68, 0.08);
    background: #f8fafc;
    color: var(--text-500);
    font-size: 12px;
}

/* Calendar grid */

.promotion-cycles-calendar-grid[b-g7ftbvxern] {
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    grid-template-rows: 32px repeat(6, minmax(0, 1fr));
    overflow-x: hidden;
    overflow-y: auto;
    border-top: 1px solid rgba(25, 35, 68, 0.08);
    border-left: 1px solid rgba(25, 35, 68, 0.08);
    background: #fff;
    scrollbar-gutter: stable;
}

.promotion-cycles-calendar-day-name[b-g7ftbvxern] {
    position: sticky;
    top: 0;
    z-index: 2;
    min-height: 32px;
    padding: 8px 6px;
    border-right: 1px solid rgba(25, 35, 68, 0.08);
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
    background: #f8fafc;
    color: var(--text-500);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-align: center;
}

.promotion-cycles-calendar-day[b-g7ftbvxern] {
    min-width: 0;
    min-height: 0;
    overflow: visible;
    padding: 7px 6px;
    border-right: 1px solid rgba(25, 35, 68, 0.08);
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
    background: #fff;
}

.promotion-cycles-calendar-day--outside-month[b-g7ftbvxern] {
    background: #fbfdff;
}

    .promotion-cycles-calendar-day--outside-month .promotion-cycles-calendar-date-number[b-g7ftbvxern] {
        color: #b5c0ce;
    }

.promotion-cycles-calendar-day--today[b-g7ftbvxern] {
    position: relative;
    background: linear-gradient(180deg, rgba(37, 99, 235, 0.055), #fff);
    box-shadow: inset 0 0 0 2px rgba(37, 99, 235, 0.55);
}

    .promotion-cycles-calendar-day--today .promotion-cycles-calendar-date-number[b-g7ftbvxern] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 22px;
        height: 22px;
        padding: 0 6px;
        border-radius: 999px;
        background: #1d3a6d;
        color: #fff;
    }

.promotion-cycles-calendar-date-number[b-g7ftbvxern] {
    margin-bottom: 5px;
    color: var(--text-700);
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.promotion-cycles-calendar-events[b-g7ftbvxern] {
    position: relative;
    min-width: 0;
    display: grid;
    gap: 4px;
    align-content: start;
}

/* Calendar events and CustomTooltip triggers */

.promotion-cycles-calendar-event[b-g7ftbvxern] {
    position: relative;
    width: 100%;
    min-width: 0;
    min-height: 21px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 2px 7px;
    border: 1px solid transparent;
    border-radius: 7px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.035);
}

    .promotion-cycles-calendar-event:hover[b-g7ftbvxern] {
        filter: brightness(0.985);
        box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08);
    }

.promotion-cycles-calendar-event-dot[b-g7ftbvxern] {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    flex: 0 0 auto;
    background: currentColor;
}

.promotion-cycles-calendar-event-text[b-g7ftbvxern] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotion-cycles-calendar-event--draft[b-g7ftbvxern] {
    background: #dbeafe;
    border-color: rgba(29, 78, 216, 0.12);
    color: #1d4ed8;
}

.promotion-cycles-calendar-event--submission[b-g7ftbvxern] {
    background: rgba(91, 196, 191, 0.16);
    border-color: rgba(91, 196, 191, 0.24);
    color: #206a66;
}

.promotion-cycles-calendar-event--manufacturer-due[b-g7ftbvxern] {
    background: rgba(241, 95, 87, 0.14);
    border-color: rgba(241, 95, 87, 0.26);
    color: #9d423c;
}

.promotion-cycles-calendar-event--distributor-review[b-g7ftbvxern] {
    background: #ede9fe;
    border-color: rgba(91, 33, 182, 0.16);
    color: #5b21b6;
}

.promotion-cycles-calendar-event--distributor-due[b-g7ftbvxern] {
    background: rgba(250, 169, 75, 0.18);
    border-color: rgba(250, 169, 75, 0.28);
    color: #9a5a12;
}

.promotion-cycles-calendar-event--lock[b-g7ftbvxern] {
    background: #e2e8f0;
    border-color: rgba(51, 65, 85, 0.16);
    color: #334155;
}

.promotion-cycles-calendar-event--publish[b-g7ftbvxern] {
    background: #dcfce7;
    border-color: rgba(22, 101, 52, 0.14);
    color: #166534;
}

.promotion-cycles-calendar-more[b-g7ftbvxern] {
    width: fit-content;
    padding: 0 0 0 4px;
    border: 0;
    background: transparent;
    color: var(--link-600, #2563eb);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;
}

    .promotion-cycles-calendar-more:hover[b-g7ftbvxern] {
        text-decoration: underline;
    }

[b-g7ftbvxern] .promotion-cycles-calendar-event-tooltip-wrap {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

/* Upcoming deadlines and event legend */

.promotion-cycles-calendar-side[b-g7ftbvxern] {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 12px;
    overflow: hidden;
}

.promotion-cycles-calendar-side-card[b-g7ftbvxern] {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 12px;
    background: #fff;
}

    .promotion-cycles-calendar-side-card > .promotion-cycles-calendar-side-title[b-g7ftbvxern],
    .promotion-cycles-calendar-side-header[b-g7ftbvxern] {
        padding: 11px 12px 9px;
        border-bottom: 1px solid rgba(25, 35, 68, 0.08);
    }

.promotion-cycles-calendar-side-title[b-g7ftbvxern] {
    color: var(--text-900);
    font-size: 14px;
    font-weight: 800;
}

.promotion-cycles-calendar-side-subtitle[b-g7ftbvxern] {
    margin-top: 2px;
    color: var(--text-500);
    font-size: 12px;
}

.promotion-cycles-upcoming-list[b-g7ftbvxern] {
    min-height: 0;
    overflow: auto;
    scrollbar-gutter: stable;
}

.promotion-cycles-upcoming-empty[b-g7ftbvxern] {
    padding: 14px 12px;
    color: var(--text-500);
    font-size: 13px;
}

.promotion-cycles-upcoming-row[b-g7ftbvxern] {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    padding: 8px;
    border: 0;
    border-bottom: 1px solid rgba(25, 35, 68, 0.07);
    background: #fff;
    text-align: left;
    cursor: pointer;
}

    .promotion-cycles-upcoming-row:hover[b-g7ftbvxern] {
        background: #f8fafc;
    }

.promotion-cycles-upcoming-copy[b-g7ftbvxern] {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.promotion-cycles-upcoming-title[b-g7ftbvxern] {
    color: var(--text-900);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
}

.promotion-cycles-upcoming-meta[b-g7ftbvxern] {
    overflow: hidden;
    color: var(--text-500);
    font-size: 11px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotion-cycles-upcoming-date[b-g7ftbvxern] {
    color: var(--text-600);
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.promotion-cycles-calendar-legend[b-g7ftbvxern] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 6px;
    padding: 10px 12px 12px;
}

.promotion-cycles-calendar-legend-item[b-g7ftbvxern] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--text-700);
    font-size: 11px;
    font-weight: 600;
}

.promotion-cycles-calendar-dot[b-g7ftbvxern] {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    flex: 0 0 auto;
    background: #94a3b8;
}

.promotion-cycles-calendar-dot--draft[b-g7ftbvxern] {
    background: #3b82f6;
}

.promotion-cycles-calendar-dot--submission[b-g7ftbvxern] {
    background: #2ba89f;
}

.promotion-cycles-calendar-dot--manufacturer-due[b-g7ftbvxern] {
    background: #e85b50;
}

.promotion-cycles-calendar-dot--distributor-review[b-g7ftbvxern] {
    background: #7c3aed;
}

.promotion-cycles-calendar-dot--distributor-due[b-g7ftbvxern] {
    background: #e68a1a;
}

.promotion-cycles-calendar-dot--lock[b-g7ftbvxern] {
    background: #64748b;
}

.promotion-cycles-calendar-dot--publish[b-g7ftbvxern] {
    background: #22a45a;
}

/* Calendar day events modal */

.promotion-cycles-calendar-day-modal-card[b-g7ftbvxern] {
    width: min(520px, calc(100vw - 2rem));
}

.promotion-cycles-calendar-day-modal-subtitle[b-g7ftbvxern] {
    margin-top: 3px;
    color: var(--text-500);
    font-size: 12px;
}

.promotion-cycles-calendar-day-modal-body[b-g7ftbvxern] {
    display: grid;
    gap: 8px;
    padding: 14px 16px 16px;
}

.promotion-cycles-calendar-day-event-row[b-g7ftbvxern] {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #fff;
    text-align: left;
    cursor: pointer;
}

    .promotion-cycles-calendar-day-event-row:hover[b-g7ftbvxern] {
        background: #f8fafc;
        border-color: rgba(37, 99, 235, 0.18);
    }

.promotion-cycles-calendar-day-event-copy[b-g7ftbvxern] {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.promotion-cycles-calendar-day-event-title[b-g7ftbvxern] {
    color: var(--text-900);
    font-size: 13px;
    font-weight: 800;
}

.promotion-cycles-calendar-day-event-meta[b-g7ftbvxern],
.promotion-cycles-calendar-day-event-tooltip[b-g7ftbvxern] {
    color: var(--text-500);
    font-size: 12px;
}

.promotion-cycles-calendar-day-event-tooltip[b-g7ftbvxern] {
    color: var(--text-700);
}

/* Responsive behavior */
/* ---------------------------------------------------------
   Uses container queries for available workspace width and media
   queries for modal and small-screen safety.
   --------------------------------------------------------- */

@container promotion-cycles-page (max-width: 1100px) {
    .promotion-cycles-calendar-body[b-g7ftbvxern] {
        grid-template-columns: minmax(0, 1fr);
    }

    .promotion-cycles-calendar-side[b-g7ftbvxern] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: auto;
    }
}

@container promotion-cycles-page (max-width: 980px) {
    .promotion-cycles-toolbar[b-g7ftbvxern] {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
    }

    .promotion-cycles-control-page-size .promotion-cycles-filter-select[b-g7ftbvxern] {
        width: 100%;
        min-width: 0;
    }
}

@container promotion-cycles-page (max-width: 820px) {
    .promotion-cycles-stat-grid[b-g7ftbvxern] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@container promotion-cycles-page (max-width: 640px) {
    .promotion-cycles-stat-grid[b-g7ftbvxern],
    .promotion-cycles-toolbar[b-g7ftbvxern] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1100px) {
    .promotion-cycles-modal-card[b-g7ftbvxern] {
        width: min(960px, calc(100vw - 1.5rem));
    }
}

@media (max-width: 900px) {
    .promotion-cycles-panel-header[b-g7ftbvxern] {
        align-items: flex-start;
        grid-template-columns: 1fr;
    }

    .promotion-cycles-header-actions[b-g7ftbvxern] {
        display: flex;
        justify-content: flex-start;
        width: 100%;
    }

    .promotion-cycles-view-toggle[b-g7ftbvxern] {
        grid-column: auto;
        justify-self: start;
    }

    .promotion-cycles-primary-button[b-g7ftbvxern] {
        grid-column: auto;
        justify-self: start;
    }
}

@media (max-width: 768px) {
    .promotion-cycles-primary-button[b-g7ftbvxern] {
        width: 100%;
    }

    .promotion-cycles-panel-header[b-g7ftbvxern],
    .promotion-cycles-toolbar[b-g7ftbvxern],
    .promotion-cycles-pager[b-g7ftbvxern] {
        padding-left: 12px;
        padding-right: 12px;
    }

    .promotion-cycles-table-region[b-g7ftbvxern] {
        margin-left: 10px;
        margin-right: 10px;
    }

    .promotion-cycles-header-actions[b-g7ftbvxern] {
        width: 100%;
        justify-content: stretch;
        flex-direction: column;
    }

        .promotion-cycles-header-actions .promotion-cycles-primary-button[b-g7ftbvxern] {
            width: 100%;
        }
}

@media (max-width: 700px) {
    .promotion-cycles-modal-card[b-g7ftbvxern] {
        width: calc(100vw - 1rem);
        max-height: calc(100vh - 1rem);
    }

    .promotion-cycles-modal-body[b-g7ftbvxern] {
        padding: 14px 14px 12px;
    }
}

@media (max-width: 640px) {
    .promotion-cycles-pager[b-g7ftbvxern] {
        padding-left: 12px;
        padding-right: 12px;
    }
}
/* /Components/Pages/Admin/PromotionEdit.razor.rz.scp.css */
/* =========================================================
   PromotionEdit.razor.css - Admin-only Promotion Edit styles
   ---------------------------------------------------------
   Scope:
   - Admin-projected WAM Review section only
   ========================================================= */

/*This class page-host-fill is currently being reference in PageStylesShared.css in wwwroot*/

/*override the padding-top to save space*/
.page-host-fill[b-lw2kpc1pa1], .trip-top-padding[b-lw2kpc1pa1] {
  padding-top: 0;
}

.page-host-fill[b-lw2kpc1pa1]  .promotion-edit-page {
  flex: 1 1 auto;
  min-height: 0;
}

/* =========================================================
   WAM Review projected card shell
   ========================================================= */

.promotion-edit-card[b-lw2kpc1pa1] {
  background: var(--bg-surface);
  border: 1px solid var(--border-200);
  border-radius: var(--radius-2);
  box-shadow: var(--shadow-1);
  overflow: hidden;
  margin-bottom: 8px;
}

.promotion-edit-card-header[b-lw2kpc1pa1] {
  padding: 7px 14px 6px;
  border-bottom: 1px solid var(--border-200);
}

.promotion-edit-card-header-split[b-lw2kpc1pa1] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.promotion-edit-card-title[b-lw2kpc1pa1] {
  font-size: 15px;
  font-weight: 600;
  color: var(--text-900);
}

.promotion-edit-card-body[b-lw2kpc1pa1] {
  padding: 7px 14px 8px;
}

/* =========================================================
   WAM Review header/content layout
   ========================================================= */

.promotion-edit-review-title-block[b-lw2kpc1pa1] {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.promotion-edit-review-helper[b-lw2kpc1pa1] {
  font-size: 12px;
  line-height: 1.2;
  color: var(--text-600);
}

.promotion-edit-review-grid[b-lw2kpc1pa1] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: start;
}

.promotion-edit-review-field[b-lw2kpc1pa1] {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

  .promotion-edit-review-field .form-label[b-lw2kpc1pa1] {
    margin-bottom: 3px;
  }

.page-host-fill[b-lw2kpc1pa1]  .promotion-edit-card--review textarea.promotion-edit-review-textarea {
  min-height: 32px !important;
  height: 32px;
  max-height: none;
  line-height: 1.15 !important;
  padding: 5px 10px !important;
  resize: vertical;
  overflow-y: auto;
  box-sizing: border-box;
}

/* =========================================================
   WAM Review actions
   ========================================================= */

.promotion-edit-review-actions[b-lw2kpc1pa1] {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.promotion-edit-review-actions--header[b-lw2kpc1pa1] {
  align-items: center;
  margin-top: 0;
}

.promotion-edit-review-actions .btn[b-lw2kpc1pa1] {
  min-height: 32px;
  height: 32px;
  padding: 4px 14px;
  font-size: 14px;
  line-height: 1.15;
  border-radius: 8px;
}

/* =========================================================
   WAM Review emphasis
   ========================================================= */

.promotion-edit-card--review[b-lw2kpc1pa1] {
  border-color: rgba(234, 179, 8, 0.16);
}

  .promotion-edit-card--review .promotion-edit-card-header[b-lw2kpc1pa1] {
    background: rgba(234, 179, 8, 0.07);
    border-bottom: 1px solid rgba(234, 179, 8, 0.14);
  }

  .promotion-edit-card--review .promotion-edit-card-title[b-lw2kpc1pa1] {
    font-weight: 700;
    color: var(--text-900);
  }

.promotion-edit-review-field .validation-message[b-lw2kpc1pa1] {
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.25;
}

.promotion-downstream-impact-dialog[b-lw2kpc1pa1] {
  max-width: 920px;
}

  .promotion-downstream-impact-dialog .modal-content[b-lw2kpc1pa1] {
    max-height: calc(100vh - 56px);
    display: flex;
    flex-direction: column;
  }

.promotion-downstream-impact-body[b-lw2kpc1pa1] {
  overflow-y: auto;
  max-height: calc(100vh - 190px);
  padding-right: 16px;
}

  .promotion-downstream-impact-body[b-lw2kpc1pa1]::-webkit-scrollbar {
    width: 10px;
  }

  .promotion-downstream-impact-body[b-lw2kpc1pa1]::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 999px;
  }

  .promotion-downstream-impact-body[b-lw2kpc1pa1]::-webkit-scrollbar-thumb {
    background: #94a3b8;
    border-radius: 999px;
  }

    .promotion-downstream-impact-body[b-lw2kpc1pa1]::-webkit-scrollbar-thumb:hover {
      background: #64748b;
    }

  .promotion-edit-card--admin-override[b-lw2kpc1pa1] {
    margin-bottom: 8px;
  }

    .promotion-edit-card--admin-override .promotion-edit-card-header[b-lw2kpc1pa1] {
      border-bottom: 0;
    }

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 992px) {
  .promotion-edit-card-header[b-lw2kpc1pa1] {
    padding: 8px 12px 7px;
  }

  .promotion-edit-card-body[b-lw2kpc1pa1] {
    padding: 9px 12px 10px;
  }

  .promotion-edit-review-grid[b-lw2kpc1pa1] {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .page-host-fill[b-lw2kpc1pa1]  .promotion-edit-card--review textarea.promotion-edit-review-textarea {
    min-height: 32px !important;
    height: 32px;
  }

  .promotion-edit-review-actions--header[b-lw2kpc1pa1] {
    width: 100%;
    justify-content: flex-end;
  }
}
/* /Components/Pages/Admin/Promotions.razor.rz.scp.css */
/* Admin Promotions page styles */
/* ---------------------------------------------------------
   Provides Admin-specific overrides for PromotionsShared.razor.css.
   Controls Create Promotion type selection, Distributor release
   workflow presentation, pricing access, status badges, and
   responsive release behavior.
   --------------------------------------------------------- */

/* Create Promotion type selector */
/* ---------------------------------------------------------
   Provides the Open-Stock and Pre-Pack selection cards used
   inside the Admin Create Promotion Draft form.
   --------------------------------------------------------- */

.promotions-create-type-selector[b-eh4c7ihr40] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}

.promotions-create-type-card[b-eh4c7ihr40] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
    padding: 10px 12px;
    text-align: left;
    border: 1px solid var(--border-200);
    border-radius: 12px;
    background: var(--bg-surface);
    color: var(--text-900);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

    .promotions-create-type-card:hover[b-eh4c7ihr40] {
        border-color: rgba(59, 130, 246, 0.45);
        box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.08);
        background: #fcfdff;
    }

    .promotions-create-type-card.is-active[b-eh4c7ihr40] {
        border-color: rgba(37, 99, 235, 0.9);
        box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.18);
        background: rgba(59, 130, 246, 0.04);
    }

.promotions-create-type-card--prepack.is-active[b-eh4c7ihr40] {
    border-color: rgba(63, 111, 159, 0.55);
    box-shadow: 0 0 0 1px rgba(63, 111, 159, 0.12);
    background: linear-gradient(135deg, rgba(63, 111, 159, 0.08), rgba(63, 111, 159, 0.03));
}

.promotions-create-type-card--openstock.is-active[b-eh4c7ihr40] {
    border-color: rgba(142, 59, 103, 0.42);
    box-shadow: 0 0 0 1px rgba(142, 59, 103, 0.10);
    background: linear-gradient(135deg, rgba(142, 59, 103, 0.07), rgba(142, 59, 103, 0.025));
}

.promotions-create-type-card-icon[b-eh4c7ihr40] {
    flex: 0 0 auto;
    width: 20px;
    font-size: 16px;
    line-height: 1;
    margin-top: 2px;
}

.promotions-create-type-card-content[b-eh4c7ihr40] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.promotions-create-type-card-title[b-eh4c7ihr40] {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-900);
    line-height: 1.2;
}

.promotions-create-type-card-text[b-eh4c7ihr40] {
    font-size: 13px;
    line-height: 1.35;
    color: var(--text-600);
}

/* Distributor release modal */
/* ---------------------------------------------------------
   Controls the Admin release dialog shell, scrollable body,
   header, footer summary, and confirmation actions.
   --------------------------------------------------------- */

.admin-release-modal-backdrop[b-eh4c7ihr40] {
    position: fixed;
    inset: 0;
    z-index: 1040;
    background: rgba(15, 23, 42, 0.35);
}

.admin-release-modal[b-eh4c7ihr40] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.admin-release-modal-card[b-eh4c7ihr40] {
    width: min(720px, calc(100vw - 2rem));
    max-height: calc(100vh - 2rem);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.22);
}

.admin-release-modal-header[b-eh4c7ihr40] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px 10px;
    border-bottom: 1px solid var(--border-200);
}

.admin-release-modal-title[b-eh4c7ihr40] {
    font-size: 16px;
    font-weight: 700;
    color: var(--text-900);
}

.admin-release-modal-subtitle[b-eh4c7ihr40] {
    margin-top: 4px;
    font-size: 13px;
    color: var(--text-600);
}

.admin-release-modal-body[b-eh4c7ihr40] {
    overflow: auto;
    padding: 14px 16px;
}

.admin-release-modal-footer[b-eh4c7ihr40] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px 14px;
    border-top: 1px solid rgba(25, 35, 68, 0.08);
}

.admin-release-footer-summary[b-eh4c7ihr40] {
    min-width: 0;
    color: var(--text-600);
    font-size: 12px;
    font-weight: 600;
}

.admin-release-footer-actions[b-eh4c7ihr40] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Distributor release toolbar */
/* ---------------------------------------------------------
   Provides batch selection controls, compact release actions,
   and release-workspace status guidance.
   --------------------------------------------------------- */

.admin-release-toolbar[b-eh4c7ihr40] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    padding: 8px 10px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #f8fafc;
}

.admin-release-toolbar-summary[b-eh4c7ihr40] {
    min-width: 0;
    color: var(--text-600);
    font-size: 12px;
    font-weight: 600;
}

.admin-release-toolbar-actions[b-eh4c7ihr40] {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.admin-release-toolbar-button[b-eh4c7ihr40],
.admin-release-inline-action[b-eh4c7ihr40] {
    border: 0;
    background: transparent;
    color: var(--link-600, #2563eb);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    padding: 2px 4px;
    cursor: pointer;
}

    .admin-release-toolbar-button:hover[b-eh4c7ihr40],
    .admin-release-inline-action:hover[b-eh4c7ihr40] {
        text-decoration: underline;
    }

    .admin-release-toolbar-button:disabled[b-eh4c7ihr40],
    .admin-release-inline-action:disabled[b-eh4c7ihr40] {
        color: var(--text-400);
        cursor: not-allowed;
        text-decoration: none;
    }

.admin-release-toolbar-dot[b-eh4c7ihr40] {
    color: var(--text-400);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    user-select: none;
}

.admin-release-toolbar-divider[b-eh4c7ihr40] {
    width: 1px;
    height: 14px;
    margin: 0 2px;
    background: rgba(117, 140, 167, 0.34);
}

/* Distributor release options */
/* ---------------------------------------------------------
   Controls Distributor cards, selection states, expansion controls,
   item counts, and compact option hierarchy.
   --------------------------------------------------------- */

.admin-release-list[b-eh4c7ihr40] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.admin-release-option[b-eh4c7ihr40] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid rgba(25, 35, 68, 0.10);
    border-radius: 12px;
    background: #fff;
}

    .admin-release-option:hover[b-eh4c7ihr40] {
        background: rgba(25, 35, 68, 0.018);
    }

    .admin-release-option.is-selected[b-eh4c7ihr40] {
        border-color: rgba(37, 99, 235, 0.22);
        background: rgba(59, 130, 246, 0.025);
    }

    .admin-release-option.is-expanded[b-eh4c7ihr40] {
        border-color: rgba(25, 35, 68, 0.14);
    }

    .admin-release-option.is-disabled[b-eh4c7ihr40] {
        background: #f8fafc;
        color: var(--text-500);
    }

.admin-release-option-top[b-eh4c7ihr40] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: flex-start;
    gap: 10px;
}

.admin-release-option-controls[b-eh4c7ihr40] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 24px;
    padding-top: 1px;
}

.admin-release-distributor-checkbox[b-eh4c7ihr40] {
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    margin: 0;
    cursor: pointer;
}

    .admin-release-distributor-checkbox:disabled[b-eh4c7ihr40] {
        cursor: not-allowed;
    }

.admin-release-expand-button[b-eh4c7ihr40] {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(117, 140, 167, 0.28);
    border-radius: 999px;
    background: #fff;
    color: var(--text-600);
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

    .admin-release-expand-button:hover[b-eh4c7ihr40] {
        border-color: rgba(37, 99, 235, 0.38);
        background: rgba(59, 130, 246, 0.04);
        color: #1d4ed8;
        box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.06);
    }

    .admin-release-expand-button:focus-visible[b-eh4c7ihr40] {
        outline: 2px solid rgba(37, 99, 235, 0.32);
        outline-offset: 2px;
    }

.admin-release-option.is-expanded .admin-release-expand-button[b-eh4c7ihr40] {
    border-color: rgba(37, 99, 235, 0.38);
    background: rgba(59, 130, 246, 0.08);
    color: #1d4ed8;
}

.admin-release-option-main[b-eh4c7ihr40] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.admin-release-option-name[b-eh4c7ihr40] {
    font-weight: 600;
    color: var(--text-900);
}

.admin-release-option-header-row[b-eh4c7ihr40] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.admin-release-item-count[b-eh4c7ihr40] {
    display: inline-flex;
    align-items: center;
    min-height: 19px;
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.08);
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.admin-release-item-count--selected[b-eh4c7ihr40] {
    background: rgba(16, 185, 129, 0.10);
    color: #047857;
}

/* Open-Stock item pricing access */
/* ---------------------------------------------------------
   Controls item-level pricing availability, locked states,
   opt-out defaults, and WAM Admin overrides.
   --------------------------------------------------------- */

.admin-release-item-access-panel[b-eh4c7ihr40] {
    margin-left: 54px;
    padding: 9px 10px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #f8fafc;
}

    .admin-release-item-access-panel.is-readonly[b-eh4c7ihr40] {
        background: #f9fafb;
    }

.admin-release-item-access-header[b-eh4c7ihr40] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}

.admin-release-item-access-title[b-eh4c7ihr40] {
    font-size: 11px;
    font-weight: 800;
    color: var(--text-600);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.admin-release-item-access-actions[b-eh4c7ihr40] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.admin-release-item-access-list[b-eh4c7ihr40] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.admin-release-item-access-row[b-eh4c7ihr40] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
}

    .admin-release-item-access-row.is-locked[b-eh4c7ihr40] {
        background: rgba(248, 250, 252, 0.72);
    }

    .admin-release-item-access-row.is-optout-default[b-eh4c7ihr40] {
        border-color: rgba(250, 169, 75, 0.26);
        background: rgba(250, 169, 75, 0.055);
    }

    .admin-release-item-access-row.is-override[b-eh4c7ihr40] {
        border-color: rgba(37, 99, 235, 0.22);
        background: rgba(59, 130, 246, 0.045);
    }

    .admin-release-item-access-row input:disabled[b-eh4c7ihr40] {
        cursor: not-allowed;
    }

.admin-release-item-access-text[b-eh4c7ihr40] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.admin-release-item-access-number[b-eh4c7ihr40] {
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 800;
    color: var(--text-900);
}

.admin-release-item-access-description[b-eh4c7ihr40] {
    min-width: 0;
    overflow: hidden;
    color: var(--text-700);
    font-size: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.admin-release-item-access-status[b-eh4c7ihr40] {
    flex: 0 0 auto;
    font-size: 11px;
    font-weight: 700;
    color: var(--text-500);
}

.admin-release-item-access-row:not(.is-locked) .admin-release-item-access-status[b-eh4c7ihr40] {
    color: #15803d;
}

.admin-release-item-access-row.is-locked .admin-release-item-access-status[b-eh4c7ihr40] {
    color: #b45309;
}

.admin-release-item-access-row .admin-release-item-access-status--editable[b-eh4c7ihr40] {
    color: #15803d;
}

.admin-release-item-access-row .admin-release-item-access-status--locked[b-eh4c7ihr40] {
    color: #b45309;
}

.admin-release-item-access-row .admin-release-item-access-status--optout-default[b-eh4c7ihr40] {
    color: #b45309;
}

.admin-release-item-access-row .admin-release-item-access-status--override[b-eh4c7ihr40] {
    color: #1d4ed8;
}

.admin-release-item-access-help--warning[b-eh4c7ihr40] {
    color: #8a4b0f;
}

.admin-release-item-access-help[b-eh4c7ihr40] {
    margin-top: 6px;
    font-size: 11px;
    color: var(--text-500);
}

/* Pre-Pack Distributor release */
/* ---------------------------------------------------------
   Displays component items as informational content while
   keeping release selection at the Distributor level.
   --------------------------------------------------------- */

.admin-release-item-access-panel.is-prepack[b-eh4c7ihr40] {
    background: #f8fafc;
}

.admin-release-item-access-row--included[b-eh4c7ihr40] {
    cursor: default;
    border-color: rgba(22, 163, 74, 0.14);
    background: #ffffff;
}

    .admin-release-item-access-row--included:hover[b-eh4c7ihr40] {
        background: #ffffff;
    }

.admin-release-prepack-check[b-eh4c7ihr40] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #15803d;
    font-size: 12px;
    line-height: 1;
}

.admin-release-item-access-help--prepack[b-eh4c7ihr40] {
    color: #1d4ed8;
    font-weight: 600;
}

/* Distributor release summary */
/* ---------------------------------------------------------
   Displays aggregate release counts and the pricing-review action.
   --------------------------------------------------------- */
.admin-release-summary-row[b-eh4c7ihr40] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
}

.admin-release-summary-pill[b-eh4c7ihr40] {
    border: 1px solid rgba(25, 35, 68, 0.10);
    border-radius: 10px;
    padding: 8px 10px;
    background: #f8fafc;
}

    .admin-release-summary-pill span[b-eh4c7ihr40] {
        display: block;
        font-size: 11px;
        color: var(--text-500);
        margin-bottom: 2px;
    }

    .admin-release-summary-pill strong[b-eh4c7ihr40] {
        display: block;
        font-size: 18px;
        color: var(--text-900);
    }

.admin-release-view-pricing[b-eh4c7ihr40] {
    align-self: flex-start;
    margin-top: 4px;
    border: 0;
    background: transparent;
    padding: 0;
    color: var(--link-600, #2563eb);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

    .admin-release-view-pricing:hover[b-eh4c7ihr40] {
        text-decoration: underline;
    }

/* Distributor release status badges */
/* ---------------------------------------------------------
   Clarifies each Distributor release and pricing status inside
   the Admin Promotions release-progress modal.
   --------------------------------------------------------- */

.admin-release-option-status-line[b-eh4c7ihr40] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-height: 22px;
}

.admin-release-option-status[b-eh4c7ihr40] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    font-size: 12px;
    color: var(--text-500);
}

.admin-release-option-status-text[b-eh4c7ihr40] {
    color: var(--text-500);
    font-size: 12px;
}

.admin-release-status-badge[b-eh4c7ihr40] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.admin-release-status-badge--released[b-eh4c7ihr40] {
    background: #e0edff;
    color: #1d4ed8;
}

.admin-release-status-badge--progress[b-eh4c7ihr40] {
    background: #fff7ed;
    color: #c2410c;
}

.admin-release-status-badge--submitted[b-eh4c7ihr40] {
    background: #dbeafe;
    color: #1d4ed8;
}

.admin-release-status-badge--returned[b-eh4c7ihr40] {
    background: #fee2e2;
    color: #b91c1c;
}

.admin-release-status-badge--completed[b-eh4c7ihr40] {
    background: #dcfce7;
    color: #15803d;
}

.admin-release-status-badge--cancelled[b-eh4c7ihr40] {
    background: #e5e7eb;
    color: #4b5563;
}

.admin-release-status-badge--default[b-eh4c7ihr40] {
    background: #f1f5f9;
    color: #475569;
}

/* Responsive release behavior */
/* ---------------------------------------------------------
   Stacks release controls and removes the item-access inset
   for narrower Admin workspaces.
   --------------------------------------------------------- */

@media (max-width: 900px) {
    .admin-release-summary-row[b-eh4c7ihr40] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-release-toolbar[b-eh4c7ihr40],
    .admin-release-modal-footer[b-eh4c7ihr40] {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-release-toolbar-actions[b-eh4c7ihr40],
    .admin-release-footer-actions[b-eh4c7ihr40] {
        justify-content: flex-start;
    }

    .admin-release-item-access-panel[b-eh4c7ihr40] {
        margin-left: 0;
    }
}

@media (max-width: 768px) {
    .promotions-create-type-selector[b-eh4c7ihr40] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Admin/Report.razor.rz.scp.css */
/* Admin Reports workspace styles */
/* ---------------------------------------------------------
   Controls the Reports shell, tabs, shared report panels,
   Distributor Pricing report, filters, internal table scrolling,
   anchored pagination, report modals, Final Book image selection,
   asset details, downloads, and responsive behavior.
   --------------------------------------------------------- */

/* Report page shell */

.report-page[b-ybid0yn6jv] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 2px 0 0;
    overflow: hidden;
}

.report-page-header[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.report-page-title[b-ybid0yn6jv] {
    margin: 0;
    font-size: 28px;
    font-weight: 700;
    color: var(--text-900);
}

.report-page-subtitle[b-ybid0yn6jv] {
    margin: 6px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--text-600);
}

.report-active-tab-subtitle[b-ybid0yn6jv] {
    color: #6b7a90;
    font-size: 14px;
    line-height: 1.5;
}

.report-inline-emphasis[b-ybid0yn6jv] {
    color: #0b2a55;
    font-weight: 500;
}

.report-inline-chip[b-ybid0yn6jv] {
    display: inline-block;
    padding: 2px 8px;
    margin: 0 2px;
    border-radius: 999px;
    background: #eef4fb;
    color: #335c8a;
    font-weight: 500;
    font-size: 12px;
    line-height: 1.4;
    white-space: nowrap;
}

.report-shell-card[b-ybid0yn6jv] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--border-200);
    border-radius: 18px;
    overflow: hidden;
}

/* Report tabs */

.report-toolbar[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px 12px;
    padding: 8px 12px 8px;
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.9), #fff);
    flex-wrap: wrap;
}

.report-tab-strip[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    gap: 4px;
    padding: 4px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 999px;
    background: #f8fafc;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
    min-width: 0;
    flex-wrap: nowrap;
}

.report-toolbar-actions[b-ybid0yn6jv] {
    flex: 1 1 420px;
    min-width: 0;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: auto;
}

.report-active-tab-subtitle[b-ybid0yn6jv] {
    flex: 0 0 auto;
    padding: 0 16px 8px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.07);
    background: #fff;
    font-size: 13px;
    line-height: 1.45;
    color: var(--text-500);
}

.report-tab-button[b-ybid0yn6jv] {
    appearance: none;
    border: 0;
    background: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    min-width: 112px;
    padding: 0 18px;
    border-radius: 999px;
    color: var(--text-600, #475569);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transition: color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

    .report-tab-button:hover[b-ybid0yn6jv] {
        color: #1d3a6d;
        background: rgba(37, 99, 235, 0.06);
    }

.report-tab-button--active[b-ybid0yn6jv] {
    background: #fff;
    color: #1d4ed8;
    box-shadow: 0 1px 5px rgba(15, 23, 42, 0.12);
}

.report-tab-button:focus-visible[b-ybid0yn6jv] {
    outline: none;
    box-shadow: var(--focus-ring);
}

.report-shell-body[b-ybid0yn6jv] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    padding: 8px 8px 4px;
    display: flex;
    flex-direction: column;
}

/* Shared report panel layout */

.report-panel[b-ybid0yn6jv] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 8px;
}

.report-action-button[b-ybid0yn6jv] {
    min-width: 130px;
    min-height: 30px;
    padding: 4px 16px;
    font-size: 14px;
    border-radius: 8px;
    font-weight: 600;
}

.report-loading-card[b-ybid0yn6jv] {
    padding: 18px;
    border: 1px dashed rgba(29, 58, 109, 0.18);
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(29, 58, 109, 0.025), rgba(91, 196, 191, 0.02));
    color: var(--text-700);
    font-size: 14px;
}

/* Report content card and filters */

.report-content-card[b-ybid0yn6jv] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 8px;
    padding: 14px 14px 6px 14px;
    border: 1px solid var(--border-200);
    border-radius: 16px;
    background: #fff;
    box-shadow: var(--shadow-1);
    overflow: hidden;
    container-type: inline-size;
}

.report-content-card--auto[b-ybid0yn6jv] {
    grid-row: 1 / -1;
    height: 100%;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 0;
    padding: 0;
}

.report-filters-grid[b-ybid0yn6jv] {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) /* Search */
    minmax(145px, 155px) /* Manufacturer */
    minmax(120px, 125px) /* Status */
    minmax(135px, 145px) /* Image */
    minmax(125px, 135px) /* UPC */
    minmax(88px, 92px); /* Page Size */
    gap: 8px;
    align-items: end;
    min-width: 0;
}

.report-filter-control--search[b-ybid0yn6jv] {
    min-width: 0;
}

.report-filter-control[b-ybid0yn6jv] {
    min-width: 0;
}

    .report-filter-control:not(.report-filter-control--search)[b-ybid0yn6jv] {
        justify-self: stretch;
    }

    .report-filter-control .form-select[b-ybid0yn6jv],
    .report-filter-control .form-control[b-ybid0yn6jv] {
        width: 100%;
        min-width: 0;
    }

.report-filter-label[b-ybid0yn6jv] {
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 700;
    color: var(--text-700);
}

/* Distributor Pricing filter layout */
/* ---------------------------------------------------------
   Matches the compact Products report filter behavior while
   accommodating Distributor, Promo Year, Promo Month, Type,
   Status, and page-size controls.
   --------------------------------------------------------- */

.report-filters-grid--distributor-pricing[b-ybid0yn6jv] {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) /* Search */
    minmax(145px, 155px) /* Distributor */
    minmax(95px, 105px) /* Promo Year */
    minmax(120px, 130px) /* Promo Month */
    minmax(130px, 140px) /* Type */
    minmax(120px, 130px) /* Status */
    minmax(88px, 92px); /* Page Size */
    gap: 8px;
    align-items: end;
    min-width: 0;
    padding: 14px 14px 8px;
    border-bottom: 0;
    background: #ffffff;
}

    .report-filters-grid--distributor-pricing .report-filter-control[b-ybid0yn6jv] {
        min-width: 0;
    }

        .report-filters-grid--distributor-pricing .report-filter-control:not(.report-filter-control--search)[b-ybid0yn6jv] {
            justify-self: stretch;
        }

        .report-filters-grid--distributor-pricing .report-filter-control .form-select[b-ybid0yn6jv],
        .report-filters-grid--distributor-pricing .report-filter-control .form-control[b-ybid0yn6jv] {
            width: 100%;
            min-width: 0;
        }

    .report-filters-grid--distributor-pricing .report-filter-control--search[b-ybid0yn6jv]  .form-control {
        min-height: 38px;
        height: 38px;
        padding-top: 6px;
        padding-bottom: 6px;
        font-size: 11px;
        line-height: 1.2;
    }

        .report-filters-grid--distributor-pricing .report-filter-control--search[b-ybid0yn6jv]  .form-control::placeholder {
            font-size: 11px;
        }

[b-ybid0yn6jv] .report-distributor-searchable-select {
    width: 100%;
    min-width: 0;
}

    [b-ybid0yn6jv] .report-distributor-searchable-select .searchable-select__button {
        min-height: 38px;
        height: 38px;
        padding: 6px 28px 6px 12px;
        font-size: 12px;
        line-height: 1.2;
        border-color: #dbe4ef;
        border-radius: 0.55rem;
    }

    [b-ybid0yn6jv] .report-distributor-searchable-select .searchable-select__value {
        font-size: 12px;
        line-height: 1.2;
    }

    [b-ybid0yn6jv] .report-distributor-searchable-select .searchable-select__chevron {
        font-size: 12px;
    }

    [b-ybid0yn6jv] .report-distributor-searchable-select .searchable-select__menu {
        width: max(100%, 260px);
    }

    [b-ybid0yn6jv] .report-distributor-searchable-select .searchable-select__search {
        min-height: 32px;
        height: 32px;
        padding: 5px 30px 5px 10px;
        font-size: 12px;
        line-height: 1.2;
    }

        [b-ybid0yn6jv] .report-distributor-searchable-select .searchable-select__search::placeholder {
            font-size: 12px;
            line-height: 1.2;
        }

    [b-ybid0yn6jv] .report-distributor-searchable-select .searchable-select__clear {
        width: 22px;
        height: 22px;
        font-size: 12px;
    }

    [b-ybid0yn6jv] .report-distributor-searchable-select .searchable-select__option {
        min-height: 30px;
        padding: 6px 10px;
        font-size: 12px;
        line-height: 1.2;
    }

    [b-ybid0yn6jv] .report-distributor-searchable-select .searchable-select__empty {
        font-size: 12px;
    }


/* Compact report toolbar controls */
/* ---------------------------------------------------------
   Uses denser controls because report workspaces contain more
   filters than standard maintenance pages.
   --------------------------------------------------------- */

.report-filters-grid .form-control[b-ybid0yn6jv],
.report-filters-grid .form-select[b-ybid0yn6jv] {
    min-height: 38px;
    height: 38px;
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 1.2;
}

    .report-filters-grid .form-control[b-ybid0yn6jv]::placeholder {
        font-size: 12px;
        color: var(--text-500);
    }

.report-filters-grid .form-select[b-ybid0yn6jv] {
    padding-right: 28px;
    background-position: right 0.55rem center;
    background-size: 12px 12px;
}

.report-filter-label[b-ybid0yn6jv] {
    margin-bottom: 3px;
    font-size: 11px;
    font-weight: 700;
    color: var(--text-700);
}

/* Report table and sorting */

.report-table-region[b-ybid0yn6jv] {
    min-width: 0;
    min-height: 0;
    height: 100%;
    margin: 0 12px 0;
    overflow: hidden;
    background: #fff;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
}

.report-table-scroll[b-ybid0yn6jv] {
    min-width: 0;
    min-height: 0;
    width: 100%;
    overflow-x: auto;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable both-edges;
    background: #fff;
    padding-bottom: 0;
}

.report-table-region--distributor-pricing .report-table-scroll[b-ybid0yn6jv] {
    scrollbar-gutter: auto;
}

.report-table[b-ybid0yn6jv] {
    width: max-content;
    min-width: 100%;
    margin-bottom: 0;
    vertical-align: middle;
}

    .report-table thead th[b-ybid0yn6jv] {
        position: sticky;
        top: 0;
        z-index: 1;
        background: #fff;
        padding-top: 12px;
        padding-bottom: 12px;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        color: var(--text-500);
        border-bottom-width: 1px;
        white-space: nowrap;
    }

    .report-table tbody td[b-ybid0yn6jv] {
        padding-top: 10px;
        padding-bottom: 10px;
        border-color: rgba(25, 35, 68, 0.08);
        color: var(--text-900);
        font-size: 13px;
        line-height: 1.45;
    }

.report-cell-description[b-ybid0yn6jv] {
    min-width: 280px;
    font-weight: 500;
}

.report-table th[b-ybid0yn6jv],
.report-table td[b-ybid0yn6jv] {
    white-space: nowrap;
}

    .report-table td.report-cell-description[b-ybid0yn6jv] {
        white-space: normal;
        min-width: 280px;
        max-width: 360px;
    }

    .report-table td:nth-child(1)[b-ybid0yn6jv] {
        min-width: 170px;
    }

    .report-table td:nth-child(10)[b-ybid0yn6jv],
    .report-table td:nth-child(12)[b-ybid0yn6jv] {
        min-width: 180px;
    }

.report-sort-button[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    max-width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    cursor: pointer;
    white-space: nowrap;
}

    .report-sort-button:hover[b-ybid0yn6jv],
    .report-sort-button--active[b-ybid0yn6jv] {
        color: #2563eb;
    }

.report-sort-indicator[b-ybid0yn6jv] {
    font-size: 0.72rem;
    line-height: 1;
}

/* Distributor Pricing report table */
/* ---------------------------------------------------------
   Provides the final Distributor Pricing grid. The table expands
   with available workspace and begins horizontal scrolling below
   the protected 1060px minimum width.
   --------------------------------------------------------- */

.report-table--distributor-pricing[b-ybid0yn6jv] {
    width: 100%;
    min-width: 1060px;
    margin: 0;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.82rem;
}

    .report-table--distributor-pricing thead th[b-ybid0yn6jv] {
        position: sticky;
        top: 0;
        z-index: 12;
        padding: 0.58rem 0.55rem;
        border-bottom: 0;
        background: #ffffff;
        color: #64748b;
        font-size: 0.7rem;
        font-weight: 850;
        letter-spacing: 0.035em;
        text-transform: uppercase;
        white-space: nowrap;
        box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
    }

    .report-table--distributor-pricing tbody td[b-ybid0yn6jv] {
        padding: 0.56rem 0.55rem;
        vertical-align: middle;
        border-bottom: 1px solid #edf2f7;
        background: #ffffff;
        color: var(--text-900);
        font-size: 0.82rem;
        line-height: 1.35;
    }

    .report-table--distributor-pricing tbody tr:hover td[b-ybid0yn6jv] {
        background: #fbfdff;
    }

    /* Table edge alignment */
    /* ---------------------------------------------------------
     Aligns table content with the filter row and pager inset.
     --------------------------------------------------------- */
    .report-table--distributor-pricing thead th:first-child[b-ybid0yn6jv],
    .report-table--distributor-pricing tbody td:first-child[b-ybid0yn6jv] {
        padding-left: 10px;
    }

    .report-table--distributor-pricing thead th:last-child[b-ybid0yn6jv],
    .report-table--distributor-pricing tbody td:last-child[b-ybid0yn6jv] {
        padding-right: 10px;
    }

    .report-table--distributor-pricing td:nth-child(1)[b-ybid0yn6jv],
    .report-table--distributor-pricing td.report-cell-distributor[b-ybid0yn6jv] {
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: normal;
        line-height: 1.32;
    }

    /* Worksheet type column */
    .report-table--distributor-pricing th:nth-child(2)[b-ybid0yn6jv],
    .report-table--distributor-pricing td:nth-child(2)[b-ybid0yn6jv] {
        width: 96px;
        min-width: 90px;
    }

    /* Pricing status column */
    .report-table--distributor-pricing th:nth-child(3)[b-ybid0yn6jv],
    .report-table--distributor-pricing td:nth-child(3)[b-ybid0yn6jv] {
        width: 112px;
        min-width: 104px;
    }

    /* Delivery column */
    .report-table--distributor-pricing th:nth-child(4)[b-ybid0yn6jv],
    .report-table--distributor-pricing td:nth-child(4)[b-ybid0yn6jv] {
        width: 82px;
        min-width: 76px;
    }

    /* Item number column */
    .report-table--distributor-pricing th:nth-child(5)[b-ybid0yn6jv],
    .report-table--distributor-pricing td:nth-child(5)[b-ybid0yn6jv] {
        width: 92px;
        min-width: 86px;
    }

    /* Description column */
    .report-table--distributor-pricing th:nth-child(6)[b-ybid0yn6jv],
    .report-table--distributor-pricing td:nth-child(6)[b-ybid0yn6jv] {
        width: auto;
        min-width: 230px;
    }

    .report-table--distributor-pricing td:nth-child(6)[b-ybid0yn6jv],
    .report-table--distributor-pricing td.report-cell-description[b-ybid0yn6jv] {
        white-space: normal;
        overflow-wrap: break-word;
        word-break: normal;
        line-height: 1.32;
        min-width: 230px;
        max-width: none;
        font-weight: 600;
    }

    /* Participation column */
    .report-table--distributor-pricing th:nth-child(7)[b-ybid0yn6jv],
    .report-table--distributor-pricing td:nth-child(7)[b-ybid0yn6jv] {
        width: 132px;
        min-width: 124px;
    }

    /* Last Updated column */
    .report-table--distributor-pricing th:nth-child(8)[b-ybid0yn6jv],
    .report-table--distributor-pricing td:nth-child(8)[b-ybid0yn6jv] {
        width: 122px;
        min-width: 112px;
    }

        .report-table--distributor-pricing th:nth-child(8) .report-sort-button[b-ybid0yn6jv] {
            width: 100%;
            justify-content: flex-start;
            white-space: nowrap;
        }

    .report-table--distributor-pricing td:nth-child(8)[b-ybid0yn6jv],
    .report-cell-updated[b-ybid0yn6jv] {
        color: var(--text-700);
        font-size: 12px;
        line-height: 1.25;
        white-space: nowrap;
    }

    /* Expand action column */
    .report-table--distributor-pricing th:nth-child(9)[b-ybid0yn6jv],
    .report-table--distributor-pricing td:nth-child(9)[b-ybid0yn6jv] {
        width: 106px;
        min-width: 106px;
        max-width: 106px;
    }

    .report-table--distributor-pricing .report-sort-button[b-ybid0yn6jv] {
        gap: 3px;
        max-width: 100%;
        color: inherit;
        font-weight: inherit;
    }

        .report-table--distributor-pricing .report-sort-button:hover[b-ybid0yn6jv],
        .report-table--distributor-pricing .report-sort-button--active[b-ybid0yn6jv] {
            color: #2563eb;
            font-weight: 850;
        }

    .report-table--distributor-pricing .report-sort-indicator[b-ybid0yn6jv] {
        flex: 0 0 auto;
    }

    /* Sticky report action column */
    /* ---------------------------------------------------------
     Pins the expand/action column to the right edge of the report
     table viewport. The sticky cell remains visually neutral.
     --------------------------------------------------------- */
    .report-table--distributor-pricing th.report-sticky-action-cell[b-ybid0yn6jv],
    .report-table--distributor-pricing td.report-sticky-action-cell[b-ybid0yn6jv] {
        position: sticky;
        right: 0;
        z-index: 10;
        padding-left: 0.72rem;
        padding-right: 0.72rem;
        text-align: left;
        white-space: nowrap;
        background: #ffffff;
        background-clip: padding-box;
        box-shadow: none;
        border-left: 0;
    }

    .report-table--distributor-pricing thead th.report-sticky-action-cell[b-ybid0yn6jv] {
        z-index: 18;
        background: #ffffff;
        color: #64748b;
        box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
    }

    .report-table--distributor-pricing tbody tr:hover td.report-sticky-action-cell[b-ybid0yn6jv] {
        background: #fbfdff;
    }

/* Distributor Pricing grouped rows */
/* ---------------------------------------------------------
   Provides compact Manufacturer and Promotion grouping for the
   main report table, Select Images, Preview, and Excel workflows
   without converting the grid into cards.
   --------------------------------------------------------- */
.report-distributor-pricing-group-row td[b-ybid0yn6jv] {
    padding: 0 !important;
    border-top: 1px solid rgba(37, 99, 235, 0.12);
    border-bottom: 1px solid rgba(37, 99, 235, 0.16);
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.96), rgba(248, 251, 255, 0.98)) !important;
}

.report-distributor-pricing-group-header[b-ybid0yn6jv] {
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 7px 10px;
    background: transparent;
}

.report-distributor-pricing-group-title[b-ybid0yn6jv] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #0f172a;
    font-size: 12px;
    font-weight: 850;
    line-height: 1.25;
    overflow: hidden;
    white-space: nowrap;
}

.report-distributor-pricing-group-part[b-ybid0yn6jv] {
    min-width: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-distributor-pricing-group-label[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 17px;
    padding: 1px 6px;
    border: 1px solid rgba(100, 116, 139, 0.18);
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.74);
    color: #64748b;
    font-size: 9.5px;
    font-weight: 900;
    letter-spacing: 0.045em;
    line-height: 1;
    text-transform: uppercase;
}

.report-distributor-pricing-group-value[b-ybid0yn6jv] {
    min-width: 0;
    color: #0f172a;
    font-size: 12px;
    font-weight: 850;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-distributor-pricing-group-value--promotion[b-ybid0yn6jv] {
    color: #1d4ed8;
}

.report-distributor-pricing-group-separator[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 10px;
    height: 18px;
    color: #94a3b8;
    font-size: 10px;
    line-height: 1;
}

    .report-distributor-pricing-group-separator .bi[b-ybid0yn6jv] {
        font-size: 10px;
        line-height: 1;
    }

.report-distributor-pricing-group-count[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 21px;
    padding: 2px 9px;
    border: 1px solid rgba(37, 99, 235, 0.14);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    color: #334155;
    font-size: 10.75px;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
}

.report-distributor-pricing-group-row + tr td[b-ybid0yn6jv] {
    border-top: 0;
}

/* Worksheet type badges */
.report-worksheet-badge[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 80px;
    min-height: 20px;
    padding: 2px 8px;
    border-radius: 999px;
    box-sizing: border-box;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.report-worksheet-badge--prepack[b-ybid0yn6jv] {
    background: rgba(63, 111, 159, 0.12);
    color: rgb(63, 111, 159);
    border: 1px solid rgba(63, 111, 159, 0.16);
}

.report-worksheet-badge--openstock[b-ybid0yn6jv] {
    background: rgba(142, 59, 103, 0.10);
    color: rgb(142, 59, 103);
    border: 1px solid rgba(142, 59, 103, 0.16);
}

.report-cell-number[b-ybid0yn6jv] {
    text-align: right;
}

.report-table-action-cell[b-ybid0yn6jv] {
    text-align: left;
}

.report-detail-row td[b-ybid0yn6jv] {
    padding: 0 7px 10px;
    background: #fff;
    border-top: 0;
}

.report-detail-panel[b-ybid0yn6jv] {
    display: grid;
    grid-template-columns: minmax(0, 675px) minmax(260px, 360px);
    justify-content: start;
    gap: 10px;
    max-width: 1050px;
    padding: 10px;
    border: 1px solid rgba(29, 58, 109, 0.12);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.96), rgba(255, 255, 255, 0.98));
}

.report-detail-section[b-ybid0yn6jv] {
    min-width: 0;
}

.report-detail-section-title[b-ybid0yn6jv] {
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--text-700);
}

/* Expanded Distributor Pricing context */
/* ---------------------------------------------------------
   Shows projected, working, submitted, returned, or final
   calculation context together with item participation.
   --------------------------------------------------------- */
.report-detail-section-title-row[b-ybid0yn6jv] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    margin-bottom: 8px;
}

    .report-detail-section-title-row .report-detail-section-title[b-ybid0yn6jv] {
        margin-bottom: 0;
        flex: 0 0 auto;
    }

.report-detail-context-badges[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 5px;
    min-width: 0;
    flex: 0 0 auto;
    flex-wrap: wrap;
}

.report-detail-grid[b-ybid0yn6jv] {
    display: grid;
    grid-template-columns: repeat(5, minmax(92px, 1fr));
    gap: 7px;
}

.report-detail-item[b-ybid0yn6jv] {
    min-width: 0;
    padding: 7px 8px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #fff;
}

.report-detail-label[b-ybid0yn6jv] {
    display: block;
    margin-bottom: 3px;
    font-size: 11px;
    font-weight: 700;
    color: var(--text-500);
}

.report-detail-value[b-ybid0yn6jv] {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: var(--text-900);
}

.report-detail-notes-grid[b-ybid0yn6jv] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
}

.report-detail-note[b-ybid0yn6jv] {
    min-width: 0;
    padding: 8px 9px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #fff;
}

.report-detail-note-value[b-ybid0yn6jv] {
    display: block;
    min-height: 18px;
    max-height: 68px;
    overflow: auto;
    color: var(--text-900);
    font-size: 12px;
    line-height: 1.4;
    white-space: pre-wrap;
}

/* Status and empty states */

.report-status-badge-distributor-pricing[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    min-width: 75px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.report-empty-state[b-ybid0yn6jv] {
    padding: 18px;
    color: var(--text-600);
    font-size: 13px;
}

/* Distributor Pricing participation badges */
/* ---------------------------------------------------------
   Shows Distributor and item-specific participation in collapsed
   rows for compact WAM Admin review.
   --------------------------------------------------------- */
.report-participation-badge[b-ybid0yn6jv],
.report-context-badge[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    padding: 2px 8px;
    border-radius: 999px;
    box-sizing: border-box;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.report-participation-badge--participating[b-ybid0yn6jv] {
    background: rgba(91, 196, 191, 0.16);
    color: #206a66;
    border: 1px solid rgba(91, 196, 191, 0.18);
}

.report-participation-badge--pending[b-ybid0yn6jv] {
    background: rgba(100, 116, 139, 0.12);
    color: #475569;
    border: 1px solid rgba(100, 116, 139, 0.14);
}

.report-participation-badge--not-participating[b-ybid0yn6jv] {
    background: rgba(148, 163, 184, 0.16);
    color: #475569;
    border: 1px solid rgba(148, 163, 184, 0.18);
}

.report-participation-badge--needs-attention[b-ybid0yn6jv] {
    background: rgba(245, 158, 11, 0.14);
    color: #9a5b00;
    border: 1px solid rgba(245, 158, 11, 0.22);
}

/* Calculation context badges */
/* ---------------------------------------------------------
   Clarifies projected, working-draft, submitted, returned,
   final-approved, cancelled, and default calculation states.
   --------------------------------------------------------- */
.report-context-badge--projected[b-ybid0yn6jv] {
    background: rgba(59, 130, 246, 0.10);
    color: #1d4ed8;
    border: 1px solid rgba(59, 130, 246, 0.16);
}

.report-context-badge--working[b-ybid0yn6jv] {
    background: rgba(245, 158, 11, 0.14);
    color: #9a5b00;
    border: 1px solid rgba(245, 158, 11, 0.22);
}

.report-context-badge--submitted[b-ybid0yn6jv] {
    background: rgba(91, 196, 191, 0.16);
    color: #206a66;
    border: 1px solid rgba(91, 196, 191, 0.18);
}

.report-context-badge--returned[b-ybid0yn6jv] {
    background: rgba(241, 95, 87, 0.12);
    color: #9d423c;
    border: 1px solid rgba(241, 95, 87, 0.18);
}

.report-context-badge--final[b-ybid0yn6jv] {
    background: rgba(34, 197, 94, 0.12);
    color: #15803d;
    border: 1px solid rgba(34, 197, 94, 0.18);
}

.report-context-badge--cancelled[b-ybid0yn6jv],
.report-context-badge--default[b-ybid0yn6jv] {
    background: rgba(100, 116, 139, 0.12);
    color: #475569;
    border: 1px solid rgba(100, 116, 139, 0.14);
}

/* Report pager */

.report-pager[b-ybid0yn6jv] {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 6px 14px 4px;
    background: #f8fafc;
    border-top: 1px solid rgba(25, 35, 68, 0.06);
    flex-wrap: wrap;
}

.report-pager-meta[b-ybid0yn6jv] {
    color: var(--text-600, #475569);
    font-size: 12px;
    font-weight: 500;
}

.report-pager-actions[b-ybid0yn6jv] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.report-pager-page[b-ybid0yn6jv] {
    min-width: 88px;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 600;
    text-align: center;
}

/* Future report placeholders */
.report-content-card--auto > .report-placeholder-card[b-ybid0yn6jv] {
    align-self: start;
    margin: 14px;
}

.report-placeholder-card[b-ybid0yn6jv] {
    padding: 18px 18px 16px;
    border: 1px dashed rgba(29, 58, 109, 0.18);
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(29, 58, 109, 0.025), rgba(91, 196, 191, 0.02));
}

.report-placeholder-title[b-ybid0yn6jv] {
    margin: 0 0 8px;
    font-size: 16px;
    font-weight: 700;
    color: var(--text-900);
}

.report-placeholder-text[b-ybid0yn6jv] {
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
    color: var(--text-600);
}

/* Shared report modal shell */
/* ---------------------------------------------------------
   Provides fixed overlay primitives for report-level actions.
   Keeps modal content above the report workspace and prevents
   table scroll regions from clipping modal content.
   --------------------------------------------------------- */

.report-modal-backdrop[b-ybid0yn6jv] {
    position: fixed;
    inset: 0;
    z-index: 1040;
    background: rgba(15, 23, 42, 0.46);
    backdrop-filter: blur(1px);
}

.report-modal-shell[b-ybid0yn6jv] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    pointer-events: none;
}

.report-modal-card[b-ybid0yn6jv] {
    pointer-events: auto;
    display: flex;
    flex-direction: column;
    min-width: 0;
    max-width: calc(100vw - 48px);
    max-height: calc(100vh - 48px);
    overflow: hidden;
    border: 1px solid rgba(25, 35, 68, 0.10);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 24px 72px rgba(15, 23, 42, 0.24);
}

.report-modal-header[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px 14px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
    background: #ffffff;
}

.report-modal-title[b-ybid0yn6jv] {
    margin: 0;
    color: var(--text-900, #0f172a);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.15;
}

.report-modal-subtitle[b-ybid0yn6jv] {
    margin: 4px 0 0;
    color: var(--text-500, #64748b);
    font-size: 13px;
    line-height: 1.35;
}

.report-modal-body[b-ybid0yn6jv] {
    flex: 1 1 auto;
    min-height: 0;
    padding: 16px 20px;
    overflow: auto;
}

.report-modal-footer[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 12px 20px 14px;
    border-top: 1px solid rgba(25, 35, 68, 0.08);
    background: #ffffff;
}

/* Report modal download progress */
.report-modal-footer-progress[b-ybid0yn6jv] {
    flex: 1 1 auto;
    min-width: 0;
    padding-right: 16px;
}

.report-download-progress[b-ybid0yn6jv] {
    width: min(360px, 100%);
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.24);
}

.report-download-progress-bar[b-ybid0yn6jv] {
    width: 42%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #1d4ed8, #3b82f6, #1d4ed8);
    animation: report-download-progress-slide-b-ybid0yn6jv 1.05s ease-in-out infinite;
}

.report-download-progress-text[b-ybid0yn6jv] {
    margin-top: 6px;
    color: var(--text-600, #475569);
    font-size: 12px;
    font-weight: 600;
}

.report-image-selection-download-button[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
}

    .report-image-selection-download-button .bi[b-ybid0yn6jv] {
        font-size: 14px;
        line-height: 1;
    }

@keyframes report-download-progress-slide-b-ybid0yn6jv {
    0% {
        transform: translateX(-115%);
    }

    100% {
        transform: translateX(260%);
    }
}

/* Distributor Pricing image selection modal */
/* ---------------------------------------------------------
   Supports WAM Admin review and selection of Product Catalog
   image assets connected to the current final Distributor
   Pricing report, including ZIP download progress.
   --------------------------------------------------------- */

.report-image-selection-modal[b-ybid0yn6jv] {
    width: min(1080px, calc(100vw - 64px));
}

.report-image-selection-body[b-ybid0yn6jv] {
    min-height: 0;
    max-height: calc(100vh - 190px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.report-image-selection-summary[b-ybid0yn6jv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    padding: 8px 10px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #f8fafc;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 700;
}

.report-image-selection-list[b-ybid0yn6jv] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.report-image-selection-item[b-ybid0yn6jv] {
    padding: 10px;
    border: 1px solid rgba(25, 35, 68, 0.10);
    border-radius: 12px;
    background: #ffffff;
}

.report-image-selection-item-header[b-ybid0yn6jv] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.report-image-selection-item-title[b-ybid0yn6jv] {
    color: var(--text-900, #0f172a);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.25;
}

.report-image-selection-item-meta[b-ybid0yn6jv] {
    margin-top: 2px;
    color: var(--text-500, #64748b);
    font-size: 11.5px;
    line-height: 1.3;
}

.report-image-selection-item-count[b-ybid0yn6jv] {
    flex: 0 0 auto;
    color: var(--text-500, #64748b);
    font-size: 11.5px;
    font-weight: 700;
    white-space: nowrap;
}

.report-image-selection-assets[b-ybid0yn6jv] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.report-image-selection-card[b-ybid0yn6jv] {
    min-width: 0;
    display: grid;
    grid-template-columns: auto 50px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    padding: 8px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #f8fafc;
    cursor: pointer;
}

.report-image-selection-thumb-wrap[b-ybid0yn6jv],
.report-image-selection-thumb-empty[b-ybid0yn6jv] {
    width: 50px;
    height: 50px;
}

.report-image-selection-thumb[b-ybid0yn6jv] {
    width: 50px;
    height: 50px;
    border: 1px solid rgba(25, 35, 68, 0.10);
    border-radius: 8px;
    background: #ffffff;
    object-fit: contain;
}

.report-image-selection-thumb-empty[b-ybid0yn6jv] {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed rgba(100, 116, 139, 0.28);
    border-radius: 8px;
    background: #ffffff;
    color: var(--text-500, #64748b);
    font-size: 10px;
    font-weight: 700;
    text-align: center;
}

.report-image-selection-copy[b-ybid0yn6jv] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.report-image-selection-image-title[b-ybid0yn6jv] {
    display: block;
    max-width: 100%;
    min-width: 0;
    color: var(--text-900, #0f172a);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-image-selection-title-tooltip[b-ybid0yn6jv] {
    position: relative;
    display: block;
    max-width: 100%;
    min-width: 0;
    overflow: visible;
}

.report-image-selection-image-meta[b-ybid0yn6jv] {
    color: var(--text-600, #475569);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
}

.report-image-selection-image-meta-preferred-label[b-ybid0yn6jv] {
    color: #64748b;
    font-weight: 800;
}

.report-image-selection-image-meta-selected[b-ybid0yn6jv] {
    color: #15803d;
    font-weight: 850;
}

.report-image-selection-file[b-ybid0yn6jv] {
    color: var(--text-500, #64748b);
    font-size: 10.5px;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

/* Missing image guidance */
.report-image-selection-missing[b-ybid0yn6jv] {
    margin-top: 10px;
    padding: 12px 14px;
    border: 1px dashed rgba(148, 163, 184, 0.75);
    border-radius: 10px;
    background: #f8fafc;
}

.report-image-selection-missing-title[b-ybid0yn6jv] {
    color: #334155;
    font-size: 13px;
    font-weight: 800;
}

.report-image-selection-missing-text[b-ybid0yn6jv] {
    margin-top: 2px;
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
}

/* Image selection toolbar */
.report-image-selection-summary--toolbar[b-ybid0yn6jv] {
    flex: 0 0 auto;
    align-items: center;
    margin-bottom: 10px;
    background: #f8fafc;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.055);
}

.report-image-selection-summary-counts[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.report-image-selection-toolbar-actions[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    flex-wrap: wrap;
}

.report-image-selection-toolbar-button[b-ybid0yn6jv] {
    appearance: none;
    border: 0;
    background: transparent;
    color: #1d4ed8;
    font-size: 11.75px;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
}

.report-image-selection-toolbar-button--context[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.report-image-selection-toolbar-label[b-ybid0yn6jv] {
    color: #64748b;
    font-weight: 800;
}

.report-image-selection-toolbar-button:disabled[b-ybid0yn6jv] {
    color: #94a3b8;
    cursor: not-allowed;
    text-decoration: none;
}

    .report-image-selection-toolbar-button:disabled .report-image-selection-toolbar-label[b-ybid0yn6jv] {
        color: #94a3b8;
    }

.report-image-selection-toolbar-button:hover[b-ybid0yn6jv],
.report-image-selection-toolbar-button:focus-visible[b-ybid0yn6jv] {
    color: #173a78;
    text-decoration: underline;
}

.report-image-selection-toolbar-button--muted[b-ybid0yn6jv] {
    color: #64748b;
}

.report-image-selection-toolbar-divider[b-ybid0yn6jv] {
    width: 1px;
    height: 14px;
    background: rgba(100, 116, 139, 0.28);
}

.report-image-selection-list--compact[b-ybid0yn6jv] {
    gap: 5px;
}

.report-image-selection-list-scroll[b-ybid0yn6jv] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 8px 10px;
    border: 1px solid rgba(37, 99, 235, 0.14);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(248, 251, 255, 0.96), rgba(255, 255, 255, 0.98));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
    scrollbar-gutter: stable;
}

/* Final Book image-selection groups */

.report-image-selection-group[b-ybid0yn6jv] {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
}

    .report-image-selection-group + .report-image-selection-group[b-ybid0yn6jv] {
        margin-top: 5px;
    }

.report-image-selection-group-header[b-ybid0yn6jv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 34px;
    padding: 7px 10px;
    border-top: 1px solid rgba(37, 99, 235, 0.12);
    border-bottom: 1px solid rgba(37, 99, 235, 0.16);
    border-radius: 0;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.96), rgba(248, 251, 255, 0.98));
}

.report-image-selection-group-title[b-ybid0yn6jv] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #0f172a;
    font-size: 12px;
    font-weight: 850;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-image-selection-group-title-part[b-ybid0yn6jv] {
    min-width: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-image-selection-group-title-label[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 17px;
    padding: 1px 6px;
    border: 1px solid rgba(100, 116, 139, 0.18);
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.74);
    color: #64748b;
    font-size: 9.5px;
    font-weight: 900;
    letter-spacing: 0.045em;
    line-height: 1;
    text-transform: uppercase;
}

.report-image-selection-group-title-value[b-ybid0yn6jv] {
    min-width: 0;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-image-selection-group-title-part[b-ybid0yn6jv],
.report-image-selection-group-title-separator[b-ybid0yn6jv] {
    transform: translateY(-1px);
}

.report-image-selection-group-title-part--manufacturer .report-image-selection-group-title-value[b-ybid0yn6jv] {
    color: #0f172a;
    font-weight: 850;
}

.report-image-selection-group-title-part--promotion .report-image-selection-group-title-value[b-ybid0yn6jv] {
    color: #1d4ed8;
    font-weight: 850;
}

.report-image-selection-group-title-separator[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 10px;
    height: 18px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #94a3b8;
    font-size: 10px;
    line-height: 1;
}

    .report-image-selection-group-title-separator .bi[b-ybid0yn6jv] {
        font-size: 10px;
        line-height: 1;
    }

.report-image-selection-group-summary[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

    .report-image-selection-group-summary span[b-ybid0yn6jv] {
        display: inline-flex;
        align-items: center;
        min-height: 22px;
        padding: 2px 9px;
        border: 1px solid rgba(37, 99, 235, 0.14);
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.92);
        color: #334155;
        font-size: 11px;
        font-weight: 800;
        line-height: 1;
        white-space: nowrap;
    }

.report-image-selection-group-body[b-ybid0yn6jv] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 8px;
}

/* Final Book image-selection item rows */

.report-image-selection-row[b-ybid0yn6jv] {
    border: 1px solid rgba(37, 99, 235, 0.10);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.035);
    overflow: visible;
}

    .report-image-selection-row + .report-image-selection-row[b-ybid0yn6jv] {
        margin-top: 0;
    }

.report-image-selection-row--expanded[b-ybid0yn6jv] {
    border-color: rgba(37, 99, 235, 0.24);
    background: linear-gradient(180deg, rgba(248, 251, 255, 0.98), rgba(239, 246, 255, 0.74));
    box-shadow: inset 3px 0 0 rgba(37, 99, 235, 0.24), 0 10px 24px rgba(15, 23, 42, 0.055);
}

.report-image-selection-row-main[b-ybid0yn6jv] {
    display: grid;
    grid-template-columns: 26px 54px minmax(390px, 1fr) minmax(132px, 160px) 78px 138px;
    gap: 12px;
    align-items: center;
    min-height: 68px;
    padding: 8px 12px;
}

.report-image-selection-row-check[b-ybid0yn6jv] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.report-image-selection-row-thumb[b-ybid0yn6jv] {
    width: 54px;
    height: 54px;
}

.report-image-selection-row-image[b-ybid0yn6jv],
.report-image-selection-row-image-empty[b-ybid0yn6jv] {
    width: 54px;
    height: 54px;
    border: 1px solid rgba(25, 35, 68, 0.10);
    border-radius: 8px;
    background: #ffffff;
}

.report-image-selection-row-image[b-ybid0yn6jv] {
    object-fit: contain;
}

.report-image-selection-row-image-empty[b-ybid0yn6jv] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #64748b;
    font-size: 10px;
    font-weight: 800;
    text-align: center;
}

.report-image-selection-row-copy[b-ybid0yn6jv] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.report-image-selection-row-title[b-ybid0yn6jv] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #0f172a;
    font-size: 12.5px;
    font-weight: 800;
    line-height: 1.25;
    overflow: hidden;
    white-space: nowrap;
}

.report-image-selection-row-code-group[b-ybid0yn6jv] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.report-image-selection-row-title-separator[b-ybid0yn6jv] {
    flex: 0 0 auto;
    width: 1px;
    height: 18px;
    background: rgba(148, 163, 184, 0.38);
}

.report-image-selection-row-mfg-entity[b-ybid0yn6jv] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    overflow: hidden;
}

.report-image-selection-row-code-label[b-ybid0yn6jv] {
    color: #64748b;
    font-size: 10.25px;
    font-weight: 850;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.report-image-selection-row-code[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 18px;
    padding: 1px 6px;
    border-radius: 6px;
    font-size: 11.25px;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
}

.report-image-selection-row-code--distributor[b-ybid0yn6jv] {
    background: rgba(37, 99, 235, 0.08);
    color: #1d4ed8;
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.14);
}

.report-image-selection-row-code--manufacturer[b-ybid0yn6jv] {
    background: rgba(100, 116, 139, 0.08);
    color: #334155;
    box-shadow: inset 0 0 0 1px rgba(100, 116, 139, 0.16);
}

.report-image-selection-row-description[b-ybid0yn6jv] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-image-selection-row-meta[b-ybid0yn6jv] {
    color: #64748b;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.25;
}

.report-image-selection-row-file[b-ybid0yn6jv] {
    color: #6b7a90;
    font-size: 10.5px;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-image-selection-row-badges[b-ybid0yn6jv] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.report-image-selection-preferred-text[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    min-width: 0;
    color: #64748b;
    font-size: 11.25px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.report-image-selection-preferred-label[b-ybid0yn6jv] {
    color: #64748b;
    font-weight: 800;
}

.report-image-selection-preferred-value[b-ybid0yn6jv] {
    color: #1d4ed8;
    font-weight: 850;
}

.report-image-selection-source-badge[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 21px;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10.75px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.report-image-selection-source-badge--missing[b-ybid0yn6jv] {
    background: rgba(239, 68, 68, 0.10);
    color: #b91c1c;
    border: 1px solid rgba(239, 68, 68, 0.18);
}

.report-image-selection-row-selected[b-ybid0yn6jv] {
    color: #334155;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    text-align: right;
}

.report-image-selection-row-action[b-ybid0yn6jv] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.report-image-selection-show-button[b-ybid0yn6jv] {
    appearance: none;
    border: 0;
    background: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    max-width: 100%;
    color: #1d4ed8;
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
    white-space: nowrap;
}

    .report-image-selection-show-button:hover[b-ybid0yn6jv],
    .report-image-selection-show-button:focus-visible[b-ybid0yn6jv] {
        color: #173a78;
        text-decoration: underline;
    }

/* Final Book item-level asset options */

.report-image-selection-expanded[b-ybid0yn6jv] {
    margin: 0 10px 10px 90px;
    padding: 10px;
    border: 1px solid rgba(37, 99, 235, 0.12);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.report-image-selection-expanded-title[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    color: #334155;
    font-size: 11.5px;
    font-weight: 850;
    letter-spacing: 0.015em;
}

.report-image-selection-expanded-hint[b-ybid0yn6jv] {
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0;
}

    .report-image-selection-expanded-hint[b-ybid0yn6jv]::before {
        content: "·";
        margin-right: 6px;
        color: #94a3b8;
    }

.report-image-selection-assets--compact[b-ybid0yn6jv] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.report-image-selection-card--compact[b-ybid0yn6jv] {
    grid-template-columns: auto 46px minmax(0, 1fr);
    min-height: 62px;
    border-color: rgba(25, 35, 68, 0.08);
    background: #ffffff;
}

.report-image-selection-card--selected[b-ybid0yn6jv] {
    border-color: rgba(37, 99, 235, 0.42);
    background: rgba(239, 246, 255, 0.92);
    box-shadow: inset 3px 0 0 rgba(37, 99, 235, 0.42);
}

.report-image-selection-missing--compact[b-ybid0yn6jv] {
    margin: 0 10px 10px 90px;
}

.report-image-selection-thumb-button[b-ybid0yn6jv] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

    .report-image-selection-thumb-button:focus-visible[b-ybid0yn6jv] {
        outline: 2px solid rgba(37, 99, 235, 0.38);
        outline-offset: 2px;
        border-radius: 8px;
    }

.report-image-selection-hover-preview[b-ybid0yn6jv] {
    position: absolute;
    left: calc(100% + 12px);
    top: 0;
    z-index: 1090;
    display: none;
    width: 200px;
    height: 200px;
    padding: 8px;
    border: 1px solid rgba(25, 35, 68, 0.14);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
    transform: none;
    pointer-events: none;
}

.report-image-selection-row:last-child .report-image-selection-hover-preview[b-ybid0yn6jv] {
    top: auto;
    bottom: 0;
}

.report-image-selection-hover-preview img[b-ybid0yn6jv] {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.report-image-selection-thumb-button:hover .report-image-selection-hover-preview[b-ybid0yn6jv],
.report-image-selection-thumb-button:focus-visible .report-image-selection-hover-preview[b-ybid0yn6jv] {
    display: block;
}

/* Image asset detail modal */
.report-modal-backdrop--image-detail[b-ybid0yn6jv] {
    z-index: 1070;
    background: rgba(15, 23, 42, 0.32);
}

.report-modal-shell--image-detail[b-ybid0yn6jv] {
    z-index: 1080;
}

.report-image-detail-modal[b-ybid0yn6jv] {
    width: min(840px, calc(100vw - 72px));
}

.report-image-detail-layout[b-ybid0yn6jv] {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.report-image-detail-preview[b-ybid0yn6jv] {
    min-height: 260px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(25, 35, 68, 0.10);
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
}

.report-image-detail-image[b-ybid0yn6jv] {
    width: 100%;
    height: 260px;
    object-fit: contain;
}

.report-image-detail-empty[b-ybid0yn6jv] {
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
}

.report-image-detail-fields[b-ybid0yn6jv] {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.report-image-detail-field[b-ybid0yn6jv] {
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #ffffff;
}

.report-image-detail-field--wide[b-ybid0yn6jv] {
    grid-column: 1 / -1;
}

.report-image-detail-label[b-ybid0yn6jv] {
    margin-bottom: 4px;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.report-image-detail-value[b-ybid0yn6jv] {
    color: #0f172a;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

/* Report expand and collapse commands */
/* ---------------------------------------------------------
   Provides one compact link-action treatment for report-level
   and row-level expansion while preserving sticky action cells.
   --------------------------------------------------------- */

.report-expand-command[b-ybid0yn6jv] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    min-height: 20px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--link-600, #2563eb);
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    text-decoration: none;
    transition: color 0.15s ease;
}

    .report-expand-command i[b-ybid0yn6jv] {
        width: 13px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: currentColor;
        font-size: 11px;
        line-height: 1;
    }

    .report-expand-command:hover[b-ybid0yn6jv] {
        color: var(--link-700, #1d4ed8);
        background: transparent;
    }

        .report-expand-command:hover span[b-ybid0yn6jv] {
            text-decoration: underline;
            text-underline-offset: 2px;
        }

    .report-expand-command:focus[b-ybid0yn6jv],
    .report-expand-command:active[b-ybid0yn6jv] {
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .report-expand-command:focus-visible[b-ybid0yn6jv] {
        outline: 2px solid rgba(37, 99, 235, 0.28);
        outline-offset: 3px;
        border-radius: 3px;
    }

.report-expand-command--all[b-ybid0yn6jv],
.report-expand-command--row[b-ybid0yn6jv] {
    margin-left: auto;
}


/* Responsive behavior */

@container (max-width: 860px) {
    .report-image-selection-assets[b-ybid0yn6jv] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .report-image-detail-layout[b-ybid0yn6jv] {
        grid-template-columns: 1fr;
    }

    .report-image-detail-preview[b-ybid0yn6jv],
    .report-image-detail-image[b-ybid0yn6jv] {
        min-height: 220px;
        height: 220px;
    }
}

@container (max-width: 980px) {
    .report-image-selection-row-main[b-ybid0yn6jv] {
        grid-template-columns: 26px 54px minmax(180px, 1fr) 1fr;
    }

    .report-image-selection-row-badges[b-ybid0yn6jv],
    .report-image-selection-row-selected[b-ybid0yn6jv],
    .report-image-selection-row-action[b-ybid0yn6jv] {
        grid-column: 3 / -1;
    }

    .report-image-selection-row-selected[b-ybid0yn6jv] {
        text-align: left;
    }

    .report-image-selection-assets--compact[b-ybid0yn6jv] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1240px) {
    .report-filters-grid[b-ybid0yn6jv] {
        grid-template-columns: repeat(3, minmax(160px, 1fr));
    }

    .report-filter-control--search[b-ybid0yn6jv] {
        grid-column: 1 / -1;
    }
}

@container (max-width: 980px) {
    .report-detail-panel[b-ybid0yn6jv] {
        grid-template-columns: 1fr;
    }

    .report-detail-grid[b-ybid0yn6jv] {
        grid-template-columns: repeat(2, minmax(95px, 1fr));
    }
}

@media (max-width: 900px) {
    .report-filters-grid[b-ybid0yn6jv] {
        grid-template-columns: 1fr;
    }

    .report-filter-control--search[b-ybid0yn6jv] {
        grid-column: auto;
    }
}
/* /Components/Pages/Admin/UserAccessManagement.razor.rz.scp.css */
/* =========================================================
   UserAccessManagement.razor.css
   ---------------------------------------------------------
   Scope:
   - Users page shell
   - Summary cards
   - Manage Users card shell
   - Invite Users modal
   - Queue layout
   - Toolbar / filters
   - Users table
   - Sort controls
   - Sticky Actions column
   - Pager
   - Responsive layout
   ========================================================= */


/* =========================================================
   Page shell
   ========================================================= */

.ua-page[b-e3sr4zjg04] {
  flex: 1 1 auto;
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 2px;
  overflow: hidden;
  container-type: inline-size;
  container-name: ua-page;
}

.ua-workspace[b-e3sr4zjg04] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow: hidden;
}

.ua-header[b-e3sr4zjg04] {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.ua-header-copy[b-e3sr4zjg04] {
  min-width: 0;
  flex: 1 1 auto;
}

.ua-header-actions[b-e3sr4zjg04] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.ua-title[b-e3sr4zjg04] {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: var(--text-900);
}

.ua-subtitle[b-e3sr4zjg04] {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--text-500);
}

.ua-primary-button[b-e3sr4zjg04] {
  min-width: 150px;
  min-height: 30px;
  padding: 4px 16px;
  font-size: 14px;
  border-radius: 8px;
  font-weight: 600;
}

/* =========================================================
   Companies + Users module tabs
   ---------------------------------------------------------
   Compact left-aligned pill navigation for switching between
   company and user administration workspaces. Match the
   Reports and Books tab behavior while using a wider tab
   width for this two-option administration module.
   ========================================================= */

.companies-users-tabs[b-e3sr4zjg04] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  width: fit-content;
  max-width: 100%;
  gap: 4px;
  padding: 4px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 999px;
  background: #f8fafc;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
  min-width: 0;
  flex-wrap: wrap;
}

  /* NavLink renders an anchor from inside another component, so ::deep is required. */
  .companies-users-tabs[b-e3sr4zjg04]  a.companies-users-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    min-width: 150px;
    padding: 0 18px;
    border-radius: 999px;
    color: var(--text-600, #475569);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
  }

    .companies-users-tabs[b-e3sr4zjg04]  a.companies-users-tab:hover {
      color: #1d3a6d;
      background: rgba(37, 99, 235, 0.06);
      text-decoration: none;
    }

    .companies-users-tabs[b-e3sr4zjg04]  a.companies-users-tab.active {
      background: #fff;
      color: #1d4ed8;
      box-shadow: 0 1px 5px rgba(15, 23, 42, 0.12);
    }

    .companies-users-tabs[b-e3sr4zjg04]  a.companies-users-tab:focus-visible {
      outline: none;
      box-shadow: var(--focus-ring);
    }

/* =========================================================
   Summary cards
   ========================================================= */

.ua-summary-strip[b-e3sr4zjg04] {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.ua-summary-card[b-e3sr4zjg04] {
  padding: 8px 12px;
  background: #fff;
  border: 1px solid var(--border-200);
  border-radius: 14px;
  box-shadow: var(--shadow-1);
}

.ua-summary-card-button[b-e3sr4zjg04] {
  appearance: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

  .ua-summary-card-button:hover[b-e3sr4zjg04] {
    border-color: rgba(29, 58, 109, 0.18);
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.06);
  }

  .ua-summary-card-button.is-active[b-e3sr4zjg04] {
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.04), 0 3px 10px rgba(15, 23, 42, 0.06);
  }

  .ua-summary-card-button:focus-visible[b-e3sr4zjg04] {
    outline: none;
    box-shadow: var(--focus-ring);
  }

.ua-summary-label[b-e3sr4zjg04] {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-600);
}

.ua-summary-value[b-e3sr4zjg04] {
  margin: 0;
  font-size: 22px;
  line-height: 1;
  font-weight: 700;
  color: var(--text-900);
}

.ua-summary-meta[b-e3sr4zjg04] {
  margin-top: 6px;
  font-size: 12px;
  color: var(--text-500);
}

.ua-summary-card--neutral[b-e3sr4zjg04] {
  border-color: rgba(117, 140, 167, 0.22);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.035), #fff);
}

.ua-summary-card--info[b-e3sr4zjg04] {
  border-color: rgba(117, 140, 167, 0.24);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.04), #fff);
}

.ua-summary-card--success[b-e3sr4zjg04] {
  border-color: rgba(91, 196, 191, 0.38);
  background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.ua-summary-card--warning[b-e3sr4zjg04] {
  border-color: rgba(250, 169, 75, 0.32);
  background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

.ua-summary-card--neutral.is-active[b-e3sr4zjg04] {
  border-color: rgba(117, 140, 167, 0.34);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.08), #fff);
}

.ua-summary-card--info.is-active[b-e3sr4zjg04] {
  border-color: rgba(117, 140, 167, 0.34);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.08), #fff);
}

.ua-summary-card--success.is-active[b-e3sr4zjg04] {
  border-color: rgba(91, 196, 191, 0.48);
  background: linear-gradient(180deg, rgba(91, 196, 191, 0.10), #fff);
}

.ua-summary-card--warning.is-active[b-e3sr4zjg04] {
  border-color: rgba(250, 169, 75, 0.42);
  background: linear-gradient(180deg, rgba(250, 169, 75, 0.10), #fff);
}

/* =========================================================
   Shared card shell
   ========================================================= */

.ua-card[b-e3sr4zjg04] {
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-200);
  border-radius: 18px;
  /*box-shadow: var(--shadow-1);*/
  overflow: hidden;
  margin-bottom: 0;
  padding: 0;
}

.ua-card-header[b-e3sr4zjg04] {
  display: flex;
  align-items: center;
  gap: 0;
  margin-bottom: 0;
}

.ua-card-title[b-e3sr4zjg04] {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--text-900);
}

.ua-card-subtitle[b-e3sr4zjg04] {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--text-500);
}

/* =========================================================
   Manage Users list card
   ========================================================= */

.ua-manage-section[b-e3sr4zjg04] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.ua-manage-card[b-e3sr4zjg04] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.ua-panel-header[b-e3sr4zjg04] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 12px 8px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.ua-panel-header-copy[b-e3sr4zjg04] {
  min-width: 0;
  flex: 1 1 auto;
}

.ua-panel-header-actions[b-e3sr4zjg04] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.ua-access-body[b-e3sr4zjg04] {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  overflow: hidden;
  margin-bottom: 5px;
  padding-bottom: 14px;
}

.ua-state[b-e3sr4zjg04] {
  padding: 18px 16px;
  color: var(--text-600);
}

/* =========================================================
   Toolbar / filters
   ========================================================= */

.ua-controls[b-e3sr4zjg04] {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 180px 160px 140px 88px;
  gap: 10px;
  align-items: end;
  padding: 14px 12px 0;
  margin-bottom: 0;
  flex: 0 0 auto;
}

.ua-control[b-e3sr4zjg04] {
  min-width: 0;
}

.ua-control-label[b-e3sr4zjg04] {
  display: block;
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-700, #334155);
}

.ua-search[b-e3sr4zjg04],
.ua-select[b-e3sr4zjg04],
.ua-page-size[b-e3sr4zjg04] {
  width: 100%;
  min-height: 38px;
}

/* =========================================================
   Table shell
   ========================================================= */

.ua-table-region[b-e3sr4zjg04] {
  min-height: 0;
  height: 100%;
  margin: 12px 12px 0;
  background: #fff;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 10px;
  overflow: hidden;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
}

.ua-table-wrap[b-e3sr4zjg04] {
  min-height: 0;
  height: 100%;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  background: #fff;
}

  .ua-table-wrap.table-responsive[b-e3sr4zjg04] {
    margin-bottom: 0;
  }

.ua-table[b-e3sr4zjg04] {
  width: 100%;
  min-width: 1040px;
  margin-bottom: 0;
  vertical-align: middle;
  table-layout: fixed;
}

  .ua-table thead th[b-e3sr4zjg04] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #fff;
    padding-top: 12px;
    padding-bottom: 12px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--text-500);
    border-bottom: 0;
    white-space: nowrap;
    box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
  }

  .ua-table tbody td[b-e3sr4zjg04] {
    padding-top: 10px;
    padding-bottom: 10px;
    border-color: rgba(25, 35, 68, 0.08);
    color: var(--text-900);
    vertical-align: top;
  }

  .ua-table tbody tr:hover td[b-e3sr4zjg04] {
    background: rgba(25, 35, 68, 0.018);
  }

  .ua-table thead th:first-child[b-e3sr4zjg04],
  .ua-table tbody td:first-child[b-e3sr4zjg04] {
    padding-left: 10px;
  }

  .ua-table thead th:last-child[b-e3sr4zjg04],
  .ua-table tbody td:last-child[b-e3sr4zjg04] {
    padding-right: 10px;
  }

/* =========================================================
   Sort controls
   ========================================================= */

.ua-sort-button[b-e3sr4zjg04] {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
  white-space: nowrap;
}

  .ua-sort-button:hover[b-e3sr4zjg04],
  .ua-sort-button.ua-sort-button--active[b-e3sr4zjg04] {
    color: #2563eb;
  }

.ua-sort-indicator[b-e3sr4zjg04] {
  color: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1;
}

/* =========================================================
   Column sizing / behavior
   ========================================================= */

.ua-col-email[b-e3sr4zjg04] {
  width: 290px;
  min-width: 290px;
}

.ua-col-company[b-e3sr4zjg04] {
  width: 150px;
  min-width: 150px;
}

.ua-col-role[b-e3sr4zjg04] {
  width: 118px;
  min-width: 118px;
}

.ua-col-invited[b-e3sr4zjg04] {
  width: 148px;
  min-width: 148px;
}

.ua-col-stage[b-e3sr4zjg04] {
  width: 160px;
  min-width: 160px;
}

.ua-col-status[b-e3sr4zjg04] {
  width: 112px;
  min-width: 112px;
}

.ua-col-actions[b-e3sr4zjg04] {
  width: 94px;
  min-width: 94px;
}

.ua-table td.ua-col-company[b-e3sr4zjg04],
.ua-table td.ua-col-role[b-e3sr4zjg04] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ua-table th.ua-col-email[b-e3sr4zjg04],
.ua-table td.ua-col-email[b-e3sr4zjg04] {
  vertical-align: top;
}

.ua-table td.ua-col-role[b-e3sr4zjg04],
.ua-table td.ua-col-invited[b-e3sr4zjg04],
.ua-table td.ua-col-stage[b-e3sr4zjg04],
.ua-table td.ua-col-status[b-e3sr4zjg04],
.ua-table td.ua-col-actions[b-e3sr4zjg04] {
  white-space: nowrap;
}

.ua-table th.ua-col-actions[b-e3sr4zjg04],
.ua-table td.ua-col-actions[b-e3sr4zjg04] {
  position: sticky;
  right: 0;
  text-align: left;
  white-space: nowrap;
  background: #fff;
}

.ua-table thead th.ua-col-actions[b-e3sr4zjg04] {
  z-index: 110;
  padding-left: 8px;
  padding-right: 8px;
  box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
}

.ua-table tbody td.ua-col-actions[b-e3sr4zjg04] {
  z-index: 2;
  padding-left: 8px;
  padding-right: 8px;
  box-shadow: none;
}

.ua-table tbody tr:hover td.ua-col-actions[b-e3sr4zjg04] {
  background: #fff;
}

/* =========================================================
   Row content
   ========================================================= */

.ua-empty[b-e3sr4zjg04] {
  text-align: center;
  color: var(--text-500, #667085);
  padding: 2rem 1rem !important;
}

/*Users images*/
.ua-user-cell[b-e3sr4zjg04] {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.ua-user-avatar[b-e3sr4zjg04] {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
  overflow: hidden;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08);
  position: relative;
  z-index: 1;
}

.ua-user-avatar-image[b-e3sr4zjg04] {
  cursor: zoom-in;
  transform-origin: left top;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

  .ua-user-avatar-image:hover[b-e3sr4zjg04] {
    transform: scale(3);
    z-index: 50;
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.30);
  }

.ua-user-avatar-fallback[b-e3sr4zjg04] {
  cursor: default;
}

.ua-table tbody tr:nth-last-child(-n + 3) .ua-user-avatar-image[b-e3sr4zjg04] {
  transform-origin: left bottom;
}

    .ua-table tbody td.ua-col-email[b-e3sr4zjg04] {
      position: relative;
    }

      .ua-table tbody td.ua-col-email:hover[b-e3sr4zjg04] {
        z-index: 5;
      }

    .ua-user-avatar-image[b-e3sr4zjg04] {
      object-fit: cover;
      border: 1px solid rgba(15, 23, 42, 0.08);
      background: #fff;
    }

    .ua-user-avatar-fallback[b-e3sr4zjg04] {
      background: rgba(13, 110, 253, 0.10);
      border: 1px solid rgba(13, 110, 253, 0.18);
      color: rgba(13, 110, 253, 0.85);
    }

      .ua-user-avatar-fallback .bi[b-e3sr4zjg04] {
        font-size: 14px;
        line-height: 1;
      }

    .ua-email-wrap[b-e3sr4zjg04] {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      min-width: 0;
    }

    .ua-email-primary[b-e3sr4zjg04] {
      min-width: 0;
      max-width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-weight: 500;
      color: var(--text-900);
    }

    .ua-email-primary-updated[b-e3sr4zjg04] {
      color: #c27a2c;
    }

.ua-secondary[b-e3sr4zjg04] {
  max-width: 100%;
  margin-top: 3px;
  font-size: 12px;
  line-height: 1.32;
  color: var(--text-600);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

    .ua-secondary-info[b-e3sr4zjg04] {
      color: #1d4ed8;
      font-weight: 500;
    }

    .ua-local-date[b-e3sr4zjg04] {
      font-size: 0.84rem;
      color: rgba(25, 35, 68, 0.78);
    }

    .ua-stage-cell[b-e3sr4zjg04] {
      display: flex;
      flex-direction: column;
      line-height: 1.15;
    }

    .ua-stage-trigger[b-e3sr4zjg04] {
      display: inline-flex;
      flex-direction: column;
      align-items: flex-start;
      width: fit-content;
      max-width: max-content;
    }

    .ua-stage-time[b-e3sr4zjg04] {
      font-size: 0.82rem;
      color: #334155;
      white-space: nowrap;
    }

    .ua-stage-label[b-e3sr4zjg04] {
      margin-top: 0.15rem;
      font-size: 0.72rem;
      color: #94a3b8;
      white-space: nowrap;
    }
    /* =========================================================
   Status badges
   ========================================================= */

    .ua-badge[b-e3sr4zjg04] {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 20px;
      min-width: 80px;
      padding: 0 6px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 600;
      white-space: nowrap;
      border: 1px solid transparent;
    }

    .ua-badge-inactive[b-e3sr4zjg04] {
      background: rgba(241, 95, 87, 0.14); /* soft red inactive background */
      color: #9d423c; /* muted red inactive text */
      border-color: transparent;
    }

    .ua-badge-active[b-e3sr4zjg04] {
      background: rgba(91, 196, 191, 0.18); /* soft teal active background */
      color: #206a66; /* dark teal active text */
      border-color: transparent;
    }

    .ua-badge-pending[b-e3sr4zjg04] {
      color: #8a6a12;
      background: rgba(255, 193, 7, 0.10);
      border-color: rgba(255, 193, 7, 0.18);
    }

    .ua-badge-sent[b-e3sr4zjg04] {
      color: #2f66b3;
      background: rgba(13, 110, 253, 0.07);
      border-color: rgba(13, 110, 253, 0.14);
    }

    .ua-badge-rejected[b-e3sr4zjg04] {
      color: #b5474f;
      background: rgba(220, 53, 69, 0.07);
      border-color: rgba(220, 53, 69, 0.14);
    }

    .ua-badge-expired[b-e3sr4zjg04],
    .ua-badge-canceled[b-e3sr4zjg04] {
      background: rgba(241, 95, 87, 0.14); /* soft red inactive background */
      color: #9d423c; /* muted red inactive text */
      border-color: transparent;
    }
    /* =========================================================
   Row actions
   ========================================================= */

    .ua-inline-actions[b-e3sr4zjg04] {
      width: 100%;
      min-height: 28px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0;
      padding: 0 8px;
      border-radius: 7px;
      background: #f3f6fb;
      box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.82);
      white-space: nowrap;
      transition: background-color 0.15s ease, box-shadow 0.15s ease;
    }

    .ua-table tbody tr:hover .ua-inline-actions[b-e3sr4zjg04] {
      background: #edf4ff;
      box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.68);
    }

    .ua-inline-action[b-e3sr4zjg04] {
      appearance: none;
      background: transparent;
      border: none;
      padding: 0;
      margin: 0;
      font: inherit;
      font-size: 12px;
      font-weight: 600;
      color: var(--link-600, #2563eb);
      cursor: pointer;
      line-height: 1.1;
      letter-spacing: 0;
    }

      .ua-inline-action:hover[b-e3sr4zjg04] {
        color: #1d4ed8;
        text-decoration: underline;
      }

      .ua-inline-action:focus-visible[b-e3sr4zjg04] {
        outline: none;
        box-shadow: none;
        text-decoration: underline;
        border-radius: 4px;
      }

    .ua-inline-action-approve[b-e3sr4zjg04] {
      color: #1f6f43;
    }

    .ua-inline-action-danger[b-e3sr4zjg04] {
      color: #dc2626;
    }

    .ua-action-sep[b-e3sr4zjg04] {
      display: inline-block;
      margin: 0 0.18rem;
      color: rgba(25, 35, 68, 0.35);
      user-select: none;
    }

    .ua-no-action[b-e3sr4zjg04] {
      color: rgba(25, 35, 68, 0.38);
    }
    /* =========================================================
   Pager
   ========================================================= */

    .ua-pager[b-e3sr4zjg04] {
      flex: 0 0 auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      padding: 6px 14px 4px;
      background: #f8fafc;
      border-top: 1px solid rgba(25, 35, 68, 0.06);
      flex-wrap: wrap;
    }

    .ua-pager-meta[b-e3sr4zjg04] {
      font-size: 12px;
      color: var(--text-600);
    }

    .ua-pager-actions[b-e3sr4zjg04] {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
    }

    .ua-pager-page[b-e3sr4zjg04] {
      min-width: 88px;
      text-align: center;
      font-size: 12px;
      font-weight: 600;
      color: var(--text-700, #334155);
    }
    /* =========================================================
   Invite modal shell
   ========================================================= */

    .ua-modal-backdrop[b-e3sr4zjg04] {
      position: fixed;
      inset: 0;
      z-index: 1040;
      background: rgba(15, 23, 42, 0.35);
    }

    .ua-modal[b-e3sr4zjg04] {
      position: fixed;
      inset: 0;
      z-index: 1050;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 1rem;
    }

    .ua-modal-card[b-e3sr4zjg04] {
      width: min(1180px, calc(100vw - 2rem));
      max-height: calc(100vh - 2rem);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      background: #fff;
      border-radius: 12px;
      box-shadow: 0 20px 48px rgba(15, 23, 42, 0.22);
      border: 1px solid rgba(25, 35, 68, 0.08);
    }

    .ua-modal-header[b-e3sr4zjg04] {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 14px 16px 10px;
      border-bottom: 1px solid var(--border-200);
    }

    .ua-modal-title[b-e3sr4zjg04] {
      font-size: 15px;
      font-weight: 600;
      color: var(--text-900);
    }

    .ua-modal-body[b-e3sr4zjg04] {
      overflow: auto;
      padding: 16px 18px 14px;
    }

    .ua-modal-footer[b-e3sr4zjg04] {
      margin-top: 16px;
      display: flex;
      justify-content: flex-end;
      gap: 8px;
    }
    /* =========================================================
   Invite queue inside modal
   ========================================================= */

    .ua-invite-layout[b-e3sr4zjg04] {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .ua-invite-section[b-e3sr4zjg04] {
      padding: 14px 14px 12px;
      border: 1px solid rgba(25, 35, 68, 0.08);
      border-radius: 10px;
      background: rgba(248, 250, 252, 0.55);
    }

    .ua-invite-section-title[b-e3sr4zjg04] {
      margin-bottom: 10px;
      font-size: 14px;
      font-weight: 600;
      color: var(--text-900);
    }

    .ua-invite-section-subtitle[b-e3sr4zjg04] {
      margin-top: -4px;
      margin-bottom: 10px;
      font-size: 12px;
      color: var(--text-600);
    }

    .ua-queue-topbar[b-e3sr4zjg04] {
      display: grid;
      grid-template-columns: auto 1fr auto;
      grid-template-areas: "title tools count";
      align-items: center;
      gap: 0.65rem;
      padding: 0.35rem 0.9rem;
      border: 1px solid rgba(25, 35, 68, 0.08);
      border-radius: 10px;
      background: rgba(248, 250, 252, 0.55);
    }

    .ua-queue-title[b-e3sr4zjg04] {
      grid-area: title;
      font-weight: 600;
    }

    .ua-queue-tools[b-e3sr4zjg04] {
      grid-area: tools;
      min-width: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0.45rem;
      flex-wrap: wrap;
    }

    .ua-queue-count[b-e3sr4zjg04] {
      grid-area: count;
      justify-self: end;
      font-size: 0.92rem;
      color: var(--text-500);
      white-space: nowrap;
    }

      .ua-queue-count.empty[b-e3sr4zjg04] {
        color: var(--text-muted);
      }

    .ua-queue-sep[b-e3sr4zjg04] {
      color: var(--text-500, #667085);
    }

    .ua-link-btn[b-e3sr4zjg04] {
      padding: 0;
      font-weight: 500;
      text-decoration: none;
    }

    .ua-queue-grid[b-e3sr4zjg04] {
      border: 1px solid rgba(25, 35, 68, 0.08);
      border-radius: 10px;
      overflow: hidden;
      background: #fff;
    }

    .ua-queue-head[b-e3sr4zjg04] {
      display: grid;
      grid-template-columns: minmax(240px, 1.7fr) minmax(150px, 0.9fr) minmax(180px, 1fr) minmax(220px, 1.2fr) auto;
      gap: 0.85rem;
      padding: 0.45rem 0.95rem;
      border-bottom: 1px solid rgba(25, 35, 68, 0.06);
      background: #f8fafc;
      font-weight: 600;
      font-size: 0.90rem;
    }

    .ua-queue-body[b-e3sr4zjg04] {
      display: flex;
      flex-direction: column;
      gap: 0;
      max-height: 220px;
      overflow-y: auto;
      overflow-x: hidden;
      overscroll-behavior: contain;
      scrollbar-gutter: stable;
    }

    .ua-queue-row[b-e3sr4zjg04] {
      display: grid;
      grid-template-columns: minmax(240px, 1.7fr) minmax(150px, 0.9fr) minmax(180px, 1fr) minmax(220px, 1.2fr) auto;
      gap: 0.85rem;
      align-items: center;
      padding: 0.45rem 0.95rem;
      border-top: 1px solid rgba(25, 35, 68, 0.05);
    }

      .ua-queue-row:first-child[b-e3sr4zjg04] {
        border-top: none;
      }

    .ua-queue-field[b-e3sr4zjg04] {
      display: flex;
      flex-direction: column;
      gap: 0.22rem;
    }

    .ua-field-error[b-e3sr4zjg04] {
      font-size: 0.74rem;
      color: #b5474f;
      line-height: 1.2;
    }

    .ua-queue-mobile-label[b-e3sr4zjg04] {
      display: none;
      font-weight: 600;
      font-size: 0.88rem;
      color: var(--text-900, #192344);
      margin-bottom: 0.2rem;
    }

    .ua-queue-actions[b-e3sr4zjg04] {
      display: flex;
      justify-content: flex-start;
    }

    .ua-queue-row > .ua-queue-actions[b-e3sr4zjg04] {
      align-self: end;
    }

    .ua-queue-footer[b-e3sr4zjg04] {
      display: flex;
      justify-content: flex-end;
      gap: 0.60rem;
      padding-top: 2px;
      flex-wrap: wrap;
    }

      .ua-queue-footer .btn[b-e3sr4zjg04],
      .ua-queue-actions .btn[b-e3sr4zjg04] {
        min-height: 32px;
        padding: 0.24rem 0.72rem;
        font-size: 0.9rem;
        line-height: 1.15;
        border-radius: 0.45rem;
      }

    .ua-queue-actions .btn[b-e3sr4zjg04] {
      min-width: 80px;
      padding: 0.22rem 0.66rem;
    }

    .ua-queue-footer .btn-primary[b-e3sr4zjg04] {
      min-width: 120px;
    }

    .ua-queue-field .form-control[b-e3sr4zjg04],
    .ua-queue-field .form-select[b-e3sr4zjg04] {
      min-height: 38px;
    }

      .ua-queue-field .form-control.is-invalid[b-e3sr4zjg04],
      .ua-queue-field .form-select.is-invalid[b-e3sr4zjg04] {
        border-color: #dc3545;
        box-shadow: 0 0 0 0.08rem rgba(220, 53, 69, 0.12);
      }

    .ua-bulk-textarea[b-e3sr4zjg04] {
      min-height: 180px;
    }
    /*Invite maintenance*/

    .ua-queue-topbar--maintenance[b-e3sr4zjg04] {
      grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .ua-queue-guidance[b-e3sr4zjg04] {
      grid-area: tools;
      min-width: 0;
      justify-self: center;
      color: var(--text-500);
      font-size: 12px;
      line-height: 1.25;
      text-align: center;
    }

    .ua-maintenance-limit-message[b-e3sr4zjg04] {
      margin-right: auto;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: #8a5a12;
      font-size: 12px;
      font-weight: 600;
      line-height: 1.25;
    }

    .ua-maintenance-onboarding-link[b-e3sr4zjg04] {
      appearance: none;
      border: 0;
      background: transparent;
      padding: 0;
      color: #1d4ed8;
      font: inherit;
      font-weight: 700;
      cursor: pointer;
    }

      .ua-maintenance-onboarding-link:hover[b-e3sr4zjg04] {
        text-decoration: underline;
      }
    /* =========================================================
   Responsive
   ========================================================= */

    @container ua-page (max-width: 960px) {
      .ua-summary-strip[b-e3sr4zjg04] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @container ua-page (max-width: 1200px) {
      .ua-controls[b-e3sr4zjg04] {
        grid-template-columns: minmax(260px, 1fr) 170px 150px 130px 88px;
      }
    }

    @media (max-width: 1100px) {
      .ua-queue-topbar[b-e3sr4zjg04] {
        grid-template-columns: 1fr auto;
        grid-template-areas:
          "title count"
          "tools tools";
        align-items: center;
        row-gap: 0.45rem;
      }

      .ua-queue-tools[b-e3sr4zjg04] {
        justify-content: flex-start;
      }

      .ua-queue-head[b-e3sr4zjg04],
      .ua-queue-row[b-e3sr4zjg04] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

        .ua-queue-row > .ua-queue-actions[b-e3sr4zjg04] {
          grid-column: 1 / -1;
          justify-content: flex-start;
          padding-top: 0.1rem;
        }
    }

    @container ua-page (max-width: 980px) {
      .ua-controls[b-e3sr4zjg04] {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
      }
    }

    @container ua-page (max-width: 640px) {
      .ua-summary-strip[b-e3sr4zjg04],
      .ua-controls[b-e3sr4zjg04] {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 900px) {
      .ua-panel-header[b-e3sr4zjg04] {
        align-items: flex-start;
        flex-direction: column;
      }

      .ua-panel-header-actions[b-e3sr4zjg04] {
        width: 100%;
        justify-content: flex-start;
      }
    }

    @media (max-width: 768px) {
      .ua-header[b-e3sr4zjg04] {
        align-items: flex-start;
        flex-direction: column;
      }

      .ua-header-actions[b-e3sr4zjg04] {
        width: 100%;
        justify-content: stretch;
        flex-direction: column;
      }

        .ua-header-actions .ua-primary-button[b-e3sr4zjg04],
        .ua-panel-header-actions .ua-primary-button[b-e3sr4zjg04] {
          width: 100%;
        }

      .ua-table-region[b-e3sr4zjg04] {
        margin-left: 10px;
        margin-right: 10px;
      }

      .ua-modal-card[b-e3sr4zjg04] {
        width: calc(100vw - 1rem);
        max-height: calc(100vh - 1rem);
      }

      .ua-modal-body[b-e3sr4zjg04] {
        padding: 14px 14px 12px;
      }
    }

    @media (max-width: 760px) {
      .ua-queue-topbar--maintenance[b-e3sr4zjg04] {
        grid-template-columns: 1fr;
        grid-template-areas:
          "title"
          "tools"
          "count";
      }

      .ua-queue-guidance[b-e3sr4zjg04] {
        justify-self: start;
        text-align: left;
      }

      .ua-maintenance-limit-message[b-e3sr4zjg04] {
        width: 100%;
        flex-wrap: wrap;
      }
    }

    @media (max-width: 700px) {
      .ua-queue-topbar[b-e3sr4zjg04] {
        grid-template-columns: 1fr;
        grid-template-areas:
          "title"
          "tools"
          "count";
        align-items: start;
      }

      .ua-queue-tools[b-e3sr4zjg04] {
        justify-content: flex-start;
      }

      .ua-queue-count[b-e3sr4zjg04] {
        justify-self: start;
        text-align: left;
      }

      .ua-queue-head[b-e3sr4zjg04] {
        display: none;
      }

      .ua-queue-row[b-e3sr4zjg04] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
      }

      .ua-queue-mobile-label[b-e3sr4zjg04] {
        display: block;
      }

      .ua-queue-actions[b-e3sr4zjg04] {
        justify-content: flex-start;
      }

      .ua-queue-footer[b-e3sr4zjg04] {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
      }
    }

    @media (max-width: 640px) {
      .ua-table-region[b-e3sr4zjg04] {
        margin-left: 12px;
        margin-right: 12px;
      }

      .ua-pager[b-e3sr4zjg04] {
        padding-left: 12px;
        padding-right: 12px;
      }
    }

    @media (max-width: 520px) {
      .ua-queue-footer[b-e3sr4zjg04] {
        flex-direction: column;
        align-items: stretch;
      }

        .ua-queue-footer .btn[b-e3sr4zjg04] {
          width: 100%;
        }
    }
/* /Components/Pages/Broker/Companies.razor.rz.scp.css */
/* =========================================================
   Broker Companies.razor.css
   ---------------------------------------------------------
   Scope:
   - Broker Companies & Users page shell
   - Summary cards
   - Manufacturer company list card
   - Company details modal
   - Toolbar / filters
   - Table shell
   - Sort controls
   - Sticky Actions column
   - Pager
   - Broker user list inside detail modal
   ========================================================= */

/* =========================================================
   Page shell
   ========================================================= */

.companies-page[b-vncr4j51vc] {
  flex: 1 1 auto;
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 2px;
  overflow: hidden;
  container-type: inline-size;
  container-name: companies-page;
}

.companies-workspace[b-vncr4j51vc] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow: hidden;
}

/* =========================================================
   Summary cards
   ========================================================= */

.companies-summary-strip[b-vncr4j51vc] {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.companies-summary-card[b-vncr4j51vc] {
  min-width: 0;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid var(--border-200, rgba(25, 35, 68, 0.12));
  border-radius: 13px;
  box-shadow: var(--shadow-1, 0 1px 4px rgba(15, 23, 42, 0.08));
}

.companies-summary-card-button[b-vncr4j51vc] {
  appearance: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

  .companies-summary-card-button:hover[b-vncr4j51vc] {
    border-color: rgba(29, 58, 109, 0.18);
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.06);
  }

  .companies-summary-card-button.is-active[b-vncr4j51vc] {
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.04), 0 3px 10px rgba(15, 23, 42, 0.06);
  }

  .companies-summary-card-button:focus-visible[b-vncr4j51vc] {
    outline: none;
    box-shadow: var(--focus-ring);
  }

.companies-summary-label[b-vncr4j51vc] {
  margin: 0 0 6px;
  overflow: hidden;
  color: var(--text-600, #475569);
  font-size: 13.5px;
  line-height: 1.3;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.companies-summary-value[b-vncr4j51vc] {
  margin: 0;
  color: var(--text-900, #0f172a);
  font-size: 21px;
  line-height: 1;
  font-weight: 800;
}

.companies-summary-meta[b-vncr4j51vc] {
  margin-top: 5px;
  overflow: hidden;
  color: var(--text-500, #64748b);
  font-size: 12px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.companies-summary-card--neutral[b-vncr4j51vc] {
  border-color: rgba(117, 140, 167, 0.22);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.035), #fff);
}

.companies-summary-card--info[b-vncr4j51vc] {
  border-color: rgba(117, 140, 167, 0.24);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.04), #fff);
}

.companies-summary-card--success[b-vncr4j51vc] {
  border-color: rgba(91, 196, 191, 0.38);
  background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.companies-summary-card--warning[b-vncr4j51vc] {
  border-color: rgba(250, 169, 75, 0.32);
  background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

.companies-summary-card--neutral.is-active[b-vncr4j51vc] {
  border-color: rgba(117, 140, 167, 0.34);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.08), #fff);
}

.companies-summary-card--info.is-active[b-vncr4j51vc] {
  border-color: rgba(117, 140, 167, 0.34);
  background: linear-gradient(180deg, rgba(117, 140, 167, 0.08), #fff);
}

.companies-summary-card--success.is-active[b-vncr4j51vc] {
  border-color: rgba(91, 196, 191, 0.48);
  background: linear-gradient(180deg, rgba(91, 196, 191, 0.10), #fff);
}

.companies-summary-card--warning.is-active[b-vncr4j51vc] {
  border-color: rgba(250, 169, 75, 0.42);
  background: linear-gradient(180deg, rgba(250, 169, 75, 0.10), #fff);
}

/* =========================================================
   Shared card shell
   ========================================================= */

.companies-card[b-vncr4j51vc] {
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-200);
  border-radius: 18px;
  overflow: hidden;
}

.companies-card-title[b-vncr4j51vc] {
  margin: 0;
  color: var(--text-900, #0f172a);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
}

.companies-card-subtitle[b-vncr4j51vc] {
  margin: 4px 0 0;
  color: var(--text-500, #64748b);
  font-size: 13px;
  line-height: 1.35;
}

/* =========================================================
   Company list card
   ========================================================= */

.companies-list-section[b-vncr4j51vc] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.companies-manage-card[b-vncr4j51vc] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.companies-panel-header[b-vncr4j51vc] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 12px 8px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.companies-panel-header-copy[b-vncr4j51vc] {
  min-width: 0;
  flex: 1 1 auto;
}

.companies-panel-header-actions[b-vncr4j51vc] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.companies-access-body[b-vncr4j51vc] {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  overflow: hidden;
  margin-bottom: 5px;
  padding-bottom: 14px;
}

.companies-state[b-vncr4j51vc] {
  padding: 18px 16px;
  color: var(--text-600);
}

/* =========================================================
   Controls
   ========================================================= */

.companies-controls[b-vncr4j51vc] {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(320px, 1fr) 190px 190px 108px;
  gap: 10px;
  align-items: end;
  padding: 14px 12px 0;
  margin-bottom: 0;
  flex: 0 0 auto;
}

.companies-control[b-vncr4j51vc] {
  min-width: 0;
}

.companies-control-label[b-vncr4j51vc] {
  display: block;
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-700, #334155);
}

.companies-search[b-vncr4j51vc],
.companies-select[b-vncr4j51vc],
.companies-page-size[b-vncr4j51vc] {
  width: 100%;
  min-height: 38px;
}

.companies-page-size[b-vncr4j51vc] {
  min-width: 108px;
}

.companies-select[b-vncr4j51vc] {
  min-width: 0;
}

/* =========================================================
   Table shell
   ========================================================= */

.companies-table-region[b-vncr4j51vc] {
  min-height: 0;
  height: 100%;
  margin: 12px 12px 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  overflow: hidden;
  background: #ffffff;
}

.companies-table-wrap[b-vncr4j51vc] {
  min-height: 0;
  position: relative;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  background: #ffffff;
}

.companies-table[b-vncr4j51vc] {
  width: 100%;
  margin: 0;
  min-width: 1060px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.82rem;
}

  .companies-table thead th[b-vncr4j51vc] {
    position: sticky;
    top: 0;
    z-index: 12;
    padding: 0.58rem 0.55rem;
    border-bottom: 1px solid #dbe4ef;
    background: #ffffff;
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.035em;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .companies-table tbody td[b-vncr4j51vc] {
    padding: 0.56rem 0.55rem;
    vertical-align: middle;
    border-bottom: 1px solid #edf2f7;
    background: #ffffff;
    color: var(--text-900, #0f172a);
    font-size: 0.82rem;
    line-height: 1.35;
  }

  .companies-table tbody tr:hover td[b-vncr4j51vc] {
    background: #fbfdff;
  }

  .companies-table thead th:first-child[b-vncr4j51vc],
  .companies-table tbody td:first-child[b-vncr4j51vc] {
    padding-left: 0;
  }

/* =========================================================
   Sort controls
   ========================================================= */

.companies-sort-button[b-vncr4j51vc] {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
  white-space: nowrap;
}

  .companies-sort-button:hover[b-vncr4j51vc],
  .companies-sort-button--active[b-vncr4j51vc] {
    color: #2563eb;
  }

.companies-sort-indicator[b-vncr4j51vc] {
  font-size: 0.72rem;
  line-height: 1;
}

/* =========================================================
   Column sizing / behavior
   ========================================================= */

.companies-company-col[b-vncr4j51vc] {
  width: auto;
  min-width: 180px;
}

.companies-type-col[b-vncr4j51vc] {
  width: 128px;
  min-width: 120px;
}

.companies-users-col[b-vncr4j51vc] {
  width: 96px;
  min-width: 90px;
}

.companies-city-col[b-vncr4j51vc] {
  width: 130px;
  min-width: 100px;
}

.companies-state-col[b-vncr4j51vc] {
  width: 64px;
  min-width: 60px;
}

.companies-status-col[b-vncr4j51vc] {
  width: 112px;
  min-width: 104px;
}

.companies-created-col[b-vncr4j51vc] {
  width: 128px;
  min-width: 120px;
}

.companies-actions-col[b-vncr4j51vc] {
  width: 96px;
  min-width: 96px;
  max-width: 96px;
}

.companies-table th[b-vncr4j51vc],
.companies-table td[b-vncr4j51vc] {
  overflow: hidden;
}

  .companies-table td.companies-type-col[b-vncr4j51vc],
  .companies-table td.companies-users-col[b-vncr4j51vc],
  .companies-table td.companies-state-col[b-vncr4j51vc],
  .companies-table td.companies-status-col[b-vncr4j51vc],
  .companies-table td.companies-created-col[b-vncr4j51vc],
  .companies-table td.companies-actions-col[b-vncr4j51vc] {
    white-space: nowrap;
  }

  .companies-table td.companies-company-col[b-vncr4j51vc],
  .companies-table td.companies-city-col[b-vncr4j51vc] {
    white-space: normal;
  }

  /* Actions column is pinned to the right edge of the table scroll viewport.
   The sticky cell stays neutral; the inner action zone owns emphasis. */
  .companies-table th.companies-actions-col[b-vncr4j51vc],
  .companies-table td.companies-actions-col[b-vncr4j51vc] {
    position: sticky;
    right: 0;
    z-index: 10;
    padding-left: 0.64rem;
    padding-right: 0.64rem;
    text-align: left;
    white-space: nowrap;
    background: #ffffff;
    background-clip: padding-box;
    box-shadow: none;
  }

.companies-table thead th.companies-actions-col[b-vncr4j51vc] {
  z-index: 18;
  background: #ffffff;
  color: #64748b;
}

.companies-table tbody tr:hover td.companies-actions-col[b-vncr4j51vc] {
  background: #fbfdff;
}

/* =========================================================
   Row content
   ========================================================= */

.companies-users-compact[b-vncr4j51vc] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  white-space: nowrap;
}

.companies-users-active[b-vncr4j51vc] {
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--text-900);
}

.companies-users-active-link[b-vncr4j51vc] {
  border: 0;
  background: transparent;
  padding: 0;
  color: inherit;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
}

  .companies-users-active-link:hover[b-vncr4j51vc],
  .companies-users-active-link:focus[b-vncr4j51vc] {
    color: #1d4ed8;
    text-decoration: underline;
  }

  .companies-users-active-link:focus-visible[b-vncr4j51vc] {
    outline: 2px solid rgba(37, 99, 235, 0.35);
    outline-offset: 2px;
    border-radius: 4px;
  }

.companies-users-info[b-vncr4j51vc] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 1px solid rgba(37, 99, 235, 0.35);
  background: rgba(37, 99, 235, 0.08);
  color: #2563eb;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  cursor: help;
  user-select: none;
}

.companies-users-tooltip-lines[b-vncr4j51vc] {
  display: grid;
  gap: 2px;
  white-space: wrap;
}

  .companies-users-info:focus-visible[b-vncr4j51vc] {
    outline: 2px solid rgba(37, 99, 235, 0.35);
    outline-offset: 2px;
  }

.companies-company-text[b-vncr4j51vc],
.companies-city-text[b-vncr4j51vc] {
  display: inline-block;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.25;
  vertical-align: middle;
}

.companies-state-text[b-vncr4j51vc],
.companies-created-text[b-vncr4j51vc] {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}

.companies-state-text[b-vncr4j51vc] {
  min-width: 24px;
  text-align: left;
}

.companies-created-text[b-vncr4j51vc] {
  font-size: 11px;
  line-height: 1.2;
}

/* =========================================================
   Status and type badges
   ========================================================= */

.companies-status-badge[b-vncr4j51vc] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  min-width: 70px;
  padding: 0 2px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.companies-status-badge--active[b-vncr4j51vc] {
  background: rgba(91, 196, 191, 0.18);
  color: #206a66;
}

.companies-status-badge--inactive[b-vncr4j51vc] {
  background: rgba(241, 95, 87, 0.14);
  color: #9d423c;
}

.companies-type-badge[b-vncr4j51vc] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  min-width: 100px;
  padding: 0 2px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.companies-type-badge--manufacturer[b-vncr4j51vc] {
  background: #ede9fe;
  color: #4c1d95;
}

/* =========================================================
   Row actions
   ========================================================= */

.companies-page .ua-inline-actions[b-vncr4j51vc] {
  width: 100%;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0 6px;
  border-radius: 7px;
  background: #f3f6fb;
  box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.82);
  flex-wrap: nowrap;
  white-space: nowrap;
  transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.companies-table tbody tr:hover .ua-inline-actions[b-vncr4j51vc] {
  background: #edf4ff;
  box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.68);
}

.companies-page .ua-inline-action[b-vncr4j51vc] {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--link-600, #2563eb);
  text-decoration: none;
  cursor: pointer;
}

  .companies-page .ua-inline-action:hover[b-vncr4j51vc] {
    color: #1d4ed8;
    text-decoration: underline;
    text-underline-offset: 2px;
  }

  .companies-page .ua-inline-action:focus-visible[b-vncr4j51vc] {
    outline: none;
    text-decoration: underline;
    border-radius: 4px;
  }

/* =========================================================
   Pager
   ========================================================= */

.companies-pager[b-vncr4j51vc] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 8px 14px 6px;
  background: #f8fafc;
  border-top: 1px solid rgba(25, 35, 68, 0.06);
  flex-wrap: wrap;
}

.companies-pager-meta[b-vncr4j51vc] {
  font-size: 12px;
  color: var(--text-600);
}

.companies-pager-actions[b-vncr4j51vc] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.companies-pager-page[b-vncr4j51vc] {
  min-width: 88px;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-700, #334155);
}

/* =========================================================
   Modal shell
   ========================================================= */

.companies-modal-backdrop[b-vncr4j51vc] {
  position: fixed;
  inset: 0;
  z-index: 1040;
  background: rgba(15, 23, 42, 0.28);
}

.companies-modal[b-vncr4j51vc] {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.companies-modal-card[b-vncr4j51vc] {
  width: min(760px, calc(100vw - 2rem));
  max-height: calc(100vh - 2.5rem);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.26);
  border: 1px solid rgba(25, 35, 68, 0.10);
}

.companies-modal-card--details[b-vncr4j51vc] {
  width: min(760px, calc(100vw - 2rem));
}

.companies-modal-header[b-vncr4j51vc] {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 20px 14px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.95), #fff);
}

.companies-modal-title[b-vncr4j51vc] {
  margin: 0;
  font-size: 18px;
  line-height: 1.15;
  font-weight: 800;
  color: var(--text-900);
  letter-spacing: 0.01em;
}

.companies-modal-subtitle[b-vncr4j51vc] {
  margin-top: 5px;
  font-size: 13px;
  line-height: 1.35;
  color: var(--text-500);
}

.companies-modal-header .btn[b-vncr4j51vc] {
  min-height: 32px;
  padding: 4px 12px;
  border-radius: 8px;
  font-size: 13px;
}

.companies-modal-body[b-vncr4j51vc] {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 18px 20px 16px;
}

.companies-modal-footer[b-vncr4j51vc] {
  flex: 0 0 auto;
  margin-top: 0;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 14px 20px 16px;
  border-top: 1px solid rgba(25, 35, 68, 0.08);
  background: #fff;
}

  .companies-modal-footer .btn[b-vncr4j51vc] {
    min-width: 88px;
    min-height: 34px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
  }

/* =========================================================
   Broker user list inside details modal
   ========================================================= */

.broker-company-users-list[b-vncr4j51vc] {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.broker-company-user-row[b-vncr4j51vc] {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 10px 12px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 12px;
  background: linear-gradient(180deg, #fff, rgba(248, 250, 252, 0.75));
}

  .broker-company-user-row:hover[b-vncr4j51vc] {
    border-color: rgba(37, 99, 235, 0.16);
    background: #fff;
  }

.broker-company-user-name[b-vncr4j51vc] {
  min-width: 0;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 800;
  color: var(--text-900);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.broker-company-user-email[b-vncr4j51vc] {
  min-width: 0;
  margin-top: 3px;
  font-size: 12px;
  line-height: 1.25;
  color: var(--text-600);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.broker-company-user-status[b-vncr4j51vc] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

/* =========================================================
   Page responsive behavior
   ========================================================= */

@container companies-page (max-width: 960px) {
  .companies-summary-strip[b-vncr4j51vc] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container companies-page (max-width: 980px) {
  .companies-controls[b-vncr4j51vc] {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }

  .companies-page-size[b-vncr4j51vc] {
    width: 100%;
    min-width: 0;
  }
}

@container companies-page (max-width: 640px) {
  .companies-summary-strip[b-vncr4j51vc] {
    grid-template-columns: 1fr;
  }

  .companies-controls[b-vncr4j51vc] {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .companies-panel-header[b-vncr4j51vc] {
    align-items: flex-start;
    flex-direction: column;
  }

  .companies-page[b-vncr4j51vc] {
    overflow: auto;
  }

  .companies-list-section[b-vncr4j51vc],
  .companies-manage-card[b-vncr4j51vc],
  .companies-access-body[b-vncr4j51vc] {
    overflow: visible;
  }

  .companies-table thead th[b-vncr4j51vc],
  .companies-table tbody td[b-vncr4j51vc] {
    white-space: nowrap;
  }
}

@media (max-width: 768px) {
  .companies-table-region[b-vncr4j51vc] {
    margin-left: 10px;
    margin-right: 10px;
  }

  .companies-modal-card[b-vncr4j51vc] {
    width: calc(100vw - 1rem);
    max-height: calc(100vh - 1rem);
  }

  .companies-modal-body[b-vncr4j51vc] {
    padding: 14px 14px 12px;
  }

  .companies-modal-footer[b-vncr4j51vc] {
    justify-content: stretch;
  }

    .companies-modal-footer .btn[b-vncr4j51vc] {
      width: 100%;
    }
}

@media (max-width: 640px) {
  .companies-table-region[b-vncr4j51vc] {
    margin-left: 12px;
    margin-right: 12px;
  }

  .companies-pager[b-vncr4j51vc] {
    padding-left: 12px;
    padding-right: 12px;
  }
}


/* =========================================================
   Broker compact company details modal
   ========================================================= */

.companies-modal-card--details[b-vncr4j51vc] {
  width: min(720px, calc(100vw - 2rem));
  max-height: min(680px, calc(100vh - 2.5rem));
}

.broker-company-detail-body[b-vncr4j51vc] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 12px;
  overflow: hidden;
}

.broker-company-profile-card[b-vncr4j51vc] {
  flex: 0 0 auto;
  padding: 12px 14px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.9), #fff);
}

.broker-company-profile-main[b-vncr4j51vc] {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.broker-company-profile-copy[b-vncr4j51vc] {
  min-width: 0;
}

.broker-company-profile-title[b-vncr4j51vc] {
  margin-top: 2px;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 800;
  color: var(--text-900);
}

.broker-company-profile-subtitle[b-vncr4j51vc] {
  margin-top: 3px;
  font-size: 12px;
  line-height: 1.35;
  color: var(--text-500);
  overflow-wrap: anywhere;
}

.broker-company-profile-badges[b-vncr4j51vc] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.broker-company-profile-grid[b-vncr4j51vc] {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px 14px;
  padding-top: 10px;
}

.broker-company-profile-item[b-vncr4j51vc] {
  min-width: 0;
}

.broker-company-profile-label[b-vncr4j51vc] {
  margin-bottom: 3px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.075em;
  text-transform: uppercase;
  color: #64748b;
}

.broker-company-profile-value[b-vncr4j51vc] {
  min-width: 0;
  font-size: 13px;
  line-height: 1.35;
  color: var(--text-900);
  overflow-wrap: anywhere;
}

.broker-company-users-panel[b-vncr4j51vc] {
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
}

.broker-company-section-header[b-vncr4j51vc] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px 8px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
  background: #f8fafc;
}

.broker-company-section-title[b-vncr4j51vc] {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-900);
}

.broker-company-section-subtitle[b-vncr4j51vc] {
  margin-top: 3px;
  font-size: 12px;
  color: var(--text-500);
}

.broker-company-users-scroll[b-vncr4j51vc] {
  min-height: 0;
  max-height: 220px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 10px 12px;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.broker-company-users-empty[b-vncr4j51vc] {
  padding: 14px;
  font-size: 13px;
  color: var(--text-600);
}

.broker-company-user-row[b-vncr4j51vc] {
  padding: 8px 10px;
}

.broker-company-user-main[b-vncr4j51vc] {
  min-width: 0;
}

/* =========================================================
   Broker modal responsive behavior
   ========================================================= */

@media (max-height: 760px) {
  .companies-modal-card--details[b-vncr4j51vc] {
    max-height: calc(100vh - 2rem);
  }

  .broker-company-users-scroll[b-vncr4j51vc] {
    max-height: 170px;
  }
}

@media (max-width: 900px) {
  .broker-company-profile-grid[b-vncr4j51vc] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .broker-company-profile-main[b-vncr4j51vc] {
    flex-direction: column;
  }

  .broker-company-profile-badges[b-vncr4j51vc] {
    justify-content: flex-start;
  }

  .broker-company-profile-grid[b-vncr4j51vc] {
    grid-template-columns: 1fr;
  }

  .broker-company-users-scroll[b-vncr4j51vc] {
    max-height: 180px;
  }
}
/* /Components/Pages/Distributor/Books.razor.rz.scp.css */
/* =========================================================
   Distributor Books
   ---------------------------------------------------------
   Books layout is maintained by:
   Components/Shared/Books/BookShared.razor.css

   Add styles here only when behavior or layout is unique to:
   Pages/Distributor/Books.razor
   ========================================================= */
/* /Components/Pages/Distributor/PricingDetail.razor.rz.scp.css */
/* =========================================================
   Distributor Pricing Detail
   ---------------------------------------------------------
   Detail layout is maintained by:
   Components/Shared/Promotions/DistributorPricingDetailShared.razor.css

   This file remains available for Distributor-detail-only overrides.
   Add styles here only when behavior or layout is unique to:
   Pages/Distributor/PricingDetail.razor
   ========================================================= */
/* /Components/Pages/Distributor/PricingQueue.razor.rz.scp.css */
/* =========================================================
   Distributor Pricing Queue
   ---------------------------------------------------------
   Queue layout is maintained by:
   Components/Shared/Promotions/DistributorPricingQueueShared.razor.css

   This file remains available for Distributor-page-only overrides.
   Add styles here only when behavior or layout is unique to:
   Pages/Distributor/PricingQueue.razor
   ========================================================= */
/* /Components/Pages/Distributor/Products.razor.rz.scp.css */
/* Distributor Products page host */
/* ---------------------------------------------------------
   Provides the page-scoped height and overflow host required for
   ProductsShared to own internal table scrolling and keep pagination
   anchored above the application footer.

   This rule remains in Distributor/Products.razor.css because
   .products-page-host is rendered by Distributor/Products.razor and
   Blazor CSS isolation applies only to markup from the matching component.
   --------------------------------------------------------- */

.products-page-host[b-slqdf7bo82] {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-top: 5px;
}

    .products-page-host > *[b-slqdf7bo82] {
        flex: 1 1 auto;
        min-height: 0;
    }

/* Distributor Product Settings modal */
/* ---------------------------------------------------------
   Styles the Distributor-owned Product Settings workflow rendered
   directly by Distributor/Products.razor. These rules remain
   page-scoped because ProductsShared.razor.css isolation does not
   apply to this markup.
   --------------------------------------------------------- */

.products-modal-backdrop[b-slqdf7bo82] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.42);
    z-index: 12400;
}

.products-modal-shell[b-slqdf7bo82] {
    position: fixed;
    inset: 0;
    z-index: 12410;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px 24px;
}

.products-modal-card[b-slqdf7bo82] {
    width: min(920px, calc(100vw - 64px));
    max-height: calc(100vh - 48px);
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--border-200, rgba(25, 35, 68, 0.12));
    border-radius: 20px;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.20);
    overflow: hidden;
}

.products-modal-header[b-slqdf7bo82] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px 12px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.products-modal-title[b-slqdf7bo82] {
    margin: 0;
    color: var(--text-900, #0f172a);
    font-size: 22px;
    line-height: 1.15;
    font-weight: 700;
}

.products-modal-subtitle[b-slqdf7bo82] {
    margin: 4px 0 0;
    color: var(--text-500, #64748b);
    font-size: 13px;
    line-height: 1.35;
}

.products-modal-body[b-slqdf7bo82] {
    flex: 1 1 auto;
    min-height: 0;
    padding: 16px 20px;
    overflow-y: auto;
    overflow-x: hidden;
}

.products-modal-footer[b-slqdf7bo82] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 12px 20px 16px;
    border-top: 1px solid rgba(25, 35, 68, 0.07);
    background: #fff;
}

/* Product context summary */
/* ---------------------------------------------------------
   Displays the selected Product image, Manufacturer, and UPC
   context inside Distributor Product Settings.
   --------------------------------------------------------- */

.products-book-assets-product-summary[b-slqdf7bo82] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px;
    border: 1px solid rgba(25, 35, 68, 0.10);
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.92), #fff);
}

.products-book-assets-product-image[b-slqdf7bo82] {
    flex: 0 0 auto;
    width: 72px;
    height: 72px;
}

.products-book-assets-product-empty[b-slqdf7bo82] {
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    border: 1px dashed var(--border-300, rgba(25, 35, 68, 0.16));
    border-radius: 12px;
    background: #f8fafc;
    color: var(--text-500, #64748b);
    font-size: 11px;
    text-align: center;
}

.products-book-assets-product-copy[b-slqdf7bo82] {
    min-width: 0;
    flex: 1 1 auto;
}

.products-book-assets-product-kicker[b-slqdf7bo82] {
    color: var(--text-500, #64748b);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.products-book-assets-product-title[b-slqdf7bo82] {
    margin-top: 3px;
    color: var(--text-900, #0f172a);
    font-size: 15px;
    line-height: 1.25;
    font-weight: 700;
}

.products-book-assets-product-meta[b-slqdf7bo82] {
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    color: var(--text-600, #475569);
    font-size: 12px;
    line-height: 1.35;
}

/* Distributor setting audit details */
/* ---------------------------------------------------------
   Displays the current participation default, Distributor Item #,
   and latest update metadata.
   --------------------------------------------------------- */

.products-detail-audit-strip[b-slqdf7bo82] {
    padding: 10px 12px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 14px;
    background: #f8fafc;
}

.products-detail-audit-grid[b-slqdf7bo82] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px 14px;
}

    .products-detail-audit-grid span[b-slqdf7bo82] {
        display: block;
        color: var(--text-500, #64748b);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.03em;
        text-transform: uppercase;
    }

    .products-detail-audit-grid strong[b-slqdf7bo82] {
        display: block;
        margin-top: 2px;
        color: var(--text-800, #1f2937);
        font-size: 12.5px;
        line-height: 1.3;
        font-weight: 600;
        word-break: break-word;
    }

/* Responsive modal behavior */
/* ---------------------------------------------------------
   Adapts the Distributor Product Settings modal and audit grid
   for narrower browser viewports.
   --------------------------------------------------------- */

@media (max-width: 760px) {
    .products-modal-shell[b-slqdf7bo82] {
        align-items: stretch;
        padding: 12px;
    }

    .products-modal-card[b-slqdf7bo82] {
        width: 100%;
        max-height: calc(100vh - 24px);
    }

    .products-book-assets-product-summary[b-slqdf7bo82] {
        align-items: flex-start;
    }

    .products-detail-audit-grid[b-slqdf7bo82] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* /Components/Pages/Manufacturer/Books.razor.rz.scp.css */
/* =========================================================
   Manufacturer Books
   ---------------------------------------------------------
   Books layout is maintained by:
   Components/Shared/Books/BookShared.razor.css

   Add styles here only when behavior or layout is unique to:
   Pages/Manufacturer/Books.razor
   ========================================================= */
/* /Components/Pages/Manufacturer/Products.razor.rz.scp.css */
/* 
   Products page needs a scoped height/overflow host so the table region can own
   its internal scroll and keep the pager anchored above the footer.

   This is defined in Products.razor.css instead of ProductsShared.razor.css
   because the .products-page-host class is applied in Products.razor, and
   Blazor CSS isolation only affects markup rendered by the matching component.
*/

.products-page-host[b-70gp84no5v] {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-top: 5px;
}

  .products-page-host > *[b-70gp84no5v] {
    flex: 1 1 auto;
    min-height: 0;
  }
/* /Components/Pages/Manufacturer/PromotionEdit.razor.rz.scp.css */
/* =========================================================
   PromotionEdit.razor.css - Manufacturer-only Promotion Edit styles
   ========================================================= */
/* /Components/Pages/Manufacturer/Promotions.razor.rz.scp.css */
/* Manufacturer Promotions page styles */
/* ---------------------------------------------------------
   Provides Manufacturer-specific overrides for
   PromotionsShared.razor.css.
   Controls Create Promotion worksheet-type selection and
   responsive card behavior.
   --------------------------------------------------------- */

/* Create Promotion type selector */
/* ---------------------------------------------------------
   Provides the Open-Stock and Pre-Pack selection cards used
   inside the Manufacturer Create Promotion Draft form.
   --------------------------------------------------------- */

.promotions-create-type-selector[b-w7hcdohjah] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}

.promotions-create-type-card[b-w7hcdohjah] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
    padding: 10px 12px;
    text-align: left;
    border: 1px solid var(--border-200);
    border-radius: 12px;
    background: var(--bg-surface);
    color: var(--text-900);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

    .promotions-create-type-card:hover[b-w7hcdohjah] {
        border-color: rgba(59, 130, 246, 0.45);
        box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.08);
        background: #fcfdff;
    }

    .promotions-create-type-card.is-active[b-w7hcdohjah] {
        border-color: rgba(37, 99, 235, 0.9);
        box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.18);
        background: rgba(59, 130, 246, 0.04);
    }

.promotions-create-type-card--prepack.is-active[b-w7hcdohjah] {
    border-color: rgba(63, 111, 159, 0.55);
    box-shadow: 0 0 0 1px rgba(63, 111, 159, 0.12);
    background: linear-gradient(135deg, rgba(63, 111, 159, 0.08), rgba(63, 111, 159, 0.03));
}

.promotions-create-type-card--openstock.is-active[b-w7hcdohjah] {
    border-color: rgba(142, 59, 103, 0.42);
    box-shadow: 0 0 0 1px rgba(142, 59, 103, 0.10);
    background: linear-gradient(135deg, rgba(142, 59, 103, 0.07), rgba(142, 59, 103, 0.025));
}

.promotions-create-type-card-icon[b-w7hcdohjah] {
    flex: 0 0 auto;
    width: 20px;
    font-size: 16px;
    line-height: 1;
    margin-top: 2px;
}

.promotions-create-type-card-content[b-w7hcdohjah] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.promotions-create-type-card-title[b-w7hcdohjah] {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-900);
    line-height: 1.2;
}

.promotions-create-type-card-text[b-w7hcdohjah] {
    font-size: 13px;
    line-height: 1.35;
    color: var(--text-600);
}

/* Responsive behavior */
/* ---------------------------------------------------------
   Stacks worksheet-type cards into one column for narrower
   Manufacturer workspaces.
   --------------------------------------------------------- */

@media (max-width: 768px) {
    .promotions-create-type-selector[b-w7hcdohjah] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/MyAccount.razor.rz.scp.css */
.account-page[b-ng7rm1j7j6] {
  max-width: 1080px;
}

.account-page__description[b-ng7rm1j7j6] {
  margin: 0.75rem 0 1rem 0;
  color: #6b7280;
  font-size: 0.95rem;
}

.account-layout[b-ng7rm1j7j6] {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 1.25rem;
  align-items: start;
}

.account-nav[b-ng7rm1j7j6] {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 0.75rem;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  position: sticky;
  top: 1rem;
}

.account-nav__item[b-ng7rm1j7j6] {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  border-radius: 12px;
  padding: 0.8rem 0.9rem;
  font-weight: 600;
  color: #374151;
  transition: background-color 0.15s ease, color 0.15s ease;
  margin-bottom: 0.35rem;
}

  .account-nav__item:last-child[b-ng7rm1j7j6] {
    margin-bottom: 0;
  }

  .account-nav__item:hover[b-ng7rm1j7j6] {
    background: #f3f4f6;
  }

  .account-nav__item.is-active[b-ng7rm1j7j6] {
    background: #eef4ff;
    color: #1d4ed8;
  }

.account-panel[b-ng7rm1j7j6] {
  min-width: 0;
}

.account-card[b-ng7rm1j7j6] {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 1.5rem;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.account-card__header[b-ng7rm1j7j6] {
  margin-bottom: 1.25rem;
}

  .account-card__header h4[b-ng7rm1j7j6] {
    margin-bottom: 0.25rem;
  }

  .account-card__header p[b-ng7rm1j7j6] {
    margin: 0;
    color: #6b7280;
  }

.account-inline-actions[b-ng7rm1j7j6] {
  margin-top: 0.5rem;
}

.account-actions[b-ng7rm1j7j6] {
  margin-top: 1.25rem;
  display: flex;
  justify-content: flex-start;
}

.account-save-btn[b-ng7rm1j7j6] {
  min-width: 190px;
}

@media (max-width: 992px) {
  .account-layout[b-ng7rm1j7j6] {
    grid-template-columns: 1fr;
  }

  .account-nav[b-ng7rm1j7j6] {
    position: static;
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
  }

  .account-nav__item[b-ng7rm1j7j6] {
    width: auto;
    min-width: 120px;
    margin-bottom: 0;
    white-space: nowrap;
  }
}
/* /Components/Pages/Notifications/Notifications.razor.rz.scp.css */
.notifications-page[b-mh1beyhzwe] {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 14px;
  overflow: hidden;
  padding-top: 2px;
}

.notifications-shell[b-mh1beyhzwe] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.notifications-main-card[b-mh1beyhzwe] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-200, rgba(25, 35, 68, 0.10));
  border-radius: 18px;
  overflow: hidden;
}

.notifications-card-header[b-mh1beyhzwe] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 12px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.notifications-title[b-mh1beyhzwe] {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--text-900, #0f172a);
}

.notifications-subtitle[b-mh1beyhzwe] {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--text-500, #64748b);
}

.notifications-loading[b-mh1beyhzwe] {
  min-height: 240px;
  display: grid;
  place-items: center;
  gap: 10px;
}

.notifications-loading-spinner[b-mh1beyhzwe] {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 3px solid rgba(25, 35, 68, 0.10);
  border-top-color: var(--brand-600, #2563eb);
  animation: notifications-spin-b-mh1beyhzwe 0.8s linear infinite;
}

.notifications-loading-text[b-mh1beyhzwe] {
  font-size: 13px;
  color: var(--text-600, #475569);
}

@keyframes notifications-spin-b-mh1beyhzwe {
  to {
    transform: rotate(360deg);
  }
}

.notifications-body[b-mh1beyhzwe] {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  padding-bottom: 14px;
}

.notifications-toolbar[b-mh1beyhzwe] {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(280px, 1fr) 170px 140px 88px;
  gap: 10px;
  align-items: end;
  padding: 14px 12px 0;
}

.notifications-search[b-mh1beyhzwe],
.notifications-select[b-mh1beyhzwe],
.notifications-page-size[b-mh1beyhzwe] {
  width: 100%;
  min-height: 38px;
}

.notifications-search-wrapper[b-mh1beyhzwe] {
  width: 100%;
}

.notifications-search-input[b-mh1beyhzwe] {
  width: 100%;
}

.notifications-table-region[b-mh1beyhzwe] {
  min-height: 0;
  height: 100%;
  margin: 12px 12px 0;
  background: #fff;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 10px;
  overflow: hidden;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
}

.notifications-table-wrap[b-mh1beyhzwe] {
  min-height: 0;
  height: 100%;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  background: #fff;
  padding-bottom: 10px;
  padding-left: 8px;
}

.notifications-table[b-mh1beyhzwe] {
  width: 100%;
  min-width: 1080px;
  margin-bottom: 0;
  vertical-align: middle;
  table-layout: fixed;
}

  .notifications-table thead th[b-mh1beyhzwe] {
    position: sticky;
    top: 0;
    z-index: 5;
    background: #fff;
    padding-top: 12px;
    padding-bottom: 12px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--text-500, #64748b);
    border-bottom-width: 1px;
    white-space: nowrap;
  }

  .notifications-table tbody td[b-mh1beyhzwe] {
    padding-top: 10px;
    padding-bottom: 10px;
    border-color: rgba(25, 35, 68, 0.08);
    color: var(--text-900, #0f172a);
    vertical-align: top;
  }

.notifications-row.is-unread td[b-mh1beyhzwe] {
  background: rgba(37, 99, 235, 0.025);
}

.notifications-row:hover td[b-mh1beyhzwe] {
  background: rgba(25, 35, 68, 0.018);
}

.notifications-col-status[b-mh1beyhzwe] {
  width: 82px;
  min-width: 82px;
}

.notifications-col-category[b-mh1beyhzwe] {
  width: 136px;
  min-width: 136px;
}

.notifications-col-severity[b-mh1beyhzwe] {
  width: 90px;
  min-width: 90px;
}

.notifications-col-message[b-mh1beyhzwe] {
  width: 366px;
  min-width: 366px;
}

.notifications-col-related[b-mh1beyhzwe] {
  width: 156px;
  min-width: 156px;
}

.notifications-col-date[b-mh1beyhzwe] {
  width: 156px;
  min-width: 156px;
  white-space: nowrap;
}

.notifications-col-action[b-mh1beyhzwe] {
  width: 110px;
  min-width: 110px;
}

.notifications-status-badge[b-mh1beyhzwe],
.notifications-category-badge[b-mh1beyhzwe],
.notifications-severity-badge[b-mh1beyhzwe] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.notification-status-unread[b-mh1beyhzwe] {
  background: #dbeafe;
  color: #1d4ed8;
  border: 1px solid rgba(37, 99, 235, 0.18);
}

.notification-status-read[b-mh1beyhzwe] {
  background: #f1f5f9;
  color: #64748b;
  border: 1px solid rgba(100, 116, 139, 0.16);
}

.notification-category-action[b-mh1beyhzwe] {
  background: #fff1f2;
  color: #be123c;
  border: 1px solid rgba(244, 63, 94, 0.22);
}

.notification-category-review[b-mh1beyhzwe] {
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid rgba(249, 115, 22, 0.22);
}

.notification-category-deadline[b-mh1beyhzwe] {
  background: #fefce8;
  color: #a16207;
  border: 1px solid rgba(234, 179, 8, 0.26);
}

.notification-category-assignment[b-mh1beyhzwe] {
  background: #eef2ff;
  color: #4338ca;
  border: 1px solid rgba(99, 102, 241, 0.22);
}

.notification-category-system[b-mh1beyhzwe],
.notification-category-status[b-mh1beyhzwe] {
  background: #f1f5f9;
  color: #475569;
  border: 1px solid rgba(100, 116, 139, 0.18);
}

.notification-severity-high[b-mh1beyhzwe] {
  background: #fee2e2;
  color: #b91c1c;
  border: 1px solid rgba(239, 68, 68, 0.24);
}

.notification-severity-medium[b-mh1beyhzwe] {
  background: #ffedd5;
  color: #c2410c;
  border: 1px solid rgba(249, 115, 22, 0.22);
}

.notification-severity-low[b-mh1beyhzwe] {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid rgba(16, 185, 129, 0.22);
}

.notifications-message-title[b-mh1beyhzwe] {
  font-size: 13px;
  font-weight: 800;
  color: var(--text-900, #0f172a);
  line-height: 1.25;
}

.notifications-message-text[b-mh1beyhzwe] {
  margin-top: 3px;
  font-size: 12px;
  color: var(--text-600, #475569);
  line-height: 1.35;
}

.notifications-related-type[b-mh1beyhzwe] {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-800, #1f2937);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.notifications-related-id[b-mh1beyhzwe] {
  margin-top: 2px;
  font-size: 11px;
  color: var(--text-500, #64748b);
}

.notifications-actions[b-mh1beyhzwe] {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.notifications-link-button[b-mh1beyhzwe] {
  border: 0;
  background: transparent;
  padding: 0;
  text-align: left;
  font-size: 12px;
  font-weight: 700;
  color: var(--link-600, #2563eb);
}

  .notifications-link-button:hover[b-mh1beyhzwe] {
    text-decoration: underline;
  }

.notifications-empty[b-mh1beyhzwe] {
  text-align: center;
  color: var(--text-500, #64748b);
  padding: 2rem 1rem !important;
}

.notifications-pager[b-mh1beyhzwe] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 6px 14px 4px;
  background: #f8fafc;
  border-top: 1px solid rgba(25, 35, 68, 0.06);
  flex-wrap: wrap;
}

.notifications-pager-meta[b-mh1beyhzwe] {
  font-size: 12px;
  color: var(--text-600, #475569);
}

.notifications-pager-actions[b-mh1beyhzwe] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.notifications-pager-page[b-mh1beyhzwe] {
  min-width: 88px;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-700, #334155);
}

@media (max-width: 900px) {
  .notifications-toolbar[b-mh1beyhzwe] {
    grid-template-columns: 1fr 1fr;
  }
}
/* /Components/Pages/PageRefreshButton.razor.rz.scp.css */
.page-refresh-control[b-7jbugvs53q] {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  margin-right: 24px;
}

.page-refresh-button[b-7jbugvs53q] {
  min-height: 31px;
  min-width: 0;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 13px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.68);
  color: #263b5f;
  line-height: 1;
  white-space: nowrap;
  box-shadow: none;
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease, box-shadow 120ms ease;
}

  .page-refresh-button:hover:not(:disabled)[b-7jbugvs53q] {
    background: rgba(248, 251, 255, 0.92);
    border-color: rgba(31, 55, 99, 0.16);
    color: #1d355f;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
  }

  .page-refresh-button:focus-visible[b-7jbugvs53q] {
    outline: none;
    border-color: rgba(37, 99, 235, 0.32);
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.12);
  }

  .page-refresh-button:disabled[b-7jbugvs53q] {
    opacity: 0.58;
    cursor: default;
  }

.page-refresh-button--stale[b-7jbugvs53q] {
  border-color: rgba(37, 99, 235, 0.18);
  background: rgba(248, 251, 255, 0.84);
}

.page-refresh-primary[b-7jbugvs53q] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 740;
  letter-spacing: 0.005em;
}

.page-refresh-meta[b-7jbugvs53q] {
  display: inline-flex;
  align-items: center;
  color: #7d8798;
  font-size: 11px;
  font-weight: 560;
  line-height: 1;
}

  .page-refresh-meta[b-7jbugvs53q]::before {
    content: "·";
    margin-right: 7px;
    color: #aab4c3;
    font-weight: 700;
  }

.page-refresh-button--stale .page-refresh-meta[b-7jbugvs53q] {
  color: #2b5da8;
  font-weight: 680;
}

.page-refresh-icon[b-7jbugvs53q] {
  font-size: 12.5px;
  line-height: 1;
}

.page-refresh-icon--spinning[b-7jbugvs53q] {
  animation: page-refresh-spin-b-7jbugvs53q 850ms linear infinite;
}

@keyframes page-refresh-spin-b-7jbugvs53q {
  to {
    transform: rotate(360deg);
  }
}
/* /Components/Pages/Settings.razor.rz.scp.css */
/* =========================================================
   Settings page shell
   ========================================================= */

.settings-page[b-wj0yi90d58] {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-top: 2px;
}

.settings-shell[b-wj0yi90d58] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  overflow: hidden;
  width: 100%;
  max-width: none;
}

/* =========================================================
   Page header
   ========================================================= */

.settings-page-header[b-wj0yi90d58] {
  flex: 0 0 auto;
  padding: 0.10rem 0.05rem 0;
  margin-bottom: 0;
}

.settings-page-header-copy[b-wj0yi90d58] {
  min-width: 0;
}

.settings-page-title[b-wj0yi90d58] {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: var(--text-900, #192344);
  line-height: 1.2;
}

.settings-page-subtitle[b-wj0yi90d58] {
  margin: 4px 0 0;
  color: var(--text-500, #667085);
  font-size: 13px;
  line-height: 1.35;
  max-width: 760px;
}

/* =========================================================
   Main card
   ========================================================= */

.settings-main-card[b-wj0yi90d58] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 18px;
  /*box-shadow: var(--shadow-1);*/
}

.settings-main-card-header[b-wj0yi90d58] {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 12px 8px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.settings-main-card-copy[b-wj0yi90d58] {
  min-width: 0;
  flex: 1 1 auto;
}

.settings-main-card-title[b-wj0yi90d58] {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--text-900, #192344);
  line-height: 1.2;
}

.settings-main-card-subtitle[b-wj0yi90d58] {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--text-500, #667085);
  line-height: 1.35;
}

.settings-main-card-actions[b-wj0yi90d58] {
  flex: 0 0 auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

/* =========================================================
   Scroll region
   ========================================================= */

.settings-scroll[b-wj0yi90d58] {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding: 12px 14px 14px;
}

/* =========================================================
   Settings groups
   ========================================================= */

.settings-group + .settings-group[b-wj0yi90d58] {
  margin-top: 0.85rem;
}

.settings-group-header[b-wj0yi90d58] {
  margin-bottom: 0.32rem;
  padding: 0 2px;
}

.settings-group-title[b-wj0yi90d58] {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  color: var(--text-900, #192344);
  line-height: 1.2;
}

.settings-section-card[b-wj0yi90d58] {
  background: #fff;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 10px;
  padding: 0.80rem 1rem;
}

/* =========================================================
   Form layout
   ========================================================= */

.settings-grid[b-wj0yi90d58] {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 12px 16px;
  align-items: start;
}

.settings-grid--single-start[b-wj0yi90d58] {
  grid-template-columns: minmax(260px, 420px);
}

.settings-field[b-wj0yi90d58] {
  min-width: 0;
}

.settings-field--full[b-wj0yi90d58] {
  grid-column: 1 / -1;
}

.settings-field--medium[b-wj0yi90d58] {
  max-width: 420px;
}

.settings-field .form-label[b-wj0yi90d58] {
  display: inline-block;
  margin-bottom: 0.26rem;
  font-size: 0.85rem;
  font-weight: 400;
  color: var(--text-900, #192344);
  line-height: 1.2;
}

.settings-field .form-control[b-wj0yi90d58],
.settings-field .form-select[b-wj0yi90d58] {
  min-height: 36px;
}

.settings-check[b-wj0yi90d58] {
  margin: 0.04rem 0 0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 32px;
}

  .settings-check .form-check-input[b-wj0yi90d58] {
    margin-top: 0;
    flex: 0 0 auto;
  }

  .settings-check .form-check-label[b-wj0yi90d58] {
    margin: 0;
    color: var(--text-900, #192344);
    font-weight: 400;
    line-height: 1.25;
  }

/* =========================================================
   Save button
   ========================================================= */

.settings-save-btn[b-wj0yi90d58] {
  min-width: 150px;
  min-height: 30px;
  padding: 4px 16px;
  font-size: 14px;
  border-radius: 8px;
  font-weight: 600;
  box-shadow: none;
}

/* =========================================================
   Disabled field styling
   ========================================================= */

.settings-main-card .form-control:disabled[b-wj0yi90d58],
.settings-main-card .form-select:disabled[b-wj0yi90d58] {
  background-color: #f8fafc;
  color: #64748b;
  opacity: 1;
  border-color: rgba(25, 35, 68, 0.08);
  cursor: not-allowed;
}

  .settings-main-card .form-control:disabled[b-wj0yi90d58]::placeholder {
    color: #94a3b8;
  }

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 1100px) {
  .settings-scroll[b-wj0yi90d58] {
    padding: 12px 12px 14px;
  }

  .settings-grid[b-wj0yi90d58] {
    grid-template-columns: 1fr;
    gap: 10px 0;
  }

  .settings-grid--single-start[b-wj0yi90d58] {
    grid-template-columns: 1fr;
  }

  .settings-field--medium[b-wj0yi90d58] {
    max-width: none;
  }
}

@media (max-width: 768px) {
  .settings-main-card-header[b-wj0yi90d58] {
    align-items: flex-start;
    flex-direction: column;
  }

  .settings-main-card-actions[b-wj0yi90d58] {
    width: 100%;
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  .settings-page-title[b-wj0yi90d58] {
    font-size: 20px;
  }

  .settings-page-subtitle[b-wj0yi90d58],
  .settings-main-card-subtitle[b-wj0yi90d58] {
    font-size: 12px;
  }

  .settings-section-card[b-wj0yi90d58] {
    padding: 0.75rem 0.85rem;
  }

  .settings-save-btn[b-wj0yi90d58] {
    width: 100%;
    min-width: 0;
  }
}
/* /Components/Pages/Wam.Assets.BrandGuidelines.razor.rz.scp.css */
.brand-guidelines-admin-page[b-brs5peoila] {
  --deep-navy: #192344;
  --honest-blue: #1D3A6D;
  --slate-blue: #758CA7;
  --pale-slate: #D8E2E8;
  --almond-cream: #EBE1CB;
  --paper-white: #FFFFFF;
  --tech-turquoise: #5BC4BF;
  --magnetic-mandarine: #FAA94B;
  --electric-lime: #D2DE31;
  --preeminent-pine: #437367;
  --captivating-coral: #F15F57;
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.brand-guidelines-shell[b-brs5peoila] {
  width: 100%;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.brand-guidelines-page-header[b-brs5peoila] {
  padding: 0.05rem 0.1rem 0.25rem;
}

.brand-guidelines-page-subtitle[b-brs5peoila] {
  margin: 0;
  color: var(--text-500, #758CA7);
  font-size: 0.9rem;
  line-height: 1.35;
}

.brand-guidelines-main-card[b-brs5peoila] {
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-200, rgba(25, 35, 68, 0.08));
  border-radius: 14px;
  box-shadow: var(--shadow-1, 0 1px 2px rgba(15, 23, 42, 0.06), 0 6px 18px rgba(15, 23, 42, 0.06));
  padding: 0.85rem 1rem 0.9rem;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-gutter: stable;
}

.brand-guidelines-group + .brand-guidelines-group[b-brs5peoila] {
  margin-top: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--border-200, rgba(25, 35, 68, 0.08));
}

.brand-guidelines-group-header[b-brs5peoila] {
  margin-bottom: 0.6rem;
}

.brand-guidelines-group-title[b-brs5peoila] {
  margin: 0 0 0.1rem;
  font-size: 1.35rem;
  line-height: 1.15;
  font-weight: 700;
  color: var(--text-500, #758CA7);
}

.brand-guidelines-group-subtitle[b-brs5peoila] {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.35;
  color: var(--text-500, #758CA7);
}

.color-grid[b-brs5peoila] {
  display: grid;
  gap: 1rem 1.25rem;
  align-items: start;
}

.color-grid--three[b-brs5peoila] {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.color-grid--two[b-brs5peoila] {
  grid-template-columns: repeat(auto-fit, minmax(220px, 260px));
}

.color-card[b-brs5peoila] {
  min-width: 0;
  max-width: 240px;
}

.swatch[b-brs5peoila] {
  width: 88px;
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin-bottom: 0.45rem;
  font-size: 0.86rem;
  font-weight: 500;
  line-height: 1.1;
  color: var(--text-500, #758CA7);
}

.brand-guidelines-group:last-of-type .swatch[b-brs5peoila] {
  font-size: 0.72rem;
  line-height: 1.05;
  padding: 0 0.2rem;
}

.swatch--dark[b-brs5peoila] {
  color: #fff;
}

.swatch--outline[b-brs5peoila] {
  border: 1px solid #c8ced6;
}

.text-light[b-brs5peoila] {
  color: #fff;
}

.color-meta[b-brs5peoila] {
  font-size: 0.88rem;
  line-height: 1.4;
  color: var(--text-900, #192344);
}

  .color-meta strong[b-brs5peoila] {
    font-weight: 700;
  }

@media (max-width: 768px) {
  .brand-guidelines-main-card[b-brs5peoila] {
    padding: 0.8rem 0.85rem 0.9rem;
  }

  .brand-guidelines-group-title[b-brs5peoila] {
    font-size: 1.15rem;
  }

  .brand-guidelines-group-subtitle[b-brs5peoila] {
    font-size: 0.9rem;
  }

  .color-card[b-brs5peoila] {
    max-width: unset;
  }
}
/* /Components/Shared/Books/BooksAdminWorkspace.razor.rz.scp.css */
/* =========================================================
   BooksAdminWorkspace.razor.css
   Admin Books workspace styles
   ---------------------------------------------------------
   Hosts the Admin Books tab experience:
   - Final Book Packages
   - Manufacturer Book Proofs

   Keep this file focused on the workspace shell and tab
   navigation only. Page-specific table/card styling belongs
   in the child page/component CSS files.
   ========================================================= */

/* =========================================================
   Workspace shell
   ---------------------------------------------------------
   Maintains the full-height flex chain so the active child
   page can own internal scrolling and sticky pagination.
   ========================================================= */

.admin-books-workspace[b-1jeyxd4j5c] {
  flex: 1 1 auto;
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #f8fafc;
}

/* =========================================================
   Books tab strip
   ---------------------------------------------------------
   Compact pill-style navigation aligned with Report tabs.
   Used only to switch between Admin Books sub-workflows.
   ========================================================= */

.admin-books-tabs[b-1jeyxd4j5c] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  gap: 4px;
  padding: 4px;
  margin: 0 0 10px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 999px;
  background: #f8fafc;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
  min-width: 0;
  flex-wrap: wrap;
}

.admin-books-tab[b-1jeyxd4j5c] {
  appearance: none;
  border: 0;
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  min-width: 138px;
  padding: 0 18px;
  border-radius: 999px;
  color: var(--text-600, #475569);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

  .admin-books-tab:hover[b-1jeyxd4j5c] {
    color: #1d3a6d;
    background: rgba(37, 99, 235, 0.06);
  }

.admin-books-tab--active[b-1jeyxd4j5c] {
  background: #fff;
  color: #1d4ed8;
  box-shadow: 0 1px 5px rgba(15, 23, 42, 0.12);
}

.admin-books-tab:focus-visible[b-1jeyxd4j5c] {
  outline: none;
  box-shadow: var(--focus-ring);
}

/* =========================================================
   Active tab panel
   ---------------------------------------------------------
   The active child component fills this region and owns its
   own table/list scrolling behavior.
   ========================================================= */

.admin-books-panel[b-1jeyxd4j5c] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Ensure nested BooksShared pages preserve fixed-height behavior. */
[b-1jeyxd4j5c] .books-page {
  height: 100%;
  min-height: 0;
}
/* /Components/Shared/Books/BooksManufacturerWorkspace.razor.rz.scp.css */
/* =========================================================
   BooksManufacturerWorkspace.razor.css
   Manufacturer-side Books workspace styles
   ---------------------------------------------------------
   Hosts the shared Manufacturer-side Books tab experience:
   - Published Books
   - Book Proofs

   Broker uses this same workspace with represented
   Manufacturer scope. Keep this file focused on shell and
   tab navigation only.
   ========================================================= */

/* =========================================================
   Workspace shell
   ---------------------------------------------------------
   Maintains the full-height flex chain so Published Books
   and Book Proofs can own internal scrolling.
   ========================================================= */

.manufacturer-books-workspace[b-hjmrvp53kf] {
  flex: 1 1 auto;
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #f8fafc;
}

/* =========================================================
   Books tab strip
   ---------------------------------------------------------
   Compact pill-style navigation aligned with Report tabs.
   Used by Manufacturer and Broker Books pages.
   ========================================================= */

.manufacturer-books-tabs[b-hjmrvp53kf] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  gap: 4px;
  padding: 4px;
  margin: 0 0 10px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 999px;
  background: #f8fafc;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
  min-width: 0;
  flex-wrap: wrap;
}

.manufacturer-books-tab[b-hjmrvp53kf] {
  appearance: none;
  border: 0;
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  min-width: 124px;
  padding: 0 18px;
  border-radius: 999px;
  color: var(--text-600, #475569);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

  .manufacturer-books-tab:hover[b-hjmrvp53kf] {
    color: #1d3a6d;
    background: rgba(37, 99, 235, 0.06);
  }

.manufacturer-books-tab--active[b-hjmrvp53kf] {
  background: #fff;
  color: #1d4ed8;
  box-shadow: 0 1px 5px rgba(15, 23, 42, 0.12);
}

.manufacturer-books-tab:focus-visible[b-hjmrvp53kf] {
  outline: none;
  box-shadow: var(--focus-ring);
}

/* =========================================================
   Active tab panel
   ---------------------------------------------------------
   The active child component fills this region and owns its
   own table/list scrolling behavior.
   ========================================================= */

.manufacturer-books-panel[b-hjmrvp53kf] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Ensure nested BooksShared pages preserve fixed-height behavior. */
[b-hjmrvp53kf] .books-page {
  height: 100%;
  min-height: 0;
}
/* /Components/Shared/Books/BooksShared.razor.rz.scp.css */
/* BooksShared.razor.css */
/* ---------------------------------------------------------
   Provides the shared WAM Admin, Distributor, Manufacturer, and
   Broker Books workspace, including summary cards, filters,
   fixed-height tables, sticky actions, anchored pagination,
   Final Book package details, uploads, replacements, previews,
   and projected create-panel validation.
   --------------------------------------------------------- */

/* Page shell */
/* ---------------------------------------------------------
   Participates in the shared full-height layout chain and
   establishes the Books page container-query context.
   --------------------------------------------------------- */

.books-page[b-m9xufmwp9t] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: #f8fafc;
    color: #0f172a;
    overflow: hidden;
    box-sizing: border-box;
    container-type: inline-size;
    container-name: books-page;
}

.books-workspace[b-m9xufmwp9t] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow: hidden;
}

/* Summary cards */
/* ---------------------------------------------------------
   Provides compact operational status cards aligned with
   DashboardShared and supports quick status filtering.
   --------------------------------------------------------- */

.books-summary-strip[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: grid;
    gap: 10px;
}

.books-summary-strip--four[b-m9xufmwp9t] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.books-summary-card[b-m9xufmwp9t] {
    min-width: 0;
    padding: 8px 10px;
    background: #fff;
    border: 1px solid var(--border-200);
    border-radius: 13px;
    text-align: left;
    box-shadow: var(--shadow-1);
}

.books-summary-card-button[b-m9xufmwp9t] {
    width: 100%;
    appearance: none;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

    .books-summary-card-button:hover[b-m9xufmwp9t] {
        border-color: rgba(29, 58, 109, 0.18);
        box-shadow: 0 3px 10px rgba(15, 23, 42, 0.06);
    }

.books-summary-card.is-active[b-m9xufmwp9t] {
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.04), 0 3px 10px rgba(15, 23, 42, 0.06);
}

.books-summary-card--success[b-m9xufmwp9t] {
    border-color: rgba(91, 196, 191, 0.38);
    background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.books-summary-card--warning[b-m9xufmwp9t] {
    border-color: rgba(250, 169, 75, 0.32);
    background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

.books-summary-card--info[b-m9xufmwp9t] {
    border-color: rgba(117, 140, 167, 0.24);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.04), #fff);
}

.books-summary-card--neutral[b-m9xufmwp9t] {
    border-color: rgba(117, 140, 167, 0.22);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.035), #fff);
}

.books-summary-label[b-m9xufmwp9t] {
    margin: 0 0 6px;
    overflow: hidden;
    color: var(--text-600);
    font-size: 13.5px;
    line-height: 1.3;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.books-summary-value[b-m9xufmwp9t] {
    margin: 0;
    color: var(--text-900);
    font-size: 21px;
    line-height: 1;
    font-weight: 800;
}

.books-summary-meta[b-m9xufmwp9t] {
    margin-top: 5px;
    overflow: hidden;
    color: var(--text-500);
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Final Book list card */
/* ---------------------------------------------------------
   Contains the page header, role-appropriate actions, filters,
   internally scrolling table, and anchored pagination.
   --------------------------------------------------------- */
.books-card[b-m9xufmwp9t] {
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
}

.books-list-card[b-m9xufmwp9t] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.books-panel-header[b-m9xufmwp9t] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 0.95rem 1rem 0.7rem;
    border-bottom: 1px solid #e2e8f0;
    flex: 0 0 auto;
}

.books-panel-title[b-m9xufmwp9t] {
    min-width: 0;
}

.books-panel-actions[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.books-primary-button[b-m9xufmwp9t] {
    min-height: 2.05rem;
    min-width: 140px;
    padding: 0.38rem 0.85rem;
    border-radius: 0.55rem;
    font-size: 0.86rem;
    font-weight: 750;
    line-height: 1.2;
}

.books-card-title[b-m9xufmwp9t] {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--text-900);
}

.books-card-subtitle[b-m9xufmwp9t] {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--text-500);
}

.books-list-body[b-m9xufmwp9t] {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    min-width: 0;
    padding: 0;
}

/* Filters and search */
/* ---------------------------------------------------------
   Provides shared search, Promo Year, Promo Month, Book Type,
   status, and page-size controls.
   --------------------------------------------------------- */
.books-controls[b-m9xufmwp9t] {
    display: grid;
    grid-template-columns: minmax(320px, 1.8fr) repeat(5, minmax(118px, 0.55fr));
    gap: 0.65rem;
    padding: 0.85rem 1rem 0.7rem;
    border-bottom: 0;
    background: #ffffff;
    flex: 0 0 auto;
}

.books-control[b-m9xufmwp9t] {
    min-width: 0;
}

/* Prevent search control overflow at reduced content widths. */
.books-control-search[b-m9xufmwp9t] {
    min-width: 0;
}

.books-control-label[b-m9xufmwp9t] {
    display: block;
    margin-bottom: 0.22rem;
    font-size: 0.72rem;
    font-weight: 800;
    color: #334155;
}

.books-search[b-m9xufmwp9t],
.books-filter-select[b-m9xufmwp9t] {
    min-height: 2.2rem;
    border-radius: 0.55rem;
    border-color: #dbe4ef;
    font-size: 0.84rem;
    color: #0f172a;
}

    .books-search[b-m9xufmwp9t]::placeholder {
        color: #94a3b8;
    }

/* Filter toolbar container behavior */
/* ---------------------------------------------------------
   Responds to actual Books content width after sidebar
   expansion or collapse rather than browser width alone.
   --------------------------------------------------------- */

@container books-page (max-width: 1120px) {
    .books-controls[b-m9xufmwp9t] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .books-control-search[b-m9xufmwp9t] {
        grid-column: 1 / span 2;
    }
}

@container books-page (max-width: 820px) {
    .books-controls[b-m9xufmwp9t] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .books-control-search[b-m9xufmwp9t] {
        grid-column: 1 / -1;
    }
}

.books-table-region[b-m9xufmwp9t] {
    min-height: 0;
    height: 100%;
    margin: 0 12px 0;
    background: #ffffff;
    overflow: hidden;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
}

.books-table-wrap[b-m9xufmwp9t] {
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    position: relative;
    background: #ffffff;
}

.books-table[b-m9xufmwp9t] {
    margin: 0;
    min-width: 1100px;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.82rem;
    padding-left: 8px;
}

    /* Sticky table header */
    /* ---------------------------------------------------------
   Keeps Final Book column headings visible inside the
   table-owned vertical scrolling region.
   --------------------------------------------------------- */
    .books-table thead th[b-m9xufmwp9t] {
        position: sticky;
        top: 0;
        z-index: 12;
        background: #ffffff;
        border-bottom: 0;
        color: #64748b;
        font-size: 0.7rem;
        font-weight: 850;
        text-transform: uppercase;
        letter-spacing: 0.035em;
        white-space: nowrap;
        padding: 0.58rem 0.55rem;
        box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
    }

    .books-table tbody td[b-m9xufmwp9t] {
        vertical-align: middle;
        border-bottom: 1px solid #edf2f7;
        padding: 0.56rem 0.55rem;
        background: #ffffff;
    }

    .books-table tbody tr:hover td[b-m9xufmwp9t] {
        background: #fbfdff;
    }

/* Final Book table columns */
/* ---------------------------------------------------------
   Uses fixed column widths to protect the desktop workspace
   and preserve the shared enterprise table layout.
   --------------------------------------------------------- */
.books-col-cycle[b-m9xufmwp9t] {
    width: 245px;
}

.books-col-period[b-m9xufmwp9t] {
    width: 92px;
}

.books-col-company[b-m9xufmwp9t] {
    width: 155px;
}

.books-col-type[b-m9xufmwp9t] {
    width: 105px;
}

.books-col-status[b-m9xufmwp9t] {
    width: 95px;
}

.books-col-books[b-m9xufmwp9t] {
    width: 72px;
    text-align: center;
}

.books-col-promotions[b-m9xufmwp9t] {
    width: 96px;
    text-align: center;
}

.books-col-published[b-m9xufmwp9t] {
    width: 108px;
}

.books-col-actions[b-m9xufmwp9t] {
    width: 112px;
}

/* Sticky Actions column */
/* ---------------------------------------------------------
   Keeps Final Book actions visible during horizontal scrolling.
   The sticky cell remains neutral while the inner action zone
   provides visual emphasis.
   --------------------------------------------------------- */
.books-table th.books-col-actions[b-m9xufmwp9t],
.books-table td.books-col-actions[b-m9xufmwp9t] {
    position: sticky;
    right: 0;
    z-index: 10;
    background: #ffffff;
    background-clip: padding-box;
    box-shadow: none;
}

.books-table thead th.books-col-actions[b-m9xufmwp9t] {
    z-index: 18;
    background: #ffffff;
    box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
}

.books-table tbody tr:hover td.books-col-actions[b-m9xufmwp9t] {
    background: #fbfdff;
}

[b-m9xufmwp9t] .books-primary-title-wrap {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.books-primary-title[b-m9xufmwp9t] {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 800;
    color: #0f172a;
}

.books-primary[b-m9xufmwp9t] {
    font-weight: 750;
    color: #0f172a;
}

.books-secondary[b-m9xufmwp9t] {
    margin-top: 0.15rem;
    font-size: 0.76rem;
    color: #64748b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.books-number[b-m9xufmwp9t] {
    font-weight: 800;
    color: #0f172a;
}

/* Sortable table headers */
/* ---------------------------------------------------------
   Provides compact button-based sorting controls and active
   sort indicators.
   --------------------------------------------------------- */
.books-sort-button[b-m9xufmwp9t] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
}

    .books-sort-button:hover[b-m9xufmwp9t] {
        color: #2563eb;
    }

.books-sort-button--active[b-m9xufmwp9t] {
    color: #2563eb;
}

.books-sort-indicator[b-m9xufmwp9t] {
    font-size: 0.72rem;
}

[b-m9xufmwp9t] .books-source-impact-tooltip-wrap {
    display: inline-flex;
    max-width: 100%;
    min-width: 0;
}

.books-source-impact-pill[b-m9xufmwp9t] {
    display: inline-flex;
    align-items: center;
    margin-top: 4px;
    padding: 2px 7px;
    border-radius: 999px;
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

.books-source-impact-alert[b-m9xufmwp9t] {
    border: 1px solid #facc15;
    background: #fffbeb;
    color: #78350f;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 12px;
}

.books-source-impact-alert-title[b-m9xufmwp9t] {
    font-size: 13px;
    font-weight: 800;
    margin-bottom: 3px;
}

.books-source-impact-alert-text[b-m9xufmwp9t] {
    font-size: 12px;
    line-height: 1.4;
}

.books-context-badge--source-impact[b-m9xufmwp9t] {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
}

.books-source-impact-list[b-m9xufmwp9t] {
    margin-top: 6px;
    display: grid;
    gap: 3px;
}

.books-source-impact-line[b-m9xufmwp9t] {
    font-size: 12px;
    font-weight: 700;
    color: #92400e;
}

/* Book type and status badges */
/* ---------------------------------------------------------
   Aligns Final Book type and workflow status pills with
   Promotions and Promotion Pricing.
   --------------------------------------------------------- */
.books-type-badge[b-m9xufmwp9t],
.books-status-badge[b-m9xufmwp9t],
.books-context-badge[b-m9xufmwp9t] {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    padding: 2px 8px;
    border-radius: 999px;
    border: 1px solid transparent;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.books-type-badge[b-m9xufmwp9t] {
    min-width: 76px;
}

.books-type-badge--prepack[b-m9xufmwp9t] {
    border-color: rgba(63, 111, 159, 0.16);
    background: rgba(63, 111, 159, 0.12);
    color: rgb(63, 111, 159);
}

.books-type-badge--openstock[b-m9xufmwp9t] {
    border-color: rgba(142, 59, 103, 0.16);
    background: rgba(142, 59, 103, 0.10);
    color: rgb(142, 59, 103);
}

.books-type-badge--mixed[b-m9xufmwp9t] {
    border-color: rgba(109, 40, 217, 0.14);
    background: rgba(109, 40, 217, 0.10);
    color: #6d28d9;
}

.books-type-badge--default[b-m9xufmwp9t] {
    border-color: rgba(148, 163, 184, 0.18);
    background: rgba(148, 163, 184, 0.14);
    color: #475569;
}

.books-status-badge[b-m9xufmwp9t] {
    min-width: 80px;
}

.books-status-badge--published[b-m9xufmwp9t] {
    background: rgba(34, 197, 94, 0.16);
    color: #15803d;
}

.books-status-badge--draft[b-m9xufmwp9t] {
    background: rgba(148, 163, 184, 0.16);
    color: #475569;
}

.books-status-badge--pending[b-m9xufmwp9t] {
    background: rgba(245, 158, 11, 0.16);
    color: #b45309;
}

.books-status-badge--archived[b-m9xufmwp9t],
.books-status-badge--default[b-m9xufmwp9t] {
    background: rgba(148, 163, 184, 0.14);
    color: #475569;
}

/* Row actions */
/* ---------------------------------------------------------
   Provides the compact action zone used for Details and
   View Book commands.
   --------------------------------------------------------- */
.books-row-actions[b-m9xufmwp9t] {
    width: 100%;
    min-height: 34px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 5px 8px;
    border-radius: 7px;
    background: #f3f6fb;
    box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.82);
    white-space: nowrap;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.books-table tbody tr:hover .books-row-actions[b-m9xufmwp9t] {
    background: #edf4ff;
    box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.68);
}

.books-link-action[b-m9xufmwp9t] {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--link-600, #2563eb);
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
}

    .books-link-action:hover:not(:disabled)[b-m9xufmwp9t] {
        color: #1d4ed8;
        text-decoration: underline;
        text-underline-offset: 2px;
    }

    .books-link-action:disabled[b-m9xufmwp9t] {
        color: #94a3b8;
        cursor: not-allowed;
        text-decoration: none;
    }

.books-link-action-secondary[b-m9xufmwp9t] {
    color: #334155;
}

/* Expanded package details */
/* ---------------------------------------------------------
   Provides the inline package-detail layout for Final Book files,
   source reports, Promotions, and package context.
   --------------------------------------------------------- */
.books-detail-row td[b-m9xufmwp9t] {
    padding: 0 !important;
    background: #f8fafc !important;
    border-bottom: 1px solid #dbe4ef;
}

.books-detail-panel[b-m9xufmwp9t] {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(340px, 2fr);
    gap: 0.65rem;
    padding: 0.65rem 0.75rem 0.75rem;
    background: #f8fafc;
}

.books-detail-section[b-m9xufmwp9t] {
    min-width: 0;
    border: 1px solid #e2e8f0;
    border-radius: 0.85rem;
    background: #ffffff;
    padding: 0.65rem;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.035);
    overflow: visible;
}

.books-detail-section-wide[b-m9xufmwp9t] {
    grid-column: 1 / -1;
}

.books-detail-title-row[b-m9xufmwp9t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    margin-bottom: 0.5rem;
}

.books-detail-section-title[b-m9xufmwp9t] {
    font-size: 0.85rem;
    font-weight: 850;
    color: #0f172a;
    text-transform: uppercase;
    letter-spacing: 0.035em;
}

.books-detail-section-helper[b-m9xufmwp9t] {
    margin-top: 0.12rem;
    font-size: 0.76rem;
    font-weight: 500;
    color: #64748b;
    text-transform: none;
    letter-spacing: normal;
}

.books-context-badge[b-m9xufmwp9t] {
    color: #475569;
    background: #f8fafc;
    border-color: #e2e8f0;
    font-size: 0.7rem;
}

.books-context-badge--official[b-m9xufmwp9t] {
    color: #047857;
    background: #ecfdf5;
    border-color: #bbf7d0;
}

.books-context-badge--source[b-m9xufmwp9t] {
    color: #1d4ed8;
    background: #eff6ff;
    border-color: #dbeafe;
}

/* Final Book file cards */
/* ---------------------------------------------------------
   Displays uploaded Final Book PDF files and associated actions.
   --------------------------------------------------------- */
.books-file-list[b-m9xufmwp9t],
.books-source-list[b-m9xufmwp9t],
.books-promotion-grid[b-m9xufmwp9t] {
    display: grid;
    gap: 0.55rem;
}

.books-file-card[b-m9xufmwp9t] {
    display: grid;
    grid-template-columns: 2.65rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 0.55rem 0.6rem;
    background: #ffffff;
}

.books-file-icon[b-m9xufmwp9t] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.65rem;
    height: 2.65rem;
    border-radius: 0.7rem;
    background: #fee2e2;
    color: #991b1b;
    font-size: 0.7rem;
    font-weight: 900;
}

.books-file-copy[b-m9xufmwp9t] {
    min-width: 0;
}

.books-file-title[b-m9xufmwp9t] {
    font-weight: 850;
    color: #0f172a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.books-file-meta[b-m9xufmwp9t],
.books-source-meta[b-m9xufmwp9t],
.books-promotion-meta[b-m9xufmwp9t] {
    margin-top: 0.15rem;
    font-size: 0.76rem;
    color: #64748b;
}

.books-file-actions[b-m9xufmwp9t] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

    .books-file-actions .btn[b-m9xufmwp9t] {
        border-radius: 0.5rem;
        font-size: 0.75rem;
        font-weight: 750;
    }

/* Source reports and Promotions */
/* ---------------------------------------------------------
   Displays Distributor Pricing source reports and included
   Promotions within expanded package details.
   --------------------------------------------------------- */
.books-source-card[b-m9xufmwp9t],
.books-promotion-card[b-m9xufmwp9t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.55rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 0.55rem 0.65rem;
    background: #ffffff;
}

.books-source-title[b-m9xufmwp9t],
.books-promotion-title[b-m9xufmwp9t] {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 800;
    color: #0f172a;
}

.books-source-copy[b-m9xufmwp9t],
.books-promotion-copy[b-m9xufmwp9t] {
    min-width: 0;
    flex: 1 1 auto;
}

.books-source-actions[b-m9xufmwp9t] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.18rem;
    flex-shrink: 0;
}

.books-promotion-grid[b-m9xufmwp9t] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.books-source-report-card[b-m9xufmwp9t] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 0.65rem 0.75rem;
    background: #ffffff;
}

.books-source-report-main[b-m9xufmwp9t] {
    min-width: 0;
    flex: 1 1 auto;
}

.books-source-report-title[b-m9xufmwp9t] {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 850;
    color: #0f172a;
}

.books-source-report-meta[b-m9xufmwp9t] {
    margin-top: 0.16rem;
    font-size: 0.76rem;
    color: #64748b;
}

.books-source-report-included[b-m9xufmwp9t] {
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
    margin-top: 0.45rem;
    color: #475569;
    font-size: 0.76rem;
    line-height: 1.3;
}

.books-source-report-included-label[b-m9xufmwp9t] {
    font-weight: 850;
    color: #334155;
}

.books-source-report-promotion-line[b-m9xufmwp9t] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.books-source-report-actions[b-m9xufmwp9t] {
    padding-top: 0.05rem;
}

/* Empty states */
/* ---------------------------------------------------------
   Provides list-level and expanded-detail empty-state treatments.
   --------------------------------------------------------- */
.books-empty-cell[b-m9xufmwp9t] {
    padding: 2rem !important;
    background: #ffffff !important;
}

.books-empty-state[b-m9xufmwp9t],
.books-detail-empty[b-m9xufmwp9t] {
    border: 1px dashed #cbd5e1;
    border-radius: 0.85rem;
    padding: 1.1rem;
    text-align: center;
    color: #64748b;
    background: #f8fafc;
}

.books-empty-state--list[b-m9xufmwp9t] {
    align-self: start;
    margin: 14px;
    width: auto;
    max-width: calc(100% - 28px);
    box-sizing: border-box;
}

/* Anchored pagination */
/* ---------------------------------------------------------
   Keeps pagination stable at the bottom of the Books workspace.
   --------------------------------------------------------- */
.books-pager[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 6px 14px 4px;
    background: #f8fafc;
    border-top: 1px solid rgba(25, 35, 68, 0.06);
}

.books-pager-summary[b-m9xufmwp9t] {
    color: var(--text-600, #475569);
    font-size: 12px;
    font-weight: 500;
}

.books-pager-page[b-m9xufmwp9t] {
    min-width: 88px;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 600;
    text-align: center;
}

.books-pager-actions[b-m9xufmwp9t] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Final Book Package Details modal */
/* ---------------------------------------------------------
   Displays package context, Final Book files, source reports,
   included Promotions, and package-level actions.
   --------------------------------------------------------- */

.books-details-modal[b-m9xufmwp9t] {
    width: min(1080px, 94vw);
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 1rem;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
    border: 1px solid rgba(226, 232, 240, 0.9);
}

.books-details-modal-header[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 1.1rem 0.8rem;
    border-bottom: 1px solid #e2e8f0;
    background: #ffffff;
}

.books-details-title-wrap[b-m9xufmwp9t] {
    min-width: 0;
}

    .books-details-title-wrap .books-upload-modal-subtitle[b-m9xufmwp9t] {
        max-width: 860px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.books-details-modal-body[b-m9xufmwp9t] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    display: grid;
    gap: 0.7rem;
    padding: 0.85rem 1rem;
    background: #f8fafc;
}

.books-details-context-card[b-m9xufmwp9t] {
    border: 1px solid #e2e8f0;
    border-radius: 0.85rem;
    padding: 0.85rem 0.95rem;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.035);
}

.books-details-context-header[b-m9xufmwp9t] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.books-details-status-pills[b-m9xufmwp9t] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.books-details-context-grid[b-m9xufmwp9t] {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) 140px 120px 110px 125px;
    gap: 0.45rem;
}

.books-details-context-item[b-m9xufmwp9t] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
    border: 1px solid #e5e7eb;
    border-radius: 0.6rem;
    padding: 0.45rem 0.55rem;
    background: #f8fafc;
}

.books-details-context-label[b-m9xufmwp9t] {
    font-size: 0.64rem;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
}

.books-details-context-value[b-m9xufmwp9t] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.78rem;
    font-weight: 800;
    color: #0f172a;
}

.books-details-section-clean[b-m9xufmwp9t] {
    padding: 0.75rem 0.8rem;
}

.books-file-card--details[b-m9xufmwp9t] {
    grid-template-columns: 2.65rem minmax(0, 1fr) auto;
    min-height: 4rem;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}

.books-source-report-card--details[b-m9xufmwp9t] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: flex-start;
    gap: 0.9rem;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}

.books-source-report-included--details[b-m9xufmwp9t] {
    margin-top: 0.65rem;
    padding-top: 0.55rem;
    border-top: 1px solid #edf2f7;
}

.books-source-report-actions--details[b-m9xufmwp9t] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.45rem;
    padding-top: 0;
}

    .books-source-report-actions--details .btn[b-m9xufmwp9t] {
        border-radius: 0.5rem;
        font-size: 0.75rem;
        font-weight: 750;
        white-space: nowrap;
    }

.books-details-modal-footer[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: flex;
    justify-content: flex-end;
    gap: 0.55rem;
    padding: 0.8rem 1.1rem;
    border-top: 1px solid #e2e8f0;
    background: #ffffff;
}

    .books-details-modal-footer .btn[b-m9xufmwp9t] {
        min-width: 110px;
        border-radius: 0.6rem;
        font-weight: 750;
    }

/* Upload Final Book modal */
/* ---------------------------------------------------------
   Provides Final Book context selection, source-report selection,
   PDF upload, draft creation, and publishing controls.
   --------------------------------------------------------- */

.books-modal-backdrop[b-m9xufmwp9t] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
    background: rgba(15, 23, 42, 0.48);
}

.books-upload-modal[b-m9xufmwp9t] {
    width: min(980px, 96vw);
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 1rem;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
    border: 1px solid rgba(226, 232, 240, 0.9);
}

.books-upload-modal-header[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem 0.85rem;
    border-bottom: 1px solid #e2e8f0;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.books-upload-modal-title[b-m9xufmwp9t] {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 850;
    color: #0f172a;
}

.books-upload-modal-subtitle[b-m9xufmwp9t] {
    margin: 0.2rem 0 0;
    font-size: 0.82rem;
    color: #64748b;
}

.books-modal-close[b-m9xufmwp9t] {
    border: 0;
    background: transparent;
    color: #64748b;
    font-size: 1.45rem;
    line-height: 1;
    padding: 0.1rem 0.2rem;
}

    .books-modal-close:hover[b-m9xufmwp9t] {
        color: #0f172a;
    }

.books-upload-modal-body[b-m9xufmwp9t] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    padding: 1rem 1.15rem;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 0.85rem;
    background: #f8fafc;
}

.books-upload-section[b-m9xufmwp9t] {
    border: 1px solid #e2e8f0;
    border-radius: 0.9rem;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.035);
    overflow: hidden;
}

    .books-upload-section:nth-of-type(2)[b-m9xufmwp9t] {
        min-height: 0;
        display: flex;
        flex-direction: column;
    }

        .books-upload-section:nth-of-type(2) .books-upload-source-list[b-m9xufmwp9t] {
            flex: 1 1 auto;
        }

.books-upload-section-header[b-m9xufmwp9t] {
    padding: 0.8rem 0.9rem 0.65rem;
    border-bottom: 1px solid #e2e8f0;
    background: #ffffff;
}

.books-upload-section-title[b-m9xufmwp9t] {
    font-size: 0.86rem;
    font-weight: 850;
    color: #0f172a;
    text-transform: uppercase;
    letter-spacing: 0.035em;
}

.books-upload-section-helper[b-m9xufmwp9t] {
    margin-top: 0.2rem;
    font-size: 0.76rem;
    color: #64748b;
}

.books-upload-grid[b-m9xufmwp9t] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 0.9rem;
}

.books-upload-field[b-m9xufmwp9t] {
    min-width: 0;
}

.books-upload-field-wide[b-m9xufmwp9t] {
    grid-column: 1 / -1;
}

.books-upload-label[b-m9xufmwp9t] {
    display: block;
    margin-bottom: 0.25rem;
    font-size: 0.74rem;
    font-weight: 800;
    color: #334155;
}

.books-upload-input[b-m9xufmwp9t] {
    min-height: 2.25rem;
    border-radius: 0.55rem;
    border-color: #dbe4ef;
    font-size: 0.84rem;
}

.books-upload-source-list[b-m9xufmwp9t] {
    min-height: 0;
    max-height: 11.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0.95rem 0.8rem 0.75rem;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 #f8fafc;
}

    .books-upload-source-list[b-m9xufmwp9t]::-webkit-scrollbar {
        width: 0.25rem;
    }

    .books-upload-source-list[b-m9xufmwp9t]::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 999px;
    }

    .books-upload-source-list[b-m9xufmwp9t]::-webkit-scrollbar-track {
        background: #f8fafc;
    }

.books-upload-source-row[b-m9xufmwp9t] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.6rem;
    padding: 0.65rem 0.7rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    background: #ffffff;
    cursor: pointer;
}

    .books-upload-source-row:hover[b-m9xufmwp9t] {
        border-color: #bfdbfe;
        background: #fbfdff;
    }

.books-upload-source-title[b-m9xufmwp9t] {
    display: block;
    font-size: 0.84rem;
    font-weight: 800;
    color: #0f172a;
}

.books-upload-source-meta[b-m9xufmwp9t] {
    display: block;
    margin-top: 0.14rem;
    font-size: 0.75rem;
    color: #64748b;
}

.books-upload-dropzone[b-m9xufmwp9t] {
    margin: 0.9rem;
    min-height: 6.5rem;
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 1rem;
    border: 1px dashed #bfdbfe;
    border-radius: 0.85rem;
    background: linear-gradient(180deg, #ffffff 0%, #eff6ff 100%);
}

.books-upload-dropzone-icon[b-m9xufmwp9t] {
    flex: 0 0 auto;
    width: 3rem;
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
    background: #fee2e2;
    color: #991b1b;
    font-size: 0.72rem;
    font-weight: 900;
}

.books-upload-dropzone-title[b-m9xufmwp9t] {
    font-size: 0.9rem;
    font-weight: 850;
    color: #0f172a;
}

.books-upload-dropzone-helper[b-m9xufmwp9t] {
    margin-top: 0.18rem;
    font-size: 0.78rem;
    color: #64748b;
}

.books-upload-modal-footer[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: flex;
    justify-content: flex-end;
    gap: 0.55rem;
    padding: 0.85rem 1.15rem;
    border-top: 1px solid #e2e8f0;
    background: #ffffff;
}

    .books-upload-modal-footer .btn[b-m9xufmwp9t] {
        min-width: 110px;
        border-radius: 0.6rem;
        font-weight: 750;
    }

.books-upload-dropzone[b-m9xufmwp9t] {
    cursor: pointer;
}

.books-upload-dropzone-content[b-m9xufmwp9t] {
    min-width: 0;
}

.books-upload-file-input[b-m9xufmwp9t] {
    display: none;
}

.books-upload-context-panel[b-m9xufmwp9t] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.65rem;
}

.books-upload-context-item[b-m9xufmwp9t] {
    min-width: 0;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 0.65rem 0.75rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.books-upload-context-label[b-m9xufmwp9t] {
    font-size: 0.7rem;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
}

.books-upload-context-value[b-m9xufmwp9t] {
    margin-top: 0.2rem;
    font-size: 0.84rem;
    font-weight: 850;
    color: #0f172a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.books-upload-context-helper[b-m9xufmwp9t] {
    margin-top: 0.55rem;
    font-size: 0.76rem;
    color: #64748b;
}

.books-upload-context-warning[b-m9xufmwp9t] {
    margin-top: 0.6rem;
    padding: 0.55rem 0.7rem;
    border: 1px solid #fed7aa;
    border-radius: 0.65rem;
    background: #fff7ed;
    color: #9a3412;
    font-size: 0.78rem;
    font-weight: 750;
}

.books-upload-section-header-with-action[b-m9xufmwp9t] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.books-upload-clear-button[b-m9xufmwp9t] {
    flex: 0 0 auto;
    border: 0;
    background: transparent;
    color: #2563eb;
    font-size: 0.76rem;
    font-weight: 850;
    padding: 0.1rem 0;
}

    .books-upload-clear-button:hover[b-m9xufmwp9t] {
        color: #1d4ed8;
        text-decoration: underline;
    }

.books-upload-source-row.is-selected[b-m9xufmwp9t] {
    border-color: #93c5fd;
    background: #eff6ff;
    box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.08);
}

.books-upload-source-row.is-disabled[b-m9xufmwp9t] {
    cursor: not-allowed;
    opacity: 0.72;
    background: #f8fafc;
    border-style: dashed;
}

    .books-upload-source-row.is-disabled:hover[b-m9xufmwp9t] {
        border-color: #e2e8f0;
        background: #f8fafc;
    }

    .books-upload-source-row.is-disabled input[b-m9xufmwp9t] {
        cursor: not-allowed;
    }

.books-upload-source-reason[b-m9xufmwp9t] {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.72rem;
    font-weight: 750;
    color: #b45309;
}

.books-upload-source-copy[b-m9xufmwp9t] {
    min-width: 0;
}

.books-upload-source-title-row[b-m9xufmwp9t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    min-width: 0;
}

    .books-upload-source-title-row .books-upload-source-title[b-m9xufmwp9t] {
        min-width: 0;
        flex: 1 1 auto;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.books-upload-selected-badge[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.25rem;
    padding: 0.12rem 0.5rem;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 0.68rem;
    font-weight: 850;
    line-height: 1;
}

.books-upload-generated-title[b-m9xufmwp9t] {
    min-height: 2.35rem;
    display: flex;
    align-items: center;
    padding: 0.55rem 0.7rem;
    border: 1px solid #dbe4ef;
    border-radius: 0.55rem;
    background: #f8fafc;
    color: #0f172a;
    font-size: 0.86rem;
    font-weight: 850;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Replace Final Book PDF modal */
/* ---------------------------------------------------------
   Displays the current file and replacement PDF upload workflow.
   --------------------------------------------------------- */
.books-replace-modal[b-m9xufmwp9t] {
    width: min(720px, 94vw);
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 1rem;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
    border: 1px solid rgba(226, 232, 240, 0.9);
}

.books-replace-modal-body[b-m9xufmwp9t] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 1rem 1.15rem;
    display: grid;
    gap: 0.85rem;
    background: #f8fafc;
}

.books-replace-current-file[b-m9xufmwp9t] {
    border: 1px solid #e2e8f0;
    border-radius: 0.85rem;
    background: #ffffff;
    padding: 0.85rem 0.95rem;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.035);
}

.books-replace-current-label[b-m9xufmwp9t] {
    font-size: 0.72rem;
    font-weight: 850;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.books-replace-current-name[b-m9xufmwp9t] {
    margin-top: 0.25rem;
    font-size: 0.92rem;
    font-weight: 850;
    color: #0f172a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.books-replace-current-meta[b-m9xufmwp9t] {
    margin-top: 0.2rem;
    font-size: 0.78rem;
    color: #64748b;
}

.books-replace-dropzone[b-m9xufmwp9t] {
    margin: 0;
}

/* Final Book PDF preview modal */
/* ---------------------------------------------------------
   Provides an embedded PDF preview with download and close actions.
   --------------------------------------------------------- */
.books-preview-modal[b-m9xufmwp9t] {
    width: min(1180px, 96vw);
    height: min(90vh, 920px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 1rem;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
    border: 1px solid rgba(226, 232, 240, 0.9);
}

.books-preview-modal-header[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem 0.85rem;
    border-bottom: 1px solid #e2e8f0;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.books-preview-title-wrap[b-m9xufmwp9t] {
    min-width: 0;
}

    .books-preview-title-wrap .books-upload-modal-subtitle[b-m9xufmwp9t] {
        max-width: 720px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.books-preview-header-actions[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

    .books-preview-header-actions .btn[b-m9xufmwp9t] {
        border-radius: 0.55rem;
        font-weight: 750;
    }

.books-preview-modal-body[b-m9xufmwp9t] {
    flex: 1 1 auto;
    min-height: 0;
    background: #0f172a;
    padding: 0.75rem;
}

.books-preview-frame[b-m9xufmwp9t] {
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 0.65rem;
    background: #ffffff;
}

.books-preview-state[b-m9xufmwp9t] {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed #475569;
    border-radius: 0.65rem;
    background: #1e293b;
    color: #e2e8f0;
    font-size: 0.9rem;
    font-weight: 750;
}

.books-preview-state-error[b-m9xufmwp9t] {
    color: #fecaca;
    border-color: #ef4444;
    background: #450a0a;
}

.books-preview-modal-footer[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1.15rem;
    border-top: 1px solid #e2e8f0;
    background: #ffffff;
}

.books-preview-file-meta[b-m9xufmwp9t] {
    min-width: 0;
    font-size: 0.78rem;
    color: #64748b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.books-preview-footer-actions[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

    .books-preview-footer-actions .btn[b-m9xufmwp9t] {
        min-width: 110px;
        border-radius: 0.6rem;
        font-weight: 750;
    }

.books-detail-empty-action[b-m9xufmwp9t] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

    .books-detail-empty-action .btn[b-m9xufmwp9t] {
        border-radius: 0.55rem;
        font-size: 0.75rem;
        font-weight: 750;
    }

.books-upload-source-group[b-m9xufmwp9t] {
    align-items: flex-start;
    gap: 0.65rem;
}

.books-upload-source-group-copy[b-m9xufmwp9t] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
    flex: 1 1 auto;
}

.books-upload-source-title-row[b-m9xufmwp9t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-width: 0;
}

.books-upload-source-title[b-m9xufmwp9t] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.books-upload-source-included[b-m9xufmwp9t] {
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
    margin-top: 0.2rem;
    color: #475569;
    font-size: 0.78rem;
    line-height: 1.3;
}

.books-upload-source-included-label[b-m9xufmwp9t] {
    font-weight: 800;
    color: #334155;
}

.books-upload-source-promotion-line[b-m9xufmwp9t] {
    padding-left: 0.15rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.books-upload-source-group--selected[b-m9xufmwp9t] {
    border-color: #93c5fd;
    background: #eff6ff;
    box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.2);
}

.books-upload-source-group--disabled[b-m9xufmwp9t] {
    cursor: not-allowed;
    opacity: 0.72;
    background: #f8fafc;
}

    .books-upload-source-group--disabled .books-upload-source-title[b-m9xufmwp9t],
    .books-upload-source-group--disabled .books-upload-source-meta[b-m9xufmwp9t],
    .books-upload-source-group--disabled .books-upload-source-included[b-m9xufmwp9t] {
        color: #94a3b8;
    }

.books-upload-source-status-pill[b-m9xufmwp9t] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 1.35rem;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    border: 1px solid #dbe4ef;
    background: #f1f5f9;
    color: #475569;
    font-size: 0.72rem;
    font-weight: 800;
}

.books-upload-source-unavailable[b-m9xufmwp9t] {
    margin-top: 0.25rem;
    color: #991b1b;
    font-size: 0.76rem;
    font-weight: 700;
}


.books-file-title--details[b-m9xufmwp9t],
.books-source-report-title--details[b-m9xufmwp9t] {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    line-height: 1.25;
}

.books-source-report-included--details[b-m9xufmwp9t] {
    max-height: none;
    overflow: visible;
    padding-right: 0;
}

.books-source-report-included-header[b-m9xufmwp9t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.25rem;
}

.books-source-report-included-hint[b-m9xufmwp9t] {
    flex: 0 0 auto;
    color: #94a3b8;
    font-size: 0.7rem;
    font-weight: 750;
}

.books-source-report-included-scroll--details[b-m9xufmwp9t] {
    max-height: 7rem;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 0.35rem;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 #f8fafc;
}

    .books-source-report-included-scroll--details[b-m9xufmwp9t]::-webkit-scrollbar {
        width: 0.25rem;
    }

    .books-source-report-included-scroll--details[b-m9xufmwp9t]::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 999px;
    }

    .books-source-report-included-scroll--details[b-m9xufmwp9t]::-webkit-scrollbar-track {
        background: #f8fafc;
    }

.books-source-report-promotion-line--details[b-m9xufmwp9t] {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
}

/* Inline loading and error states */
/* ---------------------------------------------------------
   Provides list-level loading and failure messages.
   --------------------------------------------------------- */
.books-inline-state[b-m9xufmwp9t] {
    margin: 0.65rem 1rem 0;
    padding: 0.55rem 0.75rem;
    border: 1px solid #dbeafe;
    border-radius: 0.65rem;
    background: #eff6ff;
    color: #1e40af;
    font-size: 0.8rem;
    font-weight: 700;
}

.books-inline-state--error[b-m9xufmwp9t] {
    border-color: #fecaca;
    background: #fef2f2;
    color: #991b1b;
}

/* Upload validation error */
/* ---------------------------------------------------------
   Displays Final Book upload and publishing validation failures.
   --------------------------------------------------------- */

.books-upload-error[b-m9xufmwp9t] {
    margin: 0 1.15rem 0.85rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid #fecaca;
    border-radius: 0.65rem;
    background: #fef2f2;
    color: #991b1b;
    font-size: 0.8rem;
    font-weight: 750;
}

/* =====================================
   Promotion Cycle Context
   ---------------------------------------------------------
   Displays the exact Promotion Cycle applied from Cycle Summary
   above the Final Book filters.
   ===================================== */

.books-cycle-context[b-m9xufmwp9t] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 12px;
    padding: 7px 10px;
    border: 1px solid #cfe0fb;
    border-radius: 8px;
    background: #f4f8ff;
}

.books-cycle-context-label[b-m9xufmwp9t] {
    color: #5e7698;
    font-size: 10.5px;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.books-cycle-context-value[b-m9xufmwp9t] {
    min-width: 0;
    overflow: hidden;
    color: #14264a;
    font-size: 11.5px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Viewport responsive behavior */
/* ---------------------------------------------------------
   Adapts filters, expanded details, modal layouts, and actions
   for narrower browser viewports.
   --------------------------------------------------------- */
@media (max-width: 1280px) {
    .books-controls[b-m9xufmwp9t] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .books-control-search[b-m9xufmwp9t] {
        grid-column: 1 / -1;
    }

    .books-detail-panel[b-m9xufmwp9t] {
        grid-template-columns: 1fr;
    }

    .books-promotion-grid[b-m9xufmwp9t] {
        grid-template-columns: 1fr;
    }

    .books-source-report-card--details[b-m9xufmwp9t] {
        grid-template-columns: 1fr;
    }

    .books-source-report-actions--details[b-m9xufmwp9t] {
        justify-content: flex-start;
    }

    .books-details-context-grid[b-m9xufmwp9t] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .books-page[b-m9xufmwp9t] {
        padding: 0.75rem;
    }

    .books-workspace[b-m9xufmwp9t] {
        min-height: 0;
    }

    .books-panel-header[b-m9xufmwp9t] {
        flex-direction: column;
        align-items: stretch;
    }

    .books-panel-actions[b-m9xufmwp9t],
    .books-panel-actions .btn[b-m9xufmwp9t] {
        width: 100%;
    }

    .books-summary-strip--four[b-m9xufmwp9t],
    .books-controls[b-m9xufmwp9t] {
        grid-template-columns: 1fr;
    }

    .books-control-search[b-m9xufmwp9t] {
        min-width: 0;
    }

    .books-file-card[b-m9xufmwp9t] {
        grid-template-columns: 2.65rem minmax(0, 1fr);
    }

    .books-file-actions[b-m9xufmwp9t] {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .books-pager[b-m9xufmwp9t] {
        flex-direction: column;
        align-items: stretch;
    }

    .books-pager-actions[b-m9xufmwp9t] {
        justify-content: space-between;
    }

    .books-upload-modal[b-m9xufmwp9t] {
        width: 100%;
        max-height: 94vh;
    }

    .books-upload-grid[b-m9xufmwp9t] {
        grid-template-columns: 1fr;
    }

    .books-upload-modal-footer[b-m9xufmwp9t] {
        flex-direction: column;
    }

        .books-upload-modal-footer .btn[b-m9xufmwp9t] {
            width: 100%;
        }

    .books-upload-context-panel[b-m9xufmwp9t] {
        grid-template-columns: 1fr;
    }

    .books-upload-modal-body[b-m9xufmwp9t] {
        overflow-y: auto;
        display: grid;
        grid-template-rows: auto auto auto;
    }

    .books-upload-source-list[b-m9xufmwp9t] {
        max-height: 13rem;
    }

    .books-preview-modal[b-m9xufmwp9t] {
        width: 100%;
        height: 94vh;
    }

    .books-preview-modal-header[b-m9xufmwp9t],
    .books-preview-modal-footer[b-m9xufmwp9t] {
        flex-direction: column;
        align-items: stretch;
    }

    .books-preview-header-actions[b-m9xufmwp9t],
    .books-preview-footer-actions[b-m9xufmwp9t] {
        width: 100%;
        justify-content: space-between;
    }

        .books-preview-header-actions .btn[b-m9xufmwp9t],
        .books-preview-footer-actions .btn[b-m9xufmwp9t] {
            width: 100%;
        }

    .books-details-modal[b-m9xufmwp9t] {
        width: 100%;
        max-height: 94vh;
    }

    .books-details-modal-header[b-m9xufmwp9t],
    .books-details-modal-footer[b-m9xufmwp9t] {
        flex-direction: column;
        align-items: stretch;
    }

    .books-file-card--details[b-m9xufmwp9t] {
        grid-template-columns: 2.65rem minmax(0, 1fr);
    }

    .books-source-report-actions--details[b-m9xufmwp9t] {
        flex-direction: column;
        align-items: stretch;
    }

        .books-source-report-actions--details .btn[b-m9xufmwp9t] {
            width: 100%;
        }

    .books-details-context-header[b-m9xufmwp9t] {
        flex-direction: column;
    }

    .books-details-status-pills[b-m9xufmwp9t] {
        justify-content: flex-start;
    }

    .books-details-context-grid[b-m9xufmwp9t] {
        grid-template-columns: 1fr;
    }

    .books-details-context-value[b-m9xufmwp9t] {
        white-space: normal;
    }
}

/* Container responsive behavior */
/* ---------------------------------------------------------
   Responds to available Books content width after sidebar
   expansion or collapse. The desktop table model remains intact
   while summary cards, filters, actions, and pagination adapt.
   --------------------------------------------------------- */

@container books-page (max-width: 1100px) {
    .books-controls[b-m9xufmwp9t] {
        grid-template-columns: minmax(260px, 1fr) repeat(3, minmax(120px, 1fr));
    }
}

@container books-page (max-width: 820px) {
    .books-summary-strip--four[b-m9xufmwp9t] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .books-panel-header[b-m9xufmwp9t] {
        flex-direction: column;
        align-items: stretch;
    }

    .books-panel-actions[b-m9xufmwp9t] {
        justify-content: flex-start;
    }

    .books-primary-button[b-m9xufmwp9t] {
        width: 100%;
    }

    .books-controls[b-m9xufmwp9t] {
        grid-template-columns: 1fr;
    }

    .books-control-search[b-m9xufmwp9t] {
        min-width: 0;
    }

    .books-pager[b-m9xufmwp9t] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.55rem;
    }

    .books-pager-actions[b-m9xufmwp9t] {
        justify-content: space-between;
    }
}
/* /Components/Shared/Books/ManufacturerBookProofsAdminShared.razor.rz.scp.css */
/* ManufacturerBookProofsAdminShared.razor.css */
/* ---------------------------------------------------------
   Provides the WAM Admin Manufacturer Book Proof workflow for
   creation, version upload, sending, override approval, locking,
   and Final Book inclusion.

   The page remains fixed-height. Summary cards, filters, and
   pagination remain stable while the table region owns internal
   vertical and horizontal scrolling. Actions remain sticky.
   --------------------------------------------------------- */

/* Page shell */
/* ---------------------------------------------------------
   Participates in the shared full-height layout chain and
   establishes the page-local container-query context.
   --------------------------------------------------------- */

.proofs-page[b-ylot0h4cmm] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: #f8fafc;
    color: #0f172a;
    overflow: hidden;
    container-type: inline-size;
    container-name: proofs-page;
}

.proofs-workspace[b-ylot0h4cmm] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow: hidden;
}

/* Summary cards */
/* ---------------------------------------------------------
   Displays WAM Admin proof-readiness counts and provides
   quick status filtering.
   --------------------------------------------------------- */
.proofs-summary-strip[b-ylot0h4cmm] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.proofs-summary-card[b-ylot0h4cmm] {
    min-width: 0;
    padding: 8px 10px;
    background: #fff;
    border: 1px solid var(--border-200);
    border-radius: 13px;
    text-align: left;
    box-shadow: var(--shadow-1);
}

.proofs-summary-card-button[b-ylot0h4cmm] {
    width: 100%;
    appearance: none;
    cursor: pointer;
}

.proofs-summary-card--success[b-ylot0h4cmm] {
    border-color: rgba(91, 196, 191, 0.38);
    background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.proofs-summary-card--warning[b-ylot0h4cmm] {
    border-color: rgba(250, 169, 75, 0.32);
    background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

.proofs-summary-card--info[b-ylot0h4cmm] {
    border-color: rgba(117, 140, 167, 0.24);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.04), #fff);
}

.proofs-summary-card--neutral[b-ylot0h4cmm] {
    border-color: rgba(117, 140, 167, 0.22);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.035), #fff);
}

.proofs-summary-label[b-ylot0h4cmm] {
    margin: 0 0 6px;
    overflow: hidden;
    color: var(--text-600);
    font-size: 13.5px;
    line-height: 1.3;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.proofs-summary-value[b-ylot0h4cmm] {
    margin: 0;
    color: var(--text-900);
    font-size: 21px;
    line-height: 1;
    font-weight: 800;
}

.proofs-summary-meta[b-ylot0h4cmm] {
    margin-top: 5px;
    overflow: hidden;
    color: var(--text-500);
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Proof list card */
/* ---------------------------------------------------------
   Contains proof actions, filters, the internally scrolling table,
   and anchored pagination.
   --------------------------------------------------------- */
.proofs-card[b-ylot0h4cmm] {
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
}

.proofs-list-card[b-ylot0h4cmm] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.proofs-panel-header[b-ylot0h4cmm] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 1rem 0.7rem;
    border-bottom: 1px solid #e2e8f0;
}

.proofs-panel-title[b-ylot0h4cmm] {
    min-width: 0;
}

.proofs-card-title[b-ylot0h4cmm] {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--text-900);
}

.proofs-card-subtitle[b-ylot0h4cmm] {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--text-500);
}

.proofs-panel-actions[b-ylot0h4cmm] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.proofs-primary-button[b-ylot0h4cmm] {
    min-height: 2.05rem;
    min-width: 130px;
    padding: 0.38rem 0.85rem;
    border-radius: 0.55rem;
    font-size: 0.86rem;
    font-weight: 750;
}

.proofs-list-body[b-ylot0h4cmm] {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
}

/* Filters and search */
/* ---------------------------------------------------------
   Provides the compact proof filter bar. ClearableSearchInput
   requires ::deep because the input is rendered by a child component.
   --------------------------------------------------------- */
.proofs-controls[b-ylot0h4cmm] {
    display: grid;
    grid-template-columns: minmax(320px, 1.8fr) repeat(4, minmax(130px, 0.7fr));
    gap: 0.65rem;
    padding: 0.85rem 1rem 0.7rem;
    background: #ffffff;
}

.proofs-control[b-ylot0h4cmm] {
    min-width: 0;
}

.proofs-control-label[b-ylot0h4cmm] {
    display: block;
    margin-bottom: 0.22rem;
    font-size: 0.72rem;
    font-weight: 800;
    color: #334155;
}

.proofs-search[b-ylot0h4cmm],
.proofs-filter-select[b-ylot0h4cmm] {
    min-height: 2.2rem;
    border-radius: 0.55rem;
    border-color: #dbe4ef;
    font-size: 0.84rem;
    color: #0f172a;
}

[b-ylot0h4cmm] .proofs-search-wrapper {
    width: 100%;
    min-width: 0;
}

    [b-ylot0h4cmm] .proofs-search-wrapper .form-control {
        min-height: 2.2rem;
        border-radius: 0.55rem;
        border-color: #dbe4ef;
        font-size: 0.84rem;
        color: #0f172a;
    }

/* Sortable table headers */
/* ---------------------------------------------------------
   Uses button-based headers for keyboard-accessible sorting
   within the compact proof table.
   --------------------------------------------------------- */
.proofs-sort-button[b-ylot0h4cmm] {
    appearance: none;
    width: 100%;
    border: 0;
    background: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    padding: 0;
    color: inherit;
    font: inherit;
    font-size: inherit;
    font-weight: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
    cursor: pointer;
    white-space: nowrap;
}

    .proofs-sort-button:hover[b-ylot0h4cmm],
    .proofs-sort-button--active[b-ylot0h4cmm] {
        color: #1d4ed8;
    }

.proofs-sort-indicator[b-ylot0h4cmm] {
    flex: 0 0 auto;
    min-width: 12px;
    color: #2563eb;
    font-size: 0.68rem;
    font-weight: 900;
}

/* Proof table workspace */
/* ---------------------------------------------------------
   Keeps the proof list fixed-height. The table wrap owns vertical
   and horizontal scrolling while pagination stays anchored below.
   --------------------------------------------------------- */
.proofs-table-region[b-ylot0h4cmm] {
    min-height: 0;
    height: 100%;
    margin: 0 12px 0;
    background: #ffffff;
    overflow: hidden;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
}

.proofs-table-wrap[b-ylot0h4cmm] {
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    position: relative;
    background: #ffffff;
}

.proofs-table[b-ylot0h4cmm] {
    margin: 0;
    min-width: 1040px;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.82rem;
}

    .proofs-table thead th[b-ylot0h4cmm] {
        position: sticky;
        top: 0;
        z-index: 12;
        background: #ffffff;
        color: #64748b;
        font-size: 0.7rem;
        font-weight: 850;
        text-transform: uppercase;
        letter-spacing: 0.035em;
        white-space: nowrap;
        padding: 0.58rem 0.55rem;
        box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
    }

    .proofs-table tbody td[b-ylot0h4cmm] {
        vertical-align: middle;
        border-bottom: 1px solid #edf2f7;
        padding: 0.56rem 0.55rem;
        background: #ffffff;
    }

    .proofs-table th.proofs-col-actions[b-ylot0h4cmm],
    .proofs-table td.proofs-col-actions[b-ylot0h4cmm] {
        text-align: left;
    }

    .proofs-table tbody tr:hover td[b-ylot0h4cmm] {
        background: #fbfdff;
    }

/* Admin proof table columns */
/* ---------------------------------------------------------
   Uses fixed column widths to protect the desktop workspace.
   Wide proof values clip or wrap within their assigned columns.
   --------------------------------------------------------- */
.proofs-col-cycle[b-ylot0h4cmm] {
    width: 260px;
}

.proofs-col-manufacturer[b-ylot0h4cmm] {
    width: 122px;
}

.proofs-col-status[b-ylot0h4cmm] {
    width: 145px;
}

.proofs-col-version[b-ylot0h4cmm] {
    width: 66px;
}

.proofs-col-promotions[b-ylot0h4cmm] {
    width: 72px;
    text-align: center;
}

.proofs-col-ready[b-ylot0h4cmm] {
    width: 72px;
    text-align: center;
}

    .proofs-col-promotions .proofs-sort-button[b-ylot0h4cmm],
    .proofs-col-ready .proofs-sort-button[b-ylot0h4cmm],
    .proofs-col-version .proofs-sort-button[b-ylot0h4cmm] {
        justify-content: center;
    }

.proofs-col-promotions[b-ylot0h4cmm],
.proofs-col-ready[b-ylot0h4cmm],
.proofs-col-version[b-ylot0h4cmm] {
    text-align: center;
}

.proofs-col-activity[b-ylot0h4cmm] {
    width: 92px;
}

.proofs-col-actions[b-ylot0h4cmm] {
    width: 126px;
}

/* Sticky Actions column */
/* ---------------------------------------------------------
   Keeps proof workflow actions visible during horizontal scrolling.
   --------------------------------------------------------- */
.proofs-table th.proofs-col-actions[b-ylot0h4cmm],
.proofs-table td.proofs-col-actions[b-ylot0h4cmm] {
    position: sticky;
    right: 0;
    z-index: 10;
    background: #ffffff;
}

.proofs-table thead th.proofs-col-actions[b-ylot0h4cmm] {
    z-index: 18;
    background: #ffffff;
}

/* Table text, tooltips, and badges */
/* ---------------------------------------------------------
   Defines compact proof-row typography and status treatments.
   CustomTooltip triggers require ::deep child-component styling.
   --------------------------------------------------------- */
[b-ylot0h4cmm] .proofs-title-tooltip {
    display: block;
    width: 100%;
    min-width: 0;
}

.proofs-primary-title[b-ylot0h4cmm] {
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 800;
    color: #0f172a;
}

.proofs-primary[b-ylot0h4cmm] {
    font-weight: 750;
    color: #0f172a;
}

.proofs-col-manufacturer .proofs-primary[b-ylot0h4cmm] {
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.2;
}

.proofs-secondary[b-ylot0h4cmm] {
    margin-top: 0.15rem;
    overflow: hidden;
    color: #64748b;
    font-size: 0.76rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.proofs-number[b-ylot0h4cmm] {
    font-weight: 800;
    color: #0f172a;
}

.proofs-status-badge[b-ylot0h4cmm],
.proofs-ready-badge[b-ylot0h4cmm],
.proofs-version-pill[b-ylot0h4cmm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    padding: 0.16rem 0.5rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 800;
    line-height: 1.1;
    white-space: nowrap;
}

.proofs-status-badge--success[b-ylot0h4cmm],
.proofs-ready-badge--yes[b-ylot0h4cmm] {
    color: #047857;
    background: #ecfdf5;
    border-color: #bbf7d0;
}

.proofs-status-badge--warning[b-ylot0h4cmm],
.proofs-ready-badge--no[b-ylot0h4cmm] {
    color: #92400e;
    background: #fffbeb;
    border-color: #fde68a;
}

.proofs-status-badge--info[b-ylot0h4cmm] {
    color: #1d4ed8;
    background: #eff6ff;
    border-color: #dbeafe;
}

.proofs-status-badge--neutral[b-ylot0h4cmm],
.proofs-version-pill[b-ylot0h4cmm] {
    color: #475569;
    background: #f8fafc;
    border-color: #e2e8f0;
}

/* Row actions */
/* ---------------------------------------------------------
   Keeps WAM Admin proof actions compact in two columns with
   dot separators between paired text actions.
   --------------------------------------------------------- */
.proofs-row-actions[b-ylot0h4cmm] {
    display: grid;
    grid-template-columns: repeat(2, max-content);
    align-items: center;
    justify-content: flex-start;
    column-gap: 0.45rem;
    row-gap: 0.18rem;
}

.proofs-link-action[b-ylot0h4cmm] {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 0;
    color: var(--link-600, #2563eb);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    text-align: left;
    text-decoration: none;
    white-space: nowrap;
}

    .proofs-link-action:nth-child(odd):not(:last-child)[b-ylot0h4cmm]::after {
        content: "·";
        display: inline-block;
        margin-left: 0.34rem;
        color: #94a3b8;
        font-weight: 800;
        text-decoration: none;
    }

    .proofs-link-action:hover[b-ylot0h4cmm] {
        color: #1d4ed8;
        text-decoration: underline;
        text-underline-offset: 2px;
    }

.proofs-link-action-secondary[b-ylot0h4cmm] {
    color: #334155;
}

.proofs-link-action-warning[b-ylot0h4cmm] {
    color: #b45309;
}


/* Pagination and empty states */
/* ---------------------------------------------------------
   Anchors pagination at the bottom of the proof workspace and
   provides shared loading, empty, and error-state treatments.
   --------------------------------------------------------- */
.proofs-pager[b-ylot0h4cmm] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 6px 14px 4px;
    background: #f8fafc;
    border-top: 1px solid rgba(25, 35, 68, 0.06);
}

.proofs-pager-summary[b-ylot0h4cmm] {
    color: var(--text-600, #475569);
    font-size: 12px;
    font-weight: 500;
}

.proofs-pager-page[b-ylot0h4cmm] {
    min-width: 88px;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 600;
    text-align: center;
}

.proofs-pager-actions[b-ylot0h4cmm] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.proofs-empty-state[b-ylot0h4cmm],
.proofs-inline-state[b-ylot0h4cmm] {
    border: 1px dashed #cbd5e1;
    border-radius: 0.85rem;
    padding: 1.1rem;
    text-align: center;
    color: #64748b;
    background: #f8fafc;
}

.proofs-empty-state[b-ylot0h4cmm] {
    margin: 14px;
}

.proofs-empty-state--compact[b-ylot0h4cmm] {
    margin: 0;
    padding: 0.8rem;
}

.proofs-inline-state--error[b-ylot0h4cmm],
.proofs-form-error[b-ylot0h4cmm] {
    color: #991b1b;
    background: #fef2f2;
    border-color: #fecaca;
}


/* Modal shell */
/* ---------------------------------------------------------
   Provides the shared Create, Upload, Override, and Details modal
   frame. Modal bodies own scrolling when content exceeds the viewport.
   --------------------------------------------------------- */
.proofs-modal-backdrop[b-ylot0h4cmm] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: rgba(15, 23, 42, 0.45);
}

.proofs-modal[b-ylot0h4cmm] {
    width: min(920px, 94vw);
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 1rem;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
    border: 1px solid rgba(226, 232, 240, 0.9);
}

.proofs-create-modal[b-ylot0h4cmm] {
    width: min(980px, 94vw);
}

.proofs-details-modal[b-ylot0h4cmm] {
    width: min(1080px, 94vw);
}

.proofs-modal-header[b-ylot0h4cmm] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 1.1rem 0.8rem;
    border-bottom: 1px solid #e2e8f0;
}

.proofs-modal-title[b-ylot0h4cmm] {
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    color: #0f172a;
}

.proofs-modal-subtitle[b-ylot0h4cmm] {
    margin: 4px 0 0;
    font-size: 13px;
    color: #64748b;
}

.proofs-modal-close[b-ylot0h4cmm] {
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
    font-size: 22px;
    line-height: 1;
}

.proofs-modal-body[b-ylot0h4cmm] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    display: grid;
    gap: 0.8rem;
    padding: 0.9rem 1rem;
    background: #f8fafc;
}

.proofs-modal-footer[b-ylot0h4cmm] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.6rem;
    padding: 0.8rem 1rem;
    border-top: 1px solid #e2e8f0;
    background: #ffffff;
}


/* Modal forms */
/* ---------------------------------------------------------
   Provides the shared WAM Admin proof form grid and field layout.
   --------------------------------------------------------- */
.proofs-form-grid[b-ylot0h4cmm] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.proofs-form-field-wide[b-ylot0h4cmm] {
    grid-column: 1 / -1;
}

.proofs-form-label[b-ylot0h4cmm] {
    display: block;
    margin-bottom: 0.25rem;
    color: #334155;
    font-size: 0.74rem;
    font-weight: 850;
}


/* Create Proof Promotion selection */
/* ---------------------------------------------------------
   Displays eligible WAM Approved Promotions selected for the
   Manufacturer Book Proof package.
   --------------------------------------------------------- */
.proofs-create-promotions-panel[b-ylot0h4cmm],
.proofs-detail-section[b-ylot0h4cmm] {
    border: 1px solid #e2e8f0;
    border-radius: 0.85rem;
    padding: 0.75rem;
    background: #ffffff;
}

.proofs-create-promotions-header[b-ylot0h4cmm],
.proofs-version-row[b-ylot0h4cmm],
.proofs-promotion-line[b-ylot0h4cmm],
.proofs-history-line[b-ylot0h4cmm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.proofs-section-title[b-ylot0h4cmm] {
    color: #0f172a;
    font-size: 0.84rem;
    font-weight: 850;
}

.proofs-section-helper[b-ylot0h4cmm],
.proofs-section-count[b-ylot0h4cmm] {
    margin-top: 0.12rem;
    color: #64748b;
    font-size: 0.76rem;
}

.proofs-create-promotions-list[b-ylot0h4cmm],
.proofs-detail-list[b-ylot0h4cmm] {
    display: grid;
    gap: 0.5rem;
    margin-top: 0.65rem;
}

.proofs-create-promotion-row[b-ylot0h4cmm] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.55rem;
    align-items: flex-start;
    border: 1px solid #e2e8f0;
    border-radius: 0.7rem;
    padding: 0.55rem 0.65rem;
    background: #ffffff;
    cursor: pointer;
}

.proofs-create-promotion-title[b-ylot0h4cmm] {
    display: block;
    color: #0f172a;
    font-size: 0.82rem;
    font-weight: 800;
}

.proofs-create-promotion-meta[b-ylot0h4cmm] {
    display: block;
    margin-top: 0.12rem;
    color: #64748b;
    font-size: 0.75rem;
}

/* PDF upload dropzone */
/* ---------------------------------------------------------
   Provides the Proof Version PDF upload surface. The transparent
   file input covers the complete dropzone.
   --------------------------------------------------------- */
.proofs-upload-dropzone[b-ylot0h4cmm] {
    position: relative;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
    gap: 0.75rem;
    border: 1px dashed #cbd5e1;
    border-radius: 0.85rem;
    padding: 0.85rem;
    background: #ffffff;
    cursor: pointer;
}

.proofs-upload-icon[b-ylot0h4cmm] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 0.75rem;
    background: #fee2e2;
    color: #991b1b;
    font-size: 0.72rem;
    font-weight: 900;
}

.proofs-upload-title[b-ylot0h4cmm] {
    color: #0f172a;
    font-size: 0.88rem;
    font-weight: 850;
}

.proofs-upload-helper[b-ylot0h4cmm] {
    margin-top: 0.15rem;
    color: #64748b;
    font-size: 0.76rem;
}

.proofs-upload-input[b-ylot0h4cmm] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

/* Details modal content */
/* ---------------------------------------------------------
   Displays read-only proof context, uploaded versions, included
   Promotions, and workflow history.
   --------------------------------------------------------- */
.proofs-detail-grid[b-ylot0h4cmm] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.5rem;
    margin-top: 0.65rem;
}

.proofs-detail-item[b-ylot0h4cmm] {
    min-width: 0;
    border: 1px solid #e5e7eb;
    border-radius: 0.6rem;
    padding: 0.45rem 0.55rem;
    background: #f8fafc;
}

.proofs-detail-label[b-ylot0h4cmm] {
    display: block;
    color: #64748b;
    font-size: 0.64rem;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.proofs-detail-value[b-ylot0h4cmm] {
    display: block;
    margin-top: 0.12rem;
    overflow: hidden;
    color: #0f172a;
    font-size: 0.78rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.proofs-version-row[b-ylot0h4cmm],
.proofs-promotion-line[b-ylot0h4cmm],
.proofs-history-line[b-ylot0h4cmm] {
    border: 1px solid #e2e8f0;
    border-radius: 0.7rem;
    padding: 0.55rem 0.65rem;
    background: #ffffff;
}
/* /Components/Shared/Books/ManufacturerBookProofsManufacturerShared.razor.rz.scp.css */
/* ManufacturerBookProofsManufacturerShared.razor.css */
/* ---------------------------------------------------------
   Provides the shared Manufacturer and Broker Book Proof review
   workspace.

   Manufacturer scope displays proofs for the current Manufacturer.
   Broker scope displays proofs across represented Manufacturers
   and adds the Mfg column with a wider table minimum.

   The page remains fixed-height. The table region owns internal
   scrolling while pagination and the Actions column remain stable.
   --------------------------------------------------------- */

/* Page shell */
/* ---------------------------------------------------------
   Participates in the shared full-height layout chain. The Broker
   modifier expands table capacity without changing Manufacturer layout.
   --------------------------------------------------------- */

.mfg-proofs-page[b-y169lncey7] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: #f8fafc;
    color: #0f172a;
    overflow: hidden;
    container-type: inline-size;
    container-name: mfg-proofs-page;
}

.mfg-proofs-workspace[b-y169lncey7] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow: hidden;
}


/* Summary cards */
/* ---------------------------------------------------------
   Displays Manufacturer and Broker proof-review counts and
   provides quick status filtering.
   --------------------------------------------------------- */
.mfg-proofs-summary-strip[b-y169lncey7] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.mfg-proofs-summary-card[b-y169lncey7] {
    min-width: 0;
    padding: 8px 10px;
    background: #fff;
    border: 1px solid var(--border-200);
    border-radius: 13px;
    text-align: left;
    box-shadow: var(--shadow-1);
}

.mfg-proofs-summary-card-button[b-y169lncey7] {
    width: 100%;
    appearance: none;
    cursor: pointer;
}

.mfg-proofs-summary-card--success[b-y169lncey7] {
    border-color: rgba(91, 196, 191, 0.38);
    background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.mfg-proofs-summary-card--warning[b-y169lncey7] {
    border-color: rgba(250, 169, 75, 0.32);
    background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

.mfg-proofs-summary-card--info[b-y169lncey7] {
    border-color: rgba(117, 140, 167, 0.24);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.04), #fff);
}

.mfg-proofs-summary-card--neutral[b-y169lncey7] {
    border-color: rgba(117, 140, 167, 0.22);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.035), #fff);
}

.mfg-proofs-summary-label[b-y169lncey7] {
    margin: 0 0 6px;
    overflow: hidden;
    color: var(--text-600);
    font-size: 13.5px;
    line-height: 1.3;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mfg-proofs-summary-value[b-y169lncey7] {
    margin: 0;
    color: var(--text-900);
    font-size: 21px;
    line-height: 1;
    font-weight: 800;
}

.mfg-proofs-summary-meta[b-y169lncey7] {
    margin-top: 5px;
    overflow: hidden;
    color: var(--text-500);
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* Proof list card */
/* ---------------------------------------------------------
   Contains the review header, filters, internally scrolling table,
   and anchored pagination.
   --------------------------------------------------------- */
.mfg-proofs-card[b-y169lncey7] {
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
}

.mfg-proofs-list-card[b-y169lncey7] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.mfg-proofs-panel-header[b-y169lncey7] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 1rem 0.7rem;
    border-bottom: 1px solid #e2e8f0;
}

.mfg-proofs-panel-title[b-y169lncey7] {
    min-width: 0;
}

.mfg-proofs-panel-actions[b-y169lncey7] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.mfg-proofs-card-title[b-y169lncey7] {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--text-900);
}

.mfg-proofs-card-subtitle[b-y169lncey7] {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--text-500);
}

.mfg-proofs-list-body[b-y169lncey7] {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
}


/* Filters and search */
/* ---------------------------------------------------------
   Provides the compact proof filter bar. ClearableSearchInput
   requires ::deep because the input is rendered by a child component.
   --------------------------------------------------------- */
.mfg-proofs-controls[b-y169lncey7] {
    display: grid;
    grid-template-columns: minmax(360px, 1fr) minmax(150px, 0.35fr) minmax(95px, 0.2fr);
    gap: 0.65rem;
    padding: 0.85rem 1rem 0.7rem;
    background: #ffffff;
}

.mfg-proofs-control[b-y169lncey7] {
    min-width: 0;
}

.mfg-proofs-control-label[b-y169lncey7] {
    display: block;
    margin-bottom: 0.22rem;
    font-size: 0.72rem;
    font-weight: 800;
    color: #334155;
}

.mfg-proofs-search[b-y169lncey7],
.mfg-proofs-filter-select[b-y169lncey7] {
    min-height: 2.2rem;
    border-radius: 0.55rem;
    border-color: #dbe4ef;
    font-size: 0.84rem;
    color: #0f172a;
}

[b-y169lncey7] .mfg-proofs-search-wrapper {
    width: 100%;
    min-width: 0;
}

    [b-y169lncey7] .mfg-proofs-search-wrapper .form-control {
        min-height: 2.2rem;
        border-radius: 0.55rem;
        border-color: #dbe4ef;
        font-size: 0.84rem;
        color: #0f172a;
    }

/* Sortable table headers */
/* ---------------------------------------------------------
   Uses button-based headers for keyboard-accessible sorting
   within the compact enterprise proof table.
   --------------------------------------------------------- */
.mfg-proofs-sort-button[b-y169lncey7] {
    appearance: none;
    width: 100%;
    border: 0;
    background: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    padding: 0;
    color: inherit;
    font: inherit;
    font-size: inherit;
    font-weight: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
    cursor: pointer;
    white-space: nowrap;
}

    .mfg-proofs-sort-button:hover[b-y169lncey7],
    .mfg-proofs-sort-button--active[b-y169lncey7] {
        color: #1d4ed8;
    }

.mfg-proofs-sort-indicator[b-y169lncey7] {
    flex: 0 0 auto;
    min-width: 12px;
    color: #2563eb;
    font-size: 0.68rem;
    font-weight: 900;
}


/* Proof table workspace */
/* ---------------------------------------------------------
   Keeps the proof list fixed-height. The table wrap owns vertical
   and horizontal scrolling while pagination stays anchored below.
   --------------------------------------------------------- */
.mfg-proofs-table-region[b-y169lncey7] {
    min-height: 0;
    height: 100%;
    margin: 0 12px 0;
    background: #ffffff;
    overflow: hidden;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
}

.mfg-proofs-table-wrap[b-y169lncey7] {
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    position: relative;
    background: #ffffff;
}

.mfg-proofs-table[b-y169lncey7] {
    margin: 0;
    min-width: 1040px;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.82rem;
}

    .mfg-proofs-table thead th[b-y169lncey7] {
        position: sticky;
        top: 0;
        z-index: 12;
        background: #ffffff;
        color: #64748b;
        font-size: 0.7rem;
        font-weight: 850;
        text-transform: uppercase;
        letter-spacing: 0.035em;
        white-space: nowrap;
        padding: 0.58rem 0.55rem;
        box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
    }

    .mfg-proofs-table tbody td[b-y169lncey7] {
        vertical-align: middle;
        border-bottom: 1px solid #edf2f7;
        padding: 0.56rem 0.55rem;
        background: #ffffff;
    }

    .mfg-proofs-table th.mfg-proofs-col-actions[b-y169lncey7],
    .mfg-proofs-table td.mfg-proofs-col-actions[b-y169lncey7] {
        text-align: left;
    }

    .mfg-proofs-table tbody tr:hover td[b-y169lncey7] {
        background: #fbfdff;
    }

/* Manufacturer and Broker table columns */
/* ---------------------------------------------------------
   Uses fixed column widths to protect the desktop workspace.
   Broker scope adds the Mfg column and a wider table minimum.
   --------------------------------------------------------- */
.mfg-proofs-col-cycle[b-y169lncey7] {
    width: 310px;
}

.mfg-proofs-col-status[b-y169lncey7] {
    width: 150px;
}

.mfg-proofs-col-version[b-y169lncey7] {
    width: 88px;
}

.mfg-proofs-col-promotions[b-y169lncey7] {
    width: 95px;
    text-align: center;
}

.mfg-proofs-col-sent[b-y169lncey7],
.mfg-proofs-col-reviewed[b-y169lncey7] {
    width: 105px;
}

.mfg-proofs-col-actions[b-y169lncey7] {
    width: 185px;
}

.mfg-proofs-col-manufacturer[b-y169lncey7] {
    width: 128px;
}

.mfg-proofs-manufacturer-name[b-y169lncey7] {
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.2;
}

.mfg-proofs-page--broker .mfg-proofs-table[b-y169lncey7] {
    min-width: 1120px;
}

/* Sticky Actions column */
/* ---------------------------------------------------------
   Keeps proof-review actions visible during horizontal scrolling.
   --------------------------------------------------------- */
.mfg-proofs-table th.mfg-proofs-col-actions[b-y169lncey7],
.mfg-proofs-table td.mfg-proofs-col-actions[b-y169lncey7] {
    position: sticky;
    right: 0;
    z-index: 10;
    background: #ffffff;
}

.mfg-proofs-table thead th.mfg-proofs-col-actions[b-y169lncey7] {
    z-index: 18;
    background: #ffffff;
}


/* Table text, tooltips, and badges */
/* ---------------------------------------------------------
   Defines compact row typography and proof-status treatments for
   Manufacturer and Broker review tables.
   --------------------------------------------------------- */
[b-y169lncey7] .mfg-proofs-title-tooltip {
    display: block;
    width: 100%;
    min-width: 0;
}

.mfg-proofs-primary-title[b-y169lncey7] {
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 800;
    color: #0f172a;
}

.mfg-proofs-primary[b-y169lncey7] {
    font-weight: 750;
    color: #0f172a;
}

.mfg-proofs-secondary[b-y169lncey7] {
    margin-top: 0.15rem;
    overflow: hidden;
    color: #64748b;
    font-size: 0.76rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mfg-proofs-number[b-y169lncey7] {
    font-weight: 800;
    color: #0f172a;
}

.mfg-proofs-status-badge[b-y169lncey7],
.mfg-proofs-version-pill[b-y169lncey7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    padding: 0.16rem 0.5rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 800;
    line-height: 1.1;
    white-space: nowrap;
}

.mfg-proofs-status-badge--success[b-y169lncey7] {
    color: #047857;
    background: #ecfdf5;
    border-color: #bbf7d0;
}

.mfg-proofs-status-badge--warning[b-y169lncey7] {
    color: #92400e;
    background: #fffbeb;
    border-color: #fde68a;
}

.mfg-proofs-status-badge--info[b-y169lncey7] {
    color: #1d4ed8;
    background: #eff6ff;
    border-color: #dbeafe;
}

.mfg-proofs-status-badge--neutral[b-y169lncey7],
.mfg-proofs-version-pill[b-y169lncey7] {
    color: #475569;
    background: #f8fafc;
    border-color: #e2e8f0;
}


/* Row actions */
/* ---------------------------------------------------------
   Keeps proof-review actions compact in two columns with
   dot separators between paired text actions.
   --------------------------------------------------------- */
.mfg-proofs-row-actions[b-y169lncey7] {
    display: grid;
    grid-template-columns: repeat(2, max-content);
    align-items: center;
    justify-content: flex-start;
    column-gap: 0.45rem;
    row-gap: 0.18rem;
}

.mfg-proofs-link-action[b-y169lncey7] {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 0;
    color: var(--link-600, #2563eb);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    text-align: left;
    text-decoration: none;
    white-space: nowrap;
}

    .mfg-proofs-link-action:nth-child(odd):not(:last-child)[b-y169lncey7]::after {
        content: "·";
        display: inline-block;
        margin-left: 0.34rem;
        color: #94a3b8;
        font-weight: 800;
        text-decoration: none;
    }

    .mfg-proofs-link-action:hover[b-y169lncey7] {
        color: #1d4ed8;
        text-decoration: underline;
        text-underline-offset: 2px;
    }

.mfg-proofs-link-action-approve[b-y169lncey7] {
    color: #047857;
}

.mfg-proofs-link-action-warning[b-y169lncey7] {
    color: #b45309;
}

/* Pagination and empty states */
/* ---------------------------------------------------------
   Anchors pagination at the bottom of the proof workspace and
   provides shared loading, empty, and error-state treatments.
   --------------------------------------------------------- */
.mfg-proofs-pager[b-y169lncey7] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 6px 14px 4px;
    background: #f8fafc;
    border-top: 1px solid rgba(25, 35, 68, 0.06);
}

.mfg-proofs-pager-summary[b-y169lncey7],
.mfg-proofs-pager-page[b-y169lncey7] {
    color: #475569;
    font-size: 12px;
    font-weight: 600;
}

.mfg-proofs-pager-actions[b-y169lncey7] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.mfg-proofs-empty-state[b-y169lncey7],
.mfg-proofs-inline-state[b-y169lncey7] {
    border: 1px dashed #cbd5e1;
    border-radius: 0.85rem;
    padding: 1.1rem;
    text-align: center;
    color: #64748b;
    background: #f8fafc;
}

.mfg-proofs-empty-state[b-y169lncey7] {
    margin: 14px;
}

.mfg-proofs-inline-state--error[b-y169lncey7],
.mfg-proofs-form-error[b-y169lncey7] {
    color: #991b1b;
    background: #fef2f2;
    border-color: #fecaca;
}


/* Review and detail content */
/* ---------------------------------------------------------
   Provides review-action modals and read-only proof context,
   versions, included Promotions, and workflow history.
   --------------------------------------------------------- */
.mfg-proofs-modal-backdrop[b-y169lncey7] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: rgba(15, 23, 42, 0.45);
}

.mfg-proofs-modal[b-y169lncey7] {
    width: min(860px, 94vw);
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 1rem;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
    border: 1px solid rgba(226, 232, 240, 0.9);
}

.mfg-proofs-details-modal[b-y169lncey7] {
    width: min(1080px, 94vw);
}

.mfg-proofs-modal-header[b-y169lncey7] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 1.1rem 0.8rem;
    border-bottom: 1px solid #e2e8f0;
}

.mfg-proofs-modal-title[b-y169lncey7] {
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    color: #0f172a;
}

.mfg-proofs-modal-subtitle[b-y169lncey7] {
    margin: 4px 0 0;
    font-size: 13px;
    color: #64748b;
}

.mfg-proofs-modal-close[b-y169lncey7] {
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
    font-size: 22px;
    line-height: 1;
}

.mfg-proofs-modal-body[b-y169lncey7] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    display: grid;
    gap: 0.8rem;
    padding: 0.9rem 1rem;
    background: #f8fafc;
}

.mfg-proofs-modal-footer[b-y169lncey7] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.6rem;
    padding: 0.8rem 1rem;
    border-top: 1px solid #e2e8f0;
    background: #ffffff;
}

.mfg-proofs-review-callout[b-y169lncey7],
.mfg-proofs-detail-section[b-y169lncey7] {
    border: 1px solid #e2e8f0;
    border-radius: 0.85rem;
    padding: 0.75rem;
    background: #ffffff;
}

.mfg-proofs-review-callout[b-y169lncey7] {
    color: #334155;
    font-size: 0.84rem;
    font-weight: 650;
}

.mfg-proofs-form-label[b-y169lncey7] {
    display: block;
    margin-bottom: 0.25rem;
    color: #334155;
    font-size: 0.74rem;
    font-weight: 850;
}

.mfg-proofs-section-title[b-y169lncey7] {
    color: #0f172a;
    font-size: 0.84rem;
    font-weight: 850;
}

.mfg-proofs-detail-grid[b-y169lncey7] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.5rem;
    margin-top: 0.65rem;
}

.mfg-proofs-detail-item[b-y169lncey7] {
    min-width: 0;
    border: 1px solid #e5e7eb;
    border-radius: 0.6rem;
    padding: 0.45rem 0.55rem;
    background: #f8fafc;
}

.mfg-proofs-detail-label[b-y169lncey7] {
    display: block;
    color: #64748b;
    font-size: 0.64rem;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.mfg-proofs-detail-value[b-y169lncey7] {
    display: block;
    margin-top: 0.12rem;
    overflow: hidden;
    color: #0f172a;
    font-size: 0.78rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mfg-proofs-detail-list[b-y169lncey7] {
    display: grid;
    gap: 0.5rem;
    margin-top: 0.65rem;
}

.mfg-proofs-version-row[b-y169lncey7],
.mfg-proofs-promotion-line[b-y169lncey7],
.mfg-proofs-history-line[b-y169lncey7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.7rem;
    padding: 0.55rem 0.65rem;
    background: #ffffff;
}
/* /Components/Shared/ClearableSearchInput.razor.rz.scp.css */
.clearable-search[b-ohyzdmrgh6] {
  position: relative;
  width: 100%;
  min-width: 0;
}

.clearable-search__input[b-ohyzdmrgh6] {
  width: 100%;
  min-width: 0;
  padding-right: 34px !important;
}

.clearable-search__clear[b-ohyzdmrgh6] {
  position: absolute;
  top: 50%;
  right: 8px;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--text-500);
  font-size: 16px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 120ms ease, color 120ms ease;
}

  .clearable-search__clear:hover[b-ohyzdmrgh6] {
    background: rgba(25, 35, 68, 0.08);
    color: var(--text-900);
  }

  .clearable-search__clear:focus-visible[b-ohyzdmrgh6] {
    outline: 2px solid rgba(37, 99, 235, 0.35);
    outline-offset: 1px;
  }
/* /Components/Shared/ClearFiltersButton.razor.rz.scp.css */
/* =========================================================
   Clear filters button
   ---------------------------------------------------------
   Reusable secondary utility action for table/report pages.
   Used when search or filters are active. This button clears
   search/filter criteria only and should not reset sort,
   page size, selected tab, or page workflow state.
   ========================================================= */

.clear-filters-button[b-kisy5ycclf] {
  appearance: none;
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1px solid rgba(100, 116, 139, 0.26);
  border-radius: 8px;
  background: #ffffff;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

  .clear-filters-button:hover[b-kisy5ycclf] {
    border-color: rgba(37, 99, 235, 0.34);
    background: rgba(37, 99, 235, 0.04);
    color: #1d4ed8;
  }

  .clear-filters-button:focus-visible[b-kisy5ycclf] {
    outline: none;
    box-shadow: var(--focus-ring);
  }

  .clear-filters-button:disabled[b-kisy5ycclf] {
    cursor: not-allowed;
    opacity: 0.58;
  }

  .clear-filters-button i[b-kisy5ycclf] {
    flex: 0 0 auto;
    font-size: 12px;
    line-height: 1;
  }
/* /Components/Shared/CustomTooltip.razor.rz.scp.css */
.custom-tooltip-trigger[b-gvcilhs0fz] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.custom-tooltip-trigger--nav[b-gvcilhs0fz] {
  display: block;
  width: 100%;
}

.custom-tooltip[b-gvcilhs0fz] {
  position: fixed;
  z-index: 2147483000;
  box-sizing: border-box;
  pointer-events: none;
  padding: 9px 12px 9px 14px;
  border-radius: 10px;
  color: #1f2937;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: normal;
  text-transform: none;
  white-space: normal;
  overflow-wrap: anywhere;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.13);
}

  .custom-tooltip[b-gvcilhs0fz]::before {
    content: "";
    position: absolute;
    width: 9px;
    height: 9px;
    box-sizing: border-box;
    background: inherit;
    border: 1px solid rgba(100, 116, 139, 0.24);
    transform: rotate(45deg);
    pointer-events: none;
  }

.custom-tooltip--warm[b-gvcilhs0fz] {
  --custom-tooltip-accent-color: rgba(245, 158, 11, 0.58);
  --custom-tooltip-border-color: rgba(245, 158, 11, 0.44);
  border: 1px solid var(--custom-tooltip-border-color);
  border-left-width: 4px;
  border-left-color: var(--custom-tooltip-accent-color);
  border-right-width: 1px;
  border-right-color: var(--custom-tooltip-border-color);
  background: linear-gradient(180deg, #ffffff 0%, #fffaf0 100%);
  color: #1f2937;
  padding-left: 12px;
  padding-right: 12px;
}

.custom-tooltip--warm[b-gvcilhs0fz] {
  --custom-tooltip-border-color: rgba(245, 158, 11, 0.44);
  border-left-width: 4px;
  border-left-color: var(--custom-tooltip-accent-color);
  border-right-width: 1px;
  border-right-color: var(--custom-tooltip-border-color);
  padding-left: 12px;
  padding-right: 12px;
}

  .custom-tooltip--warm[data-placement="right"][b-gvcilhs0fz],
  .custom-tooltip--warm[data-placement="top"][data-horizontal-align="left"][b-gvcilhs0fz],
  .custom-tooltip--warm[data-placement="bottom"][data-horizontal-align="left"][b-gvcilhs0fz] {
    border-left-width: 1px;
    border-left-color: var(--custom-tooltip-border-color);
    border-right-width: 4px;
    border-right-color: var(--custom-tooltip-accent-color);
  }

  .custom-tooltip--warm[data-placement="left"][b-gvcilhs0fz],
  .custom-tooltip--warm[data-placement="top"][data-horizontal-align="center"][b-gvcilhs0fz],
  .custom-tooltip--warm[data-placement="top"][data-horizontal-align="right"][b-gvcilhs0fz],
  .custom-tooltip--warm[data-placement="bottom"][data-horizontal-align="center"][b-gvcilhs0fz],
  .custom-tooltip--warm[data-placement="bottom"][data-horizontal-align="right"][b-gvcilhs0fz] {
    border-left-width: 4px;
    border-left-color: var(--custom-tooltip-accent-color);
    border-right-width: 1px;
    border-right-color: var(--custom-tooltip-border-color);
  }

.custom-tooltip--dark[b-gvcilhs0fz] {
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(15, 23, 42, 0.96);
  color: #ffffff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.22);
}

  .custom-tooltip--dark[b-gvcilhs0fz]::before {
    background: rgba(15, 23, 42, 0.96);
    border-color: rgba(255, 255, 255, 0.08);
  }

.custom-tooltip--neutral[b-gvcilhs0fz] {
  border: 1px solid rgba(100, 116, 139, 0.24);
  background: #ffffff;
  color: #334155;
}

.custom-tooltip--info[b-gvcilhs0fz] {
  border: 1px solid rgba(59, 130, 246, 0.22);
  background: #eff6ff;
  color: #1e3a8a;
}

.custom-tooltip--sm[b-gvcilhs0fz] {
  width: max-content;
  max-width: 220px;
}

.custom-tooltip--md[b-gvcilhs0fz] {
  width: max-content;
  max-width: 300px;
}

.custom-tooltip--lg[b-gvcilhs0fz] {
  width: max-content;
  max-width: 380px;
}

.custom-tooltip--wide[b-gvcilhs0fz] {
  width: max-content;
  max-width: 460px;
}

.custom-tooltip--nowrap[b-gvcilhs0fz] {
  width: max-content;
  max-width: min(520px, calc(100vw - 32px));
  white-space: nowrap;
}

.custom-tooltip--compact[b-gvcilhs0fz] {
  padding: 7px 10px 7px 12px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 650;
  line-height: 1.3;
}

.custom-tooltip--standard[b-gvcilhs0fz] {
  min-height: 0;
}

.custom-tooltip--block[b-gvcilhs0fz] {
  min-width: 240px;
  padding: 11px 13px;
  border-radius: 12px;
}

/*Arrow*/
.custom-tooltip[data-placement="top"][b-gvcilhs0fz]::before {
  left: calc(50% - 4.5px);
  bottom: -5px;
  border-left: 0;
  border-top: 0;
}

.custom-tooltip[data-placement="bottom"][b-gvcilhs0fz]::before {
  left: calc(50% - 4.5px);
  top: -5px;
  border-right: 0;
  border-bottom: 0;
}

.custom-tooltip[data-placement="left"][b-gvcilhs0fz]::before {
  right: -5px;
  top: calc(50% - 4.5px);
  border-left: 0;
  border-bottom: 0;
}

.custom-tooltip[data-placement="right"][b-gvcilhs0fz]::before {
  left: -5px;
  top: calc(50% - 4.5px);
  border-right: 0;
  border-top: 0;
}

.custom-tooltip--warm[b-gvcilhs0fz]::before {
  border-color: rgba(245, 158, 11, 0.44);
}

/*Align*/
.custom-tooltip[data-placement="top"][data-horizontal-align="left"][b-gvcilhs0fz]::before,
.custom-tooltip[data-placement="bottom"][data-horizontal-align="left"][b-gvcilhs0fz]::before {
  left: 18px;
}

.custom-tooltip[data-placement="top"][data-horizontal-align="right"][b-gvcilhs0fz]::before,
.custom-tooltip[data-placement="bottom"][data-horizontal-align="right"][b-gvcilhs0fz]::before {
  left: auto;
  right: 18px;
}

.custom-tooltip[data-placement="left"][data-vertical-align="top"][b-gvcilhs0fz]::before,
.custom-tooltip[data-placement="right"][data-vertical-align="top"][b-gvcilhs0fz]::before {
  top: 18px;
}

.custom-tooltip[data-placement="left"][data-vertical-align="bottom"][b-gvcilhs0fz]::before,
.custom-tooltip[data-placement="right"][data-vertical-align="bottom"][b-gvcilhs0fz]::before {
  top: auto;
  bottom: 18px;
}
/* /Components/Shared/CycleCalendar.razor.rz.scp.css */
.cycle-calendar-page[b-xi8n0z0yb9] {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 2px 2px 2px 0px;
  overflow: hidden;
}

.cycle-calendar-card[b-xi8n0z0yb9] {
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  background: var(--bg-surface, #fff);
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 14px;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
  overflow: hidden;
}

.cycle-calendar-card-header[b-xi8n0z0yb9] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px 12px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.cycle-calendar-card-title[b-xi8n0z0yb9] {
  margin: 0;
  color: var(--text-900, #0f172a);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.cycle-calendar-card-subtitle[b-xi8n0z0yb9] {
  margin-top: 2px;
  color: var(--text-600, #64748b);
  font-size: 13px;
}

.cycle-calendar-nav[b-xi8n0z0yb9] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.cycle-calendar-body[b-xi8n0z0yb9] {
  min-height: 0;
  height: 100%;
  box-sizing: border-box;
  padding: 8px 8px 8px 8px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  gap: 10px;
  overflow: hidden;
  align-items: stretch;
}

.cycle-calendar-main[b-xi8n0z0yb9] {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 12px;
  background: #fff;
}

.cycle-calendar-grid[b-xi8n0z0yb9] {
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-template-rows: 32px repeat(6, minmax(0, 1fr));
  overflow-x: hidden;
  overflow-y: auto;
  background: #fff;
  border-top: 1px solid rgba(25, 35, 68, 0.08);
  border-left: 1px solid rgba(25, 35, 68, 0.08);
  scrollbar-gutter: stable;
}

.cycle-calendar-day-name[b-xi8n0z0yb9] {
  position: sticky;
  top: 0;
  z-index: 2;
  min-height: 32px;
  padding: 8px 6px;
  background: #f8fafc;
  color: var(--text-500);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-align: center;
  border-right: 1px solid rgba(25, 35, 68, 0.08);
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.cycle-calendar-day[b-xi8n0z0yb9] {
  min-width: 0;
  min-height: 0;
  padding: 7px 6px 7px 6px;
  background: #fff;
  overflow: visible;
  border-right: 1px solid rgba(25, 35, 68, 0.08);
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.cycle-calendar-day--outside-month[b-xi8n0z0yb9] {
  background: #fbfdff;
}

  .cycle-calendar-day--outside-month .cycle-calendar-date-number[b-xi8n0z0yb9] {
    color: #b5c0ce;
  }

.cycle-calendar-day--today[b-xi8n0z0yb9] {
  position: relative;
  background: linear-gradient(180deg, rgba(37, 99, 235, 0.055), #fff);
  box-shadow: inset 0 0 0 2px rgba(37, 99, 235, 0.55);
}

  .cycle-calendar-day--today .cycle-calendar-date-number[b-xi8n0z0yb9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 999px;
    background: #1d3a6d;
    color: #fff;
  }

.cycle-calendar-date-number[b-xi8n0z0yb9] {
  margin-bottom: 5px;
  color: var(--text-700);
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

.cycle-calendar-events[b-xi8n0z0yb9] {
  position: relative;
  min-width: 0;
  display: grid;
  gap: 4px;
  align-content: start;
}

.cycle-calendar-event[b-xi8n0z0yb9] {
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 21px;
  border: 1px solid transparent;
  border-radius: 7px;
  padding: 2px 7px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  cursor: default;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.035);
}

  .cycle-calendar-event:hover[b-xi8n0z0yb9] {
    filter: brightness(0.985);
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08);
  }

  .cycle-calendar-event[b-xi8n0z0yb9]::after {
    content: attr(data-tooltip);
    position: absolute;
    left: 0;
    bottom: calc(100% + 8px);
    z-index: 30;
    width: max-content;
    max-width: 280px;
    padding: 7px 10px;
    border-radius: 6px;
    background: #fff7cc;
    border: 1px solid #d7b85a;
    color: #1f2937;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    white-space: normal;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18);
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px);
    pointer-events: none;
    transition: opacity 0.12s ease, transform 0.12s ease, visibility 0.12s ease;
  }

  .cycle-calendar-event[b-xi8n0z0yb9]::before {
    content: "";
    position: absolute;
    left: 14px;
    bottom: calc(100% + 3px);
    z-index: 31;
    width: 10px;
    height: 10px;
    background: #fff7cc;
    border-left: 1px solid #d7b85a;
    border-top: 1px solid #d7b85a;
    transform: rotate(45deg);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.12s ease, visibility 0.12s ease;
  }

  .cycle-calendar-event:hover[b-xi8n0z0yb9]::after,
  .cycle-calendar-event:focus-visible[b-xi8n0z0yb9]::after,
  .cycle-calendar-event:hover[b-xi8n0z0yb9]::before,
  .cycle-calendar-event:focus-visible[b-xi8n0z0yb9]::before {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }

.cycle-calendar-event--tooltip-right[b-xi8n0z0yb9]::after {
  left: auto;
  right: 0;
}

.cycle-calendar-event--tooltip-right[b-xi8n0z0yb9]::before {
  left: auto;
  right: 14px;
}

.cycle-calendar-event-dot[b-xi8n0z0yb9] {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  flex: 0 0 auto;
  background: currentColor;
}

.cycle-calendar-event-text[b-xi8n0z0yb9] {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cycle-calendar-event--draft[b-xi8n0z0yb9] {
  background: #dbeafe;
  border-color: rgba(29, 78, 216, 0.12);
  color: #1d4ed8;
}

.cycle-calendar-event--submission[b-xi8n0z0yb9] {
  background: rgba(91, 196, 191, 0.16);
  border-color: rgba(91, 196, 191, 0.24);
  color: #206a66;
}

.cycle-calendar-event--manufacturer-due[b-xi8n0z0yb9] {
  background: rgba(241, 95, 87, 0.14);
  border-color: rgba(241, 95, 87, 0.26);
  color: #9d423c;
}

.cycle-calendar-event--distributor-review[b-xi8n0z0yb9] {
  background: #ede9fe;
  border-color: rgba(91, 33, 182, 0.16);
  color: #5b21b6;
}

.cycle-calendar-event--distributor-due[b-xi8n0z0yb9] {
  background: rgba(250, 169, 75, 0.18);
  border-color: rgba(250, 169, 75, 0.28);
  color: #9a5a12;
}

.cycle-calendar-more[b-xi8n0z0yb9] {
  width: fit-content;
  border: 0;
  background: transparent;
  padding: 0 0 0 4px;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 700;
  color: var(--link-600, #2563eb);
  cursor: pointer;
}

  .cycle-calendar-more:hover[b-xi8n0z0yb9] {
    text-decoration: underline;
  }

.cycle-calendar-footnote[b-xi8n0z0yb9] {
  padding: 7px 12px;
  border-top: 1px solid rgba(25, 35, 68, 0.08);
  color: var(--text-500);
  font-size: 12px;
  background: #f8fafc;
}

.cycle-calendar-side[b-xi8n0z0yb9] {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 12px;
  overflow: hidden;
}

.cycle-calendar-side-card[b-xi8n0z0yb9] {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 12px;
  background: #fff;
  display: flex;
  flex-direction: column;
}

  .cycle-calendar-side-card > .cycle-calendar-side-title[b-xi8n0z0yb9] {
    padding: 11px 12px 9px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
  }

.cycle-calendar-side-header[b-xi8n0z0yb9] {
  padding: 11px 12px 9px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.cycle-calendar-side-title[b-xi8n0z0yb9] {
  font-size: 14px;
  font-weight: 800;
  color: var(--text-900);
}

.cycle-calendar-side-subtitle[b-xi8n0z0yb9] {
  margin-top: 2px;
  font-size: 12px;
  color: var(--text-500);
}

.cycle-calendar-upcoming-list[b-xi8n0z0yb9] {
  min-height: 0;
  overflow: auto;
  scrollbar-gutter: stable;
}

.cycle-calendar-upcoming-empty[b-xi8n0z0yb9] {
  padding: 14px 12px;
  color: var(--text-500);
  font-size: 13px;
}

.cycle-calendar-upcoming-row[b-xi8n0z0yb9] {
  width: 100%;
  border: 0;
  border-bottom: 1px solid rgba(25, 35, 68, 0.07);
  background: #fff;
  padding: 8px 8px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
  text-align: left;
}

  .cycle-calendar-upcoming-row:hover[b-xi8n0z0yb9] {
    background: #f8fafc;
  }

.cycle-calendar-upcoming-copy[b-xi8n0z0yb9] {
  min-width: 0;
  display: grid;
  gap: 1px;
}

.cycle-calendar-upcoming-title[b-xi8n0z0yb9] {
  color: var(--text-900);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.cycle-calendar-upcoming-meta[b-xi8n0z0yb9] {
  color: var(--text-500);
  font-size: 11px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cycle-calendar-upcoming-date[b-xi8n0z0yb9] {
  color: var(--text-600);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.cycle-calendar-legend[b-xi8n0z0yb9] {
  padding: 10px 6px 12px 6px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 6px;
}

.cycle-calendar-legend-item[b-xi8n0z0yb9] {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--text-700);
  font-size: 11px;
  font-weight: 600;
}

.cycle-calendar-dot[b-xi8n0z0yb9] {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  flex: 0 0 auto;
  background: #94a3b8;
}

.cycle-calendar-dot--draft[b-xi8n0z0yb9] {
  background: #3b82f6;
}

.cycle-calendar-dot--submission[b-xi8n0z0yb9] {
  background: #2ba89f;
}

.cycle-calendar-dot--manufacturer-due[b-xi8n0z0yb9] {
  background: #e85b50;
}

.cycle-calendar-dot--distributor-review[b-xi8n0z0yb9] {
  background: #7c3aed;
}

.cycle-calendar-dot--distributor-due[b-xi8n0z0yb9] {
  background: #e68a1a;
}

.cycle-calendar-state[b-xi8n0z0yb9] {
  padding: 18px;
  color: #64748b;
  font-size: 14px;
}

.cycle-calendar-modal-backdrop[b-xi8n0z0yb9] {
  position: fixed;
  inset: 0;
  z-index: 1040;
  background: rgba(15, 23, 42, 0.35);
}

.cycle-calendar-modal[b-xi8n0z0yb9] {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 8rem 1rem 1rem;
}

.cycle-calendar-day-modal-card[b-xi8n0z0yb9] {
  width: min(520px, calc(100vw - 2rem));
  max-height: calc(100vh - 10rem);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 12px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.22);
}

.cycle-calendar-modal-header[b-xi8n0z0yb9] {
  padding: 14px 16px 10px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.cycle-calendar-modal-title[b-xi8n0z0yb9] {
  color: #0f172a;
  font-size: 15px;
  font-weight: 700;
}

.cycle-calendar-day-modal-subtitle[b-xi8n0z0yb9] {
  margin-top: 2px;
  color: #64748b;
  font-size: 12px;
}

.cycle-calendar-modal-body[b-xi8n0z0yb9] {
  overflow: auto;
  padding: 10px;
}

.cycle-calendar-day-event-row[b-xi8n0z0yb9] {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  padding: 10px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.06);
}

.cycle-calendar-day-event-copy[b-xi8n0z0yb9] {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.cycle-calendar-day-event-title[b-xi8n0z0yb9] {
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
}

.cycle-calendar-day-event-meta[b-xi8n0z0yb9],
.cycle-calendar-day-event-tooltip[b-xi8n0z0yb9] {
  color: #64748b;
  font-size: 12px;
}

@media (max-width: 1100px) {
  .cycle-calendar-body[b-xi8n0z0yb9] {
    grid-template-columns: minmax(0, 1fr);
  }

  .cycle-calendar-side[b-xi8n0z0yb9] {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }
}
/* /Components/Shared/Dashboards/DashboardShared.razor.rz.scp.css */
/* =========================================================
   DashboardShared.razor.css
   ---------------------------------------------------------
   Scope:
   - Shared dashboard layout for WAM Admin, Manufacturer,
     Distributor, Broker, and future role dashboards
   - Welcome hero and optional cycle calendar snapshot
   - Compact dashboard stat cards
   - Shared dashboard panels and section headers
   - Recent activity card list
   - Quick Links navigation panel
   - Badge, empty-state, and responsive behavior

   Layout notes:
   - The dashboard is designed as a fixed-height workspace.
   - Vertical scrolling stays inside panel bodies on desktop.
   - Container queries respond to available dashboard content
     width, not only browser viewport width. This is important
     because sidebar expansion changes usable content width.
   ========================================================= */

/* =========================================================
   Page Shell
   ---------------------------------------------------------
   Root dashboard container and shared section spacing.
   The container name powers responsive rules at the end of
   this file.
   ========================================================= */

.dashboard-shared[b-9j6q7i9axt] {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 6px 2px 2px;
  overflow: hidden;
  container-type: inline-size;
  container-name: dashboard-page;
}

/* =========================================================
   Welcome Hero
   ---------------------------------------------------------
   Role label, greeting, subtitle, create action, and optional
   cycle calendar snapshot.
   ========================================================= */

.dashboard-hero-card[b-9j6q7i9axt] {
  flex: 0 0 auto;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 24px;
  padding: 12px 14px;
  background: linear-gradient(135deg, rgba(29, 58, 109, 0.04), rgba(91, 196, 191, 0.05)), var(--bg-surface);
  border: 1px solid var(--border-200);
  border-radius: 18px;
  box-shadow: var(--shadow-1);
}

.dashboard-hero-content[b-9j6q7i9axt] {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.dashboard-role-label[b-9j6q7i9axt] {
  margin-bottom: 6px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--brand-600);
}

.dashboard-title[b-9j6q7i9axt] {
  margin: 0;
  font-size: 30px;
  line-height: 1.08;
  font-weight: 700;
  color: var(--text-900);
}

.dashboard-subtitle[b-9j6q7i9axt] {
  margin: 8px 0 0;
  max-width: 760px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--text-600);
}

.dashboard-hero-actions[b-9j6q7i9axt] {
  flex: 0 0 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 8px;
  margin-left: auto;
  padding-left: 0;
}

.dashboard-create-button[b-9j6q7i9axt] {
  min-width: 190px;
  min-height: 44px;
  padding: 10px 18px;
  border-radius: 12px;
  font-weight: 600;
  box-shadow: 0 8px 18px rgba(29, 58, 109, 0.12);
}

/* =========================================================
   Cycle Calendar Snapshot
   ---------------------------------------------------------
   Compact two-column cycle snapshot displayed inside the
   welcome hero when ShowCycleSnapshot is enabled.
   ========================================================= */

.dashboard-cycle-calendar[b-9j6q7i9axt] {
  flex: 0 0 auto;
  width: min(355px, 100%);
  max-width: 355px;
  min-width: 335px;
  margin-left: auto;
  align-self: flex-start;
  overflow: hidden;
  border: 1px solid rgba(91, 196, 191, 0.38);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(91, 196, 191, 0.055), rgba(255, 255, 255, 0.96));
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.035);
  color: inherit;
  font-size: 12px;
}

.dashboard-cycle-calendar-link[b-9j6q7i9axt] {
  text-decoration: none;
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

  .dashboard-cycle-calendar-link:hover[b-9j6q7i9axt] {
    color: inherit;
    text-decoration: none;
    border-color: rgba(37, 99, 235, 0.28);
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.12);
    transform: translateY(-1px);
  }

  .dashboard-cycle-calendar-link:focus-visible[b-9j6q7i9axt] {
    outline: 3px solid rgba(37, 99, 235, 0.24);
    outline-offset: 3px;
  }

.dashboard-cycle-calendar-header[b-9j6q7i9axt] {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 32px;
  padding: 7px 12px;
  border-bottom: 1px solid rgba(91, 196, 191, 0.20);
  color: var(--text-800);
  font-size: 12px;
  line-height: 1.1;
  font-weight: 600;
}

  .dashboard-cycle-calendar-header i[b-9j6q7i9axt] {
    font-size: 13px;
    color: var(--text-500);
  }

.dashboard-cycle-calendar-body[b-9j6q7i9axt] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-cycle-calendar-cell[b-9j6q7i9axt] {
  min-width: 0;
  padding: 7px 10px 8px;
}

  .dashboard-cycle-calendar-cell + .dashboard-cycle-calendar-cell[b-9j6q7i9axt] {
    border-left: 1px solid rgba(91, 196, 191, 0.16);
  }

.dashboard-cycle-calendar-title-line[b-9j6q7i9axt] {
  display: flex;
  align-items: baseline;
  gap: 4px;
  min-width: 0;
  margin-bottom: 5px;
  white-space: nowrap;
}

.dashboard-cycle-calendar-cell-current .dashboard-cycle-calendar-label[b-9j6q7i9axt] {
  color: #168254;
}

.dashboard-cycle-calendar-cell-next .dashboard-cycle-calendar-label[b-9j6q7i9axt] {
  color: #2563eb;
}

.dashboard-cycle-calendar-value[b-9j6q7i9axt] {
  min-width: 0;
  overflow: hidden;
  color: var(--text-900);
  font-size: 12px;
  line-height: 1.15;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-cycle-calendar-status[b-9j6q7i9axt] {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 0;
  overflow: hidden;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-cycle-calendar-status-current[b-9j6q7i9axt] {
  color: #168254;
}

.dashboard-cycle-calendar-status-next[b-9j6q7i9axt] {
  color: #2563eb;
}

.dashboard-cycle-calendar-dot[b-9j6q7i9axt] {
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 999px;
  background: currentColor;
}

/* =========================================================
   Dashboard Stat Cards
   ---------------------------------------------------------
   Compact role-aware summary cards used directly under the
   welcome hero. This sizing is intended as the dashboard
   reference pattern for future role dashboards.
   ========================================================= */

.dashboard-stat-grid[b-9j6q7i9axt] {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
  gap: 10px;
}

.dashboard-stat-card[b-9j6q7i9axt] {
  min-width: 0;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid var(--border-200);
  border-radius: 13px;
  box-shadow: var(--shadow-1);
}

.dashboard-stat-label[b-9j6q7i9axt] {
  margin: 0 0 6px;
  overflow: hidden;
  color: var(--text-600);
  font-size: 13.5px;
  line-height: 1.3;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-stat-value[b-9j6q7i9axt] {
  margin: 0;
  color: var(--text-900);
  font-size: 21px;
  line-height: 1;
  font-weight: 800;
}

.dashboard-stat-meta[b-9j6q7i9axt] {
  margin-top: 5px;
  overflow: hidden;
  color: var(--text-500);
  font-size: 12px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-accent-review[b-9j6q7i9axt] {
  border-color: rgba(250, 169, 75, 0.32);
  background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

.dashboard-accent-success[b-9j6q7i9axt] {
  border-color: rgba(91, 196, 191, 0.38);
  background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.dashboard-accent-alert[b-9j6q7i9axt] {
  border-color: rgba(241, 95, 87, 0.28);
  background: linear-gradient(180deg, rgba(241, 95, 87, 0.05), #fff);
}

/* =========================================================
   Main Dashboard Panels
   ---------------------------------------------------------
   Recent Activity and Quick Links panels. Desktop layout keeps
   both panels fixed inside the dashboard workspace.
   ========================================================= */

.dashboard-main-grid[b-9j6q7i9axt] {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(380px, 0.9fr);
  gap: 10px;
  overflow: hidden;
}

.dashboard-panel[b-9j6q7i9axt] {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--border-200);
  border-radius: 18px;
}

.dashboard-panel-header[b-9j6q7i9axt] {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 16px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.dashboard-panel-title[b-9j6q7i9axt] {
  margin: 0;
  color: var(--text-900);
  font-size: 21px;
  font-weight: 700;
}

.dashboard-panel-subtitle[b-9j6q7i9axt] {
  margin: 4px 0 0;
  color: var(--text-500);
  font-size: 13px;
}

.dashboard-panel-action[b-9j6q7i9axt] {
  flex: 0 0 auto;
  align-self: center;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

  .dashboard-panel-action:hover[b-9j6q7i9axt] {
    color: #143a74;
    text-decoration: underline;
  }

.dashboard-panel-body[b-9j6q7i9axt] {
  flex: 1 1 auto;
  min-height: 0;
  padding: 8px 0 8px 8px;
  overflow: hidden;
}

/* Panel lists own desktop scrolling instead of the full page. */
.dashboard-recent-list[b-9j6q7i9axt],
.dashboard-quick-links[b-9j6q7i9axt] {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  padding-right: 2px;
  scrollbar-gutter: stable;
}

/* =========================================================
   Recent Activity Cards
   ---------------------------------------------------------
   Primary dashboard activity feed. Titles remain stronger than
   Quick Links to preserve the desired visual hierarchy.
   ========================================================= */

.dashboard-recent-item[b-9j6q7i9axt] {
  margin-top: 1px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 14px;
  padding: 8px 12px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 14px;
  background: linear-gradient(180deg, #fff, #fbfdff);
  text-decoration: none;
  transition: transform 140ms ease, box-shadow 140ms ease, border-color 140ms ease;
}

  .dashboard-recent-item:hover[b-9j6q7i9axt] {
    transform: translateY(-1px);
    text-decoration: none;
    border-color: rgba(29, 58, 109, 0.16);
    box-shadow: 0 10px 20px rgba(15, 23, 42, 0.08);
  }

.dashboard-recent-item-main[b-9j6q7i9axt] {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.dashboard-recent-item-top[b-9j6q7i9axt] {
  min-width: 0;
  display: block;
  margin-bottom: 0;
}

.dashboard-recent-item-title[b-9j6q7i9axt] {
  display: block;
  max-width: 100%;
  color: var(--text-900);
  font-size: 14px;
  line-height: 1.25;
  font-weight: 700;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.dashboard-recent-item-tags[b-9j6q7i9axt] {
  min-width: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.dashboard-recent-item-meta[b-9j6q7i9axt] {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  color: var(--text-600);
  font-size: 13px;
}

.dashboard-meta-dot[b-9j6q7i9axt] {
  color: var(--text-500);
}

.dashboard-recent-item-side[b-9j6q7i9axt] {
  min-width: 142px;
  max-width: 172px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  text-align: right;
}

.dashboard-recent-item-updated[b-9j6q7i9axt] {
  color: var(--text-500);
  font-size: 12px;
  line-height: 1.25;
  white-space: nowrap;
}

/* =========================================================
   Dashboard Badges
   ---------------------------------------------------------
   Worksheet type, activity type, and workflow status badges
   used in Recent Activity cards.
   ========================================================= */

.dashboard-type-badge[b-9j6q7i9axt],
.dashboard-status-badge[b-9j6q7i9axt],
.dashboard-activity-type-badge[b-9j6q7i9axt] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 4px 10px;
  border-radius: 999px;
  line-height: 1;
  white-space: nowrap;
}

.dashboard-type-badge[b-9j6q7i9axt],
.dashboard-status-badge[b-9j6q7i9axt] {
  font-size: 11px;
  font-weight: 600;
}

.dashboard-type-badge[b-9j6q7i9axt] {
  min-width: 80px;
  background: rgba(148, 163, 184, 0.14);
  color: #475569;
}

.dashboard-status-badge[b-9j6q7i9axt] {
  min-width: 140px;
  background: rgba(148, 163, 184, 0.14);
  color: #475569;
}

.dashboard-activity-type-badge[b-9j6q7i9axt] {
  min-width: 80px;
  font-size: 11px;
  font-weight: 700;
}

.dashboard-type-badge--prepack[b-9j6q7i9axt] {
  background: rgba(63, 111, 159, 0.12);
  color: rgb(63, 111, 159);
  border: 1px solid rgba(63, 111, 159, 0.16);
}

.dashboard-type-badge--openstock[b-9j6q7i9axt] {
  background: rgba(142, 59, 103, 0.10);
  color: rgb(142, 59, 103);
  border: 1px solid rgba(142, 59, 103, 0.16);
}

.dashboard-type-badge--default[b-9j6q7i9axt],
.dashboard-activity-type-badge--default[b-9j6q7i9axt],
.dashboard-activity-type-badge--promotion[b-9j6q7i9axt],
.dashboard-status-draft[b-9j6q7i9axt] {
  background: rgba(148, 163, 184, 0.14);
  color: #475569;
}

.dashboard-activity-type-badge--pricing[b-9j6q7i9axt],
.dashboard-status-submitted[b-9j6q7i9axt],
.dashboard-status-released[b-9j6q7i9axt] {
  background: rgba(59, 130, 246, 0.14);
  color: #1d4ed8;
}

.dashboard-activity-type-badge--final-book[b-9j6q7i9axt] {
  background: rgba(16, 185, 129, 0.14);
  color: #047857;
}

.dashboard-status-revision[b-9j6q7i9axt] {
  background: #ffe4e6;
  color: #dc2626;
}

.dashboard-status-review[b-9j6q7i9axt] {
  background: rgba(245, 158, 11, 0.16);
  color: #b45309;
}

.dashboard-status-approved[b-9j6q7i9axt] {
  background: rgba(34, 197, 94, 0.16);
  color: #15803d;
}

/* =========================================================
   Quick Links
   ---------------------------------------------------------
   Secondary navigation panel. Link titles are intentionally
   softer than Recent Activity titles to avoid visual competition.
   ========================================================= */

.dashboard-quick-link-card[b-9j6q7i9axt] {
  display: block;
  padding: 7px 10px 8px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 12px;
  background: linear-gradient(180deg, #fff, #fbfdff);
  text-decoration: none;
  transition: transform 140ms ease, box-shadow 140ms ease, border-color 140ms ease;
}

  .dashboard-quick-link-card:hover[b-9j6q7i9axt] {
    transform: translateY(-1px);
    text-decoration: none;
    border-color: rgba(29, 58, 109, 0.16);
    box-shadow: 0 10px 20px rgba(15, 23, 42, 0.08);
  }

.dashboard-quick-link-group-title[b-9j6q7i9axt] {
  margin: 8px 0 -1px;
  padding: 4.5px 8px;
  border-radius: 7px;
  background: #f1f5f9;
  color: #8a95a3;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-align: center;
  text-transform: uppercase;
}

  .dashboard-quick-link-group-title:first-child[b-9j6q7i9axt] {
    margin-top: 2px;
  }

.dashboard-quick-link-title[b-9j6q7i9axt] {
  margin: 0 0 2px;
  color: #3f78a8;
  font-size: 14px;
  line-height: 1.15;
  font-weight: 600;
}

.dashboard-quick-link-description[b-9j6q7i9axt] {
  color: var(--text-600);
  font-size: 13px;
  line-height: 1.25;
}

/* =========================================================
   Empty and Limited States
   ---------------------------------------------------------
   Shared messages for dashboards with limited role access,
   empty activity, or missing Quick Links.
   ========================================================= */

.dashboard-limited-message[b-9j6q7i9axt],
.dashboard-empty-state[b-9j6q7i9axt] {
  padding: 18px 18px 16px;
  border: 1px dashed rgba(29, 58, 109, 0.20);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(29, 58, 109, 0.03), rgba(91, 196, 191, 0.03));
}

.dashboard-limited-message-title[b-9j6q7i9axt],
.dashboard-empty-state-title[b-9j6q7i9axt] {
  margin: 0;
  color: var(--text-900);
  font-size: 16px;
  font-weight: 700;
}

.dashboard-limited-message-text[b-9j6q7i9axt],
.dashboard-empty-state-text[b-9j6q7i9axt] {
  margin: 8px 0 0;
  color: var(--text-600);
  font-size: 13px;
  line-height: 1.55;
}

.dashboard-empty-state--compact[b-9j6q7i9axt] {
  padding: 14px 16px;
}

/* =========================================================
   Responsive Rules
   ---------------------------------------------------------
   Container queries are based on dashboard content width.
   This keeps behavior aligned when the sidebar is expanded,
   collapsed, or when the dashboard appears in a narrower role
   workspace.
   ========================================================= */

@container dashboard-page (max-width: 1000px) {
  .dashboard-main-grid[b-9j6q7i9axt] {
    grid-template-columns: 1fr;
    grid-auto-rows: max-content;
    align-items: start;
    align-content: start;
    gap: 10px;
    overflow-y: auto;
    overflow-x: hidden;
  }

  .dashboard-panel[b-9j6q7i9axt] {
    height: auto;
    min-height: 0;
    display: block;
  }

  .dashboard-panel-body[b-9j6q7i9axt] {
    display: block;
    min-height: 0;
    overflow: visible;
  }

  .dashboard-recent-list[b-9j6q7i9axt],
  .dashboard-quick-links[b-9j6q7i9axt] {
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
  }

  .dashboard-recent-item[b-9j6q7i9axt] {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .dashboard-recent-item-side[b-9j6q7i9axt] {
    min-width: 0;
    max-width: none;
    align-items: flex-start;
    gap: 6px;
    text-align: left;
  }

  .dashboard-recent-item-updated[b-9j6q7i9axt] {
    white-space: normal;
  }

  .dashboard-quick-link-description[b-9j6q7i9axt] {
    overflow-wrap: anywhere;
  }
}

@container dashboard-page (max-width: 980px) {
  .dashboard-hero-card[b-9j6q7i9axt] {
    flex-wrap: wrap;
  }

  .dashboard-hero-actions[b-9j6q7i9axt] {
    width: 100%;
    align-items: stretch;
    margin-left: 0;
  }

  .dashboard-cycle-calendar[b-9j6q7i9axt] {
    width: 100%;
    max-width: none;
    min-width: 0;
  }
}

@container dashboard-page (max-width: 960px) {
  .dashboard-stat-grid[b-9j6q7i9axt] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container dashboard-page (max-width: 640px) {
  .dashboard-shared[b-9j6q7i9axt] {
    gap: 8px;
    padding: 4px 2px 10px;
  }

  .dashboard-hero-card[b-9j6q7i9axt] {
    flex-direction: column;
    align-items: stretch;
    padding: 20px 18px 18px;
  }

  .dashboard-title[b-9j6q7i9axt] {
    font-size: 28px;
  }

  .dashboard-subtitle[b-9j6q7i9axt] {
    font-size: 14px;
  }

  .dashboard-hero-actions[b-9j6q7i9axt] {
    min-width: 0;
    width: 100%;
    align-items: stretch;
    margin-left: 0;
  }

  .dashboard-stat-grid[b-9j6q7i9axt] {
    grid-template-columns: 1fr;
  }

  .dashboard-cycle-calendar[b-9j6q7i9axt] {
    width: 100%;
    max-width: none;
    min-width: 0;
  }

  .dashboard-cycle-calendar-body[b-9j6q7i9axt] {
    grid-template-columns: 1fr;
  }

  .dashboard-cycle-calendar-cell + .dashboard-cycle-calendar-cell[b-9j6q7i9axt] {
    border-left: 0;
    border-top: 1px solid rgba(25, 35, 68, 0.08);
  }
}
/* /Components/Shared/Images/ImagePreviewModal.razor.rz.scp.css */
/* Reusable Full Image Preview Modal */

/* ---------------------------------------------------------
   Displays a single image above existing application and
   nested modal layers without changing page scroll behavior.
   --------------------------------------------------------- */

.image-preview-modal__backdrop[b-uwkznump2q] {
    position: fixed;
    inset: 0;
    z-index: 13000;
    background: rgba(15, 23, 42, 0.42);
}

.image-preview-modal__shell[b-uwkznump2q] {
    position: fixed;
    inset: 0;
    z-index: 13010;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px 24px;
    pointer-events: none;
}

.image-preview-modal__card[b-uwkznump2q] {
    width: min(640px, calc(100vw - 72px));
    max-height: calc(100vh - 72px);
    display: flex;
    flex-direction: column;
    pointer-events: auto;
    overflow: hidden;
    border: 1px solid rgba(25, 35, 68, 0.12);
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.20);
}

.image-preview-modal__header[b-uwkznump2q] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 18px 11px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.image-preview-modal__header-copy[b-uwkznump2q] {
    min-width: 0;
}

.image-preview-modal__title[b-uwkznump2q] {
    margin: 0;
    color: #17233f;
    font-size: 20px;
    font-weight: 750;
    line-height: 1.2;
}

.image-preview-modal__subtitle[b-uwkznump2q] {
    margin: 3px 0 0;
    overflow: hidden;
    color: #64748b;
    font-size: 12.5px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.image-preview-modal__close[b-uwkznump2q] {
    appearance: none;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #64748b;
    cursor: pointer;
    font-size: 28px;
    font-weight: 300;
    line-height: 1;
}

    .image-preview-modal__close:hover[b-uwkznump2q],
    .image-preview-modal__close:focus-visible[b-uwkznump2q] {
        background: #f1f5f9;
        color: #17233f;
        outline: none;
    }

.image-preview-modal__body[b-uwkznump2q] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
    overflow: auto;
    background: #ffffff;
}

.image-preview-modal__image[b-uwkznump2q] {
    display: block;
    max-width: 100%;
    max-height: min(50vh, 460px);
    object-fit: contain;
    border: 1px solid var(--border-300, rgba(25, 35, 68, 0.12));
    border-radius: 16px;
    background: var(--bg-surface, #ffffff);
    box-shadow: var(--shadow-1, 0 1px 4px rgba(15, 23, 42, 0.08));
}

.image-preview-modal__footer[b-uwkznump2q] {
    flex: 0 0 auto;
    display: flex;
    justify-content: flex-end;
    padding: 9px 18px 11px;
    border-top: 1px solid rgba(25, 35, 68, 0.08);
    background: #ffffff;
}

.image-preview-modal__footer-button[b-uwkznump2q] {
    min-width: 82px;
    min-height: 32px;
    padding: 5px 14px;
    border: 1px solid rgba(71, 85, 105, 0.42);
    border-radius: 7px;
    background: #ffffff;
    color: #334155;
    cursor: pointer;
    font-size: 13px;
    font-weight: 650;
}

    .image-preview-modal__footer-button:hover[b-uwkznump2q],
    .image-preview-modal__footer-button:focus-visible[b-uwkznump2q] {
        border-color: #2563eb;
        color: #1d4ed8;
        outline: none;
    }
/* /Components/Shared/Images/ImagePreviewTrigger.razor.rz.scp.css */
/* Reusable Image Preview Trigger */

/* ---------------------------------------------------------
   Displays a thumbnail, viewport-safe hover/focus preview,
   and a callback for opening the full image preview.
   --------------------------------------------------------- */

.image-preview-trigger[b-jf8ude6ju8] {
    appearance: none;
    position: relative;
    width: var(--image-preview-thumbnail-width);
    height: var(--image-preview-thumbnail-height);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
    overflow: visible;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    vertical-align: middle;
}

.image-preview-trigger__thumbnail-frame[b-jf8ude6ju8] {
    width: var(--image-preview-thumbnail-width);
    height: var(--image-preview-thumbnail-height);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid rgba(25, 35, 68, 0.12);
    border-radius: var(--image-preview-thumbnail-radius);
    background: #ffffff;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08);
    transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.image-preview-trigger__thumbnail[b-jf8ude6ju8] {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: var(--image-preview-thumbnail-fit);
}

.image-preview-trigger:hover .image-preview-trigger__thumbnail-frame[b-jf8ude6ju8],
.image-preview-trigger:focus-visible .image-preview-trigger__thumbnail-frame[b-jf8ude6ju8] {
    transform: translateY(-1px);
    border-color: rgba(37, 99, 235, 0.28);
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16);
}

.image-preview-trigger:focus-visible[b-jf8ude6ju8] {
    outline: none;
}

    .image-preview-trigger:focus-visible .image-preview-trigger__thumbnail-frame[b-jf8ude6ju8] {
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.16), 0 8px 18px rgba(15, 23, 42, 0.16);
    }

/* Fixed positioning prevents clipping inside modal bodies,
   table scroll regions, and overflow-hidden containers. */
.image-preview-trigger__hover-card[b-jf8ude6ju8] {
    position: fixed;
    z-index: 6900;
    box-sizing: border-box;
    /* The additional 18px accounts for 8px padding on both
       sides plus the 1px border on both sides. */
    left: clamp( 12px, var(--image-preview-hover-left), calc(100vw - var(--image-preview-hover-width) - 30px) );
    top: clamp( 12px, var(--image-preview-hover-top), calc(100vh - var(--image-preview-hover-height) - 30px) );
    width: min( calc(var(--image-preview-hover-width) + 18px), calc(100vw - 24px) );
    height: min( calc(var(--image-preview-hover-height) + 18px), calc(100vh - 24px) );
    padding: 8px;
    pointer-events: none;
    overflow: hidden;
    border: 1px solid rgba(25, 35, 68, 0.16);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
    animation: image-preview-trigger-fade-in-b-jf8ude6ju8 120ms ease-out;
}

.image-preview-trigger__hover-image[b-jf8ude6ju8] {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: var(--image-preview-hover-fit);
    border-radius: 11px;
    background: #f8fafc;
}

@keyframes image-preview-trigger-fade-in-b-jf8ude6ju8 {
    from {
        opacity: 0;
        transform: translateY(3px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .image-preview-trigger__thumbnail-frame[b-jf8ude6ju8],
    .image-preview-trigger__hover-card[b-jf8ude6ju8] {
        transition: none;
        animation: none;
    }
}
/* /Components/Shared/Notifications/NotificationBell.razor.rz.scp.css */
.notification-bell[b-z2or60tipz] {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.notification-bell-dismiss-layer[b-z2or60tipz] {
  position: fixed;
  inset: 0;
  z-index: 2090;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: default;
}

.notification-bell-trigger[b-z2or60tipz] {
  position: relative;
  border: 1px solid transparent;
  background: transparent;
  border-radius: .5rem;
  padding: .25rem .45rem;
  min-width: 34px;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-800, #1f2937);
}

  .notification-bell-trigger:hover[b-z2or60tipz] {
    background: rgba(0,0,0,.03);
    border-color: rgba(0,0,0,.08);
  }

  .notification-bell-trigger:focus-visible[b-z2or60tipz],
  .notification-bell-link:focus-visible[b-z2or60tipz],
  .notification-bell-item:focus-visible[b-z2or60tipz],
  .notification-bell-view-all:focus-visible[b-z2or60tipz] {
    outline: 2px solid rgba(13,110,253,.45);
    outline-offset: 2px;
  }

.notification-bell-count[b-z2or60tipz] {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: 999px;
  background: #dc2626;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 17px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(220, 38, 38, 0.28);
}

.notification-bell-panel[b-z2or60tipz] {
  position: absolute;
  right: 0;
  top: calc(100% + .45rem);
  width: 390px;
  max-width: calc(100vw - 32px);
  background: #fff;
  border: 1px solid var(--panel-border, rgba(15, 23, 42, 0.10));
  box-shadow: var(--panel-shadow, 0 18px 48px rgba(15, 23, 42, 0.18));
  border-radius: 14px;
  overflow: hidden;
  z-index: 2100;
}

.notification-bell-header[b-z2or60tipz] {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px 10px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  background: rgba(248, 250, 252, 0.82);
}

.notification-bell-title[b-z2or60tipz] {
  font-size: 15px;
  font-weight: 800;
  color: var(--text-900, #0f172a);
  line-height: 1.2;
}

.notification-bell-subtitle[b-z2or60tipz] {
  margin-top: 2px;
  font-size: 12px;
  color: var(--text-500, #64748b);
}

.notification-bell-link[b-z2or60tipz] {
  border: 0;
  background: transparent;
  padding: 2px 0;
  font-size: 12px;
  font-weight: 700;
  color: var(--link-600, #2563eb);
}

  .notification-bell-link:disabled[b-z2or60tipz] {
    opacity: 0.45;
    cursor: default;
  }

.notification-bell-list[b-z2or60tipz] {
  max-height: 360px;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.notification-bell-item[b-z2or60tipz] {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 11px 14px 11px 16px;
  border: 0;
  border-bottom: 1px solid rgba(15, 23, 42, 0.07);
  background: #fff;
  text-align: left;
  color: inherit;
}

  .notification-bell-item:hover[b-z2or60tipz] {
    background: rgba(37, 99, 235, 0.035);
  }

  .notification-bell-item.is-unread[b-z2or60tipz] {
    background: linear-gradient(90deg, rgba(37, 99, 235, 0.085), #fff 48%);
  }

    .notification-bell-item.is-unread[b-z2or60tipz]::before {
      content: "";
      position: absolute;
      left: 0;
      top: 18px;
      bottom: 18px;
      width: 3px;
      border-radius: 0 999px 999px 0;
      background: #2563eb;
    }

  .notification-bell-item.is-read[b-z2or60tipz] {
    background: #fff;
  }

    .notification-bell-item.is-read .notification-bell-item-title[b-z2or60tipz],
    .notification-bell-item.is-read .notification-bell-item-message[b-z2or60tipz] {
      color: var(--text-500, #64748b);
    }

    .notification-bell-item.is-read .notification-bell-item-title[b-z2or60tipz] {
      font-weight: 700;
    }

.notification-bell-item-top[b-z2or60tipz] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.notification-bell-item-status[b-z2or60tipz] {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  gap: 6px;
}

.notification-bell-unread-dot[b-z2or60tipz] {
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.10);
}

.notification-bell-chip[b-z2or60tipz] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 19px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.notification-category-action[b-z2or60tipz] {
  background: #fff1f2;
  color: #be123c;
  border: 1px solid rgba(244, 63, 94, 0.22);
}

.notification-category-review[b-z2or60tipz] {
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid rgba(249, 115, 22, 0.22);
}

.notification-category-deadline[b-z2or60tipz] {
  background: #fefce8;
  color: #a16207;
  border: 1px solid rgba(234, 179, 8, 0.26);
}

.notification-category-assignment[b-z2or60tipz] {
  background: #eef2ff;
  color: #4338ca;
  border: 1px solid rgba(99, 102, 241, 0.22);
}

.notification-category-system[b-z2or60tipz],
.notification-category-status[b-z2or60tipz] {
  background: #f1f5f9;
  color: #475569;
  border: 1px solid rgba(100, 116, 139, 0.18);
}

.notification-bell-time[b-z2or60tipz] {
  flex: 0 0 auto;
  font-size: 11px;
  color: var(--text-500, #64748b);
  white-space: nowrap;
}

.notification-bell-item-title[b-z2or60tipz] {
  font-size: 13px;
  font-weight: 800;
  color: var(--text-900, #0f172a);
  line-height: 1.25;
}

.notification-bell-item-message[b-z2or60tipz] {
  font-size: 12px;
  color: var(--text-600, #475569);
  line-height: 1.35;
}

.notification-bell-empty[b-z2or60tipz] {
  padding: 24px 16px;
  text-align: center;
  font-size: 13px;
  color: var(--text-500, #64748b);
}

.notification-bell-footer[b-z2or60tipz] {
  padding: 9px 12px;
  background: #f8fafc;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.notification-bell-view-all[b-z2or60tipz] {
  width: 100%;
  border: 1px solid rgba(37, 99, 235, 0.14);
  background: #fff;
  color: var(--link-600, #2563eb);
  border-radius: 9px;
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 800;
}

  .notification-bell-view-all:hover[b-z2or60tipz] {
    background: rgba(37, 99, 235, 0.04);
  }
/* /Components/Shared/Products/ProductsShared.razor.rz.scp.css */
/* ProductsShared.razor.css - Shared Products page styles */
/* ---------------------------------------------------------
   Scope:
   - Products page shell and workspace layout
   - Shared page header and All Products header
   - Action buttons
   - Summary stat cards
   - Products list card and toolbar
   - Table region, sticky header, and pager
   - Row presentation, pills, and action links
   - Upload placeholder and detail modal content
   - Shared modal shell and footer
   - Responsive layout behavior
   --------------------------------------------------------- */

/* Page shell */

.products-page[b-cfxv2ts9fs] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 2px;
    overflow: hidden;
    container-type: inline-size;
    container-name: products-page;
}

.products-workspace[b-cfxv2ts9fs] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow: hidden;
}

/* Section headers */

.products-main-header[b-cfxv2ts9fs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 12px 8px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.products-main-header-copy[b-cfxv2ts9fs] {
    min-width: 0;
    flex: 1 1 auto;
}

.products-main-header-actions[b-cfxv2ts9fs] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.products-header[b-cfxv2ts9fs] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.products-title[b-cfxv2ts9fs] {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    color: var(--text-900);
}

.products-subtitle[b-cfxv2ts9fs] {
    margin-top: 4px;
    color: var(--text-600);
    font-size: 13px;
    line-height: 1.45;
}

/* Page actions */

.products-primary-button[b-cfxv2ts9fs] {
    min-width: 150px;
    min-height: 30px;
    padding: 4px 16px;
    font-size: 14px;
    border-radius: 8px;
    font-weight: 600;
}

.products-secondary-button[b-cfxv2ts9fs] {
    min-width: 132px;
    min-height: 30px;
    border-radius: 8px;
    font-size: 14px;
    padding: 4px 16px;
    font-weight: 600;
}

/* Summary stat cards */
/* ---------------------------------------------------------
   Compact operational summary cards aligned with Dashboard,
   Books, Promotion Cycles, Promotions, and Promotion Pricing.
   --------------------------------------------------------- */

.products-stat-grid[b-cfxv2ts9fs] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.products-stat-card[b-cfxv2ts9fs] {
    min-width: 0;
    padding: 8px 10px;
    background: #fff;
    border: 1px solid var(--border-200, rgba(25, 35, 68, 0.12));
    border-radius: 13px;
    box-shadow: var(--shadow-1, 0 1px 4px rgba(15, 23, 42, 0.08));
}

.products-stat-label[b-cfxv2ts9fs] {
    margin: 0 0 6px;
    overflow: hidden;
    color: var(--text-600, #475569);
    font-size: 13.5px;
    line-height: 1.3;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.products-stat-value[b-cfxv2ts9fs] {
    margin: 0;
    color: var(--text-900, #0f172a);
    font-size: 21px;
    line-height: 1;
    font-weight: 800;
}

.products-stat-meta[b-cfxv2ts9fs] {
    margin-top: 5px;
    overflow: hidden;
    color: var(--text-500, #64748b);
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.products-accent-success[b-cfxv2ts9fs] {
    border-color: rgba(91, 196, 191, 0.38);
    background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.products-accent-warning[b-cfxv2ts9fs] {
    border-color: rgba(250, 169, 75, 0.32);
    background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

/* Interactive Product Stat Cards */
/* ---------------------------------------------------------
   Adds clickable summary-card behavior and selected states.
   Card dimensions and workspace height remain unchanged.
   --------------------------------------------------------- */

.products-stat-card-button[b-cfxv2ts9fs] {
    appearance: none;
    width: 100%;
    margin: 0;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

    .products-stat-card-button:hover[b-cfxv2ts9fs] {
        border-color: rgba(29, 58, 109, 0.22);
        box-shadow: 0 3px 10px rgba(15, 23, 42, 0.06);
    }

    .products-stat-card-button.is-active[b-cfxv2ts9fs] {
        border-color: rgba(37, 99, 235, 0.36);
        background: linear-gradient(180deg, rgba(37, 99, 235, 0.075), #ffffff);
        box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.05), 0 3px 10px rgba(15, 23, 42, 0.06);
    }

    .products-stat-card-button.products-accent-success.is-active[b-cfxv2ts9fs] {
        border-color: rgba(91, 196, 191, 0.5);
        background: linear-gradient(180deg, rgba(91, 196, 191, 0.11), #ffffff);
    }

    .products-stat-card-button.products-accent-warning.is-active[b-cfxv2ts9fs] {
        border-color: rgba(250, 169, 75, 0.46);
        background: linear-gradient(180deg, rgba(250, 169, 75, 0.11), #ffffff);
    }

    .products-stat-card-button:focus-visible[b-cfxv2ts9fs] {
        outline: none;
        box-shadow: var(--focus-ring, 0 0 0 3px rgba(37, 99, 235, 0.18));
    }

/* List card shell */

.products-list-card[b-cfxv2ts9fs] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--border-200);
    border-radius: 18px;
    overflow: hidden;
}

.products-side-card-header[b-cfxv2ts9fs] {
    padding: 16px 18px 12px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.products-panel-title[b-cfxv2ts9fs] {
    margin: 0;
    color: var(--text-900, #0f172a);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
}

.products-panel-subtitle[b-cfxv2ts9fs] {
    margin: 4px 0 0;
    color: var(--text-500, #64748b);
    font-size: 13px;
    line-height: 1.35;
}

.products-list-body[b-cfxv2ts9fs] {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    min-width: 0;
    margin-bottom: 0;
    padding: 0;
}

/* Toolbar / filters */

.products-toolbar[b-cfxv2ts9fs] {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(320px, 1fr) 190px 180px 108px;
    gap: 10px;
    align-items: end;
    padding: 14px 12px 10px;
}

.products-toolbar--with-distributor-context[b-cfxv2ts9fs] {
    grid-template-columns: minmax(280px, 1fr) 190px 190px 170px 108px;
}

.products-toolbar--with-distributor-setup[b-cfxv2ts9fs] {
    grid-template-columns: minmax(260px, 1fr) 180px 180px 150px 108px;
}

.products-toolbar-left[b-cfxv2ts9fs],
.products-toolbar-right[b-cfxv2ts9fs] {
    display: contents;
}

    .products-toolbar-left .products-control[b-cfxv2ts9fs],
    .products-toolbar-right .products-control[b-cfxv2ts9fs],
    .products-control[b-cfxv2ts9fs] {
        min-width: 0;
    }

.products-control-label[b-cfxv2ts9fs] {
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-700, #334155);
}

.products-search-input[b-cfxv2ts9fs],
.products-filter-select[b-cfxv2ts9fs] {
    width: 100%;
    min-height: 38px;
}

.products-filter-select[b-cfxv2ts9fs] {
    min-width: 0;
}

.products-manufacturer-searchable-select[b-cfxv2ts9fs],
.products-distributor-context-searchable-select[b-cfxv2ts9fs] {
    width: 100%;
    min-width: 0;
}

.products-control-page-size .products-filter-select[b-cfxv2ts9fs] {
    min-width: 108px;
}

.products-inline-error[b-cfxv2ts9fs] {
    margin: 12px 18px 0;
}

/* Distributor context information */
.products-control-label--with-info[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    gap: 20px;
}

.products-info-tooltip-trigger[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.products-info-icon[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    border: 1px solid rgba(37, 99, 235, 0.28);
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.06);
    color: #2563eb;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}

/* Table region / sticky pager structure */

.products-table-region[b-cfxv2ts9fs] {
    min-height: 0;
    height: 100%;
    margin: 0 12px 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
}

.products-table-scroll[b-cfxv2ts9fs] {
    min-height: 0;
    position: relative;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    background: #ffffff;
}

.products-table[b-cfxv2ts9fs] {
    width: 100%;
    margin: 0;
    min-width: 1140px;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.82rem;
}

    .products-table thead th[b-cfxv2ts9fs] {
        position: sticky;
        top: 0;
        z-index: 12;
        padding: 0.58rem 0.55rem;
        border-bottom: 0;
        background: #ffffff;
        color: #64748b;
        font-size: 0.7rem;
        font-weight: 850;
        letter-spacing: 0.035em;
        text-transform: uppercase;
        white-space: nowrap;
        box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
    }

    .products-table tbody td[b-cfxv2ts9fs] {
        padding: 0.56rem 0.55rem;
        vertical-align: middle;
        border-bottom: 1px solid #edf2f7;
        background: #ffffff;
        color: var(--text-900, #0f172a);
        font-size: 0.82rem;
        line-height: 1.35;
    }

    .products-table tbody tr:hover td[b-cfxv2ts9fs] {
        background: #fbfdff;
    }

    /* Align table content with the filter row and pager inset. */
    .products-table thead th:first-child[b-cfxv2ts9fs],
    .products-table tbody td:first-child[b-cfxv2ts9fs] {
        padding-left: 12px;
    }

    .products-table thead th:last-child[b-cfxv2ts9fs],
    .products-table tbody td:last-child[b-cfxv2ts9fs] {
        padding-right: 12px;
    }

/* Sortable headers / column sizing */

.products-sort-button[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    max-width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    cursor: pointer;
    white-space: nowrap;
}

    .products-sort-button:hover[b-cfxv2ts9fs],
    .products-sort-button--active[b-cfxv2ts9fs] {
        color: #2563eb;
    }

.products-sort-indicator[b-cfxv2ts9fs] {
    font-size: 0.72rem;
    line-height: 1;
}

/* Column sizing */
/* ---------------------------------------------------------
   Products table waits until 1060px before horizontal scroll.
   Description stays flexible while utility columns stay compact.
   --------------------------------------------------------- */

.products-col-image[b-cfxv2ts9fs] {
    width: 82px;
    min-width: 82px;
}

.products-col-item[b-cfxv2ts9fs] {
    width: 88px;
    min-width: 88px;
}

.products-col-description[b-cfxv2ts9fs] {
    width: auto;
    min-width: 300px;
}

.products-col-upc[b-cfxv2ts9fs] {
    width: 132px;
    min-width: 132px;
}

.products-col-manufacturer[b-cfxv2ts9fs],
.products-col-line[b-cfxv2ts9fs] {
    width: 132px;
    min-width: 132px;
}

.products-col-status[b-cfxv2ts9fs] {
    width: 108px;
    min-width: 108px;
}

.products-col-assets[b-cfxv2ts9fs] {
    width: 92px;
    min-width: 92px;
    max-width: 92px;
}

.products-col-actions[b-cfxv2ts9fs] {
    width: 206px;
    min-width: 206px;
    max-width: 206px;
}

/* Distributor Product Settings Columns */
/* ---------------------------------------------------------
   Adds compact distributor-specific indicators only when a
   role page enables distributor setting columns. The base
   table min-width stays unchanged; Distributor rows reduce
   utility columns because only View and Settings are shown.
   --------------------------------------------------------- */

.products-table--distributor-settings[b-cfxv2ts9fs] {
    min-width: 1140px;
}

    /* Distributor table width compression */
    .products-table--distributor-settings .products-col-image[b-cfxv2ts9fs] {
        width: 72px;
        min-width: 72px;
    }

    .products-table--distributor-settings .products-col-item[b-cfxv2ts9fs] {
        width: 76px;
        min-width: 76px;
    }

    .products-table--distributor-settings .products-col-description[b-cfxv2ts9fs] {
        width: 200px;
        min-width: 200px;
    }

    .products-table--distributor-settings .products-col-upc[b-cfxv2ts9fs] {
        width: 108px;
        min-width: 108px;
    }

    .products-table--distributor-settings .products-col-manufacturer[b-cfxv2ts9fs],
    .products-table--distributor-settings .products-col-line[b-cfxv2ts9fs] {
        width: 120px;
        min-width: 120px;
    }

    .products-table--distributor-settings .products-col-status[b-cfxv2ts9fs] {
        width: 94px;
        min-width: 94px;
    }

    .products-table--distributor-settings .products-col-assets[b-cfxv2ts9fs] {
        width: 82px;
        min-width: 82px;
        max-width: 82px;
    }

    .products-table--distributor-settings .products-col-actions[b-cfxv2ts9fs],
    .products-table--distributor-settings td:last-child[b-cfxv2ts9fs] {
        width: 112px;
        min-width: 112px;
        max-width: 112px;
        padding-left: 0.34rem;
        padding-right: 0.34rem;
    }

    .products-table--distributor-settings .products-row-actions[b-cfxv2ts9fs] {
        min-height: 27px;
        padding: 0 3px;
    }

    .products-table--distributor-settings .products-action-sep[b-cfxv2ts9fs] {
        margin: 0 2px;
    }

    .products-table--distributor-settings .products-link-action[b-cfxv2ts9fs] {
        font-size: 10.8px;
    }

.products-col-dist-item[b-cfxv2ts9fs] {
    width: 92px;
    min-width: 92px;
}

.products-col-pricing-default[b-cfxv2ts9fs] {
    width: 86px;
    min-width: 86px;
}

.products-dist-item-text[b-cfxv2ts9fs] {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.products-distributor-default-badge[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    min-width: 74px;
    max-width: 96px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.products-distributor-default-badge--participates[b-cfxv2ts9fs] {
    border: 1px solid rgba(91, 196, 191, 0.28);
    background: rgba(91, 196, 191, 0.16);
    color: #206a66;
}

.products-distributor-default-badge--opted-out[b-cfxv2ts9fs] {
    border: 1px solid rgba(241, 95, 87, 0.24);
    background: rgba(241, 95, 87, 0.13);
    color: #9d423c;
}

.products-distributor-default-badge--needs-setup[b-cfxv2ts9fs] {
    border: 1px solid rgba(250, 169, 75, 0.26);
    background: rgba(250, 169, 75, 0.14);
    color: #9a5a12;
}

/* Actions column is pinned to the right edge of the table scroll viewport.
   The sticky cell stays neutral; the inner action zone owns emphasis. */
.products-table th.products-col-actions[b-cfxv2ts9fs],
.products-table td:last-child[b-cfxv2ts9fs] {
    position: sticky;
    right: 0;
    z-index: 10;
    padding-left: 0.64rem;
    padding-right: 0.64rem;
    text-align: left;
    white-space: nowrap;
    background: #ffffff;
    background-clip: padding-box;
    box-shadow: none;
}

.products-table thead th.products-col-actions[b-cfxv2ts9fs] {
    z-index: 18;
    background: #ffffff;
    color: #64748b;
    box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
}

.products-table tbody tr:hover td:last-child[b-cfxv2ts9fs] {
    background: #fbfdff;
}

/* Admin Product Catalog Width Balance */
/* ---------------------------------------------------------
   Reduces the Admin product description column when no
   Distributor Context is selected so Status, Assets, and
   Actions keep enough desktop table width.
   --------------------------------------------------------- */

.products-table--admin:not(.products-table--distributor-settings)[b-cfxv2ts9fs] {
    min-width: 1060px;
}

    .products-table--admin:not(.products-table--distributor-settings) .products-col-description[b-cfxv2ts9fs] {
        width: 240px;
        min-width: 240px;
    }

    .products-table--admin:not(.products-table--distributor-settings) .products-col-upc[b-cfxv2ts9fs] {
        width: 126px;
        min-width: 126px;
    }

    .products-table--admin:not(.products-table--distributor-settings) .products-col-manufacturer[b-cfxv2ts9fs] {
        width: 120px;
        min-width: 120px;
    }

    .products-table--admin:not(.products-table--distributor-settings) .products-col-status[b-cfxv2ts9fs] {
        width: 100px;
        min-width: 100px;
    }

    .products-table--admin:not(.products-table--distributor-settings) .products-col-assets[b-cfxv2ts9fs] {
        width: 96px;
        min-width: 96px;
        max-width: 96px;
    }

/* Admin Product Actions Layout */
/* ---------------------------------------------------------
   Splits Admin product actions into two compact rows so the
   sticky Actions column can stay narrow while keeping every
   action visible for desktop product management.
   --------------------------------------------------------- */

.products-table--admin .products-col-actions[b-cfxv2ts9fs],
.products-table--admin td:last-child[b-cfxv2ts9fs] {
    width: 142px;
    min-width: 142px;
    max-width: 142px;
    padding-left: 0.36rem;
    padding-right: 0.36rem;
}

.products-row-actions--admin-stacked[b-cfxv2ts9fs] {
    min-height: 42px;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 2px;
    padding: 4px 5px;
    white-space: normal;
}

.products-row-action-line[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 16px;
    gap: 0;
    white-space: nowrap;
}

.products-row-action-line--secondary[b-cfxv2ts9fs] {
    opacity: 0.98;
}

.products-row-actions--admin-stacked .products-action-sep[b-cfxv2ts9fs] {
    margin: 0 3px;
}

.products-row-actions--admin-stacked .products-link-action[b-cfxv2ts9fs] {
    font-size: 11px;
    line-height: 1.12;
}

/* Row content / pills / links */

.products-cell-strong[b-cfxv2ts9fs] {
    color: var(--text-900, #0f172a);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
}


.products-table-tooltip-cell[b-cfxv2ts9fs] {
    position: relative;
    min-width: 0;
    max-width: 100%;
    display: block;
}

.products-description-primary[b-cfxv2ts9fs] {
    color: var(--text-900, #0f172a);
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.3;
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Keep tooltip-wrapped table text constrained inside its own cell.
   Required because CustomTooltip renders the trigger from a child component. */
[b-cfxv2ts9fs] .products-table-tooltip-cell.custom-tooltip-trigger {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-align: left;
}

.products-table td.products-col-description[b-cfxv2ts9fs] {
    min-width: 0;
    overflow: hidden;
}

.products-table td.products-col-upc[b-cfxv2ts9fs] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.products-manufacturer-text[b-cfxv2ts9fs] {
    display: -webkit-box;
    max-width: 100%;
    overflow: hidden;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: normal;
    overflow-wrap: anywhere;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.products-table td.products-col-item[b-cfxv2ts9fs],
.products-table td.products-col-upc[b-cfxv2ts9fs],
.products-table td.products-col-manufacturer[b-cfxv2ts9fs],
.products-table td.products-col-line[b-cfxv2ts9fs] {
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.25;
}

.products-table td.products-col-item[b-cfxv2ts9fs] {
    font-weight: 600;
}

.products-table td.products-col-assets[b-cfxv2ts9fs] {
    text-align: left;
}

/* Product image display */

.products-image-empty[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 56px;
    height: 26px;
    padding: 0 5px;
    border-radius: 999px;
    border: 1px solid var(--border-300);
    background: var(--bg-subtle);
    color: var(--text-500);
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.products-status-badge[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    min-width: 88px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.products-status-badge--active[b-cfxv2ts9fs] {
    background: rgba(91, 196, 191, 0.18);
    color: #206a66;
}

.products-status-badge--warning[b-cfxv2ts9fs] {
    background: rgba(250, 169, 75, 0.2);
    color: #9a5a12;
}

.products-status-badge--inactive[b-cfxv2ts9fs] {
    background: rgba(241, 95, 87, 0.14);
    color: #9d423c;
}

.products-assets-count-badge[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    min-width: 74px;
    max-width: 82px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.products-assets-count-badge--has-assets[b-cfxv2ts9fs] {
    border: 1px solid rgba(37, 99, 235, 0.18);
    background: rgba(37, 99, 235, 0.08);
    color: #1d4ed8;
}

.products-assets-count-badge--empty[b-cfxv2ts9fs] {
    border: 1px solid rgba(148, 163, 184, 0.24);
    background: rgba(148, 163, 184, 0.1);
    color: #64748b;
}

.products-row-actions[b-cfxv2ts9fs] {
    width: 100%;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 5px 5px;
    border-radius: 7px;
    background: #f3f6fb;
    box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.82);
    flex-wrap: nowrap;
    white-space: nowrap;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.products-action-sep[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 4px;
    color: rgba(100, 116, 139, 0.62);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    pointer-events: none;
    user-select: none;
}

.products-table tbody tr:hover .products-row-actions[b-cfxv2ts9fs] {
    background: #edf4ff;
    box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.68);
}

.products-link-action[b-cfxv2ts9fs] {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--link-600, #2563eb);
    cursor: pointer;
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
}

    .products-link-action:hover[b-cfxv2ts9fs] {
        color: #1d4ed8;
        text-decoration: underline;
        text-underline-offset: 2px;
    }

.products-link-action-danger[b-cfxv2ts9fs] {
    color: #dc2626;
}

.products-row-inactive[b-cfxv2ts9fs] {
    opacity: 0.72;
}

/* Pager */

.products-pager[b-cfxv2ts9fs] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 6px 14px 4px;
    background: #f8fafc;
    border-top: 1px solid rgba(25, 35, 68, 0.06);
    flex-wrap: wrap;
}

.products-pager-meta[b-cfxv2ts9fs] {
    font-size: 12px;
    color: var(--text-600);
}

.products-pager-actions[b-cfxv2ts9fs] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.products-pager-page[b-cfxv2ts9fs] {
    min-width: 88px;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-700, #334155);
}

/* Side card body / upload placeholder */

.products-side-card-body[b-cfxv2ts9fs] {
    padding: 16px 18px 18px;
}

.products-upload-placeholder[b-cfxv2ts9fs] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.products-upload-placeholder-title[b-cfxv2ts9fs] {
    font-size: 16px;
    font-weight: 700;
    color: var(--text-900);
}

.products-upload-placeholder-text[b-cfxv2ts9fs] {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--text-600);
}

.products-upload-placeholder-box[b-cfxv2ts9fs] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 140px;
    padding: 18px;
    border: 1px dashed rgba(29, 58, 109, 0.22);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(29, 58, 109, 0.03), rgba(91, 196, 191, 0.03));
    color: var(--text-600);
    text-align: center;
}

/* Empty states / detail display */

.products-empty-state[b-cfxv2ts9fs] {
    padding: 18px 18px 16px;
    border-radius: 0;
    background: transparent;
}

.products-empty-state-title[b-cfxv2ts9fs] {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: var(--text-900);
}

.products-empty-state-text[b-cfxv2ts9fs] {
    margin: 8px 0 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--text-600);
}

.products-detail-grid[b-cfxv2ts9fs] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 16px;
}

.products-detail-item--full[b-cfxv2ts9fs] {
    grid-column: 1 / -1;
}

.products-detail-label[b-cfxv2ts9fs] {
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--text-500);
}

.products-detail-value[b-cfxv2ts9fs] {
    font-size: 14px;
    line-height: 1.45;
    color: var(--text-900);
    word-break: break-word;
}

/* Audit section in product detail modal */

/* Full-width section header to visually separate audit metadata
   from the main product detail fields above it. */
.products-detail-section-title[b-cfxv2ts9fs] {
    grid-column: 1 / -1;
    margin-top: 6px;
    padding-top: 14px;
    border-top: 1px solid rgba(25, 35, 68, 0.08);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--text-600);
}

/* Slight visual treatment so audit rows feel grouped without
   making them look like a different component. */
.products-detail-item--audit[b-cfxv2ts9fs] {
    padding-top: 2px;
}

    /* Audit values use denser styling for support and traceability metadata. */
    .products-detail-item--audit .products-detail-value[b-cfxv2ts9fs] {
        font-size: 13px;
        line-height: 1.45;
        color: var(--text-800);
    }

/* Compact Product Details modal */
/* ---------------------------------------------------------
   Dense read-only layout for Product Master details.
   Keeps Add/Edit Product modal styling separate.
   --------------------------------------------------------- */

.products-modal-shell--detail .products-modal-body[b-cfxv2ts9fs] {
    padding: 12px 18px 10px;
}

.products-modal-shell--detail .products-modal-footer[b-cfxv2ts9fs] {
    padding: 9px 18px 11px;
}

.products-modal-shell--detail .products-detail-grid[b-cfxv2ts9fs] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px 18px;
    align-items: start;
}

.products-modal-shell--detail .products-detail-item--full[b-cfxv2ts9fs] {
    grid-column: span 2;
}

.products-modal-shell--detail .products-detail-section-title[b-cfxv2ts9fs] {
    grid-column: 1 / -1;
    margin-top: 2px;
    padding-top: 8px;
    font-size: 11.5px;
    line-height: 1.1;
    letter-spacing: 0.045em;
}

.products-modal-shell--detail .products-detail-label[b-cfxv2ts9fs] {
    margin-bottom: 2px;
    font-size: 11px;
    line-height: 1.1;
    letter-spacing: 0.045em;
}

.products-modal-shell--detail .products-detail-value[b-cfxv2ts9fs] {
    font-size: 13px;
    line-height: 1.25;
}

.products-modal-shell--detail .products-detail-item--audit[b-cfxv2ts9fs] {
    padding-top: 0;
}

    .products-modal-shell--detail .products-detail-item--audit .products-detail-value[b-cfxv2ts9fs] {
        font-size: 12.5px;
        line-height: 1.25;
    }

.products-modal-shell--detail .btn[b-cfxv2ts9fs] {
    min-height: 30px;
    padding: 4px 13px;
    font-size: 13px;
    border-radius: 7px;
}

/* Editor image preview */

.products-editor-image-preview-wrap[b-cfxv2ts9fs] {
    width: 96px;
    height: 96px;
    flex: 0 0 auto;
}

/* Shared modal shell */

.products-modal-backdrop[b-cfxv2ts9fs] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.42);
    z-index: 1040;
}

.products-modal-shell[b-cfxv2ts9fs] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 24px;
}

.products-modal-card[b-cfxv2ts9fs] {
    width: min(980px, 100%);
    max-height: calc(100vh - 28px);
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--border-200);
    border-radius: 20px;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.2);
    overflow: hidden;
}

[b-cfxv2ts9fs] .products-editor-form {
    min-height: 0;
    display: block;
    overflow: visible;
}

.products-modal-header[b-cfxv2ts9fs] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 20px 14px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.products-modal-title[b-cfxv2ts9fs] {
    margin: 0;
    font-size: 24px;
    font-weight: 700;
    color: var(--text-900);
}

.products-modal-subtitle[b-cfxv2ts9fs] {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--text-500);
}

.products-modal-body[b-cfxv2ts9fs] {
    flex: 1 1 auto;
    min-height: 0;
    padding: 18px 20px;
    overflow-y: auto;
    overflow-x: hidden;
}

.products-modal-footer[b-cfxv2ts9fs] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 14px 20px 18px;
    border-top: 1px solid rgba(25, 35, 68, 0.07);
    background: #fff;
}


/* Compact Add/Edit Product modal */
/* ---------------------------------------------------------
   Dense Product Master editor layout for desktop use.
   Uses explicit editor modal classes instead of :has(...) so
   the modal height follows content and does not create extra
   blank space above the footer.
   --------------------------------------------------------- */


.products-modal-card--editor .products-modal-header[b-cfxv2ts9fs] {
    padding: 10px 18px 8px;
}











.products-modal-card--editor .row[b-cfxv2ts9fs] {
    --bs-gutter-x: 0.75rem;
    --bs-gutter-y: 0.32rem;
}





.products-modal-card--editor textarea.form-control[b-cfxv2ts9fs] {
    min-height: 42px;
    max-height: 58px;
    resize: vertical;
}

.products-modal-card--editor .products-editor-section-title[b-cfxv2ts9fs] {
    margin-top: 0;
    padding: 10px 0 5px 0;
    font-size: 10.8px;
    line-height: 1.05;
    letter-spacing: 0.045em;
}

.products-modal-card--editor .mb-3[b-cfxv2ts9fs] {
    margin-bottom: 0 !important;
}

.products-modal-card--editor .border.rounded.p-3[b-cfxv2ts9fs] {
    padding: 5px 8px !important;
}

.products-modal-card--editor .d-flex.flex-column.flex-md-row.gap-3[b-cfxv2ts9fs] {
    gap: 8px !important;
}

.products-modal-card--editor .products-editor-image-preview-wrap[b-cfxv2ts9fs] {
    width: 48px;
    height: 48px;
}

.products-modal-card--editor .products-editor-image-empty[b-cfxv2ts9fs] {
    width: 48px;
    height: 48px;
    padding: 4px;
    border-radius: 8px;
    font-size: 11px;
}

.products-modal-card--editor .InputFile[b-cfxv2ts9fs],
.products-modal-card--editor input[type="file"][b-cfxv2ts9fs] {
    min-height: 30px;
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 12.5px;
}







.products-modal-shell--detail .products-detail-item--image-assets[b-cfxv2ts9fs] {
    grid-column: 1 / -1;
}

/* Product editor composite fields: Pallet Pattern and Case Dimensions. */
.products-pattern-field[b-cfxv2ts9fs] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 6px;
}

.products-pattern-field__input[b-cfxv2ts9fs] {
    min-width: 0;
}

.products-pattern-field__input--left[b-cfxv2ts9fs] {
    text-align: right;
}

.products-pattern-field__separator[b-cfxv2ts9fs] {
    color: var(--text-600);
    font-weight: 600;
    line-height: 1;
}

.products-dimensions-field[b-cfxv2ts9fs] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 6px;
}

.products-dimensions-field__input[b-cfxv2ts9fs] {
    min-width: 0;
}

.products-dimensions-field__input--left[b-cfxv2ts9fs] {
    text-align: right;
}

.products-dimensions-field__input--middle[b-cfxv2ts9fs] {
    text-align: center;
}

.products-dimensions-field__separator[b-cfxv2ts9fs] {
    color: var(--text-600);
    font-weight: 600;
    line-height: 1;
}

/* Product Details Image Assets table */
/* ---------------------------------------------------------
   Read-only asset table aligned with the Book Assets modal.
   --------------------------------------------------------- */

.products-image-assets-empty[b-cfxv2ts9fs] {
    width: 100%;
    padding: 12px 14px;
    border: 1px dashed rgba(100, 116, 139, 0.28);
    border-radius: 12px;
    background: #f8fafc;
    color: var(--text-500, #64748b);
    font-size: 13px;
}

.products-image-assets-table-shell[b-cfxv2ts9fs] {
    width: 100%;
    min-height: 0;
    max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #ffffff;
    padding-top: 0;
}

.products-image-assets-table[b-cfxv2ts9fs] {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

    .products-image-assets-table thead[b-cfxv2ts9fs] {
        position: sticky;
        top: 0;
        z-index: 8;
        background: #f8fafc;
    }

        .products-image-assets-table thead tr[b-cfxv2ts9fs] {
            background: #f8fafc;
        }







    .products-image-assets-table .products-editor-assets-col-upc[b-cfxv2ts9fs] {
        width: 118px;
    }

    .products-image-assets-table .products-editor-assets-col-title[b-cfxv2ts9fs] {
        width: auto;
    }












.products-image-assets-primary-badge[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    padding: 2px 9px;
    border: 1px solid rgba(91, 196, 191, 0.22);
    border-radius: 999px;
    background: rgba(91, 196, 191, 0.12);
    color: #206a66;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.products-image-assets-table td.products-editor-assets-col-title[b-cfxv2ts9fs],
.products-image-assets-table td:nth-child(4)[b-cfxv2ts9fs] {
    min-width: 0;
    overflow: hidden;
    max-width: 0;
}

/* Product Details enterprise view layout */
/* ---------------------------------------------------------
   Product-level details and audit are grouped in one card.
   Image Assets is presented as a separate review table card.
   --------------------------------------------------------- */


.products-detail-card[b-cfxv2ts9fs],
.products-detail-image-assets-card[b-cfxv2ts9fs] {
    min-width: 0;
    border: 1px solid rgba(25, 35, 68, 0.1);
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}


.products-detail-section-title--profile[b-cfxv2ts9fs] {
    margin: 0;
    padding: 0;
    border: 0;
    color: #475569;
    font-size: 11px;
    font-weight: 850;
    line-height: 1.1;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}


.products-detail-summary-image[b-cfxv2ts9fs] {
    width: 62px;
    height: 62px;
}

.products-detail-summary-empty[b-cfxv2ts9fs] {
    width: 62px;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(25, 35, 68, 0.1);
    border-radius: 10px;
    background: #ffffff;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 650;
    line-height: 1.2;
    text-align: center;
}

.products-detail-summary-main[b-cfxv2ts9fs] {
    min-width: 0;
}


.products-detail-field-grid--unified[b-cfxv2ts9fs] {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.products-detail-field-grid .products-detail-item[b-cfxv2ts9fs] {
    min-width: 0;
}

.products-detail-field-grid .products-detail-label[b-cfxv2ts9fs] {
    margin-bottom: 3px;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 750;
    line-height: 1.1;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.products-detail-field-grid .products-detail-value[b-cfxv2ts9fs] {
    min-width: 0;
    overflow: hidden;
    color: #17233f;
    font-size: 12.6px;
    font-weight: 500;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.products-detail-field-grid .products-detail-value--clip[b-cfxv2ts9fs] {
    display: block;
    width: 100%;
}

[b-cfxv2ts9fs] .products-detail-value-tooltip-wrap {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}


.products-detail-audit-grid div[b-cfxv2ts9fs] {
    min-width: 0;
}






.products-detail-section-title--assets[b-cfxv2ts9fs] {
    margin: 0;
    padding: 0;
    border: 0;
    color: #475569;
    font-size: 11px;
    font-weight: 850;
    line-height: 1.1;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}


.products-modal-body--detail .products-detail-item--image-assets[b-cfxv2ts9fs] {
    margin-top: 0;
}


/* Product image asset editor preview */
/* ---------------------------------------------------------
   Compact current image panel used by the Final Book Image
   Asset add/edit modal.
   --------------------------------------------------------- */

.products-image-editor-current-panel[b-cfxv2ts9fs] {
    padding: 14px 16px;
    border: 1px solid rgba(25, 35, 68, 0.12);
    border-radius: 14px;
    background: #f8fafc;
}

.products-image-editor-current-heading[b-cfxv2ts9fs] {
    margin-bottom: 10px;
    color: #17233f;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
}

.products-image-editor-current-layout[b-cfxv2ts9fs] {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
}

.products-image-editor-current-preview[b-cfxv2ts9fs] {
    width: 150px;
    min-width: 150px;
}

.products-image-editor-current-empty[b-cfxv2ts9fs] {
    width: 150px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 8px;
    border: 1px solid rgba(25, 35, 68, 0.1);
    border-radius: 12px;
    background: #ffffff;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.products-image-editor-current-content[b-cfxv2ts9fs] {
    min-width: 0;
}

.products-image-editor-current-title[b-cfxv2ts9fs] {
    color: #17233f;
    font-size: 13.5px;
    font-weight: 800;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.products-image-editor-current-meta[b-cfxv2ts9fs] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 5px;
    color: #475569;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.25;
}

.products-image-editor-current-upload[b-cfxv2ts9fs] {
    max-width: 560px;
    margin-top: 14px;
}

.products-image-editor-current-help[b-cfxv2ts9fs] {
    margin-top: 6px;
    color: #64748b;
    font-size: 12px;
    line-height: 1.25;
}

.products-image-editor-current-selected[b-cfxv2ts9fs] {
    margin-top: 4px;
    color: #17233f;
    font-size: 12px;
    line-height: 1.25;
}

/* Product media editor */
/* ---------------------------------------------------------
   Side-by-side media area in the Add/Edit Product modal.
   Primary Product Image supports catalog display. Final Book
   Image Assets supports UPC-specific, seasonal, and promotional
   image options.
   --------------------------------------------------------- */


.products-editor-primary-image-main[b-cfxv2ts9fs] {
    min-width: 0;
}

.products-editor-file-row[b-cfxv2ts9fs] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    margin-bottom: 4px;
}


/* Product editor enterprise layout */
/* ---------------------------------------------------------
   Desktop-first Add/Edit Product modal layout. Compresses
   product master fields into a fixed grid, gives the Primary
   Product Image a dedicated full-width row, and gives Final
   Book Image Assets a table with internal scrolling.
   --------------------------------------------------------- */


.products-modal-header--editor[b-cfxv2ts9fs] {
    flex: 0 0 auto;
    align-items: center;
    padding: 12px 18px 10px;
}

.products-modal-header-copy[b-cfxv2ts9fs] {
    min-width: 0;
}

.products-editor-header-actions[b-cfxv2ts9fs] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
}

.products-editor-active-toggle[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: var(--text-700, #334155);
    font-size: 12.5px;
    font-weight: 700;
    white-space: nowrap;
}

.products-editor-active-toggle-input[b-cfxv2ts9fs] {
    width: 16px;
    height: 16px;
    margin: 0;
}

.products-editor-header-divider[b-cfxv2ts9fs] {
    width: 1px;
    height: 20px;
    background: rgba(25, 35, 68, 0.14);
}

.products-modal-card--editor .products-modal-title[b-cfxv2ts9fs] {
    font-size: 20px;
    line-height: 1.1;
}

.products-modal-card--editor .products-modal-subtitle[b-cfxv2ts9fs] {
    margin-top: 2px;
    font-size: 12px;
    line-height: 1.2;
}

.products-modal-card--editor .products-modal-body[b-cfxv2ts9fs],
.products-modal-body--editor[b-cfxv2ts9fs] {
    flex: 1 1 auto;
    max-height: calc(100vh - 148px);
    padding: 8px 18px 6px;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
}

.products-modal-card--editor .products-modal-footer[b-cfxv2ts9fs] {
    flex: 0 0 auto;
    padding: 9px 18px 10px;
}

.products-modal-card--editor[b-cfxv2ts9fs]  .products-editor-form {
    display: flex;
    min-height: 0;
    overflow: hidden;
    flex-direction: column;
}


/* Product editor compact field grid */
/* ---------------------------------------------------------
   Uses a 12-column desktop grid so short product master fields
   can share rows. This keeps Product Media and Final Book Image
   Assets visible without forcing unnecessary modal scrolling.
   --------------------------------------------------------- */

.products-editor-grid[b-cfxv2ts9fs] {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: 10px;
    row-gap: 6px;
    padding-bottom: 7px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.products-editor-field[b-cfxv2ts9fs] {
    min-width: 0;
}

.products-editor-field--span-1[b-cfxv2ts9fs] {
    grid-column: span 1;
}

.products-editor-field--span-2[b-cfxv2ts9fs] {
    grid-column: span 2;
}

.products-editor-field--span-3[b-cfxv2ts9fs] {
    grid-column: span 3;
}

.products-editor-field--span-4[b-cfxv2ts9fs] {
    grid-column: span 4;
}

.products-editor-field--span-5[b-cfxv2ts9fs] {
    grid-column: span 5;
}

.products-editor-field--span-6[b-cfxv2ts9fs] {
    grid-column: span 6;
}

.products-editor-field--span-8[b-cfxv2ts9fs] {
    grid-column: span 8;
}

.products-editor-field--span-12[b-cfxv2ts9fs] {
    grid-column: 1 / -1;
}

.products-modal-card--editor .form-label[b-cfxv2ts9fs] {
    margin-bottom: 2px;
    font-size: 11.5px;
    line-height: 1.1;
    font-weight: 700;
    color: #334155;
}

.products-modal-card--editor .form-control[b-cfxv2ts9fs],
.products-modal-card--editor .form-select[b-cfxv2ts9fs] {
    min-height: 29px;
    padding: 3px 9px;
    font-size: 13px;
    line-height: 1.18;
    border-radius: 7px;
}

.products-modal-card--editor input[type="file"][b-cfxv2ts9fs] {
    min-height: 30px;
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 12.5px;
}

.products-modal-card--editor .validation-message[b-cfxv2ts9fs] {
    margin-top: 2px;
    font-size: 10.5px;
    line-height: 1.1;
}

.products-modal-card--editor .alert[b-cfxv2ts9fs] {
    margin-bottom: 8px;
    padding: 7px 10px;
    font-size: 12.5px;
}

.products-modal-card--editor .small[b-cfxv2ts9fs] {
    font-size: 11px;
    line-height: 1.25;
}

.products-modal-card--editor .btn[b-cfxv2ts9fs] {
    min-height: 30px;
    padding: 4px 13px;
    font-size: 13px;
    border-radius: 7px;
}

/* Product editor primary image panel */
/* ---------------------------------------------------------
   Primary Product Image is kept separate from Final Book
   Image Assets so catalog imagery and Final Book imagery are
   visually distinct.
   --------------------------------------------------------- */

.products-editor-primary-panel[b-cfxv2ts9fs] {
    min-width: 0;
    padding: 9px 11px;
    border: 1px solid rgba(25, 35, 68, 0.1);
    border-radius: 11px;
    background: #ffffff;
}


.products-editor-media-title[b-cfxv2ts9fs],
.products-editor-assets-title[b-cfxv2ts9fs] {
    color: var(--text-900, #0f172a);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.15;
}

.products-editor-media-subtitle[b-cfxv2ts9fs],
.products-editor-assets-subtitle[b-cfxv2ts9fs] {
    margin-top: 2px;
    color: var(--text-500, #64748b);
    font-size: 11.5px;
    line-height: 1.25;
}


.products-editor-image-preview-wrap--primary[b-cfxv2ts9fs],
.products-editor-image-empty--primary[b-cfxv2ts9fs] {
    width: 58px;
    height: 58px;
}

.products-editor-image-empty--primary[b-cfxv2ts9fs] {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(25, 35, 68, 0.1);
    border-radius: 8px;
    background: #ffffff;
    color: var(--text-500, #64748b);
    font-size: 11px;
    font-weight: 700;
    text-align: center;
}

/* Product editor primary image file row */
/* ---------------------------------------------------------
   Keeps upload control and file metadata in one compact row.
   Guidance and selected filename are stacked to match the
   height of the file picker control.
   --------------------------------------------------------- */

.products-editor-file-row--primary[b-cfxv2ts9fs] {
    display: grid;
    grid-template-columns: minmax(340px, 520px) minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin-bottom: 0;
}

.products-editor-file-meta[b-cfxv2ts9fs] {
    min-width: 0;
    height: 30px;
    display: grid;
    grid-template-rows: 1fr 1fr;
    align-content: center;
    gap: 1px;
    overflow: hidden;
}

.products-editor-file-help[b-cfxv2ts9fs] {
    min-width: 0;
    overflow: hidden;
    color: var(--text-500, #64748b);
    font-size: 10.5px;
    font-weight: 600;
    line-height: 1.05;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.products-editor-selected-file[b-cfxv2ts9fs] {
    min-width: 0;
    margin-top: 0;
    overflow: hidden;
    color: var(--text-700, #334155);
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1.05;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Book Assets standalone modal */

.products-editor-assets-table-shell--book-assets[b-cfxv2ts9fs] {
    flex: 1 1 auto;
    min-height: 260px;
    max-height: min(52vh, 520px);
    overflow-y: auto;
    overflow-x: hidden;
}


.products-modal-card--book-assets[b-cfxv2ts9fs] {
    width: min(1140px, calc(100vw - 72px));
    height: min(760px, calc(100vh - 40px));
    max-height: calc(100vh - 40px);
}

.products-modal-body--book-assets[b-cfxv2ts9fs] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow: hidden;
}

.products-book-assets-product-summary[b-cfxv2ts9fs] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    padding: 10px 12px;
    border: 1px solid rgba(25, 35, 68, 0.1);
    border-radius: 12px;
    background: #f8fafc;
}

.products-book-assets-product-image[b-cfxv2ts9fs] {
    width: 64px;
    height: 64px;
}

.products-book-assets-product-empty[b-cfxv2ts9fs] {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(25, 35, 68, 0.1);
    border-radius: 10px;
    background: #ffffff;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
    text-align: center;
}

.products-book-assets-product-copy[b-cfxv2ts9fs] {
    min-width: 0;
}

.products-book-assets-product-kicker[b-cfxv2ts9fs] {
    color: #64748b;
    font-size: 10.5px;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.products-book-assets-product-title[b-cfxv2ts9fs] {
    margin-top: 3px;
    color: #17233f;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.products-book-assets-product-meta[b-cfxv2ts9fs] {
    margin-top: 4px;
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.products-editor-assets-panel--standalone[b-cfxv2ts9fs] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

    .products-editor-assets-panel--standalone .products-editor-assets-table-shell[b-cfxv2ts9fs] {
        flex: 1 1 auto;
        max-height: none;
    }

.products-link-action-book-assets[b-cfxv2ts9fs] {
    color: #047857;
}

    .products-link-action-book-assets:hover[b-cfxv2ts9fs],
    .products-link-action-book-assets:focus-visible[b-cfxv2ts9fs] {
        color: #065f46;
    }

/* Modal stacking order */
.products-modal-backdrop--book-assets[b-cfxv2ts9fs] {
    z-index: 2400;
}

.products-modal-shell--book-assets[b-cfxv2ts9fs] {
    z-index: 2410;
}

.products-modal-backdrop--image-asset-editor[b-cfxv2ts9fs] {
    z-index: 2500;
}

.products-modal-shell--image-asset-editor[b-cfxv2ts9fs] {
    z-index: 2510;
}

.products-modal-backdrop--image-asset-view[b-cfxv2ts9fs] {
    z-index: 2520;
}

.products-modal-shell--image-asset-view[b-cfxv2ts9fs] {
    z-index: 2530;
}

.products-modal-backdrop--image-asset-delete[b-cfxv2ts9fs] {
    z-index: 2580;
    background: rgba(15, 23, 42, 0.5);
}

.products-modal-shell--image-asset-delete[b-cfxv2ts9fs] {
    z-index: 2590;
}

    .products-modal-shell--image-asset-delete .products-modal-card[b-cfxv2ts9fs] {
        width: min(760px, calc(100vw - 72px));
    }

/* Product editor Final Book Image Assets table */
/* ---------------------------------------------------------
   Asset table provides dense management for UPC Case, UPC Box,
   UPC Unit, UPC Pre-Pack, seasonal, promotional, and other
   downstream Final Book image assets.
   --------------------------------------------------------- */

.products-editor-assets-panel[b-cfxv2ts9fs] {
    min-width: 0;
    padding: 9px 11px 10px;
    border: 1px solid rgba(25, 35, 68, 0.1);
    border-radius: 11px;
    background: #ffffff;
}

.products-editor-assets-header[b-cfxv2ts9fs] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 7px;
}

.products-editor-assets-empty[b-cfxv2ts9fs] {
    padding: 9px 10px;
    border: 1px dashed rgba(100, 116, 139, 0.28);
    border-radius: 9px;
    background: #f8fafc;
    color: var(--text-500, #64748b);
    font-size: 12px;
}

.products-editor-assets-table-shell[b-cfxv2ts9fs] {
    min-height: 112px;
    max-height: clamp(156px, 24vh, 292px);
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #ffffff;
    padding-top: 2px;
}

    .products-editor-assets-table-shell[b-cfxv2ts9fs]::-webkit-scrollbar {
        width: 8px;
    }

    .products-editor-assets-table-shell[b-cfxv2ts9fs]::-webkit-scrollbar-thumb {
        border-radius: 999px;
        background: rgba(100, 116, 139, 0.34);
    }

    .products-editor-assets-table-shell[b-cfxv2ts9fs]::-webkit-scrollbar-track {
        background: transparent;
    }

/* Final Book Image Assets use internal vertical scrolling when content overflows. */


.products-editor-assets-table thead th[b-cfxv2ts9fs] {
    position: sticky;
    top: 0;
    z-index: 3;
    padding: 7px 8px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.1);
    background: #f8fafc;
    color: var(--text-700, #334155);
    font-size: 10.8px;
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    white-space: nowrap;
}

.products-editor-assets-table tbody td[b-cfxv2ts9fs] {
    min-width: 0;
    padding: 7px 8px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.06);
    color: var(--text-700, #334155);
    vertical-align: middle;
}

.products-editor-assets-table tbody tr:last-child td[b-cfxv2ts9fs] {
    border-bottom: 0;
}

.products-editor-assets-row--inactive[b-cfxv2ts9fs] {
    opacity: 1;
}

    .products-editor-assets-row--inactive .products-editor-assets-thumb-empty[b-cfxv2ts9fs],
    .products-editor-assets-row--inactive .products-editor-assets-type[b-cfxv2ts9fs],
    .products-editor-assets-row--inactive .products-editor-assets-upc[b-cfxv2ts9fs],
    .products-editor-assets-row--inactive .products-editor-assets-title-text[b-cfxv2ts9fs],
    .products-editor-assets-row--inactive .products-editor-assets-description[b-cfxv2ts9fs],
    .products-editor-assets-row--inactive .products-editor-assets-updated[b-cfxv2ts9fs] {
        opacity: 0.74;
    }

    .products-editor-assets-row--inactive .products-editor-assets-tooltip[b-cfxv2ts9fs],
    .products-editor-assets-row--inactive .products-icon-action[b-cfxv2ts9fs]::after {
        opacity: 1;
    }


.products-editor-assets-thumb-empty[b-cfxv2ts9fs] {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 0;
    border: 1px dashed rgba(25, 35, 68, 0.1);
    border-radius: 8px;
    background: #ffffff;
    color: var(--text-500, #64748b);
    font-size: 9.5px;
    font-weight: 700;
    text-align: center;
}

.products-editor-assets-type[b-cfxv2ts9fs] {
    color: var(--text-800, #1e293b);
    font-weight: 700;
    white-space: nowrap;
}

.products-editor-assets-upc[b-cfxv2ts9fs] {
    display: block;
    max-width: 132px;
    overflow: hidden;
    color: var(--text-700, #334155);
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}


.products-editor-assets-muted[b-cfxv2ts9fs] {
    color: var(--text-400, #94a3b8);
    font-weight: 700;
}

.products-image-asset-badge[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    min-width: 62px;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 750;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.products-image-asset-badge--approved[b-cfxv2ts9fs] {
    color: #047857;
    background: rgba(34, 197, 94, 0.13);
    border: 1px solid rgba(34, 197, 94, 0.22);
}

.products-image-asset-badge--draft[b-cfxv2ts9fs] {
    color: #92400e;
    background: rgba(251, 191, 36, 0.18);
    border: 1px solid rgba(251, 191, 36, 0.26);
}

.products-image-asset-badge--revision[b-cfxv2ts9fs] {
    color: #b45309;
    background: rgba(251, 146, 60, 0.16);
    border: 1px solid rgba(251, 146, 60, 0.26);
}

.products-image-asset-badge--inactive[b-cfxv2ts9fs] {
    color: #64748b;
    background: rgba(148, 163, 184, 0.16);
    border: 1px solid rgba(148, 163, 184, 0.26);
}

.products-editor-assets-inactive-label[b-cfxv2ts9fs] {
    margin-top: 3px;
    color: #b91c1c;
    font-size: 10.5px;
    font-weight: 800;
}


/* Product editor image asset actions and custom tooltips */
/* ---------------------------------------------------------
   Compact SVG icon actions and custom hover tooltips for
   truncated Final Book Image Assets table values.
   --------------------------------------------------------- */


.products-icon-action[b-cfxv2ts9fs] {
    position: relative;
    width: 30px;
    height: 30px;
    font-size: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #2563eb;
    cursor: pointer;
    line-height: 1;
    text-decoration: none;
    transition: background-color 120ms ease, color 120ms ease;
}

.products-modal-card--book-assets .products-icon-action[b-cfxv2ts9fs] {
    width: 28px;
    height: 28px;
}


.products-icon-action:disabled[b-cfxv2ts9fs] {
    cursor: not-allowed;
    opacity: 0.45;
}

.products-icon-action-svg[b-cfxv2ts9fs] {
    width: 15px;
    height: 15px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.products-icon-action--edit[b-cfxv2ts9fs] {
    color: #2563eb;
}

.products-icon-action--primary[b-cfxv2ts9fs] {
    color: #b7791f;
}

.products-icon-action--danger[b-cfxv2ts9fs] {
    color: #dc2626;
}

    .products-icon-action--danger:hover[b-cfxv2ts9fs],
    .products-icon-action--danger:focus-visible[b-cfxv2ts9fs] {
        background: #fef2f2;
        color: #b91c1c;
    }




/* CustomTooltip action triggers */
.products-editor-assets-actions:hover[b-cfxv2ts9fs] {
    position: relative;
    z-index: 9000;
}

.products-icon-action:hover[b-cfxv2ts9fs],
.products-icon-action:focus-visible[b-cfxv2ts9fs] {
    background: #eef4ff;
    color: #1d4ed8;
    outline: none;
    z-index: 9000;
}

.products-editor-assets-col-actions[b-cfxv2ts9fs],
.products-editor-assets-table td:last-child[b-cfxv2ts9fs],
.products-editor-assets-actions[b-cfxv2ts9fs],
.products-icon-action[b-cfxv2ts9fs] {
    overflow: visible;
}

.products-editor-assets-tooltip-wrap[b-cfxv2ts9fs] {
    position: relative;
    display: inline-block;
    max-width: 100%;
    min-width: 0;
}

.products-editor-assets-preferred-badge[b-cfxv2ts9fs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    padding: 2px 9px;
    border: 1px solid rgba(37, 99, 235, 0.2);
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.08);
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.products-icon-action--preferred[b-cfxv2ts9fs] {
    color: #b7791f;
}

    .products-icon-action--preferred:hover[b-cfxv2ts9fs],
    .products-icon-action--preferred:focus-visible[b-cfxv2ts9fs] {
        background: #fffbeb;
        color: #92400e;
    }

/* Open Last Updated tooltips leftward near the table edge. */
.products-editor-assets-table td:nth-child(6) .products-editor-assets-tooltip[b-cfxv2ts9fs] {
    left: auto;
    right: 0;
    max-width: 420px;
}

/* Keep the active asset row above surrounding rows while an
   image preview or keyboard-focused control is active. */
.products-editor-assets-table tbody tr:hover[b-cfxv2ts9fs],
.products-editor-assets-table tbody tr:focus-within[b-cfxv2ts9fs] {
    position: relative;
    z-index: 100;
}

    /* Avoid creating equal stacking layers for every cell because
   later cells can otherwise render above the image preview. */
    .products-editor-assets-table tbody tr:hover td[b-cfxv2ts9fs],
    .products-editor-assets-table tbody tr:focus-within td[b-cfxv2ts9fs] {
        position: relative;
        z-index: auto;
        background: #ffffff;
    }

        /* The image cell owns the hover-preview layer for the active row. */
        .products-editor-assets-table tbody tr:hover td.products-editor-assets-col-image[b-cfxv2ts9fs],
        .products-editor-assets-table tbody tr:focus-within td.products-editor-assets-col-image[b-cfxv2ts9fs] {
            z-index: 110;
            overflow: visible;
        }

.products-editor-assets-tooltip-wrap:hover[b-cfxv2ts9fs],
.products-editor-assets-tooltip-wrap:focus-within[b-cfxv2ts9fs] {
    z-index: 9000;
}

/* Final Book Image Assets table refinements */
/* ---------------------------------------------------------
   Balanced desktop table sizing for product image asset rows.
   --------------------------------------------------------- */

.products-editor-assets-table[b-cfxv2ts9fs] {
    width: 100%;
    min-width: 0;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 11.5px;
    table-layout: fixed;
}

    .products-editor-assets-table thead th[b-cfxv2ts9fs],
    .products-editor-assets-table tbody td[b-cfxv2ts9fs] {
        font-size: 12px;
        vertical-align: middle;
    }

.products-editor-assets-col-image[b-cfxv2ts9fs] {
    width: 60px;
}

.products-editor-assets-col-type[b-cfxv2ts9fs] {
    width: 86px;
}

.products-editor-assets-col-upc[b-cfxv2ts9fs] {
    width: 132px;
}

.products-editor-assets-col-title[b-cfxv2ts9fs] {
    width: auto;
}

.products-editor-assets-col-status[b-cfxv2ts9fs] {
    width: 82px;
}

.products-editor-assets-col-preferred[b-cfxv2ts9fs] {
    width: 86px;
}

.products-editor-assets-col-updated[b-cfxv2ts9fs] {
    width: 122px;
}

.products-editor-assets-col-actions[b-cfxv2ts9fs] {
    width: 150px;
}

/* Keep the Actions header and icons aligned. */
.products-editor-assets-table thead th.products-editor-assets-col-actions[b-cfxv2ts9fs] {
    text-align: left;
}


.products-editor-assets-table tbody td.products-editor-assets-col-preferred[b-cfxv2ts9fs] {
    text-align: center;
}

.products-editor-assets-table thead th.products-editor-assets-col-preferred[b-cfxv2ts9fs] {
    text-align: center;
}

.products-editor-assets-table tbody td.products-editor-assets-col-actions[b-cfxv2ts9fs] {
    text-align: center;
    padding-right: 10px;
}

.products-editor-assets-title-text[b-cfxv2ts9fs] {
    max-width: 100%;
    color: var(--text-900, #0f172a);
    font-weight: 800;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    font-size: 12px;
}

.products-editor-assets-description[b-cfxv2ts9fs] {
    max-width: 100%;
    margin-top: 2px;
    color: var(--text-500, #64748b);
    font-size: 11.5px;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

.products-editor-assets-updated[b-cfxv2ts9fs] {
    color: var(--text-600, #475569);
    font-size: 12px;
    line-height: 1.25;
    white-space: nowrap;
    width: 100%;
    min-height: 32px;
    display: flex;
    align-items: center;
    font-weight: 500;
}

.products-editor-assets-actions[b-cfxv2ts9fs] {
    width: 100%;
    min-height: 32px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    white-space: nowrap;
}


.products-icon-action--view[b-cfxv2ts9fs],
.products-icon-action--edit[b-cfxv2ts9fs] {
    color: #2563eb;
}

.products-icon-action--deactivate[b-cfxv2ts9fs],
.products-icon-action--delete[b-cfxv2ts9fs] {
    color: #dc2626;
}

    .products-icon-action--deactivate:hover[b-cfxv2ts9fs],
    .products-icon-action--deactivate:focus-visible[b-cfxv2ts9fs],
    .products-icon-action--delete:hover[b-cfxv2ts9fs],
    .products-icon-action--delete:focus-visible[b-cfxv2ts9fs] {
        background: #fef2f2;
        color: #b91c1c;
    }

.products-icon-action--activate[b-cfxv2ts9fs] {
    color: #047857;
}

    .products-icon-action--activate:hover[b-cfxv2ts9fs],
    .products-icon-action--activate:focus-visible[b-cfxv2ts9fs] {
        background: #ecfdf5;
        color: #065f46;
    }

.products-editor-assets-table td.products-editor-assets-col-title[b-cfxv2ts9fs],
.products-editor-assets-table td:nth-child(4)[b-cfxv2ts9fs] {
    min-width: 0;
    overflow: hidden;
    max-width: 0;
}

[b-cfxv2ts9fs] .products-editor-assets-tooltip-wrap {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

    [b-cfxv2ts9fs] .products-editor-assets-tooltip-wrap .products-editor-assets-title-text,
    [b-cfxv2ts9fs] .products-editor-assets-tooltip-wrap .products-editor-assets-description {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

.products-editor-assets-actions[b-cfxv2ts9fs]  .custom-tooltip-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Book Assets modal column balance. */
.products-modal-card--book-assets .products-editor-assets-table[b-cfxv2ts9fs] {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

.products-modal-card--book-assets .products-editor-assets-col-image[b-cfxv2ts9fs] {
    width: 58px;
}

.products-modal-card--book-assets .products-editor-assets-col-type[b-cfxv2ts9fs] {
    width: 84px;
}

.products-modal-card--book-assets .products-editor-assets-col-upc[b-cfxv2ts9fs] {
    width: 130px;
}

.products-modal-card--book-assets .products-editor-assets-col-title[b-cfxv2ts9fs] {
    width: auto;
}

.products-modal-card--book-assets .products-editor-assets-col-status[b-cfxv2ts9fs] {
    width: 82px;
}

.products-modal-card--book-assets .products-editor-assets-col-preferred[b-cfxv2ts9fs] {
    width: 84px;
}

.products-modal-card--book-assets .products-editor-assets-col-updated[b-cfxv2ts9fs] {
    width: 122px;
}

.products-modal-card--book-assets .products-editor-assets-col-actions[b-cfxv2ts9fs] {
    width: 150px;
}

/* Product image asset read-only view modal */

.products-image-asset-view-card[b-cfxv2ts9fs] {
    width: min(860px, calc(100vw - 72px));
}

.products-image-asset-view-layout[b-cfxv2ts9fs] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.products-image-asset-view-preview[b-cfxv2ts9fs] {
    min-width: 0;
}

.products-image-asset-view-preview-empty[b-cfxv2ts9fs] {
    width: 220px;
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid rgba(25, 35, 68, 0.1);
    border-radius: 14px;
    background: #f8fafc;
    color: #64748b;
    font-size: 13px;
    font-weight: 700;
}

.products-image-asset-view-fields[b-cfxv2ts9fs] {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.products-image-asset-view-field[b-cfxv2ts9fs] {
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
    background: #ffffff;
}

.products-image-asset-view-field--wide[b-cfxv2ts9fs] {
    grid-column: 1 / -1;
}

.products-image-asset-view-label[b-cfxv2ts9fs] {
    color: #64748b;
    font-size: 10.5px;
    font-weight: 800;
    line-height: 1.15;
    text-transform: uppercase;
    letter-spacing: 0.035em;
}

.products-image-asset-view-value[b-cfxv2ts9fs] {
    margin-top: 4px;
    color: #17233f;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

/* Final Book Image Assets truncation. */
.products-editor-assets-table td:nth-child(3)[b-cfxv2ts9fs],
.products-editor-assets-table td:nth-child(5)[b-cfxv2ts9fs] {
    min-width: 0;
}

    .products-editor-assets-table td:nth-child(3) .products-editor-assets-tooltip-wrap[b-cfxv2ts9fs],
    .products-editor-assets-table td:nth-child(5) .products-editor-assets-tooltip-wrap[b-cfxv2ts9fs] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        display: block;
    }

.products-editor-assets-title-text[b-cfxv2ts9fs],
.products-editor-assets-upc[b-cfxv2ts9fs] {
    min-height: 32px;
    display: block;
    align-items: center;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: 32px;
    overflow: hidden;
    line-height: 32px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Match Product editor multipart controls to standard editor inputs. */
.products-modal-card--editor .products-pattern-field[b-cfxv2ts9fs],
.products-modal-card--editor .products-dimensions-field[b-cfxv2ts9fs] {
    min-height: 37px;
    height: 37px;
    align-items: stretch;
}

.products-modal-card--editor input.form-control.products-pattern-field__input[b-cfxv2ts9fs],
.products-modal-card--editor input.form-control.products-dimensions-field__input[b-cfxv2ts9fs] {
    min-height: 37px;
    height: 37px;
    padding: 7px 11px;
    font-size: 15px;
    line-height: 1.25;
    border-radius: 7px;
    box-sizing: border-box;
}

.products-modal-card--editor .products-pattern-field__separator[b-cfxv2ts9fs],
.products-modal-card--editor .products-dimensions-field__separator[b-cfxv2ts9fs] {
    min-height: 37px;
    height: 37px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--text-600);
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
}

/* Measurement Input Groups */
/* ---------------------------------------------------------
   Joins Product measurement values and unit selectors.
   Closed selectors show compact abbreviations while native
   option lists retain complete measurement descriptions.
   --------------------------------------------------------- */


.products-measurement-input-group > .form-control[b-cfxv2ts9fs] {
    min-width: 0;
    min-height: 28px;
    height: 28px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.products-measurement-unit-control[b-cfxv2ts9fs] {
    position: relative;
    flex: 0 0 84px;
    width: 84px;
    min-width: 84px;
    height: 28px;
    margin-left: -1px;
}

.products-measurement-unit-control--shipment[b-cfxv2ts9fs] {
    flex-basis: 90px;
    width: 90px;
    min-width: 90px;
}

.products-measurement-unit-control .products-measurement-unit-select[b-cfxv2ts9fs] {
    width: 100%;
    min-height: 28px;
    height: 28px;
    padding: 2px 1.75rem 2px 0.55rem;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    font-size: 13px;
    font-weight: 600;
}

.products-measurement-unit-display[b-cfxv2ts9fs] {
    position: absolute;
    top: 1px;
    right: 28px;
    bottom: 1px;
    left: 1px;
    z-index: 2;
    display: flex;
    align-items: center;
    padding-left: 0.55rem;
    overflow: hidden;
    background: #ffffff;
    color: #1e293b;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.01em;
    white-space: nowrap;
    pointer-events: none;
}

.products-measurement-unit-select:disabled + .products-measurement-unit-display[b-cfxv2ts9fs] {
    background: #e9ecef;
    color: #6c757d;
}

.products-measurement-input-group > .form-control:focus[b-cfxv2ts9fs] {
    position: relative;
    z-index: 3;
}

.products-measurement-unit-control:focus-within[b-cfxv2ts9fs] {
    z-index: 3;
}

/* Product Measurement Validation */
/* ---------------------------------------------------------
   Reserves a stable validation area beneath measurement
   controls and prevents messages from overlapping later rows.
   --------------------------------------------------------- */

.products-editor-field--measurement[b-cfxv2ts9fs] {
    min-width: 0;
    align-self: start;
}

.products-measurement-validation[b-cfxv2ts9fs] {
    min-height: 0;
    margin-top: 2px;
}

    .products-measurement-validation[b-cfxv2ts9fs]  .validation-message {
        display: block;
        margin: 0;
        color: #dc2626;
        font-size: 11.5px;
        font-weight: 600;
        line-height: 1.25;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }

/* Product Editor Enterprise Sections */
/* ---------------------------------------------------------
   Adds structured Product Basics, Units & Quantities,
   Logistics & Packaging, and image-management sections.
   The modal retains its internal scrolling behavior.
   --------------------------------------------------------- */

.products-editor-layout[b-cfxv2ts9fs] {
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.products-editor-section[b-cfxv2ts9fs],
.products-editor-primary-panel[b-cfxv2ts9fs] {
    min-width: 0;
    padding: 7px 10px 8px;
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 9px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.025);
}

.products-editor-section-header[b-cfxv2ts9fs],
.products-editor-section-heading[b-cfxv2ts9fs] {
    display: flex;
    align-items: center;
    gap: 7px;
    /*margin-bottom: 5px;*/
}

.products-editor-section-icon[b-cfxv2ts9fs],
.products-detail-data-section-icon[b-cfxv2ts9fs] {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(37, 99, 235, 0.2);
    border-radius: 6px;
    background: rgba(37, 99, 235, 0.06);
    color: #1d4ed8;
}

    .products-editor-section-icon svg[b-cfxv2ts9fs],
    .products-detail-data-section-icon svg[b-cfxv2ts9fs] {
        width: 12px;
        height: 12px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.products-editor-section-title[b-cfxv2ts9fs] {
    margin: 0;
    padding: 0;
    border-top: 0;
    color: #10244d;
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.products-editor-section-subtitle[b-cfxv2ts9fs] {
    margin: 2px 0 0;
    color: #64748b;
    font-size: 10.8px;
    line-height: 1.25;
}

.products-editor-section .products-editor-grid[b-cfxv2ts9fs] {
    column-gap: 9px;
    row-gap: 4px;
    padding-bottom: 0;
    border-bottom: 0;
}

.products-editor-section .form-label[b-cfxv2ts9fs] {
    margin-bottom: 2px;
    color: #334155;
    font-size: 10.8px;
    font-weight: 700;
    line-height: 1.05;
}


.products-editor-primary-panel-header[b-cfxv2ts9fs] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    /*margin-bottom: 5px;*/
}

.products-editor-primary-image-layout[b-cfxv2ts9fs] {
    display: grid;
    grid-template-columns: minmax(180px, 0.65fr) minmax(320px, 1.35fr) minmax(210px, 0.8fr);
    gap: 10px;
    align-items: center;
}

.products-editor-primary-image-summary[b-cfxv2ts9fs] {
    min-width: 0;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}

.products-editor-primary-image-copy[b-cfxv2ts9fs] {
    min-width: 0;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow: hidden;
}

    .products-editor-primary-image-copy strong[b-cfxv2ts9fs] {
        display: block;
        max-width: 100%;
        overflow: hidden;
        color: #1e293b;
        font-size: 12px;
        font-weight: 800;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .products-editor-primary-image-copy span[b-cfxv2ts9fs] {
        display: block;
        max-width: 100%;
        overflow: hidden;
        color: #64748b;
        font-size: 10.8px;
        line-height: 1.25;
        text-overflow: ellipsis;
        white-space: normal;
    }

.products-editor-upload-zone[b-cfxv2ts9fs] {
    position: relative;
    min-height: 50px;
    overflow: hidden;
    border: 1px dashed rgba(37, 99, 235, 0.34);
    border-radius: 8px;
    background: rgba(248, 250, 252, 0.8);
    cursor: pointer;
    transition: border-color 140ms ease, background-color 140ms ease;
}

    .products-editor-upload-zone:hover[b-cfxv2ts9fs],
    .products-editor-upload-zone:focus-within[b-cfxv2ts9fs] {
        border-color: rgba(37, 99, 235, 0.62);
        background: rgba(239, 246, 255, 0.78);
    }

    .products-editor-upload-zone[b-cfxv2ts9fs]  .products-editor-upload-input {
        position: absolute;
        inset: 0;
        z-index: 2;
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        border: 0;
        opacity: 0;
        cursor: pointer;
    }

.products-editor-upload-content[b-cfxv2ts9fs] {
    min-height: 50px;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 8px;
    row-gap: 1px;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    text-align: left;
    pointer-events: none;
}

.products-editor-upload-icon[b-cfxv2ts9fs] {
    grid-row: 1 / span 2;
    width: 20px;
    height: 20px;
    margin: 0;
    fill: none;
    stroke: #2563eb;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.products-editor-upload-content strong[b-cfxv2ts9fs] {
    color: #1e3a6d;
    font-size: 11.5px;
    font-weight: 800;
}

.products-editor-upload-content span[b-cfxv2ts9fs] {
    color: #64748b;
    font-size: 9.8px;
}

.products-editor-current-image[b-cfxv2ts9fs] {
    min-width: 0;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    overflow: hidden;
}

.products-editor-current-image-label[b-cfxv2ts9fs] {
    color: #64748b;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.products-editor-current-image-name[b-cfxv2ts9fs],
.products-editor-current-image-file[b-cfxv2ts9fs] {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.products-editor-current-image-name[b-cfxv2ts9fs] {
    color: #1e293b;
    font-size: 11px;
    font-weight: 800;
}

.products-editor-current-image-file[b-cfxv2ts9fs] {
    color: #475569;
    font-size: 10.5px;
}

.products-editor-remove-image[b-cfxv2ts9fs] {
    margin-top: 4px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #dc2626;
    font-size: 10.8px;
    font-weight: 700;
}

.products-modal-footer--editor[b-cfxv2ts9fs] {
    gap: 8px;
}

    .products-modal-footer--editor .btn[b-cfxv2ts9fs] {
        min-width: 110px;
        min-height: 32px;
        border-radius: 8px;
        font-size: 12px;
        font-weight: 700;
    }


/* Product Profile Enterprise Sections */
/* ---------------------------------------------------------
   Groups read-only Product data using the same hierarchy as
   Product Add/Edit while preserving the audit and asset areas.
   --------------------------------------------------------- */


.products-detail-field-grid--basics[b-cfxv2ts9fs] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.products-detail-field-grid--quantities[b-cfxv2ts9fs] {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.products-detail-field-grid--logistics[b-cfxv2ts9fs] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}


.products-detail-item--wide[b-cfxv2ts9fs] {
    grid-column: span 2;
}

/* Product Composite Control Alignment */
/* ---------------------------------------------------------
   Keeps currency, measurement, pallet-pattern, and dimension
   controls aligned with the standard Product editor fields.
   Blazor input components require deep selectors because the
   rendered controls cross the CSS-isolation boundary.
   --------------------------------------------------------- */

.products-modal-card--editor[b-cfxv2ts9fs] {
    width: min(1180px, calc(100vw - 64px));
    max-height: calc(100vh - 32px);
    display: flex;
    overflow: hidden;
    flex-direction: column;
    --products-editor-control-height: 37px;
}

/* Standard native controls inside Product editor sections. */
.products-editor-section .form-control[b-cfxv2ts9fs],
.products-editor-section .form-select[b-cfxv2ts9fs],
.products-editor-section .input-group-text[b-cfxv2ts9fs] {
    min-height: var(--products-editor-control-height);
    height: var(--products-editor-control-height);
    box-sizing: border-box;
}

/* Blazor-rendered controls inside Product editor sections. */
.products-editor-section[b-cfxv2ts9fs]  .form-control,
.products-editor-section[b-cfxv2ts9fs]  .form-select {
    min-height: var(--products-editor-control-height);
    height: var(--products-editor-control-height);
    box-sizing: border-box;
}

/* Item Retail currency group. */
.products-editor-section .input-group[b-cfxv2ts9fs] {
    min-height: var(--products-editor-control-height);
    height: var(--products-editor-control-height);
    align-items: stretch;
}

    .products-editor-section .input-group > .input-group-text[b-cfxv2ts9fs] {
        min-height: var(--products-editor-control-height);
        height: var(--products-editor-control-height);
        display: inline-flex;
        align-items: center;
        padding-top: 0;
        padding-bottom: 0;
    }

    .products-editor-section .input-group[b-cfxv2ts9fs]  .form-control {
        min-height: var(--products-editor-control-height);
        height: var(--products-editor-control-height);
        padding-top: 6px;
        padding-bottom: 6px;
    }

/* Size and Minimum Shipment measurement groups. */
.products-measurement-input-group[b-cfxv2ts9fs] {
    width: 100%;
    min-width: 0;
    min-height: var(--products-editor-control-height);
    height: var(--products-editor-control-height);
    align-items: stretch;
}

    .products-measurement-input-group > .form-control[b-cfxv2ts9fs],
    .products-measurement-input-group[b-cfxv2ts9fs]  .form-control {
        min-height: var(--products-editor-control-height);
        height: var(--products-editor-control-height);
    }

.products-measurement-unit-control[b-cfxv2ts9fs],
.products-measurement-unit-control--shipment[b-cfxv2ts9fs] {
    height: var(--products-editor-control-height);
}

    .products-measurement-unit-control[b-cfxv2ts9fs]  .products-measurement-unit-select {
        min-height: var(--products-editor-control-height);
        height: var(--products-editor-control-height);
    }

/* Pallet Pattern and Case Dimensions composite controls. */
.products-modal-card--editor .products-pattern-field[b-cfxv2ts9fs],
.products-modal-card--editor .products-dimensions-field[b-cfxv2ts9fs],
.products-modal-card--editor input.form-control.products-pattern-field__input[b-cfxv2ts9fs],
.products-modal-card--editor input.form-control.products-dimensions-field__input[b-cfxv2ts9fs],
.products-modal-card--editor .products-pattern-field__separator[b-cfxv2ts9fs],
.products-modal-card--editor .products-dimensions-field__separator[b-cfxv2ts9fs] {
    min-height: var(--products-editor-control-height);
    height: var(--products-editor-control-height);
}

/* Compact Product Profile Layout */
/* ---------------------------------------------------------
   Reduces Product Profile vertical space while preserving
   section hierarchy, audit metadata, and asset-table scrolling.
   --------------------------------------------------------- */

.products-modal-shell--detail[b-cfxv2ts9fs] {
    padding: 10px 20px;
}

    .products-modal-shell--detail .products-modal-card[b-cfxv2ts9fs] {
        width: min(1180px, calc(100vw - 48px));
        max-height: calc(100vh - 20px);
    }

    .products-modal-shell--detail .products-modal-header[b-cfxv2ts9fs] {
        padding: 9px 16px 7px;
    }

    .products-modal-shell--detail .products-modal-title[b-cfxv2ts9fs] {
        font-size: 19px;
        line-height: 1.05;
    }

    .products-modal-shell--detail .products-modal-subtitle[b-cfxv2ts9fs] {
        margin-top: 2px;
        font-size: 11.5px;
        line-height: 1.15;
    }

.products-modal-body--detail[b-cfxv2ts9fs] {
    padding: 8px 14px 9px;
}

.products-detail-layout[b-cfxv2ts9fs] {
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.products-detail-card[b-cfxv2ts9fs] {
    padding: 7px 9px 8px;
    border-radius: 11px;
}

.products-detail-card-header[b-cfxv2ts9fs] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 5px;
}

.products-detail-card-subtitle[b-cfxv2ts9fs] {
    margin-top: 2px;
    margin-bottom: 5px;
    color: #64748b;
    font-size: 10.8px;
    font-weight: 500;
    line-height: 1.15;
}

/* Compact Product summary. */
.products-detail-summary-card[b-cfxv2ts9fs] {
    grid-template-columns: 62px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-height: 58px;
    padding-bottom: 7px;
    display: grid;
    padding: 0 0 7px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.products-detail-summary-image[b-cfxv2ts9fs],
.products-detail-summary-empty[b-cfxv2ts9fs] {
    width: 54px;
    height: 54px;
    max-width: 54px;
    max-height: 54px;
    overflow: hidden;
    align-self: center;
}

.products-detail-summary-title-row[b-cfxv2ts9fs] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 0;
}

.products-detail-summary-title[b-cfxv2ts9fs] {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: #17233f;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.products-detail-summary-title-row .products-status-badge[b-cfxv2ts9fs] {
    flex: 0 0 auto;
    min-width: 66px;
    min-height: 18px;
    font-size: 10.5px;
}

/* Compact grouped detail sections. */
.products-detail-section-stack[b-cfxv2ts9fs] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-top: 7px;
}

.products-detail-data-section[b-cfxv2ts9fs] {
    min-width: 0;
    padding: 6px 8px 7px;
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 8px;
    background: #ffffff;
}

.products-detail-data-section-header[b-cfxv2ts9fs] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 5px;
    color: #10244d;
    font-size: 11px;
    font-weight: 800;
}

.products-detail-data-section-icon[b-cfxv2ts9fs] {
    width: 18px;
    height: 18px;
    border-radius: 5px;
}

    .products-detail-data-section-icon svg[b-cfxv2ts9fs] {
        width: 11px;
        height: 11px;
    }

.products-detail-field-grid[b-cfxv2ts9fs] {
    display: grid;
    gap: 6px 18px;
    margin-top: 6px;
}

.products-detail-data-section .products-detail-item[b-cfxv2ts9fs] {
    min-width: 0;
    padding: 0;
}

.products-detail-data-section .products-detail-label[b-cfxv2ts9fs] {
    margin-bottom: 1px;
    color: #64748b;
    font-size: 9.3px;
    font-weight: 800;
    letter-spacing: 0.035em;
    text-transform: uppercase;
    line-height: 1.05;
}

.products-detail-data-section .products-detail-value[b-cfxv2ts9fs] {
    min-width: 0;
    overflow: hidden;
    color: #1e293b;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Compact audit strip. */
.products-detail-audit-strip[b-cfxv2ts9fs] {
    margin-top: 7px;
    padding: 6px 8px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 8px;
    background: #f8fafc;
}

.products-detail-audit-grid[b-cfxv2ts9fs] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

    .products-detail-audit-grid span[b-cfxv2ts9fs] {
        display: block;
        margin-bottom: 1px;
        color: #64748b;
        font-size: 9.4px;
        font-weight: 700;
        line-height: 1.05;
        text-transform: uppercase;
        letter-spacing: 0.035em;
    }

    .products-detail-audit-grid strong[b-cfxv2ts9fs] {
        display: block;
        min-width: 0;
        overflow: hidden;
        color: #334155;
        font-size: 10.7px;
        font-weight: 500;
        line-height: 1.15;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

/* Compact Image Assets card. */
.products-detail-image-assets-card[b-cfxv2ts9fs] {
    flex: 1 1 auto;
    min-height: 0;
    padding: 7px 9px 8px;
    border-radius: 11px;
}

.products-detail-image-assets-header[b-cfxv2ts9fs] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 5px;
}

.products-detail-image-assets-subtitle[b-cfxv2ts9fs] {
    margin-top: 2px;
    margin-bottom: 5px;
    color: #64748b;
    font-size: 10.8px;
    font-weight: 500;
    line-height: 1.15;
}

.products-detail-image-assets-count[b-cfxv2ts9fs] {
    flex: 0 0 auto;
    color: #334155;
    font-size: 10.8px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}

/* Reduce asset-table footprint while keeping internal scrolling. */
.products-modal-body--detail .products-image-assets-table-shell[b-cfxv2ts9fs] {
    max-height: clamp(190px, 27vh, 300px);
    min-height: 0;
}

.products-image-assets-table thead th[b-cfxv2ts9fs] {
    z-index: 9;
    background: #f8fafc;
    box-shadow: 0 1px 0 rgba(25, 35, 68, 0.1);
    padding: 5px 7px;
    font-size: 10px;
    line-height: 1.1;
}

.products-image-assets-table tbody td[b-cfxv2ts9fs] {
    padding: 5px 7px;
    font-size: 11px;
    line-height: 1.15;
}

.products-image-assets-table .products-editor-assets-col-image[b-cfxv2ts9fs] {
    width: 60px;
}

.products-image-assets-table .products-editor-assets-col-type[b-cfxv2ts9fs] {
    width: 92px;
}

.products-image-assets-table .products-editor-assets-col-status[b-cfxv2ts9fs] {
    width: 72px;
}

.products-image-assets-table .products-editor-assets-col-preferred[b-cfxv2ts9fs] {
    width: 76px;
}

.products-image-assets-table .products-editor-assets-col-updated[b-cfxv2ts9fs] {
    width: 132px;
}

.products-image-assets-table .products-editor-assets-col-actions[b-cfxv2ts9fs] {
    width: 76px;
}

.products-image-assets-table th.products-editor-assets-col-updated[b-cfxv2ts9fs],
.products-image-assets-table td.products-editor-assets-col-updated[b-cfxv2ts9fs] {
    padding-right: 12px;
}

.products-image-assets-table th.products-editor-assets-col-actions[b-cfxv2ts9fs],
.products-image-assets-table td.products-editor-assets-col-actions[b-cfxv2ts9fs] {
    padding-left: 10px;
    text-align: center;
}


.products-image-assets-table .products-icon-action[b-cfxv2ts9fs] {
    width: 24px;
    height: 24px;
}

.products-image-assets-actions[b-cfxv2ts9fs] {
    min-height: 24px;
    justify-content: center;
    gap: 0;
    width: 100%;
    display: flex;
    align-items: center;
}

.products-image-assets-table tbody td.products-editor-assets-col-actions[b-cfxv2ts9fs] {
    text-align: center;
    vertical-align: middle;
}

.products-image-assets-table .products-editor-assets-updated[b-cfxv2ts9fs] {
    width: 100%;
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* Responsive behavior */

@container products-page (max-width: 1050px) {
    .products-editor-primary-image-layout[b-cfxv2ts9fs] {
        grid-template-columns: minmax(230px, 0.9fr) minmax(280px, 1.1fr) minmax(260px, 1fr);
    }

    .products-detail-field-grid--basics[b-cfxv2ts9fs],
    .products-detail-field-grid--logistics[b-cfxv2ts9fs] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .products-detail-field-grid--quantities[b-cfxv2ts9fs] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@container products-page (max-width: 820px) {
    .products-detail-field-grid--basics[b-cfxv2ts9fs],
    .products-detail-field-grid--quantities[b-cfxv2ts9fs],
    .products-detail-field-grid--logistics[b-cfxv2ts9fs] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1600px) {
    .products-table[b-cfxv2ts9fs] {
        min-width: 1120px;
    }

    .products-col-description[b-cfxv2ts9fs] {
        min-width: 300px;
    }

    .products-col-manufacturer[b-cfxv2ts9fs],
    .products-col-line[b-cfxv2ts9fs] {
        width: 190px;
        min-width: 170px;
    }
}

@container products-page (max-width: 980px) {
    .products-stat-grid[b-cfxv2ts9fs] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .products-toolbar[b-cfxv2ts9fs] {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
    }

    .products-control-page-size .products-filter-select[b-cfxv2ts9fs] {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 768px) {
    .products-title[b-cfxv2ts9fs] {
        font-size: 18px;
        font-weight: 700;
        line-height: 1.2;
    }

    .products-primary-button[b-cfxv2ts9fs],
    .products-secondary-button[b-cfxv2ts9fs] {
        width: 100%;
    }

    .products-main-header[b-cfxv2ts9fs],
    .products-side-card-header[b-cfxv2ts9fs],
    .products-toolbar[b-cfxv2ts9fs],
    .products-side-card-body[b-cfxv2ts9fs],
    .products-pager[b-cfxv2ts9fs] {
        padding-left: 12px;
        padding-right: 12px;
    }

    .products-table-region[b-cfxv2ts9fs] {
        margin-left: 10px;
        margin-right: 10px;
    }

    .products-detail-grid[b-cfxv2ts9fs] {
        grid-template-columns: 1fr;
    }

    .products-modal-shell[b-cfxv2ts9fs] {
        padding: 12px;
    }

    .products-modal-card[b-cfxv2ts9fs] {
        width: 100%;
        max-height: calc(100vh - 24px);
        border-radius: 16px;
    }

    .products-modal-header[b-cfxv2ts9fs],
    .products-modal-body[b-cfxv2ts9fs],
    .products-modal-footer[b-cfxv2ts9fs] {
        padding-left: 16px;
        padding-right: 16px;
    }

    .products-modal-footer[b-cfxv2ts9fs] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

        .products-modal-footer .btn[b-cfxv2ts9fs] {
            width: 100%;
        }

    .products-main-header[b-cfxv2ts9fs] {
        flex-direction: column;
        align-items: stretch;
    }

    .products-main-header-actions[b-cfxv2ts9fs] {
        width: 100%;
        justify-content: stretch;
        flex-direction: column;
    }

        .products-main-header-actions .products-primary-button[b-cfxv2ts9fs],
        .products-main-header-actions .products-secondary-button[b-cfxv2ts9fs] {
            width: 100%;
        }

    .products-editor-file-row[b-cfxv2ts9fs] {
        grid-template-columns: 1fr;
    }
}

@container products-page (max-width: 640px) {
    .products-stat-grid[b-cfxv2ts9fs],
    .products-toolbar[b-cfxv2ts9fs] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .products-header[b-cfxv2ts9fs] {
        align-items: stretch;
    }

    .products-primary-button[b-cfxv2ts9fs],
    .products-secondary-button[b-cfxv2ts9fs] {
        width: 100%;
    }

    .products-pager[b-cfxv2ts9fs] {
        padding-left: 12px;
        padding-right: 12px;
    }
}
/* /Components/Shared/PromotionCycles/CycleMetric.razor.rz.scp.css */
.cycle-summary-metric[b-eob53a6rdd] {
    min-width: 0;
    padding: 8px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 9px;
    background: #f8fafc;
}

.cycle-summary-metric--success[b-eob53a6rdd] {
    background: rgba(16, 185, 129, 0.06);
}

.cycle-summary-metric--warning[b-eob53a6rdd] {
    background: rgba(245, 158, 11, 0.07);
}

.cycle-summary-metric--danger[b-eob53a6rdd] {
    background: rgba(220, 38, 38, 0.06);
}

.cycle-summary-metric--info[b-eob53a6rdd] {
    background: rgba(59, 130, 246, 0.06);
}

.cycle-summary-metric-value[b-eob53a6rdd] {
    color: var(--text-900, #0f172a);
    font-size: 17px;
    line-height: 1;
    font-weight: 800;
}

.cycle-summary-metric-label[b-eob53a6rdd] {
    margin-top: 4px;
    overflow: hidden;
    color: var(--text-500, #64748b);
    font-size: 10.5px;
    line-height: 1.2;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Components/Shared/PromotionCycles/CycleSummaryDate.razor.rz.scp.css */
.cycle-summary-date[b-e3z33odi0e] {
    min-width: 0;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.16);
}

.cycle-summary-date-label[b-e3z33odi0e] {
    color: var(--text-500, #64748b);
    font-size: 10.5px;
    font-weight: 700;
}

.cycle-summary-date-value[b-e3z33odi0e] {
    margin-top: 2px;
    color: var(--text-900, #0f172a);
    font-size: 12px;
    font-weight: 700;
}
/* /Components/Shared/PromotionCycles/PromotionCycleSummaryModal.razor.rz.scp.css */
/* Cycle Summary Modal */
/* ---------------------------------------------------------
   Presents Promotion Cycle health, operational progress,
   workflow counts, deadlines, and WAM Admin attention items.
   --------------------------------------------------------- */

.cycle-summary-backdrop[b-063bjhmyf4] {
    position: fixed;
    inset: 0;
    z-index: 2050;
    background: rgba(15, 23, 42, 0.48);
    backdrop-filter: blur(1px);
}

.cycle-summary-shell[b-063bjhmyf4] {
    position: fixed;
    inset: 0;
    z-index: 2060;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    pointer-events: none;
}

.cycle-summary-card[b-063bjhmyf4] {
    width: min(1120px, calc(100vw - 48px));
    max-height: min(860px, calc(100vh - 48px));
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.28);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
    pointer-events: auto;
}

.cycle-summary-header[b-063bjhmyf4] {
    flex: 0 0 auto;
    min-height: 74px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 18px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.22);
}

.cycle-summary-header-copy[b-063bjhmyf4] {
    min-width: 0;
}

.cycle-summary-eyebrow[b-063bjhmyf4] {
    margin-bottom: 2px;
    color: var(--text-500, #64748b);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.cycle-summary-title[b-063bjhmyf4] {
    margin: 0;
    overflow: hidden;
    color: var(--text-900, #0f172a);
    font-size: 21px;
    line-height: 1.2;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cycle-summary-subtitle[b-063bjhmyf4] {
    margin-top: 3px;
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--text-500, #64748b);
    font-size: 12px;
}

.cycle-summary-body[b-063bjhmyf4] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px 16px;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.cycle-summary-health[b-063bjhmyf4] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 118px;
    gap: 16px;
    padding: 14px 16px;
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-left-width: 5px;
    border-radius: 14px;
    background: #f8fafc;
}

.cycle-summary-health--success[b-063bjhmyf4] {
    border-left-color: #0f9f74;
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.08), #fff 60%);
}

.cycle-summary-health--watch[b-063bjhmyf4] {
    border-left-color: #3b82f6;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.08), #fff 60%);
}

.cycle-summary-health--warning[b-063bjhmyf4] {
    border-left-color: #f59e0b;
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.09), #fff 60%);
}

.cycle-summary-health--danger[b-063bjhmyf4],
.cycle-summary-health--critical[b-063bjhmyf4] {
    border-left-color: #dc2626;
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.08), #fff 60%);
}

.cycle-summary-health-main[b-063bjhmyf4] {
    min-width: 0;
}

.cycle-summary-health-label[b-063bjhmyf4] {
    color: var(--text-500, #64748b);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.cycle-summary-health-status[b-063bjhmyf4] {
    margin-top: 2px;
    color: var(--text-900, #0f172a);
    font-size: 23px;
    font-weight: 800;
    line-height: 1.15;
}

.cycle-summary-health-copy[b-063bjhmyf4] {
    margin-top: 4px;
    color: var(--text-600, #475569);
    font-size: 12.5px;
    line-height: 1.4;
}

.cycle-summary-score[b-063bjhmyf4] {
    align-self: center;
    text-align: right;
}

.cycle-summary-score-value[b-063bjhmyf4] {
    color: var(--text-900, #0f172a);
    font-size: 32px;
    line-height: 1;
    font-weight: 850;
}

.cycle-summary-score-label[b-063bjhmyf4] {
    margin-top: 4px;
    color: var(--text-500, #64748b);
    font-size: 11px;
    font-weight: 700;
}

.cycle-summary-progress-area[b-063bjhmyf4] {
    grid-column: 1 / -1;
}

.cycle-summary-progress-header[b-063bjhmyf4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 6px;
    color: var(--text-600, #475569);
    font-size: 11px;
    font-weight: 700;
}

.cycle-summary-progress-track[b-063bjhmyf4] {
    position: relative;
    height: 8px;
    overflow: visible;
    border-radius: 999px;
    background: #e2e8f0;
}

.cycle-summary-progress-value[b-063bjhmyf4] {
    height: 100%;
    max-width: 100%;
    border-radius: inherit;
    background: #1d4ed8;
}

.cycle-summary-progress-expected[b-063bjhmyf4] {
    position: absolute;
    top: -3px;
    width: 2px;
    height: 14px;
    transform: translateX(-1px);
    border-radius: 999px;
    background: #0f172a;
}

.cycle-summary-operational-grid[b-063bjhmyf4] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.cycle-summary-panel[b-063bjhmyf4] {
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 13px;
    background: #fff;
}

.cycle-summary-panel-header[b-063bjhmyf4],
.cycle-summary-attention-header[b-063bjhmyf4] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.cycle-summary-panel-title[b-063bjhmyf4] {
    color: var(--text-900, #0f172a);
    font-size: 13px;
    font-weight: 800;
}

.cycle-summary-panel-subtitle[b-063bjhmyf4] {
    margin-top: 2px;
    color: var(--text-500, #64748b);
    font-size: 11px;
    line-height: 1.35;
}

.cycle-summary-panel-total[b-063bjhmyf4] {
    flex: 0 0 auto;
    color: #1d4ed8;
    font-size: 21px;
    line-height: 1;
    font-weight: 850;
}

.cycle-summary-metric-grid[b-063bjhmyf4] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
}

.cycle-summary-metric-grid--books[b-063bjhmyf4] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cycle-summary-metric[b-063bjhmyf4] {
    min-width: 0;
    padding: 8px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 9px;
    background: #f8fafc;
}

.cycle-summary-metric--success[b-063bjhmyf4] {
    background: rgba(16, 185, 129, 0.06);
}

.cycle-summary-metric--warning[b-063bjhmyf4] {
    background: rgba(245, 158, 11, 0.07);
}

.cycle-summary-metric--danger[b-063bjhmyf4] {
    background: rgba(220, 38, 38, 0.06);
}

.cycle-summary-metric--info[b-063bjhmyf4] {
    background: rgba(59, 130, 246, 0.06);
}

.cycle-summary-metric-value[b-063bjhmyf4] {
    color: var(--text-900, #0f172a);
    font-size: 17px;
    line-height: 1;
    font-weight: 800;
}

.cycle-summary-metric-label[b-063bjhmyf4] {
    margin-top: 4px;
    overflow: hidden;
    color: var(--text-500, #64748b);
    font-size: 10.5px;
    line-height: 1.2;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cycle-summary-date-grid[b-063bjhmyf4] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px 14px;
}

.cycle-summary-date[b-063bjhmyf4] {
    min-width: 0;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.16);
}

.cycle-summary-date-label[b-063bjhmyf4] {
    color: var(--text-500, #64748b);
    font-size: 10.5px;
    font-weight: 700;
}

.cycle-summary-date-value[b-063bjhmyf4] {
    margin-top: 2px;
    color: var(--text-900, #0f172a);
    font-size: 12px;
    font-weight: 700;
}

.cycle-summary-attention[b-063bjhmyf4] {
    padding: 12px;
    border: 1px solid rgba(245, 158, 11, 0.28);
    border-radius: 13px;
    background: rgba(255, 251, 235, 0.72);
}

.cycle-summary-attention-count[b-063bjhmyf4] {
    min-width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #f59e0b;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.cycle-summary-attention-list[b-063bjhmyf4] {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.cycle-summary-attention-item[b-063bjhmyf4] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    padding: 8px 10px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-left-width: 3px;
    border-radius: 9px;
    background: #fff;
}

.cycle-summary-attention-item--warning[b-063bjhmyf4] {
    border-left-color: #f59e0b;
}

.cycle-summary-attention-item--danger[b-063bjhmyf4] {
    border-left-color: #dc2626;
}

.cycle-summary-attention-item--neutral[b-063bjhmyf4] {
    border-left-color: #64748b;
}

.cycle-summary-attention-severity[b-063bjhmyf4] {
    color: var(--text-600, #475569);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.cycle-summary-attention-message[b-063bjhmyf4] {
    color: var(--text-800, #1e293b);
    font-size: 12px;
    line-height: 1.35;
}

.cycle-summary-clear-state[b-063bjhmyf4] {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 11px 13px;
    border: 1px solid rgba(16, 185, 129, 0.25);
    border-radius: 12px;
    background: rgba(16, 185, 129, 0.06);
    color: #065f46;
    font-size: 12px;
    font-weight: 700;
}

.cycle-summary-clear-icon[b-063bjhmyf4] {
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #10b981;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
}

.cycle-summary-footer[b-063bjhmyf4] {
    flex: 0 0 auto;
    min-height: 64px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 12px 16px;
    border-top: 1px solid rgba(148, 163, 184, 0.22);
    background: #fff;
}

.cycle-summary-footer .btn[b-063bjhmyf4] {
    min-height: 36px;
    padding: 6px 14px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
}

/* =====================================
   Cycle Summary Section Actions
   ---------------------------------------------------------
   Places Cycle-specific navigation beside each related
   workflow total without changing the panel layout.
   ===================================== */

.cycle-summary-panel-header-actions[b-063bjhmyf4] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
}

.cycle-summary-section-link[b-063bjhmyf4] {
    appearance: none;
    padding: 0;
    border: 0;
    background: transparent;
    color: #2563eb;
    font-size: 11px;
    line-height: 1.2;
    font-weight: 750;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}

    .cycle-summary-section-link:hover[b-063bjhmyf4] {
        color: #1d4ed8;
        text-decoration: underline;
        text-underline-offset: 2px;
    }

    .cycle-summary-section-link:focus-visible[b-063bjhmyf4] {
        outline: 2px solid rgba(37, 99, 235, 0.35);
        outline-offset: 3px;
        border-radius: 3px;
    }

/* =====================================
   Cycle Summary Responsive Behavior
   ---------------------------------------------------------
   Stacks the operational panels and footer controls on
   smaller viewports while preserving internal scrolling.
   ===================================== */

@media (max-width: 900px) {
    .cycle-summary-shell[b-063bjhmyf4] {
        padding: 14px;
    }

    .cycle-summary-card[b-063bjhmyf4] {
        width: calc(100vw - 28px);
        max-height: calc(100vh - 28px);
    }

    .cycle-summary-operational-grid[b-063bjhmyf4] {
        grid-template-columns: 1fr;
    }

    .cycle-summary-panel-header-actions[b-063bjhmyf4] {
        gap: 8px;
    }

    .cycle-summary-section-link[b-063bjhmyf4] {
        font-size: 10.5px;
    }

    .cycle-summary-footer[b-063bjhmyf4] {
        align-items: stretch;
        flex-direction: column;
    }
}
/* /Components/Shared/Promotions/DistributorPricingDetailShared.razor.rz.scp.css */
/* Distributor Pricing Detail shared styles */
/* ---------------------------------------------------------
   Shared visual layer for WAM Admin and Distributor Promotion
   Pricing detail pages. Parent pages own workflow actions.
   --------------------------------------------------------- */

/* Page shell and shared cards */
/* ---------------------------------------------------------
   Establishes the fixed-height pricing workspace and reusable
   card shells for overview and pricing item sections.
   --------------------------------------------------------- */

.pricing-detail-root[b-9z37fdyvu1] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.pricing-detail-items-card[b-9z37fdyvu1] {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.pricing-detail-card[b-9z37fdyvu1] {
  background: #fff;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 12px;
  overflow: hidden;
}

.pricing-detail-summary-card-grid[b-9z37fdyvu1] {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
  align-items: stretch;
}

.pricing-detail-context-card[b-9z37fdyvu1],
.pricing-detail-workflow-card[b-9z37fdyvu1] {
  min-width: 0;
  min-height: auto;
}

.pricing-detail-context-header[b-9z37fdyvu1] {
  min-height: 27px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 4px 10px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.12);
  background: #f1f5f9;
}

.pricing-detail-workflow-header[b-9z37fdyvu1] {
  background: #effaf8;
}

.pricing-detail-context-title[b-9z37fdyvu1] {
  color: var(--text-600, #64748b);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.pricing-detail-context-body[b-9z37fdyvu1] {
  padding: 8px 12px 9px;
}

.pricing-detail-context-card .pricing-detail-context-body[b-9z37fdyvu1],
.pricing-detail-workflow-card .pricing-detail-context-body[b-9z37fdyvu1] {
  min-height: 82px;
}

.pricing-detail-context-grid[b-9z37fdyvu1] {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.15fr) minmax(72px, 0.35fr);
  gap: 0;
  margin-top: 8px;
  border: 1px solid rgba(25, 35, 68, 0.10);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(216, 226, 232, 0.10);
}

  .pricing-detail-context-grid .pricing-detail-field[b-9z37fdyvu1] {
    min-width: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    background: transparent;
  }

    .pricing-detail-context-grid .pricing-detail-field + .pricing-detail-field[b-9z37fdyvu1] {
      border-left: 1px solid rgba(25, 35, 68, 0.10);
    }

  .pricing-detail-context-grid .pricing-detail-label[b-9z37fdyvu1] {
    min-height: 28px;
    margin-bottom: 0;
    padding: 5px 10px 4px 10px;
    display: flex;
    align-items: center;
    background: rgba(117, 140, 167, 0.07);
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
    color: var(--text-500, #64748b);
    font-size: 10px;
    line-height: 1.1;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    white-space: nowrap;
  }

  .pricing-detail-context-grid .pricing-detail-value[b-9z37fdyvu1] {
    min-width: 0;
    padding: 10px 10px 9px 10px;
    color: var(--text-900, #0f2147);
    font-size: 12px;
    line-height: 1.18;
    font-weight: 500;
    overflow-wrap: normal;
    word-break: normal;
  }

.pricing-detail-workflow-message[b-9z37fdyvu1] {
  margin-bottom: 8px;
  color: var(--text-900, #0f2147);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

.pricing-detail-workflow-review-grid[b-9z37fdyvu1] {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0;
  margin-top: 8px;
  border: 1px solid rgba(25, 35, 68, 0.10);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(216, 226, 232, 0.10);
}

.pricing-detail-workflow-review-cell[b-9z37fdyvu1] {
  min-width: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  background: transparent;
}

  .pricing-detail-workflow-review-cell + .pricing-detail-workflow-review-cell[b-9z37fdyvu1] {
    border-left: 1px solid rgba(25, 35, 68, 0.10);
  }

.pricing-detail-workflow-review-header[b-9z37fdyvu1] {
  min-height: 28px;
  margin-bottom: 0;
  padding: 5px 10px 4px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: rgba(91, 196, 191, 0.08);
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
  color: var(--text-500, #64748b);
  font-size: 10px;
  line-height: 1.1;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.pricing-detail-workflow-review-value[b-9z37fdyvu1] {
  min-width: 0;
  padding: 10px 10px 9px 10px;
  color: var(--text-900, #0f2147);
  font-size: 12px;
  line-height: 1.18;
  font-weight: 500;
  overflow-wrap: normal;
  word-break: normal;
}

.pricing-detail-workflow-link[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--link-600, #2563eb);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.1;
  cursor: pointer;
  text-transform: none;
  letter-spacing: 0;
  white-space: nowrap;
}

  .pricing-detail-workflow-link i[b-9z37fdyvu1] {
    font-size: 10px;
    line-height: 1;
  }

  .pricing-detail-workflow-link:hover:not(:disabled) span[b-9z37fdyvu1] {
    text-decoration: underline;
  }

  .pricing-detail-workflow-link:disabled[b-9z37fdyvu1] {
    color: var(--text-500, #94a3b8);
    cursor: not-allowed;
  }

  .pricing-detail-workflow-link:focus[b-9z37fdyvu1],
  .pricing-detail-workflow-link:focus-visible[b-9z37fdyvu1],
  .pricing-detail-workflow-link:active[b-9z37fdyvu1] {
    outline: 0;
    border: 0;
    box-shadow: none;
  }

.pricing-detail-promotion-title[b-9z37fdyvu1] {
  margin: 0;
  color: var(--text-900, #0f2147);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
}

.pricing-detail-context-title-line[b-9z37fdyvu1] {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
  flex-wrap: wrap;
}

.pricing-detail-promo-period-inline[b-9z37fdyvu1] {
  flex: 0 0 auto;
  color: var(--text-700, #334155);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  white-space: nowrap;
}

  .pricing-detail-promo-period-inline[b-9z37fdyvu1]::before {
    content: "·";
    margin-right: 8px;
    color: var(--text-500, #94a3b8);
  }

.pricing-detail-muted[b-9z37fdyvu1] {
  color: var(--text-600, #64748b);
  font-size: 13px;
  line-height: 1.35;
}

.pricing-detail-small[b-9z37fdyvu1] {
  font-size: 12px;
}

.pricing-detail-summary-grid[b-9z37fdyvu1] {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  padding: 9px 12px 10px;
}

.pricing-detail-label[b-9z37fdyvu1] {
  color: var(--text-600, #64748b);
  font-size: 12px;
  line-height: 1.25;
  margin-bottom: 4px;
}

/* Field labels and information tooltips */
/* ---------------------------------------------------------
   Provides compact field guidance while preserving the dense
   Promotion Pricing row layout.
   --------------------------------------------------------- */
.pricing-detail-label--with-info[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  width: fit-content;
  max-width: 100%;
  white-space: nowrap;
}

.pricing-detail-field-info[b-9z37fdyvu1] {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-500, #94a3b8);
  font-size: 11px;
  line-height: 1;
  cursor: help;
}

  .pricing-detail-field-info:hover[b-9z37fdyvu1],
  .pricing-detail-field-info:focus[b-9z37fdyvu1] {
    color: var(--brand-600, #2563eb);
  }

  .pricing-detail-field-info:focus[b-9z37fdyvu1] {
    outline: none;
  }

  .pricing-detail-field-info[b-9z37fdyvu1]::after {
    content: attr(data-tooltip);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 8px);
    z-index: 80;
    width: max-content;
    max-width: 285px;
    padding: 10px 12px;
    border: 1px solid rgba(245, 158, 11, 0.30);
    border-radius: 10px;
    background: #fff8e6;
    color: #475569;
    box-shadow: 0 16px 32px rgba(15, 23, 42, 0.16);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.35;
    text-transform: none;
    letter-spacing: 0;
    white-space: normal;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, 4px);
    transition: opacity 0.12s ease, transform 0.12s ease;
  }

  .pricing-detail-field-info[b-9z37fdyvu1]::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: calc(100% + 3px);
    z-index: 81;
    width: 10px;
    height: 10px;
    border-right: 1px solid rgba(245, 158, 11, 0.30);
    border-bottom: 1px solid rgba(245, 158, 11, 0.30);
    background: #fff8e6;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, 4px) rotate(45deg);
    transition: opacity 0.12s ease, transform 0.12s ease;
  }

  .pricing-detail-field-info:hover[b-9z37fdyvu1]::after,
  .pricing-detail-field-info:focus[b-9z37fdyvu1]::after,
  .pricing-detail-field-info:hover[b-9z37fdyvu1]::before,
  .pricing-detail-field-info:focus[b-9z37fdyvu1]::before {
    opacity: 1;
    transform: translate(-50%, 0);
  }

.pricing-detail-field-info--align-right[b-9z37fdyvu1]::after {
  right: 0;
  left: auto;
  transform: translate(0, 4px);
}

.pricing-detail-field-info--align-right[b-9z37fdyvu1]::before {
  right: 2px;
  left: auto;
  transform: translate(0, 4px) rotate(45deg);
}

.pricing-detail-field-info--align-right:hover[b-9z37fdyvu1]::after,
.pricing-detail-field-info--align-right:focus[b-9z37fdyvu1]::after {
  transform: translate(0, 0);
}

.pricing-detail-field-info--align-right:hover[b-9z37fdyvu1]::before,
.pricing-detail-field-info--align-right:focus[b-9z37fdyvu1]::before {
  transform: translate(0, 0) rotate(45deg);
}

.pricing-detail-field-info--below[b-9z37fdyvu1]::after {
  top: calc(100% + 8px);
  bottom: auto;
  z-index: 120;
  transform: translate(-50%, -4px);
}

.pricing-detail-field-info--below[b-9z37fdyvu1]::before {
  top: calc(100% + 3px);
  bottom: auto;
  z-index: 121;
  border-right: 0;
  border-bottom: 0;
  border-left: 1px solid rgba(245, 158, 11, 0.30);
  border-top: 1px solid rgba(245, 158, 11, 0.30);
  transform: translate(-50%, -4px) rotate(45deg);
}

.pricing-detail-field-info--below:hover[b-9z37fdyvu1]::after,
.pricing-detail-field-info--below:focus[b-9z37fdyvu1]::after {
  transform: translate(-50%, 0);
}

.pricing-detail-field-info--below:hover[b-9z37fdyvu1]::before,
.pricing-detail-field-info--below:focus[b-9z37fdyvu1]::before {
  transform: translate(-50%, 0) rotate(45deg);
}

.pricing-detail-field-info--align-right.pricing-detail-field-info--below[b-9z37fdyvu1]::after {
  right: 0;
  left: auto;
  transform: translate(0, -4px);
}

.pricing-detail-field-info--align-right.pricing-detail-field-info--below[b-9z37fdyvu1]::before {
  right: 2px;
  left: auto;
  transform: translate(0, -4px) rotate(45deg);
}

.pricing-detail-field-info--align-right.pricing-detail-field-info--below:hover[b-9z37fdyvu1]::after,
.pricing-detail-field-info--align-right.pricing-detail-field-info--below:focus[b-9z37fdyvu1]::after {
  transform: translate(0, 0);
}

.pricing-detail-field-info--align-right.pricing-detail-field-info--below:hover[b-9z37fdyvu1]::before,
.pricing-detail-field-info--align-right.pricing-detail-field-info--below:focus[b-9z37fdyvu1]::before {
  transform: translate(0, 0) rotate(45deg);
}

.pricing-detail-value[b-9z37fdyvu1] {
  color: var(--text-900, #0f2147);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

/* Pricing review transition band */
/* ---------------------------------------------------------
   Keeps the review title centered while overview visibility
   and preference controls remain anchored at the left edge.
   --------------------------------------------------------- */

.pricing-detail-intro-band[b-9z37fdyvu1] {
  position: relative;
  flex: 0 0 auto;
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 0 2px;
  margin: 0;
}

.pricing-detail-intro-actions[b-9z37fdyvu1] {
  position: absolute;
  left: 0;
  bottom: 4px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  white-space: nowrap;
}

.pricing-detail-intro-center[b-9z37fdyvu1] {
  position: relative;
  z-index: 1;
  padding: 5px 18px;
  border: 1px solid rgba(30, 64, 175, 0.75);
  border-radius: 999px;
  background: #fff;
  color: var(--text-600, #64748b);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: 0.035em;
  text-transform: uppercase;
  white-space: nowrap;
}

.pricing-detail-intro-side[b-9z37fdyvu1] {
  display: none;
}

.pricing-detail-summary-inline-toggle[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text-600, #64748b);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}

  .pricing-detail-summary-inline-toggle i[b-9z37fdyvu1] {
    color: var(--text-500, #94a3b8);
    font-size: 11px;
    line-height: 1;
  }

  .pricing-detail-summary-inline-toggle:hover span[b-9z37fdyvu1] {
    text-decoration: underline;
  }

  .pricing-detail-summary-inline-toggle:focus[b-9z37fdyvu1],
  .pricing-detail-summary-inline-toggle:focus-visible[b-9z37fdyvu1],
  .pricing-detail-summary-inline-toggle:active[b-9z37fdyvu1] {
    outline: 0;
    border: 0;
    box-shadow: none;
  }

/* Status and worksheet badges */
/* ---------------------------------------------------------
   Displays Promotion Pricing workflow status and worksheet
   type indicators in the overview area.
   --------------------------------------------------------- */

.pricing-detail-status-badge[b-9z37fdyvu1] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

.pricing-detail-status-badge--released[b-9z37fdyvu1] {
  background: #dbeafe;
  color: #2563eb;
}

.pricing-detail-status-badge--progress[b-9z37fdyvu1] {
  background: #fef3c7;
  color: #92400e;
}

.pricing-detail-status-badge--submitted[b-9z37fdyvu1] {
  background: #dbeafe;
  color: #1d4ed8;
}

.pricing-detail-status-badge--returned[b-9z37fdyvu1] {
  background: #ffe4e6;
  color: #e11d48;
}

.pricing-detail-status-badge--completed[b-9z37fdyvu1] {
  background: #d1fae5;
  color: #15803d;
}

.pricing-detail-status-badge--cancelled[b-9z37fdyvu1],
.pricing-detail-status-badge--default[b-9z37fdyvu1] {
  background: #e2e8f0;
  color: #475569;
}

.pricing-detail-worksheet-badge[b-9z37fdyvu1] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(37, 99, 235, 0.16);
  background: rgba(59, 130, 246, 0.08);
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

/* Pricing section header */
/* ---------------------------------------------------------
   Provides the section title, lifecycle guidance, and optional
   workflow actions supplied by parent pages.
   --------------------------------------------------------- */

.pricing-detail-section-header[b-9z37fdyvu1] {
  padding: 7px 12px 7px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.14);
}

.pricing-detail-section-heading[b-9z37fdyvu1] {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.pricing-detail-section-title-row[b-9z37fdyvu1] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.pricing-detail-section-primary-actions[b-9z37fdyvu1] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

  .pricing-detail-section-primary-actions[b-9z37fdyvu1]  .btn {
    min-height: 30px;
    padding: 5px 12px;
    font-size: 13px;
    line-height: 1.2;
  }

.pricing-detail-section-meta-row[b-9z37fdyvu1] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-width: 0;
}

/* View preference switch */
/* ---------------------------------------------------------
   Controls persisted overview and guidance visibility without
   changing command placement.
   --------------------------------------------------------- */

.pricing-detail-view-control i[b-9z37fdyvu1] {
  width: 14px;
  color: currentColor;
  font-size: 13px;
  text-align: center;
}

.pricing-detail-view-preference-switch[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  color: var(--text-600, #64748b);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}

  .pricing-detail-view-preference-switch input[b-9z37fdyvu1] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
  }

.pricing-detail-view-preference-track[b-9z37fdyvu1] {
  position: relative;
  width: 30px;
  height: 16px;
  flex: 0 0 auto;
  border: 1px solid rgba(100, 116, 139, 0.34);
  border-radius: 999px;
  background: #cbd5e1;
  transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

.pricing-detail-view-preference-thumb[b-9z37fdyvu1] {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.24);
  transition: transform 0.15s ease;
}

.pricing-detail-view-preference-switch input:checked + .pricing-detail-view-preference-track[b-9z37fdyvu1] {
  border-color: var(--brand-600, #2563eb);
  background: var(--brand-600, #2563eb);
}

  .pricing-detail-view-preference-switch input:checked + .pricing-detail-view-preference-track
  .pricing-detail-view-preference-thumb[b-9z37fdyvu1] {
    transform: translateX(14px);
  }

.pricing-detail-view-preference-switch input:focus-visible + .pricing-detail-view-preference-track[b-9z37fdyvu1] {
  box-shadow: var( --focus-ring, 0 0 0 3px rgba(37, 99, 235, 0.18) );
}

.pricing-detail-view-preference-switch:hover
.pricing-detail-view-preference-label[b-9z37fdyvu1] {
  color: var(--text-800, #1e293b);
}

/* View commands */
/* ---------------------------------------------------------
   Presents overview and guidance visibility controls as compact
   link-style actions while preserving current placement.
   --------------------------------------------------------- */

.pricing-detail-summary-inline-toggle[b-9z37fdyvu1],
.pricing-detail-guidance-toggle[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--link-600, #2563eb);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
  box-shadow: none;
  transition: color 0.15s ease;
}

  .pricing-detail-summary-inline-toggle i[b-9z37fdyvu1],
  .pricing-detail-guidance-toggle i[b-9z37fdyvu1] {
    color: currentColor;
    font-size: 11px;
    line-height: 1;
    transition: color 0.15s ease;
  }

  .pricing-detail-summary-inline-toggle:hover[b-9z37fdyvu1],
  .pricing-detail-guidance-toggle:hover[b-9z37fdyvu1] {
    color: var(--link-700, #1d4ed8);
  }

    .pricing-detail-summary-inline-toggle:hover span[b-9z37fdyvu1],
    .pricing-detail-guidance-toggle:hover span[b-9z37fdyvu1] {
      text-decoration: underline;
      text-underline-offset: 2px;
    }

  .pricing-detail-summary-inline-toggle:focus-visible[b-9z37fdyvu1],
  .pricing-detail-guidance-toggle:focus-visible[b-9z37fdyvu1] {
    outline: 2px solid rgba(37, 99, 235, 0.28);
    outline-offset: 3px;
    border-radius: 3px;
  }

  .pricing-detail-summary-inline-toggle:active[b-9z37fdyvu1],
  .pricing-detail-guidance-toggle:active[b-9z37fdyvu1] {
    color: var(--link-800, #1e40af);
  }

/* Expand and collapse commands */
/* ---------------------------------------------------------
   Provides one compact link-action treatment for table-level
   and row-level expansion without changing table layout.
   --------------------------------------------------------- */

.pricing-detail-expand-command[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  min-height: 20px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--link-600, #2563eb);
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
  transition: color 0.15s ease;
}

  .pricing-detail-expand-command i[b-9z37fdyvu1] {
    width: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: currentColor;
    font-size: 11px;
    line-height: 1;
  }

  .pricing-detail-expand-command:hover[b-9z37fdyvu1] {
    color: var(--link-700, #1d4ed8);
    background: transparent;
  }

    .pricing-detail-expand-command:hover span[b-9z37fdyvu1] {
      text-decoration: underline;
      text-underline-offset: 2px;
    }

  .pricing-detail-expand-command:focus[b-9z37fdyvu1],
  .pricing-detail-expand-command:active[b-9z37fdyvu1] {
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .pricing-detail-expand-command:focus-visible[b-9z37fdyvu1] {
    outline: 2px solid rgba(37, 99, 235, 0.28);
    outline-offset: 3px;
    border-radius: 3px;
  }

.pricing-detail-expand-command--all[b-9z37fdyvu1],
.pricing-detail-expand-command--row[b-9z37fdyvu1] {
  margin-left: auto;
}


/* Pricing guidance and section actions */
/* ---------------------------------------------------------
   Supports optional guidance visibility, section messaging,
   and parent-supplied actions for WAM Admin and Distributor
   Promotion Pricing pages.
   --------------------------------------------------------- */

.pricing-detail-guidance-actions[b-9z37fdyvu1] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  white-space: nowrap;
}

.pricing-detail-guidance-toggle:focus[b-9z37fdyvu1],
.pricing-detail-guidance-toggle:focus-visible[b-9z37fdyvu1],
.pricing-detail-guidance-toggle:active[b-9z37fdyvu1] {
  outline: 0;
  border: 0;
  box-shadow: none;
}

.pricing-detail-section-message-wrap[b-9z37fdyvu1] {
  min-width: 0;
  flex: 1 1 auto;
}

.pricing-detail-section-title[b-9z37fdyvu1] {
  margin: 0;
  color: var(--text-900, #0f2147);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
}

.pricing-detail-section-subtitle[b-9z37fdyvu1] {
  color: var(--text-700, #334155);
  font-size: 13px;
  line-height: 1.35;
}

.pricing-detail-section-actions[b-9z37fdyvu1] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.pricing-detail-expand-actions[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}

  .pricing-detail-expand-actions .pricing-detail-item-action[b-9z37fdyvu1] {
    color: var(--text-900, #0f2147);
    font-size: 13px;
    font-weight: 600;
  }

    .pricing-detail-expand-actions .pricing-detail-item-action i[b-9z37fdyvu1] {
      color: var(--brand-600, #2563eb);
    }

.pricing-detail-expand-button[b-9z37fdyvu1] {
  min-height: 28px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
}

.pricing-detail-expand-actions .pricing-detail-item-action:focus[b-9z37fdyvu1],
.pricing-detail-expand-actions .pricing-detail-item-action:focus-visible[b-9z37fdyvu1],
.pricing-detail-expand-actions .pricing-detail-item-action:active[b-9z37fdyvu1],
.pricing-detail-col-details .pricing-detail-item-action:focus[b-9z37fdyvu1],
.pricing-detail-col-details .pricing-detail-item-action:focus-visible[b-9z37fdyvu1],
.pricing-detail-col-details .pricing-detail-item-action:active[b-9z37fdyvu1] {
  outline: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Pricing section body */
/* ---------------------------------------------------------
   Hosts the internally scrolling item table while the section
   header and pager remain visually stable.
   --------------------------------------------------------- */

.pricing-detail-section-body[b-9z37fdyvu1] {
  min-height: 0;
  padding: 6px 10px 6px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  overflow: hidden;
}

/* Pricing item toolbar */
/* ---------------------------------------------------------
   Provides worksheet search and page-size controls without
   changing pricing calculations or source data.
   --------------------------------------------------------- */

.pricing-detail-item-toolbar[b-9z37fdyvu1] {
  flex: 0 0 auto;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 2px;
}

.pricing-detail-item-search[b-9z37fdyvu1] {
  flex: 1 1 auto;
  min-width: 0;
  display: grid;
  gap: 3px;
}

.pricing-detail-toolbar-page-size[b-9z37fdyvu1] {
  flex: 0 0 104px;
  min-width: 104px;
  display: grid;
  gap: 3px;
  margin: 0;
}

  .pricing-detail-toolbar-page-size span[b-9z37fdyvu1] {
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
  }

  .pricing-detail-toolbar-page-size .pricing-detail-pager-select[b-9z37fdyvu1] {
    width: 100%;
    min-height: 38px;
    height: 38px;
    padding: 6px 10px;
    border-radius: 8px;
    font-size: 14px;
  }

.pricing-detail-item-search-label[b-9z37fdyvu1] {
  margin: 0;
  color: var(--text-700, #334155);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

.pricing-detail-item-search-input[b-9z37fdyvu1] {
  min-height: 38px;
  height: 38px;
  font-size: 14px;
}

/* Lifecycle status message */
/* ---------------------------------------------------------
   Displays compact workflow guidance beneath the pricing
   section title.
   --------------------------------------------------------- */

.pricing-detail-section-message[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 4px 9px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.25;
  background: #f8fafc;
  color: #475569;
}

.pricing-detail-section-message--released[b-9z37fdyvu1] {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1d4ed8;
}

.pricing-detail-section-message--progress[b-9z37fdyvu1] {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #c2410c;
}

.pricing-detail-section-message--submitted[b-9z37fdyvu1] {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1d4ed8;
}

.pricing-detail-section-message--returned[b-9z37fdyvu1] {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
}

.pricing-detail-section-message--completed[b-9z37fdyvu1] {
  background: #f0fdf4;
  border-color: #bbf7d0;
  color: #15803d;
}

.pricing-detail-section-message--cancelled[b-9z37fdyvu1],
.pricing-detail-section-message--default[b-9z37fdyvu1] {
  background: #f8fafc;
  border-color: #e2e8f0;
  color: #475569;
}

/* Pricing table shell */
/* ---------------------------------------------------------
   Preserves internal vertical and horizontal scrolling, sticky
   headers, fixed column sizing, and compact pricing density.
   --------------------------------------------------------- */

.pricing-detail-table-region[b-9z37fdyvu1] {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid rgba(25, 35, 68, 0.10);
  border-radius: 12px;
  background: #ffffff;
}

.pricing-detail-table-wrap[b-9z37fdyvu1] {
  width: 100%;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  background: #fff;
}

.pricing-detail-table[b-9z37fdyvu1] {
  width: 100%;
  margin: 0;
  min-width: 920px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--text-900, #0f2147);
  font-size: 13px;
}

.pricing-detail-table--prepack[b-9z37fdyvu1] {
  min-width: 1010px;
}

.pricing-detail-table thead th[b-9z37fdyvu1] {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 8px 8px;
  border-bottom: 0;
  background: #ffffff;
  color: #64748b;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.035em;
  line-height: 1.2;
  text-align: left;
  text-transform: uppercase;
  vertical-align: bottom;
  white-space: nowrap;
  box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
}

.pricing-detail-table tbody td[b-9z37fdyvu1] {
  padding: 9px 8px;
  border-bottom: 1px solid #edf2f7;
  background: #ffffff;
  color: var(--text-900, #0f2147);
  line-height: 1.35;
  vertical-align: middle;
}

.pricing-detail-table tbody tr:hover td[b-9z37fdyvu1] {
  background: #fbfdff;
}

.pricing-detail-table tbody tr:last-child td[b-9z37fdyvu1] {
  border-bottom: 0;
}

/* Pricing table columns */

.pricing-detail-col-sequence[b-9z37fdyvu1] {
  width: 34px;
  min-width: 34px;
  max-width: 34px;
  text-align: left;
}

.pricing-detail-col-image[b-9z37fdyvu1] {
  width: 54px;
  min-width: 54px;
  max-width: 54px;
  text-align: left;
  white-space: nowrap;
}

.pricing-detail-col-item-number[b-9z37fdyvu1] {
  width: 96px;
  min-width: 88px;
}

.pricing-detail-col-pack-item-number[b-9z37fdyvu1] {
  width: 92px;
  min-width: 84px;
}

.pricing-detail-col-description[b-9z37fdyvu1] {
  width: auto;
  min-width: 0;
}

.pricing-detail-col-category[b-9z37fdyvu1] {
  width: 76px;
  min-width: 68px;
}

.pricing-detail-col-subtype[b-9z37fdyvu1] {
  width: 118px;
  min-width: 104px;
}

.pricing-detail-col-details[b-9z37fdyvu1] {
  width: 104px;
  min-width: 96px;
  max-width: 104px;
  text-align: right;
  white-space: nowrap;
}

.pricing-detail-table--prepack .pricing-detail-col-description[b-9z37fdyvu1] {
  min-width: 0;
}

/* Pricing item image thumbnails */

.pricing-detail-image-trigger[b-9z37fdyvu1] {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.pricing-detail-image-tile[b-9z37fdyvu1] {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid rgba(25, 35, 68, 0.12);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
  transition: transform 120ms ease, box-shadow 120ms ease;
}

.pricing-detail-image-trigger:hover .pricing-detail-image-tile[b-9z37fdyvu1],
.pricing-detail-image-trigger:focus-visible .pricing-detail-image-tile[b-9z37fdyvu1] {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16);
}

.pricing-detail-image-tile--prepack[b-9z37fdyvu1] {
  width: 46px;
  height: 46px;
  border-color: rgba(37, 99, 235, 0.18);
  background: linear-gradient(180deg, #ffffff, #f8fafc);
}

.pricing-detail-image-tile--prepack-summary[b-9z37fdyvu1] {
  width: 54px;
  height: 54px;
  border-color: rgba(31, 59, 99, 0.22);
  border-radius: 10px;
  background: #ffffff;
}

.pricing-detail-image-thumb[b-9z37fdyvu1] {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.pricing-detail-image-hover-card[b-9z37fdyvu1] {
  position: absolute;
  left: calc(100% + 12px);
  top: 0;
  z-index: 35;
  width: 190px;
  padding: 8px;
  border: 1px solid rgba(25, 35, 68, 0.12);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 140ms ease, visibility 140ms ease;
}

.pricing-detail-table tbody tr:nth-last-child(-n + 2) .pricing-detail-image-hover-card[b-9z37fdyvu1] {
  top: auto;
  bottom: 0;
}

.pricing-detail-image-hover-card--summary[b-9z37fdyvu1] {
  top: 0;
  bottom: auto;
  z-index: 60;
  width: 210px;
}

.pricing-detail-image-trigger:hover .pricing-detail-image-hover-card[b-9z37fdyvu1],
.pricing-detail-image-trigger:focus-visible .pricing-detail-image-hover-card[b-9z37fdyvu1] {
  opacity: 1;
  visibility: visible;
}

.pricing-detail-image-hover-preview[b-9z37fdyvu1] {
  width: 100%;
  height: 190px;
  object-fit: contain;
  display: block;
  border-radius: 12px;
  background: #f8fafc;
}

/* Sortable pricing headers */
/* ---------------------------------------------------------
   Styles sortable worksheet headers for MFG item number and
   item description.
   --------------------------------------------------------- */

.pricing-detail-sort-button[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
  white-space: nowrap;
}

  .pricing-detail-sort-button:hover[b-9z37fdyvu1],
  .pricing-detail-sort-button--active[b-9z37fdyvu1] {
    color: #2563eb;
  }

.pricing-detail-sort-indicator[b-9z37fdyvu1] {
  font-size: 11px;
  line-height: 1;
}

/* Pre-Pack pricing summary */
/* ---------------------------------------------------------
   Displays Pre-Pack group pricing with the same compact visual
   language used by expanded Open-Stock pricing rows.
   --------------------------------------------------------- */

.pricing-detail-prepack-summary[b-9z37fdyvu1] {
  position: relative;
  z-index: 4;
  flex: 0 0 auto;
  width: 100%;
  box-sizing: border-box;
  margin: 0 0 8px 0;
  overflow-x: hidden;
  overflow-y: visible;
  border: 1px solid rgba(25, 35, 68, 0.14);
  border-radius: 12px;
  background: #ffffff;
}

  .pricing-detail-prepack-summary:has(.pricing-detail-image-trigger:hover)[b-9z37fdyvu1],
  .pricing-detail-prepack-summary:has(.pricing-detail-image-trigger:focus-visible)[b-9z37fdyvu1] {
    overflow: visible;
  }

.pricing-detail-prepack-summary-panel[b-9z37fdyvu1] {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  padding: 0 12px 10px;
  color: var(--text-900, #0f2147);
  font-size: 13px;
}

/* Pre-Pack group identity row */
.pricing-detail-prepack-summary-row--overview[b-9z37fdyvu1] {
  display: grid;
  grid-template-columns: 120px minmax(260px, 1fr) minmax(168px, 190px) 86px;
  align-items: stretch;
  width: auto;
  min-height: 72px;
  margin: 0 -12px 12px;
  padding: 0;
  overflow: visible;
  border-bottom: 1px solid rgba(25, 35, 68, 0.12);
  border-top-left-radius: 11px;
  border-top-right-radius: 11px;
  background: #ffffff;
}

.pricing-detail-prepack-summary-cell[b-9z37fdyvu1] {
  min-width: 0;
  display: grid;
  grid-template-rows: 28px 50px;
  align-items: stretch;
}

.pricing-detail-prepack-summary-cell[b-9z37fdyvu1] {
  overflow: visible;
}

.pricing-detail-prepack-summary-label[b-9z37fdyvu1] {
  min-height: 28px;
  margin: 0;
  padding: 7px 10px 6px;
  display: flex;
  align-items: center;
  background: linear-gradient(180deg, #19365f, #102746);
  color: #ffffff;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.035em;
  line-height: 1.15;
  text-transform: uppercase;
  white-space: nowrap;
}

.pricing-detail-prepack-summary-cell:first-child .pricing-detail-prepack-summary-label[b-9z37fdyvu1] {
  border-top-left-radius: 11px;
}

.pricing-detail-prepack-summary-cell:last-child .pricing-detail-prepack-summary-label[b-9z37fdyvu1] {
  border-top-right-radius: 11px;
}

.pricing-detail-prepack-summary-cell--image .pricing-detail-image-trigger[b-9z37fdyvu1],
.pricing-detail-prepack-summary-cell--description .pricing-detail-table-tooltip-cell[b-9z37fdyvu1],
.pricing-detail-prepack-summary-cell--cost-context .pricing-detail-prepack-cost-context[b-9z37fdyvu1],
.pricing-detail-prepack-summary-cell--gp .pricing-detail-gp-cell[b-9z37fdyvu1] {
  align-self: center;
  justify-self: start;
  margin: 0 5px;
}

.pricing-detail-prepack-summary-cell--description[b-9z37fdyvu1]  .pricing-detail-table-tooltip-cell {
  width: calc(100% - 20px);
  min-width: 0;
  justify-self: start;
  text-align: left;
}

.pricing-detail-prepack-summary-description-text[b-9z37fdyvu1] {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  color: #0f3fa9;
  font-weight: 850;
  line-height: 1.25;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pricing-detail-prepack-cost-context[b-9z37fdyvu1] {
  display: grid;
  gap: 3px;
}

.pricing-detail-prepack-cost-context-line[b-9z37fdyvu1] {
  display: grid;
  grid-template-columns: 68px auto;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
  color: #0f2147;
  font-size: 12px;
  line-height: 1.2;
}

  .pricing-detail-prepack-cost-context-line span[b-9z37fdyvu1] {
    color: #5b78a0;
    font-weight: 750;
    white-space: nowrap;
  }

  .pricing-detail-prepack-cost-context-line strong[b-9z37fdyvu1] {
    color: #0f2147;
    font-weight: 850;
    white-space: nowrap;
  }

.pricing-detail-prepack-summary-cell--gp .pricing-detail-gp-cell[b-9z37fdyvu1] {
  justify-content: flex-start;
}

/* Pre-Pack editable group panel */
.pricing-detail-prepack-summary-edit-panel[b-9z37fdyvu1] {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid rgba(25, 35, 68, 0.14);
  border-radius: 12px;
  background: #f8fafc;
  overflow: visible;
  flex: 0 0 auto;
}

.pricing-detail-expanded-grid--prepack-group-entry[b-9z37fdyvu1] {
  grid-template-columns: minmax(112px, 132px) /* Retail Delivery */
  minmax(118px, 142px) /* Dist Pack Item # */
  minmax(84px, 98px) /* Dist Base Cost */
  minmax(78px, 92px) /* Allowance */
  minmax(74px, 86px) /* Spiff */
  minmax(72px, 86px) /* Total Count */
  minmax(68px, 78px) /* SRP */
  minmax(112px, 128px); /* Pre-Book / Ship Now */
  align-items: end;
  gap: 6px 8px;
}

.pricing-detail-expanded-grid--prepack-group-book[b-9z37fdyvu1] {
  grid-template-columns: minmax(112px, 132px) /* Display Start */
  minmax(118px, 142px) /* Display End */
  minmax(220px, 1fr) /* Promo Comments */
  minmax(220px, 1fr); /* WAM Notes */
  align-items: end;
  gap: 6px 8px;
}

.pricing-detail-prepack-summary-edit-panel .pricing-detail-expanded-field[b-9z37fdyvu1] {
  min-width: 0;
}

.pricing-detail-prepack-summary-edit-panel .pricing-detail-input[b-9z37fdyvu1],
.pricing-detail-prepack-summary-edit-panel .pricing-detail-input-select[b-9z37fdyvu1] {
  width: 100%;
}

.pricing-detail-prepack-summary-edit-panel .pricing-detail-affix-field[b-9z37fdyvu1] {
  width: 100%;
}

.pricing-detail-prepack-summary-edit-panel .pricing-detail-textarea[b-9z37fdyvu1] {
  min-height: 30px;
  height: 30px;
  max-height: 42px;
}

.pricing-detail-input-readonly:disabled[b-9z37fdyvu1] {
  background-color: #eef2f6;
  border-color: #d8e0ea;
  color: #0f2147;
  font-weight: 800;
  opacity: 1;
  cursor: not-allowed;
}

.pricing-detail-prepack-summary .pricing-detail-image-trigger[b-9z37fdyvu1] {
  z-index: 5;
}

.pricing-detail-image-tile--prepack-summary[b-9z37fdyvu1] {
  width: 48px;
  height: 48px;
  border-color: rgba(31, 59, 99, 0.18);
  border-radius: 10px;
  background: #ffffff;
}

.pricing-detail-image-hover-card--summary[b-9z37fdyvu1] {
  display: none;
  top: 0;
  bottom: auto;
  left: calc(100% + 12px);
  z-index: 250;
  width: 210px;
}

.pricing-detail-image-trigger:hover .pricing-detail-image-hover-card--summary[b-9z37fdyvu1],
.pricing-detail-image-trigger:focus-visible .pricing-detail-image-hover-card--summary[b-9z37fdyvu1] {
  display: block;
}

/* Pre-Pack table fields */

.pricing-detail-col-prepack-item-count[b-9z37fdyvu1] {
  width: 84px;
  min-width: 78px;
  max-width: 84px;
  text-align: left;
  white-space: nowrap;
}

.pricing-detail-col-prepack-retail[b-9z37fdyvu1] {
  width: 84px;
  min-width: 78px;
  max-width: 84px;
  text-align: left;
  white-space: nowrap;
}

.pricing-detail-input--inline[b-9z37fdyvu1] {
  max-width: 76px;
}

.pricing-detail-affix-field--inline[b-9z37fdyvu1] {
  max-width: 82px;
}

/* Pre-Pack component detail panel */
/* ---------------------------------------------------------
   Keeps component edits compact while component count and
   retail support the Pre-Pack group G.P. % calculation.
   --------------------------------------------------------- */

.pricing-detail-expanded-grid--prepack-component[b-9z37fdyvu1] {
  grid-template-columns: 140px 140px minmax(320px, 1fr);
  align-items: end;
  gap: 8px;
}

  .pricing-detail-expanded-grid--prepack-component .pricing-detail-expanded-field--comment[b-9z37fdyvu1] {
    align-self: stretch;
  }

    .pricing-detail-expanded-grid--prepack-component .pricing-detail-expanded-field--comment .pricing-detail-value[b-9z37fdyvu1] {
      min-height: 31px;
      display: flex;
      align-items: center;
      padding: 6px 10px;
      border: 1px dashed rgba(31, 59, 99, 0.18);
      border-radius: 8px;
      background: rgba(248, 250, 252, 0.80);
      color: #4f6b91;
      font-size: 11px;
      font-weight: 650;
      line-height: 1.25;
    }

/* G.P. % calculation display */
/* ---------------------------------------------------------
   Shows read-only gross profit values and compact item-level
   calculation context.
   --------------------------------------------------------- */

.pricing-detail-col-cost-context[b-9z37fdyvu1] {
    width: 106px;
    min-width: 100px;
    max-width: 106px;
    text-align: left;
    white-space: nowrap;
}

.pricing-detail-cost-context[b-9z37fdyvu1] {
  display: grid;
  gap: 2px;
  color: var(--text-700, #334155);
  font-size: 11px;
  line-height: 1.15;
}

.pricing-detail-cost-context-line[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  white-space: nowrap;
}

  .pricing-detail-cost-context-line span[b-9z37fdyvu1] {
    color: var(--text-500, #64748b);
    font-weight: 700;
  }

  .pricing-detail-cost-context-line strong[b-9z37fdyvu1] {
    color: var(--text-900, #0f2147);
    font-weight: 800;
  }

.pricing-detail-col-gp[b-9z37fdyvu1] {
  width: 86px;
  min-width: 82px;
  max-width: 86px;
  text-align: left;
  white-space: nowrap;
}

  .pricing-detail-col-gp .pricing-detail-gp-cell[b-9z37fdyvu1] {
    justify-content: flex-start;
  }

.pricing-detail-gp-header[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}

.pricing-detail-gp-cell[b-9z37fdyvu1] {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  width: 100%;
}

.pricing-detail-gp-badge[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.pricing-detail-gp-badge--positive[b-9z37fdyvu1] {
  border: 1px solid rgba(34, 197, 94, 0.28);
  background: rgba(34, 197, 94, 0.10);
  color: #15803d;
}

.pricing-detail-gp-badge--negative[b-9z37fdyvu1] {
  border: 1px solid rgba(239, 68, 68, 0.26);
  background: rgba(239, 68, 68, 0.08);
  color: #b91c1c;
}

.pricing-detail-gp-badge--pending[b-9z37fdyvu1] {
  border: 1px solid rgba(245, 158, 11, 0.28);
  background: rgba(245, 158, 11, 0.08);
  color: #92400e;
}

.pricing-detail-gp-badge--muted[b-9z37fdyvu1] {
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: rgba(148, 163, 184, 0.08);
  color: #64748b;
}

.pricing-detail-gp-info-button[b-9z37fdyvu1] {
  min-width: 18px;
  min-height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: #94a3b8;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
}

  .pricing-detail-gp-info-button:hover[b-9z37fdyvu1],
  .pricing-detail-gp-info-button:focus[b-9z37fdyvu1] {
    color: #2563eb;
  }

  .pricing-detail-gp-info-button:focus[b-9z37fdyvu1] {
    outline: none;
  }

/* Pricing image preview modal */
/* ---------------------------------------------------------
   Displays pricing item and Pre-Pack package images at a larger
   size without leaving the Promotion Pricing workspace.
   --------------------------------------------------------- */

.pricing-detail-image-preview-backdrop[b-9z37fdyvu1] {
  position: fixed;
  inset: 0;
  z-index: 12800;
  background: rgba(15, 23, 42, 0.42);
}

.pricing-detail-image-preview-shell[b-9z37fdyvu1] {
  position: fixed;
  inset: 0;
  z-index: 12810;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px;
}

.pricing-detail-image-preview-card[b-9z37fdyvu1] {
  width: min(640px, calc(100vw - 72px));
  max-height: calc(100vh - 72px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(25, 35, 68, 0.14);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 28px 72px rgba(15, 23, 42, 0.28);
}

.pricing-detail-image-preview-header[b-9z37fdyvu1] {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 16px 18px 13px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.09);
  background: linear-gradient(180deg, #ffffff, #f8fafc);
}

.pricing-detail-image-preview-title[b-9z37fdyvu1] {
  margin: 0;
  color: #0f2147;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.15;
}

.pricing-detail-image-preview-subtitle[b-9z37fdyvu1] {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 13px;
  line-height: 1.35;
}

.pricing-detail-image-preview-close[b-9z37fdyvu1] {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 999px;
  background: #f1f5f9;
  color: #64748b;
  font-size: 12px;
  line-height: 1;
}

  .pricing-detail-image-preview-close:hover[b-9z37fdyvu1] {
    background: #e2e8f0;
    color: #0f2147;
  }

.pricing-detail-image-preview-body[b-9z37fdyvu1] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 20px;
  overflow: auto;
}

.pricing-detail-image-preview-img[b-9z37fdyvu1] {
  max-width: 100%;
  max-height: min(58vh, 520px);
  object-fit: contain;
  display: block;
  border: 1px solid rgba(25, 35, 68, 0.12);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.10);
}

.pricing-detail-image-preview-footer[b-9z37fdyvu1] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 11px 18px 14px;
  border-top: 1px solid rgba(25, 35, 68, 0.08);
  background: #ffffff;
}

/* G.P. % calculation modal */
/* ---------------------------------------------------------
   Renders item-level gross profit calculations outside the
   table scroll container to prevent clipping and preserve
   internal table scrolling.
   --------------------------------------------------------- */

.pricing-detail-gp-modal-backdrop[b-9z37fdyvu1] {
  position: fixed;
  inset: 0;
  z-index: 12700;
  background: rgba(15, 23, 42, 0.42);
}

.pricing-detail-gp-modal-shell[b-9z37fdyvu1] {
  position: fixed;
  inset: 0;
  z-index: 12710;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px;
}

.pricing-detail-gp-modal-card[b-9z37fdyvu1] {
  width: min(640px, calc(100vw - 48px));
  max-height: calc(100vh - 56px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(25, 35, 68, 0.14);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 28px 72px rgba(15, 23, 42, 0.28);
}

.pricing-detail-gp-modal-header[b-9z37fdyvu1] {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 16px 18px 13px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.09);
  background: linear-gradient(180deg, #ffffff, #f8fafc);
}

.pricing-detail-gp-modal-title[b-9z37fdyvu1] {
  margin: 0;
  color: #0f2147;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.15;
}

.pricing-detail-gp-modal-subtitle[b-9z37fdyvu1] {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 13px;
  line-height: 1.35;
}

.pricing-detail-gp-modal-close[b-9z37fdyvu1] {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 999px;
  background: #f1f5f9;
  color: #64748b;
  font-size: 12px;
  line-height: 1;
}

  .pricing-detail-gp-modal-close:hover[b-9z37fdyvu1] {
    background: #e2e8f0;
    color: #0f2147;
  }

.pricing-detail-gp-modal-body[b-9z37fdyvu1] {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  gap: 13px;
  padding: 16px 18px 18px;
  overflow-y: auto;
}

.pricing-detail-gp-modal-item[b-9z37fdyvu1] {
  padding: 12px 13px;
  border: 1px solid rgba(25, 35, 68, 0.10);
  border-radius: 14px;
  background: #f8fafc;
}

.pricing-detail-gp-modal-kicker[b-9z37fdyvu1] {
  color: #64748b;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.pricing-detail-gp-modal-item-title[b-9z37fdyvu1] {
  margin-top: 3px;
  color: #0f2147;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.3;
}

.pricing-detail-gp-modal-item-meta[b-9z37fdyvu1] {
  margin-top: 3px;
  color: #475569;
  font-size: 12px;
  line-height: 1.3;
}

.pricing-detail-gp-modal-section[b-9z37fdyvu1] {
  display: grid;
  gap: 5px;
}

.pricing-detail-gp-explanation[b-9z37fdyvu1] {
  padding: 9px 11px;
  border: 1px solid rgba(37, 99, 235, 0.12);
  border-radius: 10px;
  background: rgba(37, 99, 235, 0.035);
  color: #334155;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.42;
}

.pricing-detail-gp-value-grid[b-9z37fdyvu1] {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.pricing-detail-gp-value-grid--six[b-9z37fdyvu1] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pricing-detail-gp-value-grid div[b-9z37fdyvu1] {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 10px;
  background: #ffffff;
}

.pricing-detail-gp-value-grid span[b-9z37fdyvu1] {
  display: block;
  color: #64748b;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.pricing-detail-gp-value-grid strong[b-9z37fdyvu1] {
  display: block;
  margin-top: 3px;
  color: #0f2147;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
}

.pricing-detail-gp-section-label[b-9z37fdyvu1] {
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.pricing-detail-gp-formula[b-9z37fdyvu1] {
  padding: 8px 9px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 9px;
  background: #f8fafc;
  color: #0f2147;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 11.5px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.pricing-detail-gp-formula--muted[b-9z37fdyvu1] {
  color: #475569;
  background: #ffffff;
}

.pricing-detail-gp-result[b-9z37fdyvu1] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 9px 11px;
  border: 1px solid rgba(34, 197, 94, 0.22);
  border-radius: 12px;
  background: rgba(34, 197, 94, 0.08);
}

  .pricing-detail-gp-result span[b-9z37fdyvu1] {
    color: #166534;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  .pricing-detail-gp-result strong[b-9z37fdyvu1] {
    color: #15803d;
    font-size: 18px;
    font-weight: 900;
  }

.pricing-detail-gp-result--modal[b-9z37fdyvu1] {
  margin-top: 2px;
}

/* G.P. modal responsive layout */
@media (max-width: 760px) {
  .pricing-detail-gp-modal-shell[b-9z37fdyvu1] {
    align-items: stretch;
    padding: 12px;
  }

  .pricing-detail-gp-modal-card[b-9z37fdyvu1] {
    width: 100%;
    max-height: calc(100vh - 24px);
  }

  .pricing-detail-gp-value-grid[b-9z37fdyvu1] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pricing-detail-gp-value-grid--six[b-9z37fdyvu1] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Pricing item actions and expanded details */
/* ---------------------------------------------------------
   Styles item commands, expanded entry and book panels, locked
   states, and compact item text presentation.
   --------------------------------------------------------- */

.pricing-detail-item-action[b-9z37fdyvu1] {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  appearance: none;
  color: var(--text-900, #0f2147);
  font-size: 13px;
  line-height: 1.15;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

  .pricing-detail-item-action i[b-9z37fdyvu1] {
    color: var(--brand-600, #2563eb);
    font-size: 12px;
    line-height: 1;
  }

.pricing-detail-item-action--utility[b-9z37fdyvu1] {
  color: var(--text-900, #0f2147);
  border: 0;
  background: transparent;
}

  .pricing-detail-item-action--utility:hover:not(:disabled)[b-9z37fdyvu1] {
    color: var(--text-900, #0f2147);
    background: transparent;
    text-decoration: none;
  }

    .pricing-detail-item-action--utility:hover:not(:disabled) span[b-9z37fdyvu1] {
      text-decoration: underline;
    }

.pricing-detail-item-action:focus[b-9z37fdyvu1],
.pricing-detail-item-action:focus-visible[b-9z37fdyvu1],
.pricing-detail-item-action:active[b-9z37fdyvu1] {
  outline: none;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.pricing-detail-item-action:disabled[b-9z37fdyvu1] {
  opacity: 0.6;
  cursor: not-allowed;
  box-shadow: none;
}

.pricing-detail-col-details-header[b-9z37fdyvu1] {
  text-align: right;
}

.pricing-detail-table-head-action i[b-9z37fdyvu1] {
  color: var(--brand-600, #2563eb);
}

.pricing-detail-table-head-action:hover span[b-9z37fdyvu1] {
  text-decoration: underline;
}

.pricing-detail-row-toggle i[b-9z37fdyvu1] {
  color: var(--brand-600, #2563eb);
}

/* Expanded pricing item panels */

.pricing-detail-expanded-row td[b-9z37fdyvu1] {
  padding: 0 6px 10px;
  background: #fff;
  border-bottom: 1px solid rgba(25, 35, 68, 0.10);
}

.pricing-detail-expanded-panel[b-9z37fdyvu1] {
  margin: 0;
  padding: 6px 8px;
  border: 1px solid rgba(25, 35, 68, 0.10);
  border-radius: 10px;
  background: #f8fafc;
}

.pricing-detail-expanded-panel--compact[b-9z37fdyvu1] {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pricing-detail-expanded-grid[b-9z37fdyvu1] {
  display: grid;
  justify-content: start;
  align-items: end;
  gap: 4px 8px;
}

.pricing-detail-expanded-grid--entry[b-9z37fdyvu1] {
  grid-template-columns: minmax(132px, 132px) /* Retail Delivery */
  minmax(132px, 132px) /* Dist Item # */
  minmax(90px, 90px) /* Dist Base Cost */
  minmax(90px, 90px) /* Allowance */
  minmax(90px, 90px) /* Spiff */
  minmax(80px, 80px) /* Item Count */
  minmax(80px, 80px) /* Retail */
  minmax(118px, 118px); /* Pre-Book / Ship Now */
}

.pricing-detail-expanded-grid--book[b-9z37fdyvu1] {
  grid-template-columns: minmax(132px, 132px) /* Display Start */
  minmax(132px, 132px) /* Display End */
  minmax(285px, 285px) /* Promo Comments */
  minmax(302px, 302px); /* WAM Notes */
}

.pricing-detail-expanded-field[b-9z37fdyvu1] {
  min-width: 0;
}

.pricing-detail-expanded-field--comment[b-9z37fdyvu1] {
  min-width: 0;
}

.pricing-detail-item-number[b-9z37fdyvu1] {
  font-weight: 700;
  white-space: nowrap;
}

.pricing-detail-item-number-stack[b-9z37fdyvu1] {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
}

/* Locked pricing item states */

.pricing-detail-item-row--locked td[b-9z37fdyvu1] {
  background: rgba(248, 250, 252, 0.62);
}

.pricing-detail-access-badge[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.pricing-detail-access-badge--locked[b-9z37fdyvu1] {
  border: 1px solid rgba(180, 83, 9, 0.18);
  background: rgba(245, 158, 11, 0.10);
  color: #92400e;
}

.pricing-detail-expanded-panel--locked[b-9z37fdyvu1] {
  border-color: rgba(180, 83, 9, 0.18);
  background: rgba(255, 251, 235, 0.45);
}

/* =====================================
   Open-Stock Pricing Access
   ---------------------------------------------------------
   Displays locked-item guidance and the release-specific
   pricing unlock action for eligible Open-Stock items.
   ===================================== */

.pricing-detail-locked-message[b-9z37fdyvu1] {
    width: 100%;
    max-width: 100%;
    margin-bottom: 6px;
    padding: 6px 9px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid rgba(180, 83, 9, 0.20);
    border-radius: 10px;
    background: rgba(255, 251, 235, 0.92);
    color: #92400e;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
}

    .pricing-detail-locked-message i[b-9z37fdyvu1] {
        font-size: 12px;
        line-height: 1;
    }

.pricing-detail-locked-message-copy[b-9z37fdyvu1] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

    .pricing-detail-locked-message-copy i[b-9z37fdyvu1] {
        flex: 0 0 auto;
        font-size: 12px;
        line-height: 1;
    }

.pricing-detail-unlock-action[b-9z37fdyvu1] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 7px;
    border: 0;
    background: transparent;
    color: #1d4ed8;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
}

    .pricing-detail-unlock-action:hover span[b-9z37fdyvu1] {
        text-decoration: underline;
        text-underline-offset: 2px;
    }

    .pricing-detail-unlock-action:focus-visible[b-9z37fdyvu1] {
        outline: 2px solid rgba(37, 99, 235, 0.28);
        outline-offset: 2px;
        border-radius: 4px;
    }

/* Pricing item text overflow */

.pricing-detail-description-cell[b-9z37fdyvu1] {
  min-width: 0;
}

.pricing-detail-description-text[b-9z37fdyvu1],
.pricing-detail-prepack-summary-description-text[b-9z37fdyvu1] {
  display: block;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pricing-detail-description-cell[b-9z37fdyvu1] {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

  .pricing-detail-description-cell[b-9z37fdyvu1]  .pricing-detail-table-tooltip-cell {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
  }

.pricing-detail-description-text[b-9z37fdyvu1],
.pricing-detail-prepack-summary-description-text[b-9z37fdyvu1] {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pricing-detail-table-tooltip-cell[b-9z37fdyvu1] {
  display: block;
  max-width: 100%;
  min-width: 0;
}

.pricing-detail-upc-stack[b-9z37fdyvu1] {
  display: grid;
  gap: 1px;
  min-width: 130px;
  font-size: 12px;
  line-height: 1.25;
}

.pricing-detail-empty[b-9z37fdyvu1] {
  color: var(--text-600, #64748b);
  font-size: 13px;
}

/* Pricing table pager */
/* ---------------------------------------------------------
   Keeps paging anchored to the bottom of the table shell while
   the table region owns vertical and horizontal scrolling.
   --------------------------------------------------------- */

.pricing-detail-pager[b-9z37fdyvu1] {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 7px 12px;
  border-top: 1px solid rgba(25, 35, 68, 0.08);
  background: #ffffff;
  flex-wrap: wrap;
}

.pricing-detail-pager-left[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.pricing-detail-pager-meta[b-9z37fdyvu1] {
  color: var(--text-600, #64748b);
  font-size: 12px;
}

.pricing-detail-pager-size[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  color: var(--text-700, #334155);
  font-size: 12px;
  font-weight: 600;
}


.pricing-detail-pager-select[b-9z37fdyvu1] {
  min-width: 84px;
  font-size: 13px;
}

.pricing-detail-pager-actions[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.pricing-detail-pager-page[b-9z37fdyvu1] {
  min-width: 82px;
  text-align: center;
  color: var(--text-700, #334155);
  font-size: 12px;
  font-weight: 600;
}

/* Editable Distributor fields */
/* ---------------------------------------------------------
   Styles pricing inputs when parent pages allow editing.
   Parent pages remain responsible for workflow actions and
   validation rules.
   --------------------------------------------------------- */

.pricing-detail-input[b-9z37fdyvu1] {
  width: 100%;
  min-width: 0;
  height: 30px;
  font-size: 12px;
}

.pricing-detail-input-number[b-9z37fdyvu1] {
  max-width: none;
}

/* Native date input alignment */
.pricing-detail-input-date[b-9z37fdyvu1] {
  width: 100%;
  min-width: 0;
  max-width: none;
}

.pricing-detail-input-select[b-9z37fdyvu1] {
  width: 100%;
  min-width: 0;
  max-width: none;
}

/* Checkbox and text controls */

.pricing-detail-check-row[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 30px;
  flex-wrap: wrap;
}

.pricing-detail-check[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  color: var(--text-900, #0f2147);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
}

  .pricing-detail-check input[b-9z37fdyvu1] {
    margin: 0;
  }

.pricing-detail-textarea[b-9z37fdyvu1] {
  min-height: 38px;
  resize: vertical;
  font-size: 12px;
}

.pricing-detail-textarea--compact[b-9z37fdyvu1] {
  width: 100%;
  height: 30px;
  min-height: 30px;
  line-height: 1.15;
  padding-top: 5px;
  padding-bottom: 4px;
  resize: vertical;
  overflow-y: auto;
  box-sizing: border-box;
}

.pricing-detail-expanded-field--wide[b-9z37fdyvu1] {
  grid-column: span 2;
}

/* Prefix and affix fields */

.pricing-detail-affix-field[b-9z37fdyvu1] {
  position: relative;
  display: block;
}

.pricing-detail-affix-field__affix[b-9z37fdyvu1] {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text-700, #334155);
  pointer-events: none;
  z-index: 1;
  line-height: 1;
  font-size: 12px;
}

.pricing-detail-affix-field--prefix .pricing-detail-affix-field__affix[b-9z37fdyvu1] {
  left: 10px;
}

.pricing-detail-affix-field--prefix .pricing-detail-affix-field__input[b-9z37fdyvu1] {
  padding-left: 24px;
}

/* Distributor pricing guidance */
/* ---------------------------------------------------------
   Keeps WAM instructions visible during pricing entry without
   blocking worksheet activity.
   --------------------------------------------------------- */

.pricing-detail-guidance-card[b-9z37fdyvu1] {
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px solid rgba(37, 99, 235, 0.14);
  border-radius: 10px;
  background: rgba(37, 99, 235, 0.035);
}

.pricing-detail-guidance-title[b-9z37fdyvu1] {
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 700;
  color: var(--text-900);
}

.pricing-detail-guidance-list[b-9z37fdyvu1] {
  margin: 0;
  padding-left: 18px;
  color: var(--text-600);
  font-size: 12px;
  line-height: 1.35;
}

  .pricing-detail-guidance-list li + li[b-9z37fdyvu1] {
    margin-top: 2px;
  }

/* Guidance visibility command */

.pricing-detail-guidance-toggle:hover span[b-9z37fdyvu1] {
  text-decoration: underline;
}

.pricing-detail-guidance-toggle:focus[b-9z37fdyvu1],
.pricing-detail-guidance-toggle:focus-visible[b-9z37fdyvu1],
.pricing-detail-guidance-toggle:active[b-9z37fdyvu1] {
  outline: 0;
  border: 0;
  box-shadow: none;
}

/* Distributor pricing field helpers */
/* ---------------------------------------------------------
   Provides compact guidance and warning text beneath pricing
   fields such as Dist Item # and Pre-Book / Ship Now.
   --------------------------------------------------------- */

.pricing-detail-field-help[b-9z37fdyvu1] {
  margin-top: 3px;
  font-size: 11px;
  line-height: 1.25;
  color: var(--text-500);
}

.pricing-detail-field-help--danger[b-9z37fdyvu1] {
  color: #b5474f;
  font-weight: 600;
}

/* Promotion Pricing workflow history modal */
/* ---------------------------------------------------------
   Keeps long workflow history content scrolling inside the
   modal body instead of the underlying page.
   --------------------------------------------------------- */

.pricing-workflow-history-modal[b-9z37fdyvu1] {
  overflow: hidden;
}

.pricing-workflow-history-dialog[b-9z37fdyvu1] {
  max-height: calc(100vh - 96px);
  margin-top: 48px;
  margin-bottom: 48px;
}

.pricing-workflow-history-content[b-9z37fdyvu1] {
  max-height: calc(100vh - 96px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

  .pricing-workflow-history-content .modal-header[b-9z37fdyvu1],
  .pricing-workflow-history-content .modal-footer[b-9z37fdyvu1] {
    flex: 0 0 auto;
  }

.pricing-workflow-history-body[b-9z37fdyvu1] {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

/* Workflow review details */
/* ---------------------------------------------------------
   Styles read-only review fields and workflow history entries
   shared by Distributor and WAM Admin review views.
   --------------------------------------------------------- */

.pricing-review-readonly-grid[b-9z37fdyvu1],
.admin-review-readonly-grid[b-9z37fdyvu1] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.pricing-review-readonly-field[b-9z37fdyvu1],
.admin-review-readonly-field[b-9z37fdyvu1] {
  min-width: 0;
}

.pricing-review-readonly-field--wide[b-9z37fdyvu1],
.admin-review-readonly-field--wide[b-9z37fdyvu1] {
  grid-column: 1 / -1;
}

.pricing-review-readonly-label[b-9z37fdyvu1],
.admin-review-readonly-label[b-9z37fdyvu1] {
  margin-bottom: 5px;
  color: var(--text-600, #64748b);
  font-size: 12px;
  font-weight: 700;
}

.pricing-review-readonly-value[b-9z37fdyvu1],
.admin-review-readonly-value[b-9z37fdyvu1] {
  min-height: 38px;
  padding: 9px 11px;
  border: 1px solid #d8e0ea;
  border-radius: 8px;
  background: #f8fafc;
  color: var(--text-900, #0f2147);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.pricing-review-history-list[b-9z37fdyvu1],
.admin-review-history-list[b-9z37fdyvu1] {
  display: grid;
  gap: 14px;
}

.pricing-review-history-row[b-9z37fdyvu1],
.admin-review-history-row[b-9z37fdyvu1] {
  display: grid;
  grid-template-columns: minmax(150px, 220px) minmax(0, 1fr);
  gap: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.10);
}

  .pricing-review-history-row:last-child[b-9z37fdyvu1],
  .admin-review-history-row:last-child[b-9z37fdyvu1] {
    padding-bottom: 0;
    border-bottom: 0;
  }

.pricing-review-history-left[b-9z37fdyvu1],
.admin-review-history-left[b-9z37fdyvu1] {
  min-width: 0;
}

.pricing-review-history-title[b-9z37fdyvu1],
.admin-review-history-title[b-9z37fdyvu1] {
  color: var(--text-900, #0f2147);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
}

.pricing-review-history-date[b-9z37fdyvu1],
.admin-review-history-date[b-9z37fdyvu1],
.pricing-review-history-role[b-9z37fdyvu1],
.admin-review-history-role[b-9z37fdyvu1] {
  margin-top: 4px;
  color: var(--text-600, #64748b);
  font-size: 12px;
  line-height: 1.25;
}

.pricing-review-history-right[b-9z37fdyvu1],
.admin-review-history-right[b-9z37fdyvu1] {
  min-width: 0;
  display: grid;
  gap: 10px;
}

/* Workflow audit changes */
/* ---------------------------------------------------------
   Displays field-level previous and new values recorded during
   Promotion Pricing workflow transitions.
   --------------------------------------------------------- */

.pricing-review-audit-modal-actions[b-9z37fdyvu1] {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 10px;
}

.pricing-review-audit-modal-action[b-9z37fdyvu1],
.pricing-review-audit-toggle[b-9z37fdyvu1] {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--link-600, #2563eb);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  cursor: pointer;
  white-space: nowrap;
}

  .pricing-review-audit-modal-action i[b-9z37fdyvu1],
  .pricing-review-audit-toggle i[b-9z37fdyvu1] {
    font-size: 12px;
    line-height: 1;
  }

  .pricing-review-audit-modal-action:hover span[b-9z37fdyvu1],
  .pricing-review-audit-toggle:hover span[b-9z37fdyvu1] {
    text-decoration: underline;
  }

  .pricing-review-audit-modal-action:focus[b-9z37fdyvu1],
  .pricing-review-audit-modal-action:focus-visible[b-9z37fdyvu1],
  .pricing-review-audit-modal-action:active[b-9z37fdyvu1],
  .pricing-review-audit-toggle:focus[b-9z37fdyvu1],
  .pricing-review-audit-toggle:focus-visible[b-9z37fdyvu1],
  .pricing-review-audit-toggle:active[b-9z37fdyvu1] {
    outline: 0;
    border: 0;
    box-shadow: none;
  }

.pricing-review-audit-summary[b-9z37fdyvu1] {
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 0;
}

.pricing-review-audit-summary-label[b-9z37fdyvu1] {
  margin-bottom: 0;
}

.pricing-review-readonly-field--audit[b-9z37fdyvu1] {
  margin-top: 2px;
  padding: 9px 11px;
  border: 1px solid #d8e0ea;
  border-radius: 8px;
  background: #f8fafc;
}

.pricing-review-audit-header[b-9z37fdyvu1] {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  margin-bottom: 4px;
  padding: 0 9px;
}

.pricing-review-audit-header-values[b-9z37fdyvu1] {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 8px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
}

.pricing-review-audit-list[b-9z37fdyvu1] {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pricing-review-audit-row[b-9z37fdyvu1] {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
  padding: 7px 9px;
  border: 1px solid rgba(25, 35, 68, 0.08);
  border-radius: 8px;
  background: rgba(248, 250, 252, 0.75);
}

.pricing-review-audit-field[b-9z37fdyvu1] {
  display: flex;
  align-items: center;
  min-width: 0;
  font-size: 12px;
  font-weight: 700;
  color: #334155;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.pricing-review-audit-values[b-9z37fdyvu1] {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 8px;
  align-items: stretch;
  font-size: 12px;
  line-height: 1.35;
}

.pricing-review-audit-old[b-9z37fdyvu1],
.pricing-review-audit-new[b-9z37fdyvu1] {
  min-width: 0;
  min-height: 32px;
  display: flex;
  align-items: center;
  padding: 6px 8px;
  border-radius: 7px;
  background: #fff;
  border: 1px solid rgba(25, 35, 68, 0.08);
  color: #334155;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.pricing-review-audit-old[b-9z37fdyvu1] {
  color: #64748b;
}

.pricing-review-audit-new[b-9z37fdyvu1] {
  color: #0f172a;
  font-weight: 600;
}

.pricing-review-audit-arrow[b-9z37fdyvu1] {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-weight: 700;
}

/* Sticky workflow actions */
/* ---------------------------------------------------------
   Keeps Save Draft and workflow actions anchored at the bottom
   of the pricing workspace.
   --------------------------------------------------------- */
.pricing-detail-actions-bar[b-9z37fdyvu1] {
  position: sticky;
  bottom: 0;
  z-index: 20;
  display: flex;
  justify-content: flex-end;
  padding: 4px 12px 2px;
  background: rgb(248, 250, 252);
}

.pricing-detail-actions[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.pricing-detail-save-button[b-9z37fdyvu1] {
  min-height: 30px;
  padding: 4px 16px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
}

/* Baseline refresh indicators */
/* ---------------------------------------------------------
   Highlights refreshed Manufacturer pricing baselines and
   provides contextual explanation without changing field data.
   --------------------------------------------------------- */
.pricing-detail-baseline-refresh-banner[b-9z37fdyvu1] {
  width: fit-content;
  max-width: calc(100% - 10px);
  min-height: 26px;
  margin: 0 8px 0 0;
  padding: 5px 9px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  justify-self: start;
  align-self: start;
  border: 1px solid rgba(245, 158, 11, 0.35);
  border-radius: 999px;
  background: #fffbeb;
  color: #92400e;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
}

  .pricing-detail-baseline-refresh-banner i[b-9z37fdyvu1] {
    flex: 0 0 auto;
    font-size: 12px;
    line-height: 1;
  }

.pricing-detail-label--baseline-refreshed[b-9z37fdyvu1] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  width: fit-content;
  max-width: 100%;
  color: #a16207 !important;
  font-weight: 800;
  line-height: 1.15;
  white-space: nowrap;
}

/* Promotion Cost Baseline Indicators
/* ---------------------------------------------------------
   Highlights synchronized read-only Base and Net Cost values
   while preserving the compact Cost Context layout.
   --------------------------------------------------------- */

.pricing-detail-cost-context-line--baseline-refreshed[b-9z37fdyvu1],
.pricing-detail-prepack-cost-context-line--baseline-refreshed[b-9z37fdyvu1] {
    color: #a16207;
    font-weight: 800;
}

    .pricing-detail-cost-context-line--baseline-refreshed span[b-9z37fdyvu1],
    .pricing-detail-cost-context-line--baseline-refreshed strong[b-9z37fdyvu1],
    .pricing-detail-prepack-cost-context-line--baseline-refreshed span[b-9z37fdyvu1],
    .pricing-detail-prepack-cost-context-line--baseline-refreshed strong[b-9z37fdyvu1] {
        color: #a16207 !important;
    }

.pricing-detail-cost-context-line[b-9z37fdyvu1] {
    align-items: center;
}

.pricing-detail-prepack-cost-context-line[b-9z37fdyvu1] {
    grid-template-columns: 68px auto 14px;
    align-items: center;
}

[b-9z37fdyvu1] .pricing-detail-baseline-refresh-tooltip-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #a16207;
    font-size: 10px;
    line-height: 1;
    cursor: help;
}

    [b-9z37fdyvu1] .pricing-detail-baseline-refresh-tooltip-trigger:hover,
    [b-9z37fdyvu1] .pricing-detail-baseline-refresh-tooltip-trigger:focus-visible {
        color: #854d0e;
    }

[b-9z37fdyvu1] .pricing-detail-gp-header-tooltip-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--text-500, #94a3b8);
    font-size: 11px;
    line-height: 1;
    cursor: help;
}

    [b-9z37fdyvu1] .pricing-detail-gp-header-tooltip-trigger:hover,
    [b-9z37fdyvu1] .pricing-detail-gp-header-tooltip-trigger:focus-visible {
        color: var(--brand-600, #2563eb);
    }

/* Responsive layout */
/* ---------------------------------------------------------
   Collapses overview and workflow layouts while preserving
   internal table scrolling, modal behavior, and pricing action
   placement across narrower viewports.
   --------------------------------------------------------- */

@media (max-width: 1120px) {
  .pricing-detail-summary-card-grid[b-9z37fdyvu1] {
    grid-template-columns: 1fr;
  }

  .pricing-detail-context-card .pricing-detail-context-body[b-9z37fdyvu1],
  .pricing-detail-workflow-card .pricing-detail-context-body[b-9z37fdyvu1] {
    min-height: 0;
  }
}

@media (max-width: 1180px) {
  .pricing-detail-prepack-summary[b-9z37fdyvu1] {
    overflow-x: auto;
  }

  .pricing-detail-prepack-summary-panel[b-9z37fdyvu1] {
    min-width: 920px;
  }
}

@media (max-width: 900px) {
  .pricing-detail-context-card .pricing-detail-context-body[b-9z37fdyvu1],
  .pricing-detail-workflow-card .pricing-detail-context-body[b-9z37fdyvu1] {
    min-height: 0;
  }

  .pricing-detail-context-grid[b-9z37fdyvu1] {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(48px, 0.3fr);
  }

  .pricing-detail-expanded-grid--entry[b-9z37fdyvu1],
  .pricing-detail-expanded-grid--book[b-9z37fdyvu1] {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }

  .pricing-detail-expanded-field--comment[b-9z37fdyvu1] {
    min-width: 0;
  }

  /* Workflow audit responsive layout */
  .pricing-review-audit-header[b-9z37fdyvu1],
  .pricing-review-audit-row[b-9z37fdyvu1] {
    grid-template-columns: 1fr;
  }

  .pricing-review-audit-header[b-9z37fdyvu1] {
    display: none;
  }

  .pricing-review-audit-values[b-9z37fdyvu1] {
    grid-template-columns: 1fr;
  }

  .pricing-review-audit-arrow[b-9z37fdyvu1] {
    padding: 2px 0;
  }
}

@media (max-width: 640px) {
  .pricing-detail-section-title-row[b-9z37fdyvu1],
  .pricing-detail-section-meta-row[b-9z37fdyvu1] {
    align-items: flex-start;
    flex-direction: column;
  }

  .pricing-detail-section-primary-actions[b-9z37fdyvu1],
  .pricing-detail-section-actions[b-9z37fdyvu1] {
    justify-content: flex-start;
  }

  .pricing-detail-context-grid[b-9z37fdyvu1] {
    grid-template-columns: 1fr;
  }

  .pricing-detail-context-title-line[b-9z37fdyvu1] {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
  }

  .pricing-detail-promo-period-inline[b-9z37fdyvu1]::before {
    content: "";
    margin-right: 0;
  }

  .pricing-detail-section-actions[b-9z37fdyvu1] {
    width: 100%;
    justify-content: flex-start;
  }

  .pricing-detail-pager[b-9z37fdyvu1] {
    align-items: flex-start;
    flex-direction: column;
  }

  .pricing-detail-pager-actions[b-9z37fdyvu1] {
    width: 100%;
    justify-content: flex-start;
  }

  .pricing-detail-expanded-grid--entry[b-9z37fdyvu1],
  .pricing-detail-expanded-grid--book[b-9z37fdyvu1] {
    grid-template-columns: 1fr;
  }

  .pricing-detail-expanded-field--wide[b-9z37fdyvu1],
  .pricing-detail-expanded-field--comment[b-9z37fdyvu1] {
    grid-column: span 1;
  }

  /* Pricing review divider controls */
  /* ---------------------------------------------------------
   Keeps the review title centered while overview visibility
   and preference controls remain aligned at the left.
   --------------------------------------------------------- */

  .pricing-detail-intro-band[b-9z37fdyvu1] {
    flex: 0 0 auto;
    min-height: 36px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 4px 0;
  }

  .pricing-detail-intro-actions[b-9z37fdyvu1] {
    grid-column: 1;
    justify-self: start;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 12px;
  }

  .pricing-detail-intro-center[b-9z37fdyvu1] {
    grid-column: 2;
    justify-self: center;
  }

  .pricing-detail-intro-side[b-9z37fdyvu1] {
    grid-column: 3;
    min-width: 0;
  }

  .pricing-detail-intro-center[b-9z37fdyvu1] {
    max-width: calc(100% - 96px);
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .pricing-detail-workflow-review-grid[b-9z37fdyvu1] {
    grid-template-columns: 1fr;
  }

  .pricing-detail-workflow-review-cell + .pricing-detail-workflow-review-cell[b-9z37fdyvu1] {
    border-left: 0;
    border-top: 1px solid rgba(25, 35, 68, 0.10);
  }

  .pricing-review-readonly-grid[b-9z37fdyvu1],
  .admin-review-readonly-grid[b-9z37fdyvu1],
  .pricing-review-history-row[b-9z37fdyvu1],
  .admin-review-history-row[b-9z37fdyvu1] {
    grid-template-columns: 1fr;
  }

  .pricing-workflow-history-dialog[b-9z37fdyvu1] {
    max-height: calc(100vh - 24px);
    margin-top: 12px;
    margin-bottom: 12px;
  }

  .pricing-workflow-history-content[b-9z37fdyvu1] {
    max-height: calc(100vh - 24px);
  }

  .pricing-workflow-history-body[b-9z37fdyvu1] {
    padding-left: 12px;
    padding-right: 12px;
  }
}
/* /Components/Shared/Promotions/DistributorPricingProjectionPreviewModal.razor.rz.scp.css */
/* =========================================================
   Distributor Pricing Projection Preview Modal
   ---------------------------------------------------------
   Shared modal for projection previews from Report, Queue,
   Admin detail, and Distributor detail pages.
   ========================================================= */

.pricing-projection-modal-backdrop[b-ruv4hhs8eq] {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(15, 23, 42, 0.48);
}

.pricing-projection-modal[b-ruv4hhs8eq] {
  width: min(1180px, calc(100vw - 48px));
  height: min(780px, calc(100vh - 48px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  background: #ffffff;
  border: 1px solid rgba(25, 35, 68, 0.16);
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.28);
}

.pricing-projection-modal-header[b-ruv4hhs8eq] {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px 12px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.10);
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.96), #ffffff);
}

.pricing-projection-modal-title-block[b-ruv4hhs8eq] {
  min-width: 0;
}

.pricing-projection-modal-title[b-ruv4hhs8eq] {
  margin: 0;
  color: var(--text-900, #0f2147);
  font-size: 20px;
  font-weight: 800;
  line-height: 1.2;
}

.pricing-projection-modal-subtitle[b-ruv4hhs8eq] {
  margin-top: 4px;
  color: var(--text-600, #64748b);
  font-size: 13px;
  line-height: 1.35;
}

/*Modal action button*/
.pricing-projection-modal-header-actions[b-ruv4hhs8eq] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.pricing-projection-modal-open-tab[b-ruv4hhs8eq] {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 5px 12px;
  border-radius: 8px;
  color: #334155;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

  .pricing-projection-modal-open-tab .bi[b-ruv4hhs8eq] {
    font-size: 13px;
    line-height: 1;
  }

.pricing-projection-modal-close[b-ruv4hhs8eq] {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border: 1px solid rgba(25, 35, 68, 0.12);
  border-radius: 999px;
  background: #ffffff;
  color: var(--text-600, #64748b);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

  .pricing-projection-modal-close:hover[b-ruv4hhs8eq] {
    color: var(--text-900, #0f2147);
    border-color: rgba(25, 35, 68, 0.22);
    background: #f8fafc;
  }

.pricing-projection-modal-body[b-ruv4hhs8eq] {
  min-height: 0;
  overflow: hidden;
  background: #f8fafc;
}

.pricing-projection-modal-frame[b-ruv4hhs8eq] {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
  background: #ffffff;
}

.pricing-projection-modal-empty[b-ruv4hhs8eq] {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-600, #64748b);
  font-size: 14px;
}
/* /Components/Shared/Promotions/DistributorPricingQueueShared.razor.rz.scp.css */
/* Distributor Pricing Queue Shared */
/* ---------------------------------------------------------
   Shared visual layer for WAM Admin and Distributor pricing queues.
   Parent pages retain data loading, authorization, and routing.
   --------------------------------------------------------- */

/* Page shell */

.pricing-queue-page[b-8rtd52i1lo] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 2px;
    overflow: hidden;
    container-type: inline-size;
    container-name: pricing-queue-page;
}

.pricing-queue-workspace[b-8rtd52i1lo] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow: hidden;
}

/* Summary cards */
/* ---------------------------------------------------------
   Compact operational cards aligned with Dashboard, Books,
   Promotion Cycles, Promotions, and Promotion Pricing.
   --------------------------------------------------------- */

.pricing-queue-summary-strip[b-8rtd52i1lo] {
    flex: 0 0 auto;
    display: grid;
    gap: 10px;
}

.pricing-queue-summary-strip--five[b-8rtd52i1lo] {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.pricing-queue-summary-strip--four[b-8rtd52i1lo] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.pricing-queue-summary-card[b-8rtd52i1lo] {
    min-width: 0;
    padding: 8px 10px;
    background: #fff;
    border: 1px solid var(--border-200, rgba(25, 35, 68, 0.12));
    border-radius: 13px;
    box-shadow: var(--shadow-1, 0 1px 4px rgba(15, 23, 42, 0.08));
}

.pricing-queue-summary-card-button[b-8rtd52i1lo] {
    appearance: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

    .pricing-queue-summary-card-button:hover[b-8rtd52i1lo] {
        border-color: rgba(29, 58, 109, 0.18);
        box-shadow: 0 3px 10px rgba(15, 23, 42, 0.06);
    }

    .pricing-queue-summary-card-button.is-active[b-8rtd52i1lo] {
        box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.04), 0 3px 10px rgba(15, 23, 42, 0.06);
    }

    .pricing-queue-summary-card-button:focus-visible[b-8rtd52i1lo] {
        outline: none;
        box-shadow: var(--focus-ring, 0 0 0 3px rgba(59, 130, 246, 0.25));
    }

.pricing-queue-summary-label[b-8rtd52i1lo] {
    margin: 0 0 6px;
    overflow: hidden;
    color: var(--text-600, #475569);
    font-size: 13.5px;
    line-height: 1.3;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pricing-queue-summary-value[b-8rtd52i1lo] {
    margin: 0;
    color: var(--text-900, #0f172a);
    font-size: 21px;
    line-height: 1;
    font-weight: 800;
}

.pricing-queue-summary-meta[b-8rtd52i1lo] {
    margin-top: 5px;
    overflow: hidden;
    color: var(--text-500, #64748b);
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pricing-queue-summary-card--info[b-8rtd52i1lo] {
    border-color: rgba(117, 140, 167, 0.24);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.04), #fff);
}

.pricing-queue-summary-card--warning[b-8rtd52i1lo] {
    border-color: rgba(250, 169, 75, 0.32);
    background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

.pricing-queue-summary-card--success[b-8rtd52i1lo],
.pricing-queue-summary-card--completed[b-8rtd52i1lo] {
    border-color: rgba(91, 196, 191, 0.38);
    background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.pricing-queue-summary-card--danger[b-8rtd52i1lo] {
    border-color: rgba(239, 68, 68, 0.26);
    background: linear-gradient(180deg, rgba(239, 68, 68, 0.05), #fff);
}

.pricing-queue-summary-card--info.is-active[b-8rtd52i1lo] {
    border-color: rgba(117, 140, 167, 0.34);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.08), #fff);
}

.pricing-queue-summary-card--warning.is-active[b-8rtd52i1lo] {
    border-color: rgba(250, 169, 75, 0.42);
    background: linear-gradient(180deg, rgba(250, 169, 75, 0.10), #fff);
}

.pricing-queue-summary-card--success.is-active[b-8rtd52i1lo],
.pricing-queue-summary-card--completed.is-active[b-8rtd52i1lo] {
    border-color: rgba(91, 196, 191, 0.48);
    background: linear-gradient(180deg, rgba(91, 196, 191, 0.10), #fff);
}

.pricing-queue-summary-card--danger.is-active[b-8rtd52i1lo] {
    border-color: rgba(239, 68, 68, 0.38);
    background: linear-gradient(180deg, rgba(239, 68, 68, 0.10), #fff);
}

/* Queue card */

.pricing-queue-card[b-8rtd52i1lo] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--bg-surface, #fff);
    border: 1px solid var(--border-200, rgba(25, 35, 68, 0.12));
    border-radius: 18px;
}

.pricing-queue-panel-header[b-8rtd52i1lo] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 12px 8px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.pricing-queue-panel-header-copy[b-8rtd52i1lo] {
    min-width: 0;
    flex: 1 1 auto;
}

.pricing-queue-panel-header-actions[b-8rtd52i1lo] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.pricing-queue-card-title[b-8rtd52i1lo] {
    margin: 0;
    color: var(--text-900, #0f172a);
    font-size: 18px;
    font-weight: 700;
}

.pricing-queue-card-subtitle[b-8rtd52i1lo] {
    margin: 4px 0 0;
    color: var(--text-500, #64748b);
    font-size: 13px;
}

.pricing-queue-list-body[b-8rtd52i1lo] {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    padding: 0;
}

/* Filters */

.pricing-queue-controls[b-8rtd52i1lo] {
    width: 100%;
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: minmax(320px, 1fr) 190px 180px 108px;
    gap: 10px;
    align-items: end;
    padding: 14px 12px 10px;
}

.pricing-queue-page--admin .pricing-queue-controls[b-8rtd52i1lo] {
    grid-template-columns: minmax(250px, 1fr) minmax(140px, 155px) minmax(120px, 130px) minmax(95px, 105px) minmax(120px, 130px) minmax(88px, 92px);
}

.pricing-queue-control[b-8rtd52i1lo] {
    min-width: 0;
}

.pricing-queue-control-label[b-8rtd52i1lo] {
    display: block;
    margin-bottom: 4px;
    color: var(--text-700, #334155);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.15;
}

.pricing-queue-search[b-8rtd52i1lo],
.pricing-queue-filter-select[b-8rtd52i1lo] {
    width: 100%;
    min-height: 38px;
    height: 38px;
    min-width: 0;
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 1.2;
}

.pricing-queue-search-wrapper[b-8rtd52i1lo] {
    width: 100%;
}

.pricing-queue-control--search[b-8rtd52i1lo]  input.form-control.pricing-queue-search {
    min-height: 38px;
    height: 38px;
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
    line-height: 1.2;
}

    .pricing-queue-control--search[b-8rtd52i1lo]  input.form-control.pricing-queue-search::placeholder {
        font-size: 12px;
        line-height: 1.2;
        color: var(--text-500, #64748b);
    }

.pricing-queue-control-page-size .pricing-queue-filter-select[b-8rtd52i1lo] {
    min-width: 84px;
}

/* Table shell */
/* ---------------------------------------------------------
   Provides the fixed-height queue workspace aligned with Promotions
   and Promotion Cycles. The table owns vertical and horizontal scrolling.
   --------------------------------------------------------- */

.pricing-queue-table-region[b-8rtd52i1lo] {
    min-height: 0;
    height: 100%;
    margin: 0 12px 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
}

.pricing-queue-table-scroll[b-8rtd52i1lo] {
    min-height: 0;
    position: relative;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    background: #ffffff;
}

/* Queue table */

.pricing-queue-table[b-8rtd52i1lo] {
    width: 100%;
    margin: 0;
    min-width: 1060px;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.82rem;
}

    .pricing-queue-table thead th[b-8rtd52i1lo] {
        position: sticky;
        top: 0;
        z-index: 12;
        padding: 0.58rem 0.55rem;
        border-bottom: 0;
        background: #ffffff;
        color: #64748b;
        font-size: 0.7rem;
        font-weight: 850;
        letter-spacing: 0.035em;
        text-transform: uppercase;
        white-space: nowrap;
        box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
    }

    .pricing-queue-table tbody td[b-8rtd52i1lo] {
        padding: 0.56rem 0.55rem;
        vertical-align: middle;
        border-bottom: 1px solid #edf2f7;
        background: #ffffff;
        color: var(--text-900, #0f172a);
    }

    .pricing-queue-table tbody tr:hover td[b-8rtd52i1lo] {
        background: #fbfdff;
    }

/* WAM Admin grouped pricing rows */
/* ---------------------------------------------------------
   Groups Distributor Pricing submissions by Manufacturer and Promotion.
   Distributor-scoped queues remain flat and use the shared row layout.
   --------------------------------------------------------- */

.pricing-queue-group-row td[b-8rtd52i1lo] {
    padding: 0 !important;
    border-top: 1px solid rgba(37, 99, 235, 0.12);
    border-bottom: 1px solid rgba(37, 99, 235, 0.16);
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.96), rgba(248, 251, 255, 0.98)) !important;
}

.pricing-queue-table tbody tr.pricing-queue-group-row:hover td[b-8rtd52i1lo] {
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.96), rgba(248, 251, 255, 0.98)) !important;
}

.pricing-queue-group-header[b-8rtd52i1lo] {
    position: relative;
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0;
    padding: 7px 10px 7px 16px;
    border-radius: 0;
    background: transparent;
    overflow: hidden;
}

.pricing-queue-group-title[b-8rtd52i1lo] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #0f172a;
    font-size: 12px;
    font-weight: 850;
    line-height: 1.25;
    overflow: hidden;
    white-space: nowrap;
}

.pricing-queue-group-part[b-8rtd52i1lo] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pricing-queue-group-label[b-8rtd52i1lo] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 17px;
    padding: 1px 6px;
    border: 1px solid rgba(100, 116, 139, 0.18);
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.74);
    color: #64748b;
    font-size: 9.5px;
    font-weight: 900;
    letter-spacing: 0.045em;
    line-height: 1;
    text-transform: uppercase;
}

.pricing-queue-group-value[b-8rtd52i1lo] {
    min-width: 0;
    color: #0f172a;
    font-size: 12px;
    font-weight: 850;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pricing-queue-group-value--promotion[b-8rtd52i1lo] {
    color: #1d4ed8;
}

.pricing-queue-group-separator[b-8rtd52i1lo] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 10px;
    height: 18px;
    color: #94a3b8;
    font-size: 10px;
    line-height: 1;
}

    .pricing-queue-group-separator .bi[b-8rtd52i1lo] {
        font-size: 10px;
        line-height: 1;
    }

.pricing-queue-group-count[b-8rtd52i1lo] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 21px;
    padding: 2px 9px;
    border: 1px solid rgba(37, 99, 235, 0.14);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.94);
    color: #334155;
    font-size: 10.75px;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
}

.pricing-queue-group-row + tr td[b-8rtd52i1lo] {
    border-top: 0;
}

.pricing-queue-table thead th:first-child[b-8rtd52i1lo],
.pricing-queue-table tbody td:first-child[b-8rtd52i1lo] {
    padding-left: 12px;
}

.pricing-queue-table thead th:last-child[b-8rtd52i1lo],
.pricing-queue-table tbody td:last-child[b-8rtd52i1lo] {
    padding-right: 12px;
}

/* Column sizing */
/* ---------------------------------------------------------
   Keeps the base table at a 1060px internal minimum before horizontal
   scrolling. Support columns remain compact while Promotion absorbs space.
   --------------------------------------------------------- */

.pricing-queue-col-promotion[b-8rtd52i1lo] {
    width: 32%;
    min-width: 250px;
}

.pricing-queue-col-type[b-8rtd52i1lo] {
    width: 92px;
    min-width: 86px;
    text-align: center;
    white-space: nowrap;
}

.pricing-queue-col-manufacturer[b-8rtd52i1lo] {
    width: 132px;
    min-width: 120px;
    white-space: normal;
}

.pricing-queue-col-distributor[b-8rtd52i1lo] {
    width: 132px;
    min-width: 120px;
    white-space: normal;
}

.pricing-queue-col-period[b-8rtd52i1lo] {
    width: 78px;
    min-width: 70px;
    white-space: nowrap;
}

.pricing-queue-col-items[b-8rtd52i1lo] {
    width: 58px;
    min-width: 54px;
    text-align: center;
    white-space: nowrap;
}

.pricing-queue-col-status[b-8rtd52i1lo] {
    width: 138px;
    min-width: 132px;
    white-space: nowrap;
}

.pricing-queue-col-date[b-8rtd52i1lo] {
    width: 136px;
    min-width: 126px;
    color: var(--text-700, #334155);
    font-size: 12px;
    line-height: 1.25;
    white-space: normal;
}

.pricing-queue-col-actions[b-8rtd52i1lo] {
    width: 92px;
    min-width: 92px;
    max-width: 92px;
}

.pricing-queue-page--projection-preview .pricing-queue-col-actions[b-8rtd52i1lo] {
    width: 132px;
    min-width: 132px;
    max-width: 132px;
}

.pricing-queue-page--distributor .pricing-queue-col-actions[b-8rtd52i1lo] {
    width: 96px;
    min-width: 96px;
    max-width: 96px;
}

.pricing-queue-page--distributor.pricing-queue-page--projection-preview .pricing-queue-col-actions[b-8rtd52i1lo] {
    width: 132px;
    min-width: 132px;
    max-width: 132px;
}

.pricing-queue-page--distributor .pricing-queue-col-manufacturer[b-8rtd52i1lo] {
    width: 136px;
    min-width: 124px;
}

.pricing-queue-page--distributor .pricing-queue-col-date[b-8rtd52i1lo] {
    width: 130px;
    min-width: 120px;
}

/* Sticky Actions column */
/* ---------------------------------------------------------
   Pins Actions to the right edge of the table scroll viewport.
   The sticky cell stays neutral while the inner action zone owns emphasis.
   --------------------------------------------------------- */
.pricing-queue-table th.pricing-queue-col-actions[b-8rtd52i1lo],
.pricing-queue-table td.pricing-queue-col-actions[b-8rtd52i1lo] {
    position: sticky;
    right: 0;
    z-index: 10;
    text-align: left;
    white-space: nowrap;
    background: #ffffff;
    background-clip: padding-box;
    box-shadow: none;
}

.pricing-queue-table thead th.pricing-queue-col-actions[b-8rtd52i1lo] {
    z-index: 18;
    background: #ffffff;
    box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
}

.pricing-queue-table tbody tr:hover td.pricing-queue-col-actions[b-8rtd52i1lo] {
    z-index: 40;
    background: #fbfdff;
}

.pricing-queue-table tbody td.pricing-queue-col-actions:focus-within[b-8rtd52i1lo] {
    z-index: 40;
}

.pricing-queue-table td.pricing-queue-col-items[b-8rtd52i1lo] {
    font-weight: 600;
}

/* WAM Admin grouped column layout */
/* ---------------------------------------------------------
   Removes Promotion and Manufacturer row columns because group headers
   provide that context. Distributor becomes the primary row identity.
   --------------------------------------------------------- */
.pricing-queue-page--admin .pricing-queue-table[b-8rtd52i1lo] {
    min-width: 980px;
}

.pricing-queue-page--admin .pricing-queue-col-type[b-8rtd52i1lo] {
    width: 118px;
    min-width: 108px;
}

.pricing-queue-page--admin .pricing-queue-col-distributor[b-8rtd52i1lo] {
    width: 24%;
    min-width: 180px;
    white-space: normal;
}

.pricing-queue-page--admin .pricing-queue-col-period[b-8rtd52i1lo] {
    width: 110px;
    min-width: 100px;
}

.pricing-queue-page--admin .pricing-queue-col-items[b-8rtd52i1lo] {
    width: 76px;
    min-width: 68px;
}

.pricing-queue-page--admin .pricing-queue-col-status[b-8rtd52i1lo] {
    width: 170px;
    min-width: 160px;
}

.pricing-queue-page--admin .pricing-queue-col-date[b-8rtd52i1lo] {
    width: 156px;
    min-width: 146px;
}

.pricing-queue-page--admin.pricing-queue-page--projection-preview .pricing-queue-col-actions[b-8rtd52i1lo] {
    width: 146px;
    min-width: 146px;
    max-width: 146px;
}

/* Sort controls */
/* ---------------------------------------------------------
   Applies the shared Books and Promotion Cycles table-sort treatment
   with active-sort emphasis.
   --------------------------------------------------------- */

.pricing-queue-sort-button[b-8rtd52i1lo] {
    appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    max-width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    cursor: pointer;
    white-space: nowrap;
}

    .pricing-queue-sort-button:hover[b-8rtd52i1lo],
    .pricing-queue-sort-button--active[b-8rtd52i1lo] {
        color: #2563eb;
    }

.pricing-queue-sort-indicator[b-8rtd52i1lo] {
    font-size: 0.72rem;
    line-height: 1;
}

/* Row text hierarchy */

.pricing-queue-primary[b-8rtd52i1lo] {
    color: var(--text-900, #0f172a);
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.3;
}

.pricing-queue-secondary[b-8rtd52i1lo] {
    margin-top: 3px;
    color: var(--text-600, #475569);
    font-size: 12px;
    line-height: 1.35;
}

.pricing-queue-primary-title-wrap[b-8rtd52i1lo] {
    position: relative;
    display: inline-block;
    max-width: 100%;
}

.pricing-queue-primary-title[b-8rtd52i1lo] {
    display: -webkit-box;
    max-width: 100%;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.3;
}

.pricing-queue-truncate[b-8rtd52i1lo] {
    display: block;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Worksheet type badges */
/* ---------------------------------------------------------
   Uses the established Open-Stock and Pre-Pack visual treatments.
   --------------------------------------------------------- */

.pricing-queue-type-badge[b-8rtd52i1lo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 80px;
    min-height: 20px;
    padding: 2px 8px;
    border-radius: 999px;
    box-sizing: border-box;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.pricing-queue-type-badge--prepack[b-8rtd52i1lo] {
    background: rgba(63, 111, 159, 0.12);
    color: rgb(63, 111, 159);
    border: 1px solid rgba(63, 111, 159, 0.16);
}

.pricing-queue-type-badge--openstock[b-8rtd52i1lo] {
    background: rgba(142, 59, 103, 0.10);
    color: rgb(142, 59, 103);
    border: 1px solid rgba(142, 59, 103, 0.16);
}

.pricing-queue-type-badge--default[b-8rtd52i1lo] {
    background: rgba(148, 163, 184, 0.14);
    color: #475569;
    border: 1px solid rgba(148, 163, 184, 0.18);
}

/* Pricing status badges */

.pricing-queue-badge[b-8rtd52i1lo] {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 118px;
    height: 21px;
    padding: 0 6px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.pricing-queue-badge--released[b-8rtd52i1lo] {
    background: rgba(59, 130, 246, 0.14);
    color: #1d4ed8;
}

.pricing-queue-badge--progress[b-8rtd52i1lo] {
    background: rgba(245, 158, 11, 0.16);
    color: #b45309;
}

.pricing-queue-badge--submitted[b-8rtd52i1lo] {
    background: rgba(59, 130, 246, 0.14);
    color: #1d4ed8;
}

.pricing-queue-badge--returned[b-8rtd52i1lo] {
    background: rgba(239, 68, 68, 0.14);
    color: #b91c1c;
}

.pricing-queue-badge--completed[b-8rtd52i1lo] {
    background: rgba(34, 197, 94, 0.16);
    color: #15803d;
}

.pricing-queue-badge--cancelled[b-8rtd52i1lo],
.pricing-queue-badge--default[b-8rtd52i1lo] {
    background: rgba(148, 163, 184, 0.14);
    color: #475569;
}

/* Row actions */
/* ---------------------------------------------------------
   Provides a compact action surface without tinting the full sticky
   column or increasing its width.
   --------------------------------------------------------- */

.pricing-queue-row-actions[b-8rtd52i1lo] {
    width: 100%;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 0 5px;
    border-radius: 7px;
    background: #f3f6fb;
    box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.82);
    flex-wrap: nowrap;
    white-space: nowrap;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.pricing-queue-table tbody tr:hover .pricing-queue-row-actions[b-8rtd52i1lo] {
    background: #edf4ff;
    box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.68);
}

.pricing-queue-page--projection-preview .pricing-queue-row-actions[b-8rtd52i1lo] {
    min-height: 28px;
    flex-direction: row;
    gap: 0;
    padding: 0 5px;
}

.pricing-queue-link-action[b-8rtd52i1lo] {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--link-600, #2563eb);
    cursor: pointer;
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
}

.pricing-queue-link-action--primary[b-8rtd52i1lo] {
    color: var(--link-600, #2563eb);
    font-weight: 700;
}

.pricing-queue-link-action--projection[b-8rtd52i1lo]::before {
    content: "·";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 4px;
    color: rgba(100, 116, 139, 0.62);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    pointer-events: none;
    user-select: none;
}

.pricing-queue-link-action-text[b-8rtd52i1lo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.pricing-queue-link-action:hover[b-8rtd52i1lo],
.pricing-queue-link-action--projection:hover[b-8rtd52i1lo] {
    color: #1d4ed8;
}

    .pricing-queue-link-action:hover .pricing-queue-link-action-text[b-8rtd52i1lo],
    .pricing-queue-link-action--projection:hover .pricing-queue-link-action-text[b-8rtd52i1lo] {
        text-decoration: underline;
        text-underline-offset: 2px;
    }

.pricing-queue-link-action:focus[b-8rtd52i1lo],
.pricing-queue-link-action:focus-visible[b-8rtd52i1lo],
.pricing-queue-link-action:active[b-8rtd52i1lo] {
    outline: 0;
    box-shadow: none;
}

/* Queue states */

.pricing-queue-state[b-8rtd52i1lo] {
    padding: 18px 16px;
    color: var(--text-600, #475569);
}

.pricing-queue-state--error[b-8rtd52i1lo] {
    padding: 12px 16px 0;
}

/* Pager */

.pricing-queue-pager[b-8rtd52i1lo] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 6px 14px 4px;
    background: #f8fafc;
    border-top: 1px solid rgba(25, 35, 68, 0.06);
    flex-wrap: wrap;
}

.pricing-queue-pager-meta[b-8rtd52i1lo] {
    color: var(--text-600, #475569);
    font-size: 12px;
}

.pricing-queue-pager-actions[b-8rtd52i1lo] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.pricing-queue-pager-page[b-8rtd52i1lo] {
    min-width: 88px;
    text-align: center;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 600;
}

/* =====================================
   Promotion Cycle Context
   ---------------------------------------------------------
   Displays the exact Promotion Cycle applied from Cycle Summary
   without adding a second filter-clear action.
   ===================================== */

.pricing-queue-cycle-context[b-8rtd52i1lo] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 12px;
    padding: 7px 10px;
    border: 1px solid #cfe0fb;
    border-radius: 8px;
    background: #f4f8ff;
}

.pricing-queue-cycle-context-label[b-8rtd52i1lo] {
    color: #5e7698;
    font-size: 10.5px;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.pricing-queue-cycle-context-value[b-8rtd52i1lo] {
    min-width: 0;
    overflow: hidden;
    color: #14264a;
    font-size: 11.5px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Responsive behavior */
/* ---------------------------------------------------------
   Uses container queries based on available content width after
   sidebar expansion or collapse.
   --------------------------------------------------------- */

@media (min-width: 1600px) {
    .pricing-queue-table[b-8rtd52i1lo] {
        min-width: 1120px;
    }

    .pricing-queue-col-manufacturer[b-8rtd52i1lo] {
        width: 150px;
        min-width: 136px;
    }

    .pricing-queue-col-distributor[b-8rtd52i1lo] {
        width: 150px;
        min-width: 136px;
    }
}

@container pricing-queue-page (max-width: 1200px) {
    .pricing-queue-controls[b-8rtd52i1lo] {
        grid-template-columns: minmax(260px, 1fr) 180px 180px 108px;
    }
}

@container pricing-queue-page (max-width: 900px) {
    .pricing-queue-summary-strip--five[b-8rtd52i1lo],
    .pricing-queue-summary-strip--four[b-8rtd52i1lo] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pricing-queue-page--admin .pricing-queue-controls[b-8rtd52i1lo] {
        grid-template-columns: minmax(240px, 1fr) repeat(2, minmax(120px, 1fr));
    }
}

@container pricing-queue-page (max-width: 760px) {
    .pricing-queue-controls[b-8rtd52i1lo] {
        grid-template-columns: 1fr;
    }

    .pricing-queue-table-region[b-8rtd52i1lo] {
        margin-left: 12px;
        margin-right: 12px;
    }
}

@container pricing-queue-page (max-width: 640px) {
    .pricing-queue-summary-strip--five[b-8rtd52i1lo],
    .pricing-queue-summary-strip--four[b-8rtd52i1lo] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Shared/Promotions/PromotionDownstreamImpactModal.razor.rz.scp.css */
.promotion-downstream-impact-dialog[b-v9exr9ykyg] {
  max-width: 920px;
}

  .promotion-downstream-impact-dialog .modal-content[b-v9exr9ykyg] {
    max-height: calc(100vh - 56px);
    display: flex;
    flex-direction: column;
  }

.promotion-downstream-impact-body[b-v9exr9ykyg] {
  overflow-y: auto;
  max-height: calc(100vh - 190px);
  padding-right: 16px;
}

  .promotion-downstream-impact-body[b-v9exr9ykyg]::-webkit-scrollbar {
    width: 10px;
  }

  .promotion-downstream-impact-body[b-v9exr9ykyg]::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 999px;
  }

  .promotion-downstream-impact-body[b-v9exr9ykyg]::-webkit-scrollbar-thumb {
    background: #94a3b8;
    border-radius: 999px;
  }

    .promotion-downstream-impact-body[b-v9exr9ykyg]::-webkit-scrollbar-thumb:hover {
      background: #64748b;
    }

.promotion-downstream-impact-summary[b-v9exr9ykyg] {
  background: var(--bg-surface, #fff);
  border: 1px solid var(--border-200, #e2e8f0);
  border-radius: 12px;
  overflow: hidden;
}

.promotion-downstream-impact-summary-header[b-v9exr9ykyg] {
  padding: 8px 14px;
  font-weight: 700;
  border-bottom: 1px solid var(--border-200, #e2e8f0);
}

.promotion-downstream-impact-summary-body[b-v9exr9ykyg] {
  padding: 12px 14px;
}

.promotion-downstream-impact-metric[b-v9exr9ykyg] {
  border: 1px solid var(--border-200, #e2e8f0);
  border-radius: 10px;
  padding: 10px 12px;
  height: 100%;
  background: #ffffff;
}

.promotion-downstream-impact-metric-label[b-v9exr9ykyg] {
  font-size: 0.78rem;
  font-weight: 700;
  color: #475569;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.promotion-downstream-impact-metric-value[b-v9exr9ykyg] {
  font-size: 1.45rem;
  font-weight: 800;
  line-height: 1.2;
  color: #0f172a;
}

.promotion-downstream-impact-metric-help[b-v9exr9ykyg] {
  font-size: 0.82rem;
  color: #64748b;
}

.promotion-downstream-impact-note[b-v9exr9ykyg] {
  border: 1px solid #fde68a;
  background: #fffbeb;
  border-radius: 10px;
  padding: 10px 12px;
  color: #78350f;
}

.promotion-downstream-impact-details[b-v9exr9ykyg] {
  border: 1px solid var(--border-200, #e2e8f0);
  border-radius: 10px;
  background: #ffffff;
  padding: 9px 12px;
}

  .promotion-downstream-impact-details summary[b-v9exr9ykyg] {
    cursor: pointer;
    font-weight: 700;
    color: #334155;
  }

  .promotion-downstream-impact-details[open] summary[b-v9exr9ykyg] {
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-200, #e2e8f0);
  }
/* /Components/Shared/Promotions/PromotionEditShared.razor.rz.scp.css */
/* Promotion Edit shared styles */
/* ---------------------------------------------------------
   Follows the visual order of the shared Promotion Edit component.
   Base layout, workflow sections, item entry, modals, and
   responsive overrides remain grouped by purpose.
   --------------------------------------------------------- */

/* Page shell */
/* ---------------------------------------------------------
   Bounds the Promotion Edit workspace and participates in the
   page-height chain so the form can own internal scroll.
   --------------------------------------------------------- */

.promotion-edit-page[b-d3jplb9s3x] {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 0;
    padding: 2px 0 0;
    border-radius: 8px 8px 0 0;
    overflow: hidden;
    transition: background 0.18s ease;
    box-sizing: border-box;
    max-width: 100%;
    container-type: inline-size;
    container-name: promotion-edit;
}

    .promotion-edit-page[b-d3jplb9s3x]::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: radial-gradient(circle at top center, rgba(255, 255, 255, 0.12), transparent 44%), linear-gradient( to right, rgba(255, 255, 255, 0.06), transparent 12%, transparent 88%, rgba(255, 255, 255, 0.06) );
    }

/* Edit workspace */
/* ---------------------------------------------------------
   Separates stable header context, the scrollable form region,
   and anchored workflow actions.
   --------------------------------------------------------- */

.promotion-edit-workspace[b-d3jplb9s3x] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
    overflow: hidden;
}

.promotion-edit-workspace--summary-collapsed[b-d3jplb9s3x] {
    gap: 0;
}

.promotion-edit-header-region[b-d3jplb9s3x] {
    flex: 0 0 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Edit form host */
/* ---------------------------------------------------------
   Keeps the wrapper and generated EditForm in the flex height
   chain required for internal scrolling.
   --------------------------------------------------------- */

.promotion-edit-form-host[b-d3jplb9s3x] {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
}

.promotion-edit-projected-region[b-d3jplb9s3x] {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.promotion-edit-form-host[b-d3jplb9s3x]  form.promotion-edit-form-root {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    margin: 0;
}

.promotion-edit-form-host[b-d3jplb9s3x]  form.promotion-edit-form-root {
    min-height: 0;
}

/* Form shell */
/* ---------------------------------------------------------
   Contains the entry controls and framed Promotion workspace.
   The entry controls remain outside the bordered form frame.
   --------------------------------------------------------- */

.promotion-edit-form-shell[b-d3jplb9s3x] {
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Form workspace frame */
/* ---------------------------------------------------------
   Frames the internally scrolling form body and anchored
   workflow command bar.
   --------------------------------------------------------- */

.promotion-edit-form-frame[b-d3jplb9s3x] {
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.56);
}

.promotion-edit-form-viewport[b-d3jplb9s3x] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    padding: 4px 2px 4px 5px;
}

/* Form viewport scroll cue */
/* ---------------------------------------------------------
   Adds a subtle inset edge to distinguish the scrollable form
   body from the stable context above.
   --------------------------------------------------------- */

.promotion-edit-form-viewport[b-d3jplb9s3x] {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

/* Form command bar */
/* ---------------------------------------------------------
   Anchors draft, submit, and status-specific workflow actions
   below the internally scrolling form.
   --------------------------------------------------------- */

.promotion-edit-form-actions-bar[b-d3jplb9s3x] {
    position: relative;
    z-index: 5;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 4px;
    padding: 3px 8px 3px 10px;
    background: transparent;
    box-shadow: none;
}

    /* Form command buttons */
    /* ---------------------------------------------------------
   Keeps anchored workflow actions compact without changing
   the command bar layout.
   --------------------------------------------------------- */

    .promotion-edit-form-actions-bar .btn[b-d3jplb9s3x] {
        min-height: 30px;
        padding: 4px 14px;
        font-size: 14px;
        line-height: 1.15;
        border-radius: 8px;
    }

.promotion-edit-state[b-d3jplb9s3x] {
    padding: 18px 16px;
    color: var(--text-600);
}

.promotion-edit-empty[b-d3jplb9s3x] {
    color: var(--text-600);
    padding: 6px 2px;
}

.promotion-edit-form-actions[b-d3jplb9s3x] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

/* Shared card styling */
/* ---------------------------------------------------------
   Defines the base surface, border, header, and body treatment
   used by Promotion Edit cards.
   --------------------------------------------------------- */

.promotion-edit-card[b-d3jplb9s3x] {
    background: var(--bg-surface);
    border: 1px solid var(--border-200);
    border-radius: var(--radius-2);
    box-shadow: var(--shadow-1);
    overflow: hidden;
    margin-bottom: 0;
}

.promotion-edit-card-header[b-d3jplb9s3x] {
    padding: 14px 16px 10px;
    border-bottom: 1px solid var(--border-200);
}

.promotion-edit-card-header-split[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px 12px;
    flex-wrap: wrap;
    padding-top: 0;
    padding-bottom: 0;
}

.promotion-edit-card-title[b-d3jplb9s3x] {
    font-size: 15px;
    font-weight: 600;
    color: var(--text-900);
}

.promotion-edit-card-body[b-d3jplb9s3x] {
    padding: 16px;
}

/* Promotion workflow sections */
/* ---------------------------------------------------------
   Controls top-level section shells, collapsed summaries,
   validation indicators, chevrons, and section body spacing.
   --------------------------------------------------------- */

.promotion-workflow-section[b-d3jplb9s3x] {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border-color: rgba(25, 35, 68, 0.10);
    background: #ffffff;
}

    .promotion-workflow-section + .promotion-workflow-section[b-d3jplb9s3x],
    .promotion-workflow-section + .promotion-layout-row[b-d3jplb9s3x],
    .promotion-layout-row + .promotion-workflow-section[b-d3jplb9s3x] {
        margin-top: 8px;
    }

.promotion-workflow-section--setup[b-d3jplb9s3x] {
    padding: 0;
}

.promotion-workflow-section--collapsed[b-d3jplb9s3x] {
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.045);
}

.promotion-workflow-section-header[b-d3jplb9s3x] {
    width: 100%;
    min-height: 42px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 12px;
    padding: 9px 12px;
    border: 0;
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    color: var(--text-900, #0f2147);
    text-align: left;
    cursor: pointer;
}

    /* Workflow header alignment */
    /* ---------------------------------------------------------
   Keeps titles left, collapsed summaries in the available
   center space, and warnings and chevrons fixed right.
   --------------------------------------------------------- */

    .promotion-workflow-section-header > .promotion-workflow-section-title-wrap[b-d3jplb9s3x] {
        grid-column: 1;
    }

    .promotion-workflow-section-header > .promotion-workflow-section-summary[b-d3jplb9s3x] {
        grid-column: 2;
        justify-self: start;
    }

    .promotion-workflow-section-header[b-d3jplb9s3x]  .promotion-workflow-section-warning {
        grid-column: 3;
        justify-self: end;
    }

    .promotion-workflow-section-header > i:last-child[b-d3jplb9s3x] {
        grid-column: 4;
        justify-self: end;
        width: 14px;
        text-align: center;
    }

    .promotion-workflow-section-header:hover[b-d3jplb9s3x] {
        background: linear-gradient(180deg, #ffffff 0%, #f3f7fb 100%);
    }

    .promotion-workflow-section-header:focus[b-d3jplb9s3x],
    .promotion-workflow-section-header:focus-visible[b-d3jplb9s3x],
    .promotion-workflow-section-heading-button:focus[b-d3jplb9s3x],
    .promotion-workflow-section-heading-button:focus-visible[b-d3jplb9s3x] {
        outline: 0;
        box-shadow: none;
    }

    .promotion-workflow-section-header i[b-d3jplb9s3x],
    .promotion-workflow-section-heading-button i[b-d3jplb9s3x] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: var(--text-500, #64748b);
        font-size: 13px;
        line-height: 1;
        vertical-align: middle;
    }

.promotion-workflow-section-title-wrap[b-d3jplb9s3x] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.promotion-workflow-section-index[b-d3jplb9s3x] {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(37, 99, 235, 0.22);
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.07);
    color: var(--brand-700, #1d4ed8);
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.promotion-workflow-section-title[b-d3jplb9s3x] {
    min-width: 0;
    color: var(--text-900, #0f2147);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
}

.promotion-workflow-section-summary[b-d3jplb9s3x] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 0;
    color: var(--text-600, #64748b);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.promotion-workflow-summary-pair[b-d3jplb9s3x] {
    min-width: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
}

    .promotion-workflow-summary-pair:not(:last-child)[b-d3jplb9s3x]::after {
        content: "|";
        margin: 0 7px;
        color: rgba(100, 116, 139, 0.55);
        font-weight: 600;
    }

.promotion-workflow-summary-label[b-d3jplb9s3x] {
    flex: 0 0 auto;
    color: var(--text-500, #64748b);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.015em;
}

.promotion-workflow-summary-value[b-d3jplb9s3x] {
    min-width: 0;
    color: var(--text-800, #1e293b);
    font-size: 12px;
    font-weight: 650;
    overflow: hidden;
    text-overflow: ellipsis;
}

.promotion-workflow-section-body[b-d3jplb9s3x] {
    min-width: 0;
}

.promotion-workflow-section-body--setup[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 8px;
    background: rgba(248, 250, 252, 0.48);
}

    .promotion-workflow-section-body--setup > .promotion-layout-row[b-d3jplb9s3x],
    .promotion-workflow-section-body--setup > .promotion-layout-card[b-d3jplb9s3x] {
        margin: 0;
    }

.promotion-workflow-section-body--items[b-d3jplb9s3x] {
    padding-top: 10px;
}

/* Expanded Items command row */
.promotion-items-command-row[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin: -4px -4px 8px;
    padding: 0 4px 4px;
    border-bottom: 0;
}

.promotion-items-command-status[b-d3jplb9s3x] {
    min-width: 0;
}

.promotion-items-command-row .promotion-items-header-actions[b-d3jplb9s3x] {
    justify-content: flex-end;
    flex-wrap: nowrap;
}

/* Items section header */
.promotion-workflow-section-header--items[b-d3jplb9s3x] {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 8px 12px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.promotion-workflow-section-heading-button[b-d3jplb9s3x] {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    justify-content: stretch;
    gap: 12px;
    padding: 3px 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

    .promotion-workflow-section-heading-button > .promotion-workflow-section-title-wrap[b-d3jplb9s3x] {
        grid-column: 1;
    }

    .promotion-workflow-section-heading-button > .promotion-workflow-section-summary[b-d3jplb9s3x] {
        grid-column: 2;
        justify-self: start;
    }

    .promotion-workflow-section-heading-button[b-d3jplb9s3x]  .promotion-workflow-section-warning {
        grid-column: 3;
        justify-self: end;
    }

    .promotion-workflow-section-heading-button > i:last-child[b-d3jplb9s3x] {
        grid-column: 4;
        justify-self: end;
        width: 14px;
        text-align: center;
    }

    .promotion-workflow-section-heading-button:hover[b-d3jplb9s3x] {
        color: var(--text-900, #0f2147);
    }

    .promotion-workflow-section-heading-button:focus[b-d3jplb9s3x],
    .promotion-workflow-section-heading-button:focus-visible[b-d3jplb9s3x] {
        outline: 0;
        box-shadow: none;
    }

.promotion-workflow-section-header--items .promotion-workflow-section-summary[b-d3jplb9s3x] {
    flex: 0 0 auto;
}

.promotion-workflow-section-header--items .promotion-items-header-actions[b-d3jplb9s3x] {
    justify-content: flex-end;
    flex-wrap: nowrap;
}

.promotion-workflow-section-body--setup .promotion-edit-card[b-d3jplb9s3x] {
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.045);
}

.promotion-workflow-section-body--setup .promotion-edit-card-header[b-d3jplb9s3x] {
    min-height: 34px;
    padding: 9px 12px 7px;
}

.promotion-workflow-section-body--setup .promotion-edit-card-body[b-d3jplb9s3x] {
    padding: 12px;
}

.promotion-workflow-section-warning[b-d3jplb9s3x] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #dc2626;
    font-size: 13px;
    line-height: 1;
}

    .promotion-workflow-section-warning .bi[b-d3jplb9s3x] {
        color: #dc2626;
        font-size: 13px;
    }

/* WAM configuration reference state */
/* ---------------------------------------------------------
   Distinguishes WAM-configured fields when Manufacturer or
   Broker access is read-only reference context.
   --------------------------------------------------------- */

.promotion-workflow-section--wam-reference[b-d3jplb9s3x] {
    border-color: rgba(37, 99, 235, 0.16);
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

    .promotion-workflow-section--wam-reference[b-d3jplb9s3x]::before {
        content: "";
        position: absolute;
        top: 42px;
        bottom: 0;
        left: 0;
        width: 3px;
        background: rgba(37, 99, 235, 0.35);
    }

.promotion-workflow-section-badge[b-d3jplb9s3x] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 18px;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.015em;
    white-space: nowrap;
}

.promotion-workflow-section-badge--readonly[b-d3jplb9s3x] {
    border: 1px solid rgba(100, 116, 139, 0.22);
    background: rgba(241, 245, 249, 0.92);
    color: var(--text-600, #64748b);
}

.promotion-wam-reference-note[b-d3jplb9s3x] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0 0 10px;
    padding: 7px 10px;
    border: 1px solid rgba(37, 99, 235, 0.14);
    border-radius: 10px;
    background: rgba(239, 246, 255, 0.72);
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.25;
}

    .promotion-wam-reference-note .bi[b-d3jplb9s3x] {
        color: var(--brand-700, #1d4ed8);
        font-size: 13px;
    }

/* Promotion overview */
/* ---------------------------------------------------------
   Styles Promotion Context and Workflow Summary panels,
   status indicators, review links, and history metadata.
   --------------------------------------------------------- */

.promotion-summary-band[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
    overflow: visible;
}

.promotion-summary-panel[b-d3jplb9s3x] {
    min-width: 0;
    position: relative;
    background: #fff;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 12px;
    box-shadow: 0 1px 5px rgba(15, 23, 42, 0.06);
    padding: 0;
    overflow: hidden;
}

.promotion-summary-panel-header[b-d3jplb9s3x] {
    min-height: 27px;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 0;
    padding: 4px 10px;
    border-radius: 0;
    border-bottom: 1px solid rgba(25, 35, 68, 0.12);
}

.promotion-summary-panel-header--split[b-d3jplb9s3x] {
    justify-content: space-between;
    flex-wrap: nowrap;
    width: 100%;
}

.promotion-summary-panel--context .promotion-summary-panel-header[b-d3jplb9s3x] {
    background: #f1f5f9;
}

.promotion-summary-panel--workflow .promotion-summary-panel-header[b-d3jplb9s3x] {
    background: #effaf8;
}

.promotion-summary-panel-title[b-d3jplb9s3x] {
    color: var(--text-600, #64748b);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

/* Header status pills */

.promotion-summary-context-header-status[b-d3jplb9s3x],
.promotion-summary-workflow-header-status[b-d3jplb9s3x] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    padding: 3px 9px;
    border-radius: 999px;
    border: 1px solid transparent;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

/* Promotion Cycle status */

.promotion-summary-context-header-status[b-d3jplb9s3x],
.promotion-summary-context-header-status--cycle[b-d3jplb9s3x] {
    background: rgba(59, 130, 246, 0.08);
    border-color: rgba(37, 99, 235, 0.16);
    color: #1d4ed8;
}

/* Draft and default status */

.promotion-summary-workflow-header-status[b-d3jplb9s3x],
.promotion-summary-workflow-header-status--draft[b-d3jplb9s3x],
.promotion-summary-workflow-header-status--default[b-d3jplb9s3x] {
    background: #e2e8f0;
    border-color: #cbd5e1;
    color: #475569;
}

/* Submitted and resubmitted status */

.promotion-summary-workflow-header-status--submitted[b-d3jplb9s3x] {
    background: #dbeafe;
    border-color: #dbeafe;
    color: #003dff;
}

/* Review statuses */

.promotion-summary-workflow-header-status--review[b-d3jplb9s3x] {
    background: #ffedd5;
    border-color: #ffedd5;
    color: #c2410c;
}

/* Revision requested status */

.promotion-summary-workflow-header-status--revision[b-d3jplb9s3x] {
    background: #ffe4e6;
    border-color: #fecdd3;
    color: #e11d48;
}

/* Approved and completed statuses */

.promotion-summary-workflow-header-status--approved[b-d3jplb9s3x] {
    background: #d1fae5;
    border-color: #bbf7d0;
    color: #15803d;
}

/* Overview panel bodies */

.promotion-summary-context[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    min-height: 82px;
    padding: 8px 12px 9px;
    gap: 8px;
}

.promotion-summary-context-hero[b-d3jplb9s3x] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.promotion-summary-context-hero-value[b-d3jplb9s3x] {
    margin: 0;
    color: var(--text-900, #0f2147);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0;
}

.promotion-summary-context-grid[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(96px, 0.58fr) minmax(0, 1.55fr);
    gap: 0;
    border: 1px solid rgba(25, 35, 68, 0.10);
    border-radius: 10px;
    overflow: hidden;
    background: rgba(216, 226, 232, 0.10);
}

.promotion-summary-context-grid-item[b-d3jplb9s3x] {
    min-width: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    background: transparent;
}

    .promotion-summary-context-grid-item + .promotion-summary-context-grid-item[b-d3jplb9s3x] {
        border-left: 1px solid rgba(25, 35, 68, 0.10);
    }

.promotion-summary-context-grid-top[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 10px 4px 10px;
    background: rgba(117, 140, 167, 0.07);
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.promotion-summary-context-grid-label[b-d3jplb9s3x] {
    font-size: 10px;
    line-height: 1.1;
    font-weight: 700;
    color: var(--text-500);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.promotion-summary-context-grid-value[b-d3jplb9s3x] {
    padding: 10px 10px 9px 10px;
    font-size: 12px;
    line-height: 1.18;
    font-weight: 500;
    color: var(--text-900);
    min-width: 0;
    overflow-wrap: normal;
    word-break: normal;
}

.promotion-summary-context-grid-value--strong[b-d3jplb9s3x] {
    font-weight: 500;
    color: var(--text-900);
}

.promotion-summary-context-grid-value--muted[b-d3jplb9s3x] {
    color: var(--text-900);
}

.promotion-summary-workflow[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    min-height: 82px;
    padding: 8px 12px 9px;
    gap: 8px;
}

.promotion-summary-status-text[b-d3jplb9s3x] {
    margin-bottom: 0;
    color: var(--text-900, #0f2147);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0;
}

.promotion-summary-workflow-grid[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
    gap: 0;
    border: 1px solid rgba(25, 35, 68, 0.10);
    border-radius: 10px;
    overflow: hidden;
    background: rgba(216, 226, 232, 0.10);
}

.promotion-summary-workflow-grid-item[b-d3jplb9s3x] {
    min-width: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    background: transparent;
}

    .promotion-summary-workflow-grid-item + .promotion-summary-workflow-grid-item[b-d3jplb9s3x] {
        border-left: 1px solid rgba(25, 35, 68, 0.10);
    }

.promotion-summary-workflow-grid-top[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
    min-height: 28px;
    padding: 5px 10px 4px 10px;
    background: rgba(91, 196, 191, 0.08);
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
}

.promotion-summary-workflow-grid-label[b-d3jplb9s3x] {
    font-size: 10px;
    line-height: 1.1;
    font-weight: 700;
    color: var(--text-500);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.promotion-summary-workflow-grid-value[b-d3jplb9s3x] {
    padding: 10px 10px 9px 10px;
    font-size: 12px;
    line-height: 1.18;
    font-weight: 500;
    color: var(--text-900);
    min-width: 0;
    overflow-wrap: anywhere;
}

.promotion-summary-workflow-grid-empty[b-d3jplb9s3x] {
    padding: 10px 10px 9px 10px;
    font-size: 12px;
    line-height: 1.18;
    font-weight: 500;
    color: var(--text-600);
    min-width: 0;
}

.promotion-summary-workflow-link[b-d3jplb9s3x] {
    padding: 0;
    border: 0;
    background: transparent;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    line-height: 1.15;
    font-weight: 600;
    color: var(--link-600, #2563eb);
    white-space: nowrap;
}

    .promotion-summary-workflow-link i[b-d3jplb9s3x] {
        font-size: 11px;
        line-height: 1;
    }

    .promotion-summary-workflow-link:hover[b-d3jplb9s3x] {
        text-decoration: underline;
    }

.promotion-summary-panel .promotions-badge[b-d3jplb9s3x] {
    flex: 0 0 auto;
}

/* Top-level form layout */
/* ---------------------------------------------------------
   Provides the shared vertical stack and card sizing for the
   main editable Promotion sections.
   --------------------------------------------------------- */

.promotion-layout-stack[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.promotion-layout-row[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.promotion-layout-card[b-d3jplb9s3x] {
    width: 100%;
    min-width: 0;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
}

    .promotion-layout-card > .promotion-edit-card-body[b-d3jplb9s3x] {
        flex: 1 1 auto;
        min-width: 0;
    }

    .promotion-layout-card .promotion-edit-card-header[b-d3jplb9s3x] {
        padding: 8px 12px 8px;
    }

    .promotion-layout-card .promotion-edit-card-body[b-d3jplb9s3x] {
        padding: 10px 12px;
    }

/* Promotion entry controls */
/* ---------------------------------------------------------
   Positions overview visibility, the centered entry marker,
   and top-level section expansion controls.
   --------------------------------------------------------- */

.promotion-form-intro-band[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 10px;
    padding: 2px 0 1px 0;
    margin-top: 0;
    margin-bottom: 0;
}

.promotion-form-intro-side[b-d3jplb9s3x] {
    min-width: 0;
}

.promotion-form-intro-side--actions[b-d3jplb9s3x] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.promotion-form-intro-title[b-d3jplb9s3x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 5px 18px;
    border: 1px solid rgba(30, 64, 175, 0.75);
    border-radius: 999px;
    background: #fff;
    color: var(--text-600, #64748b);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: 0.035em;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
}

/* Promotion view commands */
/* ---------------------------------------------------------
   Presents overview and section-expansion controls as compact
   link-style actions without changing placement.
   --------------------------------------------------------- */

.promotion-summary-inline-toggle[b-d3jplb9s3x] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 20px;
    padding: 0 10px 0 0;
    border: 0;
    background: transparent;
    color: var(--link-600, #2563eb);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    box-shadow: none;
    cursor: pointer;
    text-decoration: none;
    transition: color 0.15s ease;
}

    .promotion-summary-inline-toggle i[b-d3jplb9s3x] {
        color: currentColor;
        font-size: 11px;
        line-height: 1;
        transition: color 0.15s ease;
    }

    .promotion-summary-inline-toggle:hover[b-d3jplb9s3x] {
        color: var(--link-700, #1d4ed8);
        background: transparent;
    }

        .promotion-summary-inline-toggle:hover span[b-d3jplb9s3x] {
            text-decoration: underline;
            text-underline-offset: 2px;
        }

    .promotion-summary-inline-toggle:focus-visible[b-d3jplb9s3x] {
        outline: 2px solid rgba(37, 99, 235, 0.28);
        outline-offset: 3px;
        border-radius: 3px;
    }

    .promotion-summary-inline-toggle:active[b-d3jplb9s3x] {
        color: var(--link-800, #1e40af);
    }

.promotion-form-intro-side--actions[b-d3jplb9s3x] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.promotion-form-sections-toggle[b-d3jplb9s3x] {
    white-space: nowrap;
}

.promotion-form-intro-side--summary-actions[b-d3jplb9s3x] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    min-width: 0;
}

/* Promotion view preference */
/* ---------------------------------------------------------
   Styles the overview visibility action and persisted-view
   switch while preserving the current placement.
   --------------------------------------------------------- */

.promotion-view-control i[b-d3jplb9s3x] {
    width: 14px;
    color: currentColor;
    font-size: 13px;
    text-align: center;
}

.promotion-view-preference-switch[b-d3jplb9s3x] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    color: var(--text-600, #64748b);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
}

    .promotion-view-preference-switch input[b-d3jplb9s3x] {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        opacity: 0;
        pointer-events: none;
    }

.promotion-view-preference-track[b-d3jplb9s3x] {
    position: relative;
    width: 30px;
    height: 16px;
    flex: 0 0 auto;
    border: 1px solid rgba(100, 116, 139, 0.34);
    border-radius: 999px;
    background: #cbd5e1;
    transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

.promotion-view-preference-thumb[b-d3jplb9s3x] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.24);
    transition: transform 0.15s ease;
}

.promotion-view-preference-switch input:checked + .promotion-view-preference-track[b-d3jplb9s3x] {
    border-color: var(--brand-600, #2563eb);
    background: var(--brand-600, #2563eb);
}

    .promotion-view-preference-switch input:checked + .promotion-view-preference-track
    .promotion-view-preference-thumb[b-d3jplb9s3x] {
        transform: translateX(14px);
    }

.promotion-view-preference-switch input:focus-visible + .promotion-view-preference-track[b-d3jplb9s3x] {
    box-shadow: var( --focus-ring, 0 0 0 3px rgba(37, 99, 235, 0.18) );
}

.promotion-view-preference-switch:hover
.promotion-view-preference-label[b-d3jplb9s3x] {
    color: var(--text-800, #1e293b);
}

/* Promotion basics */
/* ---------------------------------------------------------
   Controls Promotion type, identity, description, notes, and
   the grouped field ratios used across the section.
   --------------------------------------------------------- */

.promotion-basics-v2[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Shared grouped shell */
/* ---------------------------------------------------------
   Group boundaries align to the Promotion Type shell.
   --------------------------------------------------------- */
.promotion-basics-row--grouped[b-d3jplb9s3x],
.promotion-basics-row--notes[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 28px;
    row-gap: 12px;
    align-items: start;
}

.promotion-basics-row--primary-compact[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 12px;
    align-items: start;
}

.promotion-basics-group[b-d3jplb9s3x] {
    min-width: 0;
    display: grid;
    gap: 12px;
    align-items: start;
}

/* Promotion date and entered-by fields */
.promotion-basics-group--meta[b-d3jplb9s3x] {
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1fr);
    column-gap: 12px;
}

/* Manufacturer item number and bracket fields */
.promotion-basics-group--identity[b-d3jplb9s3x] {
    grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.78fr);
    column-gap: 12px;
}

/* Notes fields */
.promotion-basics-group--notes[b-d3jplb9s3x] {
    grid-template-columns: 1fr;
}

.promotion-basics-field[b-d3jplb9s3x] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.promotion-basics-description-textarea[b-d3jplb9s3x] {
    min-height: 60px;
    resize: vertical;
}

.promotion-basics-description-textarea--compact[b-d3jplb9s3x] {
    min-height: 38px;
    height: 38px;
    line-height: 1.15;
    padding-top: 10px;
    padding-bottom: 5px;
    resize: vertical;
}

.promotion-basics-textarea--tall[b-d3jplb9s3x] {
    min-height: 60px;
    resize: vertical;
}

/* Promotion type and description row */
.promotion-basics-row--description-paired[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: 1fr;
}

.promotion-basics-group--description-meta[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(220px, 250px) minmax(0, 1fr);
    column-gap: 12px;
    align-items: start;
}

.promotion-basics-group--primary-left[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(132px, 0.82fr) minmax(150px, 0.96fr) minmax(92px, 0.48fr);
    column-gap: 10px;
    align-items: start;
    min-width: 0;
}

.promotion-basics-group--primary-right[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: 1fr;
    column-gap: 0;
    align-items: start;
    min-width: 0;
}

/* Keep the dropdown shell visually aligned with Promotion Date width behavior */
.promotion-basics-field--promotion-type[b-d3jplb9s3x] {
    min-width: 0;
}

    .promotion-basics-field--promotion-type .form-select[b-d3jplb9s3x] {
        width: 100%;
    }

.promotion-basics-field--description[b-d3jplb9s3x] {
    min-width: 0;
}

.promotion-basics-field--manufacturer-item[b-d3jplb9s3x],
.promotion-basics-field--bracket[b-d3jplb9s3x] {
    min-width: 0;
}

/* Commercial terms and Promotion flags */
/* ---------------------------------------------------------
   Uses compact side-by-side cards to reduce vertical height
   while keeping financial terms and flags distinct.
   --------------------------------------------------------- */

.promotion-terms-flags-row[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(660px, 1.58fr) minmax(310px, 0.82fr);
    gap: 10px;
    align-items: stretch;
    min-width: 0;
}

.promotion-layout-card--terms[b-d3jplb9s3x],
.promotion-layout-card--flags[b-d3jplb9s3x] {
    min-width: 0;
}

.promotion-edit-card-body--compact-terms[b-d3jplb9s3x],
.promotion-edit-card-body--compact-flags[b-d3jplb9s3x] {
    padding: 8px 10px;
}

.promotion-terms-compact-grid[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(168px, 0.82fr);
    column-gap: 20px; /* Wider spacing between the 3 Commercial Terms columns. */
    row-gap: 8px;
    align-items: stretch;
    min-width: 0;
}

.promotion-terms-compact-col[b-d3jplb9s3x] {
    min-width: 0;
    display: grid;
    grid-template-rows: repeat(3, minmax(0, auto));
    gap: 8px;
    align-content: start;
}

    .promotion-terms-compact-col > *[b-d3jplb9s3x] {
        min-width: 0;
    }

.promotion-terms-compact-field[b-d3jplb9s3x] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

    .promotion-terms-compact-field .form-label[b-d3jplb9s3x] {
        margin-bottom: 3px;
        font-size: 13.5px;
        line-height: 1.35;
        white-space: nowrap;
    }

.promotion-terms-type-money-control[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(72px, 0.72fr) minmax(82px, 0.86fr);
    gap: 6px;
    min-width: 0;
}

.promotion-terms-compact-grid .form-control[b-d3jplb9s3x] {
    min-height: 32px;
    height: 32px;
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: 14px;
    line-height: 1.15;
}

.promotion-terms-compact-grid .promotion-affix-field__affix[b-d3jplb9s3x] {
    font-size: 13px;
}

.promotion-terms-compact-grid .promotion-affix-field--prefix .promotion-affix-field__input[b-d3jplb9s3x] {
    padding-left: 24px;
}

.promotion-terms-compact-grid .promotion-segmented[b-d3jplb9s3x],
.promotion-terms-compact-grid .promotion-segmented--compact[b-d3jplb9s3x] {
    min-height: 32px;
    height: 32px;
}

    .promotion-terms-compact-grid .promotion-segmented-option[b-d3jplb9s3x],
    .promotion-terms-compact-grid .promotion-segmented--compact .promotion-segmented-option[b-d3jplb9s3x] {
        min-height: 30px;
        padding: 4px 7px;
        font-size: 12px;
        line-height: 1.1;
    }

.promotion-flags-compact-list[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 5px;
    align-content: start;
}

    .promotion-flags-compact-list .promotion-inline-check[b-d3jplb9s3x] {
        min-height: 20px;
        gap: 7px;
        font-size: 13px;
        line-height: 1.2;
    }

    .promotion-flags-compact-list .form-check-input[b-d3jplb9s3x] {
        flex: 0 0 auto;
        margin-top: 0;
    }

    .promotion-flags-compact-list span[b-d3jplb9s3x] {
        min-width: 0;
        overflow-wrap: anywhere;
        word-break: normal;
    }

/* Segmented controls */
.promotion-segmented[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border: 1px solid var(--border-200);
    border-radius: 8px;
    overflow: hidden;
    background: var(--bg-surface-2, #f8fafc);
    min-height: 36px;
    max-width: 100%;
}

.promotion-segmented-option[b-d3jplb9s3x] {
    border: 0;
    border-right: 1px solid var(--border-200);
    background: transparent;
    color: var(--text-800);
    font-size: 12px;
    font-weight: 600;
    padding: 6px 10px;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.2;
    transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

    .promotion-segmented-option:last-child[b-d3jplb9s3x] {
        border-right: 0;
    }

    .promotion-segmented-option:hover:not(:disabled)[b-d3jplb9s3x] {
        background: rgba(59, 130, 246, 0.06);
    }

    .promotion-segmented-option.is-active[b-d3jplb9s3x] {
        background: rgba(59, 130, 246, 0.14);
        color: var(--brand-700);
        box-shadow: inset 0 0 0 1px rgba(59, 130, 246, 0.08);
    }

    .promotion-segmented-option:disabled[b-d3jplb9s3x] {
        opacity: 0.72;
        cursor: not-allowed;
    }

.promotion-segmented--compact[b-d3jplb9s3x] {
    min-height: 34px;
}

    .promotion-segmented--compact .promotion-segmented-option[b-d3jplb9s3x] {
        min-height: 34px;
        padding: 5px 8px;
        font-size: 12px;
    }

/* Order and delivery dates */
/* ---------------------------------------------------------
   Provides the shared date grid for order and delivery windows.
   --------------------------------------------------------- */

.promotion-dates-grid[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.promotion-dates-field[b-d3jplb9s3x] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* WAM configuration */
/* ---------------------------------------------------------
   Styles WAM-only metadata, administrative flags, required
   messages, and read-only reference fields.
   --------------------------------------------------------- */

.promotion-wam-field[b-d3jplb9s3x] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.promotion-wam-grid[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.promotion-wam-required-message[b-d3jplb9s3x] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    width: fit-content;
    max-width: 100%;
    padding: 5px 9px;
    border: 1px solid rgba(245, 158, 11, 0.24);
    border-radius: 999px;
    background: rgba(245, 158, 11, 0.08);
    color: #92400e;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
}

    .promotion-wam-required-message i[b-d3jplb9s3x] {
        font-size: 12px;
        line-height: 1;
    }

.promotion-wam-flags-row[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: repeat(3, max-content);
    gap: 18px 28px;
    align-items: center;
}

.promotion-wam-row[b-d3jplb9s3x] {
    display: grid;
    gap: 10px;
    align-items: start;
}

.promotion-wam-row--primary[b-d3jplb9s3x],
.promotion-wam-row--secondary[b-d3jplb9s3x] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.promotion-inline-check[b-d3jplb9s3x] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    min-height: 22px;
    font-size: 13px;
    font-weight: 500;
    color: var(--text-700);
    cursor: pointer;
}

    .promotion-inline-check .form-check-input[b-d3jplb9s3x] {
        margin: 0;
        vertical-align: middle;
    }

    /* Disabled checkbox rows should not behave like clickable controls. */
    .promotion-inline-check:has(.form-check-input:disabled)[b-d3jplb9s3x] {
        cursor: default;
        color: var(--text-700);
    }

        .promotion-inline-check:has(.form-check-input:disabled) span[b-d3jplb9s3x] {
            cursor: default;
        }

        .promotion-inline-check:has(.form-check-input:disabled) .form-check-input[b-d3jplb9s3x] {
            cursor: default;
        }

/* Promotion items */
/* ---------------------------------------------------------
   Controls the Items toolbar, item card shell, collapsed
   summaries, and shared Open-Stock and Pre-Pack behavior.
   --------------------------------------------------------- */

.promotion-item-block[b-d3jplb9s3x] {
    border: 1px solid var(--border-200);
    border-radius: var(--radius-1);
    padding: 4px 6px 0 6px;
}

    .promotion-item-block + .promotion-item-block[b-d3jplb9s3x] {
        margin-top: 14px;
    }

.promotion-item-block-header[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 4px;
    flex-wrap: wrap;
}

.promotion-items-header-actions[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.promotion-item-block-actions[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* Items section header - required at least one item message */
.promotion-items-required-message[b-d3jplb9s3x] {
    font-size: 12px;
    line-height: 1.2;
    font-weight: 600;
    color: #b45309;
    white-space: nowrap;
    margin-right: 6px;
}

.promotion-edit-card--items-required[b-d3jplb9s3x] {
    border-color: rgba(180, 83, 9, 0.32);
    box-shadow: 0 0 0 1px rgba(180, 83, 9, 0.08);
}

/* Item action controls */
/* ---------------------------------------------------------
   Keeps Add Products and Blank Item visually stronger while
   expand, collapse, and remove remain lightweight utilities.
   --------------------------------------------------------- */

.promotion-item-action[b-d3jplb9s3x] {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 4px 12px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    font-size: 13px;
    line-height: 1.15;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

    .promotion-item-action i[b-d3jplb9s3x] {
        font-size: 12px;
        line-height: 1;
    }

    .promotion-item-action:disabled[b-d3jplb9s3x] {
        opacity: 0.6;
        cursor: not-allowed;
        box-shadow: none;
    }

/* Primary item actions */
.promotion-item-action--primary[b-d3jplb9s3x] {
    color: var(--brand-600);
    border-color: rgba(37, 99, 235, 0.32);
    background: rgba(59, 130, 246, 0.04);
}

    .promotion-item-action--primary:hover:not(:disabled)[b-d3jplb9s3x] {
        color: var(--brand-700);
        border-color: rgba(37, 99, 235, 0.45);
        background: rgba(59, 130, 246, 0.08);
    }

/* Secondary item actions */
.promotion-item-action--utility[b-d3jplb9s3x] {
    color: var(--text-700);
    border-color: transparent;
    background: transparent;
}

    .promotion-item-action--utility:hover:not(:disabled)[b-d3jplb9s3x] {
        color: var(--text-900);
        background: rgba(148, 163, 184, 0.10);
    }

/* Promotion item expand commands */
/* ---------------------------------------------------------
   Applies the shared link-action treatment to section-level
   and item-level expand and collapse controls.
   --------------------------------------------------------- */

.promotion-item-expand-command[b-d3jplb9s3x] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    min-height: 20px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--link-600, #2563eb);
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    text-decoration: none;
    transition: color 0.15s ease;
}

    .promotion-item-expand-command i[b-d3jplb9s3x] {
        width: 13px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: currentColor;
        font-size: 11px;
        line-height: 1;
    }

    .promotion-item-expand-command:hover:not(:disabled)[b-d3jplb9s3x] {
        color: var(--link-700, #1d4ed8);
        background: transparent;
    }

        .promotion-item-expand-command:hover:not(:disabled) span[b-d3jplb9s3x] {
            text-decoration: underline;
            text-underline-offset: 2px;
        }

    .promotion-item-expand-command:focus[b-d3jplb9s3x],
    .promotion-item-expand-command:active[b-d3jplb9s3x] {
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .promotion-item-expand-command:focus-visible[b-d3jplb9s3x] {
        outline: 2px solid rgba(37, 99, 235, 0.28);
        outline-offset: 3px;
        border-radius: 3px;
    }

    .promotion-item-expand-command:disabled[b-d3jplb9s3x] {
        color: var(--text-500, #94a3b8);
        cursor: not-allowed;
        opacity: 0.6;
    }

.promotion-item-expand-command--all[b-d3jplb9s3x],
.promotion-item-expand-command--row[b-d3jplb9s3x] {
    margin-left: auto;
}

/* Remove item action */
.promotion-item-action--danger[b-d3jplb9s3x] {
    color: #dc2626;
    border-color: transparent;
    background: transparent;
}

    .promotion-item-action--danger:hover:not(:disabled)[b-d3jplb9s3x] {
        color: #b91c1c;
        background: rgba(220, 38, 38, 0.08);
    }

/* When collapse item - summary text placement styles */
.promotion-item-block-heading[b-d3jplb9s3x] {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 36px;
}

.promotion-item-collapsed-summary-text[b-d3jplb9s3x] {
    min-width: 0;
    flex: 1 1 auto;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 400;
    color: var(--text-800);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.promotion-item-collapsed-summary-required[b-d3jplb9s3x] {
    min-width: 0;
    flex: 1 1 auto;
    font-size: 12px;
    line-height: 1.35;
    font-weight: 600;
    color: #b45309;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.promotion-item-block-title[b-d3jplb9s3x] {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-900);
}

/* Product Master lookup */
.promotion-item-subsection-header--with-product-master[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: auto minmax(360px, 0.72fr);
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.promotion-item-product-lookup-header[b-d3jplb9s3x] {
    min-width: 0;
    justify-self: end;
    width: min(100%, 640px);
    display: grid;
    grid-template-columns: auto minmax(260px, 1fr) auto;
    align-items: center;
    gap: 7px;
}

.promotion-item-product-lookup-label[b-d3jplb9s3x] {
    margin: 0;
    color: var(--text-600);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.15;
    white-space: nowrap;
}

.promotion-item-product-lookup-select[b-d3jplb9s3x] {
    min-height: 30px;
    height: 30px;
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 12px;
}

.promotion-item-product-lookup-info[b-d3jplb9s3x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--text-500);
    font-size: 13px;
    line-height: 1;
    cursor: help;
}

.promotion-item-product-lookup-status[b-d3jplb9s3x] {
    margin: -4px 0 6px;
    font-size: 12px;
    line-height: 1.25;
    color: var(--text-500);
}

/* Collapsed item image preview */
/* ---------------------------------------------------------
   Provides compact thumbnails and a fixed hover preview outside
   the item row to avoid scroll clipping and layout movement.
   --------------------------------------------------------- */

.promotion-item-collapsed-summary[b-d3jplb9s3x] {
    min-width: 0;
    flex: 1 1 auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.promotion-item-collapsed-image-trigger[b-d3jplb9s3x] {
    position: relative;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid rgba(203, 213, 225, 0.9);
    border-radius: 8px;
    background: #ffffff;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
    transition: transform 120ms ease, box-shadow 120ms ease, border-color 120ms ease;
}

    .promotion-item-collapsed-image-trigger:hover[b-d3jplb9s3x],
    .promotion-item-collapsed-image-trigger:focus-visible[b-d3jplb9s3x] {
        z-index: 2;
        border-color: rgba(37, 99, 235, 0.28);
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.16);
        transform: translateY(-1px);
    }

    .promotion-item-collapsed-image-trigger:focus-visible[b-d3jplb9s3x] {
        outline: none;
        box-shadow: var(--focus-ring);
    }

.promotion-item-collapsed-image-thumb[b-d3jplb9s3x] {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    border-radius: 7px;
    background: #ffffff;
}

.promotion-item-collapsed-floating-hover-card[b-d3jplb9s3x] {
    position: fixed;
    left: var(--promotion-item-hover-left);
    top: var(--promotion-item-hover-top);
    z-index: 1045;
    width: 148px;
    height: 148px;
    padding: 8px;
    border: 1px solid rgba(203, 213, 225, 0.95);
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.22);
    pointer-events: none;
    animation: promotion-item-hover-preview-in-b-d3jplb9s3x 90ms ease-out;
}

.promotion-item-collapsed-floating-hover-preview[b-d3jplb9s3x] {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    border-radius: 10px;
    background: #ffffff;
}

@keyframes promotion-item-hover-preview-in-b-d3jplb9s3x {
    from {
        opacity: 0;
        transform: translateY(2px) scale(0.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.promotion-item-collapsed-summary .promotion-item-collapsed-summary-text[b-d3jplb9s3x],
.promotion-item-collapsed-summary .promotion-item-collapsed-summary-required[b-d3jplb9s3x] {
    flex: 1 1 auto;
}

/* Item subsections */
/* ---------------------------------------------------------
   Separates item basics, pricing, allowances, and logistics
   inside each Promotion item card.
   --------------------------------------------------------- */

.promotion-item-subsection[b-d3jplb9s3x] {
    border: 1px solid var(--border-200);
    border-radius: 10px;
    background: #fbfcfe;
    overflow: hidden;
}

    .promotion-item-subsection + .promotion-item-subsection[b-d3jplb9s3x] {
        margin-top: 2px;
    }

.promotion-item-subsection-header[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    background: rgba(148, 163, 184, 0.08);
    border-bottom: 1px solid var(--border-200);
}

.promotion-item-subsection-title[b-d3jplb9s3x] {
    font-size: 13px;
    font-weight: 700;
    color: var(--text-900);
}

.promotion-item-subsection-meta[b-d3jplb9s3x] {
    font-size: 12px;
    color: var(--text-600);
}

.promotion-item-subsection-body[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px;
}

/* Pre-Pack item fields */
/* ---------------------------------------------------------
   Uses a compact item-entry layout while keeping header-level
   Pre-Pack logistics outside the item card.
   --------------------------------------------------------- */

.promotion-item-prepack-v2[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.promotion-item-prepack-v2-row[b-d3jplb9s3x] {
    display: grid;
    gap: 10px;
    align-items: start;
}

.promotion-item-prepack-v2-row--master[b-d3jplb9s3x],
.promotion-item-prepack-v2-row--identity[b-d3jplb9s3x] {
    grid-template-columns: 1.08fr 0.74fr 0.74fr 0.84fr 0.84fr;
}

    .promotion-item-prepack-v2-row--master > .promotion-item-prepack-v2-field:first-child[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--identity > .promotion-item-prepack-v2-field:first-child[b-d3jplb9s3x] {
        grid-column: 1;
    }

    .promotion-item-prepack-v2-row--master > .promotion-item-prepack-v2-field:last-child[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--identity > .promotion-item-prepack-v2-field:last-child[b-d3jplb9s3x] {
        grid-column: 2 / -1;
    }

.promotion-item-prepack-v2-row--quantity[b-d3jplb9s3x] {
    grid-template-columns: 1.08fr 0.74fr 0.74fr 0.84fr 0.84fr;
}

.promotion-item-prepack-v2-row--upc[b-d3jplb9s3x] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.promotion-item-prepack-v2-field[b-d3jplb9s3x] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* Open-Stock item fields */
/* ---------------------------------------------------------
   Provides the dense identity, quantity, pricing, UPC, and
   logistics layout for Open-Stock Promotion items.
   --------------------------------------------------------- */

.promotion-item-openstock-v3[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.promotion-item-openstock-v3-row[b-d3jplb9s3x] {
    display: grid;
    gap: 10px;
    align-items: start;
}

.promotion-item-openstock-v3-row--identity[b-d3jplb9s3x],
.promotion-item-openstock-v3-row--master[b-d3jplb9s3x],
.promotion-item-openstock-v3-row--quantity[b-d3jplb9s3x] {
    grid-template-columns: 1.08fr 0.74fr 0.74fr 0.84fr 0.84fr;
}

    .promotion-item-openstock-v3-row--identity > .promotion-item-openstock-v3-field:first-child[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--master > .promotion-item-openstock-v3-field:first-child[b-d3jplb9s3x] {
        grid-column: 1;
    }

    .promotion-item-openstock-v3-row--identity > .promotion-item-openstock-v3-field:last-child[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--master > .promotion-item-openstock-v3-field:last-child[b-d3jplb9s3x] {
        grid-column: 2 / -1;
    }

.promotion-item-openstock-v3-row--economics-row1[b-d3jplb9s3x],
.promotion-item-openstock-v3-row--economics-row2[b-d3jplb9s3x],
.promotion-item-openstock-v3-row--bottom[b-d3jplb9s3x] {
    grid-template-columns: minmax(0, 1fr) minmax(132px, 0.54fr) minmax(0, 0.96fr);
}

.promotion-item-openstock-v3-row--upc[b-d3jplb9s3x] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.promotion-item-openstock-v3-row--logistics[b-d3jplb9s3x] {
    grid-template-columns: minmax(108px, 0.76fr) minmax(214px, 1.42fr) minmax(104px, 0.72fr) minmax(124px, 0.84fr) minmax(134px, 0.86fr);
}

    .promotion-item-openstock-v3-row--logistics > .promotion-item-openstock-v3-field:nth-child(2)[b-d3jplb9s3x] {
        min-width: 214px;
    }

        .promotion-item-openstock-v3-row--logistics > .promotion-item-openstock-v3-field:nth-child(2) .promotion-dimensions-field[b-d3jplb9s3x] {
            grid-template-columns: minmax(48px, 1fr) auto minmax(48px, 1fr) auto minmax(48px, 1fr);
        }

        .promotion-item-openstock-v3-row--logistics > .promotion-item-openstock-v3-field:nth-child(2) .promotion-dimensions-field__input[b-d3jplb9s3x] {
            min-width: 48px;
        }

.promotion-item-openstock-v3-field[b-d3jplb9s3x] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* Compact Open-Stock pricing and logistics */
.promotion-item-openstock-v3-row--pricing-logistics[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(360px, 0.72fr) minmax(620px, 1.28fr);
    gap: 10px;
    align-items: stretch;
    min-width: 0;
}

.promotion-item-subsection--pricing-allowances[b-d3jplb9s3x],
.promotion-item-subsection--logistics[b-d3jplb9s3x] {
    min-width: 0;
    margin-top: 2px;
}

.promotion-item-subsection-body--compact-item[b-d3jplb9s3x] {
    padding: 10px;
}

.promotion-item-pricing-compact-grid[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(108px, 0.62fr);
    gap: 8px 10px;
    align-items: start;
    align-content: start;
    min-width: 0;
}

    /* Keep Case Pack aligned with the right-side item pricing fields. */
    .promotion-item-pricing-compact-grid .promotion-item-openstock-v3-field--case-pack[b-d3jplb9s3x] {
        grid-column: 2;
    }

/* Pricing and logistics alignment */
.promotion-item-subsection--pricing-allowances .promotion-item-subsection-body--compact-item[b-d3jplb9s3x] {
    padding-top: 12px;
}

.promotion-item-subsection--logistics .promotion-item-subsection-body--compact-item[b-d3jplb9s3x] {
    padding-top: 10px;
}

.promotion-item-pricing-compact-grid .form-label[b-d3jplb9s3x],
.promotion-item-logistics-compact-grid .form-label[b-d3jplb9s3x] {
    display: block;
    min-height: 15px;
    margin-bottom: 3px;
    line-height: 1.2;
}

.promotion-item-type-money-control[b-d3jplb9s3x] {
    align-items: start;
}

.promotion-item-type-money-control[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(76px, 0.72fr) minmax(92px, 0.88fr);
    gap: 6px;
    min-width: 0;
}

.promotion-item-logistics-compact-grid[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.16fr) minmax(0, 0.95fr);
    gap: 8px 10px;
    align-items: start;
    min-width: 0;
}

    .promotion-item-logistics-compact-grid .promotion-dimensions-field[b-d3jplb9s3x] {
        grid-template-columns: minmax(58px, 1fr) auto minmax(58px, 1fr) auto minmax(58px, 1fr);
        gap: 5px;
    }

    .promotion-item-logistics-compact-grid .promotion-dimensions-field__input[b-d3jplb9s3x] {
        min-width: 58px;
        padding-left: 6px;
        padding-right: 6px;
        text-align: center;
    }

    .promotion-item-logistics-compact-grid .promotion-pattern-field[b-d3jplb9s3x] {
        gap: 6px;
    }

    .promotion-item-pricing-compact-grid .form-label[b-d3jplb9s3x],
    .promotion-item-logistics-compact-grid .form-label[b-d3jplb9s3x] {
        margin-bottom: 3px;
        font-size: 12px;
        line-height: 1.2;
        white-space: nowrap;
    }

    .promotion-item-pricing-compact-grid .form-control[b-d3jplb9s3x],
    .promotion-item-logistics-compact-grid .form-control[b-d3jplb9s3x],
    .promotion-item-pricing-compact-grid .promotion-segmented[b-d3jplb9s3x],
    .promotion-item-logistics-compact-grid .promotion-segmented[b-d3jplb9s3x] {
        min-height: 32px;
        height: 32px;
    }

    .promotion-item-pricing-compact-grid .promotion-segmented-option[b-d3jplb9s3x],
    .promotion-item-logistics-compact-grid .promotion-segmented-option[b-d3jplb9s3x] {
        min-height: 30px;
        padding: 4px 7px;
        font-size: 12px;
        line-height: 1.1;
    }

.promotion-item-pricing-compact-grid .promotion-affix-field--prefix .promotion-affix-field__input[b-d3jplb9s3x] {
    padding-left: 24px;
}

.promotion-item-logistics-compact-grid .promotion-affix-field--suffix .promotion-affix-field__input[b-d3jplb9s3x] {
    padding-right: 26px;
}

.promotion-item-pricing-compact-grid .promotion-affix-field__affix[b-d3jplb9s3x],
.promotion-item-logistics-compact-grid .promotion-affix-field__affix[b-d3jplb9s3x] {
    font-size: 12px;
}

/* Shared field controls */
/* ---------------------------------------------------------
   Provides reusable affix, pallet-pattern, dimensions, label,
   helper-text, and placeholder treatments.
   --------------------------------------------------------- */

/* Affix fields */
/* ---------------------------------------------------------
   Shared prefix/suffix formatting for currency, percent,
   weight, and other decorated inputs.
   --------------------------------------------------------- */
.promotion-affix-field[b-d3jplb9s3x] {
    position: relative;
    display: block;
}

.promotion-affix-field__affix[b-d3jplb9s3x] {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-700);
    pointer-events: none;
    z-index: 1;
    line-height: 1;
}

.promotion-affix-field__input[b-d3jplb9s3x] {
    width: 100%;
}

.promotion-affix-field--prefix .promotion-affix-field__affix[b-d3jplb9s3x] {
    left: 12px;
}

.promotion-affix-field--prefix .promotion-affix-field__input[b-d3jplb9s3x] {
    padding-left: 28px;
}

.promotion-affix-field--suffix .promotion-affix-field__affix[b-d3jplb9s3x] {
    right: 12px;
}

.promotion-affix-field--suffix .promotion-affix-field__input[b-d3jplb9s3x] {
    padding-right: 28px;
}

/* =====================================
   Measurement Input Groups
   ---------------------------------------------------------
   Joins Promotion measurement values and unit selectors.
   Closed selectors show compact abbreviations while native
   option lists retain complete measurement descriptions.
   ===================================== */

.promotion-measurement-input-group[b-d3jplb9s3x] {
    width: 100%;
    min-width: 0;
    min-height: 38px;
    height: 38px;
    align-items: stretch;
}

    .promotion-measurement-input-group > .form-control[b-d3jplb9s3x] {
        min-width: 0;
        min-height: 38px;
        height: 38px;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

.promotion-measurement-unit-control[b-d3jplb9s3x] {
    position: relative;
    flex: 0 0 84px;
    width: 84px;
    min-width: 84px;
    height: 38px;
    margin-left: -1px;
}

.promotion-measurement-unit-control--shipment[b-d3jplb9s3x] {
    flex-basis: 90px;
    width: 90px;
    min-width: 90px;
}

.promotion-measurement-unit-control[b-d3jplb9s3x]  .promotion-measurement-unit-select {
    width: 100%;
    min-height: 38px;
    height: 38px;
    padding: 0.375rem 1.75rem 0.375rem 0.55rem;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    font-size: inherit;
    font-weight: 600;
}

.promotion-measurement-unit-display[b-d3jplb9s3x] {
    position: absolute;
    top: 1px;
    right: 28px;
    bottom: 1px;
    left: 1px;
    z-index: 2;
    display: flex;
    align-items: center;
    padding-left: 0.55rem;
    overflow: hidden;
    background: #ffffff;
    color: #1e293b;
    letter-spacing: 0.01em;
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    pointer-events: none;
}

.promotion-measurement-unit-select:disabled + .promotion-measurement-unit-display[b-d3jplb9s3x] {
    background: #e9ecef;
    color: #6c757d;
}

.promotion-measurement-input-group > .form-control:focus[b-d3jplb9s3x] {
    position: relative;
    z-index: 3;
}

.promotion-measurement-unit-control:focus-within[b-d3jplb9s3x] {
    z-index: 3;
}

/* =====================================
   Compact Logistics Measurement Height
   ---------------------------------------------------------
   Keeps measurement values, unit selectors, and surrounding
   controls aligned within the Open-Stock logistics grid.
   ===================================== */

.promotion-item-logistics-compact-grid .promotion-measurement-input-group[b-d3jplb9s3x],
.promotion-item-logistics-compact-grid .promotion-measurement-input-group > .form-control[b-d3jplb9s3x],
.promotion-item-logistics-compact-grid .promotion-measurement-unit-control[b-d3jplb9s3x] {
    min-height: 32px;
    height: 32px;
}

.promotion-item-logistics-compact-grid[b-d3jplb9s3x]  .promotion-measurement-unit-select {
    min-height: 32px;
    height: 32px;
    padding-top: 3px;
    padding-bottom: 3px;
}

/* Add Products modal */
/* ---------------------------------------------------------
   Provides the Product Master multi-select workflow with a
   fixed shell, internal table scroll, and stable footer actions.
   --------------------------------------------------------- */

.promotion-item-action--blank-item[b-d3jplb9s3x] {
    border-color: rgba(148, 163, 184, 0.22);
    background: rgba(248, 250, 252, 0.72);
}

.promotion-product-modal-backdrop[b-d3jplb9s3x] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: rgba(15, 23, 42, 0.46);
}

.promotion-product-modal-shell[b-d3jplb9s3x] {
    position: fixed;
    inset: 0;
    z-index: 1051;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px;
    pointer-events: none;
}

.promotion-product-modal[b-d3jplb9s3x] {
    width: min(1120px, calc(100vw - 64px));
    max-height: calc(100vh - 48px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(226, 232, 240, 0.95);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
    pointer-events: auto;
}

.promotion-product-modal-header[b-d3jplb9s3x] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px 12px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.08);
    background: #ffffff;
}

.promotion-product-modal-title[b-d3jplb9s3x] {
    margin: 0;
    color: var(--text-900, #0f172a);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.15;
}

.promotion-product-modal-subtitle[b-d3jplb9s3x] {
    margin: 4px 0 0;
    color: var(--text-500, #64748b);
    font-size: 13px;
    line-height: 1.35;
}

.promotion-product-modal-close[b-d3jplb9s3x] {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

    .promotion-product-modal-close:hover[b-d3jplb9s3x] {
        background: #eef2f7;
        color: #0f172a;
    }

.promotion-product-modal-toolbar[b-d3jplb9s3x] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: minmax(360px, 1.5fr) minmax(190px, 0.65fr) minmax(160px, 0.45fr);
    gap: 10px;
    align-items: end;
    padding: 12px 18px 8px;
    background: #ffffff;
}

.promotion-product-modal-control[b-d3jplb9s3x] {
    min-width: 0;
}

.promotion-product-modal-control--search[b-d3jplb9s3x] {
    min-width: 0;
}

.promotion-product-modal-label[b-d3jplb9s3x] {
    display: block;
    margin-bottom: 4px;
    color: #334155;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.15;
}

.promotion-product-modal-search[b-d3jplb9s3x],
.promotion-product-modal-select[b-d3jplb9s3x] {
    width: 100%;
    min-height: 36px;
    border-radius: 9px;
    border-color: #dbe4ef;
    font-size: 14px;
}

.promotion-product-modal-meta-row[b-d3jplb9s3x] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 18px 10px;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    background: #ffffff;
}

.promotion-product-modal-table-region[b-d3jplb9s3x] {
    flex: 1 1 auto;
    min-height: 0;
    height: min(48vh, 520px);
    padding: 0 18px;
    overflow: hidden;
    background: #ffffff;
}

.promotion-product-modal-table-wrap[b-d3jplb9s3x] {
    height: 100%;
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 12px;
    background: #ffffff;
}

.promotion-product-modal-table[b-d3jplb9s3x] {
    width: 100%;
    min-width: 960px;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    font-size: 13px;
}

    .promotion-product-modal-table thead th[b-d3jplb9s3x] {
        position: sticky;
        top: 0;
        z-index: 3;
        padding: 9px 10px;
        background: #ffffff;
        color: #64748b;
        border-bottom: 1px solid #e2e8f0;
        box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.08);
        font-size: 11px;
        font-weight: 850;
        text-transform: uppercase;
        letter-spacing: 0.035em;
        white-space: nowrap;
    }

    .promotion-product-modal-table tbody td[b-d3jplb9s3x] {
        padding: 8px 10px;
        border-bottom: 1px solid #edf2f7;
        vertical-align: middle;
        background: #ffffff;
        color: var(--text-900, #0f172a);
    }

    .promotion-product-modal-table tbody tr:not(.promotion-product-modal-row--disabled)[b-d3jplb9s3x] {
        cursor: pointer;
    }

        .promotion-product-modal-table tbody tr:not(.promotion-product-modal-row--disabled):hover td[b-d3jplb9s3x] {
            background: #fbfdff;
        }

.promotion-product-modal-row--disabled td[b-d3jplb9s3x] {
    color: #94a3b8;
    background: #f8fafc;
}

.promotion-product-modal-col-select[b-d3jplb9s3x] {
    width: 70px;
    text-align: center;
}

.promotion-product-modal-col-image[b-d3jplb9s3x] {
    width: 74px;
}

.promotion-product-modal-col-item[b-d3jplb9s3x] {
    width: 105px;
}

.promotion-product-modal-col-description[b-d3jplb9s3x] {
    width: 300px;
}

.promotion-product-modal-col-size[b-d3jplb9s3x] {
    width: 80px;
}

.promotion-product-modal-col-upc[b-d3jplb9s3x] {
    width: 145px;
}

.promotion-product-modal-col-line[b-d3jplb9s3x] {
    width: 155px;
}

.promotion-product-modal-col-status[b-d3jplb9s3x] {
    width: 130px;
}

.promotion-product-modal-thumb[b-d3jplb9s3x] {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    object-fit: contain;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
}

.promotion-product-modal-thumb--empty[b-d3jplb9s3x] {
    color: #94a3b8;
    background: #f8fafc;
}

[b-d3jplb9s3x] .promotion-product-modal-description-tooltip {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-align: left;
}

.promotion-product-modal-description[b-d3jplb9s3x] {
    display: block;
    width: 100%;
    overflow: hidden;
    color: #0f172a;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotion-product-modal-secondary[b-d3jplb9s3x] {
    margin-top: 2px;
    overflow: hidden;
    color: #64748b;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotion-product-modal-badge[b-d3jplb9s3x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.promotion-product-modal-badge--active[b-d3jplb9s3x] {
    color: #047857;
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
}

.promotion-product-modal-badge--disabled[b-d3jplb9s3x] {
    color: #64748b;
    background: #f1f5f9;
    border: 1px solid #cbd5e1;
}

.promotion-product-modal-empty[b-d3jplb9s3x] {
    padding: 24px;
    text-align: center;
    color: #64748b;
    font-size: 13px;
    font-weight: 600;
}

.promotion-product-modal-footer[b-d3jplb9s3x] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 18px 16px;
    border-top: 1px solid rgba(25, 35, 68, 0.08);
    background: #ffffff;
}

.promotion-product-modal-selected-summary[b-d3jplb9s3x] {
    color: #475569;
    font-size: 13px;
    font-weight: 750;
}

.promotion-product-modal-footer-actions[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.promotion-product-modal-footer .btn[b-d3jplb9s3x] {
    min-height: 34px;
    padding: 5px 14px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
}

/* Pattern fields */
/* ---------------------------------------------------------
   Two-part layout used for values like pallet pattern.
   --------------------------------------------------------- */
.promotion-pattern-field[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
}

.promotion-pattern-field__input[b-d3jplb9s3x] {
    min-width: 0;
}

.promotion-pattern-field__input--left[b-d3jplb9s3x] {
    text-align: right;
}

.promotion-pattern-field__separator[b-d3jplb9s3x] {
    color: var(--text-600);
    font-weight: 600;
    line-height: 1;
}

/* Dimension fields */
/* ---------------------------------------------------------
   Three-part layout used for values like H x W x D.
   --------------------------------------------------------- */
.promotion-dimensions-field[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 6px;
}

.promotion-dimensions-field__input[b-d3jplb9s3x] {
    min-width: 0;
}

.promotion-dimensions-field__input--left[b-d3jplb9s3x] {
    text-align: right;
}

.promotion-dimensions-field__input--middle[b-d3jplb9s3x] {
    text-align: center;
}

.promotion-dimensions-field__separator[b-d3jplb9s3x] {
    color: var(--text-600);
    font-weight: 600;
    line-height: 1;
}

/* Field label / helper rows */
/* ---------------------------------------------------------
   Shared label rows for counters, helper text, and
   right-aligned field metadata.
   --------------------------------------------------------- */
.promotion-field-label-row[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.promotion-field-meta[b-d3jplb9s3x] {
    flex: 0 0 auto;
    font-size: 12px;
    line-height: 1.2;
    color: var(--text-500);
    white-space: nowrap;
    padding-right: 5px;
}

.promotion-field-meta--helper[b-d3jplb9s3x] {
    flex: 0 0 auto;
    font-size: 12px;
    line-height: 1.2;
    color: var(--text-500);
    white-space: nowrap;
    padding-right: 5px;
}

/* Shared placeholder styling */
/* ---------------------------------------------------------
   Consistent placeholder treatment across text inputs
   and textareas.
   --------------------------------------------------------- */
.form-control[b-d3jplb9s3x]::placeholder,
textarea.form-control[b-d3jplb9s3x]::placeholder {
    color: rgba(148, 163, 184, 0.55);
    font-style: italic;
    font-size: 12px;
    opacity: 1;
}

/* Pre-Pack logistics layout */
/* ---------------------------------------------------------
   Header-level logistics grid for Pre-Pack promotions.
   Separate from item-level Pre-Pack layouts.
   --------------------------------------------------------- */
.promotion-prepack-logistics-grid[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: 0.92fr 1.48fr 0.92fr 0.92fr 0.92fr 0.48fr;
    gap: 12px;
    align-items: start;
}

.promotion-prepack-logistics-field[b-d3jplb9s3x] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}


/* Compact control sizing */
/* ---------------------------------------------------------
   Keeps shared labels, text areas, and form controls compact
   without reducing desktop readability.
   --------------------------------------------------------- */
.promotion-edit-page .form-label[b-d3jplb9s3x] {
    margin-bottom: 0.25rem;
}

.promotion-edit-page textarea.form-control[b-d3jplb9s3x],
.promotion-edit-page .promotion-basics-description-textarea[b-d3jplb9s3x],
.promotion-edit-page .promotion-basics-textarea--tall[b-d3jplb9s3x] {
    height: auto;
}

.promotion-edit-page .promotion-basics-description-textarea[b-d3jplb9s3x] {
    min-height: 60px;
}

.promotion-edit-page .promotion-basics-textarea--tall[b-d3jplb9s3x] {
    min-height: 92px;
}

/* Review actions */
/* ---------------------------------------------------------
   Aligns save, submit, and review commands in supporting
   workflow action rows.
   --------------------------------------------------------- */

.promotion-edit-review-actions[b-d3jplb9s3x] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
    flex-wrap: wrap;
}

/* History and review modals */
/* ---------------------------------------------------------
   Styles modal shells, workflow history, review details,
   Product Master confirmation, and audit changes.
   --------------------------------------------------------- */

.promotion-history-modal-backdrop[b-d3jplb9s3x] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.28);
    z-index: 1050;
}

.promotion-history-modal[b-d3jplb9s3x] {
    position: fixed;
    inset: 0;
    z-index: 1060;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.promotion-history-modal-card[b-d3jplb9s3x] {
    width: min(1100px, 100%);
    max-height: min(88vh, 900px);
    display: flex;
    flex-direction: column;
    background: var(--bg-surface);
    border: 1px solid var(--border-200);
    border-radius: var(--radius-2);
    box-shadow: var(--shadow-1);
    overflow: hidden;
}

.promotion-review-modal-card[b-d3jplb9s3x] {
    width: min(760px, 100%);
}

.promotion-product-master-confirm-modal-card[b-d3jplb9s3x] {
    width: min(560px, 100%);
    max-height: min(82vh, 620px);
}

    .promotion-product-master-confirm-modal-card .promotion-history-modal-header[b-d3jplb9s3x] {
        padding: 14px 18px;
    }

    .promotion-product-master-confirm-modal-card .promotion-history-modal-title[b-d3jplb9s3x] {
        font-size: 18px;
        font-weight: 600;
    }

    .promotion-product-master-confirm-modal-card .promotion-history-modal-body[b-d3jplb9s3x] {
        padding: 16px 18px 14px;
    }

    .promotion-product-master-confirm-modal-card .promotion-history-modal-detail[b-d3jplb9s3x] {
        gap: 5px;
    }

        .promotion-product-master-confirm-modal-card .promotion-history-modal-detail + .promotion-history-modal-detail[b-d3jplb9s3x] {
            margin-top: 12px;
        }

    .promotion-product-master-confirm-modal-card .promotion-history-modal-detail-label[b-d3jplb9s3x] {
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.02em;
        text-transform: uppercase;
    }

    .promotion-product-master-confirm-modal-card .promotion-history-modal-detail-text[b-d3jplb9s3x] {
        padding: 10px 12px;
        border-radius: 9px;
        font-size: 13px;
        line-height: 1.4;
    }

    .promotion-product-master-confirm-modal-card .promotion-history-modal-footer[b-d3jplb9s3x] {
        padding: 12px 18px 16px;
        gap: 8px;
    }

        .promotion-product-master-confirm-modal-card .promotion-history-modal-footer .btn[b-d3jplb9s3x] {
            min-width: 92px;
            min-height: 34px;
            padding: 6px 14px;
            border-radius: 8px;
            font-size: 13px;
            font-weight: 600;
        }

.promotion-history-modal-header[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--border-200);
}

.promotion-history-modal-title[b-d3jplb9s3x] {
    font-size: 22px;
    font-weight: 600;
    color: var(--text-900);
}

.promotion-history-modal-body[b-d3jplb9s3x] {
    padding: 16px 20px;
    overflow: auto;
}

.promotion-history-modal-footer[b-d3jplb9s3x] {
    display: flex;
    justify-content: flex-end;
    padding: 14px 20px 18px;
    border-top: 1px solid var(--border-200);
    gap: 10px;
}

.promotion-history-modal-list[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
}

.promotion-history-modal-item[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 20px;
    padding: 16px 0;
    border-bottom: 1px solid var(--border-200);
}

    .promotion-history-modal-item:first-child[b-d3jplb9s3x] {
        padding-top: 0;
    }

    .promotion-history-modal-item:last-child[b-d3jplb9s3x] {
        border-bottom: 0;
        padding-bottom: 0;
    }

.promotion-history-modal-left[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.promotion-history-modal-item-title[b-d3jplb9s3x] {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-900);
}

.promotion-history-modal-item-meta[b-d3jplb9s3x] {
    font-size: 12px;
    color: var(--text-600);
}

.promotion-history-modal-right[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.promotion-history-modal-detail[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.promotion-history-modal-detail-label[b-d3jplb9s3x] {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-600);
}

.promotion-history-modal-detail-text[b-d3jplb9s3x] {
    padding: 10px 12px;
    border: 1px solid var(--border-200);
    border-radius: 10px;
    background: #f8fafc;
    color: var(--text-900);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

/* audit */
.promotion-history-modal-detail--audit[b-d3jplb9s3x] {
    padding: 9px 11px;
    border: 1px solid #d8e0ea;
    border-radius: 8px;
    background: #f8fafc;
}

.promotion-history-audit-header[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin-bottom: 4px;
    padding: 0 9px;
}

.promotion-history-audit-header-values[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 8px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
}

.promotion-history-audit-list[b-d3jplb9s3x] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.promotion-history-audit-row[b-d3jplb9s3x] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 10px;
    align-items: stretch;
    padding: 7px 9px;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 8px;
    background: rgba(248, 250, 252, 0.75);
}

.promotion-history-audit-field[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    min-width: 0;
    font-size: 12px;
    font-weight: 700;
    color: #334155;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.promotion-history-audit-values[b-d3jplb9s3x] {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 8px;
    align-items: stretch;
    font-size: 12px;
    line-height: 1.35;
}

.promotion-history-audit-old[b-d3jplb9s3x],
.promotion-history-audit-new[b-d3jplb9s3x] {
    min-width: 0;
    min-height: 32px;
    display: flex;
    align-items: center;
    padding: 6px 8px;
    border-radius: 7px;
    background: #fff;
    border: 1px solid rgba(25, 35, 68, 0.08);
    color: #334155;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.promotion-history-audit-old[b-d3jplb9s3x] {
    color: #64748b;
}

.promotion-history-audit-new[b-d3jplb9s3x] {
    color: #0f172a;
    font-weight: 600;
}

.promotion-history-audit-arrow[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #64748b;
    font-weight: 700;
}

.promotion-history-audit-modal-actions[b-d3jplb9s3x] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.promotion-history-audit-modal-action[b-d3jplb9s3x],
.promotion-history-audit-toggle[b-d3jplb9s3x] {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--link-600, #2563eb);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;
    white-space: nowrap;
}

    .promotion-history-audit-modal-action i[b-d3jplb9s3x],
    .promotion-history-audit-toggle i[b-d3jplb9s3x] {
        font-size: 12px;
        line-height: 1;
    }

    .promotion-history-audit-modal-action:hover span[b-d3jplb9s3x],
    .promotion-history-audit-toggle:hover span[b-d3jplb9s3x] {
        text-decoration: underline;
    }

    .promotion-history-audit-modal-action:focus[b-d3jplb9s3x],
    .promotion-history-audit-modal-action:focus-visible[b-d3jplb9s3x],
    .promotion-history-audit-modal-action:active[b-d3jplb9s3x],
    .promotion-history-audit-toggle:focus[b-d3jplb9s3x],
    .promotion-history-audit-toggle:focus-visible[b-d3jplb9s3x],
    .promotion-history-audit-toggle:active[b-d3jplb9s3x] {
        outline: 0;
        border: 0;
        box-shadow: none;
    }

.promotion-history-audit-summary[b-d3jplb9s3x] {
    min-height: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 0;
}

.promotion-history-audit-summary-label[b-d3jplb9s3x] {
    margin-bottom: 0;
}

/* Collapsed item full-image modal */
/* ---------------------------------------------------------
   Uses the shared Promotion modal shell for the item image
   viewer with contained image sizing.
   --------------------------------------------------------- */

.promotion-item-image-preview-modal-card[b-d3jplb9s3x] {
    width: min(560px, calc(100vw - 2rem));
}

.promotion-item-image-preview-subtitle[b-d3jplb9s3x] {
    margin-top: 3px;
    color: var(--text-500);
    font-size: 12px;
    line-height: 1.25;
}

.promotion-item-image-preview-body[b-d3jplb9s3x] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: #f8fafc;
}

.promotion-item-image-preview-img[b-d3jplb9s3x] {
    max-width: 100%;
    max-height: min(68vh, 620px);
    display: block;
    object-fit: contain;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14);
}

/* Responsive layout */
/* ---------------------------------------------------------
   Uses container-based breakpoints against usable Promotion
   content width. Ratios tighten before layouts wrap.
   --------------------------------------------------------- */

@container promotion-edit (max-width: 1100px) {
    .promotion-basics-row--grouped[b-d3jplb9s3x],
    .promotion-basics-row--notes[b-d3jplb9s3x] {
        column-gap: 24px;
    }

    .promotion-basics-row--primary-compact[b-d3jplb9s3x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 22px;
    }

    .promotion-basics-group--primary-left[b-d3jplb9s3x] {
        grid-template-columns: minmax(160px, 0.92fr) minmax(180px, 1.02fr) minmax(72px, 0.44fr);
        column-gap: 10px;
    }

    .promotion-basics-group--description-meta[b-d3jplb9s3x] {
        grid-template-columns: minmax(200px, 228px) minmax(0, 1fr);
        column-gap: 12px;
    }

    .promotion-terms-flags-row[b-d3jplb9s3x] {
        grid-template-columns: minmax(560px, 1.5fr) minmax(292px, 0.82fr);
    }

    .promotion-terms-compact-grid[b-d3jplb9s3x] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(158px, 0.82fr);
        column-gap: 16px;
        row-gap: 8px;
    }

    .promotion-terms-type-money-control[b-d3jplb9s3x] {
        grid-template-columns: minmax(66px, 0.7fr) minmax(76px, 0.84fr);
    }

    .promotion-item-openstock-v3-row--identity[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--master[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--quantity[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--master[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--identity[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--quantity[b-d3jplb9s3x] {
        column-gap: 8px;
    }

    .promotion-item-openstock-v3-row--identity[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--master[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--quantity[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--master[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--identity[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--quantity[b-d3jplb9s3x] {
        grid-template-columns: 1.02fr 0.78fr 0.78fr 0.88fr 0.88fr;
    }

    .promotion-prepack-logistics-grid[b-d3jplb9s3x] {
        grid-template-columns: 0.88fr 1.34fr 0.86fr 0.84fr 0.84fr 0.52fr;
        gap: 10px;
    }
    /* Items */
    .promotion-item-openstock-v3-row--pricing-logistics[b-d3jplb9s3x] {
        grid-template-columns: minmax(340px, 0.74fr) minmax(560px, 1.26fr);
        gap: 8px;
    }

    .promotion-item-pricing-compact-grid[b-d3jplb9s3x] {
        grid-template-columns: minmax(0, 1.08fr) minmax(100px, 0.58fr);
    }

    .promotion-item-type-money-control[b-d3jplb9s3x] {
        grid-template-columns: minmax(70px, 0.7fr) minmax(84px, 0.84fr);
    }

    .promotion-item-logistics-compact-grid[b-d3jplb9s3x] {
        grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.2fr) minmax(0, 0.92fr);
        gap: 8px;
    }
}

@container promotion-edit (max-width: 980px) {
    .promotion-summary-context-grid[b-d3jplb9s3x],
    .promotion-summary-workflow-grid[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
    }

    .promotion-summary-context-grid-item + .promotion-summary-context-grid-item[b-d3jplb9s3x],
    .promotion-summary-workflow-grid-item + .promotion-summary-workflow-grid-item[b-d3jplb9s3x] {
        border-left: 0;
        border-top: 1px solid rgba(25, 35, 68, 0.10);
    }

    .promotion-basics-row--primary-compact[b-d3jplb9s3x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 16px;
    }

    .promotion-basics-group--primary-left[b-d3jplb9s3x] {
        grid-template-columns: minmax(122px, 0.8fr) minmax(136px, 0.94fr) minmax(88px, 0.46fr);
        column-gap: 8px;
    }

    .promotion-item-openstock-v3-row--upc[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--upc[b-d3jplb9s3x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .promotion-item-openstock-v3-row--logistics[b-d3jplb9s3x] {
        grid-template-columns: minmax(100px, 0.72fr) minmax(208px, 1.38fr) minmax(96px, 0.68fr) minmax(118px, 0.8fr) minmax(126px, 0.82fr);
        gap: 8px;
    }

        .promotion-item-openstock-v3-row--logistics > .promotion-item-openstock-v3-field:nth-child(2)[b-d3jplb9s3x] {
            min-width: 208px;
        }
    /* Items */
    .promotion-item-openstock-v3-row--pricing-logistics[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
    }

    .promotion-item-pricing-compact-grid[b-d3jplb9s3x] {
        grid-template-columns: minmax(0, 1.12fr) minmax(140px, 0.62fr);
    }

    .promotion-item-logistics-compact-grid[b-d3jplb9s3x] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .promotion-history-audit-header[b-d3jplb9s3x],
    .promotion-history-audit-row[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
    }

    .promotion-history-audit-header[b-d3jplb9s3x] {
        display: none;
    }

    .promotion-history-audit-values[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
    }

    .promotion-history-audit-arrow[b-d3jplb9s3x] {
        padding: 2px 0;
    }

    .promotion-product-modal-shell[b-d3jplb9s3x] {
        padding: 16px;
    }

    .promotion-product-modal[b-d3jplb9s3x] {
        width: calc(100vw - 32px);
        max-height: calc(100vh - 32px);
    }

    .promotion-product-modal-toolbar[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
    }

    .promotion-product-modal-table-region[b-d3jplb9s3x] {
        height: min(50vh, 520px);
    }

    .promotion-product-modal-footer[b-d3jplb9s3x] {
        align-items: flex-start;
        flex-direction: column;
    }

    .promotion-product-modal-footer-actions[b-d3jplb9s3x] {
        width: 100%;
        justify-content: flex-end;
    }
}

@container promotion-edit (max-width: 860px) {
    .promotion-dates-grid[b-d3jplb9s3x],
    .promotion-wam-row--primary[b-d3jplb9s3x],
    .promotion-wam-row--secondary[b-d3jplb9s3x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .promotion-wam-flags-row[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .promotion-basics-row--grouped[b-d3jplb9s3x],
    .promotion-basics-row--notes[b-d3jplb9s3x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 16px;
    }

    .promotion-basics-row--primary-compact[b-d3jplb9s3x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 16px;
        row-gap: 12px;
    }

    .promotion-basics-group--primary-left[b-d3jplb9s3x] {
        grid-template-columns: minmax(108px, 0.86fr) minmax(120px, 0.98fr) minmax(86px, 0.5fr);
        column-gap: 8px;
    }

    .promotion-terms-flags-row[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
    }

    .promotion-terms-compact-grid[b-d3jplb9s3x] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(150px, 0.82fr);
        column-gap: 12px;
    }

    .promotion-flags-compact-list[b-d3jplb9s3x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px 14px;
    }

    .promotion-item-openstock-v3-row--quantity[b-d3jplb9s3x] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .promotion-item-openstock-v3-row--economics-row1[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--economics-row2[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--bottom[b-d3jplb9s3x] {
        grid-template-columns: minmax(0, 1fr) minmax(124px, 0.5fr) minmax(0, 0.92fr);
        gap: 8px;
    }

    .promotion-item-openstock-v3-row--logistics[b-d3jplb9s3x] {
        grid-template-columns: minmax(96px, 0.7fr) minmax(204px, 1.34fr) minmax(92px, 0.66fr) minmax(112px, 0.76fr) minmax(120px, 0.78fr);
        gap: 8px;
    }

        .promotion-item-openstock-v3-row--logistics > .promotion-item-openstock-v3-field:nth-child(2)[b-d3jplb9s3x] {
            min-width: 204px;
        }

    .promotion-prepack-logistics-grid[b-d3jplb9s3x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px 12px;
    }
}

@container promotion-edit (max-width: 760px) {
    .promotion-summary-band[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .promotion-basics-row--grouped[b-d3jplb9s3x],
    .promotion-basics-row--notes[b-d3jplb9s3x],
    .promotion-basics-row--primary-compact[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
        column-gap: 0;
        row-gap: 12px;
    }

    .promotion-basics-group--meta[b-d3jplb9s3x],
    .promotion-basics-group--identity[b-d3jplb9s3x],
    .promotion-basics-group--primary-left[b-d3jplb9s3x],
    .promotion-basics-group--primary-right[b-d3jplb9s3x],
    .promotion-basics-group--description-meta[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
        column-gap: 0;
        row-gap: 10px;
    }

    .promotion-item-openstock-v3-row--identity[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--master[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--quantity[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--economics-row1[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--economics-row2[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--bottom[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--upc[b-d3jplb9s3x],
    .promotion-item-openstock-v3-row--logistics[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
    }

    .promotion-item-prepack-v2-row--master[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--identity[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--quantity[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--upc[b-d3jplb9s3x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .promotion-history-modal[b-d3jplb9s3x] {
        padding: 12px;
    }

    .promotion-history-modal-card[b-d3jplb9s3x] {
        width: 100%;
        max-height: 92vh;
    }

    .promotion-history-modal-item[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .promotion-item-block-heading[b-d3jplb9s3x] {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .promotion-form-intro-band[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 6px;
    }

    .promotion-form-intro-side[b-d3jplb9s3x],
    .promotion-form-intro-side--actions[b-d3jplb9s3x] {
        width: 100%;
        display: flex;
        justify-content: flex-end;
    }
    /* Items */
    .promotion-item-pricing-compact-grid[b-d3jplb9s3x],
    .promotion-item-logistics-compact-grid[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
    }

        .promotion-item-pricing-compact-grid .promotion-item-openstock-v3-field--case-pack[b-d3jplb9s3x] {
            grid-column: auto;
        }

    .promotion-item-type-money-control[b-d3jplb9s3x] {
        grid-template-columns: minmax(100px, 0.6fr) minmax(120px, 0.7fr);
    }

    .promotion-item-subsection-header--with-product-master[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .promotion-item-product-lookup-header[b-d3jplb9s3x] {
        justify-self: stretch;
        width: 100%;
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .promotion-workflow-section-header--items[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
        align-items: start;
    }

        .promotion-workflow-section-header--items .promotion-items-header-actions[b-d3jplb9s3x] {
            width: 100%;
            justify-content: flex-end;
            flex-wrap: wrap;
        }

    .promotion-items-command-row[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
        align-items: start;
    }

        .promotion-items-command-row .promotion-items-header-actions[b-d3jplb9s3x] {
            width: 100%;
            justify-content: flex-end;
            flex-wrap: wrap;
        }
}

@container promotion-edit (max-width: 640px) {
    .promotion-dates-grid[b-d3jplb9s3x],
    .promotion-wam-row--primary[b-d3jplb9s3x],
    .promotion-wam-row--secondary[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
    }
}

@container promotion-edit (max-width: 560px) {
    .promotion-summary-panel[b-d3jplb9s3x] {
        padding: 12px 14px;
    }

    .promotion-summary-context[b-d3jplb9s3x],
    .promotion-summary-workflow[b-d3jplb9s3x] {
        padding: 4px 6px 2px 6px;
    }

    .promotion-item-prepack-v2-row--master[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--identity[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--quantity[b-d3jplb9s3x],
    .promotion-item-prepack-v2-row--upc[b-d3jplb9s3x] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Shared/Promotions/PromotionsShared.razor.rz.scp.css */
/* PromotionsShared.razor.css */
/* ---------------------------------------------------------
   Shared WAM Admin and Manufacturer Promotions page styling.
   Controls the fixed-height workspace, summary cards, filters,
   table-owned scrolling, sticky table regions, anchored pager,
   Create Promotion modal, and projected form helpers.

   The page header, summary cards, filters, and pager remain stable.
   The table region owns record overflow and internal scrolling.
   Base table width remains 1060px before horizontal scrolling.
   --------------------------------------------------------- */


/* Page shell */
/* ---------------------------------------------------------
   Fills the shared application content area and responds to
   available width after sidebar expansion or collapse.
   --------------------------------------------------------- */

.promotions-page[b-si92g219n6] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 2px;
    overflow: hidden;
    container-type: inline-size;
    container-name: promotions-page;
}

.promotions-workspace[b-si92g219n6] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow: hidden;
}


/* Summary cards */
/* ---------------------------------------------------------
   Provides compact operational cards aligned with Dashboard,
   Books, Promotion Cycles, and other shared list workspaces.
   --------------------------------------------------------- */

.promotions-summary-strip[b-si92g219n6] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}

.promotions-summary-card[b-si92g219n6] {
    min-width: 0;
    padding: 8px 10px;
    background: #fff;
    border: 1px solid var(--border-200);
    border-radius: 13px;
    box-shadow: var(--shadow-1);
}

.promotions-summary-card-button[b-si92g219n6] {
    appearance: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

    .promotions-summary-card-button:hover[b-si92g219n6] {
        border-color: rgba(29, 58, 109, 0.18);
        box-shadow: 0 3px 10px rgba(15, 23, 42, 0.06);
    }

    .promotions-summary-card-button.is-active[b-si92g219n6] {
        box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.04), 0 3px 10px rgba(15, 23, 42, 0.06);
    }

    .promotions-summary-card-button:focus-visible[b-si92g219n6] {
        outline: none;
        box-shadow: var(--focus-ring);
    }

.promotions-summary-label[b-si92g219n6] {
    margin: 0 0 6px;
    overflow: hidden;
    color: var(--text-600);
    font-size: 13.5px;
    line-height: 1.3;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotions-summary-value[b-si92g219n6] {
    margin: 0;
    color: var(--text-900);
    font-size: 21px;
    line-height: 1;
    font-weight: 800;
}

.promotions-summary-meta[b-si92g219n6] {
    margin-top: 5px;
    overflow: hidden;
    color: var(--text-500);
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotions-summary-card--neutral[b-si92g219n6] {
    border-color: rgba(117, 140, 167, 0.22);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.035), #fff);
}

.promotions-summary-card--info[b-si92g219n6] {
    border-color: rgba(117, 140, 167, 0.24);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.04), #fff);
}

.promotions-summary-card--success[b-si92g219n6] {
    border-color: rgba(91, 196, 191, 0.38);
    background: linear-gradient(180deg, rgba(91, 196, 191, 0.05), #fff);
}

.promotions-summary-card--warning[b-si92g219n6] {
    border-color: rgba(250, 169, 75, 0.32);
    background: linear-gradient(180deg, rgba(250, 169, 75, 0.05), #fff);
}

.promotions-summary-card--neutral.is-active[b-si92g219n6],
.promotions-summary-card--info.is-active[b-si92g219n6] {
    border-color: rgba(117, 140, 167, 0.34);
    background: linear-gradient(180deg, rgba(117, 140, 167, 0.08), #fff);
}

.promotions-summary-card--success.is-active[b-si92g219n6] {
    border-color: rgba(91, 196, 191, 0.48);
    background: linear-gradient(180deg, rgba(91, 196, 191, 0.10), #fff);
}

.promotions-summary-card--warning.is-active[b-si92g219n6] {
    border-color: rgba(250, 169, 75, 0.42);
    background: linear-gradient(180deg, rgba(250, 169, 75, 0.10), #fff);
}


/* Operational list card */
/* ---------------------------------------------------------
   Provides the fixed-height Promotions grid host. The table region
   owns scrolling while the header, filters, and pager remain stable.
   --------------------------------------------------------- */

.promotions-card[b-si92g219n6] {
    background: var(--bg-surface, #fff);
    border: 1px solid var(--border-200);
    border-radius: 18px;
    overflow: hidden;
}

.promotions-list-card[b-si92g219n6] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.promotions-list-body[b-si92g219n6] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    margin-bottom: 0;
    padding: 0;
}

.promotions-panel-header[b-si92g219n6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 12px 8px;
    border-bottom: 1px solid rgba(25, 35, 68, 0.07);
}

.promotions-panel-header-copy[b-si92g219n6] {
    min-width: 0;
    flex: 1 1 auto;
}

.promotions-panel-header-actions[b-si92g219n6] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.promotions-card-title[b-si92g219n6] {
    margin: 0;
    color: var(--text-900);
    font-size: 18px;
    font-weight: 700;
}

.promotions-card-subtitle[b-si92g219n6] {
    margin: 4px 0 0;
    color: var(--text-500);
    font-size: 13px;
}

.promotions-primary-button[b-si92g219n6] {
    min-width: 150px;
    min-height: 30px;
    padding: 4px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
}


/* Toolbar and filters */
/* ---------------------------------------------------------
   Aligns search and filter controls with the list heading
   and table edge.
   --------------------------------------------------------- */

.promotions-controls[b-si92g219n6] {
    width: 100%;
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: minmax(320px, 1fr) 190px 170px 180px 96px;
    gap: 10px;
    align-items: end;
    padding: 14px 12px 10px;
}

.promotions-control[b-si92g219n6],
.promotions-control-search[b-si92g219n6],
.promotions-control-page-size[b-si92g219n6] {
    min-width: 0;
}

.promotions-control-label[b-si92g219n6] {
    display: block;
    margin-bottom: 4px;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 600;
}

.promotions-search[b-si92g219n6],
.promotions-filter-select[b-si92g219n6] {
    width: 100%;
    min-height: 38px;
}

.promotions-filter-select[b-si92g219n6] {
    min-width: 0;
}

.promotions-control-page-size .promotions-filter-select[b-si92g219n6] {
    min-width: 84px;
}

/* Promotion Cycle Context */
/* ---------------------------------------------------------
   Displays the exact Promotion Cycle applied from Cycle Summary
   navigation and keeps the scope visible above list filters.
   --------------------------------------------------------- */

.promotions-cycle-context[b-si92g219n6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 14px;
    padding: 8px 12px;
    border: 1px solid #cfe0fb;
    border-radius: 8px;
    background: #f4f8ff;
}

.promotions-cycle-context-copy[b-si92g219n6] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.promotions-cycle-context-label[b-si92g219n6] {
    color: #5e7698;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.promotions-cycle-context-value[b-si92g219n6] {
    min-width: 0;
    overflow: hidden;
    color: #14264a;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promotions-cycle-context-clear[b-si92g219n6] {
    flex: 0 0 auto;
    padding: 0;
    border: 0;
    background: transparent;
    color: #1557cc;
    font-size: 11.5px;
    font-weight: 700;
}


/* List states */
/* ---------------------------------------------------------
   Displays loading, empty, and error states without changing
   the fixed outer page and card height.
   --------------------------------------------------------- */

.promotions-state[b-si92g219n6] {
    padding: 18px 16px;
    color: var(--text-600);
}

.promotion-state-wrap[b-si92g219n6] {
    width: 100%;
    height: auto;
    min-height: 0;
    align-self: start;
    justify-self: stretch;
    box-sizing: border-box;
}

.promotion-state-wrap--error[b-si92g219n6] {
    padding: 8px 12px 0;
}

    .promotion-state-wrap--error .alert[b-si92g219n6] {
        display: inline-flex;
        align-items: center;
        width: auto;
        max-width: 720px;
        min-height: 0;
        height: auto;
        margin: 0;
        padding: 10px 14px;
        border-radius: 10px;
    }


/* Table shell */
/* ---------------------------------------------------------
   Owns vertical and horizontal table scrolling while the pager
   remains anchored below the scrollable region.
   --------------------------------------------------------- */

.promotions-table-region[b-si92g219n6] {
    min-height: 0;
    height: 100%;
    margin: 0 12px 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 10px;
}

.promotions-table-scroll[b-si92g219n6] {
    min-height: 0;
    position: relative;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    background: #ffffff;
}

.promotions-table[b-si92g219n6] {
    width: 100%;
    min-width: 1060px;
    margin: 0;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.82rem;
}

    .promotions-table thead th[b-si92g219n6] {
        position: sticky;
        top: 0;
        z-index: 12;
        padding: 0.58rem 0.55rem;
        border-bottom: 0;
        background: #ffffff;
        color: #64748b;
        font-size: 0.7rem;
        font-weight: 850;
        letter-spacing: 0.035em;
        text-transform: uppercase;
        white-space: nowrap;
        box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
    }

    .promotions-table tbody td[b-si92g219n6] {
        padding: 0.56rem 0.55rem;
        vertical-align: middle;
        border-bottom: 1px solid #edf2f7;
        background: #ffffff;
        color: var(--text-900);
    }

    .promotions-table tbody tr:hover td[b-si92g219n6] {
        background: #fbfdff;
    }

    /* Table edge alignment */
    /* ---------------------------------------------------------
   Aligns first and last table cells with the filter row and pager inset.
   --------------------------------------------------------- */
    .promotions-table thead th:first-child[b-si92g219n6],
    .promotions-table tbody td:first-child[b-si92g219n6] {
        padding-left: 12px;
    }

    .promotions-table thead th:last-child[b-si92g219n6],
    .promotions-table tbody td:last-child[b-si92g219n6] {
        padding-right: 12px;
    }


/* Sort controls */
/* ---------------------------------------------------------
   Applies the shared Books and Promotion Cycles sort treatment
   with active-sort emphasis.
   --------------------------------------------------------- */

.promotions-sort-button[b-si92g219n6] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    max-width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    cursor: pointer;
    white-space: nowrap;
}

    .promotions-sort-button:hover[b-si92g219n6],
    .promotions-sort-button--active[b-si92g219n6] {
        color: #2563eb;
    }

.promotions-sort-indicator[b-si92g219n6] {
    font-size: 0.72rem;
    line-height: 1;
}


/* Column sizing */
/* ---------------------------------------------------------
   Maintains a 1060px base table width and expands across available
   workspace space before horizontal scrolling begins.
   --------------------------------------------------------- */

.promotions-col-promotion[b-si92g219n6] {
    width: 34%;
    min-width: 260px;
}

.promotions-col-type[b-si92g219n6] {
    width: 96px;
    min-width: 92px;
    white-space: nowrap;
}

.promotions-col-manufacturer[b-si92g219n6] {
    width: 136px;
    min-width: 124px;
    white-space: normal;
}

.promotions-col-promo-period[b-si92g219n6] {
    width: 76px;
    min-width: 66px;
    white-space: nowrap;
}

.promotions-col-item[b-si92g219n6] {
    width: 64px;
    min-width: 58px;
    text-align: center;
    white-space: nowrap;
}

.promotions-col-workflow[b-si92g219n6] {
    width: 180px;
    min-width: 166px;
    white-space: nowrap;
}

.promotions-col-last-updated[b-si92g219n6] {
    width: 124px;
    min-width: 112px;
    font-size: 11px;
    line-height: 1.2;
    white-space: normal;
}

.promotions-col-actions[b-si92g219n6] {
    width: 126px;
    min-width: 126px;
    max-width: 126px;
}


/* Column behavior */
/* ---------------------------------------------------------
   Allows two-line Promotion titles, keeps utility columns compact,
   and pins Actions to the table scroll region.
   --------------------------------------------------------- */

.promotions-table td.promotions-col-manufacturer[b-si92g219n6],
.promotions-table td.promotions-col-promo-period[b-si92g219n6] {
    font-size: 12px;
    line-height: 1.22;
}

.promotions-table td.promotions-col-item[b-si92g219n6] {
    font-size: 12px;
    font-weight: 600;
}

/* Sticky Actions column */
/* ---------------------------------------------------------
   Pins Actions to the right edge of the table scroll viewport.
   The sticky cell remains neutral while action content owns emphasis.
   --------------------------------------------------------- */
.promotions-table th.promotions-col-actions[b-si92g219n6],
.promotions-table td.promotions-col-actions[b-si92g219n6] {
    position: sticky;
    right: 0;
    z-index: 10;
    text-align: left;
    white-space: nowrap;
    background: #ffffff;
    background-clip: padding-box;
    box-shadow: none;
}

.promotions-table thead th.promotions-col-actions[b-si92g219n6] {
    z-index: 18;
    background: #ffffff;
    box-shadow: inset 0 -1px 0 rgba(25, 35, 68, 0.12);
}

.promotions-table tbody tr:hover td.promotions-col-actions[b-si92g219n6] {
    background: #fbfdff;
}


/* Manufacturer table variant */
/* ---------------------------------------------------------
   Uses a narrower protected table width because Manufacturer mode
   contains fewer operational columns.
   --------------------------------------------------------- */

.promotions-page--manufacturer .promotions-table[b-si92g219n6] {
    min-width: 850px;
}

.promotions-page--manufacturer .promotions-col-promotion[b-si92g219n6] {
    min-width: 260px;
}

.promotions-page--manufacturer .promotions-col-type[b-si92g219n6] {
    width: 92px;
    min-width: 92px;
    max-width: 92px;
}

.promotions-page--manufacturer .promotions-col-promo-period[b-si92g219n6] {
    width: 92px;
    min-width: 92px;
    max-width: 92px;
}

.promotions-page--manufacturer .promotions-col-item[b-si92g219n6] {
    width: 50px;
    min-width: 50px;
    max-width: 50px;
}

.promotions-page--manufacturer .promotions-col-workflow[b-si92g219n6] {
    width: 158px;
    min-width: 158px;
    max-width: 158px;
}

.promotions-page--manufacturer .promotions-col-last-updated[b-si92g219n6] {
    width: 104px;
    min-width: 104px;
    max-width: 104px;
}

.promotions-page--manufacturer .promotions-col-actions[b-si92g219n6] {
    width: 88px;
    min-width: 88px;
    max-width: 88px;
}


/* Row text hierarchy */
/* ---------------------------------------------------------
   Aligns Promotion title, metadata, updated date, and tooltip
   treatment with the Promotion Cycles operational table.
   --------------------------------------------------------- */

.promotions-primary[b-si92g219n6] {
    color: var(--text-900);
    font-weight: 600;
    line-height: 1.22;
}

.promotions-primary-title-wrap[b-si92g219n6] {
    position: relative;
    display: inline-flex;
    max-width: 100%;
    min-width: 0;
    align-items: flex-start;
}

.promotions-primary-title[b-si92g219n6] {
    display: -webkit-box;
    max-width: 100%;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: var(--text-900);
    font-size: 13.5px;
    line-height: 1.25;
    font-weight: 600;
}

.promotions-secondary[b-si92g219n6] {
    margin-top: 3px;
    color: var(--text-600);
    font-size: 12px;
    line-height: 1.35;
}

.promotions-secondary-info[b-si92g219n6] {
    color: #1d4ed8;
    font-weight: 500;
}

.promotions-secondary-warning[b-si92g219n6] {
    color: #b45309;
    font-weight: 500;
}

.promotions-secondary-success[b-si92g219n6] {
    color: #15803d;
    font-weight: 500;
}

.promotions-secondary-muted[b-si92g219n6] {
    color: var(--text-600);
    font-size: 12px;
}

.promotions-row-meta-line[b-si92g219n6] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 3px;
    margin-top: 3px;
    font-size: 11px;
    line-height: 1.2;
}

.promotions-row-meta-status[b-si92g219n6] {
    font-weight: 600;
}

.promotions-row-meta-info[b-si92g219n6] {
    color: #1d4ed8;
}

.promotions-row-meta-warning[b-si92g219n6] {
    color: #b45309;
}

.promotions-row-meta-success[b-si92g219n6] {
    color: #15803d;
}

.promotions-row-meta-muted[b-si92g219n6],
.promotions-row-meta-date[b-si92g219n6],
.promotions-row-meta-separator[b-si92g219n6] {
    color: var(--text-500);
}

.promotions-updated-text[b-si92g219n6] {
    display: inline-block;
    max-width: 100%;
    font-size: 12px;
    line-height: 1.2;
    white-space: normal;
}


/* Promotion type badges */

.promotions-type-badge[b-si92g219n6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 76px;
    min-height: 20px;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.promotions-type-badge--prepack[b-si92g219n6] {
    border: 1px solid rgba(63, 111, 159, 0.16);
    background: rgba(63, 111, 159, 0.12);
    color: rgb(63, 111, 159);
}

.promotions-type-badge--openstock[b-si92g219n6] {
    border: 1px solid rgba(142, 59, 103, 0.16);
    background: rgba(142, 59, 103, 0.10);
    color: rgb(142, 59, 103);
}

.promotions-type-badge--default[b-si92g219n6] {
    background: rgba(148, 163, 184, 0.14);
    color: #475569;
}


/* Current Stage column */
/* ---------------------------------------------------------
   Combines Promotion review and Distributor Pricing progress
   inside one compact workflow display.
   --------------------------------------------------------- */

.promotions-workflow-header-wrap[b-si92g219n6] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 15px;
}

.promotions-header-info-wrap[b-si92g219n6] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.promotions-header-info-icon[b-si92g219n6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border: 1px solid rgba(117, 140, 167, 0.38);
    border-radius: 999px;
    background: rgba(117, 140, 167, 0.10);
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    text-transform: none;
    cursor: help;
}

.promotions-workflow-stack[b-si92g219n6] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: 100%;
    gap: 3px;
}

.promotions-workflow-badge[b-si92g219n6] {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 132px;
    min-height: 21px;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

    .promotions-workflow-badge.promotions-badge-draft[b-si92g219n6] {
        background: rgba(148, 163, 184, 0.16);
        color: #475569;
    }

    .promotions-workflow-badge.promotions-badge-submitted[b-si92g219n6] {
        background: rgba(59, 130, 246, 0.14);
        color: #1d4ed8;
    }

    .promotions-workflow-badge.promotions-badge-review[b-si92g219n6] {
        background: rgba(245, 158, 11, 0.16);
        color: #b45309;
    }

    .promotions-workflow-badge.promotions-badge-revision[b-si92g219n6] {
        background: #ffe4e6;
        color: #dc2626;
    }

    .promotions-workflow-badge.promotions-badge-approved[b-si92g219n6] {
        background: rgba(34, 197, 94, 0.16);
        color: #15803d;
    }

    .promotions-workflow-badge.promotions-badge-rejected[b-si92g219n6] {
        background: rgba(239, 68, 68, 0.14);
        color: #b91c1c;
    }

    .promotions-workflow-badge.promotions-badge-default[b-si92g219n6] {
        background: rgba(148, 163, 184, 0.14);
        color: #475569;
    }

.promotions-workflow-badge--review[b-si92g219n6],
.promotions-workflow-badge--submitted[b-si92g219n6] {
    background: rgba(245, 158, 11, 0.16);
    color: #b45309;
}

.promotions-workflow-badge--returned[b-si92g219n6] {
    background: rgba(239, 68, 68, 0.14);
    color: #b91c1c;
}

.promotions-workflow-badge--completed[b-si92g219n6] {
    background: rgba(34, 197, 94, 0.16);
    color: #15803d;
}

.promotions-workflow-detail-line[b-si92g219n6] {
    max-width: 100%;
    padding-left: 4px;
    color: #94a3b8;
    font-size: 0.72rem;
    line-height: 1.25;
    white-space: normal;
}

.promotions-workflow-detail-prefix[b-si92g219n6] {
    font-weight: 700;
}

.promotions-workflow-detail-prefix--promotion[b-si92g219n6] {
    color: #64748b;
}

.promotions-workflow-detail-prefix--pricing[b-si92g219n6] {
    color: #1d4ed8;
}

.promotions-workflow-detail-separator[b-si92g219n6],
.promotions-workflow-detail-text[b-si92g219n6] {
    color: #94a3b8;
}


/* Row actions */
/* ---------------------------------------------------------
   Keeps action links compact and readable inside the sticky
   Actions column.
   --------------------------------------------------------- */

.promotions-row-actions[b-si92g219n6] {
    width: 100%;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 0 8px;
    border-radius: 7px;
    background: #f3f6fb;
    box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.82);
    flex-wrap: nowrap;
    white-space: nowrap;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.promotions-table tbody tr:hover .promotions-row-actions[b-si92g219n6] {
    background: #edf4ff;
    box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.68);
}

.promotions-link-action[b-si92g219n6] {
    position: relative;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--link-600, #2563eb);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}

.promotions-row-actions .promotions-link-action + .promotions-link-action[b-si92g219n6]::before {
    content: "·";
    display: inline-block;
    margin: 0 5px;
    color: rgba(25, 35, 68, 0.35);
    text-decoration: none;
}

.promotions-link-action:hover[b-si92g219n6] {
    color: #1d4ed8;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.promotions-link-action-release[b-si92g219n6] {
    color: var(--link-600, #2563eb);
}

.promotions-link-action-danger[b-si92g219n6] {
    color: #dc2626;
}

.promotions-link-action:disabled[b-si92g219n6] {
    opacity: 0.5;
    cursor: default;
    text-decoration: none;
}


/* Pager */
/* ---------------------------------------------------------
   Remains anchored below the internally scrolling table region.
   --------------------------------------------------------- */

.promotions-pager[b-si92g219n6] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 6px 14px 4px;
    border-top: 1px solid rgba(25, 35, 68, 0.06);
    background: #f8fafc;
}

.promotions-pager-meta[b-si92g219n6] {
    color: var(--text-600);
    font-size: 12px;
}

.promotions-pager-actions[b-si92g219n6] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.promotions-pager-page[b-si92g219n6] {
    min-width: 88px;
    color: var(--text-700, #334155);
    font-size: 12px;
    font-weight: 600;
    text-align: center;
}


/* Create Promotion modal */

.promotions-modal-backdrop[b-si92g219n6] {
    position: fixed;
    inset: 0;
    z-index: 1040;
    background: rgba(15, 23, 42, 0.35);
}

.promotions-modal[b-si92g219n6] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.promotions-modal-card[b-si92g219n6] {
    width: min(1180px, calc(100vw - 2rem));
    max-height: calc(100vh - 2rem);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(25, 35, 68, 0.08);
    border-radius: 12px;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.22);
}

.promotions-modal-header[b-si92g219n6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px 10px;
    border-bottom: 1px solid var(--border-200);
}

.promotions-modal-title[b-si92g219n6] {
    color: var(--text-900);
    font-size: 15px;
    font-weight: 600;
}

.promotions-modal-body[b-si92g219n6] {
    overflow: auto;
    padding: 16px 18px 14px;
}

.promotions-modal-footer[b-si92g219n6] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
}


/* Projected worksheet type selector */
/* ---------------------------------------------------------
   Uses ::deep because the Create Promotion form is projected
   into the shared modal shell.
   --------------------------------------------------------- */

[b-si92g219n6] .promotions-create-type-selector {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}

[b-si92g219n6] .promotions-create-type-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--border-200);
    border-radius: 12px;
    background: var(--bg-surface);
    color: var(--text-900);
    text-align: left;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

    [b-si92g219n6] .promotions-create-type-card:hover {
        border-color: rgba(59, 130, 246, 0.45);
        background: #fcfdff;
        box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.08);
    }

    [b-si92g219n6] .promotions-create-type-card.is-active {
        border-color: rgba(37, 99, 235, 0.9);
        background: rgba(59, 130, 246, 0.04);
        box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.18);
    }

[b-si92g219n6] .promotions-create-type-card--prepack.is-active {
    border-color: rgba(63, 111, 159, 0.55);
    background: linear-gradient(135deg, rgba(63, 111, 159, 0.08), rgba(63, 111, 159, 0.03));
    box-shadow: 0 0 0 1px rgba(63, 111, 159, 0.12);
}

[b-si92g219n6] .promotions-create-type-card--openstock.is-active {
    border-color: rgba(142, 59, 103, 0.42);
    background: linear-gradient(135deg, rgba(142, 59, 103, 0.07), rgba(142, 59, 103, 0.025));
    box-shadow: 0 0 0 1px rgba(142, 59, 103, 0.10);
}

[b-si92g219n6] .promotions-create-type-card-icon {
    flex: 0 0 auto;
    width: 20px;
    margin-top: 2px;
    font-size: 16px;
    line-height: 1;
}

[b-si92g219n6] .promotions-create-type-card-content {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

[b-si92g219n6] .promotions-create-type-card-title {
    color: var(--text-900);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
}

[b-si92g219n6] .promotions-create-type-card-text {
    color: var(--text-600);
    font-size: 13px;
    line-height: 1.35;
}


/* Projected Create Promotion validation */

[b-si92g219n6] .promotions-create-field {
    display: flex;
    flex-direction: column;
    gap: 0.22rem;
}

[b-si92g219n6] .promotions-field-error {
    color: #b5474f;
    font-size: 0.74rem;
    line-height: 1.2;
}

[b-si92g219n6] .promotions-create-field .form-control.is-invalid,
[b-si92g219n6] .promotions-create-field .form-select.is-invalid {
    border-color: #dc3545;
    box-shadow: 0 0 0 0.08rem rgba(220, 53, 69, 0.12);
}


/* Responsive behavior */
/* ---------------------------------------------------------
   Uses container queries for available content width.
   Media queries remain limited to modal and small-screen safety.
   --------------------------------------------------------- */

@media (min-width: 1600px) {
    .promotions-table[b-si92g219n6] {
        min-width: 1120px;
    }

    .promotions-col-manufacturer[b-si92g219n6] {
        width: 152px;
        min-width: 136px;
    }

    .promotions-col-workflow[b-si92g219n6] {
        width: 196px;
        min-width: 180px;
    }
}

@container promotions-page (max-width: 1200px) {
    .promotions-controls[b-si92g219n6] {
        grid-template-columns: minmax(260px, 1fr) 180px 160px 170px 96px;
    }
}

@container promotions-page (max-width: 980px) {
    .promotions-controls[b-si92g219n6] {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
    }

    .promotions-control-page-size .promotions-filter-select[b-si92g219n6] {
        width: 100%;
        min-width: 0;
    }
}

@container promotions-page (max-width: 900px) {
    .promotions-summary-strip[b-si92g219n6] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@container promotions-page (max-width: 768px) {
    [b-si92g219n6] .promotions-create-type-selector {
        grid-template-columns: 1fr;
    }
}

@container promotions-page (max-width: 640px) {
    .promotions-summary-strip[b-si92g219n6],
    .promotions-controls[b-si92g219n6] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .promotions-panel-header[b-si92g219n6] {
        align-items: flex-start;
        flex-direction: column;
    }

    .promotions-panel-header-actions[b-si92g219n6] {
        width: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 768px) {
    .promotions-primary-button[b-si92g219n6] {
        width: 100%;
    }

    .promotions-card-header[b-si92g219n6],
    .promotions-panel-header[b-si92g219n6],
    .promotions-controls[b-si92g219n6],
    .promotions-pager[b-si92g219n6] {
        padding-left: 12px;
        padding-right: 12px;
    }

    .promotions-table-region[b-si92g219n6] {
        margin-left: 10px;
        margin-right: 10px;
    }
}

@media (max-width: 700px) {
    .promotions-modal-card[b-si92g219n6] {
        width: calc(100vw - 1rem);
        max-height: calc(100vh - 1rem);
    }

    .promotions-modal-body[b-si92g219n6] {
        padding: 14px 14px 12px;
    }
}

@media (max-width: 640px) {
    .promotions-table-region[b-si92g219n6] {
        margin-left: 12px;
        margin-right: 12px;
    }

    .promotions-pager[b-si92g219n6] {
        padding-left: 12px;
        padding-right: 12px;
    }
}
/* /Components/Shared/SearchableSelect.razor.rz.scp.css */
.searchable-select[b-gmwtgmvm9s] {
  position: relative;
  width: 100%;
  min-width: 0;
}

.searchable-select--open[b-gmwtgmvm9s] {
  z-index: 1041;
}

.searchable-select__button[b-gmwtgmvm9s] {
  width: 100%;
  min-height: 38px;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  background-color: #fff;
  color: #212529;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

  .searchable-select__button:hover[b-gmwtgmvm9s] {
    border-color: #b8c3d4;
  }

  .searchable-select__button:focus-visible[b-gmwtgmvm9s],
  .searchable-select--open .searchable-select__button[b-gmwtgmvm9s] {
    outline: 0;
    border-color: #86b7fe;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
  }

  .searchable-select__button:disabled[b-gmwtgmvm9s] {
    background-color: #e9ecef;
    cursor: not-allowed;
    opacity: 0.65;
  }

.searchable-select__value[b-gmwtgmvm9s] {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.searchable-select__chevron[b-gmwtgmvm9s] {
  position: absolute;
  top: 50%;
  right: 0.75rem;
  transform: translateY(-50%);
  color: #212529;
  font-size: 14px;
  line-height: 1;
  opacity: 0.95;
  pointer-events: none;
}

.searchable-select__backdrop[b-gmwtgmvm9s] {
  position: fixed;
  inset: 0;
  z-index: 1040;
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: default;
}

.searchable-select__menu[b-gmwtgmvm9s] {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 1042;
  width: max(100%, 260px);
  max-height: 320px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(25, 35, 68, 0.14);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.16);
}

.searchable-select__search-row[b-gmwtgmvm9s] {
  flex: 0 0 auto;
  padding: 8px;
  border-bottom: 1px solid rgba(25, 35, 68, 0.08);
  background: #f8fafc;
}

.searchable-select__search-wrap[b-gmwtgmvm9s] {
  position: relative;
  width: 100%;
  min-width: 0;
}

.searchable-select__search[b-gmwtgmvm9s] {
  width: 100%;
  min-height: 34px;
  padding: 0.35rem 2rem 0.35rem 0.55rem;
  border: 1px solid rgba(25, 35, 68, 0.14);
  border-radius: 8px;
  color: #0f172a;
  font-size: 13px;
  outline: 0;
}

.searchable-select__search-clear[b-gmwtgmvm9s] {
  position: absolute;
  top: 50%;
  right: 7px;
  width: 20px;
  height: 20px;
  transform: translateY(-50%);
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #64748b;
  font-size: 16px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

  .searchable-select__search-clear:hover[b-gmwtgmvm9s] {
    background: rgba(25, 35, 68, 0.08);
    color: #0f172a;
  }

  .searchable-select__search:focus[b-gmwtgmvm9s] {
    border-color: #86b7fe;
    box-shadow: 0 0 0 0.18rem rgba(13, 110, 253, 0.16);
  }

.searchable-select__option[b-gmwtgmvm9s] {
  appearance: none;
  width: 100%;
  min-height: 34px;
  min-width: 0;
  display: flex;
  align-items: center;
  padding: 7px 10px;
  border: 0;
  border-bottom: 1px solid rgba(25, 35, 68, 0.045);
  background: #fff;
  color: #192344;
  font: inherit;
  font-size: 13px;
  line-height: 1.25;
  text-align: left;
  cursor: pointer;
}

  .searchable-select__option:hover[b-gmwtgmvm9s],
  .searchable-select__option:focus-visible[b-gmwtgmvm9s] {
    outline: none;
    background: rgba(37, 99, 235, 0.07);
  }

.searchable-select__option--selected[b-gmwtgmvm9s] {
  background: rgba(37, 99, 235, 0.10);
  color: #1d4ed8;
  font-weight: 700;
}

[b-gmwtgmvm9s] .searchable-select__option-tooltip {
  display: block;
  width: 100%;
  min-width: 0;
}

.searchable-select__option-text[b-gmwtgmvm9s] {
  display: block;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.searchable-select__empty[b-gmwtgmvm9s] {
  padding: 10px;
  color: #64748b;
  font-size: 12px;
  text-align: center;
}
/* /Components/Shared/UserArea.razor.rz.scp.css */
.user-area[b-200opg09xq] {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .75rem;
}

.role-badge[b-200opg09xq] {
  display: inline-flex;
  align-items: center;
  padding: .25rem .5rem;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 999px;
  font-size: .875rem;
  background: #fff;
}

.role-trigger[b-200opg09xq],
.user-trigger[b-200opg09xq] {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .1rem .25rem;
  border: 1px solid transparent;
  border-radius: .65rem;
  background: transparent;
  box-shadow: none;
}

  .role-trigger:hover[b-200opg09xq],
  .user-trigger:hover[b-200opg09xq] {
    background: rgba(0,0,0,.025);
    border-color: transparent;
  }

.role-label[b-200opg09xq] {
  font-size: .875rem;
  font-weight: 600;
}

.role-menu[b-200opg09xq],
.user-menu[b-200opg09xq] {
  position: relative;
}

.user-trigger:focus-visible[b-200opg09xq],
.menu-item:focus-visible[b-200opg09xq] {
  outline: 2px solid rgba(13,110,253,.45);
  outline-offset: 2px;
}

.role-panel[b-200opg09xq],
.user-panel[b-200opg09xq] {
  position: absolute;
  right: 0;
  top: calc(100% + .35rem);
  min-width: 180px;
  background: #fff;
  border: 1px solid var(--panel-border);
  box-shadow: var(--panel-shadow);
  border-radius: var(--radius-sm);
  padding: .35rem;
  z-index: 2000;
}

.role-item[b-200opg09xq],
.menu-item[b-200opg09xq] {
  width: 100%;
  text-align: left;
  display: block;
  padding: .45rem .6rem;
  border: 0;
  background: transparent;
  border-radius: .4rem;
  font-size: .9rem;
  color: inherit;
  text-decoration: none;
}

  .role-item:hover[b-200opg09xq],
  .menu-item:hover[b-200opg09xq] {
    background: rgba(0,0,0,.05);
  }

  .menu-item.danger[b-200opg09xq] {
    color: #b42318;
  }

.avatar[b-200opg09xq] {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 34px;
  overflow: hidden;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08);
}

  .avatar .bi[b-200opg09xq] {
    font-size: 15px;
    line-height: 1;
  }

.avatar-image[b-200opg09xq] {
  object-fit: cover;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: #fff;
}

.avatar-fallback[b-200opg09xq] {
  background: rgba(13,110,253,.10);
  border: 1px solid rgba(13,110,253,.18);
  color: rgba(13,110,253,.85);
}

  .avatar-fallback .bi[b-200opg09xq] {
    font-size: 15px;
    line-height: 1;
  }

.user-text[b-200opg09xq] {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  line-height: 1;
  min-width: 0;
  text-align: left;
}

.user-name[b-200opg09xq] {
  font-size: .92rem;
  font-weight: 700;
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0;
}

.user-sub[b-200opg09xq] {
  font-size: .72rem;
  opacity: .62;
  margin-top: .1rem;
  text-align: left;
}

.user-caret[b-200opg09xq] {
  font-size: .62rem;
  opacity: .5;
  margin-left: .05rem;
}

.icon-btn[b-200opg09xq] {
  border: 1px solid transparent;
  background: transparent;
  border-radius: .5rem;
  padding: .25rem .45rem;
}

  .icon-btn:hover[b-200opg09xq] {
    background: rgba(0,0,0,.03);
    border-color: rgba(0,0,0,.08);
  }

/* Session-expired modal */
.ua-session-backdrop[b-200opg09xq] {
  position: fixed;
  inset: 0;
  z-index: 1040;
  background: rgba(15, 23, 42, 0.46);
  backdrop-filter: blur(2px);
}

.ua-session-modal[b-200opg09xq] {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
}

.ua-session-card[b-200opg09xq] {
  width: 100%;
  max-width: 560px;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.22);
  overflow: hidden;
}

.ua-session-header[b-200opg09xq] {
  padding: 1rem 1.25rem 0.5rem 1.25rem;
}

.ua-session-title-wrap[b-200opg09xq] {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.ua-session-title[b-200opg09xq] {
  font-size: 1.1rem;
  font-weight: 700;
  color: #0f172a;
}

.ua-session-body[b-200opg09xq] {
  padding: 0.25rem 1.25rem 1rem 1.25rem;
}

.ua-session-message[b-200opg09xq] {
  margin: 0;
  font-size: 0.96rem;
  line-height: 1.55;
  color: #334155;
}

.ua-session-countdown[b-200opg09xq] {
  margin-top: 0.85rem;
  font-size: 0.84rem;
  color: #64748b;
}

.ua-session-footer[b-200opg09xq] {
  display: flex;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 0.95rem 1.25rem 1.15rem 1.25rem;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  background: rgba(248, 250, 252, 0.75);
}

.ua-session-primary[b-200opg09xq] {
  min-width: 140px;
}

@media (max-width: 640px) {
  .ua-session-modal[b-200opg09xq] {
    align-items: flex-end;
    padding: 0.75rem;
  }

  .ua-session-card[b-200opg09xq] {
    max-width: none;
    border-radius: 14px;
  }

  .ua-session-footer[b-200opg09xq] {
    justify-content: stretch;
  }

  .ua-session-primary[b-200opg09xq] {
    width: 100%;
  }
}