/* Compact portfolio: six columns on desktop, labelled cards on mobile. */
.holdings-page{--portfolio-columns:minmax(210px,2.4fr) repeat(3,minmax(110px,1fr)) minmax(125px,1.1fr) minmax(145px,1.3fr)}
.holdings-page .page{max-width:1600px;padding:12px 28px 8px}
.holdings-page .topbar{height:56px;padding:0 28px}
.holdings-page .holdings-section,.holdings-page .holdings-body{margin:0;padding:0;border:0}
.portfolio-overview{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:10px 16px;background:var(--white);border:1px solid var(--line);border-radius:12px}
.portfolio-title{display:flex;align-items:baseline;gap:14px;white-space:nowrap}
.portfolio-title h1{font-size:24px;letter-spacing:-.6px;margin:0;line-height:1.2}
.portfolio-title>span{font-size:11px;color:var(--muted)}
.portfolio-metrics{display:flex;gap:32px;align-items:center}
.portfolio-metrics>div{display:grid;grid-template-columns:auto auto;gap:2px 8px}
.portfolio-metrics>div>span{grid-column:1/-1;font-size:10px;color:var(--muted)}
.portfolio-metrics strong{font-size:18px;line-height:1.2;font-variant-numeric:tabular-nums;white-space:nowrap}
.portfolio-metrics small{align-self:center;line-height:1.2;font-size:10px;color:var(--muted);white-space:nowrap}
.portfolio-metrics #portfolio-day-note{grid-column:1/-1}
.holdings-page .portfolio-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0 8px}
.portfolio-filters{display:flex;gap:5px;flex-wrap:wrap}
.portfolio-filters button{font-size:11px;font-weight:650;border:1px solid var(--line);background:var(--white);color:var(--muted);border-radius:7px;padding:6px 10px}
.portfolio-filters button[aria-pressed=true]{background:var(--wash);color:var(--blue);border-color:var(--blue)}
.holdings-page .portfolio-actions{margin:0;gap:12px}
.portfolio-context{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:10px;color:var(--muted);font-size:10px}
.holdings-page .market-index{padding:4px 8px}
.holdings-page .market-index strong{font-size:11px}
.holdings-page .market-index b{font-size:10px}
.holdings-page .holdings-list-panel{overflow:visible;border:1px solid var(--line);background:var(--white);border-radius:10px}
.holdings-page .holdings-column-headings,.portfolio-row-main{display:grid;grid-template-columns:var(--portfolio-columns);gap:12px;min-width:0;align-items:center;padding:0 14px}
.holdings-page .holdings-column-headings{padding-top:9px;padding-bottom:9px;font-size:11px;border-radius:10px 10px 0 0;background:var(--wash);border-color:var(--line)}
.holdings-page .holdings-column-headings button{white-space:normal;line-height:1.25;font-size:11px}
.portfolio-row{border-top:1px solid var(--line)}
.portfolio-row-main{min-height:34px;font-size:12px;font-variant-numeric:tabular-nums}
.portfolio-row-main>div{text-align:right;min-width:0}
.portfolio-row-main:hover{background:var(--paper)}
.portfolio-holding-toggle{display:flex;align-items:center;gap:7px;min-width:0;padding:5px 0;border:0;background:transparent;color:var(--ink);text-align:left;font-size:12px}
.portfolio-holding-toggle strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:650}
.portfolio-holding-toggle small{font-size:9px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100px;flex-shrink:2}
.portfolio-chevron{font-size:18px;color:var(--muted);line-height:1;transition:transform .12s}
.portfolio-holding-toggle[aria-expanded=true] .portfolio-chevron{transform:rotate(90deg)}
.portfolio-return{display:flex;justify-content:flex-end;align-items:baseline;gap:8px}
.portfolio-return strong{font-size:12px;font-weight:650}
.portfolio-return small{font-size:10px}
.portfolio-value{font-weight:650}
.portfolio-group{padding:5px 14px;font-size:10px;letter-spacing:.5px;font-weight:700;color:var(--muted);background:var(--paper);border-top:1px solid var(--line)}
.portfolio-details{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 20px;border-top:1px dashed var(--line);background:var(--paper);padding:14px 30px;font-size:11px}
.portfolio-details>div>span:first-child{display:block;color:var(--muted);font-size:10px;margin-bottom:3px}
.portfolio-details strong{font-size:11px;font-weight:550}
.portfolio-details .cell-note{display:block;font-size:10px;color:var(--muted);margin-top:3px}
.portfolio-detail-actions{display:flex;align-items:center;gap:20px;grid-column:1/-1}
.portfolio-empty{padding:22px;text-align:center;color:var(--muted);font-size:12px}
.holdings-page #holding-message:empty{display:none}
.holdings-page #holding-message{margin-bottom:8px;font-size:12px}
.holdings-page #holding-form{margin-top:16px}
.holdings-page footer{max-width:1600px;padding:10px 28px 16px}
@media(max-width:1150px){
 .holdings-page{--portfolio-columns:minmax(180px,2fr) repeat(3,minmax(90px,1fr)) minmax(110px,1fr) minmax(125px,1.2fr)}
 .portfolio-metrics{gap:18px}.portfolio-metrics small{grid-column:1/-1}
 .portfolio-context{align-items:flex-start}.portfolio-context>span{max-width:50%}
 .portfolio-holding-toggle small{display:none}
 .portfolio-return{display:block}.portfolio-return small{display:block;font-size:9px}
}
@media(max-width:900px){
 .portfolio-overview{align-items:flex-start;gap:12px;padding:12px}
 .portfolio-title{display:block}.portfolio-title>span{display:block;margin-top:4px}
 .portfolio-metrics{gap:14px}.portfolio-metrics strong{font-size:16px}
 .holdings-page .page{padding:12px}.holdings-page .topbar{padding-left:12px;padding-right:12px}
 .holdings-page .portfolio-toolbar{flex-wrap:wrap}.holdings-page .portfolio-actions{margin:0}
}
@media(max-width:900px){
 .holdings-page .topbar{height:auto;min-height:56px;padding-top:8px;padding-bottom:8px}
 .portfolio-overview{display:block}.portfolio-title{display:flex;align-items:baseline}
 .portfolio-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:12px;gap:10px}
 .portfolio-metrics>div{display:block;min-width:0}.portfolio-metrics strong,.portfolio-metrics small{display:block;font-size:14px;white-space:normal}.portfolio-metrics small{font-size:9px}
 .portfolio-context{display:block}.portfolio-context>span{display:none}.holdings-page .market-index{margin-left:auto;width:max-content;max-width:100%;flex-wrap:wrap}
 .holdings-page .holdings-column-headings{display:none}
 .holdings-page .holdings-list-panel{border:0;background:transparent}
 .portfolio-group{border:0;padding:8px 0 5px;background:transparent}
 .portfolio-row{border:1px solid var(--line);border-radius:8px;margin-bottom:6px;background:var(--white)}
 .portfolio-row-main{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 12px;padding:10px 12px}
 .portfolio-holding-toggle{grid-column:1/-1;padding:0}.portfolio-holding-toggle small{display:block}
 .portfolio-row-main>div{text-align:left;font-size:12px}
 .portfolio-row-main>div::before{display:block;font-size:9px;color:var(--muted);margin-bottom:2px}
 .portfolio-price::before{content:'Kurs nu'}.portfolio-close::before{content:'Föreg. stängning'}.portfolio-daily::before{content:'Kursförändring'}.portfolio-value::before{content:'Värde'}.portfolio-gain::before{content:'Sedan köp'}
 .portfolio-gain{grid-column:span 2}.portfolio-return{display:flex;justify-content:flex-start}
 .portfolio-details{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px;gap:10px}
 .holdings-page footer{padding-left:12px;padding-right:12px}
}
@media(prefers-reduced-motion:reduce){.portfolio-chevron{transition:none}}

