/* Super App V1.15 — mobile/layout correction for Me settings panels.
   V1.15 moves the original settings cards out of .settings-grid, so the
   form rules that used to come from styles.css must be restored here. */

.v15-panel-cards > .card {
  display:grid;
  gap:14px;
  min-width:0;
  align-content:start;
}

.v15-panel-cards > .card > h3 {
  margin:0;
  font-family:Georgia,serif;
}

.v15-panel-cards label:not(.switch-line):not(.topic-check):not(.file-button) {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:6px;
  min-width:0;
  color:var(--muted);
  font-size:13px;
}

.v15-panel-cards input:not([type="checkbox"]):not([type="file"]),
.v15-panel-cards select,
.v15-panel-cards textarea {
  width:100%;
  min-width:0;
  max-width:100%;
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 11px;
  outline:none;
  color:var(--ink);
}

.v15-panel-cards textarea {
  resize:vertical;
}

.v15-panel-cards .switch-line {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  min-width:0;
}

.v15-panel-cards .switch-line > span {
  min-width:0;
}

.v15-panel-cards .switch-line small {
  display:block;
  margin-top:3px;
  line-height:1.35;
}

.v15-panel-cards .switch-line input[type="checkbox"] {
  width:auto;
  min-width:20px;
  height:20px;
  margin:0;
  justify-self:end;
}

.v15-panel-cards .section-head {
  gap:12px;
  min-width:0;
}

.v15-panel-cards .section-head > * {
  min-width:0;
}

.v15-panel-cards .section-head h3,
.v15-panel-cards .section-head small,
.v15-panel-cards .muted-text {
  overflow-wrap:anywhere;
}

.v15-panel-cards .button-row {
  min-width:0;
}

.v15-panel-cards > .card > button.primary,
.v15-panel-cards > .card > button.secondary,
.v15-panel-cards > .card > button.danger-button,
.v15-panel-cards .file-button {
  justify-self:start;
}

.v15-panel-cards .file-button {
  display:inline-flex;
  align-items:center;
  gap:8px;
  width:auto;
  max-width:100%;
  padding:11px 16px;
  border-radius:14px;
  background:var(--sage);
  color:var(--green);
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}

.v15-panel-cards .file-button input[type="file"] {
  display:none;
}

/* Keep money preference controls in a predictable one-label/one-control stack. */
.v15-me-panel[data-v15-panel="money"] .v15-panel-cards label:not(.switch-line) {
  width:100%;
}

@media (max-width:820px) {
  .v15-panel-cards > .card {
    width:100%;
    max-width:100%;
    padding:18px;
    gap:13px;
  }

  .v15-panel-cards .section-head {
    align-items:flex-start;
  }

  .v15-panel-cards input:not([type="checkbox"]):not([type="file"]),
  .v15-panel-cards select,
  .v15-panel-cards textarea {
    font-size:16px;
  }
}

@media (max-width:520px) {
  .v15-profile-card {
    grid-template-columns:auto minmax(0,1fr);
    gap:12px;
  }

  .v15-version-pill {
    grid-column:2;
    justify-self:start;
  }

  .v15-settings-row {
    grid-template-columns:36px minmax(0,1fr) 14px;
  }

  .v15-settings-status {
    grid-column:2;
    max-width:100%;
    justify-self:start;
    text-align:left;
  }

  .v15-settings-chevron {
    grid-column:3;
    grid-row:1 / span 2;
    align-self:center;
  }

  .v15-panel-head {
    grid-template-columns:42px minmax(0,1fr);
    gap:11px;
  }

  .v15-panel-head h3 {
    font-size:1.35rem;
    line-height:1.12;
  }

  .v15-panel-cards > .card {
    padding:17px 16px;
    border-radius:20px;
  }

  .v15-panel-cards .section-head {
    flex-wrap:wrap;
  }

  .v15-panel-cards .button-row {
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }

  .v15-panel-cards .button-row > button,
  .v15-panel-cards > .card > button.primary,
  .v15-panel-cards > .card > button.secondary,
  .v15-panel-cards .file-button {
    width:100%;
  }

  .v15-panel-cards > .card > button.danger-button {
    width:100%;
  }
}
