/* ==========================================================================
   WHY NOT — ARMember Profile / Edit Profile UI
   Pages:
     - Edit Profile:  .page-id-1696 (form 105)
     - View Profile:  .page-id-1727
   Scope: ARMember profile/edit forms only. No HTML changes.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Base tokens (scoped to profile pages)
   -------------------------------------------------------------------------- */
.page-id-1696,
.page-id-1727 {
  --yn-arm-accent: #ffde17;
  --yn-arm-accent-dim: rgba(255, 222, 23, 0.32);
  --yn-arm-accent-strong: rgba(255, 222, 23, 0.65);
  --yn-arm-surface: rgba(0, 0, 0, 0.35);
  --yn-arm-surface-strong: rgba(0, 0, 0, 0.55);
  --yn-arm-text: rgba(255, 255, 255, 0.92);
  --yn-arm-text-dim: rgba(255, 255, 255, 0.65);
  --yn-arm-text-subtle: rgba(255, 255, 255, 0.45);
  --yn-arm-radius: 14px;
  --yn-arm-radius-lg: 18px;
  --yn-arm-shadow: 0 14px 38px rgba(0, 0, 0, 0.55);
  --yn-arm-gap: 14px;
  --yn-arm-grid-gap: 14px 16px;
}

.page-id-1696 form.arm_form_105,
.page-id-1727 form.arm_form_105,
.page-id-1696 form.arm_form_105 *,
.page-id-1727 form.arm_form_105 * {
  box-sizing: border-box;
}

/* --------------------------------------------------------------------------
   Page + container cleanup
   -------------------------------------------------------------------------- */
.page-id-1696 .entry-header,
.page-id-1727 .entry-header,
.page-id-1696 h1.entry-title,
.page-id-1727 h1.entry-title {
  display: none !important;
}

.page-id-1696 .entry-content,
.page-id-1727 .entry-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-left: clamp(10px, 3vw, 18px) !important;
  padding-right: clamp(10px, 3vw, 18px) !important;
  color: var(--yn-arm-text);
}

.page-id-1696 #content,
.page-id-1727 #content,
.page-id-1696 #content.site-content,
.page-id-1727 #content.site-content {
  padding-top: var(--yn-header-h, 84px) !important;
}

