/* Enrolmy Help Centre – Tailwind-friendly minimal stylesheet
   Trimmed from original helpcentre.css to only include
   rules relevant to Confluence‑exported articles */

/* ------------------------------------------------------------------
   1. CSS Variables – brand colours updated to Enrolmy palette
   ------------------------------------------------------------------*/
:root {
  /* Brand (purple) */
  --K15t-color-brand-25:  #f1edff;
  --K15t-color-brand-50:  #e3dbff;
  --K15t-color-brand-100: #c8b8ff;
  --K15t-color-brand-200: #ac94ff;
  --K15t-color-brand-300: #9170ff;
  --K15t-color-brand-400: #6e4eff;
  --K15t-color-brand-500: #4618f0; /* primary */
  --K15t-color-brand-600: #3512c1;
  --K15t-color-brand-700: #260d91;
  --K15t-color-brand-800: #170761;
  --K15t-color-brand-900: #0c0333;

  /* Accent (CTA red / pink) */
  --K15t-color-red-400:  #ff4b68;

  /* Neutrals
     (keep originals – play nicely with Tailwind default palette) */
  --K15t-color-neutral-0:    #ffffff;
  --K15t-color-neutral-25:   #fafbfc;
  --K15t-color-neutral-50:   #f7f8fc; /* light grey as per hero bg */
  --K15t-color-neutral-75:   #edeff5;
  --K15t-color-neutral-100:  #dfe2ea;
  --K15t-color-neutral-200:  #c3c8d6;
  --K15t-color-neutral-300:  #a7aec2;
  --K15t-color-neutral-400:  #8991a9;
  --K15t-color-neutral-500:  #606885;
  --K15t-color-neutral-600:  #4c536c;
  --K15t-color-neutral-700:  #383e53;
  --K15t-color-neutral-800:  #252a38;
  --K15t-color-neutral-900:  #1d1d1f; /* main body text */
  
  /* Functional aliases */
  --K15t-surface:                var(--K15t-color-neutral-0);
  --K15t-foreground:             var(--K15t-color-neutral-900);
  --K15t-border-neutral:         var(--K15t-color-neutral-50);
  --K15t-border-neutral-strong:  var(--K15t-color-neutral-75);
  --K15t-link:                   var(--K15t-color-brand-600);
  --K15t-foreground-brand:       var(--K15t-color-brand-500);
}

/* ------------------------------------------------------------------
   2. Base typography – headings & body copy
   ------------------------------------------------------------------*/
main {
  h1, h2, h3, h4, h5, h6 {
    color: var(--K15t-foreground);
    margin-top: 2rem;
    margin-bottom: 0.75rem;
    line-height: 1.25;

    display: flex;
    gap: 8px;
    align-items: center;
  }

  h1 {
    font-size: 2rem;
    font-weight: 600;
  }

  h2 {
    font-size: 1.5rem;
    font-weight: 600;
  }

  h3 {
    font-size: 1.25rem;
    font-weight: 600;
  }

  p, li, td, th {
    font-family: theme('fontFamily.sans', ui-sans-serif, system-ui);
    font-size: 1.2rem;
    line-height: 1.7;
    color: var(--K15t-foreground);
  }

  /* Links */

  a {
    color: var(--K15t-link);
    text-decoration: underline;
  }

  a:hover {
    text-decoration: none;
  }

  /* ------------------------------------------------------------------
     3. Confluence‑specific helpers
     ------------------------------------------------------------------*/

  /* Embedded images that float left in Confluence */

  .image-left-wrap-wrapper {
    float: left;
    margin: 0 1rem 1rem 0;
    max-width: 100%;
  }

  .image-left-wrap-wrapper img {
    height: auto;
    width: 100%;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .05);
  }

  /* Tables autogenerated by Confluence */

  .confluenceTable {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1.5rem;
  }

  .confluenceTh,
  .confluenceTd {
    padding: 0.75rem;
    border: 1px solid var(--K15t-border-neutral-strong);
  }

  .confluenceTh {
    background: var(--K15t-color-brand-25);
    font-weight: 600;
  }

  .confluenceTd {
    background: var(--K15t-color-neutral-0);
  }

  /* Ensure odd/even row striping by default */

  .confluenceTable tbody tr:nth-child(odd) .confluenceTd {
    background: var(--K15t-color-neutral-50);
  }

  /* Lists inside Confluence wiki‑content */

  .wiki-content ul,
  .wiki-content ol {
    margin-left: 1.25rem;
    margin-bottom: 1rem;
  }

  /* ------------------------------------------------------------------
     4. Utility overrides – ensure Tailwind reset compatibility
     ------------------------------------------------------------------*/

  .vp-container.article {
    @apply mx-auto px-4;
    /* rely on Tailwind */
  }

  .vp-article__wrapper {
    @apply max-w-full;
    /* let content respect parent's width */
  }

  /* Remove floats after images */

  .vp-article__content::after {
    content: '';
    display: table;
    clear: both;
  }

  .panel {
    padding: 12px 24px;
    margin-bottom: 24px;
    border-color: transparent !important;
    border-radius: 8px;


    h1, h2, h3, h4, h5, h6 {
      margin-top: 0.75rem;
    }

  }

  ul {
    list-style: disc;
  }

  ol {
    list-style-type: decimal;
  }

  .confluence-information-macro, p {
    margin-bottom: 12px;
  }

  table {
    border: none !important;

    th {

      h1, h2, h3, h4, h5,h6 {
        margin-top: 0.75rem;
      }
    }
  }

  table p {
    margin-bottom: 0;
  }

  table th strong {
    font-weight: normal;
  }

  .confluence-information-macro-information {

    padding: 12px 24px;
    margin-top: 24px;
    margin-bottom: 24px;
    border-color: transparent !important;
    border-radius: 8px;
    background: #edf3ff;

    h1, h2, h3, h4, h5,h6 {
      margin-top: 0.75rem;
    }
    p {
      margin: 0;
    }
  }

  ul p, ol p {
    margin-bottom: 8px;
  }

  img {
    margin-bottom: 24px;
  }

  hr {
    margin-top: 12px;
    margin-bottom: 12px;
  }
}

.confluence-embedded-file-wrapper video {
  border-radius: 8px;
}


.aui-lozenge {
  display: inline-block;
  font-size: 11px;
  font-weight: normal;
  padding: 5px 10px;
  border-radius: 3px;
  color: #444;
  text-decoration: none;
  text-shadow: none;
  background-color: #f0f0f0;
  background-image: linear-gradient(to bottom, #f5f5f5, #f0f0f0);
  background-repeat: repeat-x;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 2px rgba(0, 0, 0, 0.05);
  border: 1px solid #e0e0e0;
  zoom: 0.9;
  line-height: 15px;
}

.aui-lozenge.aui-lozenge-success {
  background-color: #e0f5e0;
  background-image: linear-gradient(to bottom, #e8f8e8, #e0f5e0);
  border-color: #c8e6c8;
  color: #2d662d;
}

.aui-lozenge.aui-lozenge-error {
  background-color: #ffe8ec;
  background-image: linear-gradient(to bottom, #fff0f3, #ffe8ec);
  border-color: #ffd6e0;
  color: #a12b41;
}

.aui-lozenge.aui-lozenge-current {
  background-color: #fff3d6;
  background-image: linear-gradient(to bottom, #fff7e6, #fff3d6);
  border-color: #ffe0a3;
  color: #8a6300;
}

.aui-lozenge.aui-lozenge-progress {
  background-color: #e3dbff;
  background-image: linear-gradient(to bottom, #f1edff, #e3dbff);
  border-color: #c8b8ff;
  color: #260d91;
}

.aui-lozenge.aui-lozenge-complete {
  background-color: #e6f4ff;
  background-image: linear-gradient(to bottom, #f0f9ff, #e6f4ff);
  border-color: #b3e0ff;
  color: #0a5c91;
}