/* Museum Exchange — overlay styles for Copenhagen
   Uses ONLY built-in Copenhagen settings to avoid manifest schema issues.
*/

:root{
  --mx-radius: 14px;
  --mx-shadow: 0 14px 40px rgba(0,0,0,.06);
  --mx-max: 1120px;
}

/* Remove clicked link coloration */
a:visited {
  color: inherit;
}

/* Typography: tie into Copenhagen settings */
body{
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  /* font set in document_head */
}

h1,h2,h3,h4,h5,h6,
.page-header h1,
.article-title,
.section-header h1,
.category-header h1{
  /* font set in document_head */
  font-weight: 600;
  letter-spacing: .2px;
}

/* Layout width */
.container,
.container-divider .container,
.hero .container{
  max-width: var(--mx-max);
}

/* Sticky header (museum-grade) */
.header{
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid #E7E7E7;
}

.button, .btn, input[type="submit"], button[type="submit"]{
  border-radius: 12px !important;
}

/* Card vibe */
.category-card,
.section-card,
.article-list-item,
.article,
.article-container,
.community-post,
.search-results-column{
  border: 1px solid #E7E7E7;
  border-radius: var(--mx-radius);
  box-shadow: 0 10px 24px rgba(0,0,0,.04);
  background: #fff;
}

/* ─── Hero ──────────────────────────────────────────────────────────── */

/* Kill Copenhagen's background image on the homepage hero */
.mx-hero.hero,
.mx-hero.hero .hero-inner{
  background-image: none !important;
  background-color: #FCFDFD !important;
}

.mx-hero.hero{
  min-height: 0;
  padding: 48px 24px 24px !important;
  text-align: center;
}

.mx-hero-inner{
  max-width: 660px;
  margin: 0 auto;
}

.mx-hero-heading{
  /* font set in document_head */
  font-size: clamp(32px, 5vw, 52px);
  font-weight: 700;
  letter-spacing: -.5px;
  color: #2C3E50;
  margin: 0 0 28px;
  line-height: 1.1;
}

/* Override Copenhagen search styles for the hero */
.mx-hero .search,
.mx-search-wrap .search{
  width: 100%;
  border-radius: 100px;
  border: 1.5px solid #D8D8D4;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
  background: #fff;
  overflow: hidden;
}

.mx-hero .search input[type="search"],
.mx-hero .search input[type="text"]{
  height: 54px;
  font-size: 16px;
  border: none;
  background: transparent;
  width: 100%;
  outline: none;
}

/* ─── Role tiles ────────────────────────────────────────────────────── */

.mx-role-tiles{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 16px;
  margin-top: 22px;
}

.mx-tile{
  grid-column: span 4;
  border: 1px solid #E7E7E7;
  border-radius: var(--mx-radius);
  padding: 18px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.04);
}

.mx-tile h3{ margin: 0 0 8px; /* font set in document_head */ font-weight: 600; font-size: 20px; }
.mx-tile p{ margin: 0 0 12px; opacity: .82; }
.mx-tile a{ text-decoration: none; }

@media (max-width: 980px){
  .mx-tile{ grid-column: span 12; }
}

.mx-roles{ padding-top: 18px; padding-bottom: 18px; }
.mx-roles .container{ max-width: var(--mx-max); }

/* ─── Role section ──────────────────────────────────────────────────── */

.mx-role-section{
  background: #fff;
  border-bottom: 1px solid #E7E7E7;
  padding: 12px 24px;
}

