/*!
 * PPLI.com — Portfolio Tax X-Ray
 * Styling for the tax drag instrument. Inherits the site palette: navy #0A0F17,
 * gold #B09548, cream #F9F8F4 / #EFEDE6, rule #DDD9D0.
 *
 * SPECIFICITY NOTE (do not remove the .pp prefixes):
 * The site's Customizer CSS carries `.pp *{margin:0;padding:0}` and is printed
 * after enqueued stylesheets, so a bare single-class rule such as `.tx-panel`
 * ties on specificity and loses on order — every padding and margin silently
 * collapses to zero. Prefixing with `.pp` raises each rule to (0,2,0) and wins.
 * The instrument always renders inside the `.pp` page wrapper on this site.
 *
 * DEPLOYMENT NOTE (why the version is in the filename):
 * This host serves theme static assets from a cache that ignores the ?ver query
 * string, so an edited file keeps serving its old body indefinitely. Ship a new
 * filename on every change and update the asset map in the R-WI assets snippet.
 *
 * v1.0.2 — header tooltips, attribution lead line, benchmark bars
 * v1.0.3 — asset-class column widened to 292px: the tooltip markers added width
 *          to the header row and squeezed the longest default labels.
 */

.pp .tx{--nv:#0A0F17;--gd:#B09548;--cr:#F9F8F4;--cr2:#EFEDE6;--rl:#DDD9D0;--tx1:#1A1916;--tx2:#5A5850;--tx3:#8A877E;
	font-family:'DM Sans',sans-serif;color:var(--tx1);max-width:1120px;margin:0 auto;padding:0 28px}
.pp .tx *{box-sizing:border-box}
.pp .tx h3,.pp .tx h4{font-family:'Cormorant Garamond',Georgia,serif;color:var(--nv);margin:0;font-weight:500}

/* ---------------------------------------------------------------- panels */
.pp .tx-panel{background:#fff;border:1px solid var(--rl);border-top:2px solid var(--gd);margin:0 0 22px}
.pp .tx-panel-h{padding:20px 26px 0}
.pp .tx-panel-b{padding:18px 26px 26px}
.pp .tx-lbl{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gd);font-weight:700;margin:0 0 8px}
.pp .tx-panel-h h3{font-size:24px;line-height:1.15;margin:0}
.pp .tx-note{font-family:'Source Serif 4',Georgia,serif;font-size:13.5px;line-height:1.75;color:var(--tx2);margin:8px 0 0}

/* ------------------------------------------------------------- top inputs */
.pp .tx-top{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--rl);border-top:2px solid var(--gd);background:#fff;margin:0 0 22px}
.pp .tx-top > div{padding:20px 24px;border-right:1px solid var(--rl)}
.pp .tx-top > div:last-child{border-right:none}
.pp .tx-top label{display:block;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx3);font-weight:700;margin:0 0 9px}
.pp .tx-field{display:flex;align-items:baseline;gap:6px}
.pp .tx-field .tx-pre{font-family:'Cormorant Garamond',Georgia,serif;font-size:22px;color:var(--gd)}
.pp .tx-field .tx-suf{font-size:13px;color:var(--tx3)}
.pp .tx-top input{font-family:'Cormorant Garamond',Georgia,serif;font-size:26px;font-weight:500;color:var(--nv);
	border:none;border-bottom:1px solid var(--rl);background:transparent;padding:2px 0 4px;width:100%;outline:none;
	transition:border-color .25s;-moz-appearance:textfield}
.pp .tx-top input:focus{border-bottom-color:var(--gd)}
.pp .tx-top input::-webkit-outer-spin-button,.pp .tx-top input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.pp .tx-hint{font-family:'Source Serif 4',Georgia,serif;font-size:12px;line-height:1.6;color:var(--tx3);margin:9px 0 0}

