/* /Layout/MainLayout.razor.rz.scp.css */
/* MainLayout - Scoped CSS */
/* Using Tailwind for most styling - this file for component-specific overrides only */

/* Ensure full height layout */
[b-7fcmi3zvrg] .h-screen {
    min-height: 100vh;
    min-height: 100dvh;
}

/* Smooth transitions for theme changes */
[b-7fcmi3zvrg] * {
    transition-property: background-color, border-color, color;
    transition-timing-function: ease-in-out;
    transition-duration: 150ms;
}

/* Prevent transition on initial load */
[b-7fcmi3zvrg] .no-transition * {
    transition: none !important;
}
/* /Pages/Docs.razor.rz.scp.css */
/* ═══ Docs page scoped styles ═══ */

.doc-kicker[b-pjvx7ei5vf] {
    @apply text-[11px] sm:text-xs uppercase tracking-[0.28em] font-semibold mb-4
           text-blue-600 dark:text-cyan-300;
}

.doc-hero-badge[b-pjvx7ei5vf] {
    @apply inline-flex items-center rounded-full px-3 py-1.5 text-xs font-medium backdrop-blur
           border border-slate-300 bg-slate-100 text-slate-700
           dark:border-slate-600 dark:bg-slate-700 dark:text-slate-100;
}

.doc-section-lead[b-pjvx7ei5vf] {
    @apply text-sm sm:text-base text-slate-600 dark:text-slate-400 leading-8 max-w-4xl;
}

.doc-surface-card[b-pjvx7ei5vf] {
    @apply rounded-3xl border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-800 p-5 shadow-sm;
}

.doc-grid-list[b-pjvx7ei5vf] {
    @apply grid grid-cols-1 md:grid-cols-2 gap-4;
}

.doc-mini-item[b-pjvx7ei5vf] {
    @apply flex items-start gap-3 rounded-2xl border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-800 p-4 shadow-sm;
}

.doc-mini-title[b-pjvx7ei5vf] {
    @apply text-sm font-semibold text-slate-800 dark:text-slate-100 mb-1;
}

.doc-mini-desc[b-pjvx7ei5vf] {
    @apply text-sm text-slate-600 dark:text-slate-400 leading-7;
}

.doc-callout[b-pjvx7ei5vf] {
    @apply rounded-3xl border border-primary-200/80 dark:border-primary-800/50 bg-primary-50/70 dark:bg-primary-900/15 px-5 py-4;
}

.doc-callout-title[b-pjvx7ei5vf] {
    @apply text-sm font-bold text-primary-700 dark:text-primary-300 mb-1.5;
}

.doc-callout-body[b-pjvx7ei5vf] {
    @apply text-sm text-slate-700 dark:text-slate-300 leading-7;
}

.doc-primary-link[b-pjvx7ei5vf] {
    @apply inline-flex items-center rounded-xl bg-slate-900 dark:bg-white px-4 py-2.5 text-sm font-semibold text-white dark:text-slate-900 hover:opacity-90 transition-opacity;
}

.doc-subtle-pill[b-pjvx7ei5vf] {
    @apply inline-flex items-center rounded-full border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-800 px-3 py-1.5 text-xs font-medium text-slate-600 dark:text-slate-300;
}

.doc-accordion[b-pjvx7ei5vf] {
    border: 1px solid var(--color-border);
    border-radius: 1.5rem;
    background-color: var(--color-surface);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
    overflow: hidden;
}

.doc-accordion summary[b-pjvx7ei5vf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    padding: 1rem 1.25rem;
    cursor: pointer;
    list-style: none;
}

.doc-accordion summary[b-pjvx7ei5vf]::marker {
    content: "";
}

.doc-accordion summary[b-pjvx7ei5vf]::-webkit-details-marker {
    display: none;
}

.doc-accordion summary > div[b-pjvx7ei5vf] {
    flex: 1 1 auto;
    min-width: 0;
}

