.questionary-container {
  position: absolute;
  top: 76px;
  left: 25%;
}

.body-type-container {
  text-align: center;
}

.row {
  justify-content: center;
}

.body-type-option {
  padding: 10px;
  border: 1px solid #ddd;
  cursor: pointer;
  transition: all 0.3s ease;
}

.body-type-option:hover {
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.heavyset {
  background-color: #cccccc;
}

.selected {
  background-color: #a1aad3 !important;
  color: #fff;
}

.muscular {
  background-color: #d9d9d9;
}

.religion-container {
  text-align: center;
}

.religion-option,
.skin-option,
.activities-option {
  padding: 5px;
  border: 1px solid #ddd;
  margin-bottom: 10px;
  border-radius: 50px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.religion-option {
  margin-bottom: 5px;
}

.religion-option:hover,
.skin-option:hover,
.activities-option:hover {
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.checkbox-input,
.radio-input,
.radio-input-skin {
  display: none;
}

.ans-check {
  background-color: #1e5a32 !important;
  color: #ffffff !important;
  font-weight: bolder;
}

.borderRadio50 {
  border-radius: 50px;
}

.mm-fixed {
  margin: 0;
  padding: 0;
}

.pb-mt-10 {
  height: 30px;
  font-size: 15px;
  font-weight: 700;
}

@media (max-width: 768px) {
  .pb-mt-10 {
    width: 100%;
  }

  .mm-fixed {
    position: fixed;
    z-index: 9999;
    padding: 9px 9px;
    background-color: #d7e9dd45;
  }

  .mm-questionary-container {
    position: relative;
    top: 30px;
    margin-bottom: 55px;
    padding: 10px 20px;
  }

  .mm-questionary-parent-container {
    margin: 0;
    padding: 0;
    background-color: #ffffff;
  }
}

/* =========================================================
430 × 932 — QUESTIONNAIRE UI
========================================================= */

@media (width: 430px) and (height: 932px) {

  .mm-questionary-parent-container,
  main {
    min-height: 100vh;
    background: var(--register-bg-color) !important;
    /* background: #eef5f0 !important; */
  }

  .mm-fixed {
    width: 100%;
    background: #ffffff !important;
    padding: 12px 18px 10px !important;
    box-shadow: 0 2px 12px rgba(30, 52, 39, 0.04);
  }

  .progress {
    position: relative;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: #e5ebe6 !important;
    overflow: visible !important;
  }

  .progress-bar {
    position: relative;
    min-width: 24px;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: var(--header-button-color) !important;
    /* background-color: #6b9a80 !important; */
    overflow: visible !important;
    color: transparent !important;
    font-size: 0 !important;
  }

  .progress-bar::after {
    content: attr(aria-valuenow) "%";
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--header-button-color);
    /* background: #6b9a80; */
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 3px 8px rgba(35, 69, 49, 0.16);
  }

  .mm-questionary-container {
    max-width: 430px;
    margin: 0 auto;
    padding: 0 20px 6px;
  }

  #questionsContainer {
    width: 100% !important;
    max-width: 392px !important;

    margin: 14px auto 0 !important;

    background:
      linear-gradient(180deg,
        #ffffff 0%,
        #f8fbf8 100%) !important;

    border: 1px solid rgba(107, 154, 128, 0.08) !important;

    border-radius: 36px !important;

    padding: 28px 18px 16px !important;

    overflow: hidden !important;

    box-shadow:
      0 24px 60px rgba(35, 69, 49, 0.08),
      0 8px 24px rgba(35, 69, 49, 0.05),
      inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;

    backdrop-filter: blur(8px);
  }

  .questionary-question,
  .question-bg-green-color {
    display: block !important;

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

    margin: 0 auto 18px !important;

    background: transparent !important;

    color: #18392b !important;

    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    letter-spacing: 0.1px !important;

    text-align: center !important;

    padding: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
  }

  .question-setting {
    text-align: left !important;
    padding-left: 0 !important;
  }

  .table {
    margin-bottom: 0 !important;
  }

  .table {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    background: transparent !important;
    border: 0 !important;
  }

  .table> :not(caption)>*>* {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  tbody,
  td,
  tfoot,
  th,
  thead,
  tr {
    border: 0 !important;
    background: transparent !important;
  }

  td {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
  }

  .simple-Block .row:not(.chip-layout) {
    display: block !important;
  }

  .simple-Block .row:not(.chip-layout)>div {
    width: 100% !important;
    margin-bottom: 6px !important;
  }

  .simple-Block .row>div:last-child {
    margin-bottom: 0 !important;
  }

  span.radio {
    position: relative !important;

    overflow: hidden !important;

    width: 100% !important;

    min-height: 56px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #ffffff !important;

    border: 1px solid #e7eeea !important;

    border-radius: 18px !important;

    padding: 0 18px !important;

    margin: 0 0 10px 0 !important;

    cursor: pointer !important;

    box-shadow:
      0 4px 12px rgba(35, 69, 49, 0.04),
      0 1px 3px rgba(35, 69, 49, 0.02) !important;

    transition: all 0.18s ease !important;
  }

  span.radio:hover {
    transform: translateY(-1px);
    box-shadow:
      0 8px 20px rgba(35, 69, 49, 0.08),
      0 2px 6px rgba(35, 69, 49, 0.04) !important;
  }

  span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;

    position: absolute !important;

    left: 18px !important;

    top: 50% !important;

    transform: translateY(-50%) !important;

    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;

    border: 2px solid #8aa895 !important;

    border-radius: 50% !important;

    background: #ffffff !important;

    opacity: 1 !important;

    visibility: visible !important;

    display: block !important;

    flex-shrink: 0 !important;

    cursor: pointer !important;

    z-index: 100 !important;

    pointer-events: auto !important;

    transition: all 0.18s ease !important;
  }

  span.radio input[type="radio"]:checked {
    /* border: 5px solid #5f8f75 !important; */
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  span.radio::before,
  span.radio label::before,
  span.radio label::after {
    display: none !important;
    content: none !important;
  }

  span.radio label,
  .custom-checkbox label,
  .custom-radio label {
    position: relative !important;

    z-index: 5 !important;

    width: 100% !important;

    min-height: 45px !important;
    /* min-height: 62px !important; */

    margin: 0 !important;

    padding: 0 18px 0 50px !important;

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

    color: var(--answer-color) !important;
    /* color: #2f473b !important; */

    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
    letter-spacing: 0 !important;

    text-align: left !important;

    cursor: pointer !important;
  }

  .ans-check {
    background: #f3f8f4 !important;
    border: 1px solid #a8c9b1 !important;
    color: #173628 !important;
    box-shadow: 0 6px 18px rgba(107, 154, 128, 0.10) !important;
  }

  form>div:last-of-type {
    max-width: 390px !important;
    margin: 10px auto 0 !important;
  }


  /* FORCE HIDDEN NEXT BUTTON TO STAY HIDDEN */
  #btnContinue.d-none,
  #btnTableContinue.d-none {
    display: none !important;
  }

  #btnContinue,
  #btnTableContinue {
    width: 100% !important;
    min-height: 62px !important;
    border: none !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #2d7446 0%, #1f5d36 100%) !important;
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow:
      0 10px 24px rgba(31, 93, 54, 0.22),
      0 2px 6px rgba(31, 93, 54, 0.10) !important;
    transition: all 0.18s ease !important;
  }

  .simple-Block.question-bg-green-color {
    background: transparent !important;
    background-color: transparent !important;
  }

  span.radio,
  span.radio *,
  span.radio label {
    pointer-events: auto !important;
  }

  /* =========================================================
  FINAL CHIP LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .simple-Block .row.chip-layout {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;

    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    align-content: flex-start !important;

    gap: 10px 8px !important;
    width: 100% !important;
    max-width: 352px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout>div,
  .simple-Block .row.chip-layout>[class*="col"] {
    display: contents !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox {
    display: inline-flex !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label,
  .simple-Block .row.chip-layout .custom-checkbox label {
    position: relative !important;
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 82px !important;
    max-width: 168px !important;
    min-height: 38px !important;
    height: auto !important;

    padding: 9px 14px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #dfe7e1 !important;
    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;

    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;

    overflow: visible !important;
    text-overflow: unset !important;

    box-shadow: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label::before,
  .simple-Block .row.chip-layout .custom-checkbox>label::after,
  .simple-Block .row.chip-layout .custom-checkbox label::before,
  .simple-Block .row.chip-layout .custom-checkbox label::after {
    display: none !important;
    content: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"]:checked+label,
  .simple-Block .row.chip-layout .custom-checkbox>label.ans-check,
  .simple-Block .row.chip-layout .custom-checkbox label.ans-check {
    background: var(--selection-color) !important;
    border-color: var(--selection-color) !important;
    /* background: #1f5d36 !important;
    border-color: #1f5d36 !important; */
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(31, 93, 54, 0.22) !important;
  }

  /* =========================================================
  YES/NO TABLE LAYOUT FIX — 430 × 932 ONLY
  Keeps Yes/No pages separate from normal radio-card pages
  ========================================================= */

  .noneEq table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    margin: 0 !important;
  }

  .noneEq thead,
  .noneEq tbody,
  .noneEq tr {
    display: table-header-group !important;
  }

  .noneEq tbody {
    display: table-row-group !important;
  }

  .noneEq tr {
    display: table-row !important;
  }

  .noneEq th,
  .noneEq td {
    display: table-cell !important;
    vertical-align: middle !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .noneEq th:first-child,
  .noneEq td:first-child {
    width: calc(100% - 104px) !important;
  }

  .noneEq th:nth-child(2),
  .noneEq th:nth-child(3),
  .noneEq td:nth-child(2),
  .noneEq td:nth-child(3) {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    text-align: center !important;
  }

  .noneEq thead th {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    height: 28px !important;
  }



  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq td:nth-child(2) span.radio,
  .noneEq td:nth-child(3) span.radio {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .noneEq td:nth-child(2) span.radio label,
  .noneEq td:nth-child(3) span.radio label {
    display: none !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: static !important;
    transform: none !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 3px solid #8aa895 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 5px solid #5f8f75 !important;
    background: #ffffff !important;
  }

  /* =========================================================
  PREMIUM YES/NO LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .noneEq table {
    background: #f8fbf8 !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .noneEq thead th {
    background: transparent !important;
    color: #173628 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }

  .noneEq tbody tr {
    background: #ffffff !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 8px rgba(35, 69, 49, 0.04) !important;
  }

  .noneEq tbody td:first-child {
    background: #ffffff !important;
    color: #173628 !important;
    height: 104px !important;
    padding: 14px 18px !important;
    border-radius: 18px 0 0 18px !important;
  }

  .noneEq tbody td:first-child,
  .noneEq tbody td:first-child * {
    color: #173628 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.34 !important;
  }

  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq tbody td:nth-child(3) {
    border-radius: 0 18px 18px 0 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    width: 22px !important;
    height: 22px !important;
    border: 2px solid #8aa895 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 6px solid #1f5d36 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE OLD GREEN TABLE STYLE
========================================================= */

  .eq .question-bg-green-color,
  .eq .questionary-question,
  .eq .simple-Block.question-bg-green-color,
  .eq span.radio,
  .eq span.radio label {
    background: none !important;
    /* background-color: #ffffff !important; */
    color: #1d3b2d !important;
  }

  .eq .question-bg-green-color,
  .eq .questionary-question {
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: left !important;
  }

  .eq span.radio {
    border: 1px solid #e7eeea !important;
    border-radius: 18px !important;
    margin-bottom: 10px !important;
  }

  .eq span.radio label {
    font-size: 14px !important;
    font-weight: 600 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE REMAINING TABLE LINES
========================================================= */

  .eq table,
  .eq tbody,
  .eq tr,
  .eq td,
  .eq th {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  .eq table {
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .eq tr {
    background: transparent !important;
  }

  .eq td {
    background: transparent !important;
  }

  /* =========================================================
430 × 932 ONLY
FINAL BORDER CLEANUP
========================================================= */

  .eq .questionary-question,
  .eq .question-bg-green-color,
  .eq tr,
  .eq td,
  .eq tbody,
  .eq table {
    border: none !important;
    border-color: transparent !important;
    outline: none !important;
  }

  .eq td:first-child {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
  }

  .eq .questionary-question::before,
  .eq .questionary-question::after,
  .eq .question-bg-green-color::before,
  .eq .question-bg-green-color::after {
    display: none !important;
    content: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE QUESTION BLOCK BORDER
========================================================= */

  .eq .ques-block {
    border: 0 !important;
    border-color: transparent !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE CHILD COLUMN BORDERS
========================================================= */

  .eq .ques-block>div,
  .eq .ques-block .col-md-4,
  .eq .ques-block .col-md-8 {
    border: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE OLD ANSWER DIVIDER LINES
========================================================= */

  .eq span.radio,
  .eq span.radio label,
  .eq .question-setting,
  .eq .question-remove-border-radius,
  .eq .question-bg-green-color {
    border-bottom: 0 !important;
    border-top: 0 !important;
  }

  .eq .question-setting {
    padding-bottom: 0 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY ANSWER ROW ALIGNMENT
========================================================= */

  .eq .personality-answer-row {
    display: flex !important;
    align-items: flex-start !important;

    width: 100% !important;

    padding: 10px 15px !important;
    margin: 0 0 10px 0 !important;

    gap: 14px !important;
    background: #ffff;
    border-radius: 18px;
  }

    .eq .personality-answer-radio {
        /* width: 17px !important;
        height: 17px !important;
        min-width: 17px !important; */
        min-height: 17px !important;
        margin: 15px 0 0 0 !important;
        /* flex: 0 0 17px !important; */
        appearance: none !important;
        -webkit-appearance: none !important;
        /* position: absolute !important; */
        /* left: 18px !important; */
        /* top: 50% !important; */
        transform: translateY(-50%) !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        /* min-height: 22px !important; */
        border: 2px solid #8aa895 !important;
        border-radius: 50% !important;
        background: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
        display: block !important;
        /* flex-shrink: 0 !important; */
        cursor: pointer !important;
        z-index: 100 !important;
        pointer-events: auto !important;
        transition: all 0.18s ease !important;
    }

  .eq .personality-answer-label {
    display: block !important;

    width: 100% !important;

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

    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;

    text-align: left !important;
  }

  /* =========================================================
430 × 932 ONLY
RESTORE ORIGINAL PHOTO UPLOAD PAGE LAYOUT
========================================================= */

  .photo-upload-main-heading,
  .create-profile-heading,
  .upload-page-top-banner,
  .upload-top-banner {
    display: none !important;
  }

  .upload-photo-main-card,
  .photo-upload-card,
  .upload-photo-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 360px !important;
  }

  .upload-photo-dashed-box,
  .photo-upload-dropzone,
  .upload-photo-box {
    min-height: auto !important;
    height: auto !important;

    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    box-shadow: none !important;
  }

  .upload-photo-btn,
  .upload-btn,
  .photo-upload-btn,
  button.upload-photo-btn,
  a.upload-photo-btn {
    display: flex !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 272px !important;
    height: 56px !important;

    margin: 12px auto 18px !important;

    border-radius: 14px !important;

    background: #1f8d52 !important;

    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 700 !important;

    align-items: center !important;
    justify-content: center !important;

    border: 0 !important;

    position: relative !important;
    z-index: 50 !important;
  }

  .continue-btn,
  .photo-continue-btn,
  #btnContinue,
  #btnNextStep,
  #submitButton {

    width: 100% !important;

    height: 54px !important;

    border-radius: 12px !important;

    background: var(--register-btn-color) !important;
    /* background: #005f2f !important; */
    /* border-color: #005f2f !important; */
    border-color: #ffffff !important;
    color: #ffffff !important;

    font-size: 18px !important;
    font-weight: 700 !important;
  }

  /* PERSONALITY NEXT BUTTON — 430 × 932 ONLY */

  #btnContinue,
  #btnTableContinue {
    background: #005f2f !important;
    border-color: #005f2f !important;
    color: #ffffff !important;
  }

  /* RADIO CIRCLE GREEN — 430 × 932 ONLY */

  .eq input[type="radio"] {
    /* accent-color: #005f2f !important; */
    accent-color: var(--selection-color) !important;
  }

  .eq input[type="radio"]:checked {
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  /* VALIDATION RED BORDER — 430 × 932 ONLY */

  .eq .questionary-question.add-validation-class,
  .eq .ques-block .questionary-question.add-validation-class,
  .noneEq td.add-validation-class,
  .simple-Block.add-validation-class {
    border: 3px solid #d60000 !important;
    border-radius: 18px !important;
    padding: 12px !important;
  }
 }

/* =========================================================
430 × 844 — QUESTIONNAIRE UI
========================================================= */

@media (width: 430px) and (height: 844px) {

.mm-questionary-parent-container,
  main {
    min-height: 100vh;
    background: var(--register-bg-color) !important;
    /* background: #eef5f0 !important; */
  }

  .mm-fixed {
    width: 100%;
    background: #ffffff !important;
    padding: 12px 18px 10px !important;
    box-shadow: 0 2px 12px rgba(30, 52, 39, 0.04);
  }

  .progress {
    position: relative;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: #e5ebe6 !important;
    overflow: visible !important;
  }

  .progress-bar {
    position: relative;
    min-width: 24px;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: var(--header-button-color) !important;
    /* background-color: #6b9a80 !important; */
    overflow: visible !important;
    color: transparent !important;
    font-size: 0 !important;
  }

  .progress-bar::after {
    content: attr(aria-valuenow) "%";
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--header-button-color);
    /* background: #6b9a80; */
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 3px 8px rgba(35, 69, 49, 0.16);
  }

  .mm-questionary-container {
    max-width: 430px;
    margin: 0 auto;
    padding: 0 20px 6px;
  }

  #questionsContainer {
    width: 100% !important;
    max-width: 392px !important;

    margin: 14px auto 0 !important;

    background:
      linear-gradient(180deg,
        #ffffff 0%,
        #f8fbf8 100%) !important;

    border: 1px solid rgba(107, 154, 128, 0.08) !important;

    border-radius: 36px !important;

    padding: 28px 18px 16px !important;

    overflow: hidden !important;

    box-shadow:
      0 24px 60px rgba(35, 69, 49, 0.08),
      0 8px 24px rgba(35, 69, 49, 0.05),
      inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;

    backdrop-filter: blur(8px);
  }

  .questionary-question,
  .question-bg-green-color {
    display: block !important;

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

    margin: 0 auto 18px !important;

    background: transparent !important;

    color: #18392b !important;

    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    letter-spacing: 0.1px !important;

    text-align: center !important;

    padding: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
  }

  .question-setting {
    text-align: left !important;
    padding-left: 0 !important;
  }

  .table {
    margin-bottom: 0 !important;
  }

  .table {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    background: transparent !important;
    border: 0 !important;
  }

  .table> :not(caption)>*>* {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  tbody,
  td,
  tfoot,
  th,
  thead,
  tr {
    border: 0 !important;
    background: transparent !important;
  }

  td {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
  }

  .simple-Block .row:not(.chip-layout) {
    display: block !important;
  }

  .simple-Block .row:not(.chip-layout)>div {
    width: 100% !important;
    margin-bottom: 6px !important;
  }

  .simple-Block .row>div:last-child {
    margin-bottom: 0 !important;
  }

  span.radio {
    position: relative !important;

    overflow: hidden !important;

    width: 100% !important;

    min-height: 56px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #ffffff !important;

    border: 1px solid #e7eeea !important;

    border-radius: 18px !important;

    padding: 0 18px !important;

    margin: 0 0 10px 0 !important;

    cursor: pointer !important;

    box-shadow:
      0 4px 12px rgba(35, 69, 49, 0.04),
      0 1px 3px rgba(35, 69, 49, 0.02) !important;

    transition: all 0.18s ease !important;
  }

  span.radio:hover {
    transform: translateY(-1px);
    box-shadow:
      0 8px 20px rgba(35, 69, 49, 0.08),
      0 2px 6px rgba(35, 69, 49, 0.04) !important;
  }

  span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;

    position: absolute !important;

    left: 18px !important;

    top: 50% !important;

    transform: translateY(-50%) !important;

    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;

    border: 2px solid #8aa895 !important;

    border-radius: 50% !important;

    background: #ffffff !important;

    opacity: 1 !important;

    visibility: visible !important;

    display: block !important;

    flex-shrink: 0 !important;

    cursor: pointer !important;

    z-index: 100 !important;

    pointer-events: auto !important;

    transition: all 0.18s ease !important;
  }

  span.radio input[type="radio"]:checked {
    /* border: 5px solid #5f8f75 !important; */
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  span.radio::before,
  span.radio label::before,
  span.radio label::after {
    display: none !important;
    content: none !important;
  }

  span.radio label,
  .custom-checkbox label,
  .custom-radio label {
    position: relative !important;

    z-index: 5 !important;

    width: 100% !important;

    min-height: 45px !important;
    /* min-height: 62px !important; */

    margin: 0 !important;

    padding: 0 18px 0 50px !important;

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

    color: var(--answer-color) !important;
    /* color: #2f473b !important; */

    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
    letter-spacing: 0 !important;

    text-align: left !important;

    cursor: pointer !important;
  }

  .ans-check {
    background: #f3f8f4 !important;
    border: 1px solid #a8c9b1 !important;
    color: #173628 !important;
    box-shadow: 0 6px 18px rgba(107, 154, 128, 0.10) !important;
  }

  form>div:last-of-type {
    max-width: 390px !important;
    margin: 10px auto 0 !important;
  }


  /* FORCE HIDDEN NEXT BUTTON TO STAY HIDDEN */
  #btnContinue.d-none,
  #btnTableContinue.d-none {
    display: none !important;
  }

  #btnContinue,
  #btnTableContinue {
    width: 100% !important;
    min-height: 62px !important;
    border: none !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #2d7446 0%, #1f5d36 100%) !important;
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow:
      0 10px 24px rgba(31, 93, 54, 0.22),
      0 2px 6px rgba(31, 93, 54, 0.10) !important;
    transition: all 0.18s ease !important;
  }

  .simple-Block.question-bg-green-color {
    background: transparent !important;
    background-color: transparent !important;
  }

  span.radio,
  span.radio *,
  span.radio label {
    pointer-events: auto !important;
  }

  /* =========================================================
  FINAL CHIP LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .simple-Block .row.chip-layout {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;

    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    align-content: flex-start !important;

    gap: 10px 8px !important;
    width: 100% !important;
    max-width: 352px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout>div,
  .simple-Block .row.chip-layout>[class*="col"] {
    display: contents !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox {
    display: inline-flex !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label,
  .simple-Block .row.chip-layout .custom-checkbox label {
    position: relative !important;
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 82px !important;
    max-width: 168px !important;
    min-height: 38px !important;
    height: auto !important;

    padding: 9px 14px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #dfe7e1 !important;
    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;

    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;

    overflow: visible !important;
    text-overflow: unset !important;

    box-shadow: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label::before,
  .simple-Block .row.chip-layout .custom-checkbox>label::after,
  .simple-Block .row.chip-layout .custom-checkbox label::before,
  .simple-Block .row.chip-layout .custom-checkbox label::after {
    display: none !important;
    content: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"]:checked+label,
  .simple-Block .row.chip-layout .custom-checkbox>label.ans-check,
  .simple-Block .row.chip-layout .custom-checkbox label.ans-check {
    background: var(--selection-color) !important;
    border-color: var(--selection-color) !important;
    /* background: #1f5d36 !important;
    border-color: #1f5d36 !important; */
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(31, 93, 54, 0.22) !important;
  }

  /* =========================================================
  YES/NO TABLE LAYOUT FIX — 430 × 932 ONLY
  Keeps Yes/No pages separate from normal radio-card pages
  ========================================================= */

  .noneEq table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    margin: 0 !important;
  }

  .noneEq thead,
  .noneEq tbody,
  .noneEq tr {
    display: table-header-group !important;
  }

  .noneEq tbody {
    display: table-row-group !important;
  }

  .noneEq tr {
    display: table-row !important;
  }

  .noneEq th,
  .noneEq td {
    display: table-cell !important;
    vertical-align: middle !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .noneEq th:first-child,
  .noneEq td:first-child {
    width: calc(100% - 104px) !important;
  }

  .noneEq th:nth-child(2),
  .noneEq th:nth-child(3),
  .noneEq td:nth-child(2),
  .noneEq td:nth-child(3) {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    text-align: center !important;
  }

  .noneEq thead th {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    height: 28px !important;
  }



  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq td:nth-child(2) span.radio,
  .noneEq td:nth-child(3) span.radio {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .noneEq td:nth-child(2) span.radio label,
  .noneEq td:nth-child(3) span.radio label {
    display: none !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: static !important;
    transform: none !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 3px solid #8aa895 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 5px solid #5f8f75 !important;
    background: #ffffff !important;
  }

  /* =========================================================
  PREMIUM YES/NO LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .noneEq table {
    background: #f8fbf8 !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .noneEq thead th {
    background: transparent !important;
    color: #173628 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }

  .noneEq tbody tr {
    background: #ffffff !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 8px rgba(35, 69, 49, 0.04) !important;
  }

  .noneEq tbody td:first-child {
    background: #ffffff !important;
    color: #173628 !important;
    height: 104px !important;
    padding: 14px 18px !important;
    border-radius: 18px 0 0 18px !important;
  }

  .noneEq tbody td:first-child,
  .noneEq tbody td:first-child * {
    color: #173628 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.34 !important;
  }

  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq tbody td:nth-child(3) {
    border-radius: 0 18px 18px 0 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    width: 22px !important;
    height: 22px !important;
    border: 2px solid #8aa895 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 6px solid #1f5d36 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE OLD GREEN TABLE STYLE
========================================================= */

  .eq .question-bg-green-color,
  .eq .questionary-question,
  .eq .simple-Block.question-bg-green-color,
  .eq span.radio,
  .eq span.radio label {
    background: none !important;
    /* background-color: #ffffff !important; */
    color: #1d3b2d !important;
  }

  .eq .question-bg-green-color,
  .eq .questionary-question {
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: left !important;
  }

  .eq span.radio {
    border: 1px solid #e7eeea !important;
    border-radius: 18px !important;
    margin-bottom: 10px !important;
  }

  .eq span.radio label {
    font-size: 14px !important;
    font-weight: 600 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE REMAINING TABLE LINES
========================================================= */

  .eq table,
  .eq tbody,
  .eq tr,
  .eq td,
  .eq th {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  .eq table {
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .eq tr {
    background: transparent !important;
  }

  .eq td {
    background: transparent !important;
  }

  /* =========================================================
430 × 932 ONLY
FINAL BORDER CLEANUP
========================================================= */

  .eq .questionary-question,
  .eq .question-bg-green-color,
  .eq tr,
  .eq td,
  .eq tbody,
  .eq table {
    border: none !important;
    border-color: transparent !important;
    outline: none !important;
  }

  .eq td:first-child {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
  }

  .eq .questionary-question::before,
  .eq .questionary-question::after,
  .eq .question-bg-green-color::before,
  .eq .question-bg-green-color::after {
    display: none !important;
    content: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE QUESTION BLOCK BORDER
========================================================= */

  .eq .ques-block {
    border: 0 !important;
    border-color: transparent !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE CHILD COLUMN BORDERS
========================================================= */

  .eq .ques-block>div,
  .eq .ques-block .col-md-4,
  .eq .ques-block .col-md-8 {
    border: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE OLD ANSWER DIVIDER LINES
========================================================= */

  .eq span.radio,
  .eq span.radio label,
  .eq .question-setting,
  .eq .question-remove-border-radius,
  .eq .question-bg-green-color {
    border-bottom: 0 !important;
    border-top: 0 !important;
  }

  .eq .question-setting {
    padding-bottom: 0 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY ANSWER ROW ALIGNMENT
========================================================= */

  .eq .personality-answer-row {
    display: flex !important;
    align-items: flex-start !important;

    width: 100% !important;

    padding: 10px 15px !important;
    margin: 0 0 10px 0 !important;

    gap: 14px !important;
    background: #ffff;
    border-radius: 18px;
  }

    .eq .personality-answer-radio {
        /* width: 17px !important;
        height: 17px !important;
        min-width: 17px !important; */
        min-height: 17px !important;
        margin: 15px 0 0 0 !important;
        /* flex: 0 0 17px !important; */
        appearance: none !important;
        -webkit-appearance: none !important;
        /* position: absolute !important; */
        /* left: 18px !important; */
        /* top: 50% !important; */
        transform: translateY(-50%) !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        /* min-height: 22px !important; */
        border: 2px solid #8aa895 !important;
        border-radius: 50% !important;
        background: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
        display: block !important;
        /* flex-shrink: 0 !important; */
        cursor: pointer !important;
        z-index: 100 !important;
        pointer-events: auto !important;
        transition: all 0.18s ease !important;
    }

  .eq .personality-answer-label {
    display: block !important;

    width: 100% !important;

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

    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;

    text-align: left !important;
  }

  /* =========================================================
430 × 932 ONLY
RESTORE ORIGINAL PHOTO UPLOAD PAGE LAYOUT
========================================================= */

  .photo-upload-main-heading,
  .create-profile-heading,
  .upload-page-top-banner,
  .upload-top-banner {
    display: none !important;
  }

  .upload-photo-main-card,
  .photo-upload-card,
  .upload-photo-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 360px !important;
  }

  .upload-photo-dashed-box,
  .photo-upload-dropzone,
  .upload-photo-box {
    min-height: auto !important;
    height: auto !important;

    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    box-shadow: none !important;
  }

  .upload-photo-btn,
  .upload-btn,
  .photo-upload-btn,
  button.upload-photo-btn,
  a.upload-photo-btn {
    display: flex !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 272px !important;
    height: 56px !important;

    margin: 12px auto 18px !important;

    border-radius: 14px !important;

    background: #1f8d52 !important;

    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 700 !important;

    align-items: center !important;
    justify-content: center !important;

    border: 0 !important;

    position: relative !important;
    z-index: 50 !important;
  }

  .continue-btn,
  .photo-continue-btn,
  #btnContinue,
  #btnNextStep,
  #submitButton {

    width: 100% !important;

    height: 54px !important;

    border-radius: 12px !important;

    background: var(--register-btn-color) !important;
    /* background: #005f2f !important; */
    /* border-color: #005f2f !important; */
    border-color: #ffffff !important;
    color: #ffffff !important;

    font-size: 18px !important;
    font-weight: 700 !important;
  }

  /* PERSONALITY NEXT BUTTON — 430 × 932 ONLY */

  #btnContinue,
  #btnTableContinue {
    background: #005f2f !important;
    border-color: #005f2f !important;
    color: #ffffff !important;
  }

  /* RADIO CIRCLE GREEN — 430 × 932 ONLY */

  .eq input[type="radio"] {
    /* accent-color: #005f2f !important; */
    accent-color: var(--selection-color) !important;
  }

  .eq input[type="radio"]:checked {
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  /* VALIDATION RED BORDER — 430 × 932 ONLY */

  .eq .questionary-question.add-validation-class,
  .eq .ques-block .questionary-question.add-validation-class,
  .noneEq td.add-validation-class,
  .simple-Block.add-validation-class {
    border: 3px solid #d60000 !important;
    border-radius: 18px !important;
    padding: 12px !important;
  }
}
/* =========================================================
414 × 896 — QUESTIONNAIRE UI
========================================================= */

@media (width: 414px) and (height: 896px) {
  
.mm-questionary-parent-container,
  main {
    min-height: 100vh;
    background: var(--register-bg-color) !important;
    /* background: #eef5f0 !important; */
  }

  .mm-fixed {
    width: 100%;
    background: #ffffff !important;
    padding: 12px 18px 10px !important;
    box-shadow: 0 2px 12px rgba(30, 52, 39, 0.04);
  }

  .progress {
    position: relative;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: #e5ebe6 !important;
    overflow: visible !important;
  }

  .progress-bar {
    position: relative;
    min-width: 24px;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: var(--header-button-color) !important;
    /* background-color: #6b9a80 !important; */
    overflow: visible !important;
    color: transparent !important;
    font-size: 0 !important;
  }

  .progress-bar::after {
    content: attr(aria-valuenow) "%";
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--header-button-color);
    /* background: #6b9a80; */
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 3px 8px rgba(35, 69, 49, 0.16);
  }

  .mm-questionary-container {
    max-width: 430px;
    margin: 0 auto;
    padding: 0 20px 6px;
  }

  #questionsContainer {
    width: 100% !important;
    max-width: 392px !important;

    margin: 14px auto 0 !important;

    background:
      linear-gradient(180deg,
        #ffffff 0%,
        #f8fbf8 100%) !important;

    border: 1px solid rgba(107, 154, 128, 0.08) !important;

    border-radius: 36px !important;

    padding: 28px 18px 16px !important;

    overflow: hidden !important;

    box-shadow:
      0 24px 60px rgba(35, 69, 49, 0.08),
      0 8px 24px rgba(35, 69, 49, 0.05),
      inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;

    backdrop-filter: blur(8px);
  }

  .questionary-question,
  .question-bg-green-color {
    display: block !important;

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

    margin: 0 auto 18px !important;

    background: transparent !important;

    color: #18392b !important;

    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    letter-spacing: 0.1px !important;

    text-align: center !important;

    padding: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
  }

  .question-setting {
    text-align: left !important;
    padding-left: 0 !important;
  }

  .table {
    margin-bottom: 0 !important;
  }

  .table {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    background: transparent !important;
    border: 0 !important;
  }

  .table> :not(caption)>*>* {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  tbody,
  td,
  tfoot,
  th,
  thead,
  tr {
    border: 0 !important;
    background: transparent !important;
  }

  td {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
  }

  .simple-Block .row:not(.chip-layout) {
    display: block !important;
  }

  .simple-Block .row:not(.chip-layout)>div {
    width: 100% !important;
    margin-bottom: 6px !important;
  }

  .simple-Block .row>div:last-child {
    margin-bottom: 0 !important;
  }

  span.radio {
    position: relative !important;

    overflow: hidden !important;

    width: 100% !important;

    min-height: 56px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #ffffff !important;

    border: 1px solid #e7eeea !important;

    border-radius: 18px !important;

    padding: 0 18px !important;

    margin: 0 0 10px 0 !important;

    cursor: pointer !important;

    box-shadow:
      0 4px 12px rgba(35, 69, 49, 0.04),
      0 1px 3px rgba(35, 69, 49, 0.02) !important;

    transition: all 0.18s ease !important;
  }

  span.radio:hover {
    transform: translateY(-1px);
    box-shadow:
      0 8px 20px rgba(35, 69, 49, 0.08),
      0 2px 6px rgba(35, 69, 49, 0.04) !important;
  }

  span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;

    position: absolute !important;

    left: 18px !important;

    top: 50% !important;

    transform: translateY(-50%) !important;

    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;

    border: 2px solid #8aa895 !important;

    border-radius: 50% !important;

    background: #ffffff !important;

    opacity: 1 !important;

    visibility: visible !important;

    display: block !important;

    flex-shrink: 0 !important;

    cursor: pointer !important;

    z-index: 100 !important;

    pointer-events: auto !important;

    transition: all 0.18s ease !important;
  }

  span.radio input[type="radio"]:checked {
    /* border: 5px solid #5f8f75 !important; */
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  span.radio::before,
  span.radio label::before,
  span.radio label::after {
    display: none !important;
    content: none !important;
  }

  span.radio label,
  .custom-checkbox label,
  .custom-radio label {
    position: relative !important;

    z-index: 5 !important;

    width: 100% !important;

    min-height: 45px !important;
    /* min-height: 62px !important; */

    margin: 0 !important;

    padding: 0 18px 0 50px !important;

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

    color: var(--answer-color) !important;
    /* color: #2f473b !important; */

    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
    letter-spacing: 0 !important;

    text-align: left !important;

    cursor: pointer !important;
  }

  .ans-check {
    background: #f3f8f4 !important;
    border: 1px solid #a8c9b1 !important;
    color: #173628 !important;
    box-shadow: 0 6px 18px rgba(107, 154, 128, 0.10) !important;
  }

  form>div:last-of-type {
    max-width: 390px !important;
    margin: 10px auto 0 !important;
  }


  /* FORCE HIDDEN NEXT BUTTON TO STAY HIDDEN */
  #btnContinue.d-none,
  #btnTableContinue.d-none {
    display: none !important;
  }

  #btnContinue,
  #btnTableContinue {
    width: 100% !important;
    min-height: 62px !important;
    border: none !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #2d7446 0%, #1f5d36 100%) !important;
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow:
      0 10px 24px rgba(31, 93, 54, 0.22),
      0 2px 6px rgba(31, 93, 54, 0.10) !important;
    transition: all 0.18s ease !important;
  }

  .simple-Block.question-bg-green-color {
    background: transparent !important;
    background-color: transparent !important;
  }

  span.radio,
  span.radio *,
  span.radio label {
    pointer-events: auto !important;
  }

  /* =========================================================
  FINAL CHIP LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .simple-Block .row.chip-layout {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;

    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    align-content: flex-start !important;

    gap: 10px 8px !important;
    width: 100% !important;
    max-width: 352px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout>div,
  .simple-Block .row.chip-layout>[class*="col"] {
    display: contents !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox {
    display: inline-flex !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label,
  .simple-Block .row.chip-layout .custom-checkbox label {
    position: relative !important;
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 82px !important;
    max-width: 168px !important;
    min-height: 38px !important;
    height: auto !important;

    padding: 9px 14px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #dfe7e1 !important;
    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;

    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;

    overflow: visible !important;
    text-overflow: unset !important;

    box-shadow: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label::before,
  .simple-Block .row.chip-layout .custom-checkbox>label::after,
  .simple-Block .row.chip-layout .custom-checkbox label::before,
  .simple-Block .row.chip-layout .custom-checkbox label::after {
    display: none !important;
    content: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"]:checked+label,
  .simple-Block .row.chip-layout .custom-checkbox>label.ans-check,
  .simple-Block .row.chip-layout .custom-checkbox label.ans-check {
    background: var(--selection-color) !important;
    border-color: var(--selection-color) !important;
    /* background: #1f5d36 !important;
    border-color: #1f5d36 !important; */
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(31, 93, 54, 0.22) !important;
  }

  /* =========================================================
  YES/NO TABLE LAYOUT FIX — 430 × 932 ONLY
  Keeps Yes/No pages separate from normal radio-card pages
  ========================================================= */

  .noneEq table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    margin: 0 !important;
  }

  .noneEq thead,
  .noneEq tbody,
  .noneEq tr {
    display: table-header-group !important;
  }

  .noneEq tbody {
    display: table-row-group !important;
  }

  .noneEq tr {
    display: table-row !important;
  }

  .noneEq th,
  .noneEq td {
    display: table-cell !important;
    vertical-align: middle !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .noneEq th:first-child,
  .noneEq td:first-child {
    width: calc(100% - 104px) !important;
  }

  .noneEq th:nth-child(2),
  .noneEq th:nth-child(3),
  .noneEq td:nth-child(2),
  .noneEq td:nth-child(3) {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    text-align: center !important;
  }

  .noneEq thead th {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    height: 28px !important;
  }



  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq td:nth-child(2) span.radio,
  .noneEq td:nth-child(3) span.radio {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .noneEq td:nth-child(2) span.radio label,
  .noneEq td:nth-child(3) span.radio label {
    display: none !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: static !important;
    transform: none !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 3px solid #8aa895 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 5px solid #5f8f75 !important;
    background: #ffffff !important;
  }

  /* =========================================================
  PREMIUM YES/NO LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .noneEq table {
    background: #f8fbf8 !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .noneEq thead th {
    background: transparent !important;
    color: #173628 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }

  .noneEq tbody tr {
    background: #ffffff !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 8px rgba(35, 69, 49, 0.04) !important;
  }

  .noneEq tbody td:first-child {
    background: #ffffff !important;
    color: #173628 !important;
    height: 104px !important;
    padding: 14px 18px !important;
    border-radius: 18px 0 0 18px !important;
  }

  .noneEq tbody td:first-child,
  .noneEq tbody td:first-child * {
    color: #173628 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.34 !important;
  }

  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq tbody td:nth-child(3) {
    border-radius: 0 18px 18px 0 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    width: 22px !important;
    height: 22px !important;
    border: 2px solid #8aa895 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 6px solid #1f5d36 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE OLD GREEN TABLE STYLE
========================================================= */

  .eq .question-bg-green-color,
  .eq .questionary-question,
  .eq .simple-Block.question-bg-green-color,
  .eq span.radio,
  .eq span.radio label {
    background: none !important;
    /* background-color: #ffffff !important; */
    color: #1d3b2d !important;
  }

  .eq .question-bg-green-color,
  .eq .questionary-question {
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: left !important;
  }

  .eq span.radio {
    border: 1px solid #e7eeea !important;
    border-radius: 18px !important;
    margin-bottom: 10px !important;
  }

  .eq span.radio label {
    font-size: 14px !important;
    font-weight: 600 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE REMAINING TABLE LINES
========================================================= */

  .eq table,
  .eq tbody,
  .eq tr,
  .eq td,
  .eq th {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  .eq table {
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .eq tr {
    background: transparent !important;
  }

  .eq td {
    background: transparent !important;
  }

  /* =========================================================
430 × 932 ONLY
FINAL BORDER CLEANUP
========================================================= */

  .eq .questionary-question,
  .eq .question-bg-green-color,
  .eq tr,
  .eq td,
  .eq tbody,
  .eq table {
    border: none !important;
    border-color: transparent !important;
    outline: none !important;
  }

  .eq td:first-child {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
  }

  .eq .questionary-question::before,
  .eq .questionary-question::after,
  .eq .question-bg-green-color::before,
  .eq .question-bg-green-color::after {
    display: none !important;
    content: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE QUESTION BLOCK BORDER
========================================================= */

  .eq .ques-block {
    border: 0 !important;
    border-color: transparent !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE CHILD COLUMN BORDERS
========================================================= */

  .eq .ques-block>div,
  .eq .ques-block .col-md-4,
  .eq .ques-block .col-md-8 {
    border: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE OLD ANSWER DIVIDER LINES
========================================================= */

  .eq span.radio,
  .eq span.radio label,
  .eq .question-setting,
  .eq .question-remove-border-radius,
  .eq .question-bg-green-color {
    border-bottom: 0 !important;
    border-top: 0 !important;
  }

  .eq .question-setting {
    padding-bottom: 0 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY ANSWER ROW ALIGNMENT
========================================================= */

  .eq .personality-answer-row {
    display: flex !important;
    align-items: flex-start !important;

    width: 100% !important;

    padding: 10px 15px !important;
    margin: 0 0 10px 0 !important;

    gap: 14px !important;
    background: #ffff;
    border-radius: 18px;
  }

    .eq .personality-answer-radio {
        /* width: 17px !important;
        height: 17px !important;
        min-width: 17px !important; */
        min-height: 17px !important;
        margin: 15px 0 0 0 !important;
        /* flex: 0 0 17px !important; */
        appearance: none !important;
        -webkit-appearance: none !important;
        /* position: absolute !important; */
        /* left: 18px !important; */
        /* top: 50% !important; */
        transform: translateY(-50%) !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        /* min-height: 22px !important; */
        border: 2px solid #8aa895 !important;
        border-radius: 50% !important;
        background: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
        display: block !important;
        /* flex-shrink: 0 !important; */
        cursor: pointer !important;
        z-index: 100 !important;
        pointer-events: auto !important;
        transition: all 0.18s ease !important;
    }

  .eq .personality-answer-label {
    display: block !important;

    width: 100% !important;

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

    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;

    text-align: left !important;
  }

  /* =========================================================
430 × 932 ONLY
RESTORE ORIGINAL PHOTO UPLOAD PAGE LAYOUT
========================================================= */

  .photo-upload-main-heading,
  .create-profile-heading,
  .upload-page-top-banner,
  .upload-top-banner {
    display: none !important;
  }

  .upload-photo-main-card,
  .photo-upload-card,
  .upload-photo-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 360px !important;
  }

  .upload-photo-dashed-box,
  .photo-upload-dropzone,
  .upload-photo-box {
    min-height: auto !important;
    height: auto !important;

    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    box-shadow: none !important;
  }

  .upload-photo-btn,
  .upload-btn,
  .photo-upload-btn,
  button.upload-photo-btn,
  a.upload-photo-btn {
    display: flex !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 272px !important;
    height: 56px !important;

    margin: 12px auto 18px !important;

    border-radius: 14px !important;

    background: #1f8d52 !important;

    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 700 !important;

    align-items: center !important;
    justify-content: center !important;

    border: 0 !important;

    position: relative !important;
    z-index: 50 !important;
  }

  .continue-btn,
  .photo-continue-btn,
  #btnContinue,
  #btnNextStep,
  #submitButton {

    width: 100% !important;

    height: 54px !important;

    border-radius: 12px !important;

    background: var(--register-btn-color) !important;
    /* background: #005f2f !important; */
    /* border-color: #005f2f !important; */
    border-color: #ffffff !important;
    color: #ffffff !important;

    font-size: 18px !important;
    font-weight: 700 !important;
  }

  /* PERSONALITY NEXT BUTTON — 430 × 932 ONLY */

  #btnContinue,
  #btnTableContinue {
    background: #005f2f !important;
    border-color: #005f2f !important;
    color: #ffffff !important;
  }

  /* RADIO CIRCLE GREEN — 430 × 932 ONLY */

  .eq input[type="radio"] {
    /* accent-color: #005f2f !important; */
    accent-color: var(--selection-color) !important;
  }

  .eq input[type="radio"]:checked {
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  /* VALIDATION RED BORDER — 430 × 932 ONLY */

  .eq .questionary-question.add-validation-class,
  .eq .ques-block .questionary-question.add-validation-class,
  .noneEq td.add-validation-class,
  .simple-Block.add-validation-class {
    border: 3px solid #d60000 !important;
    border-radius: 18px !important;
    padding: 12px !important;
  }
}
/* =========================================================
412 × 915 — QUESTIONNAIRE UI
========================================================= */

@media (width: 412px) and (height: 915px) {

.mm-questionary-parent-container,
  main {
    min-height: 100vh;
    background: var(--register-bg-color) !important;
    /* background: #eef5f0 !important; */
  }

  .mm-fixed {
    width: 100%;
    background: #ffffff !important;
    padding: 12px 18px 10px !important;
    box-shadow: 0 2px 12px rgba(30, 52, 39, 0.04);
  }

  .progress {
    position: relative;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: #e5ebe6 !important;
    overflow: visible !important;
  }

  .progress-bar {
    position: relative;
    min-width: 24px;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: var(--header-button-color) !important;
    /* background-color: #6b9a80 !important; */
    overflow: visible !important;
    color: transparent !important;
    font-size: 0 !important;
  }

  .progress-bar::after {
    content: attr(aria-valuenow) "%";
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--header-button-color);
    /* background: #6b9a80; */
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 3px 8px rgba(35, 69, 49, 0.16);
  }

  .mm-questionary-container {
    max-width: 430px;
    margin: 0 auto;
    padding: 0 20px 6px;
  }

  #questionsContainer {
    width: 100% !important;
    max-width: 392px !important;

    margin: 14px auto 0 !important;

    background:
      linear-gradient(180deg,
        #ffffff 0%,
        #f8fbf8 100%) !important;

    border: 1px solid rgba(107, 154, 128, 0.08) !important;

    border-radius: 36px !important;

    padding: 28px 18px 16px !important;

    overflow: hidden !important;

    box-shadow:
      0 24px 60px rgba(35, 69, 49, 0.08),
      0 8px 24px rgba(35, 69, 49, 0.05),
      inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;

    backdrop-filter: blur(8px);
  }

  .questionary-question,
  .question-bg-green-color {
    display: block !important;

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

    margin: 0 auto 18px !important;

    background: transparent !important;

    color: #18392b !important;

    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    letter-spacing: 0.1px !important;

    text-align: center !important;

    padding: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
  }

  .question-setting {
    text-align: left !important;
    padding-left: 0 !important;
  }

  .table {
    margin-bottom: 0 !important;
  }

  .table {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    background: transparent !important;
    border: 0 !important;
  }

  .table> :not(caption)>*>* {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  tbody,
  td,
  tfoot,
  th,
  thead,
  tr {
    border: 0 !important;
    background: transparent !important;
  }

  td {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
  }

  .simple-Block .row:not(.chip-layout) {
    display: block !important;
  }

  .simple-Block .row:not(.chip-layout)>div {
    width: 100% !important;
    margin-bottom: 6px !important;
  }

  .simple-Block .row>div:last-child {
    margin-bottom: 0 !important;
  }

  span.radio {
    position: relative !important;

    overflow: hidden !important;

    width: 100% !important;

    min-height: 56px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #ffffff !important;

    border: 1px solid #e7eeea !important;

    border-radius: 18px !important;

    padding: 0 18px !important;

    margin: 0 0 10px 0 !important;

    cursor: pointer !important;

    box-shadow:
      0 4px 12px rgba(35, 69, 49, 0.04),
      0 1px 3px rgba(35, 69, 49, 0.02) !important;

    transition: all 0.18s ease !important;
  }

  span.radio:hover {
    transform: translateY(-1px);
    box-shadow:
      0 8px 20px rgba(35, 69, 49, 0.08),
      0 2px 6px rgba(35, 69, 49, 0.04) !important;
  }

  span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;

    position: absolute !important;

    left: 18px !important;

    top: 50% !important;

    transform: translateY(-50%) !important;

    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;

    border: 2px solid #8aa895 !important;

    border-radius: 50% !important;

    background: #ffffff !important;

    opacity: 1 !important;

    visibility: visible !important;

    display: block !important;

    flex-shrink: 0 !important;

    cursor: pointer !important;

    z-index: 100 !important;

    pointer-events: auto !important;

    transition: all 0.18s ease !important;
  }

  span.radio input[type="radio"]:checked {
    /* border: 5px solid #5f8f75 !important; */
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  span.radio::before,
  span.radio label::before,
  span.radio label::after {
    display: none !important;
    content: none !important;
  }

  span.radio label,
  .custom-checkbox label,
  .custom-radio label {
    position: relative !important;

    z-index: 5 !important;

    width: 100% !important;

    min-height: 45px !important;
    /* min-height: 62px !important; */

    margin: 0 !important;

    padding: 0 18px 0 50px !important;

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

    color: var(--answer-color) !important;
    /* color: #2f473b !important; */

    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
    letter-spacing: 0 !important;

    text-align: left !important;

    cursor: pointer !important;
  }

  .ans-check {
    background: #f3f8f4 !important;
    border: 1px solid #a8c9b1 !important;
    color: #173628 !important;
    box-shadow: 0 6px 18px rgba(107, 154, 128, 0.10) !important;
  }

  form>div:last-of-type {
    max-width: 390px !important;
    margin: 10px auto 0 !important;
  }


  /* FORCE HIDDEN NEXT BUTTON TO STAY HIDDEN */
  #btnContinue.d-none,
  #btnTableContinue.d-none {
    display: none !important;
  }

  #btnContinue,
  #btnTableContinue {
    width: 100% !important;
    min-height: 62px !important;
    border: none !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #2d7446 0%, #1f5d36 100%) !important;
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow:
      0 10px 24px rgba(31, 93, 54, 0.22),
      0 2px 6px rgba(31, 93, 54, 0.10) !important;
    transition: all 0.18s ease !important;
  }

  .simple-Block.question-bg-green-color {
    background: transparent !important;
    background-color: transparent !important;
  }

  span.radio,
  span.radio *,
  span.radio label {
    pointer-events: auto !important;
  }

  /* =========================================================
  FINAL CHIP LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .simple-Block .row.chip-layout {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;

    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    align-content: flex-start !important;

    gap: 10px 8px !important;
    width: 100% !important;
    max-width: 352px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout>div,
  .simple-Block .row.chip-layout>[class*="col"] {
    display: contents !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox {
    display: inline-flex !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label,
  .simple-Block .row.chip-layout .custom-checkbox label {
    position: relative !important;
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 82px !important;
    max-width: 168px !important;
    min-height: 38px !important;
    height: auto !important;

    padding: 9px 14px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #dfe7e1 !important;
    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;

    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;

    overflow: visible !important;
    text-overflow: unset !important;

    box-shadow: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label::before,
  .simple-Block .row.chip-layout .custom-checkbox>label::after,
  .simple-Block .row.chip-layout .custom-checkbox label::before,
  .simple-Block .row.chip-layout .custom-checkbox label::after {
    display: none !important;
    content: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"]:checked+label,
  .simple-Block .row.chip-layout .custom-checkbox>label.ans-check,
  .simple-Block .row.chip-layout .custom-checkbox label.ans-check {
    background: var(--selection-color) !important;
    border-color: var(--selection-color) !important;
    /* background: #1f5d36 !important;
    border-color: #1f5d36 !important; */
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(31, 93, 54, 0.22) !important;
  }

  /* =========================================================
  YES/NO TABLE LAYOUT FIX — 430 × 932 ONLY
  Keeps Yes/No pages separate from normal radio-card pages
  ========================================================= */

  .noneEq table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    margin: 0 !important;
  }

  .noneEq thead,
  .noneEq tbody,
  .noneEq tr {
    display: table-header-group !important;
  }

  .noneEq tbody {
    display: table-row-group !important;
  }

  .noneEq tr {
    display: table-row !important;
  }

  .noneEq th,
  .noneEq td {
    display: table-cell !important;
    vertical-align: middle !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .noneEq th:first-child,
  .noneEq td:first-child {
    width: calc(100% - 104px) !important;
  }

  .noneEq th:nth-child(2),
  .noneEq th:nth-child(3),
  .noneEq td:nth-child(2),
  .noneEq td:nth-child(3) {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    text-align: center !important;
  }

  .noneEq thead th {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    height: 28px !important;
  }



  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq td:nth-child(2) span.radio,
  .noneEq td:nth-child(3) span.radio {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .noneEq td:nth-child(2) span.radio label,
  .noneEq td:nth-child(3) span.radio label {
    display: none !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: static !important;
    transform: none !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 3px solid #8aa895 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 5px solid #5f8f75 !important;
    background: #ffffff !important;
  }

  /* =========================================================
  PREMIUM YES/NO LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .noneEq table {
    background: #f8fbf8 !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .noneEq thead th {
    background: transparent !important;
    color: #173628 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }

  .noneEq tbody tr {
    background: #ffffff !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 8px rgba(35, 69, 49, 0.04) !important;
  }

  .noneEq tbody td:first-child {
    background: #ffffff !important;
    color: #173628 !important;
    height: 104px !important;
    padding: 14px 18px !important;
    border-radius: 18px 0 0 18px !important;
  }

  .noneEq tbody td:first-child,
  .noneEq tbody td:first-child * {
    color: #173628 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.34 !important;
  }

  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq tbody td:nth-child(3) {
    border-radius: 0 18px 18px 0 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    width: 22px !important;
    height: 22px !important;
    border: 2px solid #8aa895 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 6px solid #1f5d36 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE OLD GREEN TABLE STYLE
========================================================= */

  .eq .question-bg-green-color,
  .eq .questionary-question,
  .eq .simple-Block.question-bg-green-color,
  .eq span.radio,
  .eq span.radio label {
    background: none !important;
    /* background-color: #ffffff !important; */
    color: #1d3b2d !important;
  }

  .eq .question-bg-green-color,
  .eq .questionary-question {
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: left !important;
  }

  .eq span.radio {
    border: 1px solid #e7eeea !important;
    border-radius: 18px !important;
    margin-bottom: 10px !important;
  }

  .eq span.radio label {
    font-size: 14px !important;
    font-weight: 600 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE REMAINING TABLE LINES
========================================================= */

  .eq table,
  .eq tbody,
  .eq tr,
  .eq td,
  .eq th {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  .eq table {
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .eq tr {
    background: transparent !important;
  }

  .eq td {
    background: transparent !important;
  }

  /* =========================================================
430 × 932 ONLY
FINAL BORDER CLEANUP
========================================================= */

  .eq .questionary-question,
  .eq .question-bg-green-color,
  .eq tr,
  .eq td,
  .eq tbody,
  .eq table {
    border: none !important;
    border-color: transparent !important;
    outline: none !important;
  }

  .eq td:first-child {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
  }

  .eq .questionary-question::before,
  .eq .questionary-question::after,
  .eq .question-bg-green-color::before,
  .eq .question-bg-green-color::after {
    display: none !important;
    content: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE QUESTION BLOCK BORDER
========================================================= */

  .eq .ques-block {
    border: 0 !important;
    border-color: transparent !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE CHILD COLUMN BORDERS
========================================================= */

  .eq .ques-block>div,
  .eq .ques-block .col-md-4,
  .eq .ques-block .col-md-8 {
    border: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE OLD ANSWER DIVIDER LINES
========================================================= */

  .eq span.radio,
  .eq span.radio label,
  .eq .question-setting,
  .eq .question-remove-border-radius,
  .eq .question-bg-green-color {
    border-bottom: 0 !important;
    border-top: 0 !important;
  }

  .eq .question-setting {
    padding-bottom: 0 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY ANSWER ROW ALIGNMENT
========================================================= */

  .eq .personality-answer-row {
    display: flex !important;
    align-items: flex-start !important;

    width: 100% !important;

    padding: 10px 15px !important;
    margin: 0 0 10px 0 !important;

    gap: 14px !important;
    background: #ffff;
    border-radius: 18px;
  }

    .eq .personality-answer-radio {
        /* width: 17px !important;
        height: 17px !important;
        min-width: 17px !important; */
        min-height: 17px !important;
        margin: 15px 0 0 0 !important;
        /* flex: 0 0 17px !important; */
        appearance: none !important;
        -webkit-appearance: none !important;
        /* position: absolute !important; */
        /* left: 18px !important; */
        /* top: 50% !important; */
        transform: translateY(-50%) !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        /* min-height: 22px !important; */
        border: 2px solid #8aa895 !important;
        border-radius: 50% !important;
        background: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
        display: block !important;
        /* flex-shrink: 0 !important; */
        cursor: pointer !important;
        z-index: 100 !important;
        pointer-events: auto !important;
        transition: all 0.18s ease !important;
    }

  .eq .personality-answer-label {
    display: block !important;

    width: 100% !important;

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

    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;

    text-align: left !important;
  }

  /* =========================================================
430 × 932 ONLY
RESTORE ORIGINAL PHOTO UPLOAD PAGE LAYOUT
========================================================= */

  .photo-upload-main-heading,
  .create-profile-heading,
  .upload-page-top-banner,
  .upload-top-banner {
    display: none !important;
  }

  .upload-photo-main-card,
  .photo-upload-card,
  .upload-photo-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 360px !important;
  }

  .upload-photo-dashed-box,
  .photo-upload-dropzone,
  .upload-photo-box {
    min-height: auto !important;
    height: auto !important;

    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    box-shadow: none !important;
  }

  .upload-photo-btn,
  .upload-btn,
  .photo-upload-btn,
  button.upload-photo-btn,
  a.upload-photo-btn {
    display: flex !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 272px !important;
    height: 56px !important;

    margin: 12px auto 18px !important;

    border-radius: 14px !important;

    background: #1f8d52 !important;

    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 700 !important;

    align-items: center !important;
    justify-content: center !important;

    border: 0 !important;

    position: relative !important;
    z-index: 50 !important;
  }

  .continue-btn,
  .photo-continue-btn,
  #btnContinue,
  #btnNextStep,
  #submitButton {

    width: 100% !important;

    height: 54px !important;

    border-radius: 12px !important;

    background: var(--register-btn-color) !important;
    /* background: #005f2f !important; */
    /* border-color: #005f2f !important; */
    border-color: #ffffff !important;
    color: #ffffff !important;

    font-size: 18px !important;
    font-weight: 700 !important;
  }

  /* PERSONALITY NEXT BUTTON — 430 × 932 ONLY */

  #btnContinue,
  #btnTableContinue {
    background: #005f2f !important;
    border-color: #005f2f !important;
    color: #ffffff !important;
  }

  /* RADIO CIRCLE GREEN — 430 × 932 ONLY */

  .eq input[type="radio"] {
    /* accent-color: #005f2f !important; */
    accent-color: var(--selection-color) !important;
  }

  .eq input[type="radio"]:checked {
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  /* VALIDATION RED BORDER — 430 × 932 ONLY */

  .eq .questionary-question.add-validation-class,
  .eq .ques-block .questionary-question.add-validation-class,
  .noneEq td.add-validation-class,
  .simple-Block.add-validation-class {
    border: 3px solid #d60000 !important;
    border-radius: 18px !important;
    padding: 12px !important;
  }
}
/* =========================================================
393 × 852 — QUESTIONNAIRE UI
========================================================= */

@media (width: 393px) and (height: 852px) {

.mm-questionary-parent-container,
  main {
    min-height: 100vh;
    background: var(--register-bg-color) !important;
    /* background: #eef5f0 !important; */
  }

  .mm-fixed {
    width: 100%;
    background: #ffffff !important;
    padding: 12px 18px 10px !important;
    box-shadow: 0 2px 12px rgba(30, 52, 39, 0.04);
  }

  .progress {
    position: relative;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: #e5ebe6 !important;
    overflow: visible !important;
  }

  .progress-bar {
    position: relative;
    min-width: 24px;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: var(--header-button-color) !important;
    /* background-color: #6b9a80 !important; */
    overflow: visible !important;
    color: transparent !important;
    font-size: 0 !important;
  }

  .progress-bar::after {
    content: attr(aria-valuenow) "%";
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--header-button-color);
    /* background: #6b9a80; */
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 3px 8px rgba(35, 69, 49, 0.16);
  }

  .mm-questionary-container {
    max-width: 430px;
    margin: 0 auto;
    padding: 0 20px 6px;
  }

  #questionsContainer {
    width: 100% !important;
    max-width: 392px !important;

    margin: 14px auto 0 !important;

    background:
      linear-gradient(180deg,
        #ffffff 0%,
        #f8fbf8 100%) !important;

    border: 1px solid rgba(107, 154, 128, 0.08) !important;

    border-radius: 36px !important;

    padding: 28px 18px 16px !important;

    overflow: hidden !important;

    box-shadow:
      0 24px 60px rgba(35, 69, 49, 0.08),
      0 8px 24px rgba(35, 69, 49, 0.05),
      inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;

    backdrop-filter: blur(8px);
  }

  .questionary-question,
  .question-bg-green-color {
    display: block !important;

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

    margin: 0 auto 18px !important;

    background: transparent !important;

    color: #18392b !important;

    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    letter-spacing: 0.1px !important;

    text-align: center !important;

    padding: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
  }

  .question-setting {
    text-align: left !important;
    padding-left: 0 !important;
  }

  .table {
    margin-bottom: 0 !important;
  }

  .table {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    background: transparent !important;
    border: 0 !important;
  }

  .table> :not(caption)>*>* {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  tbody,
  td,
  tfoot,
  th,
  thead,
  tr {
    border: 0 !important;
    background: transparent !important;
  }

  td {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
  }

  .simple-Block .row:not(.chip-layout) {
    display: block !important;
  }

  .simple-Block .row:not(.chip-layout)>div {
    width: 100% !important;
    margin-bottom: 6px !important;
  }

  .simple-Block .row>div:last-child {
    margin-bottom: 0 !important;
  }

  span.radio {
    position: relative !important;

    overflow: hidden !important;

    width: 100% !important;

    min-height: 56px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #ffffff !important;

    border: 1px solid #e7eeea !important;

    border-radius: 18px !important;

    padding: 0 18px !important;

    margin: 0 0 10px 0 !important;

    cursor: pointer !important;

    box-shadow:
      0 4px 12px rgba(35, 69, 49, 0.04),
      0 1px 3px rgba(35, 69, 49, 0.02) !important;

    transition: all 0.18s ease !important;
  }

  span.radio:hover {
    transform: translateY(-1px);
    box-shadow:
      0 8px 20px rgba(35, 69, 49, 0.08),
      0 2px 6px rgba(35, 69, 49, 0.04) !important;
  }

  span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;

    position: absolute !important;

    left: 18px !important;

    top: 50% !important;

    transform: translateY(-50%) !important;

    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;

    border: 2px solid #8aa895 !important;

    border-radius: 50% !important;

    background: #ffffff !important;

    opacity: 1 !important;

    visibility: visible !important;

    display: block !important;

    flex-shrink: 0 !important;

    cursor: pointer !important;

    z-index: 100 !important;

    pointer-events: auto !important;

    transition: all 0.18s ease !important;
  }

  span.radio input[type="radio"]:checked {
    /* border: 5px solid #5f8f75 !important; */
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  span.radio::before,
  span.radio label::before,
  span.radio label::after {
    display: none !important;
    content: none !important;
  }

  span.radio label,
  .custom-checkbox label,
  .custom-radio label {
    position: relative !important;

    z-index: 5 !important;

    width: 100% !important;

    min-height: 45px !important;
    /* min-height: 62px !important; */

    margin: 0 !important;

    padding: 0 18px 0 50px !important;

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

    color: var(--answer-color) !important;
    /* color: #2f473b !important; */

    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
    letter-spacing: 0 !important;

    text-align: left !important;

    cursor: pointer !important;
  }

  .ans-check {
    background: #f3f8f4 !important;
    border: 1px solid #a8c9b1 !important;
    color: #173628 !important;
    box-shadow: 0 6px 18px rgba(107, 154, 128, 0.10) !important;
  }

  form>div:last-of-type {
    max-width: 390px !important;
    margin: 10px auto 0 !important;
  }


  /* FORCE HIDDEN NEXT BUTTON TO STAY HIDDEN */
  #btnContinue.d-none,
  #btnTableContinue.d-none {
    display: none !important;
  }

  #btnContinue,
  #btnTableContinue {
    width: 100% !important;
    min-height: 62px !important;
    border: none !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #2d7446 0%, #1f5d36 100%) !important;
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow:
      0 10px 24px rgba(31, 93, 54, 0.22),
      0 2px 6px rgba(31, 93, 54, 0.10) !important;
    transition: all 0.18s ease !important;
  }

  .simple-Block.question-bg-green-color {
    background: transparent !important;
    background-color: transparent !important;
  }

  span.radio,
  span.radio *,
  span.radio label {
    pointer-events: auto !important;
  }

  /* =========================================================
  FINAL CHIP LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .simple-Block .row.chip-layout {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;

    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    align-content: flex-start !important;

    gap: 10px 8px !important;
    width: 100% !important;
    max-width: 352px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout>div,
  .simple-Block .row.chip-layout>[class*="col"] {
    display: contents !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox {
    display: inline-flex !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label,
  .simple-Block .row.chip-layout .custom-checkbox label {
    position: relative !important;
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 82px !important;
    max-width: 168px !important;
    min-height: 38px !important;
    height: auto !important;

    padding: 9px 14px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #dfe7e1 !important;
    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;

    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;

    overflow: visible !important;
    text-overflow: unset !important;

    box-shadow: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label::before,
  .simple-Block .row.chip-layout .custom-checkbox>label::after,
  .simple-Block .row.chip-layout .custom-checkbox label::before,
  .simple-Block .row.chip-layout .custom-checkbox label::after {
    display: none !important;
    content: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"]:checked+label,
  .simple-Block .row.chip-layout .custom-checkbox>label.ans-check,
  .simple-Block .row.chip-layout .custom-checkbox label.ans-check {
    background: var(--selection-color) !important;
    border-color: var(--selection-color) !important;
    /* background: #1f5d36 !important;
    border-color: #1f5d36 !important; */
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(31, 93, 54, 0.22) !important;
  }

  /* =========================================================
  YES/NO TABLE LAYOUT FIX — 430 × 932 ONLY
  Keeps Yes/No pages separate from normal radio-card pages
  ========================================================= */

  .noneEq table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    margin: 0 !important;
  }

  .noneEq thead,
  .noneEq tbody,
  .noneEq tr {
    display: table-header-group !important;
  }

  .noneEq tbody {
    display: table-row-group !important;
  }

  .noneEq tr {
    display: table-row !important;
  }

  .noneEq th,
  .noneEq td {
    display: table-cell !important;
    vertical-align: middle !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .noneEq th:first-child,
  .noneEq td:first-child {
    width: calc(100% - 104px) !important;
  }

  .noneEq th:nth-child(2),
  .noneEq th:nth-child(3),
  .noneEq td:nth-child(2),
  .noneEq td:nth-child(3) {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    text-align: center !important;
  }

  .noneEq thead th {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    height: 28px !important;
  }



  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq td:nth-child(2) span.radio,
  .noneEq td:nth-child(3) span.radio {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .noneEq td:nth-child(2) span.radio label,
  .noneEq td:nth-child(3) span.radio label {
    display: none !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: static !important;
    transform: none !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 3px solid #8aa895 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 5px solid #5f8f75 !important;
    background: #ffffff !important;
  }

  /* =========================================================
  PREMIUM YES/NO LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .noneEq table {
    background: #f8fbf8 !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .noneEq thead th {
    background: transparent !important;
    color: #173628 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }

  .noneEq tbody tr {
    background: #ffffff !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 8px rgba(35, 69, 49, 0.04) !important;
  }

  .noneEq tbody td:first-child {
    background: #ffffff !important;
    color: #173628 !important;
    height: 104px !important;
    padding: 14px 18px !important;
    border-radius: 18px 0 0 18px !important;
  }

  .noneEq tbody td:first-child,
  .noneEq tbody td:first-child * {
    color: #173628 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.34 !important;
  }

  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq tbody td:nth-child(3) {
    border-radius: 0 18px 18px 0 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    width: 22px !important;
    height: 22px !important;
    border: 2px solid #8aa895 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 6px solid #1f5d36 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE OLD GREEN TABLE STYLE
========================================================= */

  .eq .question-bg-green-color,
  .eq .questionary-question,
  .eq .simple-Block.question-bg-green-color,
  .eq span.radio,
  .eq span.radio label {
    background: none !important;
    /* background-color: #ffffff !important; */
    color: #1d3b2d !important;
  }

  .eq .question-bg-green-color,
  .eq .questionary-question {
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: left !important;
  }

  .eq span.radio {
    border: 1px solid #e7eeea !important;
    border-radius: 18px !important;
    margin-bottom: 10px !important;
  }

  .eq span.radio label {
    font-size: 14px !important;
    font-weight: 600 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE REMAINING TABLE LINES
========================================================= */

  .eq table,
  .eq tbody,
  .eq tr,
  .eq td,
  .eq th {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  .eq table {
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .eq tr {
    background: transparent !important;
  }

  .eq td {
    background: transparent !important;
  }

  /* =========================================================
430 × 932 ONLY
FINAL BORDER CLEANUP
========================================================= */

  .eq .questionary-question,
  .eq .question-bg-green-color,
  .eq tr,
  .eq td,
  .eq tbody,
  .eq table {
    border: none !important;
    border-color: transparent !important;
    outline: none !important;
  }

  .eq td:first-child {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
  }

  .eq .questionary-question::before,
  .eq .questionary-question::after,
  .eq .question-bg-green-color::before,
  .eq .question-bg-green-color::after {
    display: none !important;
    content: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE QUESTION BLOCK BORDER
========================================================= */

  .eq .ques-block {
    border: 0 !important;
    border-color: transparent !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE CHILD COLUMN BORDERS
========================================================= */

  .eq .ques-block>div,
  .eq .ques-block .col-md-4,
  .eq .ques-block .col-md-8 {
    border: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE OLD ANSWER DIVIDER LINES
========================================================= */

  .eq span.radio,
  .eq span.radio label,
  .eq .question-setting,
  .eq .question-remove-border-radius,
  .eq .question-bg-green-color {
    border-bottom: 0 !important;
    border-top: 0 !important;
  }

  .eq .question-setting {
    padding-bottom: 0 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY ANSWER ROW ALIGNMENT
========================================================= */

  .eq .personality-answer-row {
    display: flex !important;
    align-items: flex-start !important;

    width: 100% !important;

    padding: 10px 15px !important;
    margin: 0 0 10px 0 !important;

    gap: 14px !important;
    background: #ffff;
    border-radius: 18px;
  }

    .eq .personality-answer-radio {
        /* width: 17px !important;
        height: 17px !important;
        min-width: 17px !important; */
        min-height: 17px !important;
        margin: 15px 0 0 0 !important;
        /* flex: 0 0 17px !important; */
        appearance: none !important;
        -webkit-appearance: none !important;
        /* position: absolute !important; */
        /* left: 18px !important; */
        /* top: 50% !important; */
        transform: translateY(-50%) !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        /* min-height: 22px !important; */
        border: 2px solid #8aa895 !important;
        border-radius: 50% !important;
        background: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
        display: block !important;
        /* flex-shrink: 0 !important; */
        cursor: pointer !important;
        z-index: 100 !important;
        pointer-events: auto !important;
        transition: all 0.18s ease !important;
    }

  .eq .personality-answer-label {
    display: block !important;

    width: 100% !important;

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

    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;

    text-align: left !important;
  }

  /* =========================================================
430 × 932 ONLY
RESTORE ORIGINAL PHOTO UPLOAD PAGE LAYOUT
========================================================= */

  .photo-upload-main-heading,
  .create-profile-heading,
  .upload-page-top-banner,
  .upload-top-banner {
    display: none !important;
  }

  .upload-photo-main-card,
  .photo-upload-card,
  .upload-photo-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 360px !important;
  }

  .upload-photo-dashed-box,
  .photo-upload-dropzone,
  .upload-photo-box {
    min-height: auto !important;
    height: auto !important;

    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    box-shadow: none !important;
  }

  .upload-photo-btn,
  .upload-btn,
  .photo-upload-btn,
  button.upload-photo-btn,
  a.upload-photo-btn {
    display: flex !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 272px !important;
    height: 56px !important;

    margin: 12px auto 18px !important;

    border-radius: 14px !important;

    background: #1f8d52 !important;

    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 700 !important;

    align-items: center !important;
    justify-content: center !important;

    border: 0 !important;

    position: relative !important;
    z-index: 50 !important;
  }

  .continue-btn,
  .photo-continue-btn,
  #btnContinue,
  #btnNextStep,
  #submitButton {

    width: 100% !important;

    height: 54px !important;

    border-radius: 12px !important;

    background: var(--register-btn-color) !important;
    /* background: #005f2f !important; */
    /* border-color: #005f2f !important; */
    border-color: #ffffff !important;
    color: #ffffff !important;

    font-size: 18px !important;
    font-weight: 700 !important;
  }

  /* PERSONALITY NEXT BUTTON — 430 × 932 ONLY */

  #btnContinue,
  #btnTableContinue {
    background: #005f2f !important;
    border-color: #005f2f !important;
    color: #ffffff !important;
  }

  /* RADIO CIRCLE GREEN — 430 × 932 ONLY */

  .eq input[type="radio"] {
    /* accent-color: #005f2f !important; */
    accent-color: var(--selection-color) !important;
  }

  .eq input[type="radio"]:checked {
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  /* VALIDATION RED BORDER — 430 × 932 ONLY */

  .eq .questionary-question.add-validation-class,
  .eq .ques-block .questionary-question.add-validation-class,
  .noneEq td.add-validation-class,
  .simple-Block.add-validation-class {
    border: 3px solid #d60000 !important;
    border-radius: 18px !important;
    padding: 12px !important;
  }
}
/* =========================================================
390 × 844 — QUESTIONNAIRE UI
========================================================= */

@media (width: 390px) and (height: 844px) {

.mm-questionary-parent-container,
  main {
    min-height: 100vh;
    background: var(--register-bg-color) !important;
    /* background: #eef5f0 !important; */
  }

  .mm-fixed {
    width: 100%;
    background: #ffffff !important;
    padding: 12px 18px 10px !important;
    box-shadow: 0 2px 12px rgba(30, 52, 39, 0.04);
  }

  .progress {
    position: relative;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: #e5ebe6 !important;
    overflow: visible !important;
  }

  .progress-bar {
    position: relative;
    min-width: 24px;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: var(--header-button-color) !important;
    /* background-color: #6b9a80 !important; */
    overflow: visible !important;
    color: transparent !important;
    font-size: 0 !important;
  }

  .progress-bar::after {
    content: attr(aria-valuenow) "%";
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--header-button-color);
    /* background: #6b9a80; */
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 3px 8px rgba(35, 69, 49, 0.16);
  }

  .mm-questionary-container {
    max-width: 430px;
    margin: 0 auto;
    padding: 0 20px 6px;
  }

  #questionsContainer {
    width: 100% !important;
    max-width: 392px !important;

    margin: 14px auto 0 !important;

    background:
      linear-gradient(180deg,
        #ffffff 0%,
        #f8fbf8 100%) !important;

    border: 1px solid rgba(107, 154, 128, 0.08) !important;

    border-radius: 36px !important;

    padding: 28px 18px 16px !important;

    overflow: hidden !important;

    box-shadow:
      0 24px 60px rgba(35, 69, 49, 0.08),
      0 8px 24px rgba(35, 69, 49, 0.05),
      inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;

    backdrop-filter: blur(8px);
  }

  .questionary-question,
  .question-bg-green-color {
    display: block !important;

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

    margin: 0 auto 18px !important;

    background: transparent !important;

    color: #18392b !important;

    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    letter-spacing: 0.1px !important;

    text-align: center !important;

    padding: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
  }

  .question-setting {
    text-align: left !important;
    padding-left: 0 !important;
  }

  .table {
    margin-bottom: 0 !important;
  }

  .table {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    background: transparent !important;
    border: 0 !important;
  }

  .table> :not(caption)>*>* {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  tbody,
  td,
  tfoot,
  th,
  thead,
  tr {
    border: 0 !important;
    background: transparent !important;
  }

  td {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
  }

  .simple-Block .row:not(.chip-layout) {
    display: block !important;
  }

  .simple-Block .row:not(.chip-layout)>div {
    width: 100% !important;
    margin-bottom: 6px !important;
  }

  .simple-Block .row>div:last-child {
    margin-bottom: 0 !important;
  }

  span.radio {
    position: relative !important;

    overflow: hidden !important;

    width: 100% !important;

    min-height: 56px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #ffffff !important;

    border: 1px solid #e7eeea !important;

    border-radius: 18px !important;

    padding: 0 18px !important;

    margin: 0 0 10px 0 !important;

    cursor: pointer !important;

    box-shadow:
      0 4px 12px rgba(35, 69, 49, 0.04),
      0 1px 3px rgba(35, 69, 49, 0.02) !important;

    transition: all 0.18s ease !important;
  }

  span.radio:hover {
    transform: translateY(-1px);
    box-shadow:
      0 8px 20px rgba(35, 69, 49, 0.08),
      0 2px 6px rgba(35, 69, 49, 0.04) !important;
  }

  span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;

    position: absolute !important;

    left: 18px !important;

    top: 50% !important;

    transform: translateY(-50%) !important;

    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;

    border: 2px solid #8aa895 !important;

    border-radius: 50% !important;

    background: #ffffff !important;

    opacity: 1 !important;

    visibility: visible !important;

    display: block !important;

    flex-shrink: 0 !important;

    cursor: pointer !important;

    z-index: 100 !important;

    pointer-events: auto !important;

    transition: all 0.18s ease !important;
  }

  span.radio input[type="radio"]:checked {
    /* border: 5px solid #5f8f75 !important; */
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  span.radio::before,
  span.radio label::before,
  span.radio label::after {
    display: none !important;
    content: none !important;
  }

  span.radio label,
  .custom-checkbox label,
  .custom-radio label {
    position: relative !important;

    z-index: 5 !important;

    width: 100% !important;

    min-height: 45px !important;
    /* min-height: 62px !important; */

    margin: 0 !important;

    padding: 0 18px 0 50px !important;

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

    color: var(--answer-color) !important;
    /* color: #2f473b !important; */

    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
    letter-spacing: 0 !important;

    text-align: left !important;

    cursor: pointer !important;
  }

  .ans-check {
    background: #f3f8f4 !important;
    border: 1px solid #a8c9b1 !important;
    color: #173628 !important;
    box-shadow: 0 6px 18px rgba(107, 154, 128, 0.10) !important;
  }

  form>div:last-of-type {
    max-width: 390px !important;
    margin: 10px auto 0 !important;
  }


  /* FORCE HIDDEN NEXT BUTTON TO STAY HIDDEN */
  #btnContinue.d-none,
  #btnTableContinue.d-none {
    display: none !important;
  }

  #btnContinue,
  #btnTableContinue {
    width: 100% !important;
    min-height: 62px !important;
    border: none !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #2d7446 0%, #1f5d36 100%) !important;
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow:
      0 10px 24px rgba(31, 93, 54, 0.22),
      0 2px 6px rgba(31, 93, 54, 0.10) !important;
    transition: all 0.18s ease !important;
  }

  .simple-Block.question-bg-green-color {
    background: transparent !important;
    background-color: transparent !important;
  }

  span.radio,
  span.radio *,
  span.radio label {
    pointer-events: auto !important;
  }

  /* =========================================================
  FINAL CHIP LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .simple-Block .row.chip-layout {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;

    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    align-content: flex-start !important;

    gap: 10px 8px !important;
    width: 100% !important;
    max-width: 352px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout>div,
  .simple-Block .row.chip-layout>[class*="col"] {
    display: contents !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox {
    display: inline-flex !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label,
  .simple-Block .row.chip-layout .custom-checkbox label {
    position: relative !important;
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 82px !important;
    max-width: 168px !important;
    min-height: 38px !important;
    height: auto !important;

    padding: 9px 14px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #dfe7e1 !important;
    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;

    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;

    overflow: visible !important;
    text-overflow: unset !important;

    box-shadow: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label::before,
  .simple-Block .row.chip-layout .custom-checkbox>label::after,
  .simple-Block .row.chip-layout .custom-checkbox label::before,
  .simple-Block .row.chip-layout .custom-checkbox label::after {
    display: none !important;
    content: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"]:checked+label,
  .simple-Block .row.chip-layout .custom-checkbox>label.ans-check,
  .simple-Block .row.chip-layout .custom-checkbox label.ans-check {
    background: var(--selection-color) !important;
    border-color: var(--selection-color) !important;
    /* background: #1f5d36 !important;
    border-color: #1f5d36 !important; */
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(31, 93, 54, 0.22) !important;
  }

  /* =========================================================
  YES/NO TABLE LAYOUT FIX — 430 × 932 ONLY
  Keeps Yes/No pages separate from normal radio-card pages
  ========================================================= */

  .noneEq table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    margin: 0 !important;
  }

  .noneEq thead,
  .noneEq tbody,
  .noneEq tr {
    display: table-header-group !important;
  }

  .noneEq tbody {
    display: table-row-group !important;
  }

  .noneEq tr {
    display: table-row !important;
  }

  .noneEq th,
  .noneEq td {
    display: table-cell !important;
    vertical-align: middle !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .noneEq th:first-child,
  .noneEq td:first-child {
    width: calc(100% - 104px) !important;
  }

  .noneEq th:nth-child(2),
  .noneEq th:nth-child(3),
  .noneEq td:nth-child(2),
  .noneEq td:nth-child(3) {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    text-align: center !important;
  }

  .noneEq thead th {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    height: 28px !important;
  }



  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq td:nth-child(2) span.radio,
  .noneEq td:nth-child(3) span.radio {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .noneEq td:nth-child(2) span.radio label,
  .noneEq td:nth-child(3) span.radio label {
    display: none !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: static !important;
    transform: none !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 3px solid #8aa895 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 5px solid #5f8f75 !important;
    background: #ffffff !important;
  }

  /* =========================================================
  PREMIUM YES/NO LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .noneEq table {
    background: #f8fbf8 !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .noneEq thead th {
    background: transparent !important;
    color: #173628 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }

  .noneEq tbody tr {
    background: #ffffff !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 8px rgba(35, 69, 49, 0.04) !important;
  }

  .noneEq tbody td:first-child {
    background: #ffffff !important;
    color: #173628 !important;
    height: 104px !important;
    padding: 14px 18px !important;
    border-radius: 18px 0 0 18px !important;
  }

  .noneEq tbody td:first-child,
  .noneEq tbody td:first-child * {
    color: #173628 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.34 !important;
  }

  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq tbody td:nth-child(3) {
    border-radius: 0 18px 18px 0 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    width: 22px !important;
    height: 22px !important;
    border: 2px solid #8aa895 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 6px solid #1f5d36 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE OLD GREEN TABLE STYLE
========================================================= */

  .eq .question-bg-green-color,
  .eq .questionary-question,
  .eq .simple-Block.question-bg-green-color,
  .eq span.radio,
  .eq span.radio label {
    background: none !important;
    /* background-color: #ffffff !important; */
    color: #1d3b2d !important;
  }

  .eq .question-bg-green-color,
  .eq .questionary-question {
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: left !important;
  }

  .eq span.radio {
    border: 1px solid #e7eeea !important;
    border-radius: 18px !important;
    margin-bottom: 10px !important;
  }

  .eq span.radio label {
    font-size: 14px !important;
    font-weight: 600 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE REMAINING TABLE LINES
========================================================= */

  .eq table,
  .eq tbody,
  .eq tr,
  .eq td,
  .eq th {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  .eq table {
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .eq tr {
    background: transparent !important;
  }

  .eq td {
    background: transparent !important;
  }

  /* =========================================================
430 × 932 ONLY
FINAL BORDER CLEANUP
========================================================= */

  .eq .questionary-question,
  .eq .question-bg-green-color,
  .eq tr,
  .eq td,
  .eq tbody,
  .eq table {
    border: none !important;
    border-color: transparent !important;
    outline: none !important;
  }

  .eq td:first-child {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
  }

  .eq .questionary-question::before,
  .eq .questionary-question::after,
  .eq .question-bg-green-color::before,
  .eq .question-bg-green-color::after {
    display: none !important;
    content: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE QUESTION BLOCK BORDER
========================================================= */

  .eq .ques-block {
    border: 0 !important;
    border-color: transparent !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE CHILD COLUMN BORDERS
========================================================= */

  .eq .ques-block>div,
  .eq .ques-block .col-md-4,
  .eq .ques-block .col-md-8 {
    border: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE OLD ANSWER DIVIDER LINES
========================================================= */

  .eq span.radio,
  .eq span.radio label,
  .eq .question-setting,
  .eq .question-remove-border-radius,
  .eq .question-bg-green-color {
    border-bottom: 0 !important;
    border-top: 0 !important;
  }

  .eq .question-setting {
    padding-bottom: 0 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY ANSWER ROW ALIGNMENT
========================================================= */

  .eq .personality-answer-row {
    display: flex !important;
    align-items: flex-start !important;

    width: 100% !important;

    padding: 10px 15px !important;
    margin: 0 0 10px 0 !important;

    gap: 14px !important;
    background: #ffff;
    border-radius: 18px;
  }

    .eq .personality-answer-radio {
        /* width: 17px !important;
        height: 17px !important;
        min-width: 17px !important; */
        min-height: 17px !important;
        margin: 15px 0 0 0 !important;
        /* flex: 0 0 17px !important; */
        appearance: none !important;
        -webkit-appearance: none !important;
        /* position: absolute !important; */
        /* left: 18px !important; */
        /* top: 50% !important; */
        transform: translateY(-50%) !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        /* min-height: 22px !important; */
        border: 2px solid #8aa895 !important;
        border-radius: 50% !important;
        background: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
        display: block !important;
        /* flex-shrink: 0 !important; */
        cursor: pointer !important;
        z-index: 100 !important;
        pointer-events: auto !important;
        transition: all 0.18s ease !important;
    }

  .eq .personality-answer-label {
    display: block !important;

    width: 100% !important;

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

    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;

    text-align: left !important;
  }

  /* =========================================================
430 × 932 ONLY
RESTORE ORIGINAL PHOTO UPLOAD PAGE LAYOUT
========================================================= */

  .photo-upload-main-heading,
  .create-profile-heading,
  .upload-page-top-banner,
  .upload-top-banner {
    display: none !important;
  }

  .upload-photo-main-card,
  .photo-upload-card,
  .upload-photo-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 360px !important;
  }

  .upload-photo-dashed-box,
  .photo-upload-dropzone,
  .upload-photo-box {
    min-height: auto !important;
    height: auto !important;

    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    box-shadow: none !important;
  }

  .upload-photo-btn,
  .upload-btn,
  .photo-upload-btn,
  button.upload-photo-btn,
  a.upload-photo-btn {
    display: flex !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 272px !important;
    height: 56px !important;

    margin: 12px auto 18px !important;

    border-radius: 14px !important;

    background: #1f8d52 !important;

    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 700 !important;

    align-items: center !important;
    justify-content: center !important;

    border: 0 !important;

    position: relative !important;
    z-index: 50 !important;
  }

  .continue-btn,
  .photo-continue-btn,
  #btnContinue,
  #btnNextStep,
  #submitButton {

    width: 100% !important;

    height: 54px !important;

    border-radius: 12px !important;

    background: var(--register-btn-color) !important;
    /* background: #005f2f !important; */
    /* border-color: #005f2f !important; */
    border-color: #ffffff !important;
    color: #ffffff !important;

    font-size: 18px !important;
    font-weight: 700 !important;
  }

  /* PERSONALITY NEXT BUTTON — 430 × 932 ONLY */

  #btnContinue,
  #btnTableContinue {
    background: #005f2f !important;
    border-color: #005f2f !important;
    color: #ffffff !important;
  }

  /* RADIO CIRCLE GREEN — 430 × 932 ONLY */

  .eq input[type="radio"] {
    /* accent-color: #005f2f !important; */
    accent-color: var(--selection-color) !important;
  }

  .eq input[type="radio"]:checked {
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  /* VALIDATION RED BORDER — 430 × 932 ONLY */

  .eq .questionary-question.add-validation-class,
  .eq .ques-block .questionary-question.add-validation-class,
  .noneEq td.add-validation-class,
  .simple-Block.add-validation-class {
    border: 3px solid #d60000 !important;
    border-radius: 18px !important;
    padding: 12px !important;
  }
}
/* =========================================================
375 × 812 — QUESTIONNAIRE UI
========================================================= */

@media (width: 375px) and (height: 812px) {

.mm-questionary-parent-container,
  main {
    min-height: 100vh;
    background: var(--register-bg-color) !important;
    /* background: #eef5f0 !important; */
  }

  .mm-fixed {
    width: 100%;
    background: #ffffff !important;
    padding: 12px 18px 10px !important;
    box-shadow: 0 2px 12px rgba(30, 52, 39, 0.04);
  }

  .progress {
    position: relative;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: #e5ebe6 !important;
    overflow: visible !important;
  }

  .progress-bar {
    position: relative;
    min-width: 24px;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: var(--header-button-color) !important;
    /* background-color: #6b9a80 !important; */
    overflow: visible !important;
    color: transparent !important;
    font-size: 0 !important;
  }

  .progress-bar::after {
    content: attr(aria-valuenow) "%";
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--header-button-color);
    /* background: #6b9a80; */
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 3px 8px rgba(35, 69, 49, 0.16);
  }

  .mm-questionary-container {
    max-width: 430px;
    margin: 0 auto;
    padding: 0 20px 6px;
  }

  #questionsContainer {
    width: 100% !important;
    max-width: 392px !important;

    margin: 14px auto 0 !important;

    background:
      linear-gradient(180deg,
        #ffffff 0%,
        #f8fbf8 100%) !important;

    border: 1px solid rgba(107, 154, 128, 0.08) !important;

    border-radius: 36px !important;

    padding: 28px 18px 16px !important;

    overflow: hidden !important;

    box-shadow:
      0 24px 60px rgba(35, 69, 49, 0.08),
      0 8px 24px rgba(35, 69, 49, 0.05),
      inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;

    backdrop-filter: blur(8px);
  }

  .questionary-question,
  .question-bg-green-color {
    display: block !important;

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

    margin: 0 auto 18px !important;

    background: transparent !important;

    color: #18392b !important;

    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    letter-spacing: 0.1px !important;

    text-align: center !important;

    padding: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
  }

  .question-setting {
    text-align: left !important;
    padding-left: 0 !important;
  }

  .table {
    margin-bottom: 0 !important;
  }

  .table {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    background: transparent !important;
    border: 0 !important;
  }

  .table> :not(caption)>*>* {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  tbody,
  td,
  tfoot,
  th,
  thead,
  tr {
    border: 0 !important;
    background: transparent !important;
  }

  td {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
  }

  .simple-Block .row:not(.chip-layout) {
    display: block !important;
  }

  .simple-Block .row:not(.chip-layout)>div {
    width: 100% !important;
    margin-bottom: 6px !important;
  }

  .simple-Block .row>div:last-child {
    margin-bottom: 0 !important;
  }

  span.radio {
    position: relative !important;

    overflow: hidden !important;

    width: 100% !important;

    min-height: 56px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #ffffff !important;

    border: 1px solid #e7eeea !important;

    border-radius: 18px !important;

    padding: 0 18px !important;

    margin: 0 0 10px 0 !important;

    cursor: pointer !important;

    box-shadow:
      0 4px 12px rgba(35, 69, 49, 0.04),
      0 1px 3px rgba(35, 69, 49, 0.02) !important;

    transition: all 0.18s ease !important;
  }

  span.radio:hover {
    transform: translateY(-1px);
    box-shadow:
      0 8px 20px rgba(35, 69, 49, 0.08),
      0 2px 6px rgba(35, 69, 49, 0.04) !important;
  }

  span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;

    position: absolute !important;

    left: 18px !important;

    top: 50% !important;

    transform: translateY(-50%) !important;

    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;

    border: 2px solid #8aa895 !important;

    border-radius: 50% !important;

    background: #ffffff !important;

    opacity: 1 !important;

    visibility: visible !important;

    display: block !important;

    flex-shrink: 0 !important;

    cursor: pointer !important;

    z-index: 100 !important;

    pointer-events: auto !important;

    transition: all 0.18s ease !important;
  }

  span.radio input[type="radio"]:checked {
    /* border: 5px solid #5f8f75 !important; */
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  span.radio::before,
  span.radio label::before,
  span.radio label::after {
    display: none !important;
    content: none !important;
  }

  span.radio label,
  .custom-checkbox label,
  .custom-radio label {
    position: relative !important;

    z-index: 5 !important;

    width: 100% !important;

    min-height: 45px !important;
    /* min-height: 62px !important; */

    margin: 0 !important;

    padding: 0 18px 0 50px !important;

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

    color: var(--answer-color) !important;
    /* color: #2f473b !important; */

    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
    letter-spacing: 0 !important;

    text-align: left !important;

    cursor: pointer !important;
  }

  .ans-check {
    background: #f3f8f4 !important;
    border: 1px solid #a8c9b1 !important;
    color: #173628 !important;
    box-shadow: 0 6px 18px rgba(107, 154, 128, 0.10) !important;
  }

  form>div:last-of-type {
    max-width: 390px !important;
    margin: 10px auto 0 !important;
  }


  /* FORCE HIDDEN NEXT BUTTON TO STAY HIDDEN */
  #btnContinue.d-none,
  #btnTableContinue.d-none {
    display: none !important;
  }

  #btnContinue,
  #btnTableContinue {
    width: 100% !important;
    min-height: 62px !important;
    border: none !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #2d7446 0%, #1f5d36 100%) !important;
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow:
      0 10px 24px rgba(31, 93, 54, 0.22),
      0 2px 6px rgba(31, 93, 54, 0.10) !important;
    transition: all 0.18s ease !important;
  }

  .simple-Block.question-bg-green-color {
    background: transparent !important;
    background-color: transparent !important;
  }

  span.radio,
  span.radio *,
  span.radio label {
    pointer-events: auto !important;
  }

  /* =========================================================
  FINAL CHIP LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .simple-Block .row.chip-layout {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;

    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    align-content: flex-start !important;

    gap: 10px 8px !important;
    width: 100% !important;
    max-width: 352px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout>div,
  .simple-Block .row.chip-layout>[class*="col"] {
    display: contents !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox {
    display: inline-flex !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label,
  .simple-Block .row.chip-layout .custom-checkbox label {
    position: relative !important;
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 82px !important;
    max-width: 168px !important;
    min-height: 38px !important;
    height: auto !important;

    padding: 9px 14px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #dfe7e1 !important;
    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;

    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;

    overflow: visible !important;
    text-overflow: unset !important;

    box-shadow: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label::before,
  .simple-Block .row.chip-layout .custom-checkbox>label::after,
  .simple-Block .row.chip-layout .custom-checkbox label::before,
  .simple-Block .row.chip-layout .custom-checkbox label::after {
    display: none !important;
    content: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"]:checked+label,
  .simple-Block .row.chip-layout .custom-checkbox>label.ans-check,
  .simple-Block .row.chip-layout .custom-checkbox label.ans-check {
    background: var(--selection-color) !important;
    border-color: var(--selection-color) !important;
    /* background: #1f5d36 !important;
    border-color: #1f5d36 !important; */
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(31, 93, 54, 0.22) !important;
  }

  /* =========================================================
  YES/NO TABLE LAYOUT FIX — 430 × 932 ONLY
  Keeps Yes/No pages separate from normal radio-card pages
  ========================================================= */

  .noneEq table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    margin: 0 !important;
  }

  .noneEq thead,
  .noneEq tbody,
  .noneEq tr {
    display: table-header-group !important;
  }

  .noneEq tbody {
    display: table-row-group !important;
  }

  .noneEq tr {
    display: table-row !important;
  }

  .noneEq th,
  .noneEq td {
    display: table-cell !important;
    vertical-align: middle !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .noneEq th:first-child,
  .noneEq td:first-child {
    width: calc(100% - 104px) !important;
  }

  .noneEq th:nth-child(2),
  .noneEq th:nth-child(3),
  .noneEq td:nth-child(2),
  .noneEq td:nth-child(3) {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    text-align: center !important;
  }

  .noneEq thead th {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    height: 28px !important;
  }



  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq td:nth-child(2) span.radio,
  .noneEq td:nth-child(3) span.radio {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .noneEq td:nth-child(2) span.radio label,
  .noneEq td:nth-child(3) span.radio label {
    display: none !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: static !important;
    transform: none !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 3px solid #8aa895 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 5px solid #5f8f75 !important;
    background: #ffffff !important;
  }

  /* =========================================================
  PREMIUM YES/NO LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .noneEq table {
    background: #f8fbf8 !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .noneEq thead th {
    background: transparent !important;
    color: #173628 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }

  .noneEq tbody tr {
    background: #ffffff !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 8px rgba(35, 69, 49, 0.04) !important;
  }

  .noneEq tbody td:first-child {
    background: #ffffff !important;
    color: #173628 !important;
    height: 104px !important;
    padding: 14px 18px !important;
    border-radius: 18px 0 0 18px !important;
  }

  .noneEq tbody td:first-child,
  .noneEq tbody td:first-child * {
    color: #173628 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.34 !important;
  }

  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq tbody td:nth-child(3) {
    border-radius: 0 18px 18px 0 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    width: 22px !important;
    height: 22px !important;
    border: 2px solid #8aa895 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 6px solid #1f5d36 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE OLD GREEN TABLE STYLE
========================================================= */

  .eq .question-bg-green-color,
  .eq .questionary-question,
  .eq .simple-Block.question-bg-green-color,
  .eq span.radio,
  .eq span.radio label {
    background: none !important;
    /* background-color: #ffffff !important; */
    color: #1d3b2d !important;
  }

  .eq .question-bg-green-color,
  .eq .questionary-question {
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: left !important;
  }

  .eq span.radio {
    border: 1px solid #e7eeea !important;
    border-radius: 18px !important;
    margin-bottom: 10px !important;
  }

  .eq span.radio label {
    font-size: 14px !important;
    font-weight: 600 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE REMAINING TABLE LINES
========================================================= */

  .eq table,
  .eq tbody,
  .eq tr,
  .eq td,
  .eq th {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  .eq table {
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .eq tr {
    background: transparent !important;
  }

  .eq td {
    background: transparent !important;
  }

  /* =========================================================
430 × 932 ONLY
FINAL BORDER CLEANUP
========================================================= */

  .eq .questionary-question,
  .eq .question-bg-green-color,
  .eq tr,
  .eq td,
  .eq tbody,
  .eq table {
    border: none !important;
    border-color: transparent !important;
    outline: none !important;
  }

  .eq td:first-child {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
  }

  .eq .questionary-question::before,
  .eq .questionary-question::after,
  .eq .question-bg-green-color::before,
  .eq .question-bg-green-color::after {
    display: none !important;
    content: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE QUESTION BLOCK BORDER
========================================================= */

  .eq .ques-block {
    border: 0 !important;
    border-color: transparent !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE CHILD COLUMN BORDERS
========================================================= */

  .eq .ques-block>div,
  .eq .ques-block .col-md-4,
  .eq .ques-block .col-md-8 {
    border: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE OLD ANSWER DIVIDER LINES
========================================================= */

  .eq span.radio,
  .eq span.radio label,
  .eq .question-setting,
  .eq .question-remove-border-radius,
  .eq .question-bg-green-color {
    border-bottom: 0 !important;
    border-top: 0 !important;
  }

  .eq .question-setting {
    padding-bottom: 0 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY ANSWER ROW ALIGNMENT
========================================================= */

  .eq .personality-answer-row {
    display: flex !important;
    align-items: flex-start !important;

    width: 100% !important;

    padding: 10px 15px !important;
    margin: 0 0 10px 0 !important;

    gap: 14px !important;
    background: #ffff;
    border-radius: 18px;
  }

    .eq .personality-answer-radio {
        /* width: 17px !important;
        height: 17px !important;
        min-width: 17px !important; */
        min-height: 17px !important;
        margin: 15px 0 0 0 !important;
        /* flex: 0 0 17px !important; */
        appearance: none !important;
        -webkit-appearance: none !important;
        /* position: absolute !important; */
        /* left: 18px !important; */
        /* top: 50% !important; */
        transform: translateY(-50%) !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        /* min-height: 22px !important; */
        border: 2px solid #8aa895 !important;
        border-radius: 50% !important;
        background: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
        display: block !important;
        /* flex-shrink: 0 !important; */
        cursor: pointer !important;
        z-index: 100 !important;
        pointer-events: auto !important;
        transition: all 0.18s ease !important;
    }

  .eq .personality-answer-label {
    display: block !important;

    width: 100% !important;

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

    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;

    text-align: left !important;
  }

  /* =========================================================
430 × 932 ONLY
RESTORE ORIGINAL PHOTO UPLOAD PAGE LAYOUT
========================================================= */

  .photo-upload-main-heading,
  .create-profile-heading,
  .upload-page-top-banner,
  .upload-top-banner {
    display: none !important;
  }

  .upload-photo-main-card,
  .photo-upload-card,
  .upload-photo-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 360px !important;
  }

  .upload-photo-dashed-box,
  .photo-upload-dropzone,
  .upload-photo-box {
    min-height: auto !important;
    height: auto !important;

    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    box-shadow: none !important;
  }

  .upload-photo-btn,
  .upload-btn,
  .photo-upload-btn,
  button.upload-photo-btn,
  a.upload-photo-btn {
    display: flex !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 272px !important;
    height: 56px !important;

    margin: 12px auto 18px !important;

    border-radius: 14px !important;

    background: #1f8d52 !important;

    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 700 !important;

    align-items: center !important;
    justify-content: center !important;

    border: 0 !important;

    position: relative !important;
    z-index: 50 !important;
  }

  .continue-btn,
  .photo-continue-btn,
  #btnContinue,
  #btnNextStep,
  #submitButton {

    width: 100% !important;

    height: 54px !important;

    border-radius: 12px !important;

    background: var(--register-btn-color) !important;
    /* background: #005f2f !important; */
    /* border-color: #005f2f !important; */
    border-color: #ffffff !important;
    color: #ffffff !important;

    font-size: 18px !important;
    font-weight: 700 !important;
  }

  /* PERSONALITY NEXT BUTTON — 430 × 932 ONLY */

  #btnContinue,
  #btnTableContinue {
    background: #005f2f !important;
    border-color: #005f2f !important;
    color: #ffffff !important;
  }

  /* RADIO CIRCLE GREEN — 430 × 932 ONLY */

  .eq input[type="radio"] {
    /* accent-color: #005f2f !important; */
    accent-color: var(--selection-color) !important;
  }

  .eq input[type="radio"]:checked {
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  /* VALIDATION RED BORDER — 430 × 932 ONLY */

  .eq .questionary-question.add-validation-class,
  .eq .ques-block .questionary-question.add-validation-class,
  .noneEq td.add-validation-class,
  .simple-Block.add-validation-class {
    border: 3px solid #d60000 !important;
    border-radius: 18px !important;
    padding: 12px !important;
  }
}
/* =========================================================
360 × 800 — QUESTIONNAIRE UI
========================================================= */

@media (width: 360px) and (height: 800px) {
  
.mm-questionary-parent-container,
  main {
    min-height: 100vh;
    background: var(--register-bg-color) !important;
    /* background: #eef5f0 !important; */
  }

  .mm-fixed {
    width: 100%;
    background: #ffffff !important;
    padding: 12px 18px 10px !important;
    box-shadow: 0 2px 12px rgba(30, 52, 39, 0.04);
  }

  .progress {
    position: relative;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: #e5ebe6 !important;
    overflow: visible !important;
  }

  .progress-bar {
    position: relative;
    min-width: 24px;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: var(--header-button-color) !important;
    /* background-color: #6b9a80 !important; */
    overflow: visible !important;
    color: transparent !important;
    font-size: 0 !important;
  }

  .progress-bar::after {
    content: attr(aria-valuenow) "%";
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--header-button-color);
    /* background: #6b9a80; */
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 3px 8px rgba(35, 69, 49, 0.16);
  }

  .mm-questionary-container {
    max-width: 430px;
    margin: 0 auto;
    padding: 0 20px 6px;
  }

  #questionsContainer {
    width: 100% !important;
    max-width: 392px !important;

    margin: 14px auto 0 !important;

    background:
      linear-gradient(180deg,
        #ffffff 0%,
        #f8fbf8 100%) !important;

    border: 1px solid rgba(107, 154, 128, 0.08) !important;

    border-radius: 36px !important;

    padding: 28px 18px 16px !important;

    overflow: hidden !important;

    box-shadow:
      0 24px 60px rgba(35, 69, 49, 0.08),
      0 8px 24px rgba(35, 69, 49, 0.05),
      inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;

    backdrop-filter: blur(8px);
  }

  .questionary-question,
  .question-bg-green-color {
    display: block !important;

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

    margin: 0 auto 18px !important;

    background: transparent !important;

    color: #18392b !important;

    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    letter-spacing: 0.1px !important;

    text-align: center !important;

    padding: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
  }

  .question-setting {
    text-align: left !important;
    padding-left: 0 !important;
  }

  .table {
    margin-bottom: 0 !important;
  }

  .table {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    background: transparent !important;
    border: 0 !important;
  }

  .table> :not(caption)>*>* {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  tbody,
  td,
  tfoot,
  th,
  thead,
  tr {
    border: 0 !important;
    background: transparent !important;
  }

  td {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
  }

  .simple-Block .row:not(.chip-layout) {
    display: block !important;
  }

  .simple-Block .row:not(.chip-layout)>div {
    width: 100% !important;
    margin-bottom: 6px !important;
  }

  .simple-Block .row>div:last-child {
    margin-bottom: 0 !important;
  }

  span.radio {
    position: relative !important;

    overflow: hidden !important;

    width: 100% !important;

    min-height: 56px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #ffffff !important;

    border: 1px solid #e7eeea !important;

    border-radius: 18px !important;

    padding: 0 18px !important;

    margin: 0 0 10px 0 !important;

    cursor: pointer !important;

    box-shadow:
      0 4px 12px rgba(35, 69, 49, 0.04),
      0 1px 3px rgba(35, 69, 49, 0.02) !important;

    transition: all 0.18s ease !important;
  }

  span.radio:hover {
    transform: translateY(-1px);
    box-shadow:
      0 8px 20px rgba(35, 69, 49, 0.08),
      0 2px 6px rgba(35, 69, 49, 0.04) !important;
  }

  span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;

    position: absolute !important;

    left: 18px !important;

    top: 50% !important;

    transform: translateY(-50%) !important;

    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;

    border: 2px solid #8aa895 !important;

    border-radius: 50% !important;

    background: #ffffff !important;

    opacity: 1 !important;

    visibility: visible !important;

    display: block !important;

    flex-shrink: 0 !important;

    cursor: pointer !important;

    z-index: 100 !important;

    pointer-events: auto !important;

    transition: all 0.18s ease !important;
  }

  span.radio input[type="radio"]:checked {
    /* border: 5px solid #5f8f75 !important; */
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  span.radio::before,
  span.radio label::before,
  span.radio label::after {
    display: none !important;
    content: none !important;
  }

  span.radio label,
  .custom-checkbox label,
  .custom-radio label {
    position: relative !important;

    z-index: 5 !important;

    width: 100% !important;

    min-height: 45px !important;
    /* min-height: 62px !important; */

    margin: 0 !important;

    padding: 0 18px 0 50px !important;

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

    color: var(--answer-color) !important;
    /* color: #2f473b !important; */

    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
    letter-spacing: 0 !important;

    text-align: left !important;

    cursor: pointer !important;
  }

  .ans-check {
    background: #f3f8f4 !important;
    border: 1px solid #a8c9b1 !important;
    color: #173628 !important;
    box-shadow: 0 6px 18px rgba(107, 154, 128, 0.10) !important;
  }

  form>div:last-of-type {
    max-width: 390px !important;
    margin: 10px auto 0 !important;
  }


  /* FORCE HIDDEN NEXT BUTTON TO STAY HIDDEN */
  #btnContinue.d-none,
  #btnTableContinue.d-none {
    display: none !important;
  }

  #btnContinue,
  #btnTableContinue {
    width: 100% !important;
    min-height: 62px !important;
    border: none !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #2d7446 0%, #1f5d36 100%) !important;
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow:
      0 10px 24px rgba(31, 93, 54, 0.22),
      0 2px 6px rgba(31, 93, 54, 0.10) !important;
    transition: all 0.18s ease !important;
  }

  .simple-Block.question-bg-green-color {
    background: transparent !important;
    background-color: transparent !important;
  }

  span.radio,
  span.radio *,
  span.radio label {
    pointer-events: auto !important;
  }

  /* =========================================================
  FINAL CHIP LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .simple-Block .row.chip-layout {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;

    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    align-content: flex-start !important;

    gap: 10px 8px !important;
    width: 100% !important;
    max-width: 352px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout>div,
  .simple-Block .row.chip-layout>[class*="col"] {
    display: contents !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox {
    display: inline-flex !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label,
  .simple-Block .row.chip-layout .custom-checkbox label {
    position: relative !important;
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 82px !important;
    max-width: 168px !important;
    min-height: 38px !important;
    height: auto !important;

    padding: 9px 14px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #dfe7e1 !important;
    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;

    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;

    overflow: visible !important;
    text-overflow: unset !important;

    box-shadow: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox>label::before,
  .simple-Block .row.chip-layout .custom-checkbox>label::after,
  .simple-Block .row.chip-layout .custom-checkbox label::before,
  .simple-Block .row.chip-layout .custom-checkbox label::after {
    display: none !important;
    content: none !important;
  }

  .simple-Block .row.chip-layout .custom-checkbox input[type="checkbox"]:checked+label,
  .simple-Block .row.chip-layout .custom-checkbox>label.ans-check,
  .simple-Block .row.chip-layout .custom-checkbox label.ans-check {
    background: var(--selection-color) !important;
    border-color: var(--selection-color) !important;
    /* background: #1f5d36 !important;
    border-color: #1f5d36 !important; */
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(31, 93, 54, 0.22) !important;
  }

  /* =========================================================
  YES/NO TABLE LAYOUT FIX — 430 × 932 ONLY
  Keeps Yes/No pages separate from normal radio-card pages
  ========================================================= */

  .noneEq table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    margin: 0 !important;
  }

  .noneEq thead,
  .noneEq tbody,
  .noneEq tr {
    display: table-header-group !important;
  }

  .noneEq tbody {
    display: table-row-group !important;
  }

  .noneEq tr {
    display: table-row !important;
  }

  .noneEq th,
  .noneEq td {
    display: table-cell !important;
    vertical-align: middle !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .noneEq th:first-child,
  .noneEq td:first-child {
    width: calc(100% - 104px) !important;
  }

  .noneEq th:nth-child(2),
  .noneEq th:nth-child(3),
  .noneEq td:nth-child(2),
  .noneEq td:nth-child(3) {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    text-align: center !important;
  }

  .noneEq thead th {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    height: 28px !important;
  }



  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq td:nth-child(2) span.radio,
  .noneEq td:nth-child(3) span.radio {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .noneEq td:nth-child(2) span.radio label,
  .noneEq td:nth-child(3) span.radio label {
    display: none !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: static !important;
    transform: none !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 3px solid #8aa895 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 5px solid #5f8f75 !important;
    background: #ffffff !important;
  }

  /* =========================================================
  PREMIUM YES/NO LAYOUT — 430 × 932 ONLY
  ========================================================= */

  .noneEq table {
    background: #f8fbf8 !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .noneEq thead th {
    background: transparent !important;
    color: #173628 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }

  .noneEq tbody tr {
    background: #ffffff !important;
    border-radius: 18px !important;
    box-shadow: 0 2px 8px rgba(35, 69, 49, 0.04) !important;
  }

  .noneEq tbody td:first-child {
    background: #ffffff !important;
    color: #173628 !important;
    height: 104px !important;
    padding: 14px 18px !important;
    border-radius: 18px 0 0 18px !important;
  }

  .noneEq tbody td:first-child,
  .noneEq tbody td:first-child * {
    color: #173628 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.34 !important;
  }

  .noneEq tbody td:nth-child(2),
  .noneEq tbody td:nth-child(3) {
    background: #ffffff !important;
  }

  .noneEq tbody td:nth-child(3) {
    border-radius: 0 18px 18px 0 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"],
  .noneEq td:nth-child(3) span.radio input[type="radio"] {
    width: 22px !important;
    height: 22px !important;
    border: 2px solid #8aa895 !important;
  }

  .noneEq td:nth-child(2) span.radio input[type="radio"]:checked,
  .noneEq td:nth-child(3) span.radio input[type="radio"]:checked {
    border: 6px solid #1f5d36 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE OLD GREEN TABLE STYLE
========================================================= */

  .eq .question-bg-green-color,
  .eq .questionary-question,
  .eq .simple-Block.question-bg-green-color,
  .eq span.radio,
  .eq span.radio label {
    background: none !important;
    /* background-color: #ffffff !important; */
    color: #1d3b2d !important;
  }

  .eq .question-bg-green-color,
  .eq .questionary-question {
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: left !important;
  }

  .eq span.radio {
    border: 1px solid #e7eeea !important;
    border-radius: 18px !important;
    margin-bottom: 10px !important;
  }

  .eq span.radio label {
    font-size: 14px !important;
    font-weight: 600 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY RADIO PAGE — REMOVE REMAINING TABLE LINES
========================================================= */

  .eq table,
  .eq tbody,
  .eq tr,
  .eq td,
  .eq th {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  .eq table {
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
  }

  .eq tr {
    background: transparent !important;
  }

  .eq td {
    background: transparent !important;
  }

  /* =========================================================
430 × 932 ONLY
FINAL BORDER CLEANUP
========================================================= */

  .eq .questionary-question,
  .eq .question-bg-green-color,
  .eq tr,
  .eq td,
  .eq tbody,
  .eq table {
    border: none !important;
    border-color: transparent !important;
    outline: none !important;
  }

  .eq td:first-child {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
  }

  .eq .questionary-question::before,
  .eq .questionary-question::after,
  .eq .question-bg-green-color::before,
  .eq .question-bg-green-color::after {
    display: none !important;
    content: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE QUESTION BLOCK BORDER
========================================================= */

  .eq .ques-block {
    border: 0 !important;
    border-color: transparent !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE INLINE CHILD COLUMN BORDERS
========================================================= */

  .eq .ques-block>div,
  .eq .ques-block .col-md-4,
  .eq .ques-block .col-md-8 {
    border: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* =========================================================
430 × 932 ONLY
REMOVE OLD ANSWER DIVIDER LINES
========================================================= */

  .eq span.radio,
  .eq span.radio label,
  .eq .question-setting,
  .eq .question-remove-border-radius,
  .eq .question-bg-green-color {
    border-bottom: 0 !important;
    border-top: 0 !important;
  }

  .eq .question-setting {
    padding-bottom: 0 !important;
  }

  /* =========================================================
430 × 932 ONLY
PERSONALITY ANSWER ROW ALIGNMENT
========================================================= */

  .eq .personality-answer-row {
    display: flex !important;
    align-items: flex-start !important;

    width: 100% !important;

    padding: 10px 15px !important;
    margin: 0 0 10px 0 !important;

    gap: 14px !important;
    background: #ffff;
    border-radius: 18px;
  }

    .eq .personality-answer-radio {
        /* width: 17px !important;
        height: 17px !important;
        min-width: 17px !important; */
        min-height: 17px !important;
        margin: 15px 0 0 0 !important;
        /* flex: 0 0 17px !important; */
        appearance: none !important;
        -webkit-appearance: none !important;
        /* position: absolute !important; */
        /* left: 18px !important; */
        /* top: 50% !important; */
        transform: translateY(-50%) !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        /* min-height: 22px !important; */
        border: 2px solid #8aa895 !important;
        border-radius: 50% !important;
        background: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
        display: block !important;
        /* flex-shrink: 0 !important; */
        cursor: pointer !important;
        z-index: 100 !important;
        pointer-events: auto !important;
        transition: all 0.18s ease !important;
    }

  .eq .personality-answer-label {
    display: block !important;

    width: 100% !important;

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

    color: var(--answer-color) !important;
    /* color: #173628 !important; */

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;

    text-align: left !important;
  }

  /* =========================================================
430 × 932 ONLY
RESTORE ORIGINAL PHOTO UPLOAD PAGE LAYOUT
========================================================= */

  .photo-upload-main-heading,
  .create-profile-heading,
  .upload-page-top-banner,
  .upload-top-banner {
    display: none !important;
  }

  .upload-photo-main-card,
  .photo-upload-card,
  .upload-photo-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 360px !important;
  }

  .upload-photo-dashed-box,
  .photo-upload-dropzone,
  .upload-photo-box {
    min-height: auto !important;
    height: auto !important;

    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    box-shadow: none !important;
  }

  .upload-photo-btn,
  .upload-btn,
  .photo-upload-btn,
  button.upload-photo-btn,
  a.upload-photo-btn {
    display: flex !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 272px !important;
    height: 56px !important;

    margin: 12px auto 18px !important;

    border-radius: 14px !important;

    background: #1f8d52 !important;

    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 700 !important;

    align-items: center !important;
    justify-content: center !important;

    border: 0 !important;

    position: relative !important;
    z-index: 50 !important;
  }

  .continue-btn,
  .photo-continue-btn,
  #btnContinue,
  #btnNextStep,
  #submitButton {

    width: 100% !important;

    height: 54px !important;

    border-radius: 12px !important;

    background: var(--register-btn-color) !important;
    /* background: #005f2f !important; */
    /* border-color: #005f2f !important; */
    border-color: #ffffff !important;
    color: #ffffff !important;

    font-size: 18px !important;
    font-weight: 700 !important;
  }

  /* PERSONALITY NEXT BUTTON — 430 × 932 ONLY */

  #btnContinue,
  #btnTableContinue {
    background: #005f2f !important;
    border-color: #005f2f !important;
    color: #ffffff !important;
  }

  /* RADIO CIRCLE GREEN — 430 × 932 ONLY */

  .eq input[type="radio"] {
    /* accent-color: #005f2f !important; */
    accent-color: var(--selection-color) !important;
  }

  .eq input[type="radio"]:checked {
    border: 5px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  /* VALIDATION RED BORDER — 430 × 932 ONLY */

  .eq .questionary-question.add-validation-class,
  .eq .ques-block .questionary-question.add-validation-class,
  .noneEq td.add-validation-class,
  .simple-Block.add-validation-class {
    border: 3px solid #d60000 !important;
    border-radius: 18px !important;
    padding: 12px !important;
  }
}

/* =========================================================
414 × 895 — QUESTIONNAIRE CHIP LAYOUT FIX
Matches 430 × 932 visual layout for checkbox questions
========================================================= */

@media (width: 414px) and (height: 895px) {

  .mm-questionary-parent-container,
  main {
    min-height: 100vh !important;
    background: var(--register-bg-color) !important;
  }

  .mm-fixed {
    width: 100% !important;
    background: #ffffff !important;
    padding: 10px 20px 9px !important;
    box-shadow: none !important;
  }

  .progress {
    position: relative !important;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: #e5ebe6 !important;
    overflow: visible !important;
  }

  .progress-bar {
    position: relative !important;
    min-width: 24px !important;
    height: 30px !important;
    border-radius: 999px !important;
    background-color: var(--header-button-color) !important;
    overflow: visible !important;
    color: transparent !important;
    font-size: 0 !important;
  }

  .progress-bar::after {
    content: attr(aria-valuenow) "%";
    position: absolute !important;
    top: 50% !important;
    right: -15px !important;
    transform: translateY(-50%) !important;
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    background: var(--header-button-color) !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    box-shadow: 0 3px 8px rgba(35, 69, 49, 0.16) !important;
  }

  .mm-questionary-container {
    max-width: 414px !important;
    margin: 0 auto !important;
    padding: 0 20px 6px !important;
  }

  #questionsContainer,
  .noneEq.ques-active {
    width: 100% !important;
    max-width: 392px !important;
    margin: 0 auto 0 !important;
    padding: 24px 18px 26px !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 34px !important;
    box-shadow: 0 20px 45px rgba(45, 92, 120, 0.18) !important;
    overflow: hidden !important;
  }

  .question-bg-green-color,
  .simple-Block.question-bg-green-color {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .questionary-question,
  .question-bg-green-color .questionary-question {
    width: 100% !important;
    max-width: 340px !important;
    margin: 0 auto 24px !important;
    padding: 0 !important;
    background: transparent !important;
    color: #ffffff !important;
    font-size: 28px !important;
    font-weight: 800 !important;
    line-height: 1.45 !important;
    text-align: center !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .question-setting {
    text-align: center !important;
    padding-left: 0 !important;
  }

  .simple-Block .row,
  .simple-Block .row.pt-1,
  .simple-Block .row.justify-content-between {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    align-content: flex-start !important;
    gap: 10px 8px !important;
    width: 100% !important;
    max-width: 352px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .simple-Block .row > div,
  .simple-Block .row > [class*="col"] {
    display: contents !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .custom-checkbox {
    display: inline-flex !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  .custom-checkbox input[type="checkbox"],
  .questionary-radiobtn[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .custom-checkbox > label,
  .custom-checkbox label,
  label.question-option {
    position: relative !important;
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 82px !important;
    max-width: 168px !important;
    min-height: 38px !important;
    height: auto !important;
    padding: 9px 14px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #dfe7e1 !important;
    color: var(--answer-color) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    overflow: visible !important;
    text-overflow: unset !important;
    box-shadow: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
  }

  .custom-checkbox > label::before,
  .custom-checkbox > label::after,
  .custom-checkbox label::before,
  .custom-checkbox label::after,
  label.question-option::before,
  label.question-option::after {
    display: none !important;
    content: none !important;
  }

  .custom-checkbox input[type="checkbox"]:checked + label,
  .custom-checkbox > label.ans-check,
  .custom-checkbox label.ans-check {
    background: var(--selection-color) !important;
    border-color: var(--selection-color) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(31, 93, 54, 0.22) !important;
  }

  form > div:last-of-type {
    max-width: 320px !important;
    margin: 14px auto 0 !important;
  }

  #btnContinue.d-none,
  #btnTableContinue.d-none {
    display: none !important;
  }

  #btnContinue,
  #btnTableContinue {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 320px !important;
    max-width: 320px !important;
    min-height: 60px !important;
    height: 60px !important;
    margin: 20px auto 28px !important;
    border: 0 !important;
    border-radius: 22px !important;
    background: var(--header-button-color) !important;
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    box-shadow: 0 16px 35px rgba(45, 92, 120, 0.28) !important;
  }

  .simple-Block.add-validation-class {
    border: 3px solid #d60000 !important;
    border-radius: 18px !important;
    padding: 12px !important;
  }
}

 /* =========================================================
414 × 895 — RADIO ANSWER WHITE CARD FIX
========================================================= */

@media (width: 414px) and (height: 895px) {

  .noneEq.ques-active .simple-Block .row > div {
    width: 100% !important;
    max-width: 314px !important;
    margin: 0 auto 10px !important;
    padding: 0 !important;
  }

  .noneEq.ques-active .simple-Block span.radio {
    position: relative !important;

    width: 100% !important;
    min-height: 56px !important;

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

    background: #ffffff !important;
    border-radius: 18px !important;

    padding: 0 18px 0 66px !important;
    margin: 0 !important;

    box-sizing: border-box !important;
  }

  .noneEq.ques-active .simple-Block span.radio input.questionary-radiobtn {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .noneEq.ques-active .simple-Block span.radio::before {
    content: "" !important;

    position: absolute !important;
    left: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    width: 22px !important;
    height: 22px !important;

    border: 2px solid #8aa895 !important;
    border-radius: 50% !important;
    background: #ffffff !important;

    box-sizing: border-box !important;
  }

  .noneEq.ques-active .simple-Block span.radio:has(input.questionary-radiobtn:checked)::before {
    border: 6px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  .noneEq.ques-active .simple-Block span.radio label {
    width: auto !important;
    min-height: auto !important;

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

    color: var(--answer-color) !important;

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;

    text-align: left !important;
  }

  .noneEq.ques-active .simple-Block span.radio label::before,
  .noneEq.ques-active .simple-Block span.radio label::after {
    display: none !important;
    content: none !important;
  }
}
/* =========================================================
414 × 895 — EQ PERSONALITY RADIO PAGE
MATCH 430 × 932
========================================================= */

@media (width: 414px) and (height: 895px) {

  .eq.ques-active .ques-block {
    display: block !important;
    width: 100% !important;
    max-width: 356px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .eq.ques-active .ques-block > .col-md-4,
  .eq.ques-active .ques-block > .col-md-8 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .eq.ques-active .question-bg-green-color,
  .eq.ques-active .questionary-question,
  .eq.ques-active .question-remove-border-radius {
    background: transparent !important;
    background-color: transparent !important;
    color: #ffffff !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .eq.ques-active .questionary-question {
    width: 100% !important;
    max-width: 340px !important;
    height: auto !important;
    margin: 0 auto 24px !important;
    padding: 0 !important;
    text-align: center !important;
  }

  .eq.ques-active .questionary-question span {
    display: block !important;
    color: #ffffff !important;
    font-size: 28px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    text-align: center !important;
  }

  .eq.ques-active .col-md-8.question-bg-green-color {
    width: 100% !important;
    max-width: 314px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
  }

  .eq.ques-active .personality-answer-row {
    position: relative !important;
    width: 100% !important;
    min-height: 56px !important;

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

    background: #ffffff !important;
    border-radius: 18px !important;

    padding: 0 18px 0 66px !important;
    margin: 0 0 10px 0 !important;

    box-sizing: border-box !important;
  }

  .eq.ques-active .personality-answer-radio {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .eq.ques-active .personality-answer-row::before {
    content: "" !important;
    position: absolute !important;
    left: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    width: 22px !important;
    height: 22px !important;

    border: 2px solid #8aa895 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
  }

  .eq.ques-active .personality-answer-row:has(.personality-answer-radio:checked)::before {
    border: 6px solid var(--selection-color) !important;
    background: #ffffff !important;
  }

  .eq.ques-active .personality-answer-label {
    width: auto !important;
    min-height: auto !important;
    padding: 0 !important;
    margin: 0 !important;

    color: var(--answer-color) !important;

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;

    text-align: left !important;
  }
}

/* =========================================================
375 × 812 — RADIO ANSWER HEIGHT REDUCTION
========================================================= */

@media (width: 375px) and (height: 812px) {

    span.radio {
        min-height: 42px !important;
        padding: 6px 14px !important;
        margin: 0 0 6px 0 !important;
        border-radius: 16px !important;
    }

    span.radio label {
        min-height: 38px !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
    }

    span.radio input[type="radio"] {
        width: 20px !important;
        height: 20px !important;
        min-width: 20px !important;
        min-height: 20px !important;
    }
    .personality-next-btn-row {
    margin-top: 0cm !important;
}
}
/* =========================================================
375 × 812 — FINAL FIT FIX
========================================================= */

@media (width: 375px) and (height: 812px) {

    .noneEq.ques-active .simple-Block .row:not(.chip-layout) > div {
        margin-bottom: 4px !important;
    }

    .noneEq.ques-active span.radio {
        min-height: 42px !important;
        height: 42px !important;
        padding: 0 12px !important;
        margin: 0 0 4px 0 !important;
        border-radius: 14px !important;
    }

    .noneEq.ques-active span.radio label {
        min-height: 38px !important;
        height: 38px !important;
        font-size: 13px !important;
        line-height: 1.1 !important;
        padding-left: 44px !important;
    }

    .noneEq.ques-active span.radio input[type="radio"] {
        width: 18px !important;
        height: 18px !important;
        min-width: 18px !important;
        min-height: 18px !important;
        left: 16px !important;
    }

    .personality-next-btn-row {
        margin-top: 0 !important;
    }

    #btnContinue,
    #btnTableContinue {
        min-height: 54px !important;
        height: 54px !important;
    }
}
/* =========================================================
375 × 812 — PERSONALITY INTRO PAGE
SHOW NEXT BUTTON
========================================================= */

@media (width: 375px) and (height: 812px) {

    .welcome-container {
        padding: 10px 14px 8px !important;
    }

    .personality-hero-image {
        max-height: 215px !important;
        height: 215px !important;
        object-fit: cover !important;
        border-radius: 22px !important;
    }

    .pg-welcome-title {
        font-size: 20px !important;
        line-height: 1.25 !important;
        margin: 12px 0 10px !important;
    }

    .personality-intro-text {
        font-size: 15px !important;
        line-height: 1.45 !important;
        margin-bottom: 10px !important;
    }

    .personality-info-card {
        padding: 14px !important;
        margin: 8px 0 10px !important;
    }

    .personality-info-card h3,
    .personality-info-card h4 {
        font-size: 18px !important;
        line-height: 1.25 !important;
        margin-bottom: 8px !important;
    }

    .personality-info-card p {
        font-size: 14px !important;
        line-height: 1.45 !important;
        margin-bottom: 0 !important;
    }

    .personality-next-btn-row {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
}

/* =========================================================
360 × 800 — FINAL FIT FIX
========================================================= */

@media (width: 360px) and (height: 800px) {

    .noneEq.ques-active .simple-Block .row:not(.chip-layout) > div {
        margin-bottom: 4px !important;
    }

    .noneEq.ques-active span.radio {
        min-height: 38px !important;
        height: 38px !important;
        padding: 0 12px !important;
        margin: 0 0 4px 0 !important;
        border-radius: 14px !important;
    }

    .noneEq.ques-active span.radio label {
        min-height: 34px !important;
        height: 34px !important;
        font-size: 13px !important;
        line-height: 1.1 !important;
        padding-left: 44px !important;
    }

    .noneEq.ques-active span.radio input[type="radio"] {
        width: 18px !important;
        height: 18px !important;
        min-width: 18px !important;
        min-height: 18px !important;
        left: 16px !important;
    }

    .personality-next-btn-row {
        margin-top: 0 !important;
    }

    #btnContinue,
    #btnTableContinue {
        min-height: 52px !important;
        height: 52px !important;
    }
}
/* =========================================================
360 × 800 — PERSONALITY INTRO PAGE
SHOW NEXT BUTTON
========================================================= */

@media (width: 360px) and (height: 800px) {

    .welcome-container {
        padding: 8px 12px 6px !important;
    }

    .personality-hero-image {
        max-height: 180px !important;
        height: 180px !important;
        object-fit: cover !important;
        border-radius: 20px !important;
    }

    .pg-welcome-title {
        font-size: 18px !important;
        line-height: 1.2 !important;
        margin: 10px 0 8px !important;
    }

    .personality-intro-text {
        font-size: 14px !important;
        line-height: 1.35 !important;
        margin-bottom: 8px !important;
    }

    .personality-info-card {
        padding: 12px !important;
        margin: 6px 0 8px !important;
    }

    .personality-info-card h3,
    .personality-info-card h4 {
        font-size: 16px !important;
        line-height: 1.2 !important;
        margin-bottom: 6px !important;
    }

    .personality-info-card p {
        font-size: 13px !important;
        line-height: 1.35 !important;
        margin-bottom: 0 !important;
    }

    .personality-next-btn-row {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    #btnContinue,
    #btnTableContinue {
        height: 52px !important;
        min-height: 52px !important;
    }
}

/* =========================================================
360 × 800 — PHOTO UPLOAD PAGE
MATCH 430 × 932
========================================================= */

@media (width: 360px) and (height: 800px) {

    .photo-upload-section {
        margin-top: 0 !important;
        padding: 0 14px !important;
    }

    .photo-upload-main {
        padding: 18px 16px !important;
        border: 1px dashed #d6dde3 !important;
        border-radius: 16px !important;
        background: var(--register-card-color) !important;
    }

    .photo-title {
        font-size: 24px !important;
        line-height: 1.3 !important;
        text-align: center !important;
        margin-bottom: 16px !important;
    }

    .photo-upload-btn,
    .photo-add-more-btn {
        width: 100% !important;
        max-width: 260px !important;
        min-width: 0 !important;
        height: 52px !important;
        margin: 14px auto 18px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: var(--register-btn-color) !important;
        color: #ffffff !important;
        border: 1px solid #ffffff !important;
        border-radius: 12px !important;
        font-size: 17px !important;
        font-weight: 700 !important;
        box-shadow: none !important;
    }

    #uploadPhotosBtn[style*="display:none"],
    #uploadPhotosBtn[style*="display: none"],
    #addMorePhotosBtn[style*="display:none"],
    #addMorePhotosBtn[style*="display: none"] {
        display: none !important;
    }

    #uploadPhotosBtn:not([style*="display:none"]):not([style*="display: none"]),
    #addMorePhotosBtn:not([style*="display:none"]):not([style*="display: none"]) {
        display: inline-flex !important;
    }

    .photo-helper-text {
        font-size: 17px !important;
        text-align: center !important;
        margin-top: 14px !important;
    }

    .photo-helper-subtext {
        font-size: 15px !important;
        text-align: center !important;
        line-height: 1.45 !important;
    }

    .photo-preview-row {
        gap: 12px !important;
        margin-top: 18px !important;
    }

    .photo-preview-item {
        width: 82px !important;
        height: 82px !important;
        position: relative !important;
        overflow: visible !important;
    }

    .photo-preview-item .remove-photo-btn {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: absolute !important;
        top: -8px !important;
        right: -8px !important;
        width: 26px !important;
        height: 26px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 50% !important;
        background: #111827 !important;
        color: #ffffff !important;
        font-size: 14px !important;
        line-height: 1 !important;
        z-index: 20 !important;
    }
}