.mx-role-buttons{
  max-width: var(--mx-max);
  margin: 0 auto;
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

.mx-role-btn{
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 16px 24px;
  text-align: center;
align-items: center;
  border-radius: var(--mx-radius);
  border: 2px solid;
  background: #fff;
  text-decoration: none;
  min-width: 220px;
  max-width: 320px;
  flex: 1;
  transition: background .15s, box-shadow .15s;
}
.mx-role-btn:hover{
  /* hover set in document_head */
  box-shadow: 0 4px 16px rgba(77,133,202,.2);
  color: #fff !important;
}
.mx-role-btn:hover .mx-role-btn-title{
  color: #fff !important;
}
.mx-role-btn:hover .mx-role-btn-desc{
  color: rgba(255,255,255,.8) !important;
}

.mx-role-btn-title{
  /* font set in document_head */
  font-size: 17px;
  font-weight: 700;
  /* color set in document_head */
}

.mx-role-btn-desc{
  font-size: 13px;
  color: #555;
  line-height: 1.4;
}

/* ─── Featured articles ─────────────────────────────────────────────── */

.mx-featured-section{
  padding-top: 40px;
  padding-bottom: 8px;
}

.mx-featured-heading{
  font-size: 22px;
  font-weight: 600;
  color: #2C3E50;
  margin: 0 0 20px;
  padding-bottom: 14px;
  border-bottom: 2px solid #E7E7E7;
}

.mx-featured-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.mx-featured-item{
  background: #FCFDFD;
  border: 1px solid #E7E7E7;
  border-radius: 10px;
  transition: box-shadow .15s, border-color .15s;
}
.mx-featured-item:hover{
  box-shadow: 0 4px 16px rgba(0,0,0,.07);
  border-color: #ccc;
}

.mx-featured-link{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 14px 18px;
  text-decoration: none !important;
}

.mx-featured-title{
  font-size: 14px;
  font-weight: 500;
  color: #2C3E50;
  line-height: 1.4;
}
.mx-featured-item:hover .mx-featured-title{
  text-decoration: underline;
}

@media (max-width: 840px){
  .mx-featured-list{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px){
  .mx-featured-list{ grid-template-columns: 1fr; }
}

/* ─── Browse by topic ───────────────────────────────────────────────── */

.mx-browse-section{
  padding-top: 48px;
  padding-bottom: 64px;
}

.mx-browse-heading{
  font-size: 22px;
  font-weight: 600;
  color: #2C3E50;
  margin: 0 0 28px;
  padding-bottom: 14px;
  border-bottom: 2px solid #E7E7E7;
}

.mx-browse-list{
  display: flex;
  flex-direction: column;
}

/* ── Category row ── */
.mx-browse-cat{
  padding: 28px 0;
  border-bottom: 1px solid #E7E7E7;
}
.mx-browse-cat:last-child{
  border-bottom: none;
}

.mx-browse-cat-header{
  margin-bottom: 20px;
}

.mx-browse-cat-title{
  display: inline-block;
  font-size: 18px;
  font-weight: 700;
  color: #2C3E50;
  text-decoration: none;
  letter-spacing: -.1px;
}
.mx-browse-cat-title:hover{
  text-decoration: underline;
}

/* ── Sections grid ── */
.mx-browse-sections{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px 32px;
}

.mx-browse-section-block{
  display: flex;
  flex-direction: column;
}

.mx-browse-section-title{
  display: block;
  font-size: 16px;
  font-weight: 600;
  ccolor: #8799AD;
  text-decoration: none;
  margin-bottom: 8px;
}
.mx-browse-section-title:hover{
  text-decoration: underline;
}

/* ── Article links ── */
.mx-browse-article-list{
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-height: 60px;
}

.mx-browse-article-list a{
  font-size: 14px;
  color: #8799AD;
  text-decoration: none;
  line-height: 1.4;
}
.mx-browse-article-list a:hover{
  text-decoration: underline;
}

/* Skeleton loader */
.mx-articles-loading .mx-skeleton{
  height: 14px;
  background: linear-gradient(90deg, #eee 25%, #f5f5f5 50%, #eee 75%);
  background-size: 200% 100%;
  animation: mx-shimmer 1.2s infinite;
  border-radius: 4px;
  margin-bottom: 2px;
}
.mx-articles-loading .mx-skeleton:nth-child(2){ width: 80%; }
.mx-articles-loading .mx-skeleton:nth-child(3){ width: 60%; }

@keyframes mx-shimmer{
  0%{ background-position: 200% 0; }
  100%{ background-position: -200% 0; }
}

@media (max-width: 840px){
  .mx-browse-sections{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px){
  .mx-browse-sections{ grid-template-columns: 1fr; }
}

/* ─── Section page ──────────────────────────────────────────────────── */

.mx-section-hero{
  background: #FCFDFD;
  border-bottom: 1px solid #E7E7E7;
  padding: 32px 0 28px;
}

.mx-section-header{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-top: 16px;
}

.mx-section-title{
  font-size: 32px;
  font-weight: 700;
  color: #2C3E50;
  margin: 0 0 8px;
  letter-spacing: -.3px;
}

.mx-section-description{
  font-size: 16px;
  color: #8799AD;
  margin: 0;
  line-height: 1.6;
  max-width: 680px;
}

.mx-section-follow{
  flex-shrink: 0;
  padding-top: 6px;
}

.mx-section-body{
  padding: 36px 0 64px;
  max-width: 800px;
}

/* Sub-sections */
.mx-subsection-grid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 36px;
}

.mx-subsection-card{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border: 1px solid #E7E7E7;
  border-radius: var(--mx-radius);
  background: #fff;
  text-decoration: none;
  color: #2C3E50;
  font-weight: 500;
  font-size: 15px;
  transition: box-shadow .15s, border-color .15s;
}
.mx-subsection-card:hover{
  box-shadow: 0 4px 16px rgba(0,0,0,.07);
  border-color: #ccc;
  text-decoration: none;
}

/* Article list */
.mx-article-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.mx-article-item{
  border-bottom: none;
}
.mx-article-item:first-child{
  border-top: none;
}

.mx-article-link{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 20px 8px;
  text-decoration: none;
  color: #2C3E50;
  transition: color .12s;
}
.mx-article-link:hover{
  text-decoration: none;
}

.mx-article-title{
  flex: 1;
  font-size: 16px;
  line-height: 1.4;
}

.mx-article-chevron{
  color: #aaa;
  flex-shrink: 0;
  transition: transform .15s;
}
.mx-article-link:hover .mx-article-chevron{
  transform: translateX(3px);
}

.mx-section-empty{
  color: #888;
  font-size: 15px;
  padding: 24px 0;
}

@media (max-width: 600px){
  .mx-subsection-grid{ grid-template-columns: 1fr; }
  .mx-section-title{ font-size: 26px; }
}

/* ─── Suppress Follow button globally ──────────────────────────────── */
.section-subscribe,
.article-subscribe,
.mx-section-follow,
.community-follow{
  display: none !important;
}

/* ─── Category page ─────────────────────────────────────────────────── */

.mx-category-body{
  max-width: 100%;
  padding-top: 32px;
}

.mx-cat-section{
  padding: 20px 0;
  border-bottom: 1px solid #E7E7E7;
}
.mx-cat-section:last-child{
  border-bottom: none;
}

.mx-cat-section-header{
  margin-bottom: 10px;
}

.mx-cat-section-title{
  font-size: 18px;
  font-weight: 700;
  color: #2C3E50 !important;
  text-decoration: none;
  letter-spacing: -.1px;
}
.mx-cat-section-title:hover{
  text-decoration: underline;
}
.mx-cat-section-title:visited{
  color: #2C3E50 !important;
}

/* Override on category page — show articles in 2-col grid */
.mx-category-body .mx-article-list{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
}

.mx-category-body .mx-article-item{
  border-bottom: none;
  border-top: none;
  border-left: none;
  border-right: none;
}

@media (max-width: 640px){
  .mx-category-body .mx-article-list{ grid-template-columns: 1fr; }
}

/* ─── Article page ──────────────────────────────────────────────────── */

/* Remove the box/card styling from article container */
.article-container{
  border: none;
  box-shadow: none;
  background: transparent;
  padding: 36px 0;
  gap: 40px;
}

/* Sidebar */
.article-sidebar{
  border: none;
  background: transparent;
  padding: 0;
}

.sidenav-title{
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: #8799AD;
  margin-bottom: 12px;
}

.sidenav-item{
  font-size: 14px;
  color: #8799AD;
  text-decoration: none;
  display: block;
  padding: 5px 0;
  border-left: 2px solid transparent;
  padding-left: 10px;
  line-height: 1.4;
}
.sidenav-item:hover{
  color: #4D85CA;
  text-decoration: none;
}
.sidenav-item.current-article{
  border-left-color: #4D85CA;
  color: #2C3A47;
  font-weight: 500;
}

/* Article body */
.article{
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}

.article-title{
  font-size: 32px;
  font-weight: 700;
  color: #2C3A47;
  margin-bottom: 16px;
  letter-spacing: -.3px;
}

.article-author{
  padding-bottom: 20px;
  border-bottom: 1px solid #E7E7E7;
  margin-bottom: 28px;
  display: none !important;
}

.article-body{
  font-size: 16px;
  line-height: 1.7;
  color: #2C3A47;
}

.article-body h2,
.article-body h3,
.article-body h4{
  color: #2C3A47;
  margin-top: 28px;
}

.article-body a{
  color: #4D85CA;
}
.article-body a:visited{
  color: #4D85CA;
}

/* Breadcrumbs */
.sub-nav{
  padding: 20px 0 0;
  border: none;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.article-footer,
.article-votes,
.article-share,
.article-comments,
.article-more-questions{
  display: none !important;
}

.article-relatives h2,
.article-related-articles h2,
.article-recently-viewed h2{
  color: #2C3A47 !important;
}

.article-relatives a,
.article-relatives a:visited,
.article-relatives a:link{
  color: #2C3A47 !important;
}
.article-relatives a:hover{
  color: #4D85CA !important;
}
/* ─── Breadcrumbs ───────────────────────────────────────────────────── */
.breadcrumbs{
  font-size: 13px;
  margin-bottom: 12px;
}

.breadcrumbs li{
  color: #8799AD;
}

.breadcrumbs li a,
.breadcrumbs li a:visited,
.breadcrumbs li a:link{
  color: #8799AD;
  text-decoration: none;
}

.breadcrumbs li a:hover{
  color: #4D85CA;
  text-decoration: none;

  
}

/* Replace the > separator with a cleaner / */
.breadcrumbs li + li::before{
  content: "/";
  color: #C5CDD6;
  margin: 0 6px;
}
.breadcrumbs li:last-child{
  color: #2C3A47;
  font-weight: 500;
  pointer-events: none;
}

.breadcrumbs li:last-child a{
  color: #2C3A47 !important;
  pointer-events: none;
}

.mx-cat-section-title{
  cursor: default;
  pointer-events: none;
}
.icon-star{
  display: none !important;
}

.logo span[aria-hidden="true"]{
  display: none;
}
/* ─── Search results ────────────────────────────────────────────────── */

.search-results{
  display: flex;
  gap: 48px;
  padding: 36px 0 64px;
  align-items: flex-start;
}

/* Sidebar */
.search-results-sidebar{
  min-width: 180px;
  width: 180px;
  flex-shrink: 0;
}

.search-results-sidebar .sidenav-item{
  display: flex;
  justify-content: space-between;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 14px;
  color: #2C3A47;
  text-decoration: none;
  border-left: none;
}
.search-results-sidebar .sidenav-item:hover{
  background: #F0F4F8;
  color: #4D85CA;
}
.search-results-sidebar .sidenav-item.current{
  background: #EBF2FA;
  color: #4D85CA;
  font-weight: 600;
}

.doc-count{
  color: #8799AD;
  font-size: 13px;
}

/* Main results column */
.search-results-column{
  flex: 1;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}

/* Hide empty AI box */
.search-results-column > div:not([class]):empty,
.search-results-column > div[class=""]{
  display: none;
}

/* Result count heading */
.search-results-column h1{
  font-size: 20px;
  font-weight: 600;
  color: #2C3A47;
  margin: 0 0 0;
  padding-bottom: 0;
  border-bottom: none;
}

/* Result list */
.search-results-list{
  list-style: none;
  margin: 0;
  padding: 0;
}

.search-results-list > li{
  padding: 20px 0;
  border-top: none !important;
  border-bottom: 1px solid #E7E7E7 !important;
}
.search-results-list > li:first-child{
  border-top: 1px solid #E7E7E7 !important;
  margin-top: 20px;
}

/* Result title */
.search-result-title{
  font-size: 16px;
  font-weight: 600;
  margin: 0;
}
.search-result-title a,
.search-result-title a:visited,
.search-result-title a:link{
  color: #4D85CA !important;
  text-decoration: none;
}
.search-result-title a:hover{
  text-decoration: underline;
}

/* Breadcrumbs inside results */
.search-result-breadcrumbs{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  list-style: none;
  padding: 5px 0 6px;
  margin: 0;
  gap: 0;
}
.search-result-breadcrumbs li{
  display: flex;
  align-items: center;
  font-size: 12px;
  color: #8799AD;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.search-result-breadcrumbs li + li::before{
  content: "/";
  margin: 0 5px;
  color: #C5CDD6;
}
.search-result-breadcrumbs a,
.search-result-breadcrumbs a:visited{
  color: #8799AD !important;
  text-decoration: none;
}
.search-result-breadcrumbs a:hover{
  color: #4D85CA !important;
}

/* Snippet */
.search-result-description{
  font-size: 14px;
  color: #8799AD;
  line-height: 1.6;
  margin: 4px 0 0;
}

/* Hide clutter */
.meta-data,
.search-result-icons{
  display: none !important;
}