.page-id-1696 .arm-form-container,
.page-id-1727 .arm-form-container,
.page-id-1696 .arm-df__fields-wrapper,
.page-id-1727 .arm-df__fields-wrapper {
  width: 100% !important;
  max-width: 720px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

.page-id-1696 .arm-form-container,
.page-id-1727 .arm-form-container,
.page-id-1696 form.arm_form_105,
.page-id-1727 form.arm_form_105 {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* --------------------------------------------------------------------------
   Card skin (fields wrapper)
   -------------------------------------------------------------------------- */
.page-id-1696 form.arm_form_105 .arm-df__fields-wrapper,
.page-id-1727 form.arm_form_105 .arm-df__fields-wrapper {
  position: relative !important;
  background: var(--yn-arm-surface) !important;
  border: 1px solid var(--yn-arm-accent-dim) !important;
  border-radius: var(--yn-arm-radius-lg) !important;
  padding: 18px !important;
  box-shadow: var(--yn-arm-shadow) !important;
  backdrop-filter: blur(8px);
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px 14px !important;
}

@media (min-width: 900px) {
  .page-id-1696 form.arm_form_105 .arm-df__fields-wrapper,
  .page-id-1727 form.arm_form_105 .arm-df__fields-wrapper {
    grid-template-columns: 1fr 1fr !important;
    gap: var(--yn-arm-grid-gap) !important;
  }
}

@media (min-width: 560px) and (max-width: 899px) {
  .page-id-1696 form.arm_form_105 .arm-df__fields-wrapper,
  .page-id-1727 form.arm_form_105 .arm-df__fields-wrapper {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px 12px !important;
  }
}

.page-id-1696 form.arm_form_105 .arm_section_fields_wrapper,
.page-id-1727 form.arm_form_105 .arm_section_fields_wrapper,
.page-id-1696 form.arm_form_105 .arm-df__form-group_submit,
.page-id-1727 form.arm_form_105 .arm-df__form-group_submit,
.page-id-1696 form.arm_form_105 .arm-df__form-group_social_fields,
.page-id-1727 form.arm_form_105 .arm-df__form-group_social_fields,
.page-id-1696 form.arm_form_105 .arm-df__form-group_textarea,
.page-id-1727 form.arm_form_105 .arm-df__form-group_textarea {
  grid-column: 1 / -1 !important;
}

/* --------------------------------------------------------------------------
   Typographic elements
   -------------------------------------------------------------------------- */
.page-id-1696 form.arm_form_105 .arm-df__heading-text,
.page-id-1727 form.arm_form_105 .arm-df__heading-text {
  color: rgba(255, 255, 255, 0.22) !important;
  font-weight: 900 !important;
  letter-spacing: 0.02em !important;
}

.page-id-1696 form.arm_form_105 .arm_section_fields_wrapper .arm-df__form-field-wrap_section,
.page-id-1727 form.arm_form_105 .arm_section_fields_wrapper .arm-df__form-field-wrap_section {
  color: rgba(255, 222, 23, 0.85) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  font-weight: 900 !important;
}

.page-id-1696 form.arm_form_105 .arm_section_fields_wrapper hr,
.page-id-1727 form.arm_form_105 .arm_section_fields_wrapper hr {
  border-color: rgba(255, 222, 23, 0.18) !important;
}

.page-id-1696 form.arm_form_105 .arm-df__label-text,
.page-id-1727 form.arm_form_105 .arm-df__label-text,
.page-id-1696 form.arm_form_105 .arm_form_field_label_text,
.page-id-1727 form.arm_form_105 .arm_form_field_label_text {
  color: rgba(255, 255, 255, 0.7) !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

.page-id-1696 form.arm_form_105 .arm_df__helper-description-text,
.page-id-1727 form.arm_form_105 .arm_df__helper-description-text {
  color: var(--yn-arm-text-subtle) !important;
}

.page-id-1696 form.arm_form_105 .arm-df__fc-icon i,
.page-id-1727 form.arm_form_105 .arm-df__fc-icon i {
  color: rgba(255, 222, 23, 0.85) !important;
}

/* --------------------------------------------------------------------------
   Form controls
   -------------------------------------------------------------------------- */
.page-id-1696 form.arm_form_105 .arm-df__form-control,
.page-id-1727 form.arm_form_105 .arm-df__form-control,
.page-id-1696 form.arm_form_105 .arm-selectpicker-input-control,
.page-id-1727 form.arm_form_105 .arm-selectpicker-input-control,
.page-id-1696 form.arm_form_105 textarea.arm_textarea,
.page-id-1727 form.arm_form_105 textarea.arm_textarea {
  width: 100% !important;
  background: rgba(0, 0, 0, 0.7) !important;
  color: var(--yn-arm-text) !important;
  border: 1px solid rgba(255, 222, 23, 0.25) !important;
  border-radius: var(--yn-arm-radius) !important;
  padding: 14px 14px !important;
  outline: none !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
}

.page-id-1696 form.arm_form_105 .arm-notched-outline__leading,
.page-id-1696 form.arm_form_105 .arm-notched-outline__trailing,
.page-id-1696 form.arm_form_105 .arm-notched-outline__notch,
.page-id-1727 form.arm_form_105 .arm-notched-outline__leading,
.page-id-1727 form.arm_form_105 .arm-notched-outline__trailing,
.page-id-1727 form.arm_form_105 .arm-notched-outline__notch {
  border-color: rgba(255, 222, 23, 0.25) !important;
}

.page-id-1696 form.arm_form_105 .arm-df__form-control:focus,
.page-id-1727 form.arm_form_105 .arm-df__form-control:focus,
.page-id-1696 form.arm_form_105 textarea.arm_textarea:focus,
.page-id-1727 form.arm_form_105 textarea.arm_textarea:focus {
  border-color: rgba(255, 222, 23, 0.75) !important;
  box-shadow: 0 0 0 2px rgba(255, 222, 23, 0.22), 0 12px 26px rgba(0, 0, 0, 0.4) !important;
}

.page-id-1696 form.arm_form_105 .arm-control-group,
.page-id-1727 form.arm_form_105 .arm-control-group {
  margin-bottom: 14px !important;
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.page-id-1696 form.arm_form_105 .arm-df__form-control-submit-btn,
.page-id-1727 form.arm_form_105 .arm-df__form-control-submit-btn {
  background: var(--yn-arm-accent) !important;
  color: #0b0b0b !important;
  border: none !important;
  border-radius: var(--yn-arm-radius) !important;
  padding: 14px 18px !important;
  font-weight: 900 !important;
  letter-spacing: 0.06em !important;
  box-shadow: 0 10px 26px rgba(255, 222, 23, 0.18) !important;
  cursor: pointer !important;
}

.page-id-1696 form.arm_form_105 .arm-df__form-control-submit-btn:hover,
.page-id-1727 form.arm_form_105 .arm-df__form-control-submit-btn:hover {
  filter: brightness(1.03);
  box-shadow: 0 14px 34px rgba(255, 222, 23, 0.22) !important;
}

/* --------------------------------------------------------------------------
   Dropdowns (ARMember + select2)
   -------------------------------------------------------------------------- */
.page-id-1696 form.arm_form_105 .arm__dc--items-wrap,
.page-id-1696 form.arm_form_105 .arm__dc--items,
.page-id-1727 form.arm_form_105 .arm__dc--items-wrap,
.page-id-1727 form.arm_form_105 .arm__dc--items {
  background: rgba(0, 0, 0, 0.92) !important;
  border: 1px solid rgba(255, 222, 23, 0.18) !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  max-height: 320px !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
}

.page-id-1696 form.arm_form_105 .arm__dc--item,
.page-id-1727 form.arm_form_105 .arm__dc--item {
  color: rgba(255, 255, 255, 0.9) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  line-height: 1.25 !important;
  padding: 12px 14px !important;
  padding-right: 14px !important;
}

.page-id-1696 form.arm_form_105 .arm__dc--item:hover,
.page-id-1727 form.arm_form_105 .arm__dc--item:hover {
  background: rgba(255, 222, 23, 0.12) !important;
}

.select2-results__option,
.select2-container .select2-results__option,
.select2-selection__rendered {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* --------------------------------------------------------------------------
   Link pills (view/edit) — shared style
   -------------------------------------------------------------------------- */
.page-id-1696 .arm_view_profile_link_container,
.page-id-1696 .arm_edit_profile_link_container,
.page-id-1727 .arm_view_profile_link_container,
.page-id-1727 .arm_edit_profile_link_container {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 10px !important;
  padding: 6px !important;
  width: 100% !important;
  position: relative !important;
  z-index: 2 !important;
}

.page-id-1696 .arm_view_profile_link_container a,
.page-id-1696 .arm_edit_profile_link_container a,
.page-id-1727 .arm_view_profile_link_container a,
.page-id-1727 .arm_edit_profile_link_container a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  border: 1px solid var(--yn-arm-accent-strong) !important;
  background: var(--yn-arm-surface-strong) !important;
  color: var(--yn-arm-accent) !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  letter-spacing: 0.2px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.page-id-1696 .arm_view_profile_link_container a:hover,
.page-id-1696 .arm_edit_profile_link_container a:hover,
.page-id-1727 .arm_view_profile_link_container a:hover,
.page-id-1727 .arm_edit_profile_link_container a:hover {
  background: rgba(255, 222, 23, 0.12) !important;
}

/* Edit page: hide view link entirely */
.page-id-1696 .arm_view_profile_link_container,
.page-id-1696 .arm_view_profile_link,
.page-id-1696 a.arm_view_profile_link {
  display: none !important;
}

/* --------------------------------------------------------------------------
   Profile vs Edit behavior
   -------------------------------------------------------------------------- */
/* Profile (1727) is read-only: disable inputs, hide submits */
.page-id-1727 .arm_form input,
.page-id-1727 .arm_form select,
.page-id-1727 .arm_form textarea,
.page-id-1727 .arm_form button {
  pointer-events: none !important;
}

.page-id-1727 .arm_form input[type="submit"],
.page-id-1727 .arm_form button[type="submit"],
.page-id-1727 .arm_form .arm_submit_btn,
.page-id-1727 .arm_form .arm_submit_button,
.page-id-1727 .arm_form .arm_update_btn,
.page-id-1727 .arm_form .arm-df__submit,
.page-id-1727 .arm_form .arm-df__submit-wrap {
  display: none !important;
}

.page-id-1727 .arm-df__heading,
.page-id-1727 .arm-df__heading-text {
  display: none !important;
}

/* Edit (1696) stays interactive */
.page-id-1696 .arm_form input,
.page-id-1696 .arm_form select,
.page-id-1696 .arm_form textarea,
.page-id-1696 .arm_form button {
  pointer-events: auto !important;
}

/* --------------------------------------------------------------------------
   Mobile fixes (layout + overflow)
   -------------------------------------------------------------------------- */
@media (max-width: 600px) {
  .page-id-1696 .entry-content,
  .page-id-1727 .entry-content,
  .page-id-1696 .arm-form-container,
  .page-id-1727 .arm-form-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .page-id-1696 .arm_form_105 .arm_editor_form_fields_wrapper,
  .page-id-1727 .arm_form_105 .arm_editor_form_fields_wrapper {
    padding: 16px 10px !important;
  }
}

@media (max-width: 520px) {
  .page-id-1696 .arm-df__fields-wrapper,
  .page-id-1727 .arm-df__fields-wrapper {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    max-width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin-top: 12px !important;
  }

  .page-id-1696 .arm-df__fields-wrapper *,
  .page-id-1727 .arm-df__fields-wrapper * {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .page-id-1696 .arm_view_profile_link_container,
  .page-id-1696 .arm_edit_profile_link_container,
  .page-id-1727 .arm_view_profile_link_container,
  .page-id-1727 .arm_edit_profile_link_container {
    margin-top: 6px !important;
    flex-wrap: wrap !important;
  }
}

@media (max-width: 480px) {
  .page-id-1696,
  .page-id-1727,
  .page-id-1696 body,
  .page-id-1727 body,
  .page-id-1696 .site,
  .page-id-1727 .site,
  .page-id-1696 #page,
  .page-id-1727 #page,
  .page-id-1696 #content,
  .page-id-1727 #content,
  .page-id-1696 .site-content,
  .page-id-1727 .site-content,
  .page-id-1696 .entry-content,
  .page-id-1727 .entry-content {
    overflow-x: hidden !important;
  }

  .page-id-1696 .arm_form,
  .page-id-1727 .arm_form,
  .page-id-1696 .arm-df__fields-wrapper,
  .page-id-1727 .arm-df__fields-wrapper {
    width: 100% !important;
    max-width: 100% !important;
  }

  .page-id-1696 .arm_form_105 .arm_editor_form_fields_wrapper,
  .page-id-1727 .arm_form_105 .arm_editor_form_fields_wrapper {
    padding: 16px 0 !important;
  }

  .page-id-1727 .arm_view_profile_link_container {
    padding-top: 6px !important;
  }
}

/* --------------------------------------------------------------------------
   Privacy / footer cleanup (scoped)
   -------------------------------------------------------------------------- */
.page-id-1696 .arm_privacy_policy,
.page-id-1696 .arm_privacy_policy_text,
.page-id-1696 .arm_terms_condition,
.page-id-1696 .arm_terms_condition_text,
.page-id-1727 .arm_privacy_policy,
.page-id-1727 .arm_privacy_policy_text,
.page-id-1727 .arm_terms_condition,
.page-id-1727 .arm_terms_condition_text,
.page-id-1696 .arm-df__footer,
.page-id-1727 .arm-df__footer {
  display: none !important;
}

/* =========================================
   WHY NOT — Edit Profile UI helpers (ARMember)
   Targets ARMember edit_profile wrapper
   ========================================= */

/* Wrap selector: ARMember edit profile form */
.arm-df__fields-wrapper.arm-df__fields-wrapper_edit_profile,
.arm-df__fields-wrapper[data-form_id="edit_profile"]{
  position: relative;
}

/* Make the back button bigger + show "Edit Profile" next to it */
.yn-arm-back{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  font-size: 18px;
  line-height: 1;
  margin: 8px 10px 8px 0;
}

.wn-edit-profile-title{
  display:inline-flex;
  align-items:center;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: .02em;
  margin-left: 6px;
  opacity: .95;
}

/* Compact layout: reduce vertical spacing so more fields fit */
.arm-df__fields-wrapper_edit_profile .arm-control-group,
.arm-df__fields-wrapper[data-form_id="edit_profile"] .arm-control-group{
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.arm-df__fields-wrapper_edit_profile .arm-df__form-group,
.arm-df__fields-wrapper[data-form_id="edit_profile"] .arm-df__form-group{
  padding: 10px 12px !important;
}

/* Slightly smaller inputs on mobile + less padding */
.arm-df__fields-wrapper_edit_profile input.arm-df__form-control,
.arm-df__fields-wrapper_edit_profile textarea.arm-df__form-control,
.arm-df__fields-wrapper_edit_profile select,
.arm-df__fields-wrapper[data-form_id="edit_profile"] input.arm-df__form-control,
.arm-df__fields-wrapper[data-form_id="edit_profile"] textarea.arm-df__form-control,
.arm-df__fields-wrapper[data-form_id="edit_profile"] select{
  padding: 10px 12px !important;
  min-height: 44px;
}

/* Field state outline (optional but useful) */
.wn-prof-filled{
  outline: 1px solid rgba(70,180,80,.35);
  box-shadow: 0 0 0 2px rgba(70,180,80,.10);
  border-radius: 16px;
}
.wn-prof-missing{
  outline: 1px solid rgba(220,50,50,.35);
  box-shadow: 0 0 0 2px rgba(220,50,50,.08);
  border-radius: 16px;
}

/* Emoji badge on RIGHT side */
.wn-prof-badge{
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  line-height: 1;
  z-index: 5;
  pointer-events: none;
}

/* Make sure the form-group can host absolute badge */
.wn-prof-host{
  position: relative !important;
  padding-right: 48px !important; /* space for badge */
}

/* On mobile, slightly tighter still */
@media (max-width: 520px){
  .yn-arm-back{ width: 42px; height: 42px; border-radius: 12px; }
  .wn-edit-profile-title{ font-size: 15px; }
  .arm-df__fields-wrapper_edit_profile .arm-df__form-group{ padding: 9px 11px !important; }
}

/* =========================================================
   WHY NOT — Edit Profile: field status badges (right side)
   ========================================================= */

   body .yn-prof-group {
    position: relative;
  }
  
  /* badge host (right side, vertically centered) */
  body .yn-prof-status {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    pointer-events: none;
  }
  
  /* actual emoji */
  body .yn-prof-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    font-size: 18px;
    line-height: 1;
    background: rgba(0,0,0,.35);
    border: 1px solid rgba(255,255,255,.12);
  }
  
  /* add right padding so text doesn't sit under the badge */
  body .yn-prof-group input,
  body .yn-prof-group select,
  body .yn-prof-group textarea {
    padding-right: 56px !important;
  }
  
  /* optional: subtle glow states */
  body .yn-prof-group.yn-filled {
    border-color: rgba(70,180,80,.35) !important;
  }
  
  body .yn-prof-group.yn-missing {
    border-color: rgba(220,50,47,.35) !important;
  }
  
  /* mobile: tighter badge */
  @media (max-width: 520px) {
    body .yn-prof-status { right: 10px; }
    body .yn-prof-badge { width: 30px; height: 30px; font-size: 16px; }
    body .yn-prof-group input,
    body .yn-prof-group select,
    body .yn-prof-group textarea { padding-right: 50px !important; }
  }

  /* =========================================
   Edit Profile UI polish
   ========================================= */

/* Make the back button bigger + allow title inline */
a.yn-arm-back{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:44px !important;
  height:44px !important;
  border-radius:12px !important;
}

/* Title next to back button */
.yn-edit-profile-title{
  display:inline-flex !important;
  align-items:center !important;
  margin-left:14px !important;
  font-weight:700 !important;
  font-size:18px !important;
  color:#fff !important;
  opacity:.9;
}

/* Pull content up a bit (reduce dead space above sections) */
.arm-df__fields-wrapper_edit_profile{
  padding-top:10px !important;
}
.arm_section_fields_wrapper{
  margin-top:10px !important;
}

/* Compact vertical spacing between fields */
.arm-control-group,
.arm-df__form-group{
  margin-bottom:12px !important;
}

/* ---- Right-side status badge ---- */
.yn-prof-group{
  position:relative !important;
}

.yn-prof-status{
  position:absolute !important;
  right:14px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  z-index:50 !important;
  pointer-events:none !important;
}

.yn-prof-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:32px !important;
  height:32px !important;
  border-radius:999px !important;
  font-size:16px !important;
  line-height:1 !important;
  background:rgba(0,0,0,.35) !important;
  border:1px solid rgba(255,255,255,.12) !important;
}

/* Prevent text overlapping badge */
.yn-prof-group input,
.yn-prof-group select,
.yn-prof-group textarea{
  padding-right:56px !important;
}

/* Mobile tweaks */
@media (max-width:520px){
  a.yn-arm-back{ width:42px !important; height:42px !important; }
  .yn-edit-profile-title{ font-size:17px !important; margin-left:12px !important; }

  .yn-prof-status{ right:10px !important; }
  .yn-prof-badge{ width:30px !important; height:30px !important; font-size:15px !important; }
  .yn-prof-group input,
  .yn-prof-group select,
  .yn-prof-group textarea{ padding-right:50px !important; }
}

/* Kill legacy field indicators (prevents double emojis) */
.wn-field-ind { display:none !important; }