/* Valley & Hill Gear Lists - shared styling. Initially used by index.php.
   Keep Gear-specific selectors scoped to avoid changing ../nav.php. */
:root {
  --gear-blue: steelblue;
  --gear-blue-hover: #356c98;
  --gear-ink: #222;
  --gear-cream: #fff9ed;
  --gear-white: #fff;
}
body {
  margin: 0;
  color: var(--gear-ink);
  font: 15px/1.45 Arial, Helvetica, sans-serif;
  background: url('background.jpg') no-repeat center center fixed;
  background-size: cover;
}
.gear-wrap, .gear-wrap * {box-sizing: border-box;}
.gear-wrap {
  width: 100%;
  max-width: none;
  margin: 12px 0 30px;
  padding: 0 14px;
  text-align: left;
}
.gear-heading {display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 12px; margin-bottom: 12px;}
.gear-wrap h1 {font-size: clamp(23px, 3vw, 29px); line-height: 1.25; color: #000; font-weight: 700; margin: 0; text-shadow: none;}
.gear-wrap a {color: var(--gear-blue);}
.gear-wrap a:hover {text-decoration: underline;}
.gear-wrap .gear-btn, .gear-wrap .gear-edit {
  display: inline-block;
  border: 0;
  border-radius: 5px;
  background: var(--gear-blue);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  white-space: nowrap;
}
.gear-wrap .gear-btn {padding: 5px 11px; font-size: 13px;}
.gear-wrap .gear-edit {padding: 3px 7px; font-size: 12px;}
.gear-wrap .gear-btn:hover, .gear-wrap .gear-edit:hover {background: var(--gear-blue-hover); color: white; text-decoration: none;}
.gear-directory {width: 100%; margin: 0; padding: 0; background: transparent; border: 0; box-shadow: none;}
.gear-table-wrap {width: 100%; overflow-x: auto;}
.gear-directory table {width: auto; max-width: 100%; border-collapse: collapse; border-spacing: 0; text-align: left; table-layout: auto;}
.gear-directory th, .gear-directory td {padding: 3px 7px; border: 0; vertical-align: middle;}
.gear-directory thead {background: var(--gear-blue); color: #fff;}
.gear-directory th {font-size: 13px; font-weight: 700;}
.gear-directory tbody tr {background: var(--gear-white);}
.gear-directory tbody tr:nth-child(even) {background: var(--gear-cream);}
.gear-directory tbody tr:hover {background: #e7f1f9;}
.gear-directory .gear-name {font-weight: bold; text-decoration: none; white-space: nowrap;}
.gear-directory .gear-name:hover {text-decoration: underline;}
.gear-directory .gear-num {text-align: right; white-space: nowrap;}
.gear-directory .gear-muted {color: #555; font-size: 13px; white-space: nowrap;}
.gear-directory .gear-empty {background: rgba(255,255,255,.95); padding: 15px;}
.gear-directory p[role="alert"] {background: #fff; padding: 12px;}
@media (max-width: 600px) {
  .gear-wrap {padding: 0 8px; margin-top: 10px;}
  .gear-heading {gap: 9px;}
  .gear-directory th, .gear-directory td {padding: 4px 4px; font-size: 12px;}
  .gear-directory .gear-name {white-space: normal; overflow-wrap: anywhere;}
  .gear-directory .gear-hide-small {display: none;}
  .gear-wrap .gear-edit {padding: 6px 8px;}
}

/* Public individual kit list - view.php */
.gear-wrap .gear-back {display:inline-block; margin:0 0 8px; font-size:13px;}
.gear-wrap .gear-view, .gear-wrap .gear-view-alert {margin:0; padding:0; border:0; border-radius:0; box-shadow:none; background:transparent; text-align:left;}
.gear-wrap .gear-view-alert {background:#fff; padding:8px;}
.gear-wrap .gear-view-stats {display:flex; flex-wrap:wrap; align-items:end; gap:6px 18px; margin:0 0 8px; padding:5px 7px; background:var(--gear-cream); border-radius:0;}
.gear-wrap .gear-view-muted {font-size:12px; color:#555;}
.gear-wrap .gear-view-big {font-size:19px; font-weight:700; color:#000;}
.gear-wrap .gear-view-group {width:100%; margin:0 0 4px; padding:0;}
.gear-wrap .gear-view-group h2 {font-size:14px; font-weight:700; margin:0; padding:3px 7px; background:var(--gear-blue); color:white; border:0; border-radius:0;}
.gear-wrap .gear-view-row {display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin:0; padding:2px 7px; min-height:0; background:var(--gear-cream); border:0; border-radius:0;}
.gear-wrap .gear-view-name {flex:1; min-width:0; overflow-wrap:break-word;}
.gear-wrap .gear-view-weight {font-weight:700; white-space:nowrap; text-align:right;}
@media(max-width:600px) {
  .gear-wrap .gear-view-stats {gap:6px 12px;}
  .gear-wrap .gear-view-row {padding:3px 5px;}
}

/* Explicit view layout to survive older cached/general site table rules */
main.gear-wrap .gear-view {display:block;width:100%;}
main.gear-wrap .gear-view-group {display:block;width:100%;margin-bottom:3px;}
main.gear-wrap .gear-view-group > h2 {display:block;margin:0;padding:3px 7px;background:steelblue;color:#fff;font-size:14px;font-weight:bold;line-height:1.3;}
main.gear-wrap .gear-view-group > .gear-view-row {display:flex;width:100%;align-items:center;justify-content:space-between;gap:16px;margin:0;padding:3px 7px;background:#fff9ed;color:#222;line-height:1.35;}
main.gear-wrap .gear-view-row > .gear-view-name {display:block;flex:1 1 auto;min-width:0;}
main.gear-wrap .gear-view-row > .gear-view-weight {display:block;flex:0 0 auto;margin-left:auto;white-space:nowrap;text-align:right;}

/* Compact, content-width equipment table: every category shares one width. */
main.gear-wrap .gear-view {
  display: inline-block;
  width: max-content;
  max-width: 100%;
  vertical-align: top;
}
main.gear-wrap .gear-view-stats {
  margin: 0;
}
main.gear-wrap .gear-view-group {
  width: 100%;
  margin: 0;
  padding: 0;
}
main.gear-wrap .gear-view-group > h2 {
  margin: 0;
  padding: 2px 7px;
}
main.gear-wrap .gear-view-group > .gear-view-row {
  width: 100%;
  margin: 0;
  padding: 2px 7px;
  gap: 18px;
}
main.gear-wrap .gear-view-name {
  white-space: nowrap;
}
@media (max-width: 600px) {
  main.gear-wrap .gear-view-name {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/* View page - compact total underneath the complete equipment table */
main.gear-wrap .gear-view-summary {
  margin: 0;
  padding: 5px 7px;
  background: var(--gear-cream);
  color: #222;
  font-size: 14px;
  font-weight: 700;
  white-space: normal;
}


/* Gear list builder - create.php. All styling scoped to the builder. */
.gear-wrap .panel {
  background: rgba(255,255,255,.96); border: 0; border-radius: 0;
  padding: 9px 10px; margin: 0 0 7px; box-shadow: none;
  width: fit-content; max-width: 100%;
}
.gear-wrap .panel:has(.gear-row), .gear-wrap .panel:has(.stats) {min-width: min(100%, 640px);}
.gear-wrap h2 {font-size: 16px; margin: 0 0 5px; color: #000;}
.gear-wrap label {display:block;font-weight:bold;margin-bottom:3px;}
.gear-wrap input, .gear-wrap select, .gear-wrap button {font:inherit; font-size:14px;}
.gear-wrap input, .gear-wrap select {width:100%;min-width:0;height:35px;padding:5px 8px;border:1px solid #bbb;border-radius:0;background:white;}
.gear-wrap button {background:var(--gear-blue);color:#fff;border:0;border-radius:0;min-height:34px;padding:6px 10px;font-weight:700;cursor:pointer;}
.gear-wrap button:hover {background:var(--gear-blue-hover);}
.gear-wrap button:disabled {opacity:.45;cursor:not-allowed;}
.gear-wrap button.secondary, .gear-wrap button.own-toggle {background:#e7f1f9;color:#265679;}
.gear-wrap button.secondary:hover, .gear-wrap button.own-toggle:hover {background:#cfe4f3;}
.gear-wrap button.remove {font-size:12px;padding:3px 7px;min-height:28px;background:#e7f1f9;color:#265679;}
.gear-wrap .inline {display:flex; flex-wrap:wrap; gap:7px; align-items:end;}
.gear-wrap .inline>.field {flex:1;min-width:145px;}
.gear-wrap .inline>.field.type-field {flex:0 1 220px;}
.gear-wrap .inline>.field.item-field {flex:1 1 300px;}
.gear-wrap .field.small {flex:0 1 125px;}
.gear-wrap .actions {display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.gear-wrap .tag {display:inline-block;background:#e7f1f9;color:#265679;padding:4px 9px;font-weight:bold;}
.gear-wrap .stats {display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:var(--gear-cream);padding:5px 8px;margin-bottom:5px;}
.gear-wrap .big {font-size:20px;font-weight:bold;color:#000;}
.gear-wrap small, .gear-wrap .hint {color:#555;}
.gear-wrap .list-group {margin:0;}
.gear-wrap .list-group h3 {font-size:14px;margin:0;padding:3px 7px;background:var(--gear-blue);color:#fff;}
.gear-wrap .gear-row {display:flex;align-items:center;gap:10px;padding:2px 7px;background:var(--gear-cream);border:0;}
.gear-wrap .gear-row .item {flex:1;min-width:0;overflow-wrap:anywhere;}
.gear-wrap .weight {white-space:nowrap;font-weight:bold;}
.gear-wrap .warning {background:#fff0e9;border:1px solid #e0a28b;padding:9px 12px;margin-bottom:9px;}
.gear-wrap .own-toggle {margin-top:6px;font-size:13px;}
.gear-wrap .own-box {margin-top:6px;padding:8px;background:var(--gear-cream);border:0;}
.gear-wrap .own-box[hidden], .gear-wrap .save-fields[hidden] {display:none;}
.gear-wrap .hint {font-size:12px;margin:5px 0 0;}
.gear-wrap .hint:empty {display:none;}
.gear-wrap .save-fields {display:flex;align-items:end;gap:8px;flex-wrap:wrap;margin-top:8px;}
.gear-wrap .save-fields>.field {flex:1 1 190px;}
.gear-wrap .save-fields>.hint {flex:1 1 100%;}
.gear-wrap .notice {border-left:4px solid var(--gear-blue);padding:9px 12px;margin:8px 0;background:#fff;}
.gear-wrap .gear-issued-password {font-size:19px;font-weight:bold;color:#265679;user-select:all;}
@media(max-width:580px) {
  .gear-wrap .panel {width:100%;padding:8px;}
  .gear-wrap .inline>.field, .gear-wrap .inline>.field.type-field, .gear-wrap .inline>.field.item-field {flex:1 1 100%;min-width:0;}
  .gear-wrap .inline>.field.small {flex:1 1 115px;}
  .gear-wrap input,.gear-wrap select,.gear-wrap button {font-size:16px;min-height:40px;}
  .gear-wrap .gear-row {gap:6px;}
  .gear-wrap .gear-row .item {font-size:14px;}
  .gear-wrap .weight {font-size:13px;}
}


/* Create page: single unified kit-builder panel; keep other pages unchanged. */
main.gear-wrap > .gear-builder-panel,
main.gear-wrap > .gear-builder-panel:has(.gear-row),
main.gear-wrap > .gear-builder-panel:has(.stats) {
  width: min(100%, 760px);
  min-width: 0;
  max-width: 760px;
  display: block;
  margin: 8px 0 20px;
  padding: 10px;
  background: rgba(255,255,255,.96);
  border: 0;
}
.gear-builder-panel #catalog-form {
  display: flex;
  flex-wrap: nowrap;
  align-items: end;
  gap: 8px;
  width: 100%;
}
.gear-builder-panel #catalog-form > .type-field {flex: 0 1 205px; min-width: 0;}
.gear-builder-panel #catalog-form > .item-field {flex: 1 1 auto; min-width: 0;}
.gear-builder-panel #catalog-form > #add-catalog {flex: 0 0 auto; white-space: nowrap;}
.gear-builder-panel .gear-list-part {margin-top: 8px; width: 100%;}
.gear-builder-panel .gear-list-part h2 {margin: 0 0 4px;}
.gear-builder-panel .list-group,
.gear-builder-panel .list-group h3,
.gear-builder-panel .gear-row {width: 100%;}
.gear-builder-panel .gear-row {gap: 8px;}
.gear-builder-panel .gear-save-part {padding: 8px 0 0; margin: 0; width: 100%;}
.gear-builder-panel button {border-radius: 6px;}
.gear-builder-panel .own-toggle {margin-top: 6px;}
.gear-builder-panel .own-box {margin-bottom: 3px;}
@media (max-width: 600px) {
  main.gear-wrap > .gear-builder-panel {width:100%;padding:8px;}
  .gear-builder-panel #catalog-form {flex-wrap:wrap;}
  .gear-builder-panel #catalog-form > .type-field,
  .gear-builder-panel #catalog-form > .item-field {flex:1 1 100%;min-width:0;}
  .gear-builder-panel #catalog-form > #add-catalog {flex: 0 0 auto;}
}

/* Final create.php refinements and consistent rounded Gear List buttons. */
.gear-wrap button,
.gear-wrap input[type="submit"],
.gear-wrap input[type="button"],
.gear-wrap .gear-btn,
.gear-wrap .gear-edit {
  border-radius: 7px;
}
.gear-wrap button:focus-visible,
.gear-wrap .gear-btn:focus-visible,
.gear-wrap .gear-edit:focus-visible { outline: 2px solid #173a58; outline-offset: 2px; }
.gear-builder-panel #catalog-form {flex-wrap:wrap; align-items:end; gap:7px;}
.gear-builder-panel #catalog-form > .type-field {flex:0 1 160px;}
.gear-builder-panel #catalog-form > .item-field {flex:1 1 210px;}
.gear-builder-panel #catalog-form > #add-catalog {flex:0 0 auto;}
.gear-builder-panel #catalog-form > #toggle-own {
  flex:0 0 auto; margin:0; white-space:nowrap;
  background:var(--gear-blue); color:#fff;
}
.gear-builder-panel #catalog-form > #toggle-own:hover {background:var(--gear-blue-hover); color:#fff;}
.gear-builder-panel .gear-list-summary {
  margin:0; padding:5px 7px; font-size:14px; font-weight:700;
  background:var(--gear-cream); color:var(--gear-ink);
}
@media (max-width: 700px) {
  .gear-builder-panel #catalog-form > .type-field,
  .gear-builder-panel #catalog-form > .item-field {flex:1 1 100%;}
  .gear-builder-panel #catalog-form > #toggle-own {white-space:normal; text-align:left;}
}


/* Login and edit pages: shared Gear styling without affecting nav.php. */
main.gear-wrap.gear-login {max-width:none; margin:12px 0 30px; padding:0 14px;}
.gear-login .gear-login-panel {width:min(100%,440px); padding:12px; margin:8px 0 0; border:0; background:rgba(255,255,255,.96);}
.gear-login .gear-login-panel p {margin:0 0 10px;}
.gear-login .gear-login-panel label {display:block; margin:8px 0 3px; font-weight:700;}
.gear-login .gear-login-panel input {display:block; width:100%; max-width:100%; height:36px; padding:5px 8px; border:1px solid #aaa; border-radius:5px; background:#fff;}
.gear-login .gear-login-panel button {margin-top:12px; border-radius:7px; background:var(--gear-blue); color:white; padding:7px 12px;}
.gear-login .gear-login-panel button:hover {background:var(--gear-blue-hover);}
.gear-login .gear-login-panel .error {color:#8b1427; font-weight:700;}
/* Editing controls and category headings use the same approved design as create.php. */
.gear-wrap .panel {background:rgba(255,255,255,.96); border:0; border-radius:0; box-shadow:none;}
.gear-wrap .panel .list-group h3 {background:var(--gear-blue);color:white;border-radius:0;}
.gear-wrap .panel .gear-row {background:var(--gear-cream);border:0;}
.gear-wrap .panel button {border-radius:7px;}
@media(max-width:600px){.gear-login .gear-login-panel {width:100%;}.gear-login .gear-login-panel input,.gear-login .gear-login-panel button{min-height:40px;font-size:16px;}}

/* Season selector on the create page */
.gear-builder-panel .season-choice-form { display:flex; align-items:end; gap:8px; flex-wrap:wrap; margin:0 0 9px; }
.gear-builder-panel .season-choice-form .field {flex:0 1 230px; min-width:170px;}
.gear-builder-panel .season-choice-form select {width:100%;}
.gear-builder-panel .season-choice-form button {border-radius:6px;}

/* Weight chart: inside the same content-width block as the equipment rows. */
main.gear-wrap .gear-pie-section {width:100%; box-sizing:border-box; background:var(--gear-cream); padding:8px 7px 10px; margin:3px 0 0; text-align:left;}
main.gear-wrap .gear-pie-title {font-size:14px; font-weight:700; margin:0 0 4px;}
main.gear-wrap .gear-pie {display:block; width:100%; max-width:300px; height:auto; margin:0 auto 7px; overflow:hidden;}
main.gear-wrap .gear-pie-key {width:100%; font-size:12px; line-height:1.4;}
main.gear-wrap .gear-pie-key-row {display:flex; align-items:baseline; justify-content:space-between; gap:10px; padding:2px 0;}
main.gear-wrap .gear-pie-key-name {display:flex; align-items:baseline; gap:6px; min-width:0; overflow-wrap:anywhere;}
main.gear-wrap .gear-pie-swatch {display:inline-block; width:10px; height:10px; flex:0 0 10px; border-radius:2px;}
main.gear-wrap .gear-pie-key-stats {white-space:nowrap; font-variant-numeric:tabular-nums;}
main.gear-wrap .gear-packing-download {display:inline-block; margin:9px 0 0; text-decoration:none;}