/* ITS Connect Wiki — Custom Styles */

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #0d1117; }
::-webkit-scrollbar-thumb { background: #30363d; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #484f58; }

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Article content typography */
.wiki-content h2 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #ffffff;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #21262d;
}
.wiki-content h2:first-child { margin-top: 0; }

.wiki-content h3 {
    font-size: 1.15rem;
    font-weight: 600;
    color: #ffffff;
    margin-top: 2rem;
    margin-bottom: 0.75rem;
}

.wiki-content p {
    margin-bottom: 1rem;
    line-height: 1.75;
    color: #c9d1d9;
}

.wiki-content ul, .wiki-content ol {
    margin-bottom: 1rem;
    padding-left: 1.5rem;
}
.wiki-content li {
    margin-bottom: 0.5rem;
    line-height: 1.65;
}
.wiki-content ul li { list-style-type: disc; }
.wiki-content ol li { list-style-type: decimal; }
.wiki-content ul ul { margin-top: 0.25rem; margin-bottom: 0; }
.wiki-content ul ul li { list-style-type: circle; }

.wiki-content a {
    color: #00c9a7;
    text-decoration: none;
    transition: color 0.15s;
}
.wiki-content a:hover { color: #00e6bf; text-decoration: underline; }

.wiki-content strong { color: #ffffff; font-weight: 600; }

.wiki-content img {
    max-width: 100%;
    border-radius: 12px;
    border: 1px solid #30363d;
    margin: 1rem 0;
}

/* Code blocks */
.wiki-content code {
    background: #161b22;
    border: 1px solid #30363d;
    border-radius: 6px;
    padding: 0.15rem 0.4rem;
    font-size: 0.85em;
    color: #00c9a7;
    font-family: 'Fira Code', 'Cascadia Code', monospace;
}
.wiki-content pre {
    background: #161b22;
    border: 1px solid #30363d;
    border-radius: 12px;
    padding: 1rem 1.25rem;
    overflow-x: auto;
    margin-bottom: 1.25rem;
    position: relative;
}
.wiki-content pre code {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.85rem;
    color: #c9d1d9;
    display: block;
    line-height: 1.6;
}

/* Info/Warning/Tip boxes */
.wiki-callout {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1.25rem;
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    line-height: 1.6;
    font-size: 0.9rem;
}
.wiki-callout svg { flex-shrink: 0; margin-top: 2px; }

.wiki-callout-info {
    background: rgba(0, 201, 167, 0.08);
    border: 1px solid rgba(0, 201, 167, 0.2);
    color: #c9d1d9;
}
.wiki-callout-info svg { color: #00c9a7; }

.wiki-callout-warning {
    background: rgba(210, 153, 34, 0.08);
    border: 1px solid rgba(210, 153, 34, 0.2);
    color: #c9d1d9;
}
.wiki-callout-warning svg { color: #d29922; }

.wiki-callout-danger {
    background: rgba(248, 81, 73, 0.08);
    border: 1px solid rgba(248, 81, 73, 0.2);
    color: #c9d1d9;
}
.wiki-callout-danger svg { color: #f85149; }

/* Step cards */
.wiki-step {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
    align-items: flex-start;
}
.wiki-step-number {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00c9a7, #0f4c81);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.85rem;
    color: #fff;
}
.wiki-step-content { flex: 1; }
.wiki-step-content h4 {
    font-weight: 600;
    color: #fff;
    margin-bottom: 0.25rem;
}

/* Feature cards grid */
.wiki-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}
.wiki-card {
    background: #161b22;
    border: 1px solid #30363d;
    border-radius: 12px;
    padding: 1.25rem;
    transition: border-color 0.2s, transform 0.2s;
}
.wiki-card:hover {
    border-color: #00c9a7;
    transform: translateY(-2px);
}
.wiki-card h4 {
    font-weight: 600;
    color: #fff;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.wiki-card p {
    font-size: 0.875rem;
    color: #8b949e;
    line-height: 1.5;
    margin: 0;
}

/* Table styles */
.wiki-content table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1.25rem;
    font-size: 0.9rem;
}
.wiki-content thead {
    background: #161b22;
}
.wiki-content th {
    text-align: left;
    padding: 0.75rem 1rem;
    color: #fff;
    font-weight: 600;
    border-bottom: 2px solid #30363d;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.wiki-content td {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #21262d;
    color: #c9d1d9;
}
.wiki-content tbody tr:hover {
    background: #161b22;
}

/* Breadcrumb */
.wiki-breadcrumb {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.825rem;
    color: #8b949e;
    margin-bottom: 1.5rem;
}
.wiki-breadcrumb a {
    color: #8b949e;
    text-decoration: none;
    transition: color 0.15s;
}
.wiki-breadcrumb a:hover { color: #00c9a7; }
.wiki-breadcrumb .sep { opacity: 0.4; }

/* Tag/Badge */
.wiki-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 500;
    background: rgba(0, 201, 167, 0.1);
    color: #00c9a7;
    border: 1px solid rgba(0, 201, 167, 0.2);
}

/* Shortcut key */
.wiki-kbd {
    display: inline-block;
    padding: 0.1rem 0.4rem;
    font-size: 0.75rem;
    font-family: monospace;
    color: #c9d1d9;
    background: #21262d;
    border: 1px solid #30363d;
    border-radius: 4px;
    box-shadow: 0 1px 0 #30363d;
}

/* Homepage hero gradient */
.wiki-hero-gradient {
    background: radial-gradient(ellipse at top left, rgba(0, 201, 167, 0.06) 0%, transparent 50%),
                radial-gradient(ellipse at bottom right, rgba(15, 76, 129, 0.06) 0%, transparent 50%);
}

/* Animation */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}
.wiki-animate {
    animation: fadeInUp 0.4s ease-out;
}

/* Copy button on code blocks */
.wiki-copy-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    background: #21262d;
    border: 1px solid #30363d;
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 11px;
    color: #8b949e;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.15s, color 0.15s;
}
pre:hover .wiki-copy-btn { opacity: 1; }
.wiki-copy-btn:hover { color: #00c9a7; border-color: #00c9a7; }

/* Responsive adjustments */
@media (max-width: 1023px) {
    .wiki-card-grid {
        grid-template-columns: 1fr;
    }
}