@font-face {
  font-family: "Noto Kufi Arabic";
  src: url("/assets/wiki/caccpro-docs/noto-kufi-arabic.woff2") format("woff2");
  font-display: swap;
  font-weight: 100 900;
}

:is(html[lang="ar"], html[dir="rtl"]) {
  direction: rtl;
}

:is(html[lang="ar"], html[dir="rtl"]) body {
  font-family: "Noto Kufi Arabic", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  text-align: right;
  letter-spacing: normal;
}

/* Keep the Wiki shell and rendered article content on one Arabic typeface. */
body[data-caccpro-docs] {
  --font-sans: "Noto Kufi Arabic", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --default-font-family: var(--font-sans);
  font-family: var(--font-sans) !important;
}

body[data-caccpro-docs] :where(
  .prose,
  article,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  span,
  a,
  button,
  input,
  textarea,
  select,
  option,
  label,
  summary,
  table,
  th,
  td,
  ul,
  ol,
  li,
  blockquote
) {
  font-family: inherit;
}

:is(html[lang="ar"], html[dir="rtl"]) :is(h1, h2, h3, h4, h5, h6, p, span, a, button, input, textarea, select) {
  letter-spacing: normal;
}

/* Ensure code blocks and technical elements stay LTR with monospace font */
:is(html[lang="ar"], html[dir="rtl"]) :is(pre, code, kbd, samp) {
  direction: ltr !important;
  text-align: left !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
  letter-spacing: normal !important;
  unicode-bidi: isolate;
}

:is(html[lang="ar"], html[dir="rtl"]) .code-block-toolbar {
  left: auto;
  right: 0.5rem;
  direction: ltr;
}

/* Anchor link on headings in RTL */
:is(html[lang="ar"], html[dir="rtl"]) .prose .heading-anchor {
  left: auto;
  right: -1.35rem;
}

/* Callouts in RTL */
:is(html[lang="ar"], html[dir="rtl"]) .callout {
  text-align: right;
}

:is(html[lang="ar"], html[dir="rtl"]) .callout-content ul,
:is(html[lang="ar"], html[dir="rtl"]) .callout-content ol {
  padding-inline-start: 1.5rem;
  padding-inline-end: 0;
}

body[data-caccpro-docs] {
  --caccpro-primary: #845777;
  --caccpro-secondary: #404b5a;
  --caccpro-accent: #e9e1e7;
  accent-color: var(--caccpro-primary);
  background:
    radial-gradient(circle at 92% -10%, color-mix(in srgb, var(--caccpro-accent) 70%, transparent) 0, transparent 28rem),
    var(--surface-base);
}

[data-theme="dark"] body[data-caccpro-docs] {
  --caccpro-accent: #2c232c;
  --caccpro-secondary: #f0e7ee;
}

body[data-caccpro-docs] a {
  text-underline-offset: 0.2em;
}

body[data-caccpro-docs] .prose a,
body[data-caccpro-docs] article a {
  color: var(--caccpro-primary);
}

/* Sidebar styling */
body[data-caccpro-docs] .wiki-sidebar {
  background: color-mix(in srgb, var(--surface-base) 94%, var(--caccpro-accent));
  border-inline-end: 1px solid color-mix(in srgb, var(--caccpro-primary) 15%, var(--outline-gray-1));
  will-change: width;
}

body[data-caccpro-docs] .wiki-item-content {
  border-radius: 0.55rem;
  margin-block: 1px;
}

body[data-caccpro-docs] .wiki-item-content:hover {
  background: color-mix(in srgb, var(--caccpro-accent) 42%, transparent);
}

body[data-caccpro-docs] .wiki-sidebar a[aria-current="page"],
body[data-caccpro-docs] .wiki-sidebar .bg-\[var\(--surface-gray-2\)\][data-node-id] {
  border-inline-start: 3px solid var(--caccpro-primary);
  background: color-mix(in srgb, var(--caccpro-accent) 58%, transparent);
  color: var(--caccpro-primary);
  font-weight: 600;
}

