/* WordPress Block Compatibility for DaisyUI/Tailwind Theme */

/* Block groups */
.wp-block-group { margin-bottom: 1.5rem; }
.wp-block-group.alignfull { width: 100%; max-width: 100%; }

/* Columns */
.wp-block-columns {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}
.wp-block-column {
    flex: 1 1 0%;
    min-width: 200px;
}
@media (max-width: 768px) {
    .wp-block-columns { flex-direction: column; }
    .wp-block-column { min-width: 100%; }
}

/* Buttons */
.wp-block-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.wp-block-button__link {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 1.25rem;
    border-radius: 0.5rem;
    font-weight: 500;
    font-size: 0.875rem;
    text-decoration: none;
    transition: all 0.2s;
}

/* Images */
.wp-block-image { margin: 1.5rem 0; }
.wp-block-image img { border-radius: 0.75rem; height: auto; }
.wp-block-image figcaption {
    text-align: center;
    font-size: 0.875rem;
    color: oklch(0.6 0 0);
    margin-top: 0.5rem;
}

/* Lists within blocks */
.wp-block-list { padding-left: 1.5rem; margin-bottom: 1rem; }
.wp-block-list li { margin-bottom: 0.25rem; }

/* Separator */
.wp-block-separator {
    border: 0;
    border-top: 1px solid oklch(0.9 0 0);
    margin: 2rem 0;
}

/* Text alignment helpers from WordPress */
.has-text-align-center { text-align: center; }
.has-text-align-left { text-align: left; }
.has-text-align-right { text-align: right; }

/* WordPress color palette compatibility — high specificity to override .st-prose */
.has-contrast-background-color { background-color: #1f2937 !important; }
.has-contrast-color { color: #1f2937 !important; }
.has-base-color { color: #ffffff !important; }
.has-base-background-color { background-color: #ffffff !important; }
.has-tertiary-background-color { background-color: #f9fafb !important; }

/* Text inside dark blocks must be white — use very high specificity */
.has-contrast-background-color,
.has-contrast-background-color p,
.has-contrast-background-color h1,
.has-contrast-background-color h2,
.has-contrast-background-color h3,
.has-contrast-background-color h4,
.has-contrast-background-color li,
.has-contrast-background-color span,
.has-contrast-background-color strong,
.has-contrast-background-color div,
.st-prose .has-contrast-background-color,
.st-prose .has-contrast-background-color p,
.st-prose .has-contrast-background-color h1,
.st-prose .has-contrast-background-color h2,
.st-prose .has-contrast-background-color h3,
.st-prose .has-contrast-background-color h4,
.st-prose .has-contrast-background-color li,
.st-prose .has-contrast-background-color span,
.st-prose .has-contrast-background-color strong,
.st-prose .has-contrast-background-color div {
    color: #ffffff !important;
}
.has-contrast-background-color a,
.st-prose .has-contrast-background-color a {
    color: #a5b4fc !important;
}
.has-contrast-background-color a:hover,
.st-prose .has-contrast-background-color a:hover {
    color: #c7d2fe !important;
}

/* Text color utilities from WordPress */
.has-contrast-2-color { color: #9ca3af !important; }
.has-contrast-background-color .has-contrast-2-color { color: #d1d5db !important; }

/* Font sizes from WordPress */
.has-medium-font-size { font-size: 1.125rem; }
.has-large-font-size { font-size: 1.5rem; }
.has-x-large-font-size { font-size: 2.25rem; }

/* Spacing vars used in block content */
.wp-block-group[style*="padding"] { padding: inherit; }

/* Override st-prose colors inside dark background blocks */
.st-prose .has-contrast-background-color p,
.st-prose .has-contrast-background-color h1,
.st-prose .has-contrast-background-color h2,
.st-prose .has-contrast-background-color h3,
.st-prose .has-contrast-background-color li {
    color: #ffffff !important;
}
.st-prose .has-contrast-background-color a {
    color: #a5b4fc !important;
}

/* Article prose typography (fallback when Tailwind prose plugin not available) */
.st-prose h2 {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    color: #111827;
    line-height: 1.3;
}
.st-prose h3 {
    font-size: 1.25rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    margin-top: 2rem;
    margin-bottom: 0.75rem;
    color: #111827;
    line-height: 1.4;
}
.st-prose h4 {
    font-size: 1.125rem;
    font-weight: 600;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
    color: #111827;
}
.st-prose p {
    margin-bottom: 1.25rem;
    line-height: 1.75;
    color: #374151;
}
.st-prose a {
    color: #4338CA;
    text-decoration: none;
}
.st-prose a:hover {
    text-decoration: underline;
}
.st-prose ul, .st-prose ol {
    padding-left: 1.5rem;
    margin-bottom: 1.25rem;
}
.st-prose ul { list-style-type: disc; }
.st-prose ol { list-style-type: decimal; }
.st-prose li {
    margin-bottom: 0.375rem;
    line-height: 1.75;
    color: #374151;
}
.st-prose blockquote {
    border-left: 4px solid #4338CA;
    background-color: #EEF2FF;
    padding: 1rem 1.5rem;
    margin: 1.5rem 0;
    border-radius: 0 0.5rem 0.5rem 0;
    font-style: normal;
}
.st-prose blockquote p {
    margin-bottom: 0;
    color: #374151;
}
.st-prose code {
    background-color: #F3F4F6;
    padding: 0.125rem 0.375rem;
    border-radius: 0.25rem;
    font-size: 0.875em;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
}
.st-prose pre {
    background-color: #1F2937;
    color: #E5E7EB;
    padding: 1.25rem;
    border-radius: 0.75rem;
    overflow-x: auto;
    margin: 1.5rem 0;
    font-size: 0.875rem;
    line-height: 1.6;
}
.st-prose pre code {
    background: none;
    padding: 0;
    color: inherit;
    font-size: inherit;
}
.st-prose table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    font-size: 0.9375rem;
}
.st-prose th {
    background-color: #F3F4F6;
    border: 1px solid #E5E7EB;
    padding: 0.625rem 1rem;
    text-align: left;
    font-weight: 600;
    font-size: 0.875rem;
}
.st-prose td {
    border: 1px solid #E5E7EB;
    padding: 0.625rem 1rem;
}
.st-prose tr:nth-child(even) td {
    background-color: #F9FAFB;
}
.st-prose img {
    border-radius: 0.75rem;
    height: auto;
    max-width: 100%;
}
.st-prose strong {
    color: #111827;
    font-weight: 600;
}
.st-prose hr {
    border: 0;
    border-top: 1px solid #E5E7EB;
    margin: 2rem 0;
}

/* Easy Table of Contents styling */
#ez-toc-container {
    background-color: #F9FAFB;
    border: 1px solid #E5E7EB;
    border-radius: 0.75rem;
    padding: 1.25rem 1.5rem;
    margin-bottom: 2rem;
}
#ez-toc-container .ez-toc-title {
    font-size: 1rem;
    font-weight: 600;
}
#ez-toc-container a {
    color: #4B5563;
    text-decoration: none;
    font-size: 0.9375rem;
}
#ez-toc-container a:hover {
    color: #4338CA;
}
#ez-toc-container ul {
    list-style: none;
    padding-left: 0;
}
#ez-toc-container li {
    padding: 0.25rem 0;
}

/* Screen reader text */
.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
