/* BASE R74 Step 2 CSS extraction: original late patch style block. */
.electronic-mode-banner{display:flex;gap:12px;align-items:center;background:#ecfdf5;border:1px solid #bbf7d0;border-radius:14px;padding:12px 14px;color:#14532d;margin-bottom:12px}
.nav-link.electronic{border-left:3px solid #22c55e}
.electronic-subtree{margin-left:12px;padding-left:8px;border-left:1px dashed #cbd5e1}
.electronic-isc-node{background:#fff;border:1px solid #dbe4ef;border-radius:16px;padding:16px;margin:14px 0;box-shadow:0 8px 24px rgba(15,23,42,.06)}
.electronic-node-head{display:flex;gap:10px;align-items:flex-start}
.electronic-node-head h2,.electronic-node-head h3,.electronic-node-head h4{margin:0 0 8px 0}
.electronic-badge{font-size:12px;background:#dbeafe;color:#1e40af;border-radius:999px;padding:3px 8px;white-space:nowrap}
.electronic-badge.section{background:#f1f5f9;color:#334155}
.electronic-guide{background:#fff7ed;border-left:4px solid #fb923c;padding:10px 12px;border-radius:10px;white-space:pre-wrap}
.electronic-text{white-space:pre-wrap;line-height:1.55}
.electronic-table-wrap{overflow:auto;margin:10px 0}
.electronic-table-wrap table{border-collapse:collapse;width:100%;font-size:14px}
.electronic-table-wrap td,.electronic-table-wrap th{border:1px solid #cbd5e1;padding:6px 8px;vertical-align:top}
.electronic-asset{margin:12px 0;border:1px solid #dbe4ef;border-radius:14px;padding:8px;background:#f8fafc}
.electronic-asset img{max-width:100%;height:auto;display:block;margin:auto}
.electronic-asset figcaption{font-size:12px;color:#64748b;margin-top:6px;text-align:center}
/* === V21 FIX: move related-file toolbar to the fixed topbar, maximize document area, hide read confirmation until the user reaches the end === */
.header-row-bottom{
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:12px!important;
}
.header-action-dock{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  min-width:0!important;
  flex:1 1 auto!important;
}
.header-action-dock .action-left,
.header-action-dock .action-right{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  min-width:0!important;
}
.header-action-dock .btn{
  min-height:36px!important;
  padding:8px 12px!important;
  border-radius:12px!important;
  font-size:13px!important;
  font-weight:800!important;
  box-shadow:none!important;
}
.header-action-dock .btn.primary{
  background:#2563eb!important;
  border-color:#2563eb!important;
  color:#fff!important;
}
.header-action-dock .count-badge{
  margin-left:4px!important;
}
.actionbar{display:none!important}
.main{
  padding:0!important;
}
.content-wrap{
  padding:0!important;
}
.doc-card{
  border-radius:0!important;
  border-top:0!important;
  border-right:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
}
.word-html-main-section{
  padding:0!important;
  border-bottom:0!important;
}
.word-html-toolbar{
  display:none!important;
}
.word-html-frame{
  height:100%!important;
  min-height:0!important;
  overflow:hidden!important;
}
#content:not(.reading-complete) #acknowledgement{
  display:none!important;
}
#content.reading-complete #acknowledgement{
  display:block!important;
  flex:0 0 auto!important;
}
#acknowledgement{
  max-height:none!important;
  overflow:visible!important;
}
#acknowledgement .ack-block{
  margin:0!important;
  border-radius:0!important;
  border-left:0!important;
  border-right:0!important;
  border-bottom:0!important;
  padding:16px 18px!important;
}
@media(max-width:1120px){
  .header-row-bottom{align-items:flex-start!important;flex-direction:column!important}
  .header-action-dock{width:100%!important;justify-content:flex-start!important}
  .header-action-dock .action-left,.header-action-dock .action-right{justify-content:flex-start!important}
}


/* === V22 FIX: one-line document tool buttons, read acknowledgement only at the real end, and Word-page text width === */
.header-row-bottom{
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  flex-wrap:nowrap!important;
}
.bottom-actions{
  width:auto!important;
  flex:0 1 auto!important;
  min-width:260px!important;
  flex-wrap:nowrap!important;
  overflow:hidden!important;
}
.header-action-dock{
  flex:1 1 auto!important;
  min-width:0!important;
  max-width:none!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  flex-wrap:nowrap!important;
  white-space:nowrap!important;
}
.header-action-dock .action-left,
.header-action-dock .action-right{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  flex-wrap:nowrap!important;
  min-width:0!important;
}
.header-action-dock .btn{
  min-height:34px!important;
  height:34px!important;
  padding:6px 10px!important;
  border-radius:13px!important;
  font-size:12.5px!important;
  line-height:1!important;
  font-weight:800!important;
  box-shadow:none!important;
  white-space:nowrap!important;
  background:rgba(255,255,255,.10)!important;
  border-color:rgba(255,255,255,.22)!important;
  color:#e5edf8!important;
}
.header-action-dock .btn.ghost{
  opacity:.82!important;
  background:rgba(255,255,255,.075)!important;
  border-color:rgba(255,255,255,.18)!important;
  color:#cbd5e1!important;
}
.header-action-dock .btn.primary{
  height:38px!important;
  min-height:38px!important;
  padding:7px 14px!important;
  background:#2563eb!important;
  border-color:#3b82f6!important;
  color:#fff!important;
  border-radius:15px!important;
  white-space:nowrap!important;
}
.header-action-dock .count-badge{
  min-width:20px!important;
  height:20px!important;
  padding:0 6px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:11px!important;
  margin-left:3px!important;
}
#acknowledgement.ack-hidden{
  display:none!important;
}
#content:not(.reading-complete) #acknowledgement{
  display:none!important;
}
#content.reading-complete #acknowledgement:not(.ack-hidden){
  display:block!important;
}
.word-html-frame{
  height:100%!important;
  min-height:0!important;
}
@media(max-width:1280px){
  .header-action-dock .btn{font-size:11.5px!important;padding:6px 8px!important}
  .header-action-dock .btn.primary{padding:7px 10px!important}
  .bottom-actions{min-width:220px!important}
}
@media(max-width:1040px){
  .header-row-bottom{flex-wrap:wrap!important}
  .bottom-actions{width:100%!important;flex-wrap:wrap!important;overflow:visible!important}
  .header-action-dock{width:100%!important;justify-content:flex-start!important;overflow-x:auto!important;padding-bottom:2px!important}
  .header-action-dock .action-left,.header-action-dock .action-right{justify-content:flex-start!important}
}


/* BASE R74 Step 6: lazy electronic HTML iframe */
.word-html-lazy-section .word-html-toolbar {
  gap: 8px;
  flex-wrap: wrap;
}
.word-html-lazy-note {
  margin: 10px 0 12px;
  padding: 10px 12px;
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  color: #1e3a8a;
  border-radius: 12px;
  font-size: 13.5px;
  line-height: 1.45;
}
.word-html-frame-lazy:not([src]) {
  min-height: 180px;
  background:
    linear-gradient(135deg, rgba(37,99,235,.06), rgba(15,23,42,.03)),
    #fff;
  border: 1px dashed #bfdbfe;
}
.word-html-frame-lazy.is-loading {
  opacity: .86;
}
.word-html-frame-lazy.is-loaded {
  opacity: 1;
}


/* BASE R74 Step 7: delete/log UI */
.btn.danger{background:#ef4444;border-color:#ef4444;color:#fff}
.btn.danger:hover{background:#dc2626;border-color:#dc2626}
.delete-log-status-deleted{color:#b91c1c;font-weight:700}
.delete-log-status-active{color:#166534;font-weight:700}


/* BASE R74 Step 8: restore electronic ISC viewer display while keeping lazy performance. */
.word-html-lazy-note{display:none!important}
.word-html-frame-lazy:not([src]){background:#fff!important;border:0!important}
.word-html-frame.is-loading{opacity:1!important}
.word-html-frame.is-loaded{opacity:1!important}


/* BASE R74 Step 25: delete log position + delete/cancel reason dialog */
.log-header-btn.delete-log{
  white-space:nowrap;
}
.esms-delete-reason-backdrop{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(15,23,42,.55);
  backdrop-filter:blur(4px);
}
.esms-delete-reason-modal{
  width:min(640px,calc(100vw - 32px));
  background:#fff;
  color:#0f172a;
  border:1px solid #dbe4ef;
  border-radius:22px;
  box-shadow:0 28px 80px rgba(15,23,42,.28);
  padding:22px;
}
.esms-delete-reason-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.esms-delete-reason-kicker{
  font-size:12px;
  line-height:1.2;
  color:#64748b;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.esms-delete-reason-head h3{
  margin:4px 0 0;
  font-size:22px;
  line-height:1.25;
}
.esms-delete-reason-close{
  width:38px;
  height:38px;
  border-radius:999px;
  border:1px solid #dbe4ef;
  background:#f8fafc;
  color:#334155;
  font-size:24px;
  line-height:1;
  cursor:pointer;
}
.esms-delete-reason-file{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:12px 14px;
  border:1px solid #e2e8f0;
  background:#f8fafc;
  border-radius:16px;
  margin-bottom:14px;
}
.esms-delete-reason-file strong{
  font-size:15px;
  overflow-wrap:anywhere;
}
.esms-delete-reason-file small{
  color:#64748b;
  overflow-wrap:anywhere;
}
.esms-delete-reason-label{
  display:block;
  font-weight:800;
  margin:4px 0 8px;
}
.esms-delete-reason-textarea{
  width:100%;
  min-height:110px;
  resize:vertical;
  border:1px solid #cbd5e1;
  border-radius:16px;
  padding:12px 14px;
  font:inherit;
  outline:none;
  background:#fff;
}
.esms-delete-reason-textarea:focus{
  border-color:#2563eb;
  box-shadow:0 0 0 4px rgba(37,99,235,.14);
}
.esms-delete-reason-note{
  color:#64748b;
  font-size:13px;
  margin-top:8px;
}
.esms-delete-reason-actions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:10px;
  margin-top:18px;
  flex-wrap:wrap;
}