/* Sidebar Toggle Edge Pill */
.wiki-sidebar-toggle {
  will-change: inset-inline-start;
}

.wiki-sidebar-toggle button {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.wiki-sidebar-toggle button:hover {
  box-shadow: 0 4px 12px color-mix(in srgb, var(--caccpro-primary) 25%, transparent);
  border-color: var(--caccpro-primary);
  color: var(--caccpro-primary);
}

/* Main Content Area */
body[data-caccpro-docs] #wiki-content {
  font-size: 1.05rem;
  line-height: 2;
}

body[data-caccpro-docs] #wiki-content p {
  margin-bottom: 1.25rem;
}

body[data-caccpro-docs] #wiki-content > h1:first-child {
  display: none;
}

body[data-caccpro-docs] #wiki-content h2 {
  margin-top: 2.25rem;
  padding-block-end: 0.55rem;
  border-block-end: 1px solid color-mix(in srgb, var(--caccpro-primary) 18%, var(--outline-gray-1));
}

body[data-caccpro-docs] #wiki-content :is(ul, ol) {
  padding-inline-start: 1.6rem;
}

body[data-caccpro-docs] h1,
body[data-caccpro-docs] h2,
body[data-caccpro-docs] h3,
body[data-caccpro-docs] h4 {
  color: var(--caccpro-secondary);
  letter-spacing: normal;
  font-weight: 700;
}

[data-theme="dark"] body[data-caccpro-docs] h1,
[data-theme="dark"] body[data-caccpro-docs] h2,
[data-theme="dark"] body[data-caccpro-docs] h3,
[data-theme="dark"] body[data-caccpro-docs] h4 {
  color: #f0e7ee;
}

/* Table of Contents */
body[data-caccpro-docs] #wiki-toc .toc-link.active {
  border-inline-start-color: var(--caccpro-primary) !important;
  color: var(--caccpro-primary) !important;
  font-weight: 600;
}

body[data-caccpro-docs] #wiki-toc .toc-link:hover {
  color: var(--caccpro-primary);
  border-inline-start-color: color-mix(in srgb, var(--caccpro-primary) 50%, var(--outline-gray-1));
}

/* Blockquotes */
body[data-caccpro-docs] blockquote {
  border-inline-start-color: var(--caccpro-primary);
  border-inline-start-width: 4px;
  background: color-mix(in srgb, var(--caccpro-accent) 35%, transparent);
  border-radius: 0.5rem;
  padding: 0.8rem 1rem;
}

/* Tables */
body[data-caccpro-docs] .prose table {
  border-radius: 0.5rem;
  overflow: hidden;
  border: 1px solid var(--outline-gray-2);
}

body[data-caccpro-docs] .prose th {
  background-color: color-mix(in srgb, var(--caccpro-accent) 40%, var(--surface-gray-2));
  color: var(--caccpro-secondary);
  font-weight: 600;
}

[data-theme="dark"] body[data-caccpro-docs] .prose th {
  color: #f0e7ee;
  background-color: color-mix(in srgb, var(--caccpro-primary) 20%, var(--surface-gray-2));
}

/* Navigation buttons (Previous / Next) */
body[data-caccpro-docs] #wiki-nav-buttons a {
  min-height: 2.75rem;
  border: 1px solid color-mix(in srgb, var(--caccpro-primary) 20%, var(--outline-gray-2));
  border-radius: 0.75rem;
  transition: all 0.2s ease-in-out;
}

body[data-caccpro-docs] #wiki-nav-buttons a:hover {
  color: var(--caccpro-primary);
  border-color: var(--caccpro-primary);
  background: color-mix(in srgb, var(--caccpro-accent) 25%, var(--surface-base));
  transform: translateY(-1px);
  box-shadow: 0 4px 12px color-mix(in srgb, var(--caccpro-primary) 12%, transparent);
}

