@charset "utf-8";
*:focus {
	outline:0
}
html, body {
	margin: 0;
	padding: 0;
	background-color:#eaeaea;
	background-repeat:repeat;
	background-attachment:fixed;
	-webkit-text-size-adjust:100%;
	-ms-text-size-adjust: none;
	 font-family:'ToyotaType-Book';
		font-weight:normal;
	font-size:14px;
	color:#282830;
	height:100%;
	min-height:100%;
	width:100%;
	font-style:normal;
	text-align:left;	
}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, q, small, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border:0;
	margin:0;
	padding:0;
}

ol, ul {
	list-style:none
}
article, aside, img, figure, figure img, figcaption, hgroup, footer, header, nav, section, video, object, small {
	display:block
}
a img {
	border:0
}
figure {
	position:relative
}
figure img {
	width:100%
}

input button {
    -webkit-appearance: none;
    border-radius: 0;
}


.InnehallRadBild img,object,embed{max-width:100%}img{height:auto}
.InnehallRadBild2 img,object,embed{max-width:100%}img{height:auto}
#StorBilBildInne img,object,embed{max-width:100%}img{height:auto}



/*************** TYPOGRAFI ***************/


pre, p, P { 

	margin-bottom:14px;

}

h1 {
	font-size:38px;
	line-height:40px;
	margin:0;
	margin-bottom: 10px;
	letter-spacing:-0.02em;
	font-weight:normal;
	text-transform:uppercase;
	font-family: ToyotaType-Book;
	
}

h2 {
	font-size:25px;
	line-height:30px;
	margin:0;
	margin-bottom: 15px;
	letter-spacing:0em;
	font-weight:normal;
	text-transform:uppercase;
	font-family: ToyotaType-Regular;


}

h3 {
	font-size:20px;
	line-height:23px;
	margin:0;
	padding:0;
		font-weight:700;
	margin-bottom: 14px;
	letter-spacing:0em;
	text-transform:uppercase;
font-family: ToyotaType-Regular;

}

h4 {
	font-size:15px;
	line-height:18px;
	margin:0;
	font-family: ToyotaType-Regular;
	margin-bottom: 10px;
	letter-spacing:0.04em;
	font-weight:normal;
	text-transform:uppercase;

}


.clear { clear:both; }

/*************** LÄNKAR ***************/

a.Ljuslank, a.Ljuslank:link, a.Ljuslank:visited {
	color:#fff;
	text-decoration:none;
}
a.Ljuslank:hover {
	color: #FFF;
	text-decoration:underline;
}


a:link, a:visited, a:active {
	color:#333;
	text-decoration:none;
}

a:hover {
	color: #cc1124;
	text-decoration:underline;
}


/*************** STRUKTUR ***************/



.InnehallRad {
	width:100%;
	float:left;
	border:solid 1px #eaeaea;
	background-color:#FFF;
	padding-top:15px;
	padding-bottom:15px;
	
}

.InnehallRad:hover {
	background-color:#f6f6f6;
	
}

#BilBild {
	 transition: all .2s ease-in-out;
 -moz-transition: all .2s ease-in-out;
 -webkit-transition: all .2s ease-in-out;
 -o-transition:   all .2s ease-in-out; /* For IE8 and earlier */
}


.InnehallRadMarginal { padding-left:20px; padding-right:20px; }
.InnehallRadMarginal2 { padding-left:5px; padding-right:25px; }

.InnehallRadBild { max-width:70px; width:25%; float:left; }
.InnehallRadBild2 { max-width:120px; width:25%; float:left; }

.InnehallRadNamn { width:75%; float:left; line-height:18px; padding-top:20px; }

.InnehallRadNamnMarginal { padding-left:20px; }


#InnehallHallare {
	width:100%;
	float:left;
	padding-bottom:50px;
	
}

#InnehallRubrikHallare {
	width:100%;
	float:left;
	margin-top:40px;
	margin-bottom:15px;
	
}

#InnehallRubrikHallare h1 {
	font-family: 'ToyotaType-Book';
	    font-size: 48px;
    line-height: 50px;
}

#StorBilBild {
	width:100%;
	float:left;
	text-align:center;

	
}

#StorBilBildInne {
	width:100%;
	max-width:770px;
	margin-left:-20px;
	display:inline-block;
	min-height: 350px;
}


.TillbakaHallare {
	width:100%;
	float:left;
	margin-top:0px;

	font-size: 16px;
	margin-bottom:0px;


	
}


.TillbehorRad {
	width:100%;
	float:left;
	margin-bottom:4px;
	color:#999;
	
}

#PilarHallare {
	width:100%;
	float:left;
	text-align:center;
	margin-top:-12px;
	position:relative;
	z-index:9999;
	
}


#PilarHallareInnne {
	width:auto;
	display:inline-block;
	
}


a.PilVanster, a.PilVanster:visited {
	width:30px;
	line-height:30px;
	padding-top:8px;
	padding-bottom:8px;
	padding-left:40px;
	padding-right:20px;
	color:#333;
	background-image:url(Grafik/RoteraIkon.png);

	background-repeat:no-repeat;
	background-position:12px center;
	background-size:20px auto;
	
 text-decoration:none;

 
 -moz-border-radius-bottomleft: 7px;
border-bottom-left-radius: 7px;
 -moz-border-radius-topleft: 7px;
border-top-left-radius: 7px;


 
 -moz-border-radius-bottomright: 7px;
border-bottom-right-radius: 7px;
 -moz-border-radius-topright: 7px;
border-top-right-radius: 7px;

border:solid 1px #b5b5b5;
border-bottom:solid 2px #b5b5b5;
background-color:#FFF;
	
}

a.PilVanster:hover {

	background-color:#f2f2f2;
	

}

a.PilVanster:active {
	-webkit-box-shadow: inset 2px 2px 3px 0px rgba(0,0,0,0.21);
	-moz-box-shadow: inset 2px 2px 3px 0px rgba(0,0,0,0.21);
	box-shadow: inset 2px 2px 3px 0px rgba(0,0,0,0.21);
	background-color:#D8D8D8;

}



a.PilHoger, a.PilHoger:visited {
	width:30px;
	line-height:30px;
	padding-top:8px;
	padding-bottom:8px;
	padding-left:20px;
	padding-right:20px;
	background-image:url(Grafik/PilHoger.png);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:10px auto;
	 transition: all .1s ease-in-out;
 -moz-transition: all .1s ease-in-out;
 -webkit-transition: all .1s ease-in-out;
 text-decoration:none;
 -o-transition:   all .1s ease-in-out; /* For IE8 and earlier */
 
 -moz-border-radius-bottomright: 7px;
border-bottom-right-radius: 7px;
 -moz-border-radius-topright: 7px;
border-top-right-radius: 7px;
border:solid 1px #b5b5b5;
border-bottom:solid 2px #b5b5b5;
background-color:#FFF;
margin-left:-1px;
	
}

a.PilHoger:hover {
	background-color:#eaeaea;
		
}

a.PilHoger:active {
-webkit-box-shadow: inset 2px 2px 3px 0px rgba(0,0,0,0.21);
-moz-box-shadow: inset 2px 2px 3px 0px rgba(0,0,0,0.21);
box-shadow: inset 2px 2px 3px 0px rgba(0,0,0,0.21);	
	 transition: all .0s ease-in-out;
 -moz-transition: all .0s ease-in-out;
 -webkit-transition: all .0s ease-in-out;
 -o-transition:   all .0s ease-in-out; /* For IE8 and earlier */
 background-position:18px center;
}


#FargValHallare {

	border-bottom:solid 1px #b3b3b3;
	width:100%;
	float:left;
	padding-top:35px;
	padding-bottom:15px;
	text-align:center;
	
}


.FargRutaHallare {
	width:48px;
	height:48px;
	line-height:48px;
	border:solid 1px #fff;
	-webkit-border-radius:5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	display: none;
	
}

a.FargRuta, a.FargRuta:visited, a.FargRuta:active {
	width:44px;
	height:44px;
	line-height:44px;
	border-radius: 999px;
	display:inline-block;
	border:solid 2px transparent;
	margin-right:10px;
	margin-bottom:10px;
	position:relative;
	top:0px;
	 transition: all .2s ease-in-out;
	/*box-shadow:0 0px 5px rgba(0, 0, 0, .2);*/
	border: solid 1px #777;
    box-sizing: border-box;
}

a.FargRuta:hover {
border:solid 1px #000;
text-decoration:none;

}


.FargAktiv  {
	
/*top:-8px !important;*/
	margin-left:0px !important;
	
	border:solid 2px #000 !important;
	box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 1) inset !important;
}



.Marginal {
	padding-left:100px;
	padding-right:100px;
	max-width:1150px;
	position:relative;
	right:0;
	margin: 0 auto;
	margin-top: 0px;
}


/************ Skicka-knappen ************/
.SkickaKnapp {
	width:auto;
	line-height:30px;
	padding-top:3px;
	padding-bottom:3px;
	padding-left:30px;
	padding-right:30px;
	color:#333;
	font-size:15px;
	text-transform:uppercase;

	
	
 text-decoration:none;

 
 -moz-border-radius-bottomleft: 7px;
border-bottom-left-radius: 7px;
 -moz-border-radius-topleft: 7px;
border-top-left-radius: 7px;


 
 -moz-border-radius-bottomright: 7px;
border-bottom-right-radius: 7px;
 -moz-border-radius-topright: 7px;
border-top-right-radius: 7px;

border:solid 1px #b5b5b5;
border-bottom:solid 2px #b5b5b5;
background-color:#FFF;
	  font-family: 'ToyotaDisplay-Bold';
                }
                
.SkickaKnapp:hover, .SkickaKnapp:active {
		background-color:#f2f2f2;
			
} 





a.LaddaKnapp, a.LaddaKnapp:visited, a.LaddaKnapp:active {
	width:auto;
	line-height:30px;
	padding-top:3px;
	padding-bottom:3px;
	padding-left:30px;
	padding-right:30px;
	color:#333;
	font-size:15px;
	text-transform:uppercase;

	
	
 text-decoration:none;

background-color:#f02;
color:#fff;
text-align:center;
padding:15px;
padding-left:30px;
padding-right:30px;


                }
                
a.LaddaKnapp:hover {
		background-color:#d90022;
			
} 



