/* PSG Database cumulative homepage + site readability patch */

:root {
  --psg-ref-ink:#25282a;
  --psg-ref-muted:#667069;
  --psg-ref-gold:#b58227;
  --psg-ref-gold-dark:#835c18;
  --psg-ref-sage:#738268;
  --psg-ref-cream:#faf7f0;
  --psg-ref-line:#dfd5c5;
}

/* Restore safe readable widths everywhere except the homepage. */
main {
  width:min(1240px, calc(100% - 48px));
  padding:34px 0 72px;
}

main > .heading,
main > .panel,
main > .stats,
main > .cards,
main > .grid,
main > .profile-head,
main > .profile-grid,
main > .results,
main > .search-summary,
main > .search-pagination,
main > .pedigree-section,
main > .public-content-grid {
  max-width:1160px;
  margin-left:auto;
  margin-right:auto;
}

.panel {
  padding:clamp(22px, 2.8vw, 32px);
}

.psg-reference-home {
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-top:-34px;
  padding-bottom:42px;
  color:var(--psg-ref-ink);
  background:linear-gradient(180deg,#fbf8f1 0,#fff 520px,#faf8f3 100%);
}

.psg-reference-banner {
  width:100%;
  background:#f8f3e9;
  overflow:hidden;
}

.psg-reference-banner img {
  display:block;
  width:100%;
  height:auto;
  min-height:300px;
  max-height:520px;
  object-fit:cover;
  object-position:center;
}

.psg-reference-search {
  position:relative;
  z-index:2;
  width:min(calc(100% - 36px),1080px);
  margin:-72px auto 0;
  padding:clamp(24px,3vw,38px);
  border:1px solid rgba(181,130,39,.25);
  border-radius:24px;
  background:rgba(255,255,255,.98);
  box-shadow:0 24px 62px rgba(63,48,28,.14);
}

.psg-reference-search header {
  position:static;
  min-height:0;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
  display:block;
  text-align:center;
}

.psg-reference-search h1 {
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(2rem,4vw,3.1rem);
  font-weight:500;
  line-height:1.05;
  letter-spacing:-.025em;
}

.psg-reference-search h1 em {
  color:var(--psg-ref-gold);
  font-style:normal;
}

.psg-reference-search header p {
  margin:10px auto 0;
  max-width:760px;
  color:var(--psg-ref-muted);
  font-size:1.05rem;
  line-height:1.55;
}

.psg-reference-home .public-search-form {
  display:grid;
  grid-template-columns:minmax(220px,.85fr) minmax(320px,1.7fr) 150px;
  gap:0;
  margin:24px 0 0;
  overflow:hidden;
  border:1px solid #d8cdbb;
  border-radius:13px;
  background:#fff;
}

.psg-reference-home .public-search-form label {
  display:grid;
  gap:5px;
  min-width:0;
  padding:10px 15px;
  border-right:1px solid #e2d9ca;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.psg-reference-home .public-search-form select,
.psg-reference-home .public-search-form input {
  width:100%;
  min-width:0;
  min-height:35px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--psg-ref-ink);
  font:inherit;
  font-size:1.04rem;
  letter-spacing:normal;
  text-transform:none;
  outline:none;
}

.psg-reference-home .public-search-form select {
  padding-right:34px;
}

.psg-reference-home .public-search-form button {
  min-height:70px;
  border:0;
  border-radius:0;
  background:linear-gradient(135deg,#bd9141,#93661e);
  color:#fff;
  font-size:1.04rem;
  font-weight:850;
  cursor:pointer;
}

.psg-reference-home .public-search-form:focus-within {
  border-color:var(--psg-ref-gold);
  box-shadow:0 0 0 4px rgba(181,130,39,.13);
}

.psg-reference-search-note {
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-top:12px;
  color:var(--psg-ref-muted);
  font-size:.9rem;
}

.psg-reference-search-note small { font-size:inherit; }
.psg-reference-search-note span {
  color:var(--psg-ref-sage);
  font-weight:700;
}

.psg-reference-intro {
  width:min(calc(100% - 36px),760px);
  margin:28px auto 0;
  text-align:center;
}

.psg-reference-intro p {
  margin:0;
  color:#555e59;
  font-size:1.08rem;
  line-height:1.72;
}

.psg-reference-features {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
  width:min(calc(100% - 40px),1180px);
  margin:24px auto 0;
}

.psg-reference-card {
  display:grid;
  grid-template-columns:66px minmax(0,1fr);
  gap:16px;
  min-height:188px;
  padding:22px 20px;
  border:1px solid var(--psg-ref-line);
  border-radius:16px;
  background:#fff;
  color:var(--psg-ref-ink);
  box-shadow:0 9px 24px rgba(63,48,28,.06);
}

.psg-card-icon {
  display:grid;
  place-items:center;
  width:60px;
  height:60px;
  border:1px solid rgba(115,130,104,.4);
  border-radius:50%;
  background:#f8f7f0;
  color:var(--psg-ref-gold-dark);
  font-size:1rem;
  font-weight:900;
}

.psg-reference-card h2 {
  margin:2px 0 8px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.2rem;
  font-weight:500;
}

.psg-reference-card p {
  margin:0;
  color:var(--psg-ref-muted);
  font-size:.96rem;
  line-height:1.55;
}

.psg-reference-card b {
  display:block;
  margin-top:13px;
  color:var(--psg-ref-gold-dark);
  font-size:.9rem;
}

.psg-reference-stats {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  width:min(calc(100% - 40px),1120px);
  margin:20px auto 0;
  padding:19px 24px;
  border:1px solid var(--psg-ref-line);
  border-radius:15px;
  background:#fff;
}

.psg-reference-stats div {
  display:grid;
  gap:4px;
  text-align:center;
  border-right:1px solid #e5ddd1;
}

.psg-reference-stats div:last-child { border-right:0; }

.psg-reference-stats b {
  color:var(--psg-ref-sage);
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.55rem;
  font-weight:500;
}

.psg-reference-stats span {
  color:var(--psg-ref-muted);
  font-size:.88rem;
}

.psg-reference-home + .search-summary,
.psg-reference-home ~ .results,
.psg-reference-home ~ .search-pagination {
  max-width:1160px;
  margin-left:auto;
  margin-right:auto;
}

/* Appearance family editor on profile pages. */
.appearance-profile-editor .appearance-family-tree {
  margin-top:12px;
}
.appearance-profile-editor summary {
  font-size:1.05rem;
}
.appearance-profile-editor .appearance-family-card {
  background:#fbfaf7;
}

/* Public information pages. */
.public-page-heading {
  margin-bottom:24px;
}
.public-content-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.public-content-grid .panel {
  margin:0;
}
.public-content-grid h2,
.educational-page h2,
.legal-page h2 {
  margin-top:0;
}
.educational-page,
.legal-page {
  max-width:900px!important;
  line-height:1.72;
}
.educational-page h2:not(:first-child),
.legal-page h2:not(:first-child) {
  margin-top:30px;
}

/* Footer */
.site-footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  padding:30px max(24px,calc((100vw - 1160px)/2));
  text-align:left;
  background:#fff;
}
.site-footer div {
  display:grid;
  gap:3px;
}
.site-footer nav {
  display:flex;
  flex-wrap:wrap;
  gap:18px;
}
.site-footer a {
  color:var(--psg-ref-muted);
}

/* Header refinement matching approved reference. */
body > header {
  position:sticky;
  top:0;
  z-index:20;
  min-height:84px;
  padding:11px clamp(20px,4vw,62px);
  background:rgba(255,255,255,.98);
}
body > header .psg-logo-brand img {
  width:auto;
  height:62px;
  max-width:280px;
  object-fit:contain;
}
body > header nav {
  gap:clamp(14px,2.2vw,30px);
}
body > header nav a,
body > header nav .link {
  color:var(--psg-ref-ink);
  font-weight:750;
}
body > header nav a:last-child,
body > header nav form:last-child .link {
  padding:10px 20px;
  border:1px solid var(--psg-ref-gold);
  border-radius:999px;
}

/* Responsive behavior */
@media(max-width:980px){
  main { width:min(100% - 32px,1240px); }
  .psg-reference-home .public-search-form {
    grid-template-columns:minmax(210px,.9fr) minmax(240px,1.2fr);
  }
  .psg-reference-home .public-search-form button {
    grid-column:1/-1;
    min-height:54px;
  }
  .psg-reference-features {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:700px){
  main { width:min(100% - 22px,1240px); }
  .psg-reference-home { margin-top:-34px; }
  .psg-reference-banner img {
    min-height:250px;
    object-position:center;
  }
  .psg-reference-search {
    width:min(calc(100% - 18px),1080px);
    margin-top:-46px;
    padding:20px 13px;
    border-radius:18px;
  }
  .psg-reference-home .public-search-form {
    grid-template-columns:1fr;
    gap:10px;
    overflow:visible;
    border:0;
    background:transparent;
  }
  .psg-reference-home .public-search-form label {
    border:1px solid #d8cdbb;
    border-radius:11px;
    background:#fff;
  }
  .psg-reference-home .public-search-form button {
    grid-column:auto;
    border-radius:11px;
  }
  .psg-reference-search-note {
    display:block;
  }
  .psg-reference-search-note span {
    display:block;
    margin-top:7px;
  }
  .psg-reference-features,
  .psg-reference-stats,
  .public-content-grid {
    grid-template-columns:1fr;
  }
  .psg-reference-stats div {
    padding:12px 0;
    border-right:0;
    border-bottom:1px solid #e5ddd1;
  }
  .psg-reference-stats div:last-child { border-bottom:0; }
  .site-footer {
    align-items:flex-start;
    flex-direction:column;
  }
}

@media(max-width:500px){
  .panel { padding:20px 16px; }
  .psg-reference-search h1 { font-size:1.85rem; }
  .psg-reference-card {
    grid-template-columns:56px minmax(0,1fr);
    padding:18px 15px;
  }
  .psg-card-icon {
    width:52px;
    height:52px;
  }
}


/* v2 homepage banner and centering corrections */

/*
 * On the homepage only, allow the approved design to use the full browser
 * content width without the fragile 100vw breakout that caused a black strip.
 */
main:has(> .psg-reference-home) {
  width: 100%;
  max-width: none;
  padding-top: 0;
  overflow-x: clip;
}

.psg-reference-home {
  width: 100%;
  margin: 0;
  padding-bottom: 42px;
  overflow-x: clip;
}

/* The replacement image contains only the banner, not a fake search-card edge. */
.psg-reference-banner {
  width: 100%;
  overflow: hidden;
  background: #f8f3e9;
}

.psg-reference-banner img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: none;
  aspect-ratio: 1536 / 377;
  object-fit: cover;
  object-position: center center;
}

/* Center the actual search card evenly beneath the hero. */
.psg-reference-search {
  left: auto;
  right: auto;
  width: min(calc(100% - 40px), 1080px);
  margin: -42px auto 0;
  transform: none;
}

/* Remove any inherited decorative pseudo-elements around the card. */
.psg-reference-search::before,
.psg-reference-search::after {
  content: none !important;
  display: none !important;
}

/* Keep the search card visually centered at all supported widths. */
@media (max-width: 980px) {
  .psg-reference-search {
    width: min(calc(100% - 28px), 1080px);
    margin-top: -30px;
  }
}

@media (max-width: 700px) {
  main:has(> .psg-reference-home) {
    width: 100%;
    padding-top: 0;
  }

  .psg-reference-home {
    margin: 0;
  }

  .psg-reference-banner img {
    aspect-ratio: auto;
    min-height: 230px;
    object-fit: cover;
    object-position: center center;
  }

  .psg-reference-search {
    width: min(calc(100% - 18px), 1080px);
    margin-top: -24px;
  }
}


/* v4: reliable homepage full-width layout and genetics wording */

/*
 * Use a body class rather than :has(), ensuring Firefox and all supported
 * browsers remove the constrained main width on the homepage.
 */
html,
body.psg-home-page {
  width: 100%;
  min-width: 100%;
  max-width: none;
  margin: 0;
  overflow-x: hidden;
  background: #ffffff !important;
}

body.psg-home-page > main {
  display: block;
  width: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 0 72px !important;
  overflow-x: hidden !important;
  background: #ffffff;
}

body.psg-home-page .psg-reference-home,
body.psg-home-page .psg-reference-banner {
  display: block;
  width: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.psg-home-page .psg-reference-banner {
  overflow: hidden !important;
  background: #f8f3e9 !important;
}

body.psg-home-page .psg-reference-banner img {
  display: block !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Cover any fractional browser-rendering seam without changing the composition. */
body.psg-home-page .psg-reference-banner::after {
  content: "";
  position: absolute;
  top: 0;
  right: -3px;
  bottom: 0;
  width: 6px;
  background: #f8f3e9;
  pointer-events: none;
}

body.psg-home-page .psg-reference-banner {
  position: relative;
}

/* Genetics badge: no DNA terminology or helix imagery. */
.psg-genetics-icon {
  font-size: .78rem;
  letter-spacing: .04em;
}


/* Breeder report output controls */
.breeder-report-output-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.breeder-report-output-actions small {
  flex-basis: 100%;
  color: var(--muted);
  line-height: 1.45;
}

/* Letter-paper preview on screen */
.breeder-record-sheet {
  width: min(100%, 8.5in);
  min-height: 11in;
  margin: 24px auto;
  padding: .42in;
  border-radius: 4px;
  box-shadow: 0 10px 34px rgba(0,0,0,.09);
}
.breeder-record-table {
  table-layout: fixed;
}
.breeder-record-table th,
.breeder-record-table td {
  overflow-wrap: anywhere;
  word-break: normal;
}
.grouped-transfer-card p {
  max-width: 34rem;
  line-height: 1.45;
}
.grouped-transfer-edit-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.grouped-transfer-edit-links a {
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
}
.grouped-transfer-tools-hidden {
  display: none !important;
}

/* Header navigation only. Never treat footer nav as the mobile drawer. */
.site-footer > nav {
  position: static !important;
  display: flex !important;
  width: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

@media (min-width: 761px) {
  body > header #menuBtn {
    display: none !important;
  }
  body > header #nav {
    display: flex !important;
    position: static !important;
    inset: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

@media (max-width: 760px) {
  body > header {
    position: sticky;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
    gap: 12px;
  }
  body > header #menuBtn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 101;
  }
  body > header #nav {
    display: none !important;
    position: absolute !important;
    z-index: 100;
    top: calc(100% + 8px) !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-height: calc(100vh - 110px);
    overflow-y: auto;
    padding: 14px !important;
    border: 1px solid var(--line) !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 18px 45px rgba(40,31,21,.2) !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 4px !important;
  }
  body > header #nav.open {
    display: flex !important;
  }
  body > header #nav a,
  body > header #nav .link {
    display: block;
    width: 100%;
    padding: 12px 13px !important;
    border: 0 !important;
    border-radius: 10px !important;
    text-align: left;
  }
  body > header #nav form {
    width: 100%;
  }
  .site-footer > nav {
    display: grid !important;
    gap: 10px !important;
  }
}

