/* Aniyab UI — CMS content pages (Terms and conditions, ...)
 * From Figma: Terms and conditions - desktop / Terms and conditions - mobile
 */

.ay-cms-page {
  --ay-cms-collapsed-height: 1800px;
  position: relative;
  overflow: hidden;
  background: var(--ay-bg-lighter, #FEFEFE);
  font-family: var(--ay-font-family, dana, DanaFaNum, IRANSansfanum, Tahoma, sans-serif);
  color: var(--ay-text-main, #404040);
  padding-block: 32px 64px;
}

.ay-cms-page [hidden] {
  display: none !important;
}

.ay-cms-page :is(h1, h2, h3, h4, h5, h6) {
  font-family: inherit;
  letter-spacing: normal;
}

.ay-cms-page__decor {
  position: absolute;
  top: -84px;
  inset-inline-end: -101px;
  z-index: 0;
  width: 533px;
  height: auto;
  pointer-events: none;
  user-select: none;
}

.ay-cms-page__inner {
  position: relative;
  z-index: 1;
  width: min(1222px, calc(100% - 32px));
  margin-inline: auto;
}

.ay-cms-page__breadcrumb {
  margin-bottom: 24px;
  overflow: hidden;
}

/* ── Page head ── */
.ay-cms-page__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 32px;
}

.ay-cms-page__title-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.ay-cms-page__back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  flex: none;
  color: var(--ay-text-main, #404040);
  border-radius: 8px;
  text-decoration: none;
}

.ay-cms-page__back:hover,
.ay-cms-page__back:focus-visible {
  color: var(--ay-brand-primary-light, #0545A6);
}

.ay-cms-page__back:focus-visible {
  outline: 2px solid var(--ay-brand-primary-light, #0545A6);
  outline-offset: 2px;
}

.ay-cms-page__back svg {
  width: 24px;
  height: 24px;
  display: block;
}

[dir="ltr"] .ay-cms-page__back svg {
  transform: scaleX(-1);
}

.ay-cms-page__title {
  margin: 0;
  font-weight: var(--ay-type-display-md-weight, 500);
  font-size: var(--ay-type-display-md-size, 24px);
  line-height: var(--ay-type-display-md-line, 40px);
  color: var(--ay-text-title, #302E2E);
}

.ay-cms-page__sub {
  margin: 0;
  font-weight: 500;
  font-size: var(--ay-type-text-xl-size, 16px);
  line-height: var(--ay-type-text-xl-line, 28px);
  color: var(--ay-text-secondary, #737373);
}

/* ── Layout: content + table of contents ── */
.ay-cms-page__layout {
  display: grid;
  grid-template-columns: minmax(0, 738px) 404px;
  justify-content: space-between;
  align-items: start;
  gap: 80px;
}

.ay-cms-page__content {
  min-width: 0;
}

.ay-cms-page__media {
  margin: 0 0 24px;
  border-radius: 12px;
  overflow: hidden;
  background: var(--ay-bg-dark, #F4F4F5);
}

.ay-cms-page__media img {
  display: block;
  width: 100%;
  height: auto;
}

/* ── Body (CMS HTML) ── */
.ay-cms-page__body {
  font-weight: var(--ay-type-text-lg-weight, 500);
  font-size: var(--ay-type-text-lg-size, 14px);
  line-height: var(--ay-type-text-lg-line, 28px);
  color: var(--ay-text-title, #302E2E);
  text-align: justify;
  overflow-wrap: anywhere;
}

.ay-cms-page__body > :first-child {
  margin-top: 0;
}

.ay-cms-page__body > :last-child {
  margin-bottom: 0;
}

.ay-cms-page__body p,
.ay-cms-page__body ul,
.ay-cms-page__body ol {
  margin: 0 0 16px;
}

.ay-cms-page__body p,
.ay-cms-page__body li,
.ay-cms-page__body span,
.ay-cms-page__body td,
.ay-cms-page__body th {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

.ay-cms-page__body ul,
.ay-cms-page__body ol {
  padding-inline-start: 20px;
}

.ay-cms-page__body li {
  margin-bottom: 4px;
}

/* The CMS editor wraps whole paragraphs in <strong>; body copy is regular weight in the design. */
.ay-cms-page__body p strong,
.ay-cms-page__body p b,
.ay-cms-page__body li strong,
.ay-cms-page__body li b,
.ay-cms-page__body div > strong {
  font-weight: inherit;
}

.ay-cms-page__body h1,
.ay-cms-page__body h2,
.ay-cms-page__body h3,
.ay-cms-page__body h4,
.ay-cms-page__body h5,
.ay-cms-page__body h6 {
  margin: 32px 0 16px;
  font-family: inherit;
  font-weight: 700;
  letter-spacing: normal;
  color: var(--ay-text-title, #302E2E);
  text-align: start !important;
  scroll-margin-top: 120px;
}

.ay-cms-page__body h1,
.ay-cms-page__body h2 {
  font-size: var(--ay-type-text-xl-size, 16px);
  line-height: var(--ay-type-text-xl-line, 28px);
}

.ay-cms-page__body h3,
.ay-cms-page__body h4,
.ay-cms-page__body h5,
.ay-cms-page__body h6 {
  margin: 24px 0 8px;
  font-size: var(--ay-type-text-lg-size, 14px);
  line-height: var(--ay-type-text-lg-line, 28px);
}

.ay-cms-page__body a {
  color: var(--ay-brand-primary-light, #0545A6);
}

.ay-cms-page__body img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}

.ay-cms-page__body table {
  width: 100%;
  margin: 0 0 16px;
  border-collapse: collapse;
}

.ay-cms-page__body th,
.ay-cms-page__body td {
  padding: 8px 12px;
  border: 1px solid var(--ay-border-light, #E7E5E4);
}

.ay-cms-page__summary {
  box-sizing: border-box;
  margin: 0 0 24px;
  padding: 16px;
  background: var(--ay-brand-primary-paler, #EBF1FB);
  border-inline-start: 4px solid var(--ay-brand-primary-lighter, #3974CD);
}

.ay-cms-page__summary > :last-child {
  margin-bottom: 0;
}

/* ── "See more" collapse ── */
.ay-cms-page__collapse {
  position: relative;
}

.ay-cms-page__collapse.is-collapsed .ay-cms-page__body {
  max-height: var(--ay-cms-collapsed-height);
  overflow: hidden;
}

.ay-cms-page__more {
  position: relative;
  display: flex;
  justify-content: center;
  padding-top: 16px;
}

.ay-cms-page__collapse.is-collapsed .ay-cms-page__more {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  padding-top: 106px;
  background: linear-gradient(0deg, var(--ay-bg-lighter, #FEFEFE) 38%, rgba(254, 254, 254, 0.8) 70.5%, rgba(254, 254, 254, 0) 100%);
}

.ay-cms-page__more .ay-btn {
  color: var(--ay-brand-primary, #002D71);
}

.ay-cms-page__more .ay-btn__icon svg {
  width: 24px;
  height: 24px;
  display: block;
}

/* ── Table of contents ── */
.ay-cms-toc {
  position: sticky;
  top: 112px;
  min-width: 0;
}

.ay-cms-toc__card {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: calc(100vh - 136px);
  overflow-y: auto;
  padding: 16px;
  background: var(--ay-bg-white, #FFFFFF);
  border: 1px solid var(--ay-border-light, #E7E5E4);
  border-radius: 12px;
}

.ay-cms-toc__title {
  margin: 0;
  font-weight: var(--ay-type-display-sm-weight, 600);
  font-size: var(--ay-type-display-sm-size, 20px);
  line-height: var(--ay-type-display-sm-line, 36px);
  color: var(--ay-text-main, #404040);
}

.ay-cms-toc__list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding-inline-start: 24px;
  list-style: disc;
  color: var(--ay-brand-primary-light, #0545A6);
}

.ay-cms-toc__link {
  display: inline-block;
  font-weight: 500;
  font-size: var(--ay-type-text-xl-size, 16px);
  line-height: var(--ay-type-text-xl-line, 28px);
  color: var(--ay-brand-primary-light, #0545A6);
  text-decoration: none;
  transition: color 0.15s ease;
}

.ay-cms-toc__link:hover,
.ay-cms-toc__link.is-active {
  color: var(--ay-brand-primary, #002D71);
}

.ay-cms-toc__link.is-active {
  font-weight: 700;
}

.ay-cms-toc__link:focus-visible {
  outline: 2px solid var(--ay-brand-primary-light, #0545A6);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ── Comments ── */
.ay-cms-comments {
  margin-inline: 0 auto;
  margin-top: 32px;
}

.ay-cms-comments__form-wrap {
  padding-bottom: 32px;
  border-bottom: 1px solid var(--ay-border-light, #E7E5E4);
}

.ay-cms-comments__form-wrap .ay-field__label {
  color: var(--ay-text-title, #302E2E);
}

.ay-cms-comments__form-wrap .ay-field__hint {
  color: var(--ay-text-secondary, #737373);
}

.ay-cms-comments__list > .ay-blog-comment + .ay-blog-comment {
  padding-top: 32px;
  border-top: 1px solid var(--ay-border-light, #E7E5E4);
}

/* ── Tablet ── */
@media (max-width: 991.98px) {
  .ay-cms-page__decor {
    display: none;
  }

  .ay-cms-page__layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }

  .ay-cms-toc {
    position: static;
    order: -1;
  }

  .ay-cms-toc__card {
    max-height: none;
    overflow: visible;
  }

  .ay-cms-comments {
    max-width: none;
  }
}

/* ── Mobile ── */
@media (max-width: 767.98px) {
  .ay-cms-page {
    --ay-cms-collapsed-height: 2400px;
    padding-block: 16px 48px;
  }

  .ay-cms-page__inner {
    width: min(1222px, calc(100% - 32px));
  }

  .ay-cms-page__breadcrumb {
    margin-bottom: 16px;
  }

  .ay-cms-page__head {
    gap: 4px;
    margin-bottom: 24px;
  }

  .ay-cms-page__title {
    font-weight: 700;
    font-size: var(--ay-type-text-xl-size, 16px);
    line-height: var(--ay-type-text-xl-line, 28px);
  }

  .ay-cms-page__sub {
    font-size: var(--ay-type-text-md-size, 12px);
    line-height: var(--ay-type-text-md-line, 24px);
  }

  .ay-cms-toc__title {
    font-weight: 700;
    font-size: var(--ay-type-text-xl-size, 16px);
    line-height: var(--ay-type-text-xl-line, 28px);
  }

  .ay-cms-toc__link {
    font-size: var(--ay-type-text-lg-size, 14px);
    line-height: 32px;
  }

  .ay-cms-comments {
    margin-top: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ay-cms-toc__link {
    transition: none;
  }
}