.FormularEnRad {
	
	
	background-color:#fff;
	background-repeat:repeat;
	background-position:left top;
	width:200px;
	line-height:30px;
	padding-top:3px;
	padding-bottom:3px;
	font-size:14px;
	vertical-align:middle;
	padding-left:10px;
border:solid 1px #d4d4d4;
	font-weight:normal;
	font-style:normal;
	outline: none;

	float:left;
	margin:0;
	margin-bottom:0px;
	margin-right:4px;
	
	 
 -moz-border-radius-bottomleft: 7px;
border-bottom-left-radius: 7px;
 -moz-border-radius-topleft: 7px;
border-top-left-radius: 7px;


 
 -moz-border-radius-bottomright: 7px;
border-bottom-right-radius: 7px;
 -moz-border-radius-topright: 7px;
border-top-right-radius: 7px;


}

.FormularEnRad:hover, .FormularEnRad:focus {

	border:solid 1px #b5b5b5;
}








@font-face {
    font-family: ToyotaType-Semibold;
    src: url(fonts/ToyotaType-Semibold.eot);
    src: url(fonts/ToyotaType-Semibold.eot?#iefix) format("embedded-opentype"),url(fonts/ToyotaType-Semibold.otf) format("opentype"),url(fonts/ToyotaType-Semibold.woff) format("woff"),url(fonts/ToyotaType-Semibold.ttf) format("truetype"),url(fonts/ToyotaType-Semibold.svg#ToyotaType-Regular) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: ToyotaType-Regular;
    src: url(fonts/ToyotaType-Regular.eot);
    src: url(fonts/ToyotaType-Regular.eot?#iefix) format("embedded-opentype"),url(fonts/ToyotaType-Regular.otf) format("opentype"),url(fonts/ToyotaType-Regular.woff) format("woff"),url(fonts/ToyotaType-Regular.ttf) format("truetype"),url(fonts/ToyotaType-Regular.svg#ToyotaType-Regular) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: ToyotaType-Book;
    src: url(fonts/ToyotaType-Book.eot);
    src: url(fonts/ToyotaType-Book.eot?#iefix) format("embedded-opentype"),url(fonts/ToyotaType-Book.otf) format("opentype"),url(fonts/ToyotaType-Book.woff) format("woff"),url(fonts/ToyotaType-Book.ttf) format("truetype"),url(fonts/ToyotaType-Book.svg#ToyotaType-Book) format("svg");
    font-weight: 300;
    font-style: normal
}








/*************** MODELLER - NY STARTSIDA ***************/

.ModelHeader {
    display:flex;
    align-items:center;
    gap:12px;
}

.ModelHeader h1 {
    margin:0;
    font-size:44px;
    line-height:52px;
    letter-spacing:-0.02em;
}

.ModelBack,
.ModelBack:link,
.ModelBack:visited,
.ModelBack:active {
    width:40px;
    height:40px;
    line-height:34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#9b9b9b;
    color:#fff;
    border-radius:3px;
    font-size:58px;
    font-family:Arial, Helvetica, sans-serif;
    font-weight:normal;
    text-decoration:none;
    overflow:hidden;
    padding-bottom:6px;
    box-sizing:border-box;
}

.ModelBack:hover {
    background:#777;
    color:#fff;
    text-decoration:none;
}

.ModelFilters {
    width:100%;
    float:left;
    margin-top:8px;
}

.ModelFilterRow {
    display:grid;
    grid-template-columns:1fr 1fr 1fr 1fr;
    gap:18px;
    width:100%;
    margin-bottom:14px;
}

.ModelFilterRow--top {
    grid-template-columns:1fr 1fr 1fr 1fr;
    justify-content:end;
}

.ModelFilterRow--top .ModelFilterField {
    grid-column:4;
}

.ModelFilterField label {
    display:block;
    font-size:14px;
    line-height:18px;
    margin-bottom:5px;
    color:#333;
}

.ModelFilterField select {
    width:100%;
    height:32px;
    line-height:32px;
    border:solid 1px #cfcfcf;
    background:#fff;
    color:#666;
    padding:0 12px;
    font-size:15px;
    border-radius:2px;
    box-sizing:border-box;
}

.ModelActiveFilters {
    width:100%;
    float:left;
    margin-top:4px;
    margin-bottom:6px;
    font-size:13px;
    line-height:22px;
}

.ModelActiveFilters strong,
.ModelActiveFilters span {
    display:block;
}

.ModelSortRow {
    width:100%;
    float:left;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:18px;
    border-bottom:solid 1px #d0d0d0;
    padding-bottom:10px;
    margin-top:18px;
    margin-bottom:20px;
    font-size:13px;
}

.ModelSortRow a,
.ModelSortRow a:link,
.ModelSortRow a:visited {
    color:#333;
    text-decoration:none;
}

.ModelSortRow a:hover {
    color:#cc1124;
    text-decoration:none;
}

.ModelGrid {
    width:100%;
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    column-gap:20px;
    row-gap:34px;
}

.ModelCard,
.ModelCard:link,
.ModelCard:visited,
.ModelCard:active {
    display:block;
    background:#fff;
    color:#333;
    text-decoration:none;
    transition:transform .16s ease, opacity .16s ease;
	padding:20px;
	box-shadow: rgba(0, 0, 0, 0.02) 0px 0.67932px 3.62304px 0px, rgba(0, 0, 0, 0.03) 0px 1.87823px 10.0172px 0px, rgba(0, 0, 0, 0.05) 0px 4.52206px 24.1177px 0px, rgba(0, 0, 0, 0.04) 0px 15px 80px 0px;
	border: solid 1px transparent;
box-sizing: border-box;
}

.ModelCard:hover {
    text-decoration:none;

	border-color: #282830cc;
}

.ModelCard[style*="display: none"] {
    transform:none;
}

.ModelCard__image {
    width:100%;
    aspect-ratio: 16 / 9;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}

.ModelCard__image img {
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
}

.ModelCard__content {
    padding-top:8px;
	min-height: 120px;
}

.ModelCard__content h2 {
    font-family: ToyotaType-Semibold;
    font-size:22px;
    line-height:28px;
    font-weight:700;
    text-transform:none;
    letter-spacing:0;
    margin:0 0 5px 0;
}

.ModelCard--grade h2 {
	    font-size:18px;
    line-height:26px;
}

.ModelCard__content p {
    margin:0 0 3px 0;
    font-size:14px;
    line-height:20px;
    color:#333;
}

.ModelCard__cta {
    display:inline-block;
    margin-top:8px;
    font-size:13px;
    line-height:18px;
    font-weight:700;
    color:#333;
	display: inline-block;
    margin-top: 8px;
    font-size: 15px;
    line-height: 18px;
    font-weight: 700;
    color: #ffffff;
    width: 100%;
    background-color: #282830;
    height: 50px;
    line-height: 50px;
    text-align: center;
}

.ModelCard:hover .ModelCard__cta {
    color:#cc1124;
	color:#fff;
	background-color:#282830cc;
}

.ModelNotice {
    width:100%;
    float:left;
    background:#fff;
    border:1px solid #ddd;
    padding:18px;
    box-sizing:border-box;
}

@media screen and (max-width: 980px) {
    .Marginal {
        padding-left:25px;
        padding-right:25px;
    }

    .ModelFilterRow,
    .ModelFilterRow--top {
        grid-template-columns:1fr 1fr;
    }

    .ModelFilterRow--top .ModelFilterField {
        grid-column:auto;
    }

    .ModelGrid {
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 620px) {
    .Marginal {
        padding-left:16px;
        padding-right:16px;
    }

    .ModelHeader h1 {
        font-size:30px;
        line-height:36px;
    }

    .ModelFilterRow,
    .ModelFilterRow--top {
        grid-template-columns:1fr;
        gap:10px;
    }

    .ModelSortRow {
        justify-content:flex-start;
        flex-wrap:wrap;
        gap:12px;
    }

    .ModelGrid {
        grid-template-columns:1fr;
        row-gap:28px;
    }
}

/*************** MODELLER - SELECTSTYRD UTRUSTNINGSNIVÅ ***************/

.ModelFilterRow--single {
    grid-template-columns:minmax(240px, 360px) minmax(220px, 320px);
    align-items:end;
    margin-bottom:10px;
}

.ModelSelectedTitle {
    width:100%;
    margin-bottom:18px;
}

.ModelSelectedTitle h2 {
     font-family: 'ToyotaType-Regular';
    font-size:40px;
    line-height:50px;
    font-weight:normal;
    text-transform:none;
    letter-spacing:-0.02em;
    margin:0 0 10px 0;
}

.ModelSelectedTitle p {
    margin:0;
    color:#282830;
    font-size:16px;
    line-height:16px;
	margin-bottom: 30px;
}

.ModelCard--grade .ModelCard__content p {
    min-height:0;
}

@media screen and (max-width: 980px) {
    .ModelFilterRow--single {
        grid-template-columns:1fr;
    }
}

/* Modellbilder hämtas via första utrustningsnivån */
.ModelCard__image img.js-model-image.is-loading {
    opacity:.35;
}

.ModelCard__image img.js-model-image.has-no-image {
    opacity:.08;
}

/*************** FILTERS - MÄRKE, MODELL, KATEGORI ***************/

.ModelFilterRow--three {
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:18px;
    width:100%;
    margin-bottom:14px;
}

.ModelActiveFilters {
    width:100%;
    float:left;
    margin-top:8px;
    margin-bottom:12px;
    font-size:13px;
    line-height:22px;
}

.ModelActiveFilters strong {
    display:block;
    font-size:15px;
    line-height:20px;
    margin-bottom:8px;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
}

.ActiveFilterChips {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.ActiveFilterChip {
    appearance:none;
    -webkit-appearance:none;
    border:0;
    background:#282830;
    color:#fff;
    border-radius:0;
    padding:11px 16px;
  font-family: ToyotaType-Regular, Arial, sans-serif;
    font-size: 15px;
    line-height: 40px;
    cursor: pointer;
    border-radius: 99px;
    height: 40px;
    align-items: unset;
    padding: 0px;
    padding-left: 20px;
    padding-right: 20px;
	
	
}

.ActiveFilterChip span {
    display:inline-block;
    margin-left:4px;
    font-size:18px;
    line-height:16px;
    position:relative;
    top:1px;
}

.ActiveFilterChip:hover {
    background:#8f8f8f;
}

.ModelCard[data-meta-loaded="0"] .js-model-category,
.ModelCard[data-meta-loaded="0"] .js-model-listprice {
    color:#888;
}

@media only screen and (max-width: 800px) {
    .ModelFilterRow--three {
        grid-template-columns:1fr;
        gap:10px;
    }
}

/*************** SORTERING ***************/
.ModelSortButton {
    appearance:none;
    -webkit-appearance:none;
    border:0;
    background:transparent;
    color:#333;
    padding:0;
    margin:0;
    font:inherit;
    cursor:pointer;
    text-decoration:none;
}

.ModelSortButton:hover,
.ModelSortButton.is-active {
    color:#cc1124;
}

.ModelSortArrow {
    display:inline-block;
    min-width:10px;
    margin-left:3px;
}

/*************** MULTISELECT FILTERS ***************/
.MultiSelect {
    position:relative;
    width:100%;
    z-index:20;
}

.MultiSelect.is-open {
    z-index:60;
}

.MultiSelect__button {
    appearance:none;
    -webkit-appearance:none;
    width:100%;
    height:40px;
    min-height:40px;
    border:solid 1px #cfcfcf;
    background:#fff;
    color:#333;
    padding:0 72px 0 12px;
    font-family:ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif;
    font-size:16px;
    line-height:38px;
    border-radius:2px;
    box-sizing:border-box;
    text-align:left;
    cursor:pointer;
    position:relative;
}

.MultiSelect.has-value .MultiSelect__button,
.MultiSelect.is-open .MultiSelect__button {
    border-color:#78be43;
    box-shadow:0 0 0 1px #78be43 inset;
}

.MultiSelect__text {
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.MultiSelect__clear,
.MultiSelect__arrow {
    position:absolute;
    top:0;
    height:38px;
    line-height:38px;
    color:#666;
    text-align:center;
}

.MultiSelect__clear {
    right:44px;
    width:26px;
    font-size:28px;
    display:none;
}

.MultiSelect__clear:hover {
    color:#222;
}

.MultiSelect__arrow {
    right:0;
    width:42px;
    font-size:28px;
    border-left:solid 1px #d7d7d7;
    transform:translateY(-2px);
}

.MultiSelect.is-open .MultiSelect__arrow {
    transform:translateY(1px) rotate(180deg);
}

.MultiSelect__panel {
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:calc(100% + 6px);
    max-height:330px;
    overflow:auto;
    background:#fff;
    border:solid 1px #cfcfcf;
    border-radius:4px;
    box-shadow:0 10px 24px rgba(0,0,0,.12);
    padding:6px 0;
    box-sizing:border-box;
}

.MultiSelect.is-open .MultiSelect__panel {
    display:block;
}

.MultiSelect__option {
    display:flex;
    align-items:center;
    gap:10px;
    padding:13px 14px;
    font-family:ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif;
    font-size:17px;
    line-height:22px;
    color:#111;
    cursor:pointer;
    box-sizing:border-box;
}

.MultiSelect__option:hover {
    background:#f3f8ec;
}

.MultiSelect__option:has(input:checked) {
    background:#eaf3dd;
}

.MultiSelect__option input[type="checkbox"] {
    width:18px;
    height:18px;
    margin:0;
    accent-color:#78be43;
    flex:0 0 auto;
}

.MultiSelect__option input[type="checkbox"]:disabled + span {
    color:#aaa;
}

.MultiSelect__option[style*="display: none"] {
    display:none !important;
}

/*************** MULTISELECT FILTERS - POLISH FIX ***************/
/* Fixar pilarna, linjering och checkbox-raderna i multiselect-filter */
.MultiSelect__button {
    display:flex;
    align-items:center;
    height:40px;
    line-height:normal;
    padding:0 86px 0 12px;
}

.MultiSelect__text {
    flex:1 1 auto;
    min-width:0;
    line-height:40px;
}

.MultiSelect__clear,
.MultiSelect__arrow {
    top:0;
    bottom:0;
    height:auto;
    line-height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.MultiSelect__clear {
    right:46px;
    width:34px;
    font-size:28px;
    line-height:1;
}

.MultiSelect__arrow {
    right:0;
    width:48px;
    font-size:0;
    border-left:solid 1px #e1e1e1;
    transform:none;
}

.MultiSelect__arrow::before {
    content:"";
    width:12px;
    height:12px;
    border-right:solid 3px #666;
    border-bottom:solid 3px #666;
    transform:rotate(45deg) translateY(-3px);
    box-sizing:border-box;
}

.MultiSelect.is-open .MultiSelect__arrow {
    transform:none;
}

.MultiSelect.is-open .MultiSelect__arrow::before {
    transform:rotate(225deg) translateY(-3px);
}

.MultiSelect__panel {
    padding:0px 0;
}

.MultiSelect__option {
    display:grid;
    grid-template-columns:28px minmax(0, 1fr);
    align-items:center;
    column-gap:12px;
    min-height:48px;
    padding:11px 16px;
    margin:0 !important;
    line-height:22px;
}

.MultiSelect__option input[type="checkbox"] {
    width:22px;
    height:22px;
    margin:0;
    justify-self:start;
    align-self:center;
}

.MultiSelect__option span {
    display:block;
    line-height:22px;
    margin:0;
    padding:0;
}

@media (max-width: 700px) {
    .MultiSelect__button {
        height:44px;
        padding-right:86px;
    }
    .MultiSelect__text,
    .MultiSelect__clear,
    .MultiSelect__arrow {
        line-height:44px;
    }
}


/*************** MULTISELECT FILTERS - ARROW + CHECKBOX ALIGN FIX ***************/
/* Pilen behåller samma riktning både stängd och öppen. */
.MultiSelect__arrow::before {
    border-right-color:#8a8a8a;
    border-bottom-color:#8a8a8a;
    transform:rotate(45deg) translateY(-3px) !important;
}

.MultiSelect.is-open .MultiSelect__arrow::before {
    border-right-color:#282830;
    border-bottom-color:#282830;
    transform:rotate(45deg) translateY(-3px) !important;
}

.MultiSelect.is-open .MultiSelect__arrow {
    transform:none !important;
}

/* Använd flex i dropdown-raderna så att texten alltid hamnar bredvid checkboxen,
   även när HTML:en innehåller whitespace mellan input och span. */
.MultiSelect__option {
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    min-height:48px;
    padding:11px 16px;
    margin:0 !important;
    line-height:22px;
}

.MultiSelect__option input[type="checkbox"] {
    flex:0 0 22px !important;
    width:22px;
    height:22px;
    margin:0 !important;
}

.MultiSelect__option span {
    flex:1 1 auto;
    min-width:0;
    display:block;
    line-height:22px;
    margin:0 !important;
    padding:0 !important;
}

/*************** TILLVAL + TCO-FORMULÄR ***************/

.TillvalSubTitle {
    width:100%;
    color:#666;
    margin-top:-16px;
    margin-bottom:20px;
    float:left;
    font-size:16px;
    line-height:24px;
	display: none;
}

.TcoFormBlock {
    width:100%;
    float:left;
    margin-top:45px;
    margin-bottom:70px;
    background:#fff;
    padding:34px;
    box-sizing:border-box;
    border-radius:2px;
    box-shadow:0 12px 35px rgba(0,0,0,.06);
}

.TcoFormBlock h2 {
    margin-bottom:6px;
}

.TcoIntro {
    color:#666;
    font-size:15px;
    line-height:23px;
    max-width:760px;
    margin-bottom:22px;
}

.TcoForm fieldset {
    border:0;
    border-top:1px solid #e2e2e2;
    margin:24px 0 0;
    padding:22px 0 0;
}

.TcoForm legend {
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:18px;
    line-height:22px;
    padding-right:14px;
    color:#282830;
}

.TcoGrid {
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:18px;
}

.TcoGrid--two {
    grid-template-columns:repeat(2, minmax(0, 1fr));
}

.TcoForm label {
   /* display:block;*/
    font-family:'ToyotaType-Book', Arial, sans-serif;
    font-size:16px;
    line-height:18px;
    margin-bottom:0px;
    color:#333;
}

.TcoForm input,
.TcoForm textarea {
    width:100%;
    box-sizing:border-box;
    border:1px solid #cfcfcf;
    background:#fff;
    color:#333;
    padding:10px 12px;
    font-size:15px;
    line-height:20px;
    border-radius:2px;
    font-family:ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif;
}

.TcoForm textarea {
    min-height:120px;
    resize:vertical;
}

.TcoForm input:focus,
.TcoForm textarea:focus {
    border-color:#282830;
}

.TcoActions {
    margin-top:26px;
    display:flex;
    align-items:center;
    gap:16px;
}

.TcoActions button {
    border:0;
    background:#e60012;
    color:#fff;
    padding:14px 28px;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:15px;
    line-height:20px;
    cursor:pointer;
    border-radius:2px;
}

.TcoActions button:hover {
    background:#c90010;
}

.TcoActions span {
    color:#777;
    font-size:13px;
}

@media only screen and (max-width: 900px) {
    .TcoGrid,
    .TcoGrid--two {
        grid-template-columns:1fr;
    }

    .TcoFormBlock {
        padding:22px;
    }

    .TcoActions {
       /* align-items:flex-start;
        flex-direction:column;*/
    }
}

/*************** TILLVAL - TWO COLUMN CALCULATOR V2 ***************/
.TillvalPage .Marginal.TillvalLayout {
  /*  max-width:1280px;*/
    display:grid;
    grid-template-columns:minmax(360px, 43%) minmax(420px, 57%);
    gap:56px;
    align-items:start;
    padding-top:48px;
}

.TillvalLeft,
.TillvalRight {
    min-width:0;
}

.TillvalSticky {
    position:sticky;
    top:78px;
    padding-bottom:30px;
}

.TillvalHeader#InnehallRubrikHallare {
    float:none;
    width:auto;
    margin:0 0 8px 0;
}

.TillvalHeader#InnehallRubrikHallare h1 {
    font-size:48px;
    line-height:58px;
    margin:0 0 25px 0;
	font-family: 'ToyotaType-Regular','ToyotaType-Book';
	text-transform: none;
 

}

.TillvalGradePicker {
    width:100%;
    margin:8px 0 10px 0;
}

.TillvalGradePicker label {
    display:block;
    font-family:ToyotaType-Book, Arial, sans-serif;
    font-size:15px;
    line-height:20px;
    margin-bottom:10px;
    color:#333;
	display: none;

}

.TillvalGradeSelect {
    width:100%;
    max-height:50px;
	border: solid 1px transparent;
  
    background:#ffff;
    color:#282830;
    padding:11px 42px 11px 15px;
    font-family:'ToyotaType-Book', Arial, sans-serif;
    font-size:16px;
    line-height:24px;
    border-radius:2px;
    box-sizing:border-box;
	margin-bottom: 20px;
	 transition: all .1s ease-in-out;
	box-shadow: 0 0px 10px rgba(0, 0, 0, .08);
	 appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    background-image: url("data:image/svg+xml,%3Csvg width='12' height='7' viewBox='0 0 12 7' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23282830' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 12px 7px;
}

.TillvalGradeSelect:hover {
	border:1px solid #282830;
	background-color: #fff;

}

.TillvalSubTitle {
    float:none;
    width:auto;
    margin:0 0 28px 0;
    color:#333;
    font-size:18px;
    line-height:26px;
}

.TillvalPage #StorBilBild {
    float:none;
    width:100%;
    text-align:left;
}

.TillvalPage #StorBilBildInne {
    width:100%;
    max-width:none;
    min-height:0;
    margin-left:0;
    display:block;
    text-align:center;
	min-height: 200px;
}

.TillvalPage #BilBild {
    width:100%;
    max-width:770px;
    display:block;
    margin:0 auto;
}

.TillvalPage #PilarHallare {
    float:none;
    margin-top:6px;
}

.TillvalLeft #FargValHallare,
.TillvalColours {
    float:none;
    width:100%;
    border-bottom:0;
    /*padding:30px 0 0 0;*/
    text-align:center;
}

.TillvalColourInner {
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px;
}

.TillvalPage a.FargRuta,
.TillvalPage a.FargRuta:visited,
.TillvalPage a.FargRuta:active {
    margin:0;
}

.TillvalSelectedColour {
    margin-top:18px;
    color:#333;
    font-size:15px;
    line-height:22px;
}

.TcoFormBlock--side {
    float:none;
    width:100%;
    margin:0 0 70px 0;
    padding:46px 48px;
    border-radius:0;
    box-shadow:0 15px 80px rgba(0,0,0,.08);
}

.TcoFormBlock--side h2 {
    font-family:'ToyotaType-Semibold',ToyotaType-Regular, Arial, sans-serif;
    font-size:25px;
    line-height:30px;
    text-transform:uppercase;
    letter-spacing:.01em;
    margin:0 0 26px 0;
}

.TcoForm--calculator fieldset {
    border:0;
    margin:0;
    padding:0;
}

.TcoSection,
.TcoAccordion {
    border-top:1px solid #e5e5e5;
    padding-top:22px;
    margin-top:28px;
}

.TcoSection--noTop {
    border-top:0;
    padding-top:0;
    margin-top:0;
}

.TcoSection h3,
.TcoAccordion summary {
    font-family:ToyotaType-Regular, Arial, sans-serif;
    font-size:20px;
    line-height:26px;
    color:#282830;
    margin:0 0 18px 0;
}

.TcoAccordion summary {
    list-style:none;
    cursor:pointer;
    position:relative;
    padding-right:46px;
    border-bottom:3px solid #a0a0a0;
    padding-bottom:16px;
    margin-bottom:24px;
}

.TcoAccordion summary::-webkit-details-marker {
    display:none;
}

.TcoAccordion summary::after {
    content:"";
    position:absolute;
    right:12px;
    top:5px;
    width:16px;
    height:16px;
    border-right:2px solid #282830;
    border-bottom:2px solid #282830;
    transform:rotate(45deg);
}

.TcoAccordion[open] summary::after {
   top:25px;
    transform:rotate(225deg);
}

.TcoGrid {
    display:grid;
    gap:18px;
}

.TcoGrid--two {
    grid-template-columns:repeat(2, minmax(0, 1fr));
}

.TcoGrid--three {
    grid-template-columns:repeat(3, minmax(0, 1fr));
}

.TcoGrid--four {
    grid-template-columns:repeat(4, minmax(0, 1fr));
}

.TcoField label,
.TcoSliderField label {
    display:block;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:13px;
    line-height:18px;
    margin:0 0 8px 0;
    color:#333;
}

.TcoForm--calculator input,
.TcoForm--calculator textarea {
    width:100%;
    box-sizing:border-box;
    border:1px solid #d2d2d2;
    background:#fff;
    color:#333;
    padding:12px 13px;
    font-family:ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif;
    font-size:16px;
    line-height:22px;
    border-radius:2px;
	
	
}

.TcoForm--calculator select {
	appearance: none;
    -webkit-appearance: none;
		    background:#fff;
    -moz-appearance: none;
	 background-image: url("data:image/svg+xml,%3Csvg width='12' height='7' viewBox='0 0 12 7' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23282830' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 12px 7px;
	font-family: 'ToyotaType-Book', Arial, sans-serif;
	font-size:15px;
    line-height:22px;
    border-radius:2px;
	    width:100%;
    box-sizing:border-box;
    border:1px solid #d2d2d2;

    color:#333;
	    padding:12px 13px;
	
}



.TcoForm--calculator input:focus,
.TcoForm--calculator select:focus,
.TcoForm--calculator textarea:focus {
    border-color:#282830;
	font-family: 'ToyotaType-Book', Arial, sans-serif;
}

.TcoForm--calculator input:hover,
.TcoForm--calculator select:hover,
.TcoForm--calculator textarea:hover {
    border-color:#282830;
}

.TcoSliderField {
    margin-top:22px;
}

.TcoSliderHeader label {
    font-size:16px;
    line-height:26px;
    font-family:ToyotaType-Regular, Arial, sans-serif;
}

.TcoSliderHeader span {
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
	float: right;
}

.TcoSliderField input[type="range"] {
    appearance:none;
    -webkit-appearance:none;
    width:100%;
    height:9px;
    border:0;
    padding:0;
    background:linear-gradient(to right, #9ccd43 0%, #9ccd43 var(--slider-fill, 71%), #ddd var(--slider-fill, 71%), #ddd 100%);
    border-radius:99px;
}

.TcoSliderField input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance:none;
    width:28px;
    height:28px;
    border-radius:50%;
    background:#282830;
    cursor:pointer;
}

.TcoSliderField input[type="range"]::-moz-range-thumb {
    width:28px;
    height:28px;
    border:0;
    border-radius:50%;
    background:#282830;
    cursor:pointer;
}

.TcoHelp {
    color:#333;
    font-size:14px;
    line-height:20px;
    margin:14px 0 0 0;
}

.TcoActions--right {
    justify-content:flex-end;
    margin-top:30px;
}

.TcoActions--right button {
    border-radius:0;
    min-width:100%;
    text-transform:none;
    font-size:16px;
}

@media only screen and (max-width: 1100px) {
    .TillvalPage .Marginal.TillvalLayout {
        grid-template-columns:1fr;
        gap:28px;
    }
	
    .TillvalSticky {
        position:static;
    }
}

@media only screen and (max-width: 760px) {
	
	.TillvalPage .Marginal.TillvalLayout {
		padding-top: 20px;
	}
	
	.ModelSelectedTitle h2 {
     font-family: 'ToyotaType-Regular';
    font-size:35px;
    line-height:40px;
	}
	

	
    .TcoFormBlock--side {
        padding:28px 20px;
    }

    .TcoGrid--two,
    .TcoGrid--three,
    .TcoGrid--four {
        grid-template-columns:1fr;
    }

    .TillvalHeader#InnehallRubrikHallare h1 {
        font-size:34px;
        line-height:40px;
		margin: 0 0 15px 0;
		
    }
}

/*************** TILLVAL - STICKY LEFT COLUMN FIX ***************/
/*
   Sticky låg tidigare på .TillvalSticky, som ligger inuti .TillvalLeft.
   Eftersom .TillvalLeft bara blev lika hög som sitt innehåll fick sticky-elementet
   ingen scroll-yta att “fastna” i. Därför flyttas sticky-beteendet till själva
   grid-kolumnen i stället.
*/
@media only screen and (min-width: 1101px) {
    .TillvalPage .TillvalLeft {
        position: -webkit-sticky;
        position: sticky;
        top: 48px;
        align-self: start;
        height: fit-content;
        z-index: 5;
    }

    .TillvalPage .TillvalSticky {
        position: static !important;
        top: auto !important;
    }
}

@media only screen and (max-width: 1100px) {
    .TillvalPage .TillvalLeft {
        position: static;
        top: auto;
    }
}





/*************** TOPPNAV - TCO-KALKYLATOR ***************/
.TcoTopNav {
    width:100%;
    background:#fff;
    border-bottom:1px solid #d7d7d7;
    box-shadow:0 2px 8px rgba(0,0,0,.08);
    box-sizing:border-box;
    position:relative;
    z-index:100;
	margin-bottom: 16px;
}

.TcoTopNav__inner {
    max-width:1150px;
    margin:0 auto;
padding:0px 100px;
    /*box-sizing:border-box;*/
    display:flex;
    align-items:center;
 
    gap:60px;
    min-height:70px;
}

.TcoTopNav__brand,
.TcoTopNav__brand:link,
.TcoTopNav__brand:visited,
.TcoTopNav__brand:active {
    display:inline-flex;
    align-items:center;
    gap:18px;
    color:#282830;
    text-decoration:none;
	
}

.TcoTopNav__brand:hover {
    color:#282830;
    text-decoration:none;
}

.TcoTopNav__logo {
    width:4rem;
    height:2.6rem;
    flex:0 0 4rem;
    display:block;
    background-repeat:no-repeat;
    background-position:center center;
    background-size:contain;
    background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iMjYiIHZpZXdCb3g9IjAgMCA0MCAyNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE5Ljk5OTQgMEM4Ljk1Mzc3IDAgMCA1LjgyMDY5IDAgMTMuMDAwNkMwIDIwLjE4MDYgOC45NTM3NyAyNiAxOS45OTk0IDI2QzMxLjA0NSAyNiA0MCAyMC4xNzkzIDQwIDEzLjAwMDZDNDAgNS44MjE5NiAzMS4wNDUgMCAxOS45OTk0IDBaTTE5Ljk5OTQgMjAuNDE5NEMxOC4zNTYyIDIwLjQxOTQgMTcuMDE2NSAxNy4xNjg2IDE2LjkzMDUgMTMuMDc2OUMxNy45MjAyIDEzLjE2NzEgMTguOTUyOCAxMy4yMTQxIDE5Ljk5OTQgMTMuMjE0MUMyMS4wNDU5IDEzLjIxNDEgMjIuMDc4NiAxMy4xNjcxIDIzLjA2OTUgMTMuMDc2OUMyMi45ODIzIDE3LjE2ODYgMjEuNjQxMiAyMC40MTk0IDE5Ljk5OTQgMjAuNDE5NFpNMTcuMTM1MyA5LjgzMTE0QzE3LjU4MjcgNi45Mzg1OCAxOC42OTYyIDQuODg5NTMgMTkuOTk5NCA0Ljg4OTUzQzIxLjMwMjUgNC44ODk1MyAyMi40MTczIDYuOTM4NTggMjIuODY0NyA5LjgzMTE0QzIxLjk0ODQgOS45MTM3MiAyMC45ODkgOS45NTgxOCAxOS45OTk0IDkuOTU4MThDMTkuMDA5NyA5Ljk1ODE4IDE4LjA1MTYgOS45MDg2MyAxNy4xMzUzIDkuODMxMTRaTTE5Ljk5OTQgMS44ODI2NEMxNy44NTA3IDEuODgyNjQgMTYuMDI1NSA1LjEwOTMgMTUuMzUwNiA5LjYxMTM4QzExLjI4MzIgOC45NzYyMSA4LjQ0MzE0IDcuNTIyOTQgOC40NDMxNCA1LjgzNTkzQzguNDQzMTQgMy41NTY5NSAxMy42MTc3IDEuNzE0OTYgMTkuOTk5NCAxLjcxNDk2QzI2LjM4MSAxLjcxNDk2IDMxLjU1NTYgMy41NTY5NSAzMS41NTU2IDUuODM1OTNDMzEuNTU1NiA3LjUyMjk0IDI4LjcxNjggOC45NzI0IDI0LjY0OTQgOS42MTEzOEMyMy45NzQ1IDUuMTA5MyAyMi4xNDY4IDEuODgyNjQgMTkuOTk5NCAxLjg4MjY0Wk0yLjg2Nzg5IDEyLjUxMjhDMi44Njc4OSAxMC4zMDg4IDMuNzEwOTQgOC4yNDQ0OSA1LjE4MDkgNi40Njg1NkM1LjE2NDA0IDYuNTk0ODkgNS4xNTU2IDYuNzIyMiA1LjE1NTYyIDYuODQ5NjZDNS4xNTU2MiA5LjYyNjYyIDkuMjk4ODMgMTEuOTg5NCAxNS4wNzc2IDEyLjg1OTZDMTUuMDc3NiAxMy4wNjE2IDE1LjA3NzYgMTMuMjY0OSAxNS4wNzc2IDEzLjQ2OTRDMTUuMDc3NiAxOC42NDIyIDE2LjUyMSAyMy4wMjIzIDE4LjUxMyAyNC41MDg2QzkuNzQzNzQgMjMuOTcyNSAyLjg2Nzg5IDE4LjgwMSAyLjg2Nzg5IDEyLjUxMjhaTTIxLjQ4NyAyNC41MDM1QzIzLjQ4MDMgMjMuMDE3MiAyNC45MjM3IDE4LjYzNzEgMjQuOTIzNyAxMy40NjQzQzI0LjkyMzcgMTMuMjU5OCAyNC45MjM3IDEzLjA1NjUgMjQuOTIzNyAxMi44NTQ1QzMwLjcwMjQgMTEuOTg0NCAzNC44NDU2IDkuNjIxNTQgMzQuODQ1NiA2Ljg0NDU4QzM0Ljg0NTkgNi43MTcwNyAzNC44MzcgNi41ODk3MSAzNC44MTkxIDYuNDYzNDhDMzYuMjkwMyA4LjI0MTk1IDM3LjEzMzQgMTAuMzAzNyAzNy4xMzM0IDEyLjUwNzdDMzcuMTMyMSAxOC44MDEgMzAuMjU1IDIzLjk3MjUgMjEuNDg3IDI0LjUwMzVaIiBmaWxsPSIjMjgyODMwIi8+Cjwvc3ZnPgo=);
}

.TcoTopNav__brandText {
    font-family:ToyotaType-Regular, ToyotaType-Book, Arial, sans-serif;
    font-size:18px;
    line-height:22px;
    color:#282830;
    white-space:nowrap;
}

.TcoTopNav__nav {
    display:flex;
    align-items:center;
    gap:22px;
}

.TcoTopNav__link,
.TcoTopNav__link:link,
.TcoTopNav__link:visited,
.TcoTopNav__link:active {
    display:inline-flex;
    align-items:center;
    min-height:38px;
    color:#282830;
    text-decoration:none;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:16px;
    line-height:20px;
	display: none;
}

.TcoTopNav__link:hover,
.TcoTopNav__link.is-active {

    text-decoration:underline;
}

.InterestRow { margin-top: 15px; }

@media screen and (max-width:980px) {
    .TcoTopNav__inner {
        padding-left:25px;
        padding-right:25px;
    }
}

@media screen and (max-width:620px) {
	
	.TillvalGradeSelect {
		font-size: 16px;
    line-height: 22px;
	}
	
    .TcoTopNav__inner {
        padding:0px 16px;
        gap:16px;
    }
    .TcoTopNav__logo {
        width:3.2rem;
        height:2.1rem;
        flex-basis:3.2rem;
    }
    .TcoTopNav__brandText {
        font-size:16px;
        line-height:20px;
    }
    .TcoTopNav__link {
        font-size:15px;
    }
}

/*************** TILLVAL - KOMPAKT KALKYL REWORK ***************/
.TcoFormBlock--side {
    padding:32px 34px;
}

.TcoIntroControls {
    background:#f7f7f7;
    padding:30px;
    margin-bottom:18px;
    border:0 !important;
}

.TcoAccordion--compact {
    border-top:0;
   margin-top:20px;
    padding-top:5px;
	padding: 10px;
	padding-bottom: 0px;
    background:#f7f7f7;
}

.TcoAccordion--compact summary {
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:54px;
    padding:0 20px 0 19px;
    margin:0;
    border:0;
    cursor:pointer;
    font-family:ToyotaType-Regular, ToyotaType-Book, Arial, sans-serif;
    font-size:24px;
    line-height:30px;
    letter-spacing:-0.01em;
    color:#282830;
    position:relative;
	margin-bottom: 10px;
}

.TcoAccordion--compact summary::after {
    right:20px;
    top:20px;
    width:9px;
    height:9px;
    border-right:2px solid #282830;
    border-bottom:2px solid #282830;
    transform:rotate(225deg);
}

.TcoAccordion--compact:not([open]) summary::after {
    top:16px;
    transform:rotate(45deg);
}

.TcoRows {
    padding:0px 20px 20px;
}

.TcoCalcRow {
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(145px, 190px);
    align-items:center;
    gap:20px;
    margin:0;
    padding:5px 0;
    font-family:ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif;
    font-size:17px;
    line-height:24px;
    color:#282830;
}

.TcoCalcRow > span {
    min-width:0;
	word-wrap: break-word;
}

.TcoCalcRow input,
.TcoCalcRow output {
    width:100%;
    height:38px;
    box-sizing:border-box;
    border:1px solid #cfcfcf;
    background:#fff;
    padding:0 14px;
    text-align:right;
    font-family:ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif;
    font-size:16px;
   /* line-height:36px;*/
    color:#282830;
}

.TcoCalcRow output {
    display:block;
    border-color:transparent;
    background:transparent;
    padding-right:0;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
}

.TcoCalcRow input.is-readonly,
.TcoCalcRow input[readonly] {
    background:#efefef;
    color:#555;
    cursor:not-allowed;
	border:solid 1px transparent;
}

.TcoCalcRow--spaced {
    margin-top:16px;
}

.TcoCalcRow--total {
  /*  border-top:2px solid #282830;
    margin-top:14px;
    padding-top:14px;*/
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
	margin-top: 5px;
	
	border-top:2px solid #282830;
    padding-top:10px;
}

.TcoCalcRow--total span,
.TcoCalcRow--total output {
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:16px;
	min-height: 35px;
	padding-right: 8px;
}

.TcoStickySummary {
    position:sticky;
    bottom:0;
    z-index:80;
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    gap:18px;
    margin:20px -34px 0;
    padding:16px 34px;
    background:rgba(255,255,255,.96);
    border-top:1px solid #d7d7d7;
    box-shadow:0 -12px 35px rgba(0,0,0,.08);
    backdrop-filter:blur(8px);
}

.TcoStickySummary__title {
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:16px;
    line-height:20px;
    white-space:nowrap;
}

.TcoStickySummary__items {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
}

.TcoStickySummary__item {
    background:#f2f2f2;
	background: #fff;
	border: solid 1px #282830;
    padding:10px 15px;
    min-width:0;
}

.TcoStickySummary__item span,
.TcoStickySummary__item strong {
    display:block;
}

.TcoStickySummary__item span {
    font-size:14px;
    line-height:16px;
    color:#555;
    margin-bottom:4px;
}

.TcoStickySummary__item strong {
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:18px;
    line-height:22px;
    color:#282830;
    white-space:nowrap;
}

.TcoStickySummary__item strong.is-muted,
output.is-muted {
    color:#aaa;
}

.TcoActions--right {
    margin-top:0;
   padding-top:10px;
    justify-content:flex-end;
    background:#fff;
}

@media only screen and (max-width: 760px) {
    .TcoFormBlock--side {
        padding:18px 14px;
    }

    .TcoIntroControls {
        padding:14px;
    }

    .TcoAccordion--compact summary {
        min-height:50px;
        padding-left:12px;
        padding-right:14px;
        font-size:22px;
        line-height:28px;
		margin-bottom: 10px;
    }

    .TcoRows {
        padding:0 14px 16px;
    }
	
	

    .TcoCalcRow {
        grid-template-columns:minmax(0, 1fr) minmax(118px, 150px);
        gap:12px;
        font-size:16px;
        line-height:22px;
    }

    .TcoCalcRow input,
    .TcoCalcRow output {
        height:36px;
        font-size:16px;
 
        padding:0 10px;
    }

    .TcoCalcRow--total span,
    .TcoCalcRow--total output {
        font-size:16px;
    }

    .TcoStickySummary {
       /* grid-template-columns:1fr;*/
        gap:10px;
        margin-left:-14px;
        margin-right:-14px;
        padding:12px 14px;
    }
	
	.TcoAccordion--compact {
		padding: 5px;
		padding-bottom: 0px;
	}
	
	.TcoStickySummary__title {
    font-size: 13px;
		text-transform: uppercase;
}

    .TcoStickySummary__items {
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:6px;
    }

    .TcoStickySummary__item {
        padding:8px 8px;
    }

    .TcoStickySummary__item span {
        font-size:11px;
    }

    .TcoStickySummary__item strong {
        font-size:14px;
        line-height:18px;
    }
}

/*************** DRIVMEDELSKOSTNAD ***************/
.TcoAccordion > summary {
    position: relative;
}

.TcoAccordion > summary .TcoInfo {
    margin-left: 8px;
}

.TcoInfo {
    display: inline-flex;
    align-items: center;
    position: relative;
    vertical-align: middle;
    z-index: 40;
}

.TcoInfoButton {
    appearance: none;
    -webkit-appearance: none;
    width: 22px;
    height: 22px;
    border: 0;
    border-radius: 999px;
    background: #95c11f;
    color: #fff;
    font-family: ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size: 15px;
    line-height: 22px;
    text-align: center;
    cursor: help;
    padding: 0;
}

.TcoInfoButton:hover,
.TcoInfo.is-open .TcoInfoButton {
    background: #78a918;
}

.TcoInfoPopup {
    display: none;
    position: absolute;
    right: -8px;
    top: calc(100% + 10px);
    width: min(360px, 82vw);
    background: #282830;
    color: #fff;
    padding: 16px 18px;
    box-sizing: border-box;
    border-radius: 2px;
    box-shadow: 0 14px 38px rgba(0,0,0,.22);
    font-family: ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif;
    font-size: 14px;
    line-height: 20px;
    text-transform: none;
    letter-spacing: 0;
    font-weight: normal;
    z-index: 9999;
}

.TcoInfoPopup::before {
    content: "";
    position: absolute;
    right: 12px;
    top: -7px;
    width: 14px;
    height: 14px;
    background: #282830;
    transform: rotate(45deg);
}

.TcoInfo:hover .TcoInfoPopup,
.TcoInfo:focus-within .TcoInfoPopup,
.TcoInfo.is-open .TcoInfoPopup {
    display: block;
}

.TcoFuelExplanation {
    margin-top: 8px;
    padding: 12px 14px;
    background: #f4f4f4;
    color: #555;
    font-size: 14px;
    line-height: 20px;
    border-left: 4px solid #95c11f;
}

.TcoFuelSection select,
.TcoCalcRow select {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #cfcfcf;
    background: #fff;
    color: #282830;
    padding: 10px 42px 10px 12px;
    font-size: 15px;
    line-height: 20px;
    border-radius: 2px;
    font-family: ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif;
    min-height: 42px;
	
		appearance: none;
    -webkit-appearance: none;
	
    -moz-appearance: none;
	 background-image: url("data:image/svg+xml,%3Csvg width='12' height='7' viewBox='0 0 12 7' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23282830' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 12px 7px;
	

	
	
}

.TcoCalcRow input.is-readonly,
.TcoCalcRow input[readonly] {
    background: #f7f7f7;
    color: #555;
}

@media only screen and (max-width: 700px) {
    .TcoInfoPopup {
        right: auto;
        left: 0;
        width: min(330px, calc(100vw - 24px));
        max-width: calc(100vw - 24px);
    }
    .TcoInfoPopup::before {
        right: auto;
        left: var(--tco-tooltip-arrow-left, 18px);
    }
	
	.TcoCalcRow > span {
		font-size: 15px;
}
}


/*************** TILLVAL - TEKNISK FAKTA ***************/
.TillvalTechFacts {
    width:100%;
    margin-top:28px;
    padding-top:4px;
    text-align:left;
    box-sizing:border-box;
	border: solid 1px #c1c1c1;
    padding: 20px;
   /* box-shadow: 0 0px 10px rgba(0, 0, 0, .08);*/
	font-size: 14px;
	line-height: 20px;
}

.TillvalTechFact {
    margin-bottom:16px;
}

.TillvalTechFact:last-child {
    margin-bottom:0;
}

.TillvalTechFact__label {
    color:#55575b;
    font-family:'ToyotaType-Book', ToyotaType-Regular, Arial, sans-serif;

    letter-spacing:.01em;
    margin-bottom:3px;
}

.TillvalTechFact__value {
    color:#282830;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-weight:700;
}

@media only screen and (max-width: 900px) {
    .TillvalTechFacts {
        margin-top:24px;
    }
	
	.TillvalSticky { padding-bottom: 10px; }


}

/* Tooltip för färgval */
.TillvalColourInner .FargRuta {
    position: relative;
}

.FargTooltip {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 10px);
    transform: translateX(-50%) translateY(4px);
    background: #282830;
    color: #fff;
    font-family: ToyotaType-Book, Arial, sans-serif;
    font-size: 13px;
    line-height: 17px;
    white-space: nowrap;
    padding: 8px 10px;
    border-radius: 3px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
    z-index: 99999;
    box-shadow: 0 8px 20px rgba(0,0,0,.18);
}

.FargTooltip::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: #282830;
}

