In case of two or more shipping modules at checkout page.
How to Increase the contrast between the selected and non selected shipping module?
How to change the color of selected one?

It is simple CSS. Find the code below in checkout.css file:

  background: #eaebef;
}```

And adjust it to your imagination.

I will try it. Many thanks!

P.S.  Sorry, but I can't see this file. I have only checkout.min.css and checkout.min.css.map ?!

If correct you have a file: includes/templates/(default).catalog/css/checkout.css
In checkout.css about line 130:

#box-checkout-payment .option.active {
  background: #eaebef; /* edit this to your own needs*/
}```
If you don't have this file, probably [b]checkout.min.css[/b] is loaded. You have to find these lines in [b]checkout.min.css[/b]

This is the content of my checkout.min.css:

content{padding:calc(var(--gutter-size)/2)}@media (min-width:768px){#content{padding:var(--gutter-size)}}.loader-wrapper{position:fixed;top:50%;left:10%;right:10%;text-align:center;margin-top:-128px;opacity:.1;z-index:999999}#header{margin:0 auto}#header .customer-service{align-self:center;text-align:end;line-height:150%}@media (min-width:768px){#header .customer-service{font-size:1.25em}}#header .customer-service .title{font-weight:bold;margin:0}#box-checkout-cart .row{margin-bottom:0}#box-checkout-cart [class="col-"]{align-self:center}#box-checkout-cart .headings{font-weight:600;padding:calc(var(--gutter-size)/2) var(--gutter-size);border-bottom:2px solid var(--default-border-color)}#box-checkout-cart .items{margin-bottom:1em}#box-checkout-cart .item{padding:calc(var(--gutter-size)/2) var(--gutter-size);border-bottom:1px solid #e0e0e0}#box-checkout-cart .item:nth-child(odd){background:var(--table-striped-row-background-odd)}#box-checkout-cart .item:nth-child(even){background:var(--table-striped-row-background-even)}#box-checkout-cart .name{font-weight:600}#box-checkout-cart .error{color:#f00}#box-checkout-cart .unit-price,#box-checkout-cart .total-price{font-size:1.1em}#box-checkout-cart .subtotal{font-size:1.5em}#box-checkout-customer fieldset{border:none;padding:0}#box-checkout-customer button[type=submit]:not([disabled]){font-weight:bold;color:#f00;animation:flasher 1s linear infinite}#box-checkout-shipping .thumbnail,#box-checkout-payment .thumbnail{padding:.5em}#box-checkout-shipping .option,#box-checkout-payment .option{position:relative}#box-checkout-shipping .option.btn,#box-checkout-payment .option.btn{padding:12px}#box-checkout-shipping .option:not(.active) .content,#box-checkout-payment .option:not(.active) .content{max-height:0;overflow-y:hidden}#box-checkout-shipping .option:not(.active):not(.disabled),#box-checkout-payment .option:not(.active):not(.disabled){opacity:.75;-webkit-transition:all .25s ease;-moz-transition:all .25s ease;-o-transition:all .25s ease;transition:all .25s ease}#box-checkout-shipping .option .thumbnail,#box-checkout-payment .option .thumbnail{padding:0 !important}#box-checkout-shipping .option .error,#box-checkout-payment .option .error{color:#c00}#box-checkout-shipping .option .content,#box-checkout-payment .option .content{max-height:200px;overflow-x:hidden;overflow-y:auto;text-align:start;transition:all .25s ease}@media (min-width:768px){#box-checkout-shipping .price,#box-checkout-payment .price{position:absolute;display:inline-block;top:calc(var(--gutter-size)/2);right:calc(var(--gutter-size)/2)}}#box-checkout-summary .alert{padding:12px 18px;text-align:center;line-height:24px}#box-checkout-summary input[type=checkbox][required]:not(:checked){animation:flasher 1s linear infinite}/# sourceMappingURL=checkout.min.css.map */

And I don't see this line here?
Litecart 2.4.0

Well, in that case: just add at the bottom of your checkout.min.css these lines:

#box-checkout-payment .option.active {
  background: #eaebef !important; /* edit #eaebef to your own needs*/
}```

@jackmaessen

This really works!  Many thanks!