/* UI font: Inter (static/vendor/fonts/inter/, SIL OFL 1.1, latin + latin-ext,
   variable weight). Tailwind's font-sans (tailwind.config.js) puts it on the whole
   interface; Scripture/count text keeps its own fonts (Preferences, .lex-h, .lex-g). */
@font-face { font-family:'Inter'; font-style:normal; font-weight:100 900; font-display:swap;
  src:url('/static/vendor/fonts/inter/inter-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Inter'; font-style:normal; font-weight:100 900; font-display:swap;
  src:url('/static/vendor/fonts/inter/inter-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Inter'; font-style:italic; font-weight:100 900; font-display:swap;
  src:url('/static/vendor/fonts/inter/inter-italic-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Inter'; font-style:italic; font-weight:100 900; font-display:swap;
  src:url('/static/vendor/fonts/inter/inter-italic-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF; }
html, body { max-width:100%; overflow-x:clip; }
.strong-badge { font-size:.65rem; vertical-align:super; color:#dc2626; margin-left:2px; white-space:nowrap; cursor:pointer; direction:ltr; unicode-bidi:isolate; }
/* Texto del versículo por defecto: negro en claro, blanco en oscuro.
   Un color personalizado (style inline de prefs.color) sigue ganando. */
#verses { color:#000; max-width:100%; overflow-wrap:anywhere; word-break:break-word; }
.dark #verses { color:#fff; }
#verses .wclick:not(.lexeme) { color:inherit; }
#verses .group { max-width:100%; }
#verses .cursor-copy, #verses p { min-width:0; overflow-wrap:anywhere; word-break:break-word; }
.lex-h.lexeme, .lex-g.lexeme { font-family:var(--lfont,var(--sfont,inherit)); color:var(--lcolor,var(--scolor,#15803d)); font-size:var(--lsize,inherit); }
/* lexeme font per script (Texto): Hebrew --lfont, Greek --lfont-g, Ge'ez --lfont-e;
   an empty Greek / Ge'ez choice falls back to the Hebrew one */
.lex-g.lexeme { font-family:var(--lfont-g,var(--lfont,var(--sfont,inherit))); }
.lex-e.lexeme { font-family:var(--lfont-e,var(--lfont,var(--sfont,inherit))); }
.dark .lex-h.lexeme, .dark .lex-g.lexeme { color:var(--lcolor,var(--scolor,#fde047)); }
.translit { font-size:.72em; opacity:.65; font-style:italic; }
.strong-badge { font-family:var(--sfont,inherit); color:var(--scolor,#dc2626); font-size:var(--ssize,.65rem); }
/* Added words («gloss» * or *gloss*): clearly smaller, gray in both themes. */
.added { font-size:.7em; color:#6b7280; }
.dark .added { color:#9ca3af; }
/* Text pref "Ver añadidos" off: added words hide everywhere they paint. */
body.noadded .added { display:none !important; }
.wclick { cursor:pointer; border-radius:2px; }
.wclick:hover { text-decoration:underline; text-decoration-color:#b45309; text-underline-offset:3px; }
.dark .strong-badge { color:var(--scolor,#dc2626); }
/* Eslabones dentro de la definición Strong: rojos y subrayados. */
#strongBody a[href^="S:"] { color:#dc2626; text-decoration:underline; text-underline-offset:2px; }
.verse-num { font-size:.7rem; font-weight:800; color:#b45309; vertical-align:super; margin-right:.35rem; }
mark { background:#fde68a; border-radius:2px; padding:0 2px; }
.dark mark { background:#92400e; color:#fff; }
::-webkit-scrollbar { width:10px; height:10px; } ::-webkit-scrollbar-thumb { background:#a8a29e; border-radius:8px; } .dark ::-webkit-scrollbar-thumb { background:#44403c; }
.chap-btn.active { background:#b45309 !important; color:white !important; border-color:#b45309 !important; }
/*TODAS-LAS-FUENTES-AUTO*/
/* Lexema por defecto: verde en claro, amarillento en oscuro.
   Un color personalizado (--lcolor/--scolor) sigue ganando. */
.lex-h { font-family:'MyHeb','Shlomo','SILEOT',serif; font-size:1.15em; color:var(--lcolor,var(--scolor,#15803d)); }
.dark .lex-h { color:var(--lcolor,var(--scolor,#fde047)); }
.lex-g { font-family:'Tahoma Local',Tahoma,Georgia,serif; color:var(--lcolor,var(--scolor,#15803d)); }
.dark .lex-g { color:var(--lcolor,var(--scolor,#fde047)); }
/* Conteo de ciclos: hebreo de los días en blanco sobre las celdas de color. */
#calView a .lex-h { color:#fff !important; }
.orig-h { font-family:'MyHeb','Shlomo','SILEOT',serif; font-size:1.25em; }
.orig-g { font-family:'Tahoma Local',Tahoma,Georgia,serif; }
body.vfont .orig-h { font-family:var(--lfont,var(--vfont),'MyHeb','Shlomo','SILEOT',serif); }
.hname { font-family:var(--lfont,inherit); }
body.vfont .orig-g { font-family:var(--vfont),'Tahoma Local',Tahoma,Georgia,serif; }
body.reading #sidebar, body.reading #chapBar { display:none !important; }
body.reading #verses { font-size:1.4rem; line-height:2.5rem; }
body.reading #reader { padding:2.5rem 3rem; }
/* En celular, lectura compacta: solo 10px de margen interno. */
@media (max-width: 767px){
  #reader { padding:10px !important; }
  body.reading #reader { padding:10px !important; }
  body.reading #verses { font-size:1.15rem; line-height:2rem; }
  #verses .group { margin-left:0 !important; margin-right:0 !important; }
}
/* Edicion en header: junto a pantalla completa en todos los anchos. */
@media (min-width: 768px){
  body.edit-mode #editModeBtn { background:#fcd34d !important; }
}
/* El panel lector en fullscreen ocupa la ventana y scrollea propio. */
#reader:fullscreen { max-height:100vh; overflow-y:auto; border-radius:0; margin:0; padding-left:2rem; padding-right:2rem; }
/* Editor siempre modal como en celular: overlay centrado en todos los anchos. */
#editor { display:none !important; }
body.editor-modal #editor.editor-open-mobile {
  display:block !important;
  position: fixed; z-index: 50;
  left: 50%; top: 50%; transform: translate(-50%,-50%);
  width: min(92vw, 520px); max-height: 85vh; overflow-y: auto;
  margin: 0;
  scrollbar-width: thin;
}
#editor.editor-open-mobile::-webkit-scrollbar { width:4px; }
#editor.editor-open-mobile::-webkit-scrollbar-thumb { background:#a8a29e; border-radius:4px; }
body.editor-modal::before {
  content:''; position: fixed; inset: 0;
  background: rgba(0,0,0,.6); z-index: 25;
}
/* Lapices por versiculo (y del titulo): solo visibles en modo edicion, en movil y PC. */
.editBtn, #titleEditBtn { display:none !important; }
body.edit-mode .editBtn { display:inline-block !important; opacity:1 !important; }
body.edit-mode #titleEditBtn { display:inline-block !important; }
@media (max-width: 767px){ body.edit-mode #titleEditBtn { display:none !important; } }
/* Texto centrado en fullscreen: columna estrecha al centro (el modal Strong queda fuera). */
#reader:fullscreen > div:not(#strongPanel), #reader:fullscreen > #verses { max-width:46rem; margin-left:auto; margin-right:auto; width:100%; }
#printRoot{ display:none; }
@media print{
  @page{ size:auto; margin:0; }
  header, #sidebar, #editor, #strongPanel, #chapBar, #results, #toast, #textPrefs, #reader, #calView{ display:none !important; }
  body{ background:#fff !important; }
  #printRoot{ display:block !important; color:#000; padding:12mm; max-width:100% !important; }
  #printRoot article{ break-inside:auto; }
  /* Conteo de ciclos: las celdas usan aspect-square + overflow-hidden + truncate
     pensados para pantalla; en papel recortan el hebreo (niqqud) y fijan anchos.
     En impresión: alto natural, sin recortes, texto completo. */
  #printRoot .aspect-square{ aspect-ratio:auto !important; height:auto !important; min-height:0 !important; overflow:visible !important; padding:4px !important; }
  #printRoot .overflow-hidden{ overflow:visible !important; }
  #printRoot .truncate{ overflow:visible !important; text-overflow:clip !important; white-space:normal !important; }
  #printRoot .grid{ gap:4px !important; }
  #printRoot a{ break-inside:avoid; }
  *{ -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important; }
}
.book-btn.active { background:#fffbeb; border-left:4px solid #b45309; }
.dark .book-btn.active { background:#292524; }
/* Login: maquetación crítica sin depender del vendor (caché vieja). */
/* Escribas: barra lateral marrón (no depende del vendor). */
.panel-side{ background:#3D3530; border-left:4px solid #C65D3B; }
.panel-item{ display:flex; align-items:center; gap:1rem; width:100%; padding:.75rem 1.5rem; color:#F5F1E8; border-left:4px solid transparent; font-weight:600; font-size:.875rem; text-transform:uppercase; letter-spacing:.05em; text-align:left; background:transparent; }
.panel-item:hover{ background:#4A423C; color:#fff; border-left-color:#C65D3B; }
.panel-item.active{ background:#4A423C; color:#fff; border-left-color:#C65D3B; }
.panel-item i{ width:1.5rem; font-size:1.125rem; line-height:1.75rem; color:#B8A99A; }
.panel-item:hover i, .panel-item.active i{ color:#C65D3B; }
/* Escribas: navegación por secciones (sidebar 300px). */
.panel-side .tabBtn:hover{ background:#4A423C; color:#fff; border-left-color:#C65D3B; }
.panel-side .tabBtn:hover i{ color:#C65D3B; }
.panel-side .tabBtn.active{ background:#4A423C; color:#fff; border-left-color:#C65D3B; }
.panel-side .tabBtn.active i{ color:#C65D3B; }
.panel-side .tabBtn.drag-over{ outline:2px dashed #C65D3B; outline-offset:-2px; }
.login-wrap { width:100%; max-width:320px; margin-left:auto; margin-right:auto; }
.login-card { width:100%; }

/* Selector de libro: transición al cambiar de ventana (libro -> capítulos -> versículos). */
@keyframes pickerInR { from { opacity:0; transform:translateX(28px); } to { opacity:1; transform:none; } }
@keyframes pickerInL { from { opacity:0; transform:translateX(-28px); } to { opacity:1; transform:none; } }
.anim-in-r { animation: pickerInR .22s ease-out both; }
.anim-in-l { animation: pickerInL .22s ease-out both; }

/* Panel texto original: barra de scroll fina. */
#origBody { scrollbar-width: thin; }
#origBody::-webkit-scrollbar { width:4px; }
#origBody::-webkit-scrollbar-thumb { background:#a8a29e; border-radius:4px; }

/* Vista dividida: lector en la mitad superior con scroll propio, sin superponerse al original. */
body.orig-open { overflow: hidden; }
/* Modales: bloquear el scroll de fondo. */
body.books-open, body.editor-modal, body.strong-open { overflow: hidden; }
body.orig-open #reader {
  position: fixed; left: 0; right: 0; top: 80px;
  height: calc(50vh - 80px);
  margin: 0; border-radius: 0;
  overflow-y: auto; z-index: 30;
}

/* Al buscar/navegar a un versículo, dejar espacio para el header fijo. */
#verses > div { scroll-margin-top: 88px; }
@media (min-width: 768px){ #verses > div { scroll-margin-top: 140px; } }
/* Conteo de ciclos: las letras hebreas heredan el color fijo del tema
   (negro en claro, blanco en oscuro), no el color del lexema. */
#calView .lex-h { color: inherit; }
/* Conteo de ciclos: fuente y tamaño propios (vars que pone calendar.js).
   Reglas manuales: el vendor Tailwind no trae compiladas estas clases. */
#calView .text-\[length\:var\(--calsize\)\] { font-size: var(--calsize, 0.95rem); }
@media (max-width: 767px){
  /* Botones de tamaño: vista previa contenida para no generar scroll. */
  #sizeRow .swSz, #lexSizeRow .swSzL,
  #strongSizeRow .swSzN, #countSizeRow .swSzC {
    font-size:1rem !important;
    padding:.4rem .6rem !important;
  }
  /* Menú Conocimiento en celular: pestañas en fila, sin borde lateral en la activa. */
  #archView aside .book-btn.active { border-left:none; }
}

/* Reader in element fullscreen: only the minimize button stays in the toolbar. */
#reader:fullscreen #pdfRow, #reader:fullscreen #niqqudBtn, #reader:fullscreen #editModeBtn, #reader:fullscreen #titleEditBtn,
#reader:-webkit-full-screen #pdfRow, #reader:-webkit-full-screen #niqqudBtn, #reader:-webkit-full-screen #editModeBtn, #reader:-webkit-full-screen #titleEditBtn { display: none !important; }

/* Strong modal: "Editar significado" solo en modo edicion (donde existe el boton de edicion del lector). */
body:has(#editModeBtn):not(.edit-mode) .strongEditOnly { display: none !important; }

/* Herramientas del lector (titulo/niqqud/exportar) dentro de la barra de Capitulos.
   En movil la barra de capitulos sigue oculta, pero se muestra solo este bloque. */
@media (max-width: 767px){
  #chapBar { display:block !important; }
  #chapBar.hidden { display:none !important; }
  #chapBar #chapHead, #chapBar #chapGrid { display:none !important; }
  #chapBar #readerTools { margin-bottom:0; padding-bottom:0; border-bottom:0; }
}
body:not(:has(#reader:not(.hidden))) #chapBar #readerTools { display:none !important; }

/* PDF/impresion: el menu del lector (titulo, Niqqud, Exportar) nunca sale.
   Va al final para ganarle a la regla movil de #chapBar. */
@media print{
  #chapBar, #chapBar #readerTools, #readerTools { display:none !important; }
}
/* Count detail view (static/js/lector/calendar.js): Hebrew keeps the text color,
   and admin rich text (description, justification, month notes) gets its
   typography back after Tailwind's reset. Also used by the escribas editor. */
#calDetailView .lex-h { color:inherit; }
.cal-rich { line-height:1.75; overflow-wrap:anywhere; }
.cal-rich > * + * { margin-top:.75em; }
.cal-rich h2 { font-size:1.35em; font-weight:600; }
.cal-rich h3 { font-size:1.2em; font-weight:600; }
.cal-rich h4 { font-size:1.05em; font-weight:600; }
.cal-rich ul { list-style:disc; padding-left:1.5em; }
.cal-rich ol { list-style:decimal; padding-left:1.5em; }
.cal-rich [dir="rtl"] ul, .cal-rich [dir="rtl"] ol, .cal-rich ul[dir="rtl"], .cal-rich ol[dir="rtl"] { padding-left:0; padding-right:1.5em; }
.cal-rich blockquote { border-left:4px solid #d4af37; padding-left:1em; font-style:italic; opacity:.9; }
.cal-rich a { color:#c65d47; text-decoration:underline; text-underline-offset:2px; }
.cal-rich hr { border-color:#e8dcc8; }
.cal-rich code, .cal-rich pre { font-family:ui-monospace,monospace; font-size:.9em; background:rgba(0,0,0,.05); border-radius:4px; padding:.1em .3em; }
.cal-rich pre { padding:.75em; overflow-x:auto; }
.dark .cal-rich code, .dark .cal-rich pre { background:rgba(255,255,255,.08); }


/* Conocimiento header: the article filters only apply to the article list. */
#archView:has(#archArticles.hidden) .arch-filters,
#archView:has(#archBrowser.hidden) .arch-filters { display: none; }

/* Article maximize (#archFsBtn): the article area fills the screen and scrolls;
   other articles and topics opened from it stay maximized. */
#archArticles:fullscreen,
#archArticles:-webkit-full-screen { overflow-y: auto; background: #f5f5f4; }
.dark #archArticles:fullscreen,
.dark #archArticles:-webkit-full-screen { background: #0c0a09; }
/* maximized: the article IS the screen, no card edges (rounded corners,
   shadow, outer gray band) */
#archArticles:fullscreen, #archArticles:-webkit-full-screen { background: #fff; }
.dark #archArticles:fullscreen, .dark #archArticles:-webkit-full-screen { background: #1c1917; }
#archArticles:fullscreen > article, #archArticles:-webkit-full-screen > article {
  border-radius: 0; box-shadow: none; border: 0; margin: 0; min-height: 100%; }

/* Count: Hebrew names fit their small day boxes on phones, one word per line. */
@media (max-width: 639px) {
  #calView .aspect-square .lex-h {
    font-size: 9px !important;
    line-height: 1.05;
    white-space: normal !important;
    overflow: visible;
    word-spacing: 100vw;
    width: 100%;
  }
}

/* Count: Gregorian weekdays show only their initial on phones. */
.wd-ini { display: none; }
@media (max-width: 639px) {
  .wd-full { display: none; }
  .wd-ini { display: inline; }
}

/* PDF / ODT studios (reader, count, articles): the page behind does not scroll
   and its scrollbar is hidden while the window is open */
html:has(#bxModal), html:has(#bxModal) body { overflow: hidden !important; }

/* Strong panel: words in the original script use the lexeme font of the text prefs */
#strongBody .strong-lexfont { font-family: var(--lfont, var(--sfont, inherit)); }
#strongBody .strong-lexfont.lf-g { font-family: var(--lfont-g, var(--lfont, var(--sfont, inherit))); }
#strongBody .strong-lexfont.lf-e { font-family: var(--lfont-e, var(--lfont, var(--sfont, inherit))); }
/* knowledge article in full screen: the element itself must scroll (phones) */
#archArticles:fullscreen { overflow-y: auto !important; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; touch-action: pan-y pinch-zoom; height: 100vh; height: 100dvh; width: 100vw; }
#archArticles:-webkit-full-screen { overflow-y: auto !important; -webkit-overflow-scrolling: touch; touch-action: pan-y pinch-zoom; height: 100vh; width: 100vw; }
#archArticles:fullscreen > article { min-height: 100%; height: auto; overflow: visible; }