html[dir="rtl"] body[data-caccpro-docs] #wiki-nav-buttons .nav-arrow {
  transform: scaleX(-1);
}

/* Page actions dropdown */
body[data-caccpro-docs] .page-actions > summary::-webkit-details-marker {
  display: none;
}

body[data-caccpro-docs] .page-actions-wrapper {
  overflow: visible;
  border-color: color-mix(in srgb, var(--caccpro-primary) 22%, var(--outline-gray-2));
  background: var(--surface-base);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--caccpro-secondary) 8%, transparent);
}

body[data-caccpro-docs] .page-actions-wrapper:hover,
body[data-caccpro-docs] .page-actions-wrapper:focus-within {
  border-color: color-mix(in srgb, var(--caccpro-primary) 55%, var(--outline-gray-3));
  box-shadow: 0 4px 14px color-mix(in srgb, var(--caccpro-primary) 12%, transparent);
}

body[data-caccpro-docs] .page-actions-toggle {
  color: var(--caccpro-primary);
}

body[data-caccpro-docs] .page-actions-toggle:hover {
  background: color-mix(in srgb, var(--caccpro-accent) 48%, var(--surface-base));
}

body[data-caccpro-docs] .page-actions-menu {
  inset-inline-end: 0;
  width: min(20rem, calc(100vw - 2rem));
  min-width: 17rem;
  margin-block-start: 0.65rem;
  padding: 0.5rem;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--caccpro-primary) 18%, var(--outline-gray-2));
  border-radius: 0.9rem;
  background: color-mix(in srgb, var(--surface-base) 97%, var(--caccpro-accent));
  box-shadow:
    0 18px 45px color-mix(in srgb, var(--caccpro-secondary) 16%, transparent),
    0 3px 10px color-mix(in srgb, var(--caccpro-secondary) 10%, transparent);
  direction: inherit;
  text-align: start;
  animation: caccpro-actions-in 140ms ease-out;
}

html[dir="rtl"] body[data-caccpro-docs] .page-actions-menu {
  transform-origin: top left;
}

html:not([dir="rtl"]) body[data-caccpro-docs] .page-actions-menu {
  transform-origin: top right;
}

body[data-caccpro-docs] .page-actions-menu :is(button, a) {
  min-height: 3.4rem;
  gap: 0.75rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid transparent;
  border-radius: 0.7rem;
  text-align: start !important;
  line-height: 1.5;
  transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease;
}

body[data-caccpro-docs] .page-actions-menu :is(button, a):hover {
  color: var(--caccpro-primary);
  border-color: color-mix(in srgb, var(--caccpro-primary) 15%, transparent);
  background: color-mix(in srgb, var(--caccpro-accent) 50%, var(--surface-base));
}

body[data-caccpro-docs] .page-actions-menu :is(button, a):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--caccpro-primary) 65%, transparent);
  outline-offset: -2px;
}

body[data-caccpro-docs] .page-actions-menu :is(button, a) > span:first-child {
  width: 2rem;
  height: 2rem;
  border-radius: 0.55rem;
  color: var(--caccpro-primary);
  background: color-mix(in srgb, var(--caccpro-accent) 62%, var(--surface-base));
}

body[data-caccpro-docs] .page-actions-menu :is(button, a) > span:first-child svg {
  width: 1.05rem;
  height: 1.05rem;
  color: inherit;
}

body[data-caccpro-docs] .page-actions-menu .text-p-sm {
  margin-block-start: 0.1rem;
  overflow: visible;
  color: var(--ink-gray-5);
  white-space: normal;
  text-overflow: clip;
  line-height: 1.45;
}

[data-theme="dark"] body[data-caccpro-docs] .page-actions-menu {
  border-color: color-mix(in srgb, var(--caccpro-primary) 32%, var(--outline-gray-2));
  background: color-mix(in srgb, var(--surface-base) 94%, var(--caccpro-accent));
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.42);
}

body[data-caccpro-docs] .page-actions[open] .page-actions-chevron {
  transform: rotate(180deg);
}

@keyframes caccpro-actions-in {
  from {
    opacity: 0;
    transform: translateY(-0.35rem) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-caccpro-docs] .page-actions-menu {
    animation: none;
  }
}

/* Mobile drawer improvements */
body[data-caccpro-docs] [data-testid="mobile-bottom-sheet"] {
  border-top: 2px solid color-mix(in srgb, var(--caccpro-primary) 25%, var(--outline-gray-2));
}

body[data-caccpro-docs] [data-testid="mobile-menu-toggle"] {
  border-color: color-mix(in srgb, var(--caccpro-primary) 30%, var(--outline-gray-2));
  box-shadow: 0 8px 24px color-mix(in srgb, var(--caccpro-primary) 20%, transparent);
}

body[data-caccpro-docs] [data-testid="mobile-menu-toggle"]:hover {
  border-color: var(--caccpro-primary);
  color: var(--caccpro-primary);
}

@media (max-width: 768px) {
  body[data-caccpro-docs] .wiki-content {
    overflow-wrap: anywhere;
  }

  body[data-caccpro-docs] #wiki-page-title {
    font-size: clamp(1.55rem, 7vw, 2rem);
    line-height: 1.45;
    overflow-wrap: anywhere;
  }

  body[data-caccpro-docs] #wiki-content {
    font-size: clamp(0.9rem, 3.7vw, 1rem);
    line-height: 1.9;
  }

  body[data-caccpro-docs] #wiki-content h2 {
    margin-block-start: 1.75rem;
    font-size: clamp(1.18rem, 5vw, 1.4rem);
    line-height: 1.6;
  }

  body[data-caccpro-docs] #wiki-content h3 {
    font-size: clamp(1.05rem, 4.5vw, 1.2rem);
    line-height: 1.6;
  }

  body[data-caccpro-docs] #wiki-content :is(img, video) {
    max-width: 100%;
    height: auto;
    border-radius: 0.65rem;
  }

  body[data-caccpro-docs] #wiki-content table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    table-layout: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  body[data-caccpro-docs] #wiki-content :is(th, td) {
    min-width: 8rem;
    white-space: normal;
  }

  body[data-caccpro-docs] .page-actions-menu {
    inset-inline-start: 0;
    inset-inline-end: auto;
    width: min(20rem, calc(100vw - 1rem));
    min-width: 0;
    max-height: min(75dvh, 32rem);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  html[dir="rtl"] body[data-caccpro-docs] .page-actions-menu {
    transform-origin: top right;
  }

  html:not([dir="rtl"]) body[data-caccpro-docs] .page-actions-menu {
    transform-origin: top left;
  }

}

@media (max-width: 480px) {
  body[data-caccpro-docs] .page-actions-menu {
    width: min(18.5rem, calc(100vw - 0.75rem));
    padding: 0.4rem;
    border-radius: 0.8rem;
  }

  body[data-caccpro-docs] .page-actions-menu :is(button, a) {
    min-height: 3.15rem;
    gap: 0.6rem;
    padding: 0.5rem;
  }

  body[data-caccpro-docs] .page-actions-menu :is(button, a) > span:first-child {
    width: 1.85rem;
    height: 1.85rem;
  }

  body[data-caccpro-docs] #wiki-nav-buttons > div {
    flex-direction: column;
    gap: 0.65rem;
  }

  body[data-caccpro-docs] #wiki-nav-buttons a {
    width: 100%;
    max-width: none;
    min-height: 3rem;
    justify-content: space-between;
    padding-inline: 0.8rem;
  }
}

@media (max-width: 340px) {
  body[data-caccpro-docs] .page-actions-menu {
    width: calc(100vw - 0.5rem);
  }

  body[data-caccpro-docs] .page-actions-menu .text-p-sm {
    font-size: 0.72rem;
  }
}