/*
  Library of Virginia refresh for the Seasons theme.
  Loaded after style.css. Keeps the seasonal palette (autumn is live) and
  layout, swaps in the LVA type system and softens the card chrome.
*/
:root {
  --font-primary: trade-gothic-next, "Helvetica Neue", Arial, sans-serif;
  --font-condensed: trade-gothic-next-condensed, "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --font-secondary: mr-eaves-modern, "Helvetica Neue", Arial, sans-serif;
  --radius: 8px;
  --card-border: rgba(0, 0, 0, 0.08);
  --card-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 4px 16px rgba(0, 0, 0, 0.05);
  --max-width: 1400px;
  --gutter: max(24px, calc((100% - var(--max-width)) / 2));
}

@media screen {
  /* ---------- Type ---------- */
  body {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 17px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
  }
  .autumn body {
    color: #4a3630;
  }
  h1, h2, h3, h4, h5, h6, #site-title {
    font-family: var(--font-condensed);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: 0.01em;
  }
  h1 { font-size: 2.5rem; }
  h2 { font-size: 1.75rem; }
  h3 { font-size: 1.3rem; }
  h4 { font-size: 1.1rem; }
  body #content > h1 {
    font-size: 2.5rem;
    line-height: 1.1;
    padding: 8px 0 20px;
    text-transform: uppercase;
  }
  .autumn #content > h1, .autumn #content #primary > h1 {
    color: #815442;
  }
  a {
    text-underline-offset: 0.18em;
    text-decoration-thickness: 1px;
  }

  /* ---------- Layout ---------- */
  header, nav.top, #content, footer[role=contentinfo] {
    padding-left: var(--gutter);
    padding-right: var(--gutter);
  }
  #content {
    padding-top: 32px;
    padding-bottom: 48px;
  }

  /* ---------- Header ---------- */
  header[role=banner] {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  #site-title {
    font-size: 2.1rem;
    line-height: 1.1;
    padding: 20px 0;
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }
  #site-title a {
    text-decoration: none;
  }
  #search-container {
    margin-top: 22px;
  }
  #search-form input[type=text] {
    height: 40px;
    border-radius: 100px;
    padding: 8px 20px;
    font-family: var(--font-primary);
    font-size: 16px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.08);
  }
  #search-form.with-advanced input[type=text] {
    padding-right: 92px;
  }
  #search-form button {
    height: 40px;
    width: 40px;
  }
  #search-form button:after, .show-advanced.button:after {
    line-height: 40px;
    height: 40px;
  }
  #search-form #submit_search {
    border-radius: 0 100px 100px 0;
    width: 44px;
  }
  #search-form.with-advanced #submit_search {
    right: 0;
  }
  #search-form.with-advanced .show-advanced.button {
    height: 40px;
    width: 40px;
    right: 44px;
    border-right: 1px solid rgba(255, 255, 255, 0.25);
  }
  #advanced-form {
    top: 48px;
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    box-shadow: var(--card-shadow);
  }

  /* ---------- Navigation ---------- */
  nav.top a, .top .mobile, nav.secondary-nav a, #secondary-nav a, .pagination, #sort-links,
  .button, button, input[type=submit] {
    font-family: var(--font-secondary);
  }
  nav.top .nav-item a, nav.top ul.navigation > li > a {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 1.05rem;
    padding: 14px 18px;
    border-radius: 6px 6px 0 0;
    border: 0;
  }
  nav.top .nav-item > a:focus, nav.top .nav-item > a:hover, nav.top .nav-item > a.open {
    border: 0;
  }
  nav.top .sub-nav {
    border-radius: 0 0 var(--radius) var(--radius);
    box-shadow: var(--card-shadow);
    padding: 8px 0;
  }
  nav.top .sub-nav ul a {
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    padding: 8px 20px;
    text-indent: 0;
  }
  nav.top .sub-nav ul a:before {
    content: none;
  }
  .top .mobile {
    height: 44px;
    line-height: 44px;
    border-radius: 100px;
    padding: 0 16px;
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.15);
  }

  /* Section tabs (Browse All / Browse by Tag / Search Items) */
  nav.secondary-nav, nav#secondary-nav {
    margin-bottom: 28px;
  }
  nav.secondary-nav li, nav#secondary-nav li {
    margin: 0 8px 8px 0;
  }
  nav.secondary-nav a, nav#secondary-nav a {
    display: inline-block;
    padding: 7px 16px;
    border-radius: 100px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.95rem;
    background-color: rgba(0, 0, 0, 0.06);
    text-decoration: none;
  }
  nav.secondary-nav a:hover, nav#secondary-nav a:hover, nav.secondary-nav a:focus, nav#secondary-nav a:focus {
    text-decoration: underline;
  }
  .autumn nav.secondary-nav .active a, .autumn nav.secondary-nav .current a,
  .autumn nav#secondary-nav .active a, .autumn nav#secondary-nav .current a {
    background-color: #86443C;
    color: #fff;
  }

  /* ---------- Cards ---------- */
  body #content > div, body #content section, body #content #primary > div, body #content #sidebar > div,
  body #primary, body #exhibit-pages:not(.full), body .login #content form, body .advanced-search #content form > div,
  body .show #primary > div, body .show #content #sidebar > div, body .items.show #primary > div {
    border: 1px solid var(--card-border);
    border-top-width: 1px;
    border-radius: var(--radius);
    box-shadow: var(--card-shadow);
    padding: 20px 24px;
    margin-bottom: 24px;
  }
  body #content > div > h2:first-child, body #content #primary > div > h2:first-child,
  body #content #sidebar > div > h2:first-child, body #content > h2:first-child,
  body #content #primary > h2:first-child, body #content #sidebar > h2:first-child {
    margin: 0 0 16px;
    padding: 0 0 10px;
    width: auto;
    border-width: 0 0 2px 0;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
  }
  .autumn #content h2 {
    border-color: #E6DECF;
  }
  body #content #primary {
    padding: 28px 32px;
  }
  body .exhibits.summary #content #primary > div,
  body .items.show #primary, body .files #primary, body #content #outputs,
  body #content #search-filters, body #content #item-filters, body #content div.hTagcloud,
  body .exhibits.show #content #exhibit-page-navigation, body #content #sort-links {
    border: 0;
    box-shadow: none;
    background-color: transparent;
    padding: 0;
  }
  body .exhibits.summary #content #primary > div {
    margin-bottom: 16px;
  }
  body #content .item-meta .item-img, #home #content div img, .items.show #itemfiles a, body .image {
    border-radius: 6px;
    overflow: hidden;
  }
  body #content .item-meta .item-img img, #content .item img {
    display: block;
  }
  #content .view-items-link {
    margin: 16px -24px 0 !important;
    padding: 16px 24px 0 !important;
    width: auto !important;
  }
  #home #content div#recent-items .item {
    margin: 0 -24px;
    padding: 16px 24px;
  }
  #home #content div .items-list {
    margin: 0 -24px;
  }
  #home #content div h3 {
    font-family: var(--font-condensed);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 1.25rem;
  }
  .item h2 a, .exhibit h2 a, .collection h2 a {
    text-decoration: none;
  }
  .item h2 a:hover, .exhibit h2 a:hover, .collection h2 a:hover {
    text-decoration: underline;
  }
  #content .element-set .element h3 {
    font-family: var(--font-secondary);
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 4px;
    opacity: 0.85;
  }
  #content #sort-links {
    margin: 0 0 24px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.95rem;
  }
  #content #sort-links a {
    text-decoration: none;
  }
  #content #sort-links a:hover, #content #sort-links a:focus {
    text-decoration: underline;
  }
  #content #search-filters li, #content #item-filters li, #content div.hTagcloud ul li, .item-pagination li {
    border: 1px solid var(--card-border);
    border-radius: 100px;
    box-shadow: none;
    padding: 6px 14px;
  }
  .item-pagination a {
    text-decoration: none;
  }
  .item-pagination a:hover, .item-pagination a:focus {
    text-decoration: underline;
  }
  #search-results {
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    box-shadow: var(--card-shadow);
    overflow: hidden;
  }
  #search-results th {
    font-family: var(--font-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: 0;
  }

  /* ---------- Buttons, forms, pagination ---------- */
  body .button, body button, body input[type=submit] {
    font-weight: 700;
    letter-spacing: 0.05em;
    border-radius: 100px;
    height: auto;
    padding: 10px 24px;
    transition: transform 0.15s, box-shadow 0.15s;
  }
  body .button:hover, body button:hover, body input[type=submit]:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  }
  body #search-form button, body .show-advanced.button, body .remove_search {
    padding: 0;
    transform: none;
  }
  body #search-form button:hover, body .show-advanced.button:hover {
    transform: none;
    box-shadow: none;
  }
  body .show-advanced.button {
    border-radius: 0;
  }
  input[type=text], input[type=password], textarea, select {
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 6px;
    font-family: var(--font-primary);
    font-size: 16px;
  }
  .pagination input[type=text] {
    border-radius: 6px;
    box-shadow: none;
    height: 36px;
    margin-bottom: 0;
  }
  .pagination li {
    vertical-align: middle;
  }
  .pagination form label {
    font-family: var(--font-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 700;
  }
  .pagination_previous a, .pagination_next a {
    border-radius: 100px;
    box-shadow: none;
  }
  body #content nav .pagination_list {
    border-radius: 100px;
    box-shadow: none;
    padding: 8px 16px;
  }

  /* ---------- Exhibits ---------- */
  .exhibits.show #content h1 {
    font-size: 2.5rem;
  }
  body #exhibit-pages:not(.full) {
    padding: 16px 20px;
  }
  #exhibit-pages h4 {
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 8px;
  }
  .exhibits #exhibit-pages:not(.full) > ul > li:not(:last-of-type) {
    border-bottom-color: rgba(0, 0, 0, 0.07);
  }
  .exhibits #exhibit-pages:not(.full) a {
    font-family: var(--font-secondary);
    text-decoration: none;
    padding: 2px 0;
  }
  .exhibits #exhibit-pages:not(.full) a:hover, .exhibits #exhibit-pages:not(.full) a:focus {
    text-decoration: underline;
  }
  body .exhibits.show #content #exhibit-page-navigation a, body .exhibits.show #content #exhibit-page-navigation span {
    border-radius: 100px;
    box-shadow: none;
    border: 1px solid var(--card-border);
    padding: 10px 16px;
    font-family: var(--font-secondary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-decoration: none;
  }
  .exhibits.show #content .exhibit-page-nav {
    border-radius: var(--radius);
    box-shadow: none;
    overflow: hidden;
  }
  .exhibit-block img, .exhibit-item img, .files .item-file img, .show .item-file img {
    border-radius: 6px;
  }
  .exhibit-item-caption, .exhibit-item-caption p {
    font-size: 0.9rem;
    opacity: 0.85;
  }

  /* ---------- Footer ---------- */
  footer[role=contentinfo] {
    margin-top: 0;
    padding-top: 32px;
    padding-bottom: 24px;
    border-top: 6px solid #CE6C3E;
    font-size: 0.95rem;
  }
  footer[role=contentinfo] p {
    padding-bottom: 8px;
    margin: 0;
  }
  footer[role=contentinfo] #custom-footer-text {
    margin-bottom: 16px;
  }

  /* ---------- Small screens ---------- */
  @media (max-width: 767px) {
    body #content > h1 {
      font-size: 2rem;
    }
    #site-title {
      font-size: 1.7rem;
      text-align: center;
    }
    body #content > div, body #content #primary > div, body #content #sidebar > div, body #primary {
      padding: 16px;
    }
    #content .view-items-link, #home #content div#recent-items .item, #home #content div .items-list {
      margin-left: -16px !important;
      margin-right: -16px !important;
      padding-left: 16px !important;
      padding-right: 16px !important;
    }
  }
}

@media screen {
  /* Record titles in lists: condensed but not shouting. */
  body #content .item > h2:first-child, body #content .exhibit > h2:first-child, body #content .collection > h2:first-child {
    font-size: 1.4rem;
    text-transform: none;
    letter-spacing: 0;
  }
}