/* ----------------------------------------------------------------- table */
.pp .tx-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.pp .tx-tbl{width:100%;border-collapse:collapse;min-width:880px;margin:0}
.pp .tx-tbl th{background:var(--nv);color:#fff;font-size:9px;letter-spacing:.09em;text-transform:uppercase;font-weight:600;
	padding:12px 10px;text-align:right;vertical-align:bottom;line-height:1.35}
.pp .tx-tbl th:first-child{text-align:left;min-width:292px}
.pp .tx-tbl th small{display:block;font-size:8px;letter-spacing:.04em;text-transform:none;color:rgba(255,255,255,.4);font-weight:400;margin:3px 0 0}
.pp .tx-tbl td{padding:0;border-bottom:1px solid var(--rl);text-align:right}
.pp .tx-tbl tr:hover td{background:#FCFBF8}
.pp .tx-tbl td:first-child{text-align:left}
.pp .tx-name{display:flex;align-items:center;gap:8px;padding:6px 10px}
.pp .tx-name input{font-family:'Source Serif 4',Georgia,serif;font-size:14px;color:var(--tx1);border:none;background:transparent;
	padding:6px 0;width:100%;outline:none;border-bottom:1px solid transparent}
.pp .tx-name input:focus{border-bottom-color:var(--gd)}
.pp .tx-tbl td input.tx-n{font-family:'DM Sans',sans-serif;font-size:14px;color:var(--tx1);text-align:right;border:none;
	background:transparent;padding:13px 10px;width:100%;outline:none;-moz-appearance:textfield;transition:background .2s}
.pp .tx-tbl td input.tx-n:focus{background:rgba(176,149,72,.09)}
.pp .tx-tbl td input.tx-n::-webkit-outer-spin-button,.pp .tx-tbl td input.tx-n::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.pp .tx-del{flex:0 0 auto;border:none;background:transparent;color:var(--rl);cursor:pointer;font-size:15px;line-height:1;padding:2px 4px;transition:color .2s}
.pp .tx-del:hover{color:#A6402F}
.pp .tx-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:14px 0 0}
.pp .tx-add{border:1px solid var(--rl);background:transparent;color:var(--tx2);font-family:'DM Sans',sans-serif;font-size:10px;
	letter-spacing:.14em;text-transform:uppercase;font-weight:700;padding:11px 20px;cursor:pointer;transition:all .3s}
.pp .tx-add:hover{border-color:var(--gd);color:var(--gd)}
.pp .tx-sum{font-size:12px;color:var(--tx3)}
.pp .tx-sum b{font-family:'Cormorant Garamond',Georgia,serif;font-size:17px;color:var(--nv);font-weight:500}
.pp .tx-sum.warn b{color:#A6402F}

/* --------------------------------------------------------------- results */
.pp .tx-res{background:var(--nv);padding:34px 30px 30px;margin:0 0 22px}
.pp .tx-res .tx-lbl{color:rgba(176,149,72,.75)}
.pp .tx-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.07);margin:4px 0 0}
.pp .tx-tile{background:var(--nv);padding:22px 20px 20px}
.pp .tx-tile .k{font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.38);font-weight:700;line-height:1.5;min-height:26px}
.pp .tx-tile .v{font-family:'Cormorant Garamond',Georgia,serif;font-size:40px;font-weight:300;color:#fff;line-height:1.05;margin:10px 0 0}
.pp .tx-tile .v em{font-style:normal;color:var(--gd)}
.pp .tx-tile .s{font-size:11px;color:rgba(255,255,255,.35);margin:6px 0 0;line-height:1.5}
.pp .tx-res-note{font-family:'Source Serif 4',Georgia,serif;font-size:12.5px;line-height:1.75;color:rgba(255,255,255,.4);
	margin:22px 0 0;padding:18px 0 0;border-top:1px solid rgba(255,255,255,.08)}

/* ------------------------------------------------------------ attribution */
.pp .tx-attr{width:100%;border-collapse:collapse;margin:0}
.pp .tx-attr th{font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:var(--tx3);font-weight:700;
	padding:0 10px 10px;text-align:right;border-bottom:1px solid var(--rl)}
.pp .tx-attr th:first-child{text-align:left}
.pp .tx-attr td{padding:13px 10px;border-bottom:1px solid var(--rl);text-align:right;font-size:13.5px;color:var(--tx2)}
.pp .tx-attr td:first-child{text-align:left;color:var(--tx1);font-family:'Source Serif 4',Georgia,serif}
.pp .tx-attr td b{font-family:'Cormorant Garamond',Georgia,serif;font-size:18px;color:var(--nv);font-weight:500}
.pp .tx-bar{position:relative;height:5px;background:var(--cr2);min-width:90px;margin:7px 0 0}
.pp .tx-bar i{position:absolute;inset:0 auto 0 0;background:var(--gd);display:block}
.pp .tx-attr tr.tx-tot td{border-bottom:none;border-top:1.5px solid var(--nv);font-weight:600;color:var(--tx1)}

/* --------------------------------------------------------------- horizon */
.pp .tx-hz{width:100%;border-collapse:collapse;margin:0}
.pp .tx-hz th{font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:var(--tx3);font-weight:700;
	padding:0 10px 10px;text-align:right;border-bottom:1px solid var(--rl)}
.pp .tx-hz th:first-child{text-align:left}
.pp .tx-hz td{padding:14px 10px;border-bottom:1px solid var(--rl);text-align:right;font-size:13.5px;color:var(--tx2)}
.pp .tx-hz td:first-child{text-align:left;font-family:'Cormorant Garamond',Georgia,serif;font-size:20px;color:var(--nv)}
.pp .tx-hz td.hi{color:var(--nv);font-weight:600}
.pp .tx-hz td.gd{font-family:'Cormorant Garamond',Georgia,serif;font-size:19px;color:#8C6F2B}

/* ------------------------------------------------------------ handoff/cta */
.pp .tx-hand{border:1px solid var(--rl);border-left:2px solid var(--gd);background:#fff;padding:26px 30px;margin:0 0 8px}
.pp .tx-hand p{font-family:'Source Serif 4',Georgia,serif;font-size:15px;line-height:1.8;color:var(--tx2);margin:0 0 14px}
.pp .tx-hand a.go{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--gd);font-weight:700;
	text-decoration:none;border-bottom:1px solid rgba(176,149,72,.4);padding-bottom:2px}
.pp .tx-hand a.go:hover{border-bottom-color:var(--gd)}

.pp .tx-nojs{border:1px solid var(--rl);background:var(--cr2);padding:20px 24px;font-family:'Source Serif 4',Georgia,serif;
	font-size:14px;line-height:1.75;color:var(--tx2)}

/* ------------------------------------------------------- header tooltips */
.pp .tx-i{display:inline-flex;align-items:center;justify-content:center;width:13px;height:13px;margin:0 0 0 6px;
	border:1px solid rgba(176,149,72,.65);border-radius:50%;color:#B09548;font-family:'DM Sans',sans-serif;
	font-size:8px;font-weight:700;font-style:normal;line-height:1;text-transform:none;letter-spacing:0;
	cursor:help;position:relative;vertical-align:middle;transition:background .2s,border-color .2s,color .2s}
.pp .tx-i:hover,.pp .tx-i:focus{background:#B09548;border-color:#B09548;color:#0A0F17;outline:none}
.pp .tx-i::after{content:attr(data-tip);position:absolute;top:calc(100% + 9px);right:-6px;width:268px;
	background:#fff;color:#5A5850;border:1px solid #DDD9D0;border-top:2px solid #B09548;
	padding:13px 15px;font-family:'Source Serif 4',Georgia,serif;font-size:12.5px;line-height:1.65;
	font-weight:400;letter-spacing:0;text-transform:none;text-align:left;white-space:normal;
	box-shadow:0 14px 34px rgba(10,15,23,.22);opacity:0;visibility:hidden;transform:translateY(-4px);
	transition:opacity .2s,transform .2s,visibility .2s;z-index:40;pointer-events:none}
.pp .tx-i:hover::after,.pp .tx-i:focus::after{opacity:1;visibility:visible;transform:translateY(0)}

/* --------------------------------------------------- attribution lead line */
.pp .tx-lead{font-family:'Source Serif 4',Georgia,serif;font-size:15px;line-height:1.75;color:var(--tx2);
	margin:0 0 20px;padding:0 0 18px;border-bottom:1px solid var(--rl)}
.pp .tx-lead strong{color:var(--nv);font-weight:600}

/* ------------------------------------------- benchmark / after-tax compare */
.pp .tx-cmp{margin:26px 0 0;padding:20px 0 0;border-top:1px solid var(--rl)}
.pp .tx-cmp-l{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx3);font-weight:700;margin:0 0 16px}
.pp .tx-cmp-row{display:flex;align-items:center;gap:16px;padding:7px 0}
.pp .tx-cmp-row .y{flex:0 0 78px;font-family:'Cormorant Garamond',Georgia,serif;font-size:16px;color:var(--nv)}
.pp .tx-cmp-row .bar{flex:1 1 auto;position:relative;height:7px;background:var(--cr2);display:block}
.pp .tx-cmp-row .bar i{position:absolute;inset:0 auto 0 0;background:var(--gd);display:block}
.pp .tx-cmp-row .p{flex:0 0 58px;text-align:right;font-size:12.5px;color:var(--tx2)}
.pp .tx-cmp-f{font-family:'Source Serif 4',Georgia,serif;font-size:12px;line-height:1.65;color:var(--tx3);margin:14px 0 0}

/* --------------------------------------------------------------- responsive */
@media(max-width:900px){
	.pp .tx-tiles{grid-template-columns:repeat(2,1fr)}
	.pp .tx-top{grid-template-columns:1fr}
	.pp .tx-top > div{border-right:none;border-bottom:1px solid var(--rl)}
	.pp .tx-top > div:last-child{border-bottom:none}
}
@media(max-width:600px){
	.pp .tx{padding:0 20px}
	.pp .tx-tiles{grid-template-columns:1fr}
	.pp .tx-res{padding:26px 20px 22px}
	.pp .tx-panel-h{padding:18px 20px 0}
	.pp .tx-panel-b{padding:16px 20px 22px}
	.pp .tx-tile .v{font-size:34px}
	.pp .tx-hz thead{display:none}
	.pp .tx-hz td{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px dotted var(--rl)}
	.pp .tx-hz td::before{content:attr(data-h);font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:var(--tx3);font-weight:700}
	.pp .tx-hz tr{display:block;padding:14px 0;border-bottom:1px solid var(--rl)}
	.pp .tx-hz td:first-child{font-size:22px;border-bottom:1px solid var(--rl);padding-bottom:12px}
	.pp .tx-hz td:first-child::before{content:''}
	.pp .tx-attr thead{display:none}
	.pp .tx-attr tr{display:block;padding:14px 0;border-bottom:1px solid var(--rl)}
	.pp .tx-attr td{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border:none}
	.pp .tx-attr td::before{content:attr(data-h);font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:var(--tx3);font-weight:700}
	.pp .tx-attr td:first-child::before{content:''}
	.pp .tx-attr td:first-child{display:block;font-size:16px;margin:0 0 4px}
	.pp .tx-bar{width:110px;margin:0}
	.pp .tx-i::after{width:min(268px,74vw)}
	.pp .tx-cmp-row{gap:11px}
	.pp .tx-cmp-row .y{flex:0 0 66px;font-size:15px}
	.pp .tx-cmp-row .p{flex:0 0 50px;font-size:12px}
	.pp .tx-lead{font-size:14.5px}
}