.FargRuta:hover .FargTooltip,
.FargRuta:focus .FargTooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

.FargRuta.is-tooltip-hidden .FargTooltip,
.FargRuta.is-tooltip-hidden:hover .FargTooltip,
.FargRuta.is-tooltip-hidden:focus .FargTooltip {
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateX(-50%) translateY(4px) !important;
}

/*************** TCO - FLIKAR OCH ÅF-INFO ***************/
.TcoTabs {
    display:flex;
    align-items:flex-end;
    gap:8px;
    margin:0 0 26px 0;
    border-bottom:1px solid #d7d7d7;
}

.TcoTabButton {
    appearance:none;
    -webkit-appearance:none;
    border:0;
    border-bottom:3px solid transparent;
    background:transparent;
    color:#777;
    padding:0 18px 13px 0;
    margin:0;
    font-family:ToyotaType-Regular, Arial, sans-serif;
    font-size:22px;
    line-height:30px;
    text-transform:none;
    letter-spacing:.01em;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:8px;
}

.TcoTabButton:hover {
    color:#282830;
    border-bottom-color:#282830;
	 
}


.TcoTabButton.is-active {
    color:#282830;
    border-bottom-color:#282830;
	  font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
}


.TcoTabWarning,
.TcoDealerNotice__icon {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:20px;
    height:20px;
    min-width:20px;
    border-radius:50%;
    background:#cc1124;
    color:#fff;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:13px;
    line-height:20px;
}

