/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 12/09/2018, 14:19:16
    Author     : Aldana
*/
.switch-field {
    font-family: "Lucida Grande", Tahoma, Verdana, sans-serif;
    overflow: hidden;
    padding: 0 1em;
}

.switch-title {
    margin-bottom: 6px;
}

.switch-field input {
    position: absolute !important;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    width: 1px;
    border: 0;
    overflow: hidden;
}

.switch-field label {
  float: left;
}

.switch-field label {
  display: inline-block;
  width: 50%;
  background-color: #ffffff;
  font-size: 0.8em;
  text-align: center;
  color: #000000;
  font-weight: normal;
  text-align: center;
  text-shadow: none;
  padding: 1em 0em;
  border: solid 1px #eaeaea;
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition:    all 0.1s ease-in-out;
  -ms-transition:     all 0.1s ease-in-out;
  -o-transition:      all 0.1s ease-in-out;
  transition:         all 0.1s ease-in-out;
  text-transform: uppercase;
  
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.switch-field label:hover {
	cursor: pointer;
}

.switch-field input:checked + label {
  background-color: #ff0010;
  border: solid 1px #ff0010;
  font-family: Nunito;
  font-size: 0.8em;
  color: #ffffff;
}

.switch-field label:first-of-type {
  border-radius: 5px 0 0 5px;
}

.switch-field label:last-of-type {
  border-radius: 0 5px 5px 0;
}

.switch-field-lista {
    font-family: "Lucida Grande", Tahoma, Verdana, sans-serif;
    /*overflow: hidden;*/
    padding: 0 1em;
    line-height: 2em;
}

.switch-field-lista input {
    position: absolute !important;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    width: 1px;
    border: 0;
    overflow: hidden;
}

.switch-field-lista label {
  float: left;
  height: 6em;
}

.switch-field-lista label {
    height: 8em;
  display: inline-block;
  text-align: justify;
  color: #000000;
  font-weight: normal;
  text-shadow: none;
  padding: 1em 1px 1px 6em;
  margin: 1em auto;
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition:    all 0.1s ease-in-out;
  -ms-transition:     all 0.1s ease-in-out;
  -o-transition:      all 0.1s ease-in-out;
  transition:         all 0.1s ease-in-out;

    background-repeat: no-repeat;
    background-position-y: bottom;
}

.switch-field-lista label span{
    font-family: Nunito;
    text-align: center;
}

.switch-field-lista label span.verde{
    color: #3cb54a;
}

.switch-field-lista label:hover {
	cursor: pointer;
}

.switch-field-lista label p.fondo-negro {
    color: #fff;
    text-transform: uppercase;
    font-size: 0.75em;
    font-family: SFProText-Semibold;
    text-align: right;
    line-height:2em;
}

.switch-field-lista label p.fondo-negro > span{
    background-color: #000;
    padding: 0.2em 0em;
}

.switch-field-lista label{
    background-position: left center;
}

body::after{
   position:absolute; width:0; height:0; overflow:hidden; z-index:-1;
   content: url("/img/checkout/Chek_ok_seleccionado-01-01.svg") url("/img/checkout/Delivery_Seleccionado-04.svg") url("/img/checkout/pickUp_seleccionado-06.svg") url("/img/checkout/Delivery-03.svg") url("/img/checkout/PickUp-05.svg") url("/img/checkout/Efectivo_seleccionado-08.svg")url("/img/checkout/PayU_seleccionado-10.svg") url("/img/checkout/MercadoPago_seleccionado-12.svg") url("/img/checkout/Efectivo-7.svg") url("/img/checkout/PayU-09.svg") url("/img/checkout/MercadoPago-11.svg") url("/img/checkout/delivery-verde.svg") url("/img/checkout/pickup-verde.svg");
}

.switch-field-lista input[name="CheckOutForm[forma_entrega]"]:checked + label > span.check-verde{
  background-image: url("/img/checkout/Chek_ok_seleccionado-01-01.svg");
  background-repeat: no-repeat;
  left: -2.5em;
  top: 4em;
  float: left;
  position: relative;
}

.switch-field-lista input[name="CheckOutForm[forma_entrega]"][value="delivery"]:checked + label{
  background-image: url("/img/checkout/Delivery_Seleccionado-04.svg");
}

.switch-field-lista input[name="CheckOutForm[forma_entrega]"][value="pickup"]:checked + label{
  background-image: url("/img/checkout/pickUp_seleccionado-06.svg");
}

.switch-field-lista label[for="envio_delivery"] {
  background-image: url("/img/checkout/Delivery-03.svg");
  background-size: 4em;
}

.switch-field-lista label[for="envio_pickup"] {
  background-image: url("/img/checkout/PickUp-05.svg");
  background-size: 4em;
}

.switch-field-lista input[name="forma_entrega"][value="delivery"]:checked + label{
  background-image: url("/img/checkout/Delivery_Seleccionado-04.svg");
}

.switch-field-lista input[name="forma_entrega"][value="pickup"]:checked + label{
  background-image: url("/img/checkout/pickUp_seleccionado-06.svg");
}

.switch-field-lista label[for="envio_delivery2"] {
  background-image: url("/img/checkout/Delivery-03.svg");
}

.switch-field-lista label[for="envio_pickup2"] {
  background-image: url("/img/checkout/PickUp-05.svg");
  background-size: 4em;
}

.switch-field-lista label[for="envio_delivery_modal"] {
  background-image: url("/img/checkout/Delivery-03.svg");
  background-size: 4em;
}

.switch-field-lista label[for="envio_pickup_modal"] {
  background-image: url("/img/checkout/PickUp-05.svg");
  background-size: 4em;
}

.switch-field-lista label[for="envio_pickup_modal2"] {
  background-image: url("/img/checkout/PickUp-05.svg");
  background-size: 4em;
}

.switch-field-lista input[name="UbicacionForm[forma_entrega]"][value="delivery"]:checked + label, .switch-field-lista input[name="UbicacionAForm[forma_entrega]"][value="delivery"]:checked + label{
  background-image: url("/img/checkout/delivery-verde.svg");
  background-size: 4em;
}

.switch-field-lista input[name="UbicacionForm[forma_entrega]"][value="pickup"]:checked + label, .switch-field-lista input[name="UbicacionAForm[forma_entrega]"][value="pickup"]:checked + label{
  background-image: url("/img/checkout/pickup-verde.svg");
  background-size: 4em;
}

.switch-field-lista input[name="CheckOutForm[forma_pago]"]:checked + label > span.check-verde{
  background-image: url("/img/checkout/Chek_ok_seleccionado-01-01.svg");
  background-repeat: no-repeat;
  left: -2.5em;
  top: 4em;
  float: left;
  position: relative;
}

.switch-field-lista input[name="CheckOutForm[forma_pago]"][value="1"]:checked + label {
  background-image: url("/img/checkout/Efectivo_seleccionado-08.svg");
}

.switch-field-lista input[name="CheckOutForm[forma_pago]"][value="6"]:checked + label, .switch-field-lista input[name="PagoForm[forma_pago]"][value="6"]:checked + label {
  background-image: url("/img/checkout/PayU_seleccionado-10.svg");
}

.switch-field-lista input[name="CheckOutForm[forma_pago]"][value="13"]:checked + label,.switch-field-lista input[name="PagoForm[forma_pago]"][value="13"]:checked + label {
  background-image: url("/img/checkout/MercadoPago_seleccionado-12.svg");
}

.switch-field-lista label[for="forma_pago_efectivo"] {
  background-image: url("/img/checkout/Efectivo-7.svg");
}

.switch-field-lista label[for="forma_pago_tarjeta"] {
  background-image: url("/img/checkout/PayU-09.svg");
}

.switch-field-lista label[for="forma_pago_mercadopago"] {
  background-image: url("/img/checkout/MercadoPago-11.svg");
}

.switch-field-lista input[name="ProductoLandingForm[media_porcion]"] + label > span.check-verde{
  background-image: url("/img/check-off.svg");
  background-repeat: no-repeat;
  background-size:1.5em;
  left: -0.5em;
  float: left;
  position: relative;
  width: 2em;
  top: 0.3em;
  
}

.switch-field-lista input[name="ProductoLandingForm[media_porcion]"]:checked + label > span.check-verde{
  background-image: url("/img/checkout/Chek_ok_seleccionado-01-01.svg");
  background-repeat: no-repeat;
}