:root {
  --ink: #182230;
  --muted: #5b6675;
  --line: #d9dee5;
  --paper: #ffffff;
  --accent: #29363e;
  --accent-soft: #e8f2f3;
  --primary:#1689fd;
  --pin: #1689fd;
  --i-phone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23000' viewBox='0 0 16 16'%3E%3Cpath d='M3.654 1.328a.678.678 0 0 0-1.015-.063L1.605 2.3c-.483.484-.661 1.169-.45 1.77a17.6 17.6 0 0 0 4.168 6.608 17.6 17.6 0 0 0 6.608 4.168c.601.211 1.286.033 1.77-.45l1.034-1.034a.678.678 0 0 0-.063-1.015l-2.307-1.794a.68.68 0 0 0-.58-.122l-2.19.547a1.75 1.75 0 0 1-1.657-.459L5.482 8.062a1.75 1.75 0 0 1-.46-1.657l.548-2.19a.68.68 0 0 0-.122-.58zM1.884.511a1.745 1.745 0 0 1 2.612.163L6.29 2.98c.329.423.445.974.315 1.494l-.547 2.19a.68.68 0 0 0 .178.643l2.457 2.457a.68.68 0 0 0 .644.178l2.189-.547a1.75 1.75 0 0 1 1.494.315l2.306 1.794c.829.645.905 1.87.163 2.611l-1.034 1.034c-.74.74-1.846 1.065-2.877.702a18.6 18.6 0 0 1-7.01-4.42 18.6 18.6 0 0 1-4.42-7.009c-.362-1.03-.037-2.137.703-2.877z'/%3E%3C/svg%3E");
  --i-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23000' viewBox='0 0 16 16'%3E%3Cpath d='M2 2a2 2 0 0 0-2 2v8.01A2 2 0 0 0 2 14h5.5a.5.5 0 0 0 0-1H2a1 1 0 0 1-.966-.741l5.64-3.471L8 9.583l7-4.2V8.5a.5.5 0 0 0 1 0V4a2 2 0 0 0-2-2zm3.708 6.208L1 11.105V5.383zM1 4.217V4a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v.217l-7 4.2z'/%3E%3Cpath d='M14.247 14.269c1.01 0 1.587-.857 1.587-2.025v-.21C15.834 10.43 14.64 9 12.52 9h-.035C10.42 9 9 10.36 9 12.432v.214C9 14.82 10.438 16 12.358 16h.044c.594 0 1.018-.074 1.237-.175v-.73c-.245.11-.673.18-1.18.18h-.044c-1.334 0-2.571-.788-2.571-2.655v-.157c0-1.657 1.058-2.724 2.64-2.724h.04c1.535 0 2.484 1.05 2.484 2.326v.118c0 .975-.324 1.39-.639 1.39-.232 0-.41-.148-.41-.42v-2.19h-.906v.569h-.03c-.084-.298-.368-.63-.954-.63-.778 0-1.259.555-1.259 1.4v.528c0 .892.49 1.434 1.26 1.434.471 0 .896-.227 1.014-.643h.043c.118.42.617.648 1.12.648m-2.453-1.588v-.227c0-.546.227-.791.573-.791.297 0 .572.192.572.708v.367c0 .573-.253.744-.564.744-.354 0-.581-.215-.581-.8Z'/%3E%3C/svg%3E");
  --i-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23000' viewBox='0 0 16 16'%3E%3Cpath d='M8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71z'/%3E%3Cpath d='M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m7-8A7 7 0 1 1 1 8a7 7 0 0 1 14 0'/%3E%3C/svg%3E");
  --i-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23000' viewBox='0 0 16 16'%3E%3Cpath d='M12.166 8.94c-.524 1.062-1.234 2.12-1.96 3.07A32 32 0 0 1 8 14.58a32 32 0 0 1-2.206-2.57c-.726-.95-1.436-2.008-1.96-3.07C3.304 7.867 3 6.862 3 6a5 5 0 0 1 10 0c0 .862-.305 1.867-.834 2.94M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10'/%3E%3Cpath d='M8 8a2 2 0 1 1 0-4 2 2 0 0 1 0 4m0 1a3 3 0 1 0 0-6 3 3 0 0 0 0 6'/%3E%3C/svg%3E");
}


