/*
Theme Name: Yismake Worku
Theme URI: https://yismakeworku.com
Author: Genesis
Description: Editable bilingual block theme for Yismake Worku.
Version: 0.2.2
Requires at least: 6.6
Text Domain: yismake-worku
*/

:root{--yw-ink:#eaf1fb;--yw-paper:#05080f;--yw-white:#fff;--yw-gold:#2e7bff;--yw-gold-dark:#8fbcff;--yw-muted:#9fb3cc;--yw-line:rgba(234,241,251,.16);--yw-shadow:0 1.5rem 4rem rgba(0,0,0,.4)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:transparent;color:var(--yw-ink);font-synthesis:none;position:relative}
body::before{content:"";position:fixed;inset:0;z-index:-2;background:
  linear-gradient(180deg,#0b3d91 0%,#1c63c9 32%,#4fa3e8 62%,#bfe0f7 78%,#e9f5ff 100%)}
body::after{content:"";position:fixed;left:0;right:0;top:78vh;height:22vh;z-index:-1;
  background-color:var(--yw-paper);
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22360%22%20height%3D%2264%22%20viewBox%3D%220%200%20360%2064%22%3E%3Cpath%20d%3D%22M0%2C32%20C30%2C18%2060%2C46%2090%2C34%20C120%2C22%20150%2C44%20180%2C32%20C210%2C20%20240%2C46%20270%2C34%20C300%2C22%20330%2C44%20360%2C32%20L360%2C64%20L0%2C64%20Z%22%20fill%3D%22%2305080f%22/%3E%3C/svg%3E");
  background-repeat:repeat-x;background-position:top left;background-size:360px 64px}
.yw-site-header,.yw-site-footer,main{position:relative;z-index:1}
.yw-site-header{position:sticky;top:0;z-index:20;background:rgba(5,8,15,.82);backdrop-filter:blur(14px)}
.yw-site-title{font-family:Georgia,"Noto Serif Ethiopic",serif;font-size:clamp(1.1rem,2vw,1.4rem);letter-spacing:.035em}
.yw-nav-en,.yw-nav-en .wp-block-navigation__responsive-container-open{display:none!important}
html[lang="en"] .yw-nav-am,html[lang="en"] .yw-nav-am .wp-block-navigation__responsive-container-open{display:none!important}
html[lang="en"] .yw-nav-en{display:flex!important}
html[lang="en"] .yw-nav-en .wp-block-navigation__responsive-container-open{display:flex!important}
.yw-skip-link{position:fixed;left:1rem;top:-6rem;z-index:100001;background:var(--yw-white);color:var(--yw-ink);padding:.75rem 1rem;border:2px solid var(--yw-ink)}
.yw-skip-link:focus{top:1rem}
.yw-route-identity{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.yw-language-pair{display:flex;justify-content:flex-end;padding:.75rem clamp(1rem,4vw,4rem);border-bottom:1px solid var(--yw-line);font-size:.85rem}
.yw-language-pair a{font-weight:700;text-underline-offset:.25em;color:#fff}
.yw-language-pair .yw-lang-current{font-weight:800;opacity:.45;pointer-events:none}
.yw-language-pair .yw-lang-sep{margin:0 .55rem;opacity:.6}
.yw-hero{padding:clamp(4rem,8vw,8rem) clamp(1rem,6vw,6rem)}
.yw-hero-grid{gap:clamp(2rem,7vw,7rem)}
.yw-hero-copy h1{font-size:clamp(3rem,8vw,7rem);letter-spacing:-.045em;max-width:13ch}
.yw-hero-copy>p:not(.yw-kicker){font-size:clamp(1.05rem,2vw,1.25rem);max-width:42rem}
.yw-kicker{color:var(--yw-gold-dark);font-size:.76rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.yw-home-sections,.yw-page-intro{padding:clamp(4rem,8vw,7rem) clamp(1rem,6vw,6rem);border-top:1px solid var(--yw-line)}
.yw-link-grid{margin-top:2.5rem;gap:1.25rem}
.yw-link-card,.yw-card{background:transparent;color:var(--yw-ink);border:1px solid var(--yw-line);padding:clamp(1.25rem,3vw,2rem)}
.yw-link-card{display:flex;flex-direction:column;align-items:flex-start}
.yw-link-card .wp-block-buttons{margin-top:auto;padding-top:1rem}
.yw-lead{font-size:clamp(1.1rem,2vw,1.35rem);max-width:48rem}
.yw-pending{color:var(--yw-muted);font-style:italic}
.yw-status{display:inline-block;color:var(--yw-ink);background:rgba(234,241,251,.08);border-left:4px solid var(--yw-gold);padding:.75rem 1rem}
.yw-disabled{opacity:.68;pointer-events:none}
.yw-dark{background:var(--yw-ink);color:var(--yw-paper);padding:clamp(2rem,5vw,5rem)}
.yw-media-placeholder{min-height:20rem;display:grid;place-items:center;align-content:center;background:rgba(234,241,251,.06);border:1px solid var(--yw-line);color:var(--yw-muted)}
.yw-news-placeholder{padding:2rem 0;border-top:2px solid var(--yw-ink);border-bottom:1px solid var(--yw-line)}
.yw-portrait{margin:0;box-shadow:var(--yw-shadow)}
.yw-portrait img{aspect-ratio:887/1183;display:block;object-fit:cover;object-position:center top;width:100%;height:auto}
.wp-element-button{transition:background-color .18s ease,color .18s ease,transform .18s ease}
.wp-element-button:hover{transform:translateY(-2px)}
.wp-block-navigation-item__content{text-underline-offset:.3em}
.wp-block-navigation-item__content:hover{text-decoration:underline}
/* Language toggle (አማርኛ/English) in header nav: force WHITE text. Global link color is a
   blue #2e7bff, so on the dark header it rendered blue-on-blue. Operator 2026-08-31: white.
   Operator 2026-09-05: changed from flag icon to a bordered TEXT BUTTON. */
.wp-block-navigation-item.yw-lang-toggle,
.wp-block-navigation-item.yw-lang-toggle .wp-block-navigation-item__content,
.wp-block-navigation-item.yw-lang-toggle .wp-block-navigation-item__label,
a.yw-lang-toggle {color:#fff!important}
/* Render the language switch as a bordered text pill on the anchor itself
   (the nav-link is <li.yw-lang-toggle><a.wp-block-navigation-item__content>). */
.wp-block-navigation-item.yw-lang-toggle .wp-block-navigation-item__content,
a.yw-lang-toggle{display:inline-flex;align-items:center;text-decoration:none;border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:.16rem .9rem;line-height:1.5}
.wp-block-navigation-item.yw-lang-toggle .wp-block-navigation-item__content:hover,
.wp-block-navigation-item.yw-lang-toggle:hover .wp-block-navigation-item__content,
a.yw-lang-toggle:hover{border-color:#fff;background:rgba(255,255,255,.10);text-decoration:none}
.yw-header-social{border-top:1px solid var(--yw-line)}
.yw-header-social .wp-block-social-links{gap:.5rem}
.yw-header-social .wp-social-link{width:1.75rem;height:1.75rem}
button:disabled,input:disabled{cursor:not-allowed;opacity:.65}
:focus-visible{outline:3px solid var(--yw-gold);outline-offset:3px}
@media (max-width:781px){.yw-site-header{position:relative}.yw-hero{padding-top:3rem}.yw-hero-copy h1{font-size:clamp(2.7rem,14vw,4.5rem)}.yw-link-grid{display:grid}.yw-language-pair{justify-content:flex-start}.wp-block-navigation__responsive-container.is-menu-open{padding:2rem}.wp-block-navigation__responsive-container-content{gap:1.25rem}}
/* Real 2026-08-26 mobile bug: the open mobile-menu overlay rendered as a
   thin white strip pinned to the right edge instead of a full-screen
   panel. Root cause: WordPress core's own overlay CSS uses
   background-color:inherit and no explicit width/height for
   .wp-block-navigation__responsive-container.is-menu-open - it relies on
   the theme's own body background to show through. This theme's body is
   background:transparent (the real gradient is painted by a body::before
   pseudo-element, see the :root section above), so "inherit" resolved to
   nothing usable and the overlay fell back to browser-default sizing.
   Giving it this theme's own explicit dark background + full viewport
   sizing fixes both problems at once. */
.wp-block-navigation__responsive-container.is-menu-open{background-color:var(--yw-paper)!important;color:var(--yw-ink)!important;position:fixed!important;inset:0!important;width:100%!important;height:100vh!important;height:100dvh!important;z-index:100000}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{color:var(--yw-ink)}

.yw-field-website{position:absolute;left:-9999px;top:-9999px}
.yw-contact-form-wrap{max-width:32rem;margin-top:1.5rem}
.yw-contact-form .yw-field{margin-bottom:1.25rem}
.yw-contact-form label{display:block;font-weight:700;margin-bottom:.4rem}
.yw-contact-form input[type=text],.yw-contact-form input[type=email],.yw-contact-form textarea{width:100%;padding:.7rem .9rem;background:rgba(234,241,251,.06);border:1px solid var(--yw-line);color:var(--yw-ink);font:inherit;border-radius:2px}
.yw-contact-form input:focus,.yw-contact-form textarea:focus{outline:3px solid var(--yw-gold);outline-offset:2px}
.yw-form-notice{padding:.75rem 1rem;border-left:4px solid var(--yw-gold);background:rgba(234,241,251,.08);margin-bottom:1.5rem}

/* Books & Publications - WooCommerce product styling, matched to this
   theme's own dark/gold language instead of WooCommerce's default purple. */
.woocommerce ul.products li.product,
.woocommerce div.product{color:var(--yw-ink)}
.woocommerce ul.products li.product{border:1px solid var(--yw-line);padding:1.25rem;background:transparent}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce div.product .product_title{color:var(--yw-ink);font-family:Georgia,"Noto Serif Ethiopic",serif}
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price{color:var(--yw-gold-dark)}
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.woocommerce a.add_to_cart_button{
  background:var(--yw-gold);color:var(--yw-paper);border:none;border-radius:2px;
  padding:.75rem 1.5rem;font-weight:700;transition:transform .18s ease}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,
.woocommerce a.add_to_cart_button:hover{background:var(--yw-gold-dark);transform:translateY(-2px);color:var(--yw-paper)}

.yw-external-return-note{color:var(--yw-muted);font-size:.85rem;font-style:italic;margin-top:.75rem}

.yw-sample-pages{padding:clamp(2rem,5vw,4rem) 0;border-top:1px solid var(--yw-line);margin-top:2rem}
.yw-sample-pages__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1rem;margin-top:1.5rem}
.yw-sample-pages__item{display:block;border:1px solid var(--yw-line);overflow:hidden}
.yw-sample-pages__item img{display:block;width:100%;height:auto;transition:transform .25s ease}
.yw-sample-pages__item:hover img{transform:scale(1.04)}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.wp-element-button{transition:none}.wp-element-button:hover{transform:none}.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,.woocommerce a.add_to_cart_button:hover,.yw-sample-pages__item:hover img{transform:none}}

/* Book discussion section (native per-book comments) */
.yw-book-comments{margin-top:4rem;padding-top:2rem;border-top:1px solid var(--yw-line);scroll-margin-top:3rem}
.yw-book-comments-title{font-size:1.5rem;margin-bottom:1rem}
.yw-book-comments .comment-list{list-style:none;margin:0 0 2rem;padding:0}
.yw-book-comments .comment-list li.comment{margin-bottom:1.25rem;padding-left:1rem;border-left:2px solid var(--yw-line)}
.yw-book-comments .comment-list .comment-author b{font-weight:600}
.yw-book-comments .comment-list .comment-metadata a{font-size:.8rem;color:var(--yw-ink-60, #666)}
.yw-book-comments .comment-form{margin-top:1rem}
.yw-book-comments .comment-form label{display:block;margin-bottom:.25rem;font-weight:500}
.yw-book-comments .comment-form input[type=text],
.yw-book-comments .comment-form input[type=email],
.yw-book-comments .comment-form input[type=url]{
  width:100%;max-width:28rem;padding:.55rem .7rem;border:1px solid var(--yw-line);border-radius:.375rem;background:#fff;color:var(--yw-ink, #111)}
.yw-book-comments .comment-form textarea{
  width:100%;padding:.55rem .7rem;border:1px solid var(--yw-line);border-radius:.375rem;background:#fff;color:var(--yw-ink, #111);min-height:6rem}

/* Content-section links row (Books · Articles · News) shown in front of the
   page title on every managed content page. Operator 2026-09-03. Mirrors the
   yw-language-pair layout so it reads as part of the title band. */
.yw-content-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:.1rem .85rem;padding:.5rem clamp(1rem,4vw,4rem) .9rem;font-family:Georgia,"Noto Serif Ethiopic",serif;font-size:.92rem}
.yw-content-links .yw-content-link{color:var(--yw-gold-dark);font-weight:700;letter-spacing:.03em;text-underline-offset:.28em;white-space:nowrap}
.yw-content-links .yw-content-link:hover{color:var(--yw-white)}
.yw-content-links .yw-content-sep{color:var(--yw-muted);opacity:.7}
@media (max-width:781px){.yw-content-links{justify-content:flex-start}}

/* Top-right language TEXT button, always visible incl. mobile (operator 2026-09-04
   flag; operator 2026-09-05 changed flags into text buttons). Desktop: hidden (the
   header nav's own yw-lang-toggle text button shows). Mobile (nav collapses to the
   hamburger): show this compact standalone text button pinned to the top-right of the
   sticky .yw-site-header, and push the hamburger clear of it. */
.yw-lang-flag-mob{display:none}
@media (max-width:781px){
  .yw-lang-flag-mob{display:inline-flex;align-items:center;position:absolute;top:50%;
    right:clamp(.7rem,4vw,1.6rem);transform:translateY(-50%);z-index:40;color:#fff;
    text-decoration:none;border:1px solid rgba(255,255,255,.55);border-radius:999px;
    padding:.2rem .9rem;font-size:.85rem;line-height:1.4;white-space:nowrap}
  .yw-lang-flag-mob:hover{border-color:#fff;background:rgba(255,255,255,.10);text-decoration:none}
}

/* Language control (operator 2026-09-05): the header now renders a single
   always-visible BOTH-language pair next to the site title (.yw-lang-pair) on
   every page - አማርኛ | English, white text on black pills, current language
   bolded. The old single-word mobile/nav toggles (yw-lang-flag-mob,
   yw-lang-toggle) are gone (see parts/header.html + functions.php). */

/* Left cluster: brand title + language pair, together; nav stays far right. */
.yw-header-left{display:flex;align-items:center;flex-wrap:wrap;gap:.4rem 1rem;color:#fff}

/* Both-language pill pair: white text on black buttons, side by side. */
.yw-lang-pair{display:inline-flex;align-items:center;gap:0;font-family:Georgia,"Noto Serif Ethiopic",serif}
.yw-lang-pair .yw-lang-opt{display:inline-flex;align-items:center;background:#000;color:#fff;
  border:1px solid #fff;padding:.18rem .8rem;font-size:.85rem;line-height:1.5;
  text-decoration:none;white-space:nowrap;letter-spacing:.02em;font-weight:700}
.yw-lang-pair .yw-lang-opt:first-child{border-radius:999px 0 0 999px}
.yw-lang-pair .yw-lang-opt:last-child{border-radius:0 999px 999px 0}
.yw-lang-pair .yw-lang-opt:hover{background:#1c1c1c;text-decoration:none}
/* Bar between the two: a black segment so the pills read as one joined button. */
.yw-lang-pair .yw-lang-bar{display:inline-flex;align-items:center;background:#000;color:#888;
  border-top:1px solid #fff;border-bottom:1px solid #fff;padding:.18rem 0;font-size:.8rem}
/* Current language (the page is in it) - bold, full-white; the other dimmed. */
html[lang="am"] .yw-lang-pair .yw-lang-am, html[lang="en"] .yw-lang-pair .yw-lang-en{font-weight:800;opacity:1}
html[lang="am"] .yw-lang-pair .yw-lang-en:not(:hover), html[lang="en"] .yw-lang-pair .yw-lang-am:not(:hover){opacity:.62}

/* Book product pages: pure continuous "ቅምሻ" read (Mark 2026-09-05, choice B) -
   hide the leftover single-item product tab row; the only remaining tab is the
   description/excerpt, so it should read top-to-bottom with no partition bar.
   Content lever (dropping Reviews/English tabs) lives in functions.php. */
.single-product .woocommerce-tabs ul.tabs,
.single-product .woocommerce-tabs ul.wc-tabs { display:none !important; }
.single-product .woocommerce-tabs .panel,
.single-product .woocommerce-tabs .wc-tab { display:block !important; }