.TcoTabWarning.is-hidden,
.TcoDealerNotice.is-hidden {
    display:none !important;
}

.TcoTabPanel[hidden] {
    display:none !important;
}

.TcoDealerPanel {
    background:#f7f7f7;
    padding:30px;
    margin-top:0;
    margin-bottom:18px;
    border-top:0 !important;
}

.TcoDealerGrid {
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
    margin-top:0px;
    max-width:520px;
    width:100%;
}

.TcoDealerNotice {
    display:flex;
    align-items:flex-start;
    gap:10px;
    padding:14px 16px;
    background:#fff;
    border:1px solid #e2b6bb;
    color:#282830;
    font-size:15px;
    line-height:21px;
	margin-bottom: 20px;
}

.TcoDealerActions {
    display:flex;
    justify-content:flex-end;
    margin-top:20px;
}

.TcoDealerSaveButton {
    appearance:none;
    -webkit-appearance:none;
    min-width:170px;
    min-height:48px;
    padding:12px 28px;
    border:0;
    border-radius:2px;
    background:#6f6f72;
    color:#fff;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:16px;
    line-height:22px;
    text-transform:none;
    cursor:pointer;
}

.TcoDealerSaveButton:hover,
.TcoDealerSaveButton:focus {
    background:#56565a;
    color:#fff;
}

