/* Shared public library presentation for Self Helps and Agreements. */

:root {
  --resource-accent-1: #075eae;
  --resource-accent-1-dark: #064779;
  --resource-border-1: #bdd8f0;
  --resource-row-1: #f2f7fc;
  --resource-accent-2: #0d7180;
  --resource-accent-2-dark: #07515c;
  --resource-border-2: #b9dde1;
  --resource-row-2: #f0f9fa;
  --resource-accent-3: #3b5f91;
  --resource-accent-3-dark: #29476c;
  --resource-border-3: #c8d5e7;
  --resource-row-3: #f2f5fa;
  --resource-accent-4: #5367a4;
  --resource-accent-4-dark: #3f4f82;
  --resource-border-4: #cdd3e8;
  --resource-row-4: #f4f5fb;
  --resource-accent-5: #1f705c;
  --resource-accent-5-dark: #165341;
  --resource-border-5: #bfdfd5;
  --resource-row-5: #f0f8f5;
  --resource-accent-6: #2b6c9e;
  --resource-accent-6-dark: #1e527a;
  --resource-border-6: #c2d8e8;
  --resource-row-6: #f0f6fa;
  --resource-accent-7: #5d6288;
  --resource-accent-7-dark: #44496c;
  --resource-border-7: #d1d3e1;
  --resource-row-7: #f5f5f9;
  --resource-accent-8: #35657d;
  --resource-accent-8-dark: #294e61;
  --resource-border-8: #c6d9e1;
  --resource-row-8: #f1f7f9;
  --resource-accent-9: #1b5c91;
  --resource-accent-9-dark: #124a75;
  --resource-border-9: #c3d7e8;
  --resource-row-9: #eef5fa;
}

/* Self Helps keeps the approved category groups and compact file rows. */
#selfHelpLibrary {
  display: grid;
  gap: 16px;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#selfHelpManageLink[hidden] {
  display: none !important;
}

.self-help-category {
  --resource-accent: var(--resource-accent-1);
  --resource-accent-dark: var(--resource-accent-1-dark);
  --resource-border: var(--resource-border-1);
  --resource-row: var(--resource-row-1);
}

.self-help-category-2 {
  --resource-accent: var(--resource-accent-2);
  --resource-accent-dark: var(--resource-accent-2-dark);
  --resource-border: var(--resource-border-2);
  --resource-row: var(--resource-row-2);
}

.self-help-category-3 {
  --resource-accent: var(--resource-accent-3);
  --resource-accent-dark: var(--resource-accent-3-dark);
  --resource-border: var(--resource-border-3);
  --resource-row: var(--resource-row-3);
}

.self-help-category-4 {
  --resource-accent: var(--resource-accent-4);
  --resource-accent-dark: var(--resource-accent-4-dark);
  --resource-border: var(--resource-border-4);
  --resource-row: var(--resource-row-4);
}

.self-help-category-5 {
  --resource-accent: var(--resource-accent-5);
  --resource-accent-dark: var(--resource-accent-5-dark);
  --resource-border: var(--resource-border-5);
  --resource-row: var(--resource-row-5);
}

.self-help-category-6 {
  --resource-accent: var(--resource-accent-6);
  --resource-accent-dark: var(--resource-accent-6-dark);
  --resource-border: var(--resource-border-6);
  --resource-row: var(--resource-row-6);
}

.self-help-category-7 {
  --resource-accent: var(--resource-accent-7);
  --resource-accent-dark: var(--resource-accent-7-dark);
  --resource-border: var(--resource-border-7);
  --resource-row: var(--resource-row-7);
}

.self-help-category-8 {
  --resource-accent: var(--resource-accent-8);
  --resource-accent-dark: var(--resource-accent-8-dark);
  --resource-border: var(--resource-border-8);
  --resource-row: var(--resource-row-8);
}

.self-help-category-9 {
  --resource-accent: var(--resource-accent-9);
  --resource-accent-dark: var(--resource-accent-9-dark);
  --resource-border: var(--resource-border-9);
  --resource-row: var(--resource-row-9);
}

.self-help-category {
  overflow: hidden;
  padding: 0;
  background: var(--white);
  border: 1px solid var(--resource-border);
  border-radius: var(--radius-large);
  box-shadow: 0 8px 22px rgba(5, 42, 74, 0.08);
}

