/* ============================================================
   Tzadikim Public Site — Torah / Parchment Theme
   Palette from reference design:
     Leather bg:    #3d1205  (very dark reddish-brown)
     Mid leather:   #5c2410
     Gold:          #c8942a  (antique warm gold)
     Gold light:    #e8c060
     Parchment:     #f5e8c8  (aged paper)
     Parchment lt:  #faf4e2
     Text:          #1a0a02
     Text mid:      #3d200a
     Border gold:   #9a7020
   ============================================================ */

/* ── RESET ────────────────────────────────────────────────── */
* { box-sizing: border-box; margin: 0; padding: 0; }
a { color: inherit; text-decoration: none; }

/* ── BODY — Dark leather ──────────────────────────────────── */
body {
    font-family: 'Segoe UI', Georgia, 'Times New Roman', serif;
    background-color: #3d1205;
    background-image:
        radial-gradient(ellipse at 20% 20%, rgba(92,36,16,.4)  0%, transparent 55%),
        radial-gradient(ellipse at 80% 80%, rgba(20,6,2,.5)    0%, transparent 55%),
        repeating-linear-gradient(
            45deg, transparent, transparent 2px,
            rgba(0,0,0,.025) 2px, rgba(0,0,0,.025) 4px
        );
    color: #1a0a02;
    min-height: 100vh;
}
body.rtl { direction: rtl; text-align: right; }

