/*
 * ZigiOps Scroll Viewport theme
 * Tailors Scroll Viewport UI to use Cascadia Mono via Google Fonts for interface text with Cascadia Code reserved for monospaced content.
 * Applied through Scroll Viewport "Custom CSS" injection (see https://help.k15t.com/scroll-viewport/inject-custom-css).
 */

/***** FONT SETUP *****/
/* Load Cascadia Mono and Cascadia Code from Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Cascadia+Mono:ital,wght@0,200..700;1,200..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cascadia+Code:ital,wght@0,200..700;1,200..700&display=swap');

/* Centralized font stacks so tweaks stay DRY */
:root {
  --font-display: "Cascadia Mono", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-text: "Cascadia Mono", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "Cascadia Code", "Cascadia Mono", Menlo, Consolas, monospace;

  /* Scales chosen for Scroll Viewport's default layout */
  --scale-hero: 2.1rem;      /* ~34px */
  --scale-title: 1.9rem;     /* ~30px */
  --scale-h2: 1.6rem;        /* ~26px */
  --scale-h3: 1.25rem;       /* ~20px */
  --scale-h4: 1.1rem;        /* ~18px */
  --scale-body: 0.95rem;     /* ~15px */
  --scale-meta: 0.75rem;     /* ~12px */
  --scale-small: 0.7rem;     /* ~11px */
}

/***** VIEWPORT CHROME & GLOBAL TYPOGRAPHY *****/
body.viewport,
.viewport-body,
.viewport-content,
.viewport-article,
.viewport-nav,
.viewport-header,
.viewport-footer,
.viewport-toolbar,
.viewport-search,
.viewport-navigation,
.viewport-navigation__title,
.viewport-navigation__item,
.viewport-breadcrumbs,
.viewport-toc {
  font-family: var(--font-text) !important;
  color: #1a1f24;
}

/* Headings inherit the display-weighted variant */
.viewport-article h1,
.viewport-article h2,
.viewport-article h3,
.viewport-article h4,
.viewport-article h5,
.viewport-article h6 {
  font-family: var(--font-display) !important;
  color: #0d1117;
  font-weight: 600;
}

/* Scroll Viewport chrome widgets */
.viewport .header,
.viewport .top-bar,
.viewport .header__navigation,
.viewport .header__navigation--logo,
.viewport .header__navigation--heading,
.viewport .header__navigation--button,
.viewport .top-bar-left,
.viewport .top-bar-right,
.viewport .vp-container,
.viewport .vp-search-bar,
.viewport .vp-search-bar__input-container,
.viewport .vp-search-input,
.viewport .vp-search-input__input,
.viewport .vp-button,
.viewport .vp-button *,
.viewport .render-links,
.viewport .render-links--link,
.viewport .vp-error-log,
.viewport .vp-error-log__content,
.viewport .vp-error-log__footer,
.viewport .vp-image figcaption,
.viewport .footer,
.viewport .footer__links,
.viewport .footer__links a,
.viewport .footer__attribution-line--copyright,
.footer__links a,
.hc-footer-font-color,
.hc-footer-font-color > a,
.hc-header-font-color,
.hc-header-background-color {
  font-family: var(--font-text) !important;
  color: #f5f7fa !important;
}

/* Ensure Atlassian UI chrome (buttons, labels) sticks to Cascadia Mono */
.viewport *:where(:not(code):not(pre):not(kbd)) {
  font-family: var(--font-text) !important;
  font-optical-sizing: auto;
}

.viewport-article code,
.viewport-article pre,
.viewport-toolbar code,
.viewport-toolbar pre {
  font-family: var(--font-mono) !important;
}

/***** LANDING & HERO HEADERS *****/
/* Atlassian Scroll overview hero (Space overview) */
.space-overview__hero__header__content__intro--heading,
.viewport-article .hero-title,
.viewport-article .theme-hero__title {
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: var(--scale-hero) !important;
  line-height: 1.1 !important;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.15) !important;
}

.space-overview__hero__header__content__intro--description,
.theme-hero__subtitle,
.viewport-article .hero-lead {
  font-size: calc(var(--scale-body) + 0.1rem);
  line-height: 1.5;
}

/***** NAVIGATION & HEADER *****/
/***** LANDING PAGE LISTS & CARDS *****/
.list__topic a {
  font-family: var(--font-display) !important;
  font-weight: 600 !important;
  font-size: var(--scale-body) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: #4bb081 !important;
}

.list__topic__article a {
  font-family: var(--font-text) !important;
  font-size: 0.9rem !important;
  line-height: 1.6 !important;
  color: #262626 !important;
}

/***** NAVIGATION & HEADER *****/
.viewport-header,
.viewport-toolbar {
  font-size: var(--scale-meta);
  letter-spacing: 0.02em;
}

.viewport-toolbar__title,
.viewport-navigation__title {
  font-family: var(--font-display);
  font-size: var(--scale-body);
  font-weight: 600;
}

.viewport-search__input,
.viewport-search__button {
  font-family: var(--font-text);
  font-size: var(--scale-body);
}

