/* AdvRider modification — compact Select2 for city, country and county (FO).
   Closed height matches OPC address inputs (40px, #e3e3e3). JS puts .form-control
   on .select2-selection for focus/form-ok; ETS/Warehouse padding on that class
   (6px 12px / 0.6rem 1rem) must not stack with Select2 line-height or the
   dropdowns grow taller than Adresă / Cod postal / Telefon. */

.citydropdown-scope,
.citydropdown-s2{
  width:100%;
  position:relative;
}
.citydropdown-scope .select2-container,
.citydropdown-s2 .select2-container{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
}
.citydropdown-scope .select2-container .select2-selection,
.citydropdown-s2 .select2-container .select2-selection{
  min-height:40px!important;
  height:40px!important;
  max-height:40px!important;
  /* Rest chrome comes from .form-control (theme #e3e3e3), not COLOR3 #000. */
  border:1px solid #e3e3e3!important;
  border-radius:4px!important;
  display:flex!important;
  align-items:center!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
  position:relative!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.citydropdown-scope .select2-container .select2-selection--single,
.citydropdown-s2 .select2-container .select2-selection--single{
  height:40px!important;
  max-height:40px!important;
  padding:0!important;
  background-image:none!important;
  background-color:#fff!important;
  background-repeat:no-repeat!important;
}
.citydropdown-scope .select2-container .select2-selection--single .select2-selection__rendered,
.citydropdown-s2 .select2-container .select2-selection--single .select2-selection__rendered{
  /* ets_geolocation paints #f6f6f6 on every Select2 rendered span. Flex
     align-items:center shrinks that span to the text, so the field looks
     half gray. Stretch it and keep the selection's white background. */
  background:transparent!important;
  background-color:transparent!important;
  width:100%!important;
  flex:1 1 auto!important;
  min-width:0!important;
  box-sizing:border-box!important;
  line-height:38px!important;
  padding-top:0!important;
  padding-bottom:0!important;
  padding-left:12px!important;
  padding-right:36px!important;
  /* Theme .form-control color (shops differ). JS sets --citydropdown-fg from a
     neighbouring address input so the body-attached open list matches too. */
  color:var(--citydropdown-fg, inherit)!important;
  font-size:14px!important;
  font-family:"Open sans","Open Sans",sans-serif!important;
  font-weight:400!important;
  text-transform:none!important;
}
.citydropdown-scope .select2-container .select2-selection--single .select2-selection__placeholder,
.citydropdown-s2 .select2-container .select2-selection--single .select2-selection__placeholder{
  color:var(--citydropdown-fg, inherit)!important;
}
.citydropdown-scope .select2-container .select2-selection--single.select2-selection--clearable .select2-selection__rendered,
.citydropdown-s2 .select2-container .select2-selection--single.select2-selection--clearable .select2-selection__rendered{
  padding-right:58px!important;
}
.citydropdown-scope .select2-container .select2-selection--single .select2-selection__arrow,
.citydropdown-s2 .select2-container .select2-selection--single .select2-selection__arrow{
  height:100%!important;
  top:0!important;
  right:4px!important;
  width:22px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  z-index:2!important;
  pointer-events:none!important;
}
/* Select2's 5px gray triangle disappears next to a filled value.
   Draw a 2px chevron that stays visible when the field is complete. */
.citydropdown-scope .select2-container .select2-selection--single .select2-selection__arrow b,
.citydropdown-s2 .select2-container .select2-selection--single .select2-selection__arrow b{
  position:static!important;
  margin:0!important;
  left:auto!important;
  top:auto!important;
  width:8px!important;
  height:8px!important;
  border:0!important;
  border-right:2px solid #3a3a3a!important;
  border-bottom:2px solid #3a3a3a!important;
  transform:rotate(45deg) translateY(-3px)!important;
  background:transparent!important;
  display:block!important;
}
.citydropdown-scope .select2-container--open .select2-selection--single .select2-selection__arrow b,
.citydropdown-s2 .select2-container--open .select2-selection--single .select2-selection__arrow b{
  transform:rotate(-135deg) translateY(-1px)!important;
  border-right-color:#3a3a3a!important;
  border-bottom-color:#3a3a3a!important;
}
.citydropdown-scope .select2-container .select2-selection--single .select2-selection__clear,
.citydropdown-s2 .select2-container .select2-selection--single .select2-selection__clear{
  position:absolute!important;
  right:30px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  margin:0!important;
  height:22px!important;
  width:22px!important;
  line-height:20px!important;
  float:none!important;
  font-family:Arial,sans-serif!important;
  font-size:20px!important;
  font-weight:700!important;
  color:#3a3a3a!important;
  z-index:3!important;
  cursor:pointer!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}
/* OPC draws a green form-ok check on the column. City's column does not
   carry citydropdown-s2, so match any column that contains Select2.
   Text inputs (postal) keep their check. */
.opc_field_right.form-ok:has(.select2-container)::before,
.opc_field_right.form-error:has(.select2-container)::before{
  content:none!important;
  display:none!important;
}
.citydropdown-scope select[multiple],
.citydropdown-s2 select[multiple]{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  min-height:0!important;
  max-height:1px!important;
  overflow:hidden!important;
  padding:0!important;
  border:0!important;
  clip:rect(0,0,0,0)!important;
}

/* Hide native <select> once Select2 is on (Warehouse :valid paints a green
   check + CSS chevron; ETS .ets_opc_select_arrow would double the caret). */
.citydropdown-scope select.select2-hidden-accessible,
.citydropdown-scope select.form-control,
.citydropdown-scope select.form-control:valid,
.citydropdown-scope select.form-control.is-valid,
.citydropdown-scope select.form-control:invalid,
.citydropdown-s2 select.select2-hidden-accessible,
.citydropdown-s2 select.form-control,
.citydropdown-s2 select.form-control:valid,
.citydropdown-s2 select.form-control.is-valid,
.citydropdown-s2 select.form-control:invalid{
  background-image:none!important;
  background-color:transparent!important;
}
.citydropdown-scope:has(.select2-container) > select,
.citydropdown-s2:has(.select2-container) > select{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  min-height:0!important;
  max-height:1px!important;
  overflow:hidden!important;
  padding:0!important;
  border:0!important;
  clip:rect(0,0,0,0)!important;
  opacity:0!important;
  pointer-events:none!important;
}
.citydropdown-s2 > .ets_opc_select_arrow{
  display:none!important;
}

/* ets_geolocation sets every .select2-container to z-index:99999.
   !important 20050 on --open put the body dropdown UNDER the closed
   Județ / Oraș fields. Stay above 99999 and under Warehouse modals (999996). */
body > .select2-container--open{
  z-index:100000!important;
}
.select2-container--open .select2-dropdown{
  border-color:#e3e3e3;
}
.select2-container--open .select2-search--dropdown .select2-search__field{
  border:1px solid #e3e3e3;
  height:36px!important;
  padding:4px 10px!important;
  outline:none!important;
  box-shadow:none!important;
}

/* Dropdown is attached to body (not clipped), so it inherits the
   accessibility-widget font (Hanken Grotesk) and html 12px on mobile.
   Closed field is Open Sans 14px — keep the open list the same. */
.select2-dropdown.citydropdown-s2-drop,
.select2-dropdown.citydropdown-s2-drop .select2-results,
.select2-dropdown.citydropdown-s2-drop .select2-results__option,
.select2-dropdown.citydropdown-s2-drop .select2-search--dropdown .select2-search__field{
  font-family:"Open sans","Open Sans",sans-serif!important;
  font-size:14px!important;
  font-weight:400!important;
  line-height:1.4!important;
  color:var(--citydropdown-fg, inherit)!important;
}
.select2-dropdown.citydropdown-s2-drop .select2-search--dropdown{
  padding:8px!important;
}
.select2-dropdown.citydropdown-s2-drop .select2-search--dropdown .select2-search__field{
  height:40px!important;
  min-height:40px!important;
  padding:8px 12px!important;
  border:1px solid #e3e3e3!important;
  border-radius:4px!important;
  background:#fff!important;
  box-sizing:border-box!important;
  outline:none!important;
  box-shadow:none!important;
}
.select2-dropdown.citydropdown-s2-drop .select2-search--dropdown .select2-search__field:focus,
.select2-dropdown.citydropdown-s2-drop .select2-search--dropdown .select2-search__field:focus-visible{
  border-color:#e3e3e3!important;
  outline:none!important;
  box-shadow:none!important;
}
.select2-dropdown.citydropdown-s2-drop .select2-results__option{
  padding:10px 12px!important;
  min-height:40px!important;
  box-sizing:border-box!important;
  background:transparent!important;
  color:var(--citydropdown-fg, inherit)!important;
}
.select2-dropdown.citydropdown-s2-drop .select2-results__option--highlighted,
.select2-dropdown.citydropdown-s2-drop .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[aria-selected]{
  background:#f2f2f2!important;
  color:var(--citydropdown-fg, inherit)!important;
}

/* Address text + Select2 share theme .form-control rest (#e3e3e3).
   ETS COLOR3 is #000 on this shop (card + inputs) — that is the strident
   OPC look. Warehouse :valid also paints black + an extra check;
   OPC .form-ok:before on the column is enough. */
#form_ets_onepagecheckout .js-address-form input.form-control,
#form_ets_onepagecheckout .js-address-form input.form-control:valid,
#form_ets_onepagecheckout .js-address-form input.form-control.is-valid,
#form_ets_onepagecheckout .js-address-form textarea.form-control,
#form_ets_onepagecheckout .js-address-form .select2-selection.form-control,
#form_ets_onepagecheckout .block-customer input.form-control,
#form_ets_onepagecheckout .block-customer input.form-control:valid{
  border:1px solid #e3e3e3!important;
  background-image:none!important;
  box-shadow:none!important;
  font-size:14px!important;
  font-family:"Open sans","Open Sans",sans-serif!important;
  font-weight:400!important;
}

/* Beat ETS `.js-address-form .form-control { padding: 6px 12px !important }`
   so country/county/city stay the same 40px box as neighbouring inputs. */
#form_ets_onepagecheckout .js-address-form .citydropdown-scope .select2-selection.form-control,
#form_ets_onepagecheckout .js-address-form .citydropdown-s2 .select2-selection.form-control,
#form_ets_onepagecheckout .js-address-form .citydropdown-scope .select2-selection--single.form-control,
#form_ets_onepagecheckout .js-address-form .citydropdown-s2 .select2-selection--single.form-control{
  height:40px!important;
  min-height:40px!important;
  max-height:40px!important;
  padding:0!important;
  box-sizing:border-box!important;
}

/* No OPC cyan (#2fb5d2) and no browser focus ring on Select2. Rest chrome #e3e3e3. */
#form_ets_onepagecheckout .js-address-form .select2-container--open .select2-selection.form-control,
#form_ets_onepagecheckout .js-address-form .select2-container--focus .select2-selection.form-control{
  border-color:#e3e3e3!important;
  box-shadow:none!important;
  outline:none!important;
}

/* AdvRider modification — stacked OPC labels (layout 1). Lives here because
   Iqit CCC concatenates after invalid `//` comments and nested `form#` rules
   are dropped. 6px under the name, 14px between fields — not the vendor 40px
   leftover min-height, not 4px/8px cramped. */
#form_ets_onepagecheckout.layout_1 .js-address-form label.form-control-label,
#form_ets_onepagecheckout.layout_1 .block-customer label.form-control-label,
#form_ets_onepagecheckout.layout_1 .block-additional-info label.form-control-label{
  min-height:0!important;
  height:auto!important;
  padding-top:0!important;
  padding-bottom:0!important;
  margin-bottom:6px!important;
  line-height:1.4;
  font-size:14px!important;
  font-family:"Open sans","Open Sans",sans-serif!important;
  font-weight:400!important;
}
#form_ets_onepagecheckout.layout_1 .js-address-form .form-group.row,
#form_ets_onepagecheckout.layout_1 .block-customer .form-group.row{
  margin-bottom:14px!important;
}

/* AdvRider modification — OPC carrier logo left of the name (layout 1).
   Logo is a sibling AFTER .carrier-name; row-reverse puts it on the left.
   Lives here because Iqit CCC can keep the text but drop these rules from CSSOM. */
#form_ets_onepagecheckout .block-shipping .row.delivery-option{
  display:block;
  width:100%;
  margin-left:0;
  margin-right:0;
}
#form_ets_onepagecheckout .block-shipping label.delivery-option-2{
  display:block;
  width:100%!important;
  max-width:100%!important;
  flex:0 0 100%;
  padding-left:0!important;
  padding-right:0!important;
  box-sizing:border-box;
}
#form_ets_onepagecheckout .block-shipping .delivery-option-2>.row{
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  width:100%;
  margin:0;
  position:relative;
}
#form_ets_onepagecheckout .block-shipping .left_content{
  display:flex;
  align-items:center;
  flex:0 1 auto;
  min-width:0;
  width:auto;
  max-width:58%;
  padding-left:0!important;
  padding-right:8px!important;
}
#form_ets_onepagecheckout .block-shipping .carrier-name-img{
  display:flex!important;
  align-items:center;
  flex-direction:row-reverse;
  justify-content:flex-end;
  gap:10px;
}
#form_ets_onepagecheckout .block-shipping .carrier-name-img>div{
  display:flex;
  align-items:center;
  flex:0 0 auto;
}
#form_ets_onepagecheckout .block-shipping .carrier-name-img img{
  width:50px!important;
  max-height:36px;
  height:auto;
  object-fit:contain;
  margin:0!important;
  display:block;
}
#form_ets_onepagecheckout .block-shipping .carrier-name-img .carrier-name{
  margin:0;
  padding:0;
  line-height:1.3;
}
#form_ets_onepagecheckout .block-shipping .right_content{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center;
  text-align:right;
  flex:1 1 0;
  min-width:0;
  width:auto;
  max-width:none;
  padding-left:8px!important;
  padding-right:0!important;
  position:static;
  top:auto;
  right:auto;
  transform:none;
}
#form_ets_onepagecheckout .block-shipping .carrier-price,
#form_ets_onepagecheckout .block-shipping .carrier-delay{
  display:block;
  width:100%;
  text-align:right;
  white-space:normal;
  overflow-wrap:break-word;
}
@media (max-width:767px){
  #form_ets_onepagecheckout .block-shipping .right_content{
    max-width:none;
    width:auto;
    padding-left:8px!important;
    padding-right:0!important;
  }
  #form_ets_onepagecheckout .block-shipping .left_content{
    max-width:50%;
    padding-right:6px!important;
  }
  #form_ets_onepagecheckout .block-shipping .carrier-name-img img{
    width:42px!important;
    max-height:30px;
  }
}

/* Google's .pac-container is position:absolute and, on Safari with the keyboard
   open, its top lands on the address input. JS pins it; this only keeps it
   above the form and scrollable if that pin is late. */
.pac-container{
  z-index:100010!important;
  max-height:220px;
  overflow-y:auto;
  box-sizing:border-box;
}

/* Places suggestions. Fixed to the address field; above Select2 (100000), under modals. */
.citydropdown-places[hidden]{
  display:none !important;
}
html.cd-own-places .pac-container{
  display:none !important;
}
.citydropdown-places{
  position:fixed;
  z-index:100010;
  box-sizing:border-box;
  margin:0;
  padding:4px 0 0;
  background:#fff;
  border:1px solid #e3e3e3;
  border-radius:4px;
  box-shadow:0 6px 16px rgba(0,0,0,.12);
  max-height:260px;
  overflow:auto;
  font-family:"Open Sans",sans-serif;
  font-size:14px;
  line-height:1.35;
  color:#232323;
}
.citydropdown-places-item{
  display:block;
  width:100%;
  margin:0;
  padding:8px 12px;
  border:0;
  background:transparent;
  text-align:left;
  font:inherit;
  color:inherit;
  cursor:pointer;
}
.citydropdown-places-item.is-active,
.citydropdown-places-item:hover{
  background:#f2f2f2;
}
.citydropdown-places-attr{
  display:flex;
  justify-content:flex-end;
  padding:2px 8px 6px;
}
.citydropdown-places-attr img{
  height:14px;
  width:auto;
}