/* =========================================================
   Edge Finder — SINGLE CLEAN STYLESHEET (RESET + LAYOUT)
   Replace the ENTIRE file with this.
   ========================================================= */

/* --- Safety reset for ONLY the Edge Finder area --- */
.edge-nav-wrap,
.edge-nav-wrap *{
  box-sizing: border-box !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
}

/* Kill theme columns/multi-column behavior inside Edge Finder */
.edge-nav-wrap,
.edge-nav-wrap .edge-nav-card,
.edge-nav-wrap form,
.edge-nav-wrap .edge-nav-q,
.edge-nav-wrap .edge-nav-q--context,
.edge-nav-wrap .edge-nav-context-options,
.edge-nav-wrap .edge-nav-block{
  columns: auto !important;
  column-count: 1 !important;
  column-width: auto !important;
  -webkit-columns: auto !important;
  -webkit-column-count: 1 !important;
  -webkit-column-width: auto !important;
}

/* Also kill grid tricks some themes apply to form content */
.edge-nav-wrap form,
.edge-nav-wrap .edge-nav-context-options,
.edge-nav-wrap .edge-nav-block{
  display: block !important;
}

/* Force left alignment inside Edge Finder even if theme centers forms */
.edge-nav-wrap,
.edge-nav-wrap .edge-nav-card,
.edge-nav-wrap form{
  text-align: left !important;
}

/* ---- Card + typography ---- */
.edge-nav-wrap{
  max-width: 920px;
  margin: 0 auto;
  padding: 0 18px;
}

.edge-nav-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 18px;
  padding: 34px 40px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
}

.edge-nav-title{
  font-size: 44px;
  line-height: 1.12;
  letter-spacing: -0.01em;
  margin: 0 0 8px 0;
}

.edge-nav-subtitle{
  font-size: 18px;
  line-height: 1.6;
  opacity: 0.85;
  margin: 0 0 22px 0;
}

.edge-nav-title{
  font-size: 44px;
  line-height: 1.12;
  letter-spacing: -0.01em;
  margin: 0 0 8px 0;

  border-left: 6px solid #1f6fd6;
  padding-left: 14px;
}



.edge-nav-hr,
.edge-nav-card hr{
  border: 0;
  height: 1px;
  background: rgba(0,0,0,0.10);

  /* more breathing room below intro text */
  margin: 32px 0 30px;
}


.edge-nav-divider{
  border: 0;
  height: 1px;
  background: rgba(0,0,0,0.10);
  margin: 32px 0 10px; /* more space above, slight space below */
}



.edge-nav-card p,
.edge-nav-card li{
  font-size: 18px;
  line-height: 1.65;
  color: #111;
}

.edge-nav-card h3{
  font-size: 24px;
  margin: 26px 0 10px;
}

.edge-nav-instr{
  font-size: 20px;
  line-height: 1.45;
  margin: 0 0 14px 0;
}

.edge-nav-instr-sub{
  display: block;
  font-size: 18px;
  opacity: 0.75;
  margin-top: 6px;
}

/* =========================================================
   TYPOGRAPHY NORMALIZATION — QUESTIONS vs ANSWERS
   ========================================================= */

/* Question text (lead-in + numbered questions) */
.edge-nav-wrap .edge-nav-instr,
.edge-nav-wrap .edge-nav-block h3{
  font-size: 20px !important;   /* slightly smaller than before */
  line-height: 1.4 !important;
  font-weight: 700 !important;
}

/* Tighten only the first question block after the divider */
.edge-nav-wrap .edge-nav-block:first-of-type{
  margin-top: 18px !important;
}

/* Answer text (ALL radio + checkbox options) */
.edge-nav-wrap .edge-row > label{
  font-size: 18px !important;   /* slightly larger for readability */
  line-height: 1.55 !important;
  font-weight: 400 !important;
}

/* Helper text like “Select all that apply” */
.edge-nav-wrap .edge-nav-help{
  font-size: 16px !important;
  font-weight: 500 !important;   /* lighter than questions */
  color: #444 !important;        /* slightly softer */
}


/* ---- Option row layout (this is the key) ----
   We hard-reset floats/widths on BOTH input and span to prevent
   “checkbox centered + text in skinny right column”
*/
.edge-nav-wrap label.edge-nav-radio-row,
.edge-nav-wrap label.edge-option{
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 14px !important;

  width: 100% !important;
  max-width: 100% !important;

  margin: 14px 0 !important;
  padding: 0 !important;

  float: none !important;
  clear: both !important;

  cursor: pointer !important;
  text-align: left !important;
}

/* Inputs: keep them on the left, never centered */
.edge-nav-wrap label.edge-nav-radio-row > input[type="radio"],
.edge-nav-wrap label.edge-option > input[type="checkbox"],
.edge-nav-wrap label.edge-option > input[type="radio"]{
  flex: 0 0 auto !important;

  display: inline-block !important;
  position: static !important;
  float: none !important;

  margin: 0.33em 0 0 0 !important;

  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
}