@media only screen and (max-width: 760px) {
    .TcoTabs {
        gap:14px;
        margin-bottom:20px;
    }

    .TcoTabButton {
        font-size:20px;
        line-height:26px;
        padding-bottom:10px;
        padding-right:0;
    }

    .TcoDealerPanel {
        padding:14px;
    }

    .TcoDealerGrid {
        grid-template-columns:1fr;
        gap:14px;
    }
}

/*************** TCO - BRUKSBIL, RABATT PER RAD OCH DRIVMEDELSVAL ***************/
.TcoTopOption {
    display:flex;
    align-items:center;
    gap:9px;
    margin:0 0 24px 0;
    padding:0 0 18px 0;
    border-bottom:1px solid #dedede;
}

.TcoToggleChoice,
.TcoFuelExclude {
    position:relative;
    display:inline-flex;
    align-items:center;
    gap:10px;
    cursor:pointer;
    margin:0;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    color:#282830;
}

.TcoToggleChoice input,
.TcoFuelExclude input {
    position:absolute;
    opacity:0;
    pointer-events:none;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:0 !important;
}

.TcoToggleChoice__control,
.TcoFuelExclude__control {
    width:38px;
    height:22px;
    min-width:38px;
    border-radius:999px;
    background:#cfcfcf;
    position:relative;
    transition:background .15s ease;
    box-sizing:border-box;
}

