.portfolio-import-card { padding:24px; max-width:1200px; margin:auto; min-width:0; }
.portfolio-import-card p { line-height:1.55; }
.portfolio-upload { border:2px dashed #7974ce; border-radius:14px; padding:30px 18px; text-align:center; cursor:pointer; margin:20px 0 10px; }
.portfolio-import-card button { padding:12px 16px; border:1px solid #b5b2dd; border-radius:10px; margin:12px 12px 12px 0; background:var(--surface, #fff); color:inherit; cursor:pointer; }
.portfolio-import-card button:disabled { opacity:.5; cursor:not-allowed; }
.portfolio-import-card input[type=checkbox] { margin:12px 8px 12px 0; }
.portfolio-import-warning { padding:12px; background:#fff6db; color:#5a4600; border-radius:10px; }
.portfolio-currency-totals { display:flex; flex-wrap:wrap; gap:12px; margin:20px 0; }
.portfolio-currency-totals article { border:1px solid #ccc; border-radius:12px; padding:16px; min-width:150px; }
.portfolio-currency-totals small { display:block; }
.portfolio-currency-totals p { flex-basis:100%; }
.portfolio-import-card .dash-table-container { max-width:100%; }
@media(max-width:600px) { .portfolio-import-card {padding:16px;} .portfolio-import-card button {width:100%; margin-right:0;} }

.portfolio-import-card { width:100%; box-sizing:border-box; }
.portfolio-account-details { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:12px 0; }
.portfolio-account-details input { min-width:0; width:100%; padding:10px; border:1px solid var(--border-color,#ccc); border-radius:8px; box-sizing:border-box; }
.portfolio-account-details button { grid-column:1/-1; }
@media(max-width:600px) { .portfolio-account-details { grid-template-columns:1fr; } }

.holdings-actions, .saved-holdings-lab { margin:20px 0; padding:24px; min-width:0; }
.holdings-actions button, .saved-holdings-lab button { margin:14px 0; padding:12px; border-radius:10px; cursor:pointer; }
.saved-holdings-lab p { line-height:1.6; }
.saved-holdings-lab label { display:block; margin:10px 0; }
.saved-lab-fields, .saved-lab-metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin:20px 0; }
.saved-lab-fields input { width:100%; padding:10px; box-sizing:border-box; }
.saved-lab-metrics dl { display:grid; grid-template-columns:1fr auto; gap:10px; }
.saved-lab-metrics dd { margin:0; font-weight:700; }
@media(max-width:600px) { .holdings-actions,.saved-holdings-lab {padding:16px;} }

/* Keep nested lab panels and multi-select chips within the mobile viewport. */
.portfolio-page #main-content, .portfolio-page-main,
.portfolio-builder-grid, .portfolio-field, .portfolio-symbol-dropdown { min-width:0; max-width:100%; }
.portfolio-page #main-content { width:100%; }
.portfolio-symbol-dropdown .Select-multi-value-wrapper { white-space:normal; }
.portfolio-symbol-dropdown .Select-value { max-width:100%; }
.portfolio-symbol-dropdown .Select-value-label { white-space:normal; overflow-wrap:anywhere; }
.grow-account-action { display:block; min-height:32px; }
@media(max-width:700px) {
  .portfolio-builder-grid { grid-template-columns:minmax(0,1fr); }
  .portfolio-page input:not([type=radio]):not([type=checkbox]),
  .portfolio-page .Select-input input,
  .portfolio-import-card input:not([type=checkbox]),
  .holdings-actions .Select-input input { font-size:16px !important; }
  .portfolio-allocation-row > input { flex-shrink:0; }
}
.portfolio-result-card > *, .portfolio-chart { min-width:0; max-width:100%; }
.portfolio-chart { width:100%; }

#portfolio-upload-count { padding:12px; margin:8px 0; background:var(--surface-muted-bg,#f7f8fc); border-radius:10px; overflow-wrap:anywhere; }
#portfolio-import-status { margin:12px 0; font-weight:600; overflow-wrap:anywhere; }
.portfolio-import-card:has(#portfolio-import-status[data-dash-is-loading="true"]) #portfolio-read { pointer-events:none; font-size:0; }
.portfolio-import-card:has(#portfolio-import-status[data-dash-is-loading="true"]) #portfolio-read::after { content:'Reading screenshots…'; font-size:16px; }

/* Health summaries stay inside the mobile viewport, including large balances. */
.portfolio-health, .portfolio-health * { box-sizing:border-box; min-width:0; }
.portfolio-health { margin:28px 0; max-width:100%; }
.portfolio-health-card { border:1px solid var(--border-color,#dedfea); border-radius:16px; padding:20px; margin:20px 0; overflow-wrap:anywhere; }
.portfolio-health-card h3 { margin:0 0 8px; }
.portfolio-health-card h4 { margin:16px 0 10px; }
.health-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:20px 0; }
.health-metrics dt { font-size:.85rem; opacity:.75; margin-bottom:6px; }
.health-metrics dd { font-size:1.1rem; font-weight:700; margin:0; font-variant-numeric:tabular-nums; }
.health-exposures { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.health-bars, .health-contributors ul { padding:0; margin:0; list-style:none; }
.health-bars li { margin:12px 0; }
.health-bar-label { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; font-size:.9rem; }
.health-bar-label strong { white-space:nowrap; }
.health-bar-track { height:8px; border-radius:4px; background:var(--surface-muted-bg,#eeeef8); margin-top:6px; overflow:hidden; }
.health-bar-track > div { height:100%; background:var(--accent,#6257d5); border-radius:4px; }
.portfolio-health small { display:block; font-size:.8rem; line-height:1.5; opacity:.8; }
.health-movement { border-top:1px solid var(--border-color,#dedfea); margin-top:22px; padding-top:4px; }
.health-move { font-weight:700; font-variant-numeric:tabular-nums; margin-bottom:4px; }
.health-contributors { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.health-contributor { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:10px; margin:12px 0; }
.health-contributor > div { text-align:right; font-variant-numeric:tabular-nums; }
.health-helped .health-contributor > div > span { color:#13794b; }
.health-hurt .health-contributor > div > span { color:#b83232; }
@media(max-width:900px) { .health-exposures { grid-template-columns:minmax(0,1fr); gap:8px; } .health-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .portfolio-health-card { padding:14px; } .health-total { grid-column:1/-1; } .health-contributors { grid-template-columns:minmax(0,1fr); gap:0; } }

/* Dash DataTable pagination: override the broad mobile form-button styling. */
.portfolio-import-card .previous-next-container {
  display:flex; align-items:center; justify-content:center; flex-wrap:nowrap;
  gap:6px; margin:12px auto; width:100%; max-width:360px;
}
.portfolio-import-card .previous-next-container button {
  display:inline-flex; align-items:center; justify-content:center;
  flex:0 0 38px; width:38px; min-width:38px; height:38px;
  padding:0; margin:0; border-radius:9px;
}
.portfolio-import-card .previous-next-container .page-number {
  display:inline-flex; align-items:center; justify-content:center;
  flex:0 1 auto; width:auto; min-width:70px; margin:0 4px;
  white-space:nowrap;
}
.portfolio-import-card .previous-next-container .page-number input {
  width:36px !important; min-width:0; text-align:center; font-size:14px !important;
}
@media(max-width:600px) {
  .portfolio-import-card .previous-next-container button { width:38px; margin:0; }
}