/* Text span: force it to become the full-width wrapping column */
.edge-nav-wrap label.edge-nav-radio-row > span,
.edge-nav-wrap label.edge-option > span{
  display: block !important;

  flex: 1 1 0% !important;
  min-width: 0 !important;

  width: auto !important;
  max-width: 100% !important;

  float: none !important;

  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;

  font-size: 18px !important;
  line-height: 1.55 !important;
  color: #222 !important;
}

/* ---- Buttons ---- */
.edge-nav-actions{
  margin-top: 22px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}

.edge-nav-wrap button{
  appearance: none;
  border: 1px solid rgba(0,0,0,0.12);
  background: #2f2f2f;
  color: #fff;
  border-radius: 12px;
  padding: 12px 16px;
  font-size: 14px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
}

.edge-nav-wrap button:hover{
  filter: brightness(1.06);
}

/* Subtle emphasis for Save / Print link */
.edge-nav-wrap .edge-nav-print-btn{
  background: #1f6fd6 !important;
  border-color: #1f6fd6 !important;
  color: #ffffff !important;
}

.edge-nav-wrap .edge-nav-print-btn:hover{
  filter: brightness(1.08);
}


/* ---- Mobile ---- */
@media (max-width: 820px){
  .edge-nav-card{ padding: 26px 20px; }
  .edge-nav-title{ font-size: 36px; }
}

/* ---- Print ---- */
@media print{
  .edge-nav-actions,
  .edge-nav-wrap .no-print{
    display: none !important;
  }
  .edge-nav-card{
    box-shadow: none !important;
    border: 0 !important;
    padding: 0 !important;
  }
}

/* =========================================================
   STEP D — FORCE SPAN TO BE THE FLEX ITEM (wins over theme)
   Paste at VERY BOTTOM of edge-navigator.css
   ========================================================= */

/* Make absolutely sure the label is the flex container */
.edge-nav-wrap .edge-nav-card .edge-nav-block label.edge-option,
.edge-nav-wrap .edge-nav-card .edge-nav-q--context .edge-nav-context-options label.edge-nav-radio-row{
  display: flex !important;
}

/* Force the span to be a real flex item and fill the row */
.edge-nav-wrap .edge-nav-card .edge-nav-block label.edge-option > span,
.edge-nav-wrap .edge-nav-card .edge-nav-q--context .edge-nav-context-options label.edge-nav-radio-row > span{
  flex: 1 1 0% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  width: auto !important;

  /* kill any theme layout constraint */
  float: none !important;
  display: block !important;
}