.doc-accordion[open][b-pjvx7ei5vf] {
    border-color: rgba(191, 219, 254, 0.9);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.dark .doc-accordion[open][b-pjvx7ei5vf] {
    border-color: rgba(30, 64, 175, 0.45);
}

.doc-accordion-kicker[b-pjvx7ei5vf] {
    margin: 0;
    font-size: 11px;
    line-height: 1.25rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    color: #2563eb;
    word-break: break-all;
}

.dark .doc-accordion-kicker[b-pjvx7ei5vf] {
    color: #60a5fa;
}

.doc-accordion-title[b-pjvx7ei5vf] {
    margin: 0.25rem 0 0;
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight: 700;
    color: var(--color-text);
}

.doc-accordion-signature[b-pjvx7ei5vf] {
    margin: 0.25rem 0 0;
    font-size: 0.75rem;
    line-height: 1.5rem;
    color: #059669;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.dark .doc-accordion-signature[b-pjvx7ei5vf] {
    color: #34d399;
}

.doc-accordion-icon[b-pjvx7ei5vf] {
    width: 1.25rem;
    min-width: 1.25rem;
    height: 1.25rem;
    margin-top: 0.25rem;
    color: var(--color-text-muted);
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.doc-accordion[open] .doc-accordion-icon[b-pjvx7ei5vf] {
    transform: rotate(180deg);
}

.doc-accordion-body[b-pjvx7ei5vf] {
    padding: 0.25rem 1.25rem 1.25rem;
}

.doc-info-box[b-pjvx7ei5vf] {
    padding: 1rem;
    border: 1px solid var(--color-border);
    border-radius: 1rem;
    background-color: var(--color-surface-secondary);
}

.doc-info-label[b-pjvx7ei5vf] {
    margin: 0 0 0.5rem;
    font-size: 11px;
    line-height: 1rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.doc-info-value[b-pjvx7ei5vf] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.75rem;
    color: var(--color-text-secondary);
}

.doc-flow[b-pjvx7ei5vf] {
    margin: 0;
    white-space: pre-wrap;
    font-size: 12px;
    line-height: 1.5rem;
    color: var(--color-text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.doc-stage-card[b-pjvx7ei5vf],
.doc-track-card[b-pjvx7ei5vf],
.doc-support-card[b-pjvx7ei5vf] {
    @apply rounded-3xl border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-800 p-5 shadow-sm;
}

.doc-stage-head[b-pjvx7ei5vf] {
    @apply flex items-center gap-3;
}

.doc-stage-step[b-pjvx7ei5vf] {
    @apply inline-flex items-center justify-center w-10 h-10 rounded-2xl bg-primary-600 text-white text-sm font-extrabold flex-shrink-0;
}

.doc-stage-title[b-pjvx7ei5vf] {
    @apply text-base font-bold text-slate-900 dark:text-slate-100;
}

.doc-chip-row[b-pjvx7ei5vf] {
    @apply flex flex-wrap gap-2;
}

.doc-warning-box[b-pjvx7ei5vf] {
    @apply rounded-2xl border border-amber-200 dark:border-amber-800/50 bg-amber-50 dark:bg-amber-900/10 px-4 py-3;
}

.doc-warning-title[b-pjvx7ei5vf] {
    @apply text-xs font-bold uppercase tracking-[0.18em] text-amber-700 dark:text-amber-300 mb-1.5;
}

.doc-warning-body[b-pjvx7ei5vf] {
    @apply text-sm text-slate-700 dark:text-slate-300 leading-7 m-0;
}

/* Prose defaults */
.prose-docs p[b-pjvx7ei5vf] {
    @apply text-sm text-slate-600 dark:text-slate-400 leading-relaxed mb-3;
}

.prose-docs h3[b-pjvx7ei5vf],
.doc-h3[b-pjvx7ei5vf] {
    @apply text-lg font-bold text-slate-800 dark:text-slate-100 mt-8 mb-3 flex items-center gap-2;
}

.doc-h3[b-pjvx7ei5vf]::before {
    content: '';
    @apply w-1 h-5 bg-primary-500 rounded-full inline-block;
}

/* Lists */
.doc-list[b-pjvx7ei5vf] {
    @apply list-none space-y-2 my-3;
}
.doc-list li[b-pjvx7ei5vf] {
    @apply text-sm text-slate-600 dark:text-slate-400 flex items-start gap-2;
}
.doc-list li[b-pjvx7ei5vf]::before {
    content: '▸';
    @apply text-primary-500 flex-shrink-0 mt-0.5;
}

/* Tables */
.doc-table[b-pjvx7ei5vf] {
    @apply w-full text-sm border-collapse;
}
.doc-table thead[b-pjvx7ei5vf] {
    @apply bg-slate-100 dark:bg-slate-700/60;
}
.doc-table th[b-pjvx7ei5vf] {
    @apply px-3 py-2 text-start text-xs font-semibold text-slate-600 dark:text-slate-300 uppercase tracking-wider;
}
.doc-table td[b-pjvx7ei5vf] {
    @apply px-3 py-2 text-sm text-slate-600 dark:text-slate-400 border-t border-slate-100 dark:border-slate-700/50;
}
.doc-table tbody tr:hover[b-pjvx7ei5vf] {
    @apply bg-slate-50 dark:bg-slate-700/30;
}
.doc-table code[b-pjvx7ei5vf] {
    @apply text-xs font-mono;
}

/* Kbd */
kbd[b-pjvx7ei5vf] {
    @apply px-1.5 py-0.5 text-xs bg-slate-200 dark:bg-slate-600 text-slate-700 dark:text-slate-300 rounded border border-slate-300 dark:border-slate-500 font-mono;
}

/* Custom scrollbar in sidebar */
aside[b-pjvx7ei5vf]::-webkit-scrollbar {
    width: 4px;
}
aside[b-pjvx7ei5vf]::-webkit-scrollbar-thumb {
    @apply bg-slate-300 dark:bg-slate-600 rounded-full;
}
aside[b-pjvx7ei5vf]::-webkit-scrollbar-track {
    @apply bg-transparent;
}

/* ─────────────────────────────────────────────
   Reading-progress bar (driven by JS via --docs-progress 0..1).
   Sits at top of #docs-main, fades out when fully scrolled.
   ───────────────────────────────────────────── */
.docs-progress-bar[b-pjvx7ei5vf] {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    z-index: 30;
    background: transparent;
    pointer-events: none;
    --docs-progress: 0;
}
.docs-progress-bar > span[b-pjvx7ei5vf] {
    display: block;
    height: 100%;
    width: 100%;
    transform-origin: left center;
    transform: scaleX(var(--docs-progress));
    background: linear-gradient(90deg, theme('colors.cyan.400') 0%, theme('colors.primary.500') 50%, theme('colors.indigo.500') 100%);
    transition: transform 120ms ease-out;
}
[dir="rtl"] .docs-progress-bar > span[b-pjvx7ei5vf] {
    transform-origin: right center;
}

/* ─────────────────────────────────────────────
   Inline anchor-copy button next to headings.
   Hidden by default, fades in on hover of its parent.
   ───────────────────────────────────────────── */
.docs-anchor-link[b-pjvx7ei5vf] {
    @apply inline-flex items-center justify-center w-7 h-7 rounded-lg text-slate-400 hover:text-primary-600 hover:bg-primary-50 dark:hover:bg-primary-900/20 transition-all opacity-0 focus:opacity-100;
    position: relative;
}
.docs-anchor-link--inline[b-pjvx7ei5vf] {
    @apply w-6 h-6;
}
*:hover > .docs-anchor-link[b-pjvx7ei5vf],
h1:hover .docs-anchor-link[b-pjvx7ei5vf],
h2:hover .docs-anchor-link[b-pjvx7ei5vf],
h3:hover .docs-anchor-link[b-pjvx7ei5vf],
summary:hover .docs-anchor-link[b-pjvx7ei5vf],
.doc-accordion summary:hover .docs-anchor-link[b-pjvx7ei5vf],
div:hover > .docs-anchor-link[b-pjvx7ei5vf] {
    opacity: 1;
}
.doc-accordion summary .docs-anchor-link:hover[b-pjvx7ei5vf],
.doc-accordion summary .docs-anchor-link:focus[b-pjvx7ei5vf] {
    opacity: 1;
}
.docs-anchor-hint[b-pjvx7ei5vf] {
    position: absolute;
    bottom: calc(100% + 4px);
    left: 50%;
    transform: translate(-50%, 4px);
    background: theme('colors.slate.900');
    color: white;
    font-size: 11px;
    line-height: 1;
    padding: 4px 8px;
    border-radius: 6px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 160ms ease, transform 160ms ease;
    z-index: 50;
}
.docs-anchor-hint.is-visible[b-pjvx7ei5vf] {
    opacity: 1;
    transform: translate(-50%, 0);
}

/* ─────────────────────────────────────────────
   Expand-all / Collapse-all toolbar per category.
   ───────────────────────────────────────────── */
.docs-accordion-toolbar[b-pjvx7ei5vf] {
    @apply flex items-center gap-2 flex-shrink-0;
}
.docs-accordion-toolbar-btn[b-pjvx7ei5vf] {
    @apply inline-flex items-center gap-1.5 rounded-xl border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-800 px-3 py-1.5 text-xs font-medium text-slate-600 dark:text-slate-300 hover:border-primary-300 dark:hover:border-primary-700 hover:text-primary-700 dark:hover:text-primary-300 transition-colors;
}

/* ─────────────────────────────────────────────
   Pill variants — replace the single doc-subtle-pill where
   a visual hierarchy actually matters. The legacy class is
   kept (used elsewhere) and now equals doc-pill--meta.
   ───────────────────────────────────────────── */
.doc-pill[b-pjvx7ei5vf] {
    @apply inline-flex items-center rounded-full px-3 py-1.5 text-xs font-medium transition-colors;
}
.doc-pill--name[b-pjvx7ei5vf] {
    @apply bg-primary-50 dark:bg-primary-900/30 text-primary-700 dark:text-primary-200 border border-primary-200/70 dark:border-primary-700/50 font-semibold;
}
.doc-pill--meta[b-pjvx7ei5vf] {
    @apply border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-800 text-slate-600 dark:text-slate-300;
}
.doc-pill--link[b-pjvx7ei5vf] {
    @apply border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-800 text-slate-600 dark:text-slate-300 hover:border-primary-300 hover:text-primary-700 dark:hover:text-primary-300 cursor-pointer;
}

/* ─────────────────────────────────────────────
   Sidebar scroll-spy active state — applied by docsEnhancers.js.
   Coexists with NavCls() so click-driven highlighting still wins.
   ───────────────────────────────────────────── */
[data-docs-nav-id].is-active[b-pjvx7ei5vf] {
    @apply bg-primary-50 dark:bg-primary-900/30 text-primary-700 dark:text-primary-200;
    position: relative;
}
[data-docs-nav-id].is-active[b-pjvx7ei5vf]::before {
    content: '';
    position: absolute;
    inset-inline-start: 0;
    top: 25%;
    bottom: 25%;
    width: 3px;
    border-radius: 0 4px 4px 0;
    background: theme('colors.primary.500');
}
[dir="rtl"] [data-docs-nav-id].is-active[b-pjvx7ei5vf]::before {
    border-radius: 4px 0 0 4px;
}

/* ─────────────────────────────────────────────
   Official-docs CTA card — hands users off to guide.cronus.support.
   ───────────────────────────────────────────── */
.docs-official-cta[b-pjvx7ei5vf] {
    @apply flex items-center gap-4 rounded-3xl border border-primary-200/80 dark:border-primary-700/50 bg-gradient-to-br from-primary-50 via-white to-cyan-50 dark:from-primary-900/30 dark:via-slate-800 dark:to-cyan-900/20 px-5 py-5 shadow-sm hover:shadow-lg hover:border-primary-400 dark:hover:border-primary-500 transition-all no-underline;
    text-decoration: none;
}
.docs-official-cta:hover[b-pjvx7ei5vf] {
    transform: translateY(-1px);
}
.docs-official-cta__icon[b-pjvx7ei5vf] {
    @apply flex-shrink-0 w-14 h-14 rounded-2xl bg-white dark:bg-slate-900 border border-primary-200/70 dark:border-primary-700/50 flex items-center justify-center text-3xl shadow-sm;
}
.docs-official-cta__body[b-pjvx7ei5vf] {
    @apply flex-1 min-w-0;
}
.docs-official-cta__kicker[b-pjvx7ei5vf] {
    @apply text-[11px] uppercase tracking-[0.22em] font-semibold text-primary-600 dark:text-primary-300 mb-1;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.docs-official-cta__title[b-pjvx7ei5vf] {
    @apply text-base sm:text-lg font-extrabold text-slate-900 dark:text-slate-100 leading-snug m-0;
}
.docs-official-cta__desc[b-pjvx7ei5vf] {
    @apply text-sm text-slate-600 dark:text-slate-300 leading-7 mt-1.5 mb-0;
}
.docs-official-cta__arrow[b-pjvx7ei5vf] {
    @apply flex-shrink-0 text-primary-600 dark:text-primary-300 transition-transform;
}
.docs-official-cta:hover .docs-official-cta__arrow[b-pjvx7ei5vf] {
    transform: translate(2px, -2px);
}
[dir="rtl"] .docs-official-cta:hover .docs-official-cta__arrow[b-pjvx7ei5vf] {
    transform: translate(-2px, -2px) scaleX(-1);
}
[dir="rtl"] .docs-official-cta__arrow[b-pjvx7ei5vf] {
    transform: scaleX(-1);
}
