:root{
--mxsb-w-navy: #0b1739;
--mxsb-w-primary: #0073e6;
--mxsb-w-border: #dce7f2;
--mxsb-w-soft: #f5f9ff;
--mxsb-w-muted: #667085;
--mxsb-w-white: #ffffff;
--mxsb-w-radius: 16px;
}

.mxsb-estimate{
display: flex;
flex-direction: column;
gap: 14px;
width: 100%;
margin: 22px 0;
padding: 20px;
border: 1px solid var(--mxsb-w-border);
border-radius: var(--mxsb-w-radius);
background: var(--mxsb-w-soft);
font-family: var(--mxsb-font-body, Arial, Helvetica, sans-serif);
}

.mxsb-estimate--zakladka{
margin: 0;
padding: 0;
border: 0;
background: none;
}

.mxsb-estimate--zakladka .mxsb-estimate__wynik{
border: 1px solid var(--mxsb-w-border);
}

.mxsb-estimate--zakladka .mxsb-estimate__pola,
.mxsb-estimate--zakladka .mxsb-estimate__wynik{
max-width: 760px;
}

.mxsb-estimate__head{
display: flex;
flex-direction: column;
gap: 4px;
}

.mxsb-estimate__title{
margin: 0;
color: var(--mxsb-w-navy);
font-size: 18px;
font-weight: 800;
line-height: 1.3;
}

.mxsb-estimate__lead{
margin: 0;
color: var(--mxsb-w-muted);
font-size: 13px;
line-height: 1.5;
}

.mxsb-estimate__pola{
display: flex;
flex-wrap: wrap;
gap: 10px;
}

.mxsb-estimate__pole{
display: flex;
flex: 1 1 130px;
flex-direction: column;
gap: 5px;
min-width: 0;
}

.mxsb-estimate__pole--waski{
flex: 0 1 110px;
}

.mxsb-estimate__pole span{
color: var(--mxsb-w-navy);
font-size: 12px;
font-weight: 700;
}

.mxsb-estimate__pole select,
.mxsb-estimate__pole input{
width: 100%;
padding: 11px 12px;
border: 1px solid var(--mxsb-w-border);
border-radius: 10px;
background: var(--mxsb-w-white);
color: var(--mxsb-w-navy);
font-family: inherit;
font-size: 15px;
font-weight: 700;
}

.mxsb-estimate__pole select:focus,
.mxsb-estimate__pole input:focus{
border-color: var(--mxsb-w-primary);
outline: none;
}

.mxsb-estimate__wynik{
display: flex;
flex-wrap: wrap;
gap: 14px;
padding: 14px 16px;
border-radius: 12px;
background: var(--mxsb-w-white);
}

.mxsb-estimate__kwoty,
.mxsb-estimate__termin{
display: flex;
flex-direction: column;
gap: 3px;
min-width: 0;
}

.mxsb-estimate__kwoty{
flex: 1 1 240px;
}

.mxsb-estimate__termin{
flex: 1 1 170px;
padding-left: 14px;
border-left: 1px solid var(--mxsb-w-border);
}

.mxsb-estimate__etykieta{
color: var(--mxsb-w-muted);
font-size: 11px;
font-weight: 800;
letter-spacing: .07em;
text-transform: uppercase;
}

.mxsb-estimate .mxsb-estimate__kwoty .mxsb-estimate__cena{
color: var(--mxsb-w-navy);
font-size: clamp(20px, 2.4vw, 26px);
font-weight: 800;
line-height: 1.2;
}

.mxsb-estimate .mxsb-estimate__kwoty .mxsb-estimate__zvat,
.mxsb-estimate .mxsb-estimate__kwoty .mxsb-estimate__sztuka{
color: var(--mxsb-w-muted);
font-size: 13px;
font-weight: 400;
line-height: 1.4;
}

.mxsb-estimate__termin strong{
color: var(--mxsb-w-navy);
font-size: 17px;
font-weight: 800;
line-height: 1.25;
}

.mxsb-estimate__termin-nota{
color: var(--mxsb-w-muted);
font-size: 12px;
}

.mxsb-estimate__uwaga{
margin: 0;
color: #8a5a00;
font-size: 12px;
line-height: 1.5;
}

.mxsb-estimate__uwaga:empty{
display: none;
}

.mxsb-estimate__akcje{
display: flex;
flex-wrap: wrap;
gap: 10px;
}

.mxsb-estimate__button{
padding: 12px 20px;
border: 1px solid var(--mxsb-w-primary);
border-radius: 999px;
background: var(--mxsb-w-white);
color: var(--mxsb-w-primary);
font-size: 14px;
font-weight: 700;
cursor: pointer;
transition: background 180ms ease, color 180ms ease;
}

.mxsb-estimate__button:hover{
background: var(--mxsb-w-primary);
color: var(--mxsb-w-white);
}

.mxsb-estimate__button.is-added{
border-color: #1f9d55;
background: #eafaf0;
color: #1f7a44;
}

.mxsb-estimate__nota{
margin: 0;
color: var(--mxsb-w-muted);
font-size: 11px;
line-height: 1.5;
}

@media (max-width: 560px){
.mxsb-estimate{
padding: 16px;
}

.mxsb-estimate__termin{
padding-left: 0;
border-left: 0;
border-top: 1px solid var(--mxsb-w-border);
padding-top: 12px;
}
}