/* Number Input */

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
}

/* Navbar */

nav {
  z-index: 100;
  backdrop-filter: blur(12px);
}

/* Modal */

.jquery-modal,
.blocker {
  z-index: 9999 !important;
}

/* Avatar */

.avatar-upload .avatar-edit input + label {
  display: flex;
  justify-content: center;
  align-items: center;

  width: 42px;
  height: 42px;

  border-radius: 14px;

  background: linear-gradient(135deg, #2563eb, #3b82f6);

  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.35);

  transition: 0.3s ease;

  z-index: 2;
}

.avatar-upload .avatar-edit input + label:hover {
  transform: scale(1.08);
}

.avatar-upload .avatar-edit input + label:after {
  content: "\2b";
  font-family: "FontAwesome";
  color: #fff;
  font-size: 14px;
  font-weight: 700;
}

.avatar-upload .avatar-preview {
  width: 130px;
  height: 130px;

  position: relative;

  border-radius: 50%;
  overflow: hidden;

  border: 4px solid #fff;

  background: #fff;

  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1),
    0 4px 12px rgba(15, 23, 42, 0.05);

  transition: 0.35s ease;
}

.avatar-upload .avatar-preview:hover {
  transform: translateY(-4px);
}

.avatar-upload .avatar-preview > div {
  width: 100%;
  height: 100%;

  border-radius: 50%;

  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;

  transition: 0.4s ease;
}

.avatar-upload .avatar-preview:hover > div {
  transform: scale(1.08);
}

/* Select */

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;

  width: 100%;
  height: 54px;

  padding: 0 18px;

  border: 1px solid #e5e7eb;
  border-radius: 16px;

  background: #fff;

  font-size: 15px;
  font-weight: 500;

  color: #111827;

  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);

  transition: 0.25s ease;
}

select:focus {
  outline: none;

  border-color: #2563eb;

  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12);
}

select::-ms-expand {
  display: none;
}

select option:disabled {
  color: #c0c0c0;
}

/* İl / İlçe */

#uyeOlIldiv,
#uyeOlIlcediv,
#uyeOlMahallediv {
  border-radius: 16px;
}

#uyeOlIlceDiv {
  display: flex;
  gap: 10px;
}

/* Select Arrow */

.select {
  position: relative;
}

.select::after {
  content: "▼";

  position: absolute;

  right: 16px;
  top: 50%;

  transform: translateY(-50%);

  color: #6b7280;

  pointer-events: none;

  transition: 0.25s ease;
}

.select:hover::after {
  color: #2563eb;
}

/* Loading */

#loading-gif {
  width: 24px;
  height: 24px;
  margin: auto;
}

/* Utility */

.none {
  display: none !important;
}

/* Owl */

.owl-prev,
.owl-next {
  width: 50px;
  height: 50px;

  position: absolute;
  top: 50%;

  transform: translateY(-50%);

  border-radius: 16px;

  background: #fff !important;

  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.1);

  display: flex !important;
  align-items: center;
  justify-content: center;

  transition: 0.25s ease;
}

.owl-prev:hover,
.owl-next:hover {
  transform: translateY(-50%) scale(1.08);
}

.owl-prev {
  left: -25px;
}

.owl-next {
  right: -25px;
}

@media (max-width: 768px) {
  .avatar-upload .avatar-preview {
    width: 110px;
    height: 110px;
  }

  .owl-prev {
    left: -8px;
  }

  .owl-next {
    right: -8px;
  }

  .owl-prev,
  .owl-next {
    width: 42px;
    height: 42px;
    border-radius: 12px;
  }
}