/* Форма подбора по автомобилю (KoleSize) — адаптация main.css из examples/autoforms/variant1.
   Селекторы ограничены блоком .kolesize-block, чтобы не затрагивать стили сайта. */

/* Форма подбора */
.kolesize-block{font:15px Arial, Helvetica, sans-serif; color:#000000; margin-bottom:15px;}
.kolesize-block .formhead{background:#EEEEEE; border:1px #CCCCCC solid; padding:11px 20px 20px 20px; border-radius:5px; margin-bottom:-10px;}
.kolesize-block .searchform{background:#F8F8F8; border:1px #CCCCCC solid; padding:22px 20px; border-radius:5px; margin-bottom:15px;}
.kolesize-block .searchform div.element{height:36px;}
.kolesize-block .searchform div.element div.name{float:left; width:150px; padding-top:2px;}
.kolesize-block .searchform div.element select{width:270px; max-width:70%; height:28px; font:14px Arial, Helvetica, sans-serif; color:#000000; padding:0px 3px; background:#FFFFFF; border:1px #AAAAAA solid; border-radius:3px;}
.kolesize-block .searchform div.element select.disabled{color:#888888; background:#EEEEEE;}
.kolesize-block .searchform div.submit{margin-top:8px;}
.kolesize-block .searchform div.submit input{width:150px; height:30px; margin-left:150px; font:15px Arial, Helvetica, sans-serif; color:#FFFFFF; background:#57872D; border:1px #4A7026 solid; border-radius:3px; cursor:pointer;}

/* Результат подбора: ошибки */
.kolesize-block .ks-error{background:#FFE2DD; border:1px #D9928A solid; color:#BB3322; border-radius:5px; padding:10px 14px; margin:10px 0 15px 0;}

/* Результат подбора: шапка с автомобилем */
.kolesize-block .ks-result{margin-bottom:15px;}
.kolesize-block .ks-car{font:bold 18px Arial, Helvetica, sans-serif; color:#222222; margin:15px 0 10px 0; padding-bottom:8px; border-bottom:2px solid #57872D;}
.kolesize-block .ks-region{font:normal 13px Arial, Helvetica, sans-serif; color:#888888; white-space:nowrap;}

/* Результат подбора: общие параметры модификации */
.kolesize-block .ks-specs{display:flex; flex-wrap:wrap; gap:6px; margin:0 0 14px 0; padding:0;}
.kolesize-block .ks-spec{display:inline-flex; align-items:baseline; gap:6px; background:#F4F8F0; border:1px solid #DDE8D2; border-radius:4px; padding:4px 10px; font:13px Arial, Helvetica, sans-serif;}
.kolesize-block .ks-spec .ks-label{color:#7A8B6C;}
.kolesize-block .ks-spec .ks-value{font-weight:bold; color:#222222;}
.kolesize-block .ks-spec .ks-value.red{color:#DD2200;}

/* Результат подбора: варианты колес */
.kolesize-block .ks-head{font:bold 16px Arial, Helvetica, sans-serif; color:#333333; margin:18px 0 8px 0;}
.kolesize-block .ks-rows{display:grid; gap:8px;}
.kolesize-block .ks-row{display:flex; background:#FFFFFF; border:1px solid #E2E2E2; border-radius:6px; overflow:hidden;}
.kolesize-block .ks-cell{flex:1 1 50%; min-width:0; padding:10px 14px;}
.kolesize-block .ks-cell-tyres{border-right:1px dashed #E2E2E2;}
.kolesize-block .ks-cell-title{font:11px Arial, Helvetica, sans-serif; text-transform:uppercase; letter-spacing:.06em; color:#999999; margin-bottom:6px;}
.kolesize-block .ks-line{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:5px 0;}
.kolesize-block .ks-pos{color:#888888; font:13px Arial, Helvetica, sans-serif;}
.kolesize-block .ks-size{font:bold 15px Arial, Helvetica, sans-serif; color:#222222;}
.kolesize-block .ks-links{margin-left:auto; display:inline-flex; gap:6px;}
.kolesize-block .ks-btn{display:inline-block; font:13px/1 Arial, Helvetica, sans-serif; text-decoration:none; border-radius:3px; padding:6px 10px; border:1px solid transparent;}
.kolesize-block .ks-btn-summer{color:#4F7A2A; background:#F4FAEE; border-color:#C9E0B4;}
.kolesize-block .ks-btn-summer:hover,.kolesize-block .ks-btn-summer:focus{background:#E8F4DC; color:#4F7A2A; text-decoration:none;}
.kolesize-block .ks-btn-winter{color:#33658E; background:#EFF6FC; border-color:#BCD7EC;}
.kolesize-block .ks-btn-winter:hover,.kolesize-block .ks-btn-winter:focus{background:#E1EFF9; color:#33658E; text-decoration:none;}
.kolesize-block .ks-btn-rim{color:#FFFFFF; background:#57872D; border-color:#4A7026;}
.kolesize-block .ks-btn-rim:hover,.kolesize-block .ks-btn-rim:focus{background:#4A7026; color:#FFFFFF; text-decoration:none;}

/* Результат подбора: узкие экраны */
@media (max-width:700px){
	.kolesize-block .ks-row{flex-direction:column;}
	.kolesize-block .ks-cell-tyres{border-right:none; border-bottom:1px dashed #E2E2E2;}
	.kolesize-block .ks-links{margin-left:0;}
}