@media print {
  @page {
    size: Letter portrait;
    margin: .3in;
  }
  html,
  body {
    width: 8.5in !important;
    min-width: 8.5in !important;
    margin: 0 !important;
    background: #fff !important;
  }
  body > header,
  .site-footer,
  .no-print,
  .flash {
    display: none !important;
  }
  body > main {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .breeder-record-sheet {
    width: 7.9in !important;
    min-height: 10.35in !important;
    margin: 0 auto !important;
    padding: .18in !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    break-after: auto;
    page-break-after: auto;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .breeder-record-header,
  .breeder-record-meta {
    gap: 8px;
    margin-bottom: 8px;
    padding-bottom: 7px;
  }
  .breeder-record-table {
    width: 100% !important;
    font-size: 7.6pt !important;
    table-layout: fixed !important;
  }
  .breeder-record-table th,
  .breeder-record-table td {
    padding: 4px !important;
    line-height: 1.18;
  }
  .breeder-record-table-wrap {
    overflow: visible !important;
  }
  .transfer-party-grid {
    gap: 8px;
    margin-bottom: 8px;
  }
  .transfer-party-grid article {
    padding: 8px;
  }
  .breeder-record-footer {
    font-size: 7.5pt;
  }
}


/* Bulk unmatched identity generator */
.bulk-identity-generator { margin-top: 22px; }
.bulk-identity-warning {
 padding: 14px 16px;
 margin: 16px 0;
 border: 1px solid #e3c98e;
 border-radius: 12px;
 background: #fff9e9;
 line-height: 1.5;
}
.bulk-identity-controls {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
 align-items: center;
 margin-bottom: 14px;
}
.bulk-identity-controls span { font-weight: 800; }
.bulk-identity-table input[type='text'],
.bulk-identity-table input[data-generated-initials] {
 width: 92px;
 min-width: 92px;
 text-transform: uppercase;
 font-weight: 850;
 letter-spacing: .08em;
}
.bulk-identity-table td:first-child { text-align: center; }
.bulk-identity-row-warning { color: #9a5419; font-weight: 700; }
.bulk-identity-safe { color: #476d3d; font-weight: 800; }
.bulk-identity-confirmation {
 display: grid;
 grid-template-columns: minmax(280px, 1fr) auto;
 gap: 16px;
 align-items: end;
 margin-top: 18px;
 padding-top: 18px;
 border-top: 1px solid var(--line);
}
.bulk-identity-confirmation label { display: grid; gap: 8px; }
@media(max-width:760px){
 .bulk-identity-confirmation { grid-template-columns: 1fr; }
 .bulk-identity-confirmation button { width: 100%; }
}