/* ── NAV ──────────────────────────────────────────────────── */
.site-nav {
    background: linear-gradient(180deg, #200a02 0%, #3d1205 60%, #4a1a08 100%);
    border-bottom: 3px solid #9a7020;
    box-shadow: 0 3px 14px rgba(0,0,0,.65), inset 0 -1px 0 rgba(232,192,96,.12);
    position: sticky; top: 0; z-index: 100;
}
.nav-inner {
    max-width: 1100px; margin: 0 auto; padding: 0 20px;
    display: flex; justify-content: space-between; align-items: center; height: 62px;
}
.nav-logo {
    font-size: 1.22rem; font-weight: 700; color: #e8c060;
    letter-spacing: .5px; text-shadow: 0 1px 4px rgba(0,0,0,.6);
    white-space: nowrap;
}
.nav-links { display: flex; gap: 2px; align-items: center; }
.nav-links a {
    padding: 6px 13px; border-radius: 3px; font-size: .88rem;
    color: #e0ceA0; letter-spacing: .2px;
    border: 1px solid transparent;
    transition: background .14s, color .14s;
}
.nav-links a:hover { background: rgba(200,148,42,.2); color: #e8c060; border-color: rgba(200,148,42,.3); }
.nav-links a.active { background: rgba(200,148,42,.22); color: #e8c060; border-color: rgba(200,148,42,.35); }

/* Language switcher */
.lang-switcher {
    display: flex; gap: 4px;
    margin-left: 14px; padding-left: 14px;
    border-left: 1px solid rgba(200,148,42,.3);
}
.lang-switcher a {
    padding: 3px 8px !important; border-radius: 2px !important;
    font-size: .7rem !important; font-weight: 700 !important; text-transform: uppercase;
    color: #c0a870 !important; border: 1px solid rgba(200,148,42,.22) !important;
    background: transparent !important;
}
.lang-switcher a:hover { background: rgba(200,148,42,.18) !important; color: #e8c060 !important; }
.lang-switcher a.active {
    background: linear-gradient(180deg,#a07828,#7a5810) !important;
    color: #faf4e2 !important; border-color: #c8942a !important;
}

body.rtl .nav-inner { flex-direction: row-reverse; }
body.rtl .lang-switcher {
    margin-left: 0; border-left: none; padding-left: 0;
    margin-right: 14px; padding-right: 14px;
    border-right: 1px solid rgba(200,148,42,.3);
}

/* ── HERO ─────────────────────────────────────────────────── */
.hero {
    background: linear-gradient(180deg, #200a02 0%, #3d1205 55%, #4a1a08 100%);
    border-bottom: 3px solid #9a7020;
    text-align: center;
    padding: 56px 20px 48px;
    position: relative; overflow: hidden;
}
.hero::before, .hero::after {
    content: ''; position: absolute; width: 280px; height: 280px; border-radius: 50%;
    background: radial-gradient(circle, rgba(200,148,42,.1) 0%, transparent 70%);
    pointer-events: none;
}
.hero::before { top: -70px; left: -70px; }
.hero::after  { bottom: -70px; right: -70px; }

.hero h1 {
    font-size: 2.75rem; font-weight: 700; letter-spacing: .5px;
    color: #e8c060;
    text-shadow: 0 2px 10px rgba(0,0,0,.7), 0 0 40px rgba(200,148,42,.2);
    margin-bottom: 10px;
}
.hero p { font-size: 1.05rem; color: #c8b07a; max-width: 580px; margin: 0 auto 28px; line-height: 1.65; }
.hero-date {
    display: inline-block;
    background: rgba(154,112,32,.18);
    border: 1px solid rgba(200,148,42,.4);
    color: #e8c060; padding: 6px 20px;
    border-radius: 20px; font-size: .88rem;
    margin-bottom: 20px; letter-spacing: .3px;
}

/* ── SEARCH BAR ───────────────────────────────────────────── */
.search-bar { max-width: 480px; margin: 0 auto; display: flex; }
.search-bar input {
    flex: 1; padding: 12px 16px;
    border: 2px solid #9a7020; border-right: none;
    border-radius: 5px 0 0 5px; font-size: .95rem;
    background: #faf4e2; color: #1a0a02; outline: none;
    transition: border-color .14s, background .14s;
}
.search-bar input:focus { border-color: #c8942a; background: #fff; }
.search-bar input::placeholder { color: #9a8060; }
.search-bar button {
    padding: 12px 20px;
    background: linear-gradient(180deg, #c8942a 0%, #9a7020 100%);
    border: 2px solid #9a7020; border-left: none;
    border-radius: 0 5px 5px 0; cursor: pointer;
    font-size: 1rem; color: #faf4e2; font-weight: 700;
    transition: filter .14s;
}
.search-bar button:hover { filter: brightness(1.15); }

/* ── PAGE HEADER ──────────────────────────────────────────── */
.page-header {
    background: linear-gradient(180deg, #200a02 0%, #3d1205 100%);
    border-bottom: 3px solid #9a7020;
    text-align: center;
    padding: 44px 20px 30px;
}
.page-header h1 {
    font-size: 2rem; color: #e8c060;
    text-shadow: 0 2px 8px rgba(0,0,0,.6);
    margin-bottom: 6px;
}
.page-header p { color: #c8b07a; font-size: .95rem; }

/* ── LAYOUT WRAP ──────────────────────────────────────────── */
.page-wrap { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

/* ── FILTERS BAR ──────────────────────────────────────────── */
.filters-bar {
    background: linear-gradient(180deg, #3d1205 0%, #2a0d03 100%);
    border-bottom: 2px solid #9a7020;
    padding: 11px 20px;
}
.filters-inner {
    max-width: 1100px; margin: 0 auto;
    display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
}
.filter-select, .filter-search {
    padding: 7px 12px;
    border: 1px solid #9a7020; border-radius: 4px;
    font-size: .88rem; background: #faf4e2; color: #1a0a02;
    outline: none; transition: border-color .14s;
}
.filter-select:focus, .filter-search:focus { border-color: #c8942a; }
.filter-search { flex: 1; min-width: 180px; }
.filter-btn {
    padding: 7px 18px;
    background: linear-gradient(180deg, #c8942a 0%, #9a7020 100%);
    color: #faf4e2; border: 1px solid #7a5810;
    border-radius: 4px; cursor: pointer; font-size: .88rem; font-weight: 600;
}
.filter-btn:hover { filter: brightness(1.1); }
.filter-reset {
    padding: 7px 13px;
    background: rgba(154,112,32,.12); color: #e8c060;
    border: 1px solid rgba(200,148,42,.28);
    border-radius: 4px; cursor: pointer; font-size: .88rem;
}
.filter-reset:hover { background: rgba(154,112,32,.25); }

/* ── MONTH HEADER ─────────────────────────────────────────── */
.month-header {
    background: linear-gradient(90deg, #2a0d03 0%, #4a1a08 30%, #4a1a08 70%, #2a0d03 100%);
    color: #e8c060;
    padding: 7px 20px;
    font-size: .78rem; font-weight: 700;
    letter-spacing: 2px; text-transform: uppercase;
    text-align: center;
    border-top: 1px solid #9a7020;
    border-bottom: 1px solid #9a7020;
    text-shadow: 0 1px 3px rgba(0,0,0,.5);
}

/* ── TZADIK CARD ──────────────────────────────────────────── */
.tzadik-list { display: flex; flex-direction: column; }

.tzadik-card {
    background: linear-gradient(180deg, #faf4e2 0%, #f5e8c8 100%);
    border-bottom: 1px solid #d4b87a;
    display: flex; align-items: center;
    padding: 14px 20px; gap: 16px;
    cursor: pointer;
    transition: background .12s;
    position: relative;
}
.tzadik-card::before {
    content: ''; position: absolute;
    left: 0; top: 0; bottom: 0; width: 3px;
    background: transparent; transition: background .12s;
}
.tzadik-card:hover { background: linear-gradient(180deg, #fff9ee 0%, #faf0d4 100%); }
.tzadik-card:hover::before { background: #c8942a; }

.tzadik-card .date-badge {
    min-width: 66px; text-align: center;
    background: linear-gradient(180deg, #4a1a08 0%, #2a0d03 100%);
    border: 1px solid #9a7020;
    color: #e8c060; border-radius: 5px;
    padding: 8px 4px; font-size: .7rem; line-height: 1.3;
    box-shadow: inset 0 1px 0 rgba(232,192,96,.12);
    text-shadow: 0 1px 2px rgba(0,0,0,.5);
    flex-shrink: 0;
}
.tzadik-card .date-badge .day {
    font-size: 1.5rem; font-weight: 700;
    display: block; color: #e8c060;
    text-shadow: 0 1px 3px rgba(0,0,0,.5);
}
.tzadik-card .info { flex: 1; }
.tzadik-card .info h3 { font-size: 1.05rem; font-weight: 600; color: #1a0a02; margin-bottom: 3px; }
.tzadik-card .info .sub { font-size: .78rem; color: #7a5820; }
.tzadik-card .arrow { color: #c8942a; font-size: 1.4rem; flex-shrink: 0; }

body.rtl .tzadik-card { flex-direction: row-reverse; }
body.rtl .tzadik-card::before { left: auto; right: 0; }
body.rtl .tzadik-card .arrow { transform: scaleX(-1); }

/* ── LOAD MORE ────────────────────────────────────────────── */
.load-more-btn {
    display: block; width: 100%;
    padding: 14px; text-align: center;
    background: linear-gradient(180deg, #4a1a08 0%, #2a0d03 100%);
    border: none; border-top: 2px solid #9a7020;
    color: #e8c060; cursor: pointer;
    font-size: .95rem; font-weight: 700; letter-spacing: .4px;
    text-shadow: 0 1px 2px rgba(0,0,0,.5);
    transition: filter .14s;
}
.load-more-btn:hover { filter: brightness(1.22); }
.load-more-btn.loading { opacity: .6; cursor: wait; }

/* ── TZADIK DETAIL ────────────────────────────────────────── */
.tzadik-detail { max-width: 900px; margin: 0 auto; padding: 32px 20px 60px; }
.tzadik-detail .tz-header { display: flex; gap: 24px; margin-bottom: 28px; align-items: flex-start; }
.tzadik-detail .tz-image {
    width: 180px; min-width: 180px; height: 220px; object-fit: cover;
    border-radius: 4px; border: 3px solid #9a7020;
    box-shadow: 0 4px 18px rgba(0,0,0,.4);
}
.tzadik-detail .tz-image-placeholder {
    width: 180px; min-width: 180px; height: 220px;
    background: linear-gradient(180deg, #4a1a08, #2a0d03);
    border: 3px solid #9a7020; border-radius: 4px;
    display: flex; align-items: center; justify-content: center;
    color: #e8c060; font-size: 3rem;
    box-shadow: 0 4px 18px rgba(0,0,0,.4);
}
.tzadik-detail .tz-title h1 { font-size: 1.9rem; color: #1a0a02; margin-bottom: 8px; }
.hilulah-badge {
    display: inline-block;
    background: linear-gradient(180deg, #4a1a08, #2a0d03);
    border: 1px solid #9a7020;
    color: #e8c060; padding: 5px 16px;
    border-radius: 20px; font-size: .82rem; font-weight: 700;
    text-shadow: 0 1px 2px rgba(0,0,0,.5);
}
.tz-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.tz-meta-item { display: flex; align-items: center; gap: 5px; font-size: .85rem; color: #5c2e10; }
.tz-meta-item strong { color: #1a0a02; }

.biography {
    background: linear-gradient(160deg, #faf4e2 0%, #f5e8c8 100%);
    border: 1px solid #c8a040; border-radius: 4px;
    padding: 20px 24px; margin-bottom: 28px;
    font-size: .97rem; line-height: 1.85; color: #1a0a02;
    box-shadow: inset 0 0 28px rgba(154,112,32,.05);
}
.biography p { margin-bottom: .9em; }

.tz-nav {
    display: flex; justify-content: space-between;
    padding: 16px 0; border-top: 1px solid #c8a040; margin-top: 32px;
}
.tz-nav a {
    padding: 9px 18px;
    background: linear-gradient(180deg, #4a1a08 0%, #2a0d03 100%);
    border: 1px solid #9a7020;
    color: #e8c060; border-radius: 4px;
    font-size: .88rem; font-weight: 600;
    transition: filter .14s;
}
.tz-nav a:hover { filter: brightness(1.2); }

/* ── FAQ ──────────────────────────────────────────────────── */
.faq-item {
    background: linear-gradient(160deg, #faf4e2 0%, #f5e8c8 100%);
    border: 1px solid #c8a040; border-radius: 4px;
    margin-bottom: 10px;
    box-shadow: 0 1px 6px rgba(0,0,0,.12);
    overflow: hidden;
}
.faq-question {
    padding: 15px 20px; font-weight: 600; cursor: pointer;
    display: flex; justify-content: space-between; align-items: center;
    color: #1a0a02; font-size: .97rem;
    transition: background .12s;
}
.faq-question:hover { background: rgba(200,148,42,.07); }
.faq-question.open  { background: rgba(200,148,42,.06); }
.faq-question .toggle {
    font-size: 1.3rem; color: #c8942a; font-weight: 400;
    transition: transform .2s; flex-shrink: 0; margin-left: 12px;
}
.faq-question.open .toggle { transform: rotate(45deg); }
.faq-answer {
    display: none; padding: 0 20px 16px;
    color: #3d200a; line-height: 1.75; font-size: .95rem;
    border-top: 1px solid rgba(200,160,64,.3); margin: 0 8px;
}
.faq-answer.open { display: block; }

/* ── TIMELINE ─────────────────────────────────────────────── */
.timeline-wrap { position: relative; padding-left: 44px; }
.timeline-wrap::before {
    content: ''; position: absolute;
    left: 16px; top: 6px; bottom: 6px; width: 2px;
    background: linear-gradient(180deg, transparent, #9a7020 8%, #c8942a 50%, #9a7020 92%, transparent);
}
.timeline-item { position: relative; margin-bottom: 30px; }
.timeline-item::before {
    content: '✦'; position: absolute;
    left: -34px; top: 2px;
    color: #c8942a; font-size: .72rem;
    text-shadow: 0 0 6px rgba(200,148,42,.4);
}
.timeline-item .year {
    font-size: .75rem; font-weight: 700;
    color: #9a7020; text-transform: uppercase; letter-spacing: 1.2px; margin-bottom: 4px;
}
.timeline-item h3 { font-size: 1.05rem; font-weight: 600; color: #1a0a02; margin-bottom: 5px; }
.timeline-item p  { color: #3d200a; line-height: 1.65; font-size: .92rem; }

body.rtl .timeline-wrap { padding-left: 0; padding-right: 44px; }
body.rtl .timeline-wrap::before { left: auto; right: 16px; }
body.rtl .timeline-item::before { left: auto; right: -34px; }

/* ── SEARCH HIGHLIGHT ─────────────────────────────────────── */
mark { background: rgba(200,148,42,.3); color: #1a0a02; padding: 0 2px; border-radius: 2px; }

/* ── FOOTER ───────────────────────────────────────────────── */
.site-footer {
    background: linear-gradient(180deg, #200a02 0%, #110401 100%);
    border-top: 3px solid #9a7020;
    color: #8a6840; text-align: center;
    padding: 24px 20px; margin-top: 60px; font-size: .85rem;
}
.site-footer a { color: #c8942a; }
.site-footer a:hover { color: #e8c060; }

/* ── EMPTY STATE ──────────────────────────────────────────── */
.empty-state { text-align: center; padding: 60px 20px; color: #9a7850; }

/* ── RESPONSIVE ───────────────────────────────────────────── */
@media (max-width: 700px) {
    .hero h1 { font-size: 1.85rem; }
    .page-header h1 { font-size: 1.5rem; }
    .tzadik-detail .tz-header { flex-direction: column; }
    .tzadik-detail .tz-image,
    .tzadik-detail .tz-image-placeholder { width: 100%; min-width: 0; height: 200px; }
    .nav-links a { padding: 5px 8px; font-size: .8rem; }
    .filters-inner { flex-direction: column; align-items: stretch; }
    .hide-mobile { display: none !important; }
}


/* ════════════════════════════════════════════════
   TOP BAR
════════════════════════════════════════════════ */
.top-bar {
    background: #110401;
    border-bottom: 1px solid rgba(154,112,32,.35);
    padding: 0 20px;
    height: 32px;
    display: flex;
    align-items: center;
}
.top-bar-inner {
    max-width: 1100px; width: 100%; margin: 0 auto;
    display: flex; justify-content: space-between; align-items: center;
}
.top-bar-tagline {
    font-size: .7rem; color: #7a5820; letter-spacing: .4px;
    text-transform: uppercase;
}
/* Top-bar language switcher */
.top-bar .lang-switcher {
    display: flex; gap: 2px;
    /* reset nav values */
    margin: 0; padding: 0; border: none;
}
.top-bar .lang-switcher a {
    padding: 2px 8px; border-radius: 2px;
    font-size: .68rem; font-weight: 700; text-transform: uppercase;
    color: #9a7020; border: 1px solid rgba(154,112,32,.25);
    transition: background .12s, color .12s;
}
.top-bar .lang-switcher a:hover { background: rgba(200,148,42,.18); color: #e8c060; }
.top-bar .lang-switcher a.active {
    background: linear-gradient(180deg,#a07828,#7a5810);
    color: #faf4e2; border-color: #c8942a;
}
/* hide old nav lang switcher — top bar handles it now */
.site-nav .lang-switcher { display: none !important; }

/* ════════════════════════════════════════════════
   NAV LOGO
════════════════════════════════════════════════ */
.nav-logo {
    display: flex; align-items: center; gap: 10px;
    text-decoration: none;
}
.nav-logo-svg { width: 44px; height: 44px; flex-shrink: 0; }
.nav-logo-text {
    display: flex; flex-direction: column; line-height: 1;
}
.nav-logo-en {
    font-size: 1.15rem; font-weight: 800; color: #e8c060;
    letter-spacing: 2.5px; text-transform: uppercase;
    text-shadow: 0 1px 4px rgba(0,0,0,.6);
}
.nav-logo-he {
    font-size: .78rem; color: #c8942a; letter-spacing: 1px;
    margin-top: 2px;
    text-shadow: 0 1px 3px rgba(0,0,0,.5);
}

/* ════════════════════════════════════════════════
   HAMBURGER + MOBILE MENU
════════════════════════════════════════════════ */
.hamburger {
    display: none;
    flex-direction: column; justify-content: center; align-items: center;
    gap: 5px;
    width: 40px; height: 40px;
    background: none; border: 1px solid rgba(200,148,42,.3);
    border-radius: 4px; cursor: pointer; padding: 8px;
}
.hamburger span {
    display: block; width: 20px; height: 2px;
    background: #e8c060; border-radius: 1px;
    transition: transform .25s, opacity .25s;
}
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.nav-mobile-menu {
    display: none;
    flex-direction: column;
    background: linear-gradient(180deg, #2a0d03, #200a02);
    border-top: 1px solid rgba(154,112,32,.35);
    padding: 8px 0;
}
.nav-mobile-menu.open { display: flex; }
.nav-mobile-menu a {
    padding: 12px 20px; color: #e0ceA0; font-size: .95rem;
    border-bottom: 1px solid rgba(154,112,32,.12);
    transition: background .12s;
}
.nav-mobile-menu a:hover, .nav-mobile-menu a.active {
    background: rgba(200,148,42,.15); color: #e8c060;
}

/* ════════════════════════════════════════════════
   TZADIK INFO GRID (meta data block)
════════════════════════════════════════════════ */
.tz-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 8px;
    margin-bottom: 18px;
}
.tz-info-item {
    display: flex; align-items: baseline; gap: 6px;
    background: linear-gradient(135deg,#f5e8c8,#ede0b0);
    border: 1px solid rgba(200,148,42,.35);
    border-radius: 5px;
    padding: 7px 11px;
    font-size: .85rem;
}
.tz-info-icon { font-size: .9rem; flex-shrink: 0; }
.tz-info-label {
    font-weight: 700; color: #5c2e10; white-space: nowrap; flex-shrink: 0;
}
.tz-info-val { color: #1a0a02; line-height: 1.4; }

/* ════════════════════════════════════════════════
   SHORT INFO CALLOUT
════════════════════════════════════════════════ */
.short-info-callout {
    background: linear-gradient(160deg, #f5e8c8, #ede0b0);
    border-left: 4px solid #c8942a;
    border-radius: 0 5px 5px 0;
    padding: 14px 18px;
    margin-bottom: 22px;
    color: #3d200a;
    line-height: 1.75;
    font-style: italic;
    font-size: .95rem;
}
body.rtl .short-info-callout {
    border-left: none; border-right: 4px solid #c8942a;
    border-radius: 5px 0 0 5px;
}
.short-info-callout p { margin-bottom: .5em; }
.short-info-callout p:last-child { margin-bottom: 0; }

/* ════════════════════════════════════════════════
   BIOGRAPHY — styled HTML content from DB
════════════════════════════════════════════════ */
.biography h2, .biography h3, .biography h4 {
    font-size: 1rem; font-weight: 700; color: #3d1205;
    margin: 1.4em 0 .5em;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(200,148,42,.3);
}
.biography h2 { font-size: 1.1rem; }
.biography p { margin-bottom: .9em; }
.biography p:last-child { margin-bottom: 0; }
.biography strong, .biography b { color: #1a0a02; }
.biography ul, .biography ol { margin: .6em 0 .9em 1.4em; }
.biography li { margin-bottom: .3em; }
.biography a { color: #9a7020; text-decoration: underline; }
.biography a:hover { color: #c8942a; }
.biography blockquote {
    border-left: 3px solid #c8942a;
    margin: 1em 0; padding: .6em 1em;
    background: rgba(200,148,42,.06);
    color: #3d200a; font-style: italic;
}
body.rtl .biography blockquote { border-left: none; border-right: 3px solid #c8942a; }

/* ════════════════════════════════════════════════
   MOBILE RESPONSIVE — UPDATES
════════════════════════════════════════════════ */
@media (max-width: 768px) {
    /* Show hamburger */
    .hamburger { display: flex; }
    /* Hide desktop links */
    .site-nav .nav-links { display: none; }
    /* Top bar tagline hidden on small screens */
    .top-bar-tagline { display: none; }
    .top-bar .lang-switcher { margin-left: auto; }

    /* Tzadik detail on mobile */
    .tz-info-grid { grid-template-columns: 1fr; }

    /* Hero text smaller */
    .hero h1 { font-size: 1.7rem; }
    .hero p   { font-size: .92rem; }

    /* Nav logo smaller */
    .nav-logo-svg { width: 36px; height: 36px; }
    .nav-logo-en  { font-size: .95rem; letter-spacing: 2px; }
    .nav-logo-he  { font-size: .7rem; }
}
@media (max-width: 480px) {
    .hero { padding: 36px 16px 32px; }
    .page-header { padding: 28px 16px 20px; }
    .tzadik-detail { padding: 20px 14px 40px; }
    .tzadik-detail .tz-header { flex-direction: column; }
    .tzadik-detail .tz-image,
    .tzadik-detail .tz-image-placeholder { width: 100%; min-width: 0; height: 180px; }
    .search-bar { flex-direction: column; }
    .search-bar input  { border-right: 2px solid #9a7020; border-radius: 5px; margin-bottom: 8px; }
    .search-bar button { border-radius: 5px; border-left: 2px solid #9a7020; }
}

/* Admin link in nav */
.nav-admin-link {
    color: #c8b07a !important;
    border: 1px solid rgba(200,148,42,.22) !important;
    font-size: .8rem !important;
    opacity: .75;
}
.nav-admin-link:hover { opacity: 1 !important; }

/* Section titles inside detail pages */
.section-title {
    font-size: 1rem; font-weight: 700; color: #3d1205;
    text-transform: uppercase; letter-spacing: .7px;
    margin: 28px 0 14px;
    padding-bottom: 6px;
    border-bottom: 2px solid rgba(200,148,42,.4);
    display: flex; align-items: center; gap: 6px;
}

/* ════════════════════════════════════════════════
   TZADIK NAME BLOCK — gold/light on dark swatch
════════════════════════════════════════════════ */
.tz-name-block {
    background: linear-gradient(135deg, #2a0d03 0%, #3d1205 60%, #4a1a08 100%);
    border: 1px solid #9a7020;
    border-radius: 6px;
    padding: 14px 20px 12px;
    margin-bottom: 14px;
    box-shadow: inset 0 1px 0 rgba(232,192,96,.12), 0 2px 8px rgba(0,0,0,.3);
}
.tz-name {
    font-size: 1.75rem;
    font-weight: 700;
    color: #e8c060 !important;
    text-shadow: 0 2px 8px rgba(0,0,0,.6), 0 0 24px rgba(200,148,42,.2);
    line-height: 1.2;
    margin: 0 0 4px;
}
.tz-name-he {
    font-size: 1.05rem;
    color: #c8b07a;
    font-style: italic;
    margin-bottom: 4px;
}
.tz-alias {
    font-size: .88rem;
    color: #9a7850;
    font-style: italic;
}

/* ════════════════════════════════════════════════
/* ════════════════════════════════════════════════
   IMAGE SLIDER — FIXED
════════════════════════════════════════════════ */
.tz-slider {
    position: relative;
    margin-bottom: 28px;
    background: #1a0502;
    border: 1px solid #9a7020;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 4px 18px rgba(0,0,0,.4);
    user-select: none;
    height: 450px;
}
.slider-track {
    position: relative;
    width: 100%;
    height: 100%;
}
.slide {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #110401;
    opacity: 0;
    transition: opacity .5s ease;
    pointer-events: none;
}
.slide.active {
    opacity: 1;
    pointer-events: auto;
}
.slide img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.slide-caption {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    background: linear-gradient(0deg, rgba(26,5,2,.85) 0%, transparent 100%);
    color: #e8c060;
    padding: 18px 16px 10px;
    font-size: .85rem;
    text-align: center;
}
.slider-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(26,5,2,.7);
    border: 1px solid rgba(154,112,32,.5);
    color: #e8c060;
    width: 40px; height: 40px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 1.4rem;
    line-height: 1;
    display: flex; align-items: center; justify-content: center;
    z-index: 10;
    transition: background .14s, border-color .14s;
    backdrop-filter: blur(4px);
}
.slider-btn:hover {
    background: rgba(154,112,32,.5);
    border-color: #c8942a;
}
.slider-prev { left: 10px; }
.slider-next { right: 10px; }
.slider-dots {
    position: absolute;
    bottom: 10px; left: 50%;
    transform: translateX(-50%);
    display: flex; gap: 6px;
    z-index: 10;
}
.dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: rgba(232,192,96,.35);
    border: 1px solid rgba(200,148,42,.4);
    cursor: pointer;
    padding: 0;
    transition: background .15s, transform .15s;
}
.dot.active {
    background: #e8c060;
    transform: scale(1.3);
}
.slider-counter {
    position: absolute;
    top: 10px; right: 12px;
    background: rgba(26,5,2,.65);
    color: #c8b07a;
    padding: 3px 9px;
    border-radius: 10px;
    font-size: .75rem;
    border: 1px solid rgba(154,112,32,.3);
    backdrop-filter: blur(4px);
    z-index: 10;
}
body.rtl .slider-counter { right: auto; left: 12px; }
body.rtl .slider-prev { left: auto; right: 10px; }
body.rtl .slider-next { right: auto; left: 10px; }
@media (max-width: 768px) {
    .tz-slider { height: 320px; }
}

  /*
  VIDEO EMBED
════════════════════════════════════════════════ */
.video-wrap {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid #9a7020;
    box-shadow: 0 2px 12px rgba(0,0,0,.3);
}
.video-wrap iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    border: none;
}

/* ════════════════════════════════════════════════
   BOOK CARD (clean class-based)
════════════════════════════════════════════════ */
.book-card {
    background: linear-gradient(160deg, #faf4e2 0%, #f5e8c8 100%);
    border: 1px solid #c8a040;
    border-radius: 5px;
    padding: 14px 16px;
    display: flex; gap: 12px; align-items: flex-start;
    margin-bottom: 10px;
}
.book-card .book-title  { font-weight: 600; color: #1a0a02; margin-bottom: 2px; }
.book-card .book-author { font-size: .82rem; color: #5c2e10; }
.book-card .book-desc   { font-size: .86rem; color: #3d200a; margin-top: 6px; line-height: 1.5; }
.book-card .book-link   { font-size: .8rem; color: #c8942a; display: inline-block; margin-top: 5px; font-weight: 600; }
.book-card .book-rel {
    font-size: .68rem;
    background: linear-gradient(180deg, #4a1a08, #2a0d03);
    color: #e8c060; padding: 2px 9px;
    border-radius: 10px; text-transform: uppercase;
    letter-spacing: .5px; border: 1px solid #7a5810;
    white-space: nowrap;
}

/* ════════════════════════════════════════════════
   CURRENT DATE BOX (home page)
════════════════════════════════════════════════ */
.current-date-box {
    margin: 24px auto 20px;
    max-width: 400px;
    background: rgba(61,18,5,.6);
    border: 2px solid #9a7020;
    border-radius: 8px;
    padding: 14px 20px;
    text-align: center;
    backdrop-filter: blur(4px);
}
.current-date-box .date-heb {
    font-size: 1.1rem;
    font-weight: 700;
    color: #e8c060;
    margin-bottom: 4px;
    text-shadow: 0 1px 3px rgba(0,0,0,.5);
}
.current-date-box .date-greg {
    font-size: .9rem;
    color: #c8b07a;
}


/* ════════════════════════════════════════════════
   SQUARE DATE BADGE — FIXED (was circular)
════════════════════════════════════════════════ */
.date-badge-square {
    min-width: 80px;
    width: 80px;
    min-height: 80px;
    flex-shrink: 0;
    border-radius: 6px;  /* Slightly rounded square */
    background: linear-gradient(135deg, #4a1a08 0%, #2a0d03 100%);
    border: 2px solid #9a7020;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 8px 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,.3), inset 0 1px 0 rgba(232,192,96,.1);
}
.badge-day-num {
    font-size: 1.4rem;  /* Same size for consistency */
    font-weight: 700;
    color: #e8c060;
    line-height: 1;
    margin-bottom: 3px;
    text-shadow: 0 1px 3px rgba(0,0,0,.5);
}
.badge-month-name {
    font-size: .64rem;  /* Same size */
    font-weight: 700;
    color: #c8b07a;
    line-height: 1;
    letter-spacing: .4px;
    margin-bottom: 4px;
}
.badge-greg-date {
    font-size: .64rem;  /* SAME SIZE as month */
    color: #9a7850;
    line-height: 1;
    font-weight: 600;
}

/* ════════════════════════════════════════════════
   CARD SHORT INFO
════════════════════════════════════════════════ */
/* ════════════════════════════════════════════════
   TZADIK CARD — FIX TEXT OVERFLOW
════════════════════════════════════════════════ */
.tzadik-card .info {
    flex: 1;
    min-width: 0;  /* CRITICAL: allows flex item to shrink below content size */
}
.tzadik-card .info h3 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;  /* Prevent name wrapping */
}
.tzadik-card .info .short {
    font-size: .82rem;
    color: #7a5820;
    margin-top: 4px;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;  /* Single line with ellipsis */
}