/* Einstein's Tutor blog — WordPress additions.
   main.css is the design system and stays untouched; this file adds what WordPress
   output needs (menus, comment form, Gutenberg blocks, server-rendered search, etc.)
   and replaces the few inline style="" attributes from the static HTML. */

/* ---------- Layout helpers (replace inline styles) ---------- */
.site-main{flex:1;display:flex;flex-direction:column}
.home-section{gap:24px}
.archive-main{gap:24px;min-width:0}
.archive-hero__spacer{height:24px}
.search-results{gap:20px;min-width:0}
.related__title{font-size:24px}
.toc__label{margin-bottom:8px}
.toc-aside .widget--promo h3{font-size:17px}
.author-box__body{gap:6px}
.refs__note{font-size:13px}
.empty-state__title{font-size:18px}
.empty-state__text{font-size:14px}
.empty-state__btn{margin-top:8px}
.search-hero .search-form .input{font-size:15px;padding:12px 14px}

/* ---------- Accessibility ---------- */
.skip-link:focus{position:fixed;top:12px;left:12px;z-index:1000;width:auto;height:auto;clip:auto;padding:10px 16px;background:#fff;border:2px solid var(--teal);border-radius:var(--r);color:var(--teal-dark)}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

/* ---------- Image placeholders when a post has no featured image ---------- */
.ph--empty{background:linear-gradient(135deg,var(--teal-100),var(--teal-50))}
img.ph{height:auto}
.featured img.ph{height:100%;min-height:320px;border-radius:0}
.post-hero__caption{font-size:13px;color:var(--ink-6);margin-top:10px}
.author-line__name{color:inherit;font-weight:inherit}
.author-line__name:hover{color:var(--teal-dark)}
.avatar img{width:100%;height:100%;object-fit:cover}

/* ---------- Header menu dropdowns ---------- */
.main-nav{align-items:center}
.main-nav a[aria-current]{color:var(--teal-dark);font-weight:700}
.nav-item{position:relative}
.nav-dd{display:none;position:absolute;top:100%;left:-14px;z-index:50;min-width:200px;flex-direction:column;padding:8px 0;margin-top:10px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:0 8px 24px rgba(18,32,44,.08)}
.nav-dd::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.nav-dd a{padding:8px 16px;white-space:nowrap}
.nav-dd a:hover{background:var(--teal-50)}
.nav-item:hover .nav-dd,.nav-item:focus-within .nav-dd{display:flex}
@media (max-width:640px){.nav-dd{left:auto;right:-14px}}

/* ---------- Sort controls ---------- */
form.sort{margin:0}
.seg a{font:700 13px var(--font);padding:6px 12px;border-radius:var(--r);border:1px solid var(--line);background:#fff;color:var(--ink-4)}
.seg a.is-active{border-color:var(--teal-300);background:var(--teal-100);color:var(--teal-dark)}

/* ---------- Search (server-rendered) ---------- */
.search-filters{display:flex;flex-direction:column;gap:12px;margin:0}
.facets__apply{padding:14px 0 18px;border-top:1px solid var(--line-3)}
.js .facets__apply{display:none}
.facets__head .link-btn{text-decoration:none}
.active-filters a{font:700 12.5px var(--font);color:var(--teal-dark);background:var(--teal-100);border:1px solid var(--teal-300);border-radius:var(--r-pill);padding:5px 12px}
.active-filters a:hover{background:var(--teal-50)}

/* ---------- Comments ---------- */
.comment-respond{display:flex;flex-direction:column;gap:10px}
.comments > .comment-respond .comment-reply-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.comment .comment-respond{margin:4px 0 4px 54px}
.comment .comment-reply-title{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px;font-weight:800;color:var(--ink)}
.comment-reply-title small a{font-size:13px}
.comment-form{margin:0}
.comment-form textarea.input{min-height:84px}
.comment-form__fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:10px}
.comment-form__cookies{display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--ink-5)}
.comment-form__cookies input{accent-color:var(--teal)}
.comment-form .form-submit{margin:0}
.comment__pending{font-size:12.5px;font-weight:700;color:var(--ink-5)}
.comment__text a{word-break:break-word}
a.reply-btn{display:inline-block}
.comments__list{display:flex;flex-direction:column}
.comments__closed{font-size:14px}