.branches {
  width: 100%;
  position:relative;
  border-top: 1px solid #d4d4d4;
  border-bottom: 1px solid #d4d4d4;
}
.branches-map {
  width: 100%;
  height:calc(100vh - 85px);
  overflow: hidden;
  background: #e4e9ee;
  direction: ltr;
}
.branches-map .leaflet-control {
  direction: ltr;
}
.branches-map .leaflet-control-attribution {
  font-size: 10px;
}
.marker {
  width: 30px;
  height: 30px;
  background: var(--pin);
  border: 2px solid #fff;
  border-radius: 50% 50% 50% 0;
  transform: translateY(-6px) rotate(-45deg);
  box-shadow:
    0 3px 8px rgba(20, 34, 48, .35);
  cursor: pointer;
  position: relative;
  transition:
    background-color .15s ease,
    box-shadow .15s ease;
}
.marker::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
}
.marker.is-active {
  background:var(--primary);
  box-shadow:
    0 0 0 5px rgba(10, 92, 102, .22),
    0 3px 8px rgba(20, 34, 48, .35);
}
.marker:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}
.leaflet-custom-marker {
  background: transparent !important;
  border: 0 !important;
}
.card-overlay {
  position: absolute;
  width: 280px;
  max-width: calc(100vw - 48px);
  opacity: 0;
  pointer-events: none;
  transform:
    translate(-50%, -100%)
    translateY(-42px);
  transition:
    opacity .16s ease,
    transform .16s ease;
  z-index: 500;
}
.card-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
  transform:
    translate(-50%, -100%)
    translateY(-50px);
}
.card-overlay::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 14px;
}
.myloc-card {
  position: relative;
  font-size: 13.5px;
  background: var(--paper);
  border-radius: 12px;
  padding: 14px 16px;
  box-shadow:
    0 12px 32px rgba(20, 34, 48, .24),
    0 0 0 1px rgba(20, 34, 48, .06);
  display: flex;
  gap: 15px;
  flex-direction: column;
}
.myloc-card::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -7px;
  width: 14px;
  height: 14px;
  background: var(--paper);
  transform:
    translateX(-50%)
    rotate(45deg);
  box-shadow:
    3px 3px 5px rgba(20, 34, 48, .08);
}
.myloc-card .loc-name {
  font-weight: 700;
  font-size: 16px;
  padding-bottom: 8px;
  color: var(--primary);
  border-bottom: 1px solid var(--line);
}
.myloc-card .loc-phone,
.myloc-card .loc-email,
.myloc-card .loc-clock,
.myloc-card .loc-address {
  display: flex;
  gap: 8px;
  color: var(--ink);
  align-items: center;
}
.myloc-card .loc-phone::before,
.myloc-card .loc-email::before,
.myloc-card .loc-clock::before,
.myloc-card .loc-address::before {
  content: "";
  flex: none;
  width: 16px;
  height: 16px;
  background:var(--primary);
  -webkit-mask:
    var(--icon)
    center /
    contain
    no-repeat;
  mask:
    var(--icon)
    center /
    contain
    no-repeat;
}
.myloc-card .loc-phone {
  --icon: var(--i-phone);
}
.myloc-card .loc-email {
  --icon: var(--i-mail);
}
.myloc-card .loc-clock {
  --icon: var(--i-clock);
}
.myloc-card .loc-address {
  --icon: var(--i-pin);
}
.myloc-card .loc-nums {
  display: flex;
  flex-wrap: wrap;
  gap: 0 14px;
}
.myloc-card a {
  color: var(--ink);
  text-decoration: none;
}
.myloc-card a:hover {
  text-decoration: underline;
}
.myloc-card a[href^="tel:"],
.myloc-card a[href^="mailto:"] {
  direction: ltr;
  unicode-bidi: isolate;
  overflow-wrap: anywhere;
}
.myloc-list {
  display: none;
}
.branches-search {
  max-width: 100%;
}
.branches-search label {
  display: block;
  margin-bottom: 6px;
  font-weight: 500;
  font-size: 14px;
}
.combo {
  position: relative;
}
.combo input {
  width: 100%;
  height: 46px;
  padding:0 44px 0 14px;
  font: inherit;
  font-size: 15px;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 10px;
}
.combo input::placeholder {
  color: #8b95a3;
}
.combo input:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
  border-color: var(--accent);
}
.combo-clear {
  position: absolute;
  right: 6px;
  top: 6px;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.combo-clear:hover {
  background: var(--accent-soft);
  color: var(--ink);
}
.combo-clear[hidden] {
  display: none;
}
.combo-list {
  position: absolute;
  z-index: 2000;
  top: calc(100% + 6px);
  right: 0;
  left: 0;
  margin: 0;
  padding: 6px;
  list-style: none;
  max-height: 264px;
  overflow-y: auto;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow:
    0 12px 28px rgba(20, 34, 48, .16);
}
.combo-list[hidden] {
  display: none;
}
.combo-list li {
  padding: 8px 12px;
  border-radius: 8px;
  cursor: pointer;
}
.combo-list li[role="option"].is-active {
  background: var(--accent-soft);
}
.combo-list li .opt-name {
  display: block;
  font-weight: 500;
  font-size: 14px;
}
.combo-list li .opt-addr {
  display: block;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.combo-list .combo-empty {
  color: var(--muted);
  font-size: 13.5px;
  cursor: default;
}
.map-error {
  margin: 0;
  padding: 24px;
  color: #9b2c1a;
}
#branch-list{
  display: none;
}
.branches-sidebar{
  height: calc(100vh - 85px);
  overflow-y: auto;
  padding: 15px;
}
.branches-sidebar .myloc-card::after{
  display: none;
}
.branches-sidebar .myloc-card{
  box-shadow: none;
  transition: 0.4s all;
  border: 1px solid var(--line);
  cursor: pointer;
}
.branches-list{
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 10px;
}
.branch-item.is-active .myloc-card,.branch-item .myloc-card:hover{
  border: 1px solid var(--primary);
}
.branches-sidebar .myloc-card .loc-phone::before, .branches-sidebar .myloc-card .loc-email::before, .branches-sidebar .myloc-card .loc-clock::before, .branches-sidebar .myloc-card .loc-address::before{
  background: var(--primary)!important;
}
.combo-list li{
  border: 1px solid #eee;
  margin-bottom: 5px;
}
.combo-list li:last-child{
  margin: 0;
}
.rtl .myloc-card{
  direction: rtl;
}
.rtl .combo input{
  padding: 0 14px 0 44px!important;
}
.rtl .combo-clear{
  left: 6px;
  right: inherit;
}
.leaflet-top, .leaflet-bottom,.leaflet-control-container{
	z-index:100;
}






@media (prefers-reduced-motion: reduce) {
  .card-overlay,
  .marker {
    transition: none;
  }
}
@media (max-width: 992px) {
  #branch-list{
    display: block;
  }
  .resnone{
    display: none;
  }
  .branches-sidebar{
    background: none;
    position: absolute;
    width: 100%;
    height: auto;
    top: 0;
    overflow: inherit;
    z-index: 1000;
  }
  .branches-list{
    display: none;
  }
  .leaflet-control-container{
    display: none;
  }
}
@media (max-width: 600px) {
  .card-overlay {
    width: 260px;
    max-width: calc(100vw - 30px);
  }
}