/* Gematrixx V70 — verified correction layer */

/* 1) Equal top navigation actions */
.nav-left-group > .all-tools-nav-btn,
.nav-left-group > a[href="/subscriptions/"],
.nav-left-group > button[title="عن المنصة"]{
  box-sizing:border-box!important;
  width:96px!important;
  min-width:96px!important;
  height:48px!important;
  min-height:48px!important;
  padding:0 .55rem!important;
  margin:0 .25rem!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  line-height:1.25!important;
  white-space:normal!important;
  border-radius:8px!important;
  text-decoration:none!important;
}

/* 2) Number properties: explicit high-contrast light mode */
html[data-theme="light"] #pageNumberProperties,
html[data-theme="light"] #pageNumberProperties .np-page,
html[data-theme="light"] #pageNumberProperties .np-wrap{
  background:#f8f6ef!important;
  color:#211e18!important;
}
html[data-theme="light"] #pageNumberProperties .np-input-section,
html[data-theme="light"] #pageNumberProperties .npx-card,
html[data-theme="light"] #pageNumberProperties [class*="card"],
html[data-theme="light"] #pageNumberProperties [class*="panel"]{
  background:#fff!important;
  color:#211e18!important;
  border-color:rgba(83,65,25,.28)!important;
}
html[data-theme="light"] #pageNumberProperties input,
html[data-theme="light"] #pageNumberProperties select,
html[data-theme="light"] #pageNumberProperties textarea{
  background:#fff!important;color:#17140f!important;border-color:#8f7a43!important;
}
html[data-theme="light"] #pageNumberProperties .np-number,
html[data-theme="light"] #pageNumberProperties h1,
html[data-theme="light"] #pageNumberProperties h2,
html[data-theme="light"] #pageNumberProperties h3,
html[data-theme="light"] #pageNumberProperties strong,
html[data-theme="light"] #pageNumberProperties b{color:#4e3c05!important;text-shadow:none!important}
html[data-theme="light"] #pageNumberProperties p,
html[data-theme="light"] #pageNumberProperties span,
html[data-theme="light"] #pageNumberProperties small,
html[data-theme="light"] #pageNumberProperties label{color:#3f3a31}

/* 3) Always-visible admin quick control */
#adminCommercialQuickCard{display:block!important}
#adminCommercialQuickCard .v70-switch-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}

/* 4) Date options panel: deterministic closed/open state */
#dcOptionsPanel{
  position:fixed!important;
  top:0!important;bottom:0!important;
  right:0!important;
  width:min(360px,88vw)!important;
  max-width:88vw!important;
  transform:translateX(110%)!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
  transition:transform .22s ease,opacity .18s ease,visibility 0s linear .22s!important;
  z-index:100002!important;
}
#dcOptionsPanel.open{
  transform:translateX(0)!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  transition-delay:0s!important;
}
#dcOptionsBackdrop{position:fixed;inset:0;background:rgba(0,0,0,.46);z-index:100001;display:none}
#dcOptionsBackdrop.open{display:block}
#dcOptionsPanel .dc-opt-close{position:relative!important;z-index:3!important;pointer-events:auto!important;touch-action:manipulation!important;min-width:42px!important;min-height:42px!important}

/* 5) Tree of Life matrices: each row is a readable card */
@media(max-width:820px){
  #pageTreeOfLife .tol81-table-wrap{overflow:visible!important}
  #pageTreeOfLife .tol81-table-wrap table,
  #pageTreeOfLife .tol81-table-wrap tbody{display:block!important;min-width:0!important;width:100%!important}
  #pageTreeOfLife .tol81-table-wrap thead{display:none!important}
  #pageTreeOfLife .tol81-table-wrap tr{display:block!important;width:100%!important;margin:.75rem 0!important;padding:.55rem .8rem!important;border:1px solid var(--border)!important;border-radius:13px!important;background:var(--bg-card)!important;box-shadow:0 4px 14px rgba(0,0,0,.08)!important}
  #pageTreeOfLife .tol81-table-wrap td{display:grid!important;grid-template-columns:minmax(90px,31%) minmax(0,1fr)!important;gap:.55rem!important;align-items:start!important;width:100%!important;border:0!important;border-bottom:1px solid var(--border)!important;padding:.52rem 0!important;text-align:right!important}
  #pageTreeOfLife .tol81-table-wrap td:last-child{border-bottom:0!important}
  #pageTreeOfLife .tol81-mobile-field-label{display:block!important;color:var(--gold)!important;font-weight:800!important;text-align:right!important}
  #pageTreeOfLife .tol81-mobile-field-label::after{content:":"}
  #pageTreeOfLife .tol81-mobile-field-value{display:block!important;min-width:0!important;text-align:right!important;overflow-wrap:anywhere!important;color:var(--text-pri)!important}
}

/* 6) Tarot quick guide and generic secondary tables */
@media(max-width:700px){
  #pageTarot table.v70-mobile-cards,
  #pageTarot table.v70-mobile-cards tbody{display:block!important;width:100%!important;min-width:0!important}
  #pageTarot table.v70-mobile-cards thead{display:none!important}
  #pageTarot table.v70-mobile-cards tr{display:block!important;border:1px solid var(--border)!important;border-radius:12px!important;background:var(--bg-card)!important;padding:.55rem .75rem!important;margin:.65rem 0!important}
  #pageTarot table.v70-mobile-cards td{display:grid!important;grid-template-columns:minmax(92px,32%) 1fr!important;gap:.55rem!important;border:0!important;border-bottom:1px solid var(--border)!important;padding:.48rem 0!important;text-align:right!important}
  #pageTarot table.v70-mobile-cards td:last-child{border-bottom:0!important}
  #pageTarot table.v70-mobile-cards td::before{content:attr(data-label);color:var(--gold);font-weight:800;text-align:right}
}

/* 7) Secondary pages: contain overflow locally, never on whole page */
html,body{max-width:100%;overflow-x:hidden}
.page-view{max-width:100%;min-width:0}
.page-view img,.page-view svg,.page-view canvas{max-width:100%}
@media(max-width:820px){
  .page-view input,.page-view select,.page-view textarea{max-width:100%;box-sizing:border-box}
  .page-view .table-wrap,.page-view [class*="table-wrap"],.page-view [class*="table-container"]{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
}