/* A separate asset table using the application's existing ocean palette. */
#investmentsCard[hidden],#summaryInvestmentsRow[hidden]{display:none!important}
.investments-card{min-width:0}
.investments-card .card-heading h2{color:var(--text,#d9f3ff)}
.investments-color,.investment-number{color:#7bd9ed}
.investment-number{white-space:nowrap;text-align:left;font-variant-numeric:tabular-nums}
.investment-value-button{border:0;background:transparent;color:inherit;font:inherit;text-align:right;cursor:pointer;padding:8px 0;overflow-wrap:anywhere}
.investment-value-button:focus-visible{outline:2px solid #36cbdc;outline-offset:3px;border-radius:6px}
.investments-search{box-sizing:border-box;width:100%;margin:4px 0 14px;font-size:16px}
.investment-overlay{z-index:1650;display:flex!important;align-items:center!important;justify-content:center;padding:16px;box-sizing:border-box;overflow:auto}
.investment-dialog{width:min(560px,100%);margin:auto;max-height:calc(100dvh - 32px);overflow:auto;box-sizing:border-box;text-align:right}
.investment-dialog-body{display:grid;gap:16px;min-width:0}
.investment-dialog-body p{margin:0;line-height:1.7}
.investment-hint{font-size:.85rem;color:var(--muted,#9bb9ca)}
.investment-summary{padding:16px;border:1px solid #285065;border-radius:14px;display:grid;gap:14px;background:rgba(2,9,17,.32)}
.investment-metric{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.investment-metric bdi{font-weight:700;font-variant-numeric:tabular-nums}
.investment-holdings{border:1px solid #285065;border-radius:14px;padding:12px;min-width:0}
.investment-holdings h4{margin:0 0 10px}
.investment-holding{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:center;padding:10px 0;border-top:1px solid #285065}
.investment-holding>span{overflow-wrap:anywhere}
.investment-holding small{grid-column:1/-1;color:var(--muted,#9bb9ca)}
.investment-detail-actions{display:flex;gap:10px;flex-wrap:wrap}
.investment-detail-actions button,.investment-secondary{border:1px solid #38758a;background:#102e40;color:#c6f0ff;border-radius:12px;padding:10px 14px;font:inherit;cursor:pointer;min-height:44px}
.investment-detail-actions button{flex:1}
.investment-delete{border:0;background:transparent;color:#ff8790;padding:10px;font:inherit;cursor:pointer}
.investment-dialog button:disabled{opacity:.45;cursor:default}
.investment-dialog .positive,#investmentsBody .positive{color:#65e6b4}.investment-dialog .negative,#investmentsBody .negative{color:#ff7884}
@media (max-width:640px){
 .investment-dialog{padding:20px!important}
}

.savings-withdraw-dialog [hidden]{display:none!important}

#dashboard .tracker-grid .investments-card{order:6}
#dashboard .investments-card .total-badge,#dashboard .neon-hero[data-view="investments"] .neon-hero-amount,#dashboard .neon-stat-investments .neon-stat-value{color:#7bd9ed!important}
#investmentsBody tr:focus-visible{outline:2px solid #36cbdc;outline-offset:-2px}

#investmentsBody :is(.amount-input,.amount-currency-symbol){color:#7bd9ed}
#investmentsBody .investment-details-toggle{font-weight:700}


.investment-details-header{display:flex;direction:rtl;align-items:flex-start;gap:16px;width:100%}
.investment-details-header h3{flex:1;min-width:0;margin:0;overflow-wrap:anywhere}
.investment-details-close{flex:0 0 44px;width:44px;min-height:44px}
.investment-details .variable-expense-modal-actions[hidden]{display:none!important}
.investment-details{overflow-anchor:none;scroll-behavior:auto}

/* Native iOS date controls must fit their field without cropping the left edge. */
:is(.all-table-add-modal,.investment-dialog) :is(.date-field,.asset-opening-date){width:100%;min-width:0;max-width:100%;overflow:visible;box-sizing:border-box}
:is(.all-table-add-modal,.investment-dialog) input[type="date"]{appearance:none;-webkit-appearance:none;display:block;width:100%;min-width:0!important;min-inline-size:0;max-width:100%;box-sizing:border-box;padding:12px 10px;direction:ltr;text-align:center;font-size:16px}
:is(.all-table-add-modal,.investment-dialog) input[type="date"]::-webkit-date-and-time-value{min-width:0;text-align:center}
:is(.all-table-add-modal,.investment-dialog) input[type="date"]::-webkit-datetime-edit{min-width:0;padding:0}
.all-table-add-modal[data-entry-type="savings"] .variable-expense-form-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:none}
.all-table-add-modal[data-entry-type="savings"] .variable-expense-form-grid>*{grid-area:auto;grid-column:1/-1;min-width:0}

/* Reserve space between the investment name and amount without widening rows. */
#investmentsBody .description-cell{position:relative;box-sizing:border-box}
#investmentsBody .description-cell:has(>.investment-trend:not([hidden])){padding-inline-end:28px!important}
#investmentsBody .description-cell>.cell-input{min-width:0;width:100%}
#investmentsBody .description-cell>.investment-trend{position:absolute;inset-inline-end:4px;top:50%;transform:translateY(-50%)}
#investmentsCard .investment-trend{display:inline-flex;flex:0 0 18px;width:18px;height:18px;vertical-align:middle;pointer-events:none}
#investmentsCard .investment-trend[hidden]{display:none!important}
#investmentsCard .investment-trend[data-trend="up"],#investmentsProfitRow[data-trend="up"] .investment-performance-total{color:#65e6b4!important}
#investmentsCard .investment-trend[data-trend="down"],#investmentsProfitRow[data-trend="down"] .investment-performance-total{color:#ff7884!important}
#investmentsProfitRow[data-trend="flat"] .investment-performance-total{color:var(--text,#d9f3ff)}
.investment-profit-total{display:inline-flex;direction:ltr;align-items:center;gap:8px;white-space:nowrap}
#investmentsProfitRow .investment-performance-total{text-align:left}
#investmentsCard .investment-trend>svg{display:block;width:100%;height:100%}