.cash-choice{
display:flex;
gap:12px;
flex-wrap:wrap;
margin:14px 0 4px;
}

.percent-card.card-1{
--accent:#0f766e;
border-color:#b9ddd8;
border-top-color:#0f766e;
}

.percent-card.card-1 .card-num{
box-shadow:0 4px 10px rgba(15,118,110,.42);
}

.percent-card.card-1 .percent-input:focus{
border-color:#0f766e;
box-shadow:0 0 0 4px rgba(15,118,110,.14);
}

.percent-card.card-1 .percent-addon{
background:#dcefeb;
color:#0f766e;
}

.percent-card.card-1 .cash-choice label{
background:#f4faf9;
border-color:#cfe6e2;
color:#315f57;
}

body .percent-card.card-1 .result-coffee.result-coffee{
background:#f7fbfa;
border:1px solid #b9d9d3;
border-top:4px solid #0f766e;
color:#29433e;
box-shadow:none;
}

.percent-field,
.percent-input-wrap,
.percent-input{
min-width:0;
}

.percent-input-wrap .percent-input{
flex:1 1 0;
width:auto;
}

.percent-input-wrap .percent-addon{
flex:0 0 auto;
}

.cash-choice label{
display:flex;
align-items:center;
gap:8px;
padding:12px 14px;
background:#f8fbff;
border:1px solid #dceeff;
border-radius:14px;
font-size:1.05rem;
font-weight:800;
color:#1e3a8a;
cursor:pointer;
}

.cash-choice input{
width:auto;
height:auto;
}

.cash-result-wrap{
display:grid;
grid-template-columns:1fr;
gap:16px;
text-align:left;
}

.cash-summary-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:14px;
}

.cash-summary-card{
display:flex;
flex-direction:column;
min-width:0;
min-height:154px;
padding:20px;
border:1px solid;
border-top-width:4px;
border-radius:16px;
box-shadow:0 8px 20px rgba(16,24,40,.05);
}

.cash-summary-cash{
background:#0f766e;
border-color:#0f766e;
border-top-color:#0f766e;
color:#f0fdfa;
}

.cash-summary-installment{
background:#edf8f5;
border-color:#add8cd;
border-top-color:#0f766e;
color:#126b61;
}

.cash-summary-extra{
background:#fff8ed;
border-color:#efd2a8;
border-top-color:#b66a16;
color:#8a4d0f;
}

.cash-summary-label{
display:block;
font-size:1.08rem;
line-height:1.45;
font-weight:900;
color:inherit;
}

.cash-summary-value{
display:block;
font-size:1.8rem;
line-height:1.2;
font-weight:900;
margin:10px 0 8px;
overflow-wrap:anywhere;
}

.cash-summary-cash .cash-summary-value{
color:#fff;
}

.cash-summary-installment .cash-summary-value{
color:#0f766e;
}

.cash-summary-extra .cash-summary-value{
color:#a9570a;
}

.cash-summary-note,
.cash-summary-percent{
display:block;
font-size:1rem;
line-height:1.6;
font-weight:600;
color:#667085;
margin-top:auto;
}

.cash-summary-cash .cash-summary-note{
color:#d9f2ed;
}

.cash-summary-installment .cash-summary-note{
color:#4f756e;
}

.cash-summary-percent{
color:#9a5814;
font-weight:800;
}

.cash-table{
width:100%;
border-collapse:collapse;
margin-top:4px;
table-layout:fixed;
}

.cash-table td{
padding:11px 8px;
border-bottom:1px solid #edf2f7;
font-size:1.08rem;
line-height:1.55;
color:#344054;
}

.cash-table td:last-child{
text-align:right;
font-weight:900;
color:#101828;
}

.cash-table td{
overflow-wrap:anywhere;
}

.cash-table-extra td{
background:#fff3df;
color:#7c430e;
}

.cash-badge{
display:inline-block;
padding:7px 12px;
border-radius:999px;
font-size:1rem;
line-height:1.3;
font-weight:900;
margin-top:8px;
}

.cash-good{
background:#ecfdf3;
color:#16a34a;
}

.cash-normal{
background:#fffbeb;
color:#d97706;
}

.cash-bad{
background:#fff1f2;
color:#e11d48;
}

.cash-danger{
background:#fdf2f8;
color:#be123c;
}

.cash-note{
display:block;
font-size:1.05rem;
line-height:1.85;
font-weight:500;
color:#475467;
background:#fff;
border:1px solid #e8edf5;
border-radius:16px;
padding:14px;
}

.cash-note b{
color:#0f766e;
font-weight:900;
}

@media(max-width:768px){

.cash-summary-grid{
grid-template-columns:1fr;
gap:12px;
}

.cash-summary-card{
min-height:0;
padding:17px;
}

.cash-summary-label{
font-size:1.05rem;
}

.cash-summary-value{
font-size:1.72rem;
}

.cash-summary-note,
.cash-summary-percent{
font-size:1rem;
}

.cash-choice{
display:grid;
grid-template-columns:1fr;
gap:10px;
}

.cash-choice label{
font-size:1.08rem;
padding:14px;
}

.cash-table td{
font-size:1.02rem;
line-height:1.55;
padding:10px 4px;
}

.cash-note{
font-size:1rem;
line-height:1.75;
padding:13px 10px;
}

.cash-badge{
font-size:.98rem;
}

}