.portfolio-reserve{font-size:9px;color:var(--muted);margin-left:3px}

.portfolio-row-main{cursor:pointer}
.portfolio-row-main:has(.portfolio-holding-toggle:focus-visible){outline:2px solid var(--blue);outline-offset:-2px}
.holdings-page [data-kind=fund]{grid-template-columns:minmax(210px,2.4fr) minmax(110px,1fr) minmax(220px,2fr) minmax(125px,1.1fr) minmax(145px,1.3fr)}
.portfolio-group-headings{border-radius:0!important}
@media(max-width:1150px){.holdings-page [data-kind=fund]{grid-template-columns:minmax(180px,2fr) minmax(90px,1fr) minmax(190px,2fr) minmax(110px,1fr) minmax(125px,1.2fr)}}
@media(max-width:900px){
 .holdings-page .portfolio-row-main[data-kind=fund]{grid-template-columns:repeat(2,minmax(0,1fr))}
 .portfolio-row-main[data-kind=fund] .portfolio-gain{grid-column:auto}
 .portfolio-row-main[data-kind=fund] .portfolio-daily::before{content:'NAV-förändring'}
 .portfolio-nav-date::before{content:'Senaste NAV-datum'}
}

.portfolio-group{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding:9px 13px 7px;border:1px solid var(--line);border-bottom:0;border-left:3px solid var(--blue);border-radius:9px 9px 0 0;background:var(--wash);color:var(--ink);font-size:12px;letter-spacing:0;font-weight:750}
.portfolio-group>span{color:var(--muted);font-size:10px;font-weight:550}
.portfolio-group:first-child{margin-top:0}
.portfolio-group-headings{margin:0 0 4px;padding:8px 13px!important;border:1px solid var(--line);border-radius:0 0 8px 8px!important;background:var(--wash)}
.portfolio-row{border:0;border-bottom:1px solid var(--line);margin:0 8px}
.portfolio-row:last-of-type{border-bottom:0}
.portfolio-subtotal{border-radius:0 0 8px 8px;margin:0 8px 8px}
@media(max-width:900px){.portfolio-group{display:flex;margin-top:12px;padding:7px 10px 5px}.portfolio-group:first-child{margin-top:0}.portfolio-group-headings{display:none}}

