/* ═══════════════════════════════════════════════════════════════════════════
   cal.css  —  Comprehensive Aramaic Lexicon unified stylesheet
   Replaces: tophalf_underline.html, tophalf_no_underline.html, and all
             other tophalf_*.html variant stylesheets, plus fullentry.css
             script-class definitions.
   Include via cal_header.php which is required by every CAL PHP program.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Font declarations ──────────────────────────────────────────────────────
   Font files live in the web root alongside the PHP programs.
   woff2 first for modern browsers; legacy formats as fallback.          */

@font-face {
    font-family: 'Talada';
    src: local('SyrCOM Talada'),
         url('syrcomtalada.woff2') format('woff2'),
         url('syrcomtalada.ttf')   format('truetype');
    font-style: normal; font-weight: normal; font-display: block;
}

@font-face {
    font-family: 'Serto';
    src: url('SyrCOMJerusalem.woff')  format('woff'),
         url('SyrCOMJerusalem.otf')   format('opentype');
    font-style: normal; font-weight: normal; font-display: block;
}

@font-face {
    font-family: 'Serto';
    src: url('SyrCOMJerusalemBold.woff2') format('woff2'),
         url('SyrCOMJerusalemBold.otf')   format('opentype');
    font-style: normal; font-weight: bold; font-display: block;
}

@font-face {
    font-family: 'Ezra';
    src: url('SILEOTSR.woff2') format('woff2');
    font-style: normal; font-weight: normal; font-display: block;
}

@font-face {
    font-family: 'BabHebrew';
    src: url('CalBab.ttf') format('truetype');
    font-style: normal; font-weight: normal; font-display: block;
}

@font-face {
    font-family: 'CPAGenizahML';
    src: url('cpagenizahml.ttf')   format('truetype');
    font-style: normal; font-weight: normal; font-display: block;
    text-rendering: optimizeLegibility;
}

/* ── Base page styles ───────────────────────────────────────────────────── */

body {
/*    background: url('/gifs/parchment_light.jpg');*/
    background: #f5f0e8;
       background-image: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 3px,
        rgba(139, 105, 20, 0.018) 3px,
        rgba(139, 105, 20, 0.018) 4px
    );
    font-family: Times, 'Times New Roman', serif;
    margin: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 6px;
    padding-right: 6px;
}
body {
    padding-inline-start: 6px;
    padding-inline-end: 6px;
}