.self-help-category h3 {
  margin: 0;
  padding: 14px 18px;
  color: var(--white);
  background: linear-gradient(135deg, var(--resource-accent), var(--resource-accent-dark));
  border-bottom: 1px solid var(--resource-accent-dark);
  font-size: 1.08rem;
  letter-spacing: 0.02em;
  line-height: 1.3;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.self-help-category .content-organized-items {
  gap: 6px;
  margin: 0;
  padding: 12px 14px 14px;
}

.self-help-category .content-organized-item,
.agreement-folder-entry,
.agreement-file-entry {
  overflow: hidden;
  padding: 0;
  background: var(--resource-row-1);
  border: 1px solid var(--resource-border-1);
  border-radius: var(--radius-small);
  box-shadow: none;
}

.self-help-category .content-organized-item {
  background: var(--resource-row);
  border-color: var(--resource-border);
}

/* Agreement folders and Agreement files intentionally use the exact compact
   Self Helps file-row pattern, not the colored Self Helps category header. */
.self-help-category .content-organized-item a,
.agreement-folder-card,
.agreement-file-entry .agreement-title-link,
.agreement-card:not(.is-manager) .agreement-title-link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 9px 12px;
  color: var(--navy);
  background: var(--resource-row-1);
  font-size: 1rem;
  font-weight: 750;
  line-height: 1.35;
  text-decoration: none;
  text-shadow: none;
  transition: background 150ms ease, color 150ms ease;
}

.self-help-category .content-organized-item a {
  background: var(--resource-row);
}

.agreement-folder-card-copy {
  display: block;
  min-width: 0;
}

.agreement-folder-card strong {
  display: block;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: normal;
  line-height: inherit;
  overflow-wrap: anywhere;
}

.agreement-folder-card-description,
.agreement-folder-card-count,
.agreement-file-entry .agreement-description {
  display: none;
}

body[data-agreement-library-mode="manage"]:not(.agreement-manager-preview) .agreement-folder-card-count {
  display: block;
  margin-top: 2px;
}

.self-help-category .content-organized-item a::after,
.agreement-file-entry .agreement-title-link::after,
.agreement-card:not(.is-manager) .agreement-title-link::after {
  content: "\203A";
  color: var(--resource-accent, var(--resource-accent-1));
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1;
  transition: transform 150ms ease;
}

.agreement-folder-card-arrow {
  color: var(--resource-accent-1);
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1;
  transition: transform 150ms ease;
}

.self-help-category .content-organized-item a:hover,
.self-help-category .content-organized-item a:focus-visible,
.agreement-folder-card:hover,
.agreement-folder-card:focus-visible,
.agreement-file-entry .agreement-title-link:hover,
.agreement-file-entry .agreement-title-link:focus-visible,
.agreement-card:not(.is-manager) .agreement-title-link:hover,
.agreement-card:not(.is-manager) .agreement-title-link:focus-visible {
  color: var(--resource-accent, var(--resource-accent-1));
  background: var(--white);
  outline: none;
}

.self-help-category .content-organized-item a:hover::after,
.self-help-category .content-organized-item a:focus-visible::after,
.agreement-file-entry .agreement-title-link:hover::after,
.agreement-file-entry .agreement-title-link:focus-visible::after,
.agreement-card:not(.is-manager) .agreement-title-link:hover::after,
.agreement-card:not(.is-manager) .agreement-title-link:focus-visible::after,
.agreement-folder-card:hover .agreement-folder-card-arrow,
.agreement-folder-card:focus-visible .agreement-folder-card-arrow {
  transform: translateX(2px);
}

.agreement-library-list {
  gap: 6px;
  padding: 12px 14px 14px;
  background: transparent;
}

.agreement-file-entry .agreement-card,
.agreement-card:not(.is-manager) {
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.agreement-file-entry .agreement-card-head,
.agreement-card:not(.is-manager) .agreement-card-head,
.agreement-file-entry .agreement-title {
  margin: 0;
}

.agreement-manager-strip {
  border-top: 1px solid var(--resource-border-1);
}

@media (max-width: 650px) {
  #selfHelpLibrary {
    gap: 14px;
  }

  .self-help-category h3 {
    padding: 13px 14px;
  }

  .self-help-category .content-organized-items,
  .agreement-library-list {
    padding: 10px;
  }

  .self-help-category .content-organized-item a,
  .agreement-folder-card,
  .agreement-file-entry .agreement-title-link,
  .agreement-card:not(.is-manager) .agreement-title-link {
    padding: 9px 10px;
  }
}