.TcoToggleChoice__control::after,
.TcoFuelExclude__control::after {
    content:"";
    position:absolute;
    left:3px;
    top:3px;
    width:16px;
    height:16px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 1px 3px rgba(0,0,0,.22);
    transition:transform .15s ease;
}

.TcoToggleChoice input:checked + .TcoToggleChoice__control,
.TcoFuelExclude input:checked + .TcoFuelExclude__control {
    background:#282830;
}

.TcoToggleChoice input:checked + .TcoToggleChoice__control::after,
.TcoFuelExclude input:checked + .TcoFuelExclude__control::after {
    transform:translateX(16px);
}

.TcoToggleChoice input:focus-visible + .TcoToggleChoice__control,
.TcoFuelExclude input:focus-visible + .TcoFuelExclude__control {
    box-shadow:0 0 0 2px #fff, 0 0 0 4px #282830;
}

.TcoToggleChoice__text {
    font-size:16px;
    line-height:24px;
}

.TcoField select.is-disabled-by-bruksbil,
.TcoField select:disabled {
    background-color:#ececec;
    color:#666;
    cursor:not-allowed;
    opacity:1;
}

.TcoPriceMeta {
    margin:-6px 0 10px 0;
    color:#666;
    font-size:13px;
    line-height:18px;
}

.TcoPriceSection summary,
.TcoFuelSection summary {
    margin-bottom:2px;
}

.TcoDiscountMode {
    display:flex;
    align-items:center;
    gap:0;
    margin:0 0 14px 0;
}

.TcoDiscountMode__label {
    margin-right:9px;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:14px;
}

.TcoDiscountMode__button {
    appearance:none;
    -webkit-appearance:none;
    min-width:46px;
    height:34px;
    border:1px solid #bfc0c2;
    background:#fff;
    color:#282830;
    padding:0 13px;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:14px;
    cursor:pointer;
}

.TcoDiscountMode__button + .TcoDiscountMode__button {
    margin-left:-1px;
}

.TcoDiscountMode__button.is-active {
    background:#282830;
    border-color:#282830;
    color:#fff;
    position:relative;
    z-index:1;
}

.TcoPriceColumns,
.TcoPriceRow {
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(110px, 155px) minmax(110px, 155px);
    gap:10px;
    align-items:center;
}