/* ---------- Gutenberg content inside .entry ---------- */
.entry > *{margin-top:0;margin-bottom:0}
.entry h3{margin-top:12px;font-size:20px;line-height:1.3}
.entry ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:6px}
.entry p a,.entry li a{text-decoration:underline;text-underline-offset:2px}
.entry img{height:auto;border-radius:var(--r)}
.entry .wp-block-image{margin:8px 0 0}
.entry .wp-block-image figcaption,.entry .wp-element-caption{font-size:13px;color:var(--ink-6);margin-top:10px;text-align:left}
.entry .wp-block-quote{border:0}
.entry .wp-block-quote p{margin:0}
.entry .wp-block-quote cite{display:block;margin-top:10px;font-size:13px;font-weight:600;color:var(--teal-dark);font-style:normal}
.entry .wp-block-pullquote{padding:0;border:0}
.entry .wp-block-embed{margin:8px 0 0}
.entry .wp-block-embed__wrapper iframe{border-radius:var(--r)}
.entry .wp-block-table table{width:100%;border-collapse:collapse;font-size:15px}
.entry .wp-block-table th,.entry .wp-block-table td{padding:10px 12px;border:1px solid var(--line);text-align:left}
.entry .wp-block-table thead{background:var(--teal-50)}
.entry hr,.entry .wp-block-separator{border:0;border-top:1px solid var(--line-2);margin:12px 0}
.entry pre,.entry code{font-family:ui-monospace,monospace;font-size:14px}
.entry pre{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:16px;overflow:auto}
.entry .wp-block-buttons{display:flex;gap:10px;flex-wrap:wrap}
.wp-block-button__link,.wp-element-button{font:800 14px var(--font);padding:10px 18px;border-radius:var(--r);background:var(--teal);color:#fff;border:1px solid var(--teal);text-decoration:none}
.wp-block-button__link:hover{background:var(--teal-dark);color:#fff}
.is-style-outline .wp-block-button__link{background:#fff;color:var(--teal-dark);border-color:var(--teal-300)}
.alignleft{float:left;margin:4px 24px 12px 0;max-width:50%}
.alignright{float:right;margin:4px 0 12px 24px;max-width:50%}
.aligncenter{margin-left:auto;margin-right:auto}
.entry--page{max-width:760px}
.page-main > .entry--page{gap:18px}

/* ---------- Page blocks (Columns template) ---------- */
.page-blocks{display:flex;flex-direction:column;gap:32px;min-width:0}
.page-blocks > *{margin:0}
.page-blocks > p,.page-blocks > ul,.page-blocks > ol{max-width:760px;font-size:16px;line-height:1.65;color:var(--ink-3)}
.page-blocks > h2{font-size:26px}
.page-blocks > h3{font-size:20px}
@media (max-width:719px){.page-blocks{--cols:1}}

/* Columns → "ET cards" */
.wp-block-columns.is-style-et-cards{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:24px;align-items:start;margin:0}
.entry .wp-block-columns.is-style-et-cards{--cols:2}
@media (max-width:719px){.wp-block-columns.is-style-et-cards{--cols:1}}
.is-style-et-cards > .wp-block-column{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:24px;display:flex;flex-direction:column;gap:14px;min-width:0;margin:0}
.is-style-et-cards > .wp-block-column > *{margin:0}
.is-style-et-cards .wp-block-image img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r)}
.is-style-et-cards .wp-block-image:not(:has(img[src])){aspect-ratio:16/10;border-radius:var(--r);background:linear-gradient(135deg,var(--teal-100),var(--teal-50))}
.is-style-et-cards h2{font-size:21px;line-height:1.25;letter-spacing:-.01em}
.is-style-et-cards h3{font-size:18px;line-height:1.3}
.is-style-et-cards p{font-size:15px;line-height:1.6;color:var(--ink-3)}
.is-style-et-cards .label{color:var(--teal-dark)}

/* Columns → "ET FAQ row" */
.wp-block-columns.is-style-et-faq{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:32px 40px;padding-top:40px;border-top:1px solid var(--line);margin:0}
@media (max-width:999px){.wp-block-columns.is-style-et-faq{--cols:2}}
@media (max-width:719px){.wp-block-columns.is-style-et-faq{--cols:1}}
.is-style-et-faq > .wp-block-column > *{margin:0}
.is-style-et-faq h3{font-size:17px;letter-spacing:-.01em;margin-bottom:8px}
.is-style-et-faq p{font-size:15px;line-height:1.6;color:var(--ink-3)}

/* List → "ET checklist" */
ul.is-style-et-checklist{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
ul.is-style-et-checklist li{display:flex;gap:10px;font-size:14px;line-height:1.5;color:var(--ink-2)}
ul.is-style-et-checklist li::before{content:"✓";color:var(--teal);font-weight:800}

/* Video fallback (oEmbed for providers other than YouTube/Vimeo) */
.video--oembed iframe{position:absolute;inset:0;width:100%;height:100%}

/* WordPress admin bar keeps the sticky TOC visible */
.admin-bar .toc-aside{top:56px}

/* ---------- Generic widgets (core/block widgets placed in the sidebars) ---------- */
.sidebar .widget h2,.toc-aside .widget h2,.sidebar .widget .wp-block-heading,.toc-aside .widget .wp-block-heading{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-7);margin:0 0 4px}
.sidebar .widget ul,.toc-aside .widget ul,.sidebar .widget ol,.toc-aside .widget ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.sidebar .widget li,.toc-aside .widget li{font-size:14px;line-height:1.4;padding:6px 0;border-bottom:1px solid var(--line-3);color:var(--ink-5)}
.sidebar .widget li:last-child,.toc-aside .widget li:last-child{border-bottom:0}
.sidebar .widget li a,.toc-aside .widget li a{font-weight:600;color:var(--ink-2)}
.sidebar .widget li a:hover,.toc-aside .widget li a:hover{color:var(--teal-dark)}
.widget .wp-block-group{display:flex;flex-direction:column;gap:8px}
.widget .wp-block-search__label{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-7)}
.widget .wp-block-search__inside-wrapper{display:flex;gap:8px;margin-top:8px}
.widget .wp-block-search__input{flex:1;min-width:0;font:500 14px var(--font);padding:9px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--bg-input)}
.widget .wp-block-search__button{margin:0}
.widget .wp-block-latest-comments{padding:0}
.widget .wp-block-latest-comments__comment{margin:0;padding:6px 0}
.widget .wp-block-latest-comments article{margin:0}
.is-style-et-cards p.label{font-size:11px;line-height:1.4}
.is-style-et-faq > .wp-block-column > h3{margin-bottom:8px}