/* If the theme sets the span to inline/inline-block with a weird width, override */
.edge-nav-wrap .edge-nav-card .edge-nav-block label.edge-option > span,
.edge-nav-wrap .edge-nav-card .edge-nav-q--context .edge-nav-context-options label.edge-nav-radio-row > span{
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

/* =========================================================
   STEP E — FORCE EACH OPTION ROW TO BE FULL-WIDTH
   ========================================================= */

/* Ensure the question block is not a grid/columns container */
.edge-nav-wrap .edge-nav-card .edge-nav-block{
  display: block !important;
}

/* Force each label row to take the full line */
.edge-nav-wrap .edge-nav-card .edge-nav-block label.edge-option{
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;

  justify-content: flex-start !important;
  align-items: flex-start !important;

  /* critical if parent is a grid */
  justify-self: stretch !important;
}

/* Prevent the input from being treated as a centered block */
.edge-nav-wrap .edge-nav-card .edge-nav-block label.edge-option > input[type="checkbox"]{
  flex: 0 0 auto !important;
  align-self: flex-start !important;
  margin: 0.33em 14px 0 0 !important;
}

/* If any “column” system is leaking in, kill it here */
.edge-nav-wrap .edge-nav-card .edge-nav-block,
.edge-nav-wrap .edge-nav-card .edge-nav-block *{
  columns: auto !important;
  column-count: 1 !important;
  column-width: auto !important;
}

/* =========================================================
   FINAL FIX — break theme form layout
   ========================================================= */

.edge-option-row{
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 14px !important;

  width: 100% !important;
  max-width: 100% !important;
}

.edge-option-row input{
  flex: 0 0 auto !important;
  margin-top: 0.33em !important;
}

.edge-option-row span{
  flex: 1 1 auto !important;
  min-width: 0 !important;

  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

/* ============================
   FIX: Reliability Context rows
   (.edge-row wrapper)
   ============================ */

.edge-nav-wrap .edge-row{
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  column-gap: 14px !important;
  align-items: start !important;

  width: 100% !important;
  margin: 14px 0 !important;
}

.edge-nav-wrap .edge-row > input[type="radio"]{
  grid-column: 1 !important;
  justify-self: start !important;

  display: inline-block !important;
  margin: 0.33em 0 0 0 !important;

  float: none !important;
  position: static !important;
  transform: none !important;
}

.edge-nav-wrap .edge-row > label{
  grid-column: 2 !important;
  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  width: 100% !important;
  max-width: 100% !important;

  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

/* Universal option row (radio + checkbox) */
.edge-nav-wrap .edge-row{
  display: grid !important;
  grid-template-columns: 22px minmax(0,1fr) !important;
  column-gap: 14px !important;
  align-items: start !important;

  width: 100% !important;
  max-width: 100% !important;

  margin: 14px 0 !important;
}

.edge-nav-wrap .edge-row > input{
  grid-column: 1 !important;
  margin-top: 0.33em !important;
}

.edge-nav-wrap .edge-row > label{
  grid-column: 2 !important;
  margin: 0 !important;

  width: 100% !important;
  min-width: 0 !important;

  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;

  font-size: 18px !important;
  line-height: 1.55 !important;
}

/* =========================================================
   POLISH PASS — typography, spacing, button color, control size
   Paste at VERY BOTTOM of edge-navigator.css
   ========================================================= */

/* 1) Reliability question (and all H3 prompts) — normalize sizing */
.edge-nav-wrap .edge-nav-card h3{
  font-size: 22px !important;     /* reduces Reliability prompt slightly */
  line-height: 1.35 !important;
  margin: 22px 0 10px !important;
}

/* If you want other questions slightly larger than Reliability, use this instead:
.edge-nav-wrap .edge-nav-block h3{ font-size: 22px !important; }
.edge-nav-wrap .edge-nav-q--context h3{ font-size: 22px !important; }
*/

/* 2) Instruction/helper lines — closer to their question, more separation above */
.edge-nav-wrap .edge-nav-help{
  margin: 26px 0 6px !important;  /* more space above, tighter below */
}

.edge-nav-wrap .edge-nav-help strong{
  display: block !important;
  font-weight: 500 !important;   /* prevents heavy bold */
}


/* Tighten spacing right after the helper line (before the H3) */
.edge-nav-wrap .edge-nav-help + h3{
  margin-top: 6px !important;
}

/* Create cleaner break between question blocks */
.edge-nav-wrap .edge-nav-block{
  margin: 30px 0 26px !important;
}

/* Slightly increase space after each question block */
.edge-nav-wrap .edge-nav-block:last-of-type{
  margin-bottom: 30px !important;
}

/* 3) Submit button — force back to blue */
.edge-nav-wrap .edge-nav-button,
.edge-nav-wrap button.edge-nav-button,
.edge-nav-wrap button[type="submit"]{
  background: #1f5fbf !important;           /* blue */
  border-color: rgba(31,95,191,0.35) !important;
  color: #fff !important;
}

.edge-nav-wrap .edge-nav-button:hover,
.edge-nav-wrap button.edge-nav-button:hover,
.edge-nav-wrap button[type="submit"]:hover{
  filter: brightness(1.05) !important;
}

/* 4) Slightly larger radios + checkboxes */
.edge-nav-wrap input[type="radio"],
.edge-nav-wrap input[type="checkbox"]{
  transform: scale(1.12) !important;        /* subtle increase */
  transform-origin: left top !important;
}

/* Because scaling can affect baseline alignment, re-tune vertical alignment */
.edge-nav-wrap .edge-row > input,
.edge-nav-wrap label.edge-option > input,
.edge-nav-wrap label.edge-nav-radio-row > input{
  margin-top: 0.38em !important;
}

/* =========================================
   FORCE “Save or Print” to blue (wins vs theme)
   Paste at VERY BOTTOM of file
   ========================================= */

/* If it's a BUTTON */
.edge-nav-wrap .edge-nav-actions button.edge-nav-print-btn,
.edge-nav-wrap .edge-nav-actions .edge-nav-print-btn{
  background: #1f6fd6 !important;
  border-color: #1f6fd6 !important;
  color: #ffffff !important;
}

/* If it's a LINK (blue text style) */
.edge-nav-wrap .edge-nav-actions a.edge-nav-print-btn{
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  color: #1f6fd6 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  font-size: inherit !important;
  text-decoration: underline !important;
}

/* Hover */
.edge-nav-wrap .edge-nav-actions button.edge-nav-print-btn:hover,
.edge-nav-wrap .edge-nav-actions .edge-nav-print-btn:hover,
.edge-nav-wrap .edge-nav-actions a.edge-nav-print-btn:hover{
  filter: brightness(1.08) !important;
}

/* Blue emphasis for "Save or print this result" */
.edge-nav-wrap .edge-nav-actions .edge-nav-print-link{
  color: #1f6fd6 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

.edge-nav-wrap .edge-nav-actions .edge-nav-print-link:hover{
  text-decoration: underline !important;
}