.TcoPriceColumns {
    padding:0 0 4px 0;
    color:#666;
    font-size:12px;
    line-height:16px;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.TcoPriceColumns span:nth-child(2),
.TcoPriceColumns span:nth-child(3) {
    text-align:right;
    padding-right:2px;
}

.TcoPriceRow {
    margin:0;
    padding:5px 0;
    font-family:ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif;
    font-size:17px;
    line-height:24px;
    color:#282830;
}

.TcoPriceRow > span {
    min-width:0;
}

.TcoPriceRow input {
    width:100%;
    height:38px;
    box-sizing:border-box;
    border:1px solid #cfcfcf;
    background:#fff;
    padding:0 12px;
    text-align:right;
    font-family:ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif;
    font-size:16px;
    color:#282830;
}

.TcoPriceTotals {
    margin-top:12px;
    padding-top:10px;
    border-top:1px solid #cfcfcf;
}

.TcoPriceTotalRow {
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(145px, 190px);
    gap:20px;
    align-items:center;
    min-height:34px;
    font-size:16px;
}

.TcoPriceTotalRow output {
    display:block;
    text-align:right;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:17px;
}

.TcoPriceTotalRow--discount {
    color:#555;
}

.TcoPriceTotalRow--net {
    margin-top:5px;
    padding-top:9px;
    border-top:2px solid #282830;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:18px;
}

.TcoPriceTotalRow--net output {
    font-size:18px;
}

.TcoFuelExclude {
    width:100%;
    box-sizing:border-box;
    margin:0 0 14px 0;
    padding:0 0 14px 0;
    border:0;
    border-bottom:1px solid #dedede;
    background:transparent;
    font-family:ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif;
    font-size:14px;
    line-height:19px;
}

.TcoStickySummary__items.is-company-only {
    grid-template-columns:1fr;
}

.TcoStickySummary__items.is-company-only .TcoStickySummary__item--company {
    width:100%;
    box-sizing:border-box;
}

@media only screen and (max-width: 760px) {
    .TcoTopOption {
        margin-bottom:18px;
        padding-bottom:14px;
    }

    .TcoToggleChoice__text {
        font-size:17px;
    }

    .TcoPriceColumns,
    .TcoPriceRow {
        grid-template-columns:minmax(74px, 1fr) minmax(82px, 108px) minmax(76px, 98px);
        gap:7px;
    }

    .TcoPriceRow {
        font-size:15px;
    }

    .TcoPriceRow input {
        height:36px;
        padding:0 8px;
        font-size:15px;
    }

    .TcoPriceTotalRow {
        grid-template-columns:minmax(0, 1fr) minmax(118px, 150px);
        gap:12px;
    }

    .TcoFuelExclude {
        padding:0 0 12px 0;
        font-size:13px;
    }

    .TcoPriceSection summary,
    .TcoFuelSection summary {
        margin-bottom:2px;
    }
}

/* Robust visning vid exkluderad drivmedelskostnad. */
.TcoFuelSection.is-fuel-excluded .js-fuel-model-row,
.TcoFuelSection.is-fuel-excluded .js-fuel-price-row,
.TcoFuelSection.is-fuel-excluded .js-fuel-cost-row,
.TcoFuelSection.is-fuel-excluded .js-private-mileage-row,
.TcoFuelSection.is-fuel-excluded .js-mileage-rate-row,
.TcoFuelSection.is-fuel-excluded .TcoFuelExplanation {
    display:none !important;
}

/*************** TILLVAL - MOBIL HORIZONTAL OVERFLOW FIX ***************/
/*
   Färg-tooltipen är absolut positionerad och använder white-space:nowrap.
   Även när den är visibility:hidden kan WebKit/Safari räkna in dess
   utstickande box i dokumentets scrollWidth. På touch/mobil behövs
   hover-tooltipen inte, eftersom vald färg redan visas under färgvalen.
*/
@media only screen and (max-width: 760px) {
    .TillvalPage .FargTooltip {
        display: none !important;
    }

    /* Håll de huvudsakliga tillval-wrappers inom viewporten. */
    .TillvalPage .Marginal.TillvalLayout,
    .TillvalPage .TillvalLeft,
    .TillvalPage .TillvalRight,
    .TillvalPage .TillvalSticky,
    .TillvalPage .TcoFormBlock--side {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }
}

/* Samma skydd på touch-enheter i liggande läge som kan vara bredare än 760px. */
@media (hover: none) and (pointer: coarse) {
    .TillvalPage .FargTooltip {
        display: none !important;
    }
}

/*************** TILLVAL - STICKY SUMMARY EDGE ALIGN FIX ***************/
/*
   På mobil har .TcoFormBlock--side 14px sidopadding.
   Sticky-raden ska gå kant-i-kant med det vita formulärblocket.
   width:auto är viktigt: width:100% tillsammans med negativa marginaler
   flyttar bara elementet åt vänster och lämnar 14px tom yta till höger.
*/
@media only screen and (max-width: 760px) {
    .TillvalPage .TcoStickySummary {
        width: auto;
        max-width: none;
        min-width: 0;
        margin-left: -14px;
        margin-right: -14px;
        box-sizing: border-box;
    }
}

/*************** TCO - FINANSPRODUKTER + FÖRBÄTTRADE KONTROLLER (2026-09-04) ***************/
.TcoFinanceProduct {
    margin:0 0 18px 0;
    padding:0;
}

.TcoFinanceProduct__title {
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:15px;
    line-height:20px;
    margin:0 0 9px 0;
    color:#282830;
}

.TcoFinanceProduct__buttons {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:8px;
    width:100%;
}

.TcoFinanceProduct__button {
    appearance:none;
    -webkit-appearance:none;
    min-height:54px;
    border:1px solid #bfc0c2;
    background:#fff;
    color:#282830;
    padding:10px 16px;
    box-sizing:border-box;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:17px;
    line-height:22px;
    text-align:center;
    cursor:pointer;
    transition:background .16s ease, color .16s ease, border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.TcoFinanceProduct__button:hover {
    border-color:#282830;
}

.TcoFinanceProduct__button:active {
    transform:translateY(1px);
}

.TcoFinanceProduct__button.is-active {

    border-color:#282830;
	background-color: #282830;
	color: #fff;

   
}

/* Slider + manuellt inmatningsfält på samma kontroll. */
.TcoSliderHeader--editable {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-bottom:8px;
}

.TcoSliderHeader--editable > label {
    margin:0;
    font-size:18px;
    line-height:24px;
}

.TcoSliderValueEditor {
    display:grid;
    grid-template-columns:62px 28px;
    flex:0 0 auto;
    border:1px solid #cfcfcf;
    background:#fff;
    box-sizing:border-box;
}

.TcoSliderValueEditor input {
    width:100% !important;
    min-width:0;
    height:36px;
    border:0 !important;
    padding:0 7px !important;
    text-align:right;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:15px !important;
    line-height:36px !important;
    box-sizing:border-box;
}

.TcoSliderValueEditor span {
    float:none !important;
    display:flex;
    align-items:center;
    justify-content:center;
    border-left:1px solid #e2e2e2;
    color:#555;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:14px;
}

/* Restvärde: toggle + slider kvar, men även manuell inmatning i % eller Kr. */
.TcoResidualField {
    padding-top:20px;
    border-top:1px solid #dedede;
}

.TcoResidualHeader {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-bottom:14px;
}

.TcoResidualPreview {
    flex:0 0 auto;
  color: #333;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif;
    font-size:16px;
    line-height:26px;
    white-space:nowrap;
    transition:opacity .16s ease;
}

.TcoResidualPreview.is-muted {
    opacity:.48;
}

.TcoResidualControls {
    transition:opacity .16s ease;
}

.TcoResidualControls.is-disabled {
    opacity:.38;
}

.TcoResidualManualRow {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-top:16px;
}

.TcoResidualManualLabel {
    color:#555;
    font-size:14px;
    line-height:20px;
}

.TcoResidualManualInput {
    display:grid;
    grid-template-columns:minmax(90px, 120px) 72px;
    gap:6px;
    min-width:0;
}

.TcoResidualManualInput input {
    width:100%;
    min-width:0;
    height:38px;
    padding:0 10px;
    text-align:right;
    box-sizing:border-box;
}

.TcoForm--calculator .TcoResidualManualInput select {
    width:72px !important;
    min-width:72px !important;
    height:38px !important;
    padding:0 25px 0 9px !important;
    background-position:right 8px center !important;
    background-size:10px 6px !important;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif !important;
    font-size:14px !important;
    line-height:36px !important;
    box-sizing:border-box !important;
}

/* Rabatt per rad. Selectorn görs medvetet mer specifik än den generella select-regeln. */
.TcoDiscountCell {
    display:grid;
    grid-template-columns:minmax(0, 1fr) 70px;
    gap:6px;
    min-width:0;
    width:100%;
    align-items:center;
}

.TcoDiscountCell input {
    min-width:0;
}

.TcoForm--calculator .TcoDiscountTypeSelect {
    appearance:none !important;
    -webkit-appearance:none !important;
    -moz-appearance:none !important;
    display:block !important;
    width:70px !important;
    min-width:70px !important;
    max-width:70px !important;
    height:38px !important;
    box-sizing:border-box !important;
    border:1px solid #cfcfcf !important;
    background-color:#fff !important;
    color:#282830 !important;
    background-position:right 8px center !important;
    background-size:10px 6px !important;
    padding:0 25px 0 9px !important;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif !important;
    font-size:14px !important;
    line-height:36px !important;
    text-align:left !important;
    cursor:pointer;
}

.TcoCalcRow input.is-business-lease-input {
    background:#fff;
    border-color:#282830;
}

@media only screen and (max-width: 760px) {
    .TcoFinanceProduct {
        margin-bottom:14px;
    }

    .TcoFinanceProduct__button {
        min-height:50px;
        padding:9px 8px;
        font-size:15px;
        line-height:19px;
    }

    .TcoSliderHeader--editable {
        gap:10px;
    }

    .TcoSliderHeader--editable > label {
        font-size:17px;
    }

    .TcoResidualHeader {
        align-items:flex-start;
        flex-direction:column;
        gap:7px;
    }

    .TcoResidualManualRow {
        align-items:flex-start;
        flex-direction:column;
        gap:7px;
    }

    .TcoResidualManualInput {
        width:100%;
        grid-template-columns:minmax(0, 1fr) 74px;
    }

    .TcoPriceColumns,
    .TcoPriceRow {
        grid-template-columns:minmax(64px, 1fr) minmax(76px, 96px) minmax(132px, 152px);
        gap:6px;
    }

    .TcoDiscountCell {
        grid-template-columns:minmax(0, 1fr) 66px;
        gap:5px;
    }

    .TcoForm--calculator .TcoDiscountTypeSelect {
        width:66px !important;
        min-width:66px !important;
        max-width:66px !important;
        height:36px !important;
        line-height:34px !important;
        padding-left:8px !important;
        padding-right:23px !important;
        background-position:right 7px center !important;
        font-size:13px !important;
    }
}

@media only screen and (max-width: 390px) {
    .TcoFinanceProduct__buttons {
        gap:6px;
    }

    .TcoFinanceProduct__button {
        font-size:14px;
    }

    .TcoPriceColumns,
    .TcoPriceRow {
        grid-template-columns:minmax(58px, 1fr) minmax(70px, 86px) minmax(126px, 140px);
        gap:5px;
    }

    .TcoDiscountCell {
        grid-template-columns:minmax(0, 1fr) 62px;
        gap:4px;
    }

    .TcoForm--calculator .TcoDiscountTypeSelect {
        width:62px !important;
        min-width:62px !important;
        max-width:62px !important;
        padding-left:7px !important;
        padding-right:21px !important;
        font-size:13px !important;
    }
}

/*************** TCO - UI FINPUTSNING V3 ***************/
/* Marginalskatt är åter en ren slider. */
.TcoForm--calculator .TcoSliderField .TcoSliderHeader label {
    margin-bottom:0;
}

/* Restvärde: rubrik + kompakt toggle på samma rad, utan överlapp. */
.TcoResidualHeader {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-bottom:14px;
}

.TcoResidualTitleRow {
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}

.TcoResidualTitleRow > label:first-child {
    margin:0 !important;
    font-size:16px;
    line-height:26px;
    font-family:ToyotaType-Regular, Arial, sans-serif;
    white-space:nowrap;
}

.TcoResidualHeader .TcoResidualToggle {
    display:inline-flex !important;
    align-items:center;
    flex:0 0 auto;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
}

.TcoResidualHeader .TcoResidualToggle .TcoToggleChoice__control {
    margin:0;
}

.TcoResidualControls {
    width:100%;
}

.TcoResidualControls.is-disabled {
    opacity:.38;
}

/* Rabattfält: input + Kr/% fungerar visuellt som ett enda sammanhållet fält. */
.TcoDiscountCell {
    display:flex !important;
    align-items:stretch;
    gap:0 !important;
    width:100%;
    min-width:0;
}

.TcoDiscountCell input {
    flex:1 1 auto;
    width:calc(100% - 60px) !important;
    min-width:0 !important;
    height:38px;
    border-radius:2px 0 0 2px !important;
    border-right:0 !important;
    padding-right:8px !important;
}

.TcoForm--calculator .TcoDiscountTypeSelect {
    flex:0 0 60px;
    width:60px !important;
    min-width:60px !important;
    max-width:60px !important;
    height:38px !important;
    margin:0 !important;
    border-radius:0 2px 2px 0 !important;
    border:1px solid #cfcfcf !important;
    padding:0 22px 0 8px !important;
    background-position:right 7px center !important;
    background-size:10px 6px !important;
    font-size:14px !important;
    line-height:36px !important;
    text-align:left !important;
    font-family:ToyotaType-Semibold, ToyotaType-Regular, Arial, sans-serif !important;
    box-sizing:border-box !important;
}

.TcoDiscountCell:focus-within input,
.TcoDiscountCell:focus-within .TcoDiscountTypeSelect {
    border-color:#282830 !important;
}

@media only screen and (max-width: 760px) {
    .TcoResidualHeader {
        flex-direction:row !important;
        align-items:center !important;
        gap:10px !important;
    }

    .TcoResidualTitleRow {
        gap:8px;
    }

    .TcoResidualTitleRow > label:first-child {
        font-size:17px;
        line-height:24px;
        white-space:normal;
    }

  
    .TcoPriceColumns,
    .TcoPriceRow {
        grid-template-columns:minmax(64px, 1fr) minmax(76px, 96px) minmax(112px, 132px) !important;
        gap:6px !important;
    }

    .TcoDiscountCell input {
        height:36px !important;
        width:calc(100% - 60px) !important;
    }

    .TcoForm--calculator .TcoDiscountTypeSelect {
        flex-basis:60px;
        width:60px !important;
        min-width:60px !important;
        max-width:60px !important;
        height:36px !important;
        line-height:34px !important;
        font-size:13px !important;
    }
}

@media only screen and (max-width: 390px) {
    .TcoResidualHeader {
        gap:7px !important;
    }

    .TcoResidualTitleRow {
        gap:6px;
    }

    .TcoResidualTitleRow > label:first-child {
        font-size:16px;
    }

    .TcoResidualPreview {
        font-size:12px;
    }

    .TcoPriceColumns,
    .TcoPriceRow {
        grid-template-columns:minmax(56px, 1fr) minmax(68px, 84px) minmax(108px, 126px) !important;
        gap:5px !important;
    }
}

/*************** TCO - UI FINPUTSNING V4 ***************/

/* Restvärde: samma tydliga "Exkludera..."-rad som för drivmedel. */
.TcoResidualHeader {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-bottom:10px;
}

.TcoResidualHeader > label {
    margin:0 !important;
    font-family:ToyotaType-Regular, Arial, sans-serif;
    font-size:16px;
    line-height:24px;
}

.TcoResidualExclude {
    margin-bottom:14px !important;
}

/* Sektionerna ska inte längre se ut eller bete sig som klickbara accordions. */
.TcoAccordion--compact > summary {
    cursor:default !important;
    -webkit-user-select:text;
    user-select:text;
}

.TcoAccordion--compact > summary::after {
    display:none !important;
}

.TcoAccordion--compact .TcoAccordionToggle {
    display:none !important;
}

@media only screen and (max-width: 760px) {
    .TcoResidualHeader {
        flex-direction:row !important;
        align-items:center !important;
        gap:10px !important;
    }

    .TcoResidualHeader > label {
        font-size:17px;
        line-height:24px;
    }

    .TcoResidualExclude {
        font-size:14px;
    }
}

/*************** TCO - FIX V5 ***************/

/* Restvärdesvalet ligger i .TcoSliderField, vars generella label-regel annars
   gör switchen till ett vanligt blockelement. Tvinga samma utseende som
   "Exkludera från TCO-kalkylen" under Drivmedelskostnad. */
.TcoForm--calculator .TcoSliderField label.TcoFuelExclude.TcoResidualExclude {
    position:relative;
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    width:100% !important;
    box-sizing:border-box;
    cursor:pointer;
    margin:0 0 14px 0 !important;
    padding:0 0 14px 0 !important;
    border:0;
    border-bottom:1px solid #dedede;
    background:transparent;
    font-family:ToyotaType-Book, ToyotaType-Regular, Arial, sans-serif !important;
    font-size:14px !important;
    font-weight:normal !important;
    line-height:19px !important;
    color:#282830 !important;
}

.TcoForm--calculator .TcoSliderField label.TcoFuelExclude.TcoResidualExclude > input {
    position:absolute !important;
    opacity:0 !important;
    pointer-events:none !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:0 !important;
}

.TcoForm--calculator .TcoSliderField label.TcoFuelExclude.TcoResidualExclude > .TcoFuelExclude__control {
    display:block !important;
    flex:0 0 38px !important;
    width:38px !important;
    min-width:38px !important;
    height:22px !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:999px !important;
    background:#cfcfcf !important;
    position:relative !important;
    box-sizing:border-box !important;
}

.TcoForm--calculator .TcoSliderField label.TcoFuelExclude.TcoResidualExclude > .TcoFuelExclude__control::after {
    content:"" !important;
    position:absolute !important;
    left:3px !important;
    top:3px !important;
    width:16px !important;
    height:16px !important;
    border-radius:50% !important;
    background:#fff !important;
    box-shadow:0 1px 3px rgba(0,0,0,.22) !important;
    transition:transform .15s ease !important;
}

.TcoForm--calculator .TcoSliderField label.TcoFuelExclude.TcoResidualExclude > input:checked + .TcoFuelExclude__control {
    background:#282830 !important;
}

.TcoForm--calculator .TcoSliderField label.TcoFuelExclude.TcoResidualExclude > input:checked + .TcoFuelExclude__control::after {
    transform:translateX(16px) !important;
}

/* Statiska TCO-rubriker: inga summary/details => ingen browser-toggle alls. */
.TcoAccordion--compact > .TcoAccordionStaticHeader {
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:54px;
    padding:0 20px 0 19px;
    margin:0 0 10px 0;
    border:0;
    cursor:default;
    font-family:ToyotaType-Regular, ToyotaType-Book, Arial, sans-serif;
    font-size:24px;
    line-height:30px;
    letter-spacing:-0.01em;
    color:#282830;
    position:relative;
}

.TcoPriceSection > .TcoAccordionStaticHeader,
.TcoFuelSection > .TcoAccordionStaticHeader {
    margin-bottom:2px;
}

.TcoAccordion > .TcoAccordionStaticHeader .TcoInfo {
    margin-left:8px;
}

@media only screen and (max-width:760px) {
    .TcoAccordion--compact > .TcoAccordionStaticHeader {
        min-height:50px;
        padding-left:12px;
        padding-right:14px;
        font-size:22px;
        line-height:28px;
        margin-bottom:10px;
    }

    .TcoPriceSection > .TcoAccordionStaticHeader,
    .TcoFuelSection > .TcoAccordionStaticHeader {
        margin-bottom:2px;
    }

    .TcoForm--calculator .TcoSliderField label.TcoFuelExclude.TcoResidualExclude {
        padding-bottom:12px !important;
        font-size:13px !important;
        line-height:19px !important;
    }
}

/*************** FINANSPRODUKT - CHECKBOXIKON V6 ***************/

.TcoFinanceProduct__button {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
}

/* Tom checkbox för ej vald produkt. */
.TcoFinanceProduct__button::before {
    content:"";
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 20px;
    width:20px;
    height:20px;
    box-sizing:border-box;
    border:2px solid #7b7c80;
    border-radius:2px;
    background:#fff;
    color:#282830;
    font-family:Arial, Helvetica, sans-serif;
    font-size:15px;
    font-weight:700;
    line-height:16px;
    transition:
        background .16s ease,
        border-color .16s ease,
        color .16s ease,
        transform .16s ease;
}

/* Aktiv finansprodukt får en tydlig ikryssad checkbox. */
.TcoFinanceProduct__button.is-active::before {
    content:"✓";
    border-color:#fff;
    background:#fff;
    color:#282830;

}

@media only screen and (max-width:760px) {
    .TcoFinanceProduct__button {
        gap:8px;
        padding-left:10px;
        padding-right:10px;
    }

    .TcoFinanceProduct__button::before {
        flex-basis:18px;
        width:18px;
        height:18px;
        font-size:14px;
        line-height:14px;
    }
}