.viewport .vp-button,
.viewport .vp-button:visited,
.viewport .vp-button--primary,
.viewport .vp-button--secondary {
  font-family: var(--font-text) !important;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.menu,
.viewport-navigation ul {
  font-family: var(--font-text) !important;
  font-size: var(--scale-meta) !important;
  line-height: 1.5 !important;
  list-style: none;
  padding: 0;
  margin: 0;
}

.viewport-navigation a,
.menu a,
.header__navigation a,
.footer__links a {
  color: #f5f7fa !important;
  text-decoration: none;
  transition: color 0.2s ease-in-out;
  font-size:medium
}

.viewport-navigation a:hover,
.menu a:hover,
.header__navigation a:hover,
.footer__links a:hover {
  color: #4bb081 !important;
}

.viewport .header__navigation--heading,
.viewport .header__navigation--logo,
.viewport .vp-navigation__title,
.viewport .article__heading,
.viewport .theme-hero__title {
  font-family: var(--font-display) !important;
}

.menu .is-active:not(ul) > a,
.viewport-navigation__item.is-active > a,
.article__toc__link--active {
  font-weight: 600 !important;
  color: #4bb081 !important;
}

/***** FOOTER *****/
.viewport-footer,
.viewport-footer a,
.hc-footer-font-color,
.hc-footer-font-color > a,
.footer__links a {
  font-family: var(--font-display) !important;
  font-size: var(--scale-meta);
  font-weight: 500;
  color: #ffffff !important;
}

/***** ARTICLE TYPOGRAPHY *****/
.viewport-article .article__heading,
.viewport-article h1 {
  font-size: var(--scale-title) !important;
  font-weight: 700;
  color: #0d1117;
  margin: 2.2rem 0 1.5rem !important;
}

.viewport-article h2 {
  font-size: var(--scale-h2);
  margin: 2rem 0 1.1rem;
  line-height: 1.35;
  color: #121821;
}

.viewport-article h3 {
  font-size: var(--scale-h3);
  margin: 1.6rem 0 0.9rem;
  line-height: 1.35;
  color: #15202b;
}

.viewport-article h4 {
  font-size: var(--scale-h4);
  margin: 1.3rem 0 0.7rem;
  line-height: 1.3;
  color: #19242f;
}

.viewport-article p,
.viewport-article li,
.viewport-article table,
.viewport-article blockquote {
  font-size: var(--scale-body);
  line-height: 1.7;
  letter-spacing: 0.01em;
  color: #1f252b;
}

.viewport-article small,
.viewport-article figcaption,
.viewport-article .caption,
.wiki-content time {
  font-size: var(--scale-meta);
  font-weight: 600;
  color: #4bb081;
}

.viewport-article a {
  font-family: var(--font-text);
  color: #0b63e5;
  font-weight: 500;
  text-decoration: none;
  transition: color 0.2s ease-in-out, text-decoration-color 0.2s ease-in-out;
}

.viewport-article a:hover,
.viewport-article a:focus-visible {
  color: #0845a8;
  text-decoration: underline;
}

.render-links--link,
.render-links--link--border {
  font-family: var(--font-text) !important;
  color: #0b63e5 !important;
  border-color: #0b63e5 !important;
}

/* Breadcrumbs */
.breadcrumbs li,
.breadcrumbs--active,
.viewport-breadcrumbs__item {
  font-size: var(--scale-meta) !important;
  line-height: 1.4 !important;
}

.breadcrumbs--active,
.viewport-breadcrumbs__item.is-active {
  font-weight: 700 !important;
  color: #4bb081 !important;
}

/* Timestamp chip */
.wiki-content time,
.viewport-article time {
  background-color: #ebecf0 !important;
  padding: 6px 7px 5px 5px !important;
  border-radius: 5px !important;
}

/***** CODE & PRE-FORMATTED BLOCKS *****/
.viewport-article code {
  font-family: var(--font-mono) !important;
  font-size: var(--scale-meta);
  line-height: 1.5;
  background-color: #f4f4f4 !important;
  color: #d6336c !important;
  border-radius: 4px !important;
  padding: 2px 5px !important;
}

.viewport-article pre,
.viewport-article pre code {
  font-family: var(--font-mono) !important;
  font-size: calc(var(--scale-meta) + 0.05rem);
  line-height: 1.6;
  background-color: #1e1e1e !important;
  color: #dcdcdc !important;
  padding: 1rem !important;
  border-radius: 6px !important;
  overflow-x: auto;
  margin: 1.5rem 0;
}

/***** INLINE CALLOUTS *****/
.article__content p strong,
.viewport-article strong {
  font-weight: 650;
}

.viewport-article blockquote {
  border-left: 3px solid #4bb081;
  padding-left: 1rem;
  color: #2f3231;
  background-color: #f7f9f8;
}

/***** IMAGES *****/
.viewport-article figure img {
  border: none !important;
  max-width: 100%;
  height: auto;
}

.viewport-article figure figcaption {
  font-size: var(--scale-meta);
  color: #5a5d5c;
}

/***** EXPAND MACRO *****/
.expand-container .expand-control {
    align-items: center;
    display: flex;
    font-weight: 500;
    justify-content: space-between;
    outline-offset: -4px;
    padding: 12px;
    font-size: var(--_text-size)!important;
}

.expand-container .expand-control:focus,.expand-container .expand-control:hover {
    background-color: var(--K15t-background-neutral-subtle-hovered);
    cursor: pointer
}

.expand-container .expand-control-icon {
    order: 1
}

.expand-container .expand-content {
    padding: 1rem 1.5rem
}

.expand-container .expand-content>:first-child {
    margin-top: 0
}

.expand-container>.expand-content {
    display: none
}