/* Block content area: used by both default page template (page.php) and single post template (single.php) */
#wp-content-wrapper {
  /* Twenty Twenty-Five–style content area – matches block editor view */
  background-color: #ffffff;
  padding: clamp(30px, 5vw, 50px) 0;
  min-height: 50vh;

  .page-content {
    /* TT5 / block editor layout variables (theme.json parity) */
    --wp--style--global--content-size: 645px;
    --wp--style--global--wide-size: 1340px;
    --wp--style--block-gap: 1.2rem;
    --wp--preset--spacing--50: clamp(30px, 5vw, 50px);
    --wp--preset--spacing--40: 30px;
    --wp--preset--spacing--30: 20px;
    --tt5-content: 645px;
    --tt5-wide: 1340px;
    --tt5-block-gap: 1.2rem;
    --tt5-spacing: var(--wp--preset--spacing--50);
    margin: 0 auto;
    padding: 0 var(--wp--preset--spacing--50);
    box-sizing: border-box;

    /* Constrained layout: match block editor – direct children get content width and block gap */
    & > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
      max-width: var(--wp--style--global--content-size);
      margin-left: auto !important;
      margin-right: auto !important;
    }
    & > .alignwide {
      max-width: var(--wp--style--global--wide-size);
      margin-left: auto;
      margin-right: auto;
    }
    & > .alignfull {
      max-width: none;
      width: 100vw;
      margin-left: calc(-50vw + 50%);
      margin-right: calc(-50vw + 50%);
    }
    & > .alignleft {
      float: left;
      margin-inline-start: 0;
      margin-inline-end: 2em;
    }
    & > .alignright {
      float: right;
      margin-inline-start: 2em;
      margin-inline-end: 0;
    }
    & > .aligncenter {
      margin-left: auto !important;
      margin-right: auto !important;
    }
    & > :first-child {
      margin-block-start: 0;
    }
    & > :last-child {
      margin-block-end: 0;
    }
    & > * {
      margin-block-end: var(--wp--style--block-gap);
    }

    /* Nested constrained layout (e.g. root Group block) – same rules as core layout.php */
    & .wp-block-group.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
    & .wp-block-group.wp-block-group-is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
      max-width: var(--wp--style--global--content-size);
      margin-left: auto !important;
      margin-right: auto !important;
    }
    & .wp-block-group.is-layout-constrained > .alignwide,
    & .wp-block-group.wp-block-group-is-layout-constrained > .alignwide {
      max-width: var(--wp--style--global--wide-size);
    }
    & .wp-block-group.is-layout-constrained > :first-child,
    & .wp-block-group.wp-block-group-is-layout-constrained > :first-child {
      margin-block-start: 0;
    }
    & .wp-block-group.is-layout-constrained > :last-child,
    & .wp-block-group.wp-block-group-is-layout-constrained > :last-child {
      margin-block-end: 0;
    }
    & .wp-block-group.is-layout-constrained > *,
    & .wp-block-group.wp-block-group-is-layout-constrained > * {
      margin-block-end: var(--wp--style--block-gap);
    }
    /* TT5 typography */
    font-family:
      Manrope,
      system-ui,
      -apple-system,
      sans-serif;
    font-size: clamp(1.125rem, 2.5vw, 1.375rem);
    font-weight: 300;
    line-height: 1.4;
    letter-spacing: -0.1px;
    color: #111111;

    /* Bold: ensure strong/b are visible (parent has font-weight: 300) */
    & strong,
    & b {
      font-weight: 700;
    }

    /* Reduce widows/orphans (TT5) */
    & h1,
    & h2,
    & h3,
    & h4,
    & h5,
    & h6,
    & blockquote,
    & caption,
    & figcaption,
    & p {
      text-wrap: pretty;
      line-height: 1.5;
    }

    /* Links – enforce underline (reset.css sets text-decoration: none) */
    & a {
      margin: 0 2px;
    }
    & a:hover {
      text-decoration: underline;
      text-decoration-thickness: 1px;
      text-underline-offset: 0.1em;
    }

    /* Base typography (fallback when blocks don’t set their own) – TT5 scale */
    & h1:not(.wp-block-heading),
    & h2:not(.wp-block-heading),
    & h3:not(.wp-block-heading),
    & h4:not(.wp-block-heading),
    & h5:not(.wp-block-heading),
    & h6:not(.wp-block-heading) {
      margin: 1em 0 0.5em;
      font-weight: 400;
      color: #111111;
      line-height: 1.125;
      letter-spacing: -0.1px;
    }

    & h1:not(.wp-block-heading) {
      font-size: clamp(2.15rem, 4vw, 3rem);
    }

    & h2:not(.wp-block-heading) {
      font-size: clamp(1.75rem, 3vw, 2rem);
    }

    & h3:not(.wp-block-heading) {
      font-size: clamp(1.375rem, 2.5vw, 1.5rem);
    }

    & h4:not(.wp-block-heading) {
      font-size: 1rem;
    }

    & h5:not(.wp-block-heading) {
      font-size: 0.875rem;
      letter-spacing: 0.5px;
    }

    & h6:not(.wp-block-heading) {
      font-size: 0.875rem;
      font-weight: 700;
      letter-spacing: 1.4px;
      text-transform: uppercase;
    }

    &
      p:not([class*="has-text-align"]):not(.has-small-font-size):not(
        .has-medium-font-size
      ):not(.has-large-font-size) {
      font-size: inherit;
      line-height: 1.75;
      margin: 0;
    }

    & ul,
    & ol {
      margin: var(--tt5-block-gap) 0;
      padding-left: 1.5em;
    }

    & li {
      margin-top: 0.5rem;
      font-size: inherit;
      line-height: 1.4;
    }

    & blockquote {
      border: 0 solid currentColor;
      border-left-width: 2px;
      margin: var(--tt5-block-gap) 0;
      padding: clamp(30px, 5vw, 50px) clamp(30px, 5vw, 50px);
      font-size: clamp(1.125rem, 2vw, 1.375rem);
      font-weight: 300;
      color: #111111;
    }
    & blockquote cite {
      font-size: 0.875rem;
      font-style: normal;
      font-weight: 300;
    }

    & img {
      max-width: 100%;
      height: auto;
      border-radius: 6px;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

    & figure figcaption {
      font-size: 0.875rem;
      line-height: 1.4;
      color: #686868;
    }

    & table {
      width: 100%;
      border-collapse: collapse;
      margin: var(--tt5-block-gap) 0;
    }

    & th,
    & td {
      padding: 0.5em 1em;
      text-align: left;
      border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }

    & th {
      font-weight: 600;
      color: #111111;
    }

    & iframe {
      margin: 0 auto;
    }

    /* Block editor (Gutenberg) – match editor layout on front-end */
    & .wp-block-spacer {
      display: block;
      margin: 0;
      padding: 0;
    }

    & .has-text-align-left {
      text-align: left;
    }
    & .has-text-align-center {
      text-align: center;
    }
    & .has-text-align-right {
      text-align: right;
    }

    & .has-small-font-size {
      font-size: 0.875rem;
    }
    & .has-medium-font-size {
      font-size: 1rem;
    }
    & .has-large-font-size {
      font-size: clamp(1.125rem, 2vw, 1.375rem);
    }

    & .wp-block-heading {
      margin: 1em 0 0.5em;
      font-weight: 400;
      line-height: 1.125;
      letter-spacing: -0.1px;
    }
    & .wp-block-heading:first-child {
      margin-top: 0;
    }

    & .wp-block-image {
      margin: 1em 0;
    }
    & .wp-block-image.aligncenter {
      text-align: center;
      margin-left: auto;
      margin-right: auto;
    }
    & .wp-block-image.aligncenter img {
      margin-left: auto;
      margin-right: auto;
    }
    & .wp-block-image img {
      max-width: 100%;
      height: auto;
      vertical-align: middle;
    }
    & .wp-block-image.is-resized img {
      width: auto;
    }

    & .wp-block-group.alignfull {
      width: 100vw;
      max-width: 100vw;
      margin-left: calc(-50vw + 50%);
      margin-right: calc(-50vw + 50%);
      box-sizing: border-box;
    }

    /* Columns block – horizontal grid (match block editor / core block-library) */
    & .wp-block-columns {
      box-sizing: border-box;
      display: flex;
      flex-wrap: wrap;
      gap: var(--wp--style--block-gap);
      margin: 1.5em 0;
      align-items: normal;
    }
    @media (min-width: 782px) {
      & .wp-block-columns {
        flex-wrap: nowrap;
      }
    }
    & .wp-block-columns.alignwide {
      max-width: var(--wp--style--global--wide-size);
      margin-left: auto;
      margin-right: auto;
    }
    & .wp-block-columns.are-vertically-aligned-top {
      align-items: flex-start;
    }
    & .wp-block-columns.are-vertically-aligned-center {
      align-items: center;
    }
    & .wp-block-columns.are-vertically-aligned-bottom {
      align-items: flex-end;
    }
    & .wp-block-column {
      flex-grow: 1;
      flex-basis: 0;
      min-width: 0;
      box-sizing: border-box;
    }
    & .wp-block-column.is-vertically-aligned-top {
      align-self: flex-start;
    }
    & .wp-block-column.is-vertically-aligned-center {
      align-self: center;
    }
    & .wp-block-column.is-vertically-aligned-bottom {
      align-self: flex-end;
    }
    /* Stack columns on small screens */
    @media (max-width: 781px) {
      & .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
        flex-basis: 100% !important;
      }
    }
    /* Desktop: horizontal layout – reset flex-basis so columns sit side by side */
    @media (min-width: 782px) {
      & .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
        flex-basis: 0;
        flex-grow: 1;
      }
      /* Respect editor-set column widths (e.g. 33.33%, 50%) */
      & .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis"] {
        flex-grow: 0;
      }
    }
    & .wp-block-columns.is-not-stacked-on-mobile > .wp-block-column {
      flex-basis: 0;
      flex-grow: 1;
    }
    & .wp-block-columns.is-not-stacked-on-mobile > .wp-block-column[style*="flex-basis"] {
      flex-grow: 0;
    }

    /* Group with alignwide (e.g. seminar-interview sections) */
    & .wp-block-group.alignwide {
      max-width: var(--tt5-wide);
      margin-left: auto;
      margin-right: auto;
    }
    & .wp-block-group.has-global-padding.is-layout-constrained {
      padding-left: var(--tt5-spacing);
      padding-right: var(--tt5-spacing);
    }
    & .wp-block-group.is-vertical.is-layout-flex {
      display: flex;
      flex-direction: column;
      gap: var(--tt5-block-gap);
    }

    /* Responsive embed (YouTube etc.) */
    & .wp-block-embed {
      margin: 1em 0;
    }
    & .wp-block-embed .wp-block-embed__wrapper {
      position: relative;
      max-width: 100%;
    }
    & .wp-block-embed.wp-embed-aspect-16-9 .wp-block-embed__wrapper::before {
      content: "";
      display: block;
      padding-top: 56.25%;
    }
    & .wp-block-embed .wp-block-embed__wrapper iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }

    /* Social links (e.g. Instagram in seminar-interview) */
    & .wp-block-social-links {
      display: flex;
      flex-wrap: wrap;
      gap: 0.5em;
      margin: 0.25em 0;
    }
    & .wp-block-social-links .wp-block-social-link {
      padding: 0.25em;
    }
    & .wp-block-social-links .wp-block-social-link-anchor {
      text-decoration: none;
      color: inherit;
    }
    & .wp-block-social-links .wp-block-social-link-anchor:hover {
      text-decoration: none;
    }
    & .wp-block-social-links .wp-block-social-link-anchor svg {
      width: 24px;
      height: 24px;
    }

    & .wp-block-separator {
      border: none;
      border-top: 1px solid currentColor;
      color: rgba(17, 17, 17, 0.2);
      margin: 2em auto;
    }

    /* File block (PDF): visibility follows core logic (like Twenty Twenty-Five).
           Core shows embed when browser supports PDFs (desktop); hides on many mobiles. */
    .wp-block-file {
      margin: 1.5em 0;
    }

    .wp-block-file__embed {
      display: block;
      width: 100%;
      min-height: 400px;
      height: 60vh;
      max-height: 600px;
      margin: 0.75em 0;
      border: 1px solid rgba(0, 0, 0, 0.1);
      border-radius: 4px;
      background: #f5f5f5;
    }

    .wp-block-file a:not(.wp-block-file__button) {
      display: inline-block;
      margin-bottom: 0.5em;
    }

    .wp-block-file__button {
      display: inline-block;
      margin-top: 0.5em;
      padding: 0.5em 1em;
      font-size: 0.9em;
      text-decoration: none;
      border-radius: 4px;
      cursor: pointer;
    }
  }

  /* Page Links (pagination) */
  .page-links {
    margin: 40px 0;
    text-align: center;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 8px;

    & a {
      display: inline-block;
      padding: 10px 20px;
      margin: 0 5px;
      background: #667eea;
      color: white;
      text-decoration: none;
      border-radius: 5px;
      transition: all 0.3s ease;

      &:hover {
        background: #5a6fd8;
        transform: translateY(-2px);
      }
    }

    .current {
      display: inline-block;
      padding: 10px 20px;
      margin: 0 5px;
      background: #2c3e50;
      color: white;
      border-radius: 5px;
    }
  }
}

/* Responsive (pages and single posts) */
@media (max-width: 768px) {
  #wp-content-wrapper,
  #single #wp-content-wrapper {
    .page-content {
      padding-left: clamp(20px, 5vw, 30px);
      padding-right: clamp(20px, 5vw, 30px);
    }

    h1:not(.wp-block-heading) {
      font-size: 2rem;
    }

    h2:not(.wp-block-heading) {
      font-size: 1.75rem;
    }

    h3:not(.wp-block-heading) {
      font-size: 1.375rem;
    }
  }
}