/* Section totals share exactly the same column grid as their holdings. */
.portfolio-subtotal{display:grid;grid-template-columns:var(--portfolio-columns);align-items:center;gap:12px;padding:7px 14px;border-top:2px solid var(--line);background:var(--wash);font-size:12px;font-variant-numeric:tabular-nums}
.portfolio-subtotal>div{text-align:right;min-width:0}
.portfolio-subtotal>.portfolio-price,.portfolio-subtotal>.portfolio-close,.portfolio-subtotal>.portfolio-nav-date{color:var(--muted)}
@media(min-width:901px){.portfolio-row-main{min-height:30px}.holdings-page .holdings-column-headings{padding-top:5px;padding-bottom:5px}}
@media(max-width:900px){
 .holdings-page .portfolio-subtotal[data-kind]{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;margin-bottom:8px}
 .portfolio-subtotal>strong{grid-column:1/-1}.portfolio-subtotal>div{text-align:left}
 .portfolio-subtotal>div::before{display:block;color:var(--muted);font-size:9px;margin-bottom:2px}
 .portfolio-subtotal .portfolio-price,.portfolio-subtotal .portfolio-close,.portfolio-subtotal .portfolio-nav-date{display:none}
 .portfolio-subtotal .portfolio-daily::before{content:'Viktad förändring'}.portfolio-subtotal .portfolio-value::before{content:'Värde'}.portfolio-subtotal .portfolio-gain::before{content:'Sedan köp'}
 .portfolio-subtotal .portfolio-gain{grid-column:1/-1}
}