a             { color: #0000FF; }
a:visited     { color: #800080; }
a.plain       { text-decoration: none; }
a             { text-decoration: none; }  /* site-wide: no underline */

td            { line-height: 1.5; }

/* ── Script classes ─────────────────────────────────────────────────────────
   These are the canonical class names used by fulltranslate.php and all
   CAL display programs.  Do not add per-program overrides elsewhere.

   .rom    Latin / Roman transliteration (default LTR)
   .heb    Hebrew-script dialects (Ezra SIL)
   .bheb   Babylonian-vocalized Hebrew (CalBab, denser line-height)
   .syr    Syriac Estrangelo / Eastern (Talada)
   .ssyr   Syriac Serto / Western (Serto = SyrCOM Jerusalem)
   .psyr   Christian Palestinian Aramaic (CPAGenizahML)
   .mand   Mandaic transliteration (same as .rom but italic)
   .grk    Greek (Arial Unicode MS fallback)
   .mono   Monospace (coordinates, CAL Roman, code)
   .uni    Unicode general / Cardo (transliteration with diacritics)
   ────────────────────────────────────────────────────────────────────────── */

.rom {
    font-family: Times, 'Times New Roman', serif;
    direction: ltr;
}

.heb {
    font-family: 'Ezra', 'Times New Roman', serif;
    font-size: 1.15em;
    direction: rtl;
    unicode-bidi: isolate;
    line-height: 1.6;
}

.bheb {
    font-family: 'BabHebrew', 'Ezra', serif;
    font-size: 1.1em;
    direction: rtl;
    unicode-bidi: isolate;
    line-height: 1.2;
}

.syr {
    font-family: 'Talada', 'Estrangelo Edessa', serif;
    font-size: 1.2em;
    direction: rtl;
    unicode-bidi: isolate;
    line-height: 1.6;
    word-spacing: 2px;
    -webkit-font-smoothing: antialiased;
}

.ssyr {
    font-family: 'Serto', 'Estrangelo Edessa', serif;
    font-size: 1.2em;
    direction: rtl;
    unicode-bidi: isolate;
    line-height: 1.6;
    word-spacing: 2px;
    -webkit-font-smoothing: antialiased;
}

.psyr {
    font-family: 'CPAGenizahML', serif;
    font-size: 1.2em;
    direction: rtl;
    unicode-bidi: isolate;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

.mand {
    font-family: Times, 'Times New Roman', serif;
    font-style: italic;
    direction: ltr;
}

.grk {
    font-family: 'Arial Unicode MS', Arial, sans-serif;
    direction: ltr;
}

.mono {
    font-family: 'Courier New', Courier, monospace;
    text-align: left;
    direction: ltr;
    line-height: 1.5;
}

.uni {
    font-family: Cardo, Code2000, serif;
    direction: ltr;
    line-height: 1.5;
}

/* Legacy alias — some older programs emit class="calsyr" */
.calsyr {
    font-family: SPEdessa, CalSyriac, CalSyriacTR;
    text-align: right;
}

/* ── Utility classes ────────────────────────────────────────────────────── */

.red          { color: red; }
.uncertain    { color: #999; }          /* uncertain readings in transliteration */
.syr-coord    { direction: rtl; }       /* Syriac digits inside LTR coordinates */

/* ── CAL entry display (cal_entry_web.php) ──────────────────────────────── */

.summary-card {
    background: rgba(255,255,255,0.55);
    border: 1px solid #c8b888;
    border-radius: 6px;
    padding: 12px 16px 8px;
    margin: 10px auto;
    max-width: 900px;
}

.lemma-header    { font-size: 1.1em; margin-bottom: 4px; }
.lemma-formal    { font-size: 1.3em; }
.lemma-vocalized { color: #555; font-size: 1.0em; }
.lemma-pos       { color: #888; font-size: 0.85em; font-style: italic; }
.lemma-gloss     { color: #222; }

.summary-meta    { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px; }
.parent-link     { margin-top: 4px; font-size: 0.9em; color: #555; }
.parent-pos      { color: #888; font-style: italic; font-size: 0.85em; }

/* stem/sense blocks */
.stem-block      { border: 1px solid #d0c090; border-radius: 4px; margin: 8px 0; }
.stem-header {
    background: #f5edd8;
    padding: 6px 12px;
    cursor: pointer;
    display: flex;
    align-items: baseline;
    gap: 10px;
}
.stem-header:hover { background: #ede0c0; }
.stem-body       { display: none; padding: 4px 12px 8px; }
.stem-body.open  { display: block; }
.stem-label      { font-weight: bold; font-size: 1.05em; min-width: 2em; }
.stem-name       { color: #666; font-size: 0.9em; font-style: italic; }
.stem-gloss      { color: #333; flex: 1; }
.stem-count      { color: #888; font-size: 0.85em; }
.stem-chevron    { margin-left: auto; color: #888; transition: transform .2s; }
.stem-chevron.open { transform: rotate(90deg); }

.meaning-block   { padding: 4px 0 4px 8px; border-left: 3px solid #d0c090; margin: 4px 0; }
.sub-meaning     { padding: 2px 0 2px 24px; }
.meaning-row     { display: flex; gap: 8px; align-items: baseline; }
.meaning-num     { font-weight: bold; min-width: 2em; color: #666; }
.sub-label       { color: #888; min-width: 1.5em; }
.meaning-text    { flex: 1; }
.meaning-dial    { font-size: 0.82em; color: #777; margin-top: 2px; }


/* getlex */
@media (max-width: 768px) {
  table.lex-results td { display: block; width: 100%; }
}


/* citations */
.cit-toggle {
    background: none; border: none; cursor: pointer;
    color: #557; font-size: 0.88em; padding: 2px 0 2px 16px;
}
.cit-toggle:hover { color: #225; }
.cit-icon        { font-size: 0.75em; display: inline-block; transition: transform .2s; }
.cit-icon.open   { transform: rotate(90deg); }
.cit-list        { display: none; padding: 2px 0 4px 24px; }
.cit-list.open   { display: block; }
.cit-item        { display: inline; font-size: 0.95em; line-height: 1.7; }
.cit-sep         { color: #999; }
.cit-ref-link    { color: #557; font-size: 0.85em; font-family: 'Courier New', monospace; }
.cit-ref-plain   { color: #888; font-size: 0.85em; font-family: 'Courier New', monospace; }
.cit-ref-inline  { }
.cit-text        { }
.cit-script      { }
.cit-xlat { color: #666; font-style: italic; font-size: 0.9em; font-family: Times, 'Times New Roman', serif; }
.no-cite         { color: #aaa; font-style: italic; }
.gloss-note      { color: #555; font-size: 0.88em; margin: 2px 0 4px; }
.gloss-note-icon { margin-right: 4px; }

/* section blocks (form, kwic, endnotes, derivs) */
.section-block   { border: 1px solid #d0c090; border-radius: 4px; margin: 8px 0; }
.section-header {
    background: #f5edd8;
    padding: 6px 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
}
.section-header:hover { background: #ede0c0; }
.section-body    { display: none; padding: 6px 14px 10px; }
.section-body.open { display: block; }
.section-icon    { font-size: 1.1em; }
.section-label   { font-weight: bold; flex: 1; }
.section-text    { line-height: 1.7; }

/* derivatives */
.deriv-list      { margin: 4px 0; padding-left: 1.2em; }
.deriv-root      { list-style: none; padding-left: 0; }
.deriv-item      { margin: 3px 0; }
.deriv-link      { color: #335; }
.deriv-pos       { color: #888; font-style: italic; font-size: 0.85em; }
.deriv-gloss     { color: #555; font-size: 0.9em; }

/* dictionary cross-references */
.dict-refs       { margin: 6px 0; font-size: 0.88em; line-height: 2; }
.dict-ref        { display: inline-block; margin: 2px 4px; padding: 1px 6px;
                   border: 1px solid #c8b888; border-radius: 3px; background: #fdf8ee; }
.dict-abbr       { font-weight: bold; cursor: default; }
.dict-link       { text-decoration: none; color: inherit; }
.bib-link        { margin-top: 6px; }

/* KWIC */
.kwic-list       { padding: 4px 0; }
.kwic-item       { margin: 4px 0; }
.kwic-link       { color: #335; }
.kwic-stem-label { font-weight: bold; }
.kwic-stem-name  { color: #888; font-style: italic; font-size: 0.9em; }

/* script preference bar */
.script-pref-bar {
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 8px; font-size: 0.88em;
}
.script-pref-icon  { font-size: 1.1em; color: #888; }
.script-pref-notice {
    font-size: 0.85em; color: #664; background: #fdf5d0;
    border: 1px solid #d0b860; border-radius: 3px;
    padding: 2px 8px; margin-top: 4px;
}
.script-pref-notice-icon { margin-right: 4px; }
.script-pref-reset { color: #557; }

/* tags (stem jump buttons) */
.tag {
    display: inline-block; padding: 2px 8px; border-radius: 3px;
    font-size: 0.85em; cursor: pointer; border: 1px solid #c8b888;
    background: #fdf8ee;
}
.tag:hover       { background: #ede0c0; }
.stem-tag        { font-weight: bold; }

/* parent link */
.parent-lemma-link { color: #335; }

/* ── Text browser / showachapter display ────────────────────────────────── */

table.text-display td { line-height: 1.7; vertical-align: top; }

/* Poetic half-lines (CAL Roman code "|"): two hemistichs of one poetic
   line, laid out with flexbox INSIDE the existing text td rather than as
   separate table cells. table-layout:auto recalculates column widths from
   every row's content, so splitting a poetic line into its own <td> made
   the column boundary drift row to row on narrow screens, since each
   line's two-halves ratio differs. Keeping both halves in one cell and
   flexing them avoids that.
   Each half keeps its own natural (max-content) width -- flex-grow:0 and
   flex-shrink:0 mean a half is never squeezed to fit, so if the two
   halves don't both fit on one line, the whole second half wraps down to
   its own line as a single unit (never splitting mid-half). margin on
   the second half indents it consistently whether it's sitting beside
   the first half or stacked under it. max-width:100% is only a fallback
   for the rare case where a single half alone is too wide for the
   viewport, so it still wraps internally rather than overflowing. */
.poetic-line {
    display: flex;
    flex-wrap: wrap;
    row-gap: 0;
}
.poetic-half {
    flex: 0 0 auto;
    max-width: 100%;
}
.poetic-half + .poetic-half {
    margin-inline-start: 2em;
}
@media (max-width: 480px) {
    .poetic-line { flex-direction: column; }
}


/* ── Page banner and footer ─────────────────────────────────────────────── */
.cal-banner {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px 4px;
    width: 100%;
    box-sizing: border-box;
}
.cal-banner-inner {
    flex: 0 0 auto;
    order: 2;
}
.cal-nav-side {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    font-size: 0.9em;
}
.cal-nav-back   { text-align: left; order: 1; }
.cal-nav-search { text-align: right; order: 3; }
.cal-nav-link   { color: #557; white-space: nowrap; }