/* Public designer structure consumes the active theme variables set by _PublicLayout. */
.designer-preview, .cms-page { color: var(--cms-text); }
.designer-section { margin-block: var(--cms-section-spacing); }
.designer-section:first-child { margin-top: 0; }
.designer-section:last-child { margin-bottom: 0; }
.designer-row { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(.75rem, 2vw, 1.5rem); }
.designer-column { min-width: 0; }
.col-12 { grid-column: span 12; }
.col-9 { grid-column: span 9; }
.col-8 { grid-column: span 8; }
.col-6 { grid-column: span 6; }
.col-4 { grid-column: span 4; }
.col-3 { grid-column: span 3; }
.designer-column img { height: auto; max-width: 100%; }
.designer-column > :first-child { margin-top: 0; }
.designer-column > :last-child { margin-bottom: 0; }
.designer-spacer.small { height: 1rem; }
.designer-spacer.medium { height: 2rem; }
.designer-spacer.large { height: 4rem; }

/* Shared public content metadata: compact, accessible and theme-aware. */
.content-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45rem;
  margin-block: 0 1rem;
  font-size: .78rem;
  line-height: 1.25;
}
.content-meta__item {
  display: inline-flex;
  align-items: center;
  gap: .32rem;
  min-height: 1.85rem;
  padding: .32rem .62rem;
  border: 1px solid color-mix(in srgb, var(--meta-color) 28%, var(--cms-border));
  border-radius: 999px;
  background: color-mix(in srgb, var(--meta-color) 10%, var(--cms-surface));
  color: color-mix(in srgb, var(--meta-color) 82%, var(--cms-text));
  font-weight: 750;
  text-decoration: none;
  white-space: nowrap;
}
a.content-meta__item { transition: transform .16s ease, background-color .16s ease, border-color .16s ease; }
a.content-meta__item:hover { transform: translateY(-1px); border-color: var(--meta-color); background: color-mix(in srgb, var(--meta-color) 17%, var(--cms-surface)); }
.content-meta__item--type { --meta-color: #5b5bd6; }
.content-meta__item--category { --meta-color: #087f5b; }
.content-meta__item--date { --meta-color: #52606d; }
.content-meta__item--views { --meta-color: #b45309; }
.content-meta__item--tag { --meta-color: #a21caf; }
.content-meta__item--access { --meta-color: #9a3412; }
.content-meta--on-dark .content-meta__item {
  color: #fff;
  border-color: rgb(255 255 255 / .34);
  background: rgb(0 0 0 / .36);
  backdrop-filter: blur(5px);
}
.content-meta--on-dark a.content-meta__item:hover { background: rgb(0 0 0 / .58); border-color: #fff; }
.portal-card .content-meta { margin-bottom: .25rem; }
.portal-card .content-meta__item { font-size: .7rem; min-height: 1.65rem; padding: .24rem .5rem; }
.home-overlay-card .content-meta { margin-bottom: .35rem; }

.tag-cloud { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: .8rem; }
.tag-cloud__item { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.1rem; border: 1px solid color-mix(in srgb, #a21caf 30%, var(--cms-border)); border-radius: var(--cms-radius); background: color-mix(in srgb, #a21caf 7%, var(--cms-surface)); color: var(--cms-text); font-weight: 750; text-decoration: none; transition: transform .16s ease, border-color .16s ease; }
.tag-cloud__item:hover { transform: translateY(-2px); border-color: #a21caf; }
.tag-cloud__item strong { display: grid; place-items: center; min-width: 2rem; height: 2rem; border-radius: 999px; background: #a21caf; color: #fff; font-size: .78rem; }
.post-card__media { display: block; margin: -1.25rem -1.25rem 1rem; overflow: hidden; border-radius: var(--cms-radius) var(--cms-radius) 0 0; }
.post-card__media img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.article-teaser { color: var(--cms-muted-text); font-size: clamp(1.05rem, 2.5vw, 1.2rem); line-height: 1.75; }
.post-access-panel { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1rem; margin-block: 2rem; padding: clamp(1.25rem, 4vw, 2rem); border: 1px solid color-mix(in srgb, var(--cms-primary) 36%, var(--cms-border)); border-radius: var(--cms-radius); background: color-mix(in srgb, var(--cms-primary) 7%, var(--cms-surface)); }
.post-access-panel__icon { font-size: 1.6rem; }
.post-access-panel h2, .post-share h2 { margin-top: 0; }
.post-access-panel__actions, .post-share__actions { display: flex; flex-wrap: wrap; gap: .65rem; }
.access-action, .post-share a, .post-share button { display: inline-flex; align-items: center; border: 1px solid var(--cms-primary); border-radius: var(--cms-radius); background: transparent; color: var(--cms-primary); cursor: pointer; font: inherit; font-weight: 700; padding: .6rem .85rem; text-decoration: none; }
.access-action--primary { background: var(--cms-primary); color: var(--cms-primary-text); }
.access-action--disabled { cursor: not-allowed; opacity: .62; }
.post-share { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--cms-border); }
.post-share__status { min-height: 1.5em; color: var(--cms-muted-text); }
.customer-auth-card { max-width: 38rem; margin-inline: auto; padding: clamp(1.25rem, 4vw, 2rem); border: 1px solid var(--cms-border); border-radius: var(--cms-radius); background: var(--cms-surface); }
.customer-auth-card > h1 { margin-top: 0; }
.customer-auth-form { margin-block: 1.25rem; }
.customer-auth-check { display: flex !important; grid-template-columns: auto 1fr; align-items: center; }
.customer-auth-check input { width: auto; }
.customer-auth-links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .75rem; }
.customer-account-details { display: grid; grid-template-columns: minmax(7rem, auto) 1fr; gap: .65rem 1rem; margin-block: 1.5rem; }
.customer-account-details dt { color: var(--cms-muted-text); font-weight: 700; }
.customer-account-details dd { margin: 0; overflow-wrap: anywhere; }
.customer-navigation { align-items: center; display: flex; flex-wrap: wrap; gap: .75rem; }
.customer-logout-form { display: inline; margin: 0; }
.customer-navigation__button { background: transparent; border: 0; color: var(--cms-text); cursor: pointer; font: inherit; padding: 0; text-decoration: underline; text-decoration-thickness: .08em; text-underline-offset: .2em; }
@media (max-width: 700px) {
  .designer-row { display: block; }
  .designer-column { margin-bottom: 1rem; }
}