/* ============================================================
   I CHING BOOK STYLES — ONLINE-SAFE (Helix/Bootstrap friendly)
   Based on standalone ic-3.css
   ============================================================ */

#iching-book{
  font-family: "Times New Roman", Georgia, serif;
  line-height: 1.3;

  /* Bottom breathing room that "can’t lose" */
  padding-bottom: 20px;
  display: flow-root; /* prevents float-collapse issues */
}

#iching-book p{ margin-bottom: 1em; }
#iching-book li{ margin-bottom: 0.3em; }

#iching-book h1,
#iching-book h2,
#iching-book h3{ line-height: 1.15; }

#iching-book sup{ line-height: 1; }  /* footnote markers */


/* ============================================================
   TOGGLES — style7 (I Ching footnote boxes)
   (In-flow float box: pushes/wraps text; not an overlay)
   ============================================================ */

#iching-book .jf_typo_toggle.style7{
  float: right;
  position: static;          /* ensure no overlay behavior */
  margin: 0 0 12px 18px;     /* space from surrounding text */
}

/* Trigger (inline styles can still override as needed) */
#iching-book .jf_typo_toggle.style7 > .trigger{
  background-color: #1a7bb9;
  width: 22px;
  float: right;
  text-align: left;
  line-height: 25px;         /* tightens visual join with container */
  position: relative;
  bottom: -2px;
}

/* Toggle container typography + padding */
#iching-book .jf_typo_toggle.style7 > .container{
  line-height: 1.3;
  padding: 5px 6px;
  background: #fff;
  border: 2px solid #1a7bb9;
  width: clamp(16rem, 60vw, 22rem);
  max-width: min(350px, calc(100vw - 70px));
  box-sizing: border-box;
  overflow-wrap: anywhere;

  height: auto !important;
  max-height: none !important;
  overflow: visible !important;

  float: right;

  /* width guard for small screens / zoom */
  max-width: min(350px, 90vw);
}

/* Clear floats after accordion bodies (if used) */
#iching-book .container.iching-acc-body::after{
  content: "";
  display: block;
  clear: both;
}

/* Tighten list spacing inside toggle boxes */
#iching-book .jf_typo_toggle.style7 .container ul{
  margin: 3px 0 0 0 !important;
  padding-left: 28px;
}

#iching-book .jf_typo_toggle.style7 .container ul.jf-chrome-typo-list.icon li{
  position: relative;
  margin-bottom: 0.1em;
  padding-left: 22px;  /* controlled indent for icon */
}

/* Nudge the list icon inside toggles */
#iching-book .jf_typo_toggle.style7 .container ul.jf-chrome-typo-list.icon span.icon{
  top: 0px !important;
}

/* Inside style7 toggles, don’t double-indent JFChrome icon lists */
#iching-book .jf_typo_toggle.style7 .container ul.jf-chrome-typo-list.icon{
  margin: 3px 0 0 0 !important;
  padding-left: 0 !important; /* KEY: remove extra padding */
}


/* ============================================================
   CRITICAL ONLINE FIX
   Accordion style2 trigger rules must NOT hit toggle triggers
   (prevents style7 +/- from breaking when nested)
   ============================================================ */

#iching-book .jf_typo_accord.style2 .jf_typo_toggle .trigger{
  display: block !important;
  align-items: initial !important;
  padding: 0 0 0 25px !important;   /* restore style7 icon lane */
  line-height: 24px !important;
  min-height: 24px !important;
  font-size: 14px !important;
  font-weight: normal !important;
}


/* ============================================================
   ACCORDION — Lines (style2) text + lead lines
   ============================================================ */

#iching-book ul.jf-chrome-typo-list.icon.line-lead span.lead-line{
  font-family: "Noto Serif","Times New Roman",Georgia,serif;
  font-size: 1.05em;
  line-height: 1.05;
  font-weight: 500;
}

#iching-book ul.line-lead li{ margin-bottom: 4px; }
#iching-book ul.line-lead li:last-child{ margin-bottom: 8px; }

#iching-book .jf_typo_accord.style2 .acc-text{
  font-family: "Noto Serif","Times New Roman",Georgia,serif;
  font-size: 0.85em;
  line-height: 1.3;
}

/* Optional: if you are using a special trigger class on line accordions */
#iching-book .jf_typo_accord.style2 .trigger{
  font-family: "Noto Serif","Times New Roman",Georgia,serif;
  font-weight: 600;
  margin: 10px 0px 5px 0px;
}

/* ONLINE-SAFE: do NOT target Bootstrap's .container globally.
   Use class="container iching-acc-body" in your HTML. */
#iching-book .container.iching-acc-body{
  margin-bottom: 5px;
  border: 2px solid #1a7bb9;
  box-sizing: border-box;
  width: 100%;
}


/* ============================================================
   JUDGMENT / IMAGE lead lines (larger lede style)
   ============================================================ */

#iching-book ul.jf-chrome-typo-list.icon.judgment-lead span.lead-line{
  font-family: "Noto Serif","Times New Roman",Georgia,serif;
  font-size: 1.1em;
  line-height: 1.1;
  font-weight: 500 !important;
}


/* ============================================================
   BLOCKQUOTES — book typography + hanging opening quote
   ============================================================ */

#iching-book blockquote.blockquote-1{
  font-family: "Noto Serif","Times New Roman",Georgia,serif;
  font-size: 0.9em;
  line-height: 1.3;
}

#iching-book blockquote.blockquote-1 p{
  margin-left: 0;
  padding-left: 0.50em; /* room for hanging quote */
  text-indent: -0.50em; /* pull quote into margin */
}

#iching-book blockquote.blockquote-1 p + p{
  padding-left: 0;
  text-indent: 0;
}


/* ============================================================
   RULER ICONS — outline + fill matching trigger background
   ============================================================ */

#iching-book .ruler-marker{
  display:inline-block;
  width:0.85em;
  height:0.85em;
  margin:0 0.25em;
  background:#ECECEC;
  border:1px solid #000;
  vertical-align:-0.08em;
  box-sizing:border-box;
}

#iching-book .ruler-marker.governing{ border-radius: 50% !important; }
#iching-book .ruler-marker.constituting{ border-radius: 0 !important; }


/* ============================================================
   TAB LAYOUT TWEAKS
   ============================================================ */

/* Default desktop pull (reading comfort) */
#iching-book .tab_content-style10{
  margin-top: -17px;
  margin-right: -35px;
  line-height: 130%;
}
#iching-book [id$="-4-style10"]{ margin-right: -30px; }

#iching-book .sc{
  font-size: 0.88em;
  letter-spacing: 0.04em;
}

/* ============================================================
   END I CHING BOOK STYLES
   ============================================================ */


/* ============================================================
   END i-ching.css
   ============================================================ */