/** Shopify CDN: Minification failed

Line 290:0 Unexpected "/"

**/
/* Adding split-screen login design styles */


.customer.login > h1#recover:target ~ h1#login,
.customer.login > h1#recover:target ~ h1#login + div {
  display: none;
}

/* Hide recover form by default */
.customer.login > h1#recover + div {
  display: none;
}

/* Custom heading for login */
.customer.login > h1#login + div::before {
  content: "Merhaba,";
  display: block;
  font-size: 32px;
  font-weight: 400;
  color: #2d2d2d;
  margin-bottom: 8px;
}

.customer.login > h1#login + div > p:first-of-type::before {
  content: "Giriş yapın ve alışverişe hemen başlayın";
  display: block;
  font-size: 14px;
  font-weight: 400;
  color: #666;
  margin-bottom: 32px;
}

.customer.login > h1#login + div > p:first-of-type {
  font-size: 0;
  margin: 0;
}

/* Custom heading for recover password */
.customer.login > h1#recover + div::before {
  content: "Şifremi Unuttum";
  display: block;
  font-size: 32px;
  font-weight: 400;
  color: #2d2d2d;
  margin-bottom: 8px;
}

.customer.login > h1#recover + div > p::before {
  content: "E-posta adresinizi girin, size şifre sıfırlama bağlantısı gönderelim";
  display: block;
  font-size: 14px;
  color: #666;
  margin-bottom: 32px;
}

.customer.login > h1#recover + div > p {
  font-size: 0;
  margin: 0;
}

/* Form field styling */
.customer.login .field {
  margin: 0 0 20px 0;
  position: relative;
}

.customer.login .field label {
  position: absolute;
  left: 16px;
  top: 14px;
  font-size: 14px;
  color: #666;
  pointer-events: none;
  transition: all 0.2s;
  background: white;
  padding: 0 4px;
}

.customer.login .field input {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  font-size: 15px;
  transition: border-color 0.2s;
  box-sizing: border-box;
  background: white;
  height: 55px;
  box-shadow: none;
}

.customer.login .field input:focus {
  outline: none;
  border-color: #143c74;
}

.customer.login .field input:focus + label,
.customer.login .field input:not(:placeholder-shown) + label {
  top: -8px;
  left: 12px;
  font-size: 12px;
  color: #143c74;
}

/* Password field with eye icon */
.customer.login .field:has(#CustomerPassword) {
  position: relative;
}

.customer.login .field:has(#CustomerPassword)::after {
  content: "";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'%3E%3C/path%3E%3Ccircle cx='12' cy='12' r='3'%3E%3C/circle%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  pointer-events: none;
}

/* Forgot password link */
.customer.login a[href="#recover"] {
  display: block;
  text-align: right;
  font-size: 14px;
  color: #2d2d2d;
  text-decoration: none;
  margin: -10px 0 24px 0;
}

.customer.login a[href="#recover"]:hover {
  text-decoration: underline;
}

/* Submit button */
.customer.login button,
.customer.login button[type="submit"] {
  width: 100%;
  padding: 16px;
  background: #143c74;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  margin: 0 0 24px 0;
  transition: background 0.2s;
  min-height: 50px;
}

.customer.login button:hover {
  background: #143c74;
}

/* Create account link */
.customer.login a[href*="register"] {
  display: inline-block;
  width: 100%;
  text-align: center;
  font-size: 14px;
  color: #2d2d2d;
  text-decoration: none;
  font-weight: 400;
  margin: 0;
}

.customer.login a[href*="register"]::before {
  content: "Hesabınız yok mu? ";
  font-weight: 400;
}

.customer.login a[href*="register"]::after {
  content: " ";
  font-weight: 500;
}

.customer.login a[href*="register"]:hover {
    padding-left: 10px;
    transition-property: all;
    transition-duration: 0.3s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Cancel/back link for recover form */
.customer.login a[href="#login"] {
  display: block;
  text-align: center;
  font-size: 14px;
  color: #2d2d2d;
  text-decoration: none;
  margin-top: 16px;
}

.customer.login a[href="#login"]:hover {
  text-decoration: underline;
}

/* Error and success messages */
.customer.login .form__message,
.customer.login h2.form__message,
.customer.login h3.form__message {
  padding: 12px 16px;
  margin: 0 0 20px 0;
  border-radius: 8px;
  font-size: 14px;
  background: #fef2f2;
  color: #dc2626;
  border: 1px solid #fecaca;
}

.customer.login h3.form__message {
  background: #f0fdf4;
  color: #16a34a;
  border: 1px solid #bbf7d0;
}

.customer.login .form__message .svg-wrapper,
.customer.login h2.form__message .svg-wrapper,
.customer.login h3.form__message .svg-wrapper {
  display: none;
}

.customer.login small.form__message {
  display: block;
  margin-top: 8px;
}

/* Hide guest login section */
.customer.login > div:has(form[action*="guest"]) {
  display: none;
}

/* Shop login button styling */
.customer.login section[name="sign-in-with-shop-provider"] {
  margin-bottom: 20px;
}

.customer.login section[name="sign-in-with-shop-provider"] p {
  text-align: center;
  margin: 16px 0;
  color: #999;
  font-size: 14px;
}


/* Responsive design for mobile */
@media screen and (max-width: 768px) {
  .customer.login {
    flex-direction: column;
  }

  .customer.login::before {
    position: absolute;
  }

  .customer.login::after {
    position: relative;
    width: 100%;
    height: 200px;
  }

  .customer.login > div {
    width: 100%;
    margin-left: 0;
    padding: 40px 24px;
    min-height: auto;
  }

  .customer.login > div > form {
    max-width: 100%;
  }
}

/* End of split-screen login styles */

/* ===================================
   REGISTER PAGE SPLIT-SCREEN STYLES
   =================================== */

/

.customer.register form::after {
  content: "Hesap oluşturun ve alışverişe hemen başlayın";
  display: block;
  font-size: 14px;
  font-weight: 400;
  color: #666;
  margin-bottom: 32px;
}

/* Two-column layout for first and last name */
.customer.register .field:has(#RegisterForm-FirstName),
.customer.register .field:has(#RegisterForm-LastName) {
  width: calc(50% - 8px);
  display: inline-block;
  vertical-align: top;
}

.customer.register .field:has(#RegisterForm-FirstName) {
  margin-right: 16px;
}

/* Form field styling */
.customer.register .field {
  margin: 0 0 20px 0;
  position: relative;
}

.customer.register .field label {
  position: absolute;
  left: 16px;
  top: 14px;
  font-size: 14px;
  color: #666;
  pointer-events: none;
  transition: all 0.2s;
  background: white;
  padding: 0 4px;
}

.customer.register .field input {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  font-size: 15px;
  transition: border-color 0.2s;
  box-sizing: border-box;
  background: white;
  height: 55px;
  box-shadow: none;
}

.customer.register .field input:focus {
  outline: none;
  border-color: #143c74;
}

.customer.register .field input:focus + label,
.customer.register .field input:not(:placeholder-shown) + label {
  top: -8px;
  left: 12px;
  font-size: 12px;
  color: #143c74;
}

/* Phone field with Turkey flag */
.customer.register .field:has(input[type="tel"])::before {
  content: "🇹🇷";
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 18px;
  z-index: 2;
}

.customer.register .field:has(input[type="tel"]) input {
  padding-left: 48px;
}

.customer.register .field:has(input[type="tel"]) label {
  left: 48px;
}

/* Password field with eye icon */
.customer.register .field:has(#RegisterForm-password)::after {
  content: "";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'%3E%3C/path%3E%3Ccircle cx='12' cy='12' r='3'%3E%3C/circle%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  pointer-events: none;
}

/* Collapsible sections styling */
.customer.register details {
  margin: 20px 0;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  padding: 0;
  background: #fafafa;
}

.customer.register details summary {
  padding: 16px;
  cursor: pointer;
  font-size: 14px;
  color: #2d2d2d;
  font-weight: 400;
  user-select: none;
  list-style: none;
  position: relative;
}

.customer.register details summary::-webkit-details-marker {
  display: none;
}

.customer.register details summary::after {
  content: "›";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%) rotate(90deg);
  font-size: 20px;
  transition: transform 0.2s;
}

.customer.register details[open] summary::after {
  transform: translateY(-50%) rotate(270deg);
}

.customer.register details > div {
  padding: 0 16px 16px 16px;
  font-size: 13px;
  color: #666;
  line-height: 1.6;
}

/* Checkbox styling for privacy agreements */
.customer.register .checkbox-wrapper {
  margin: 16px 0;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.customer.register .checkbox-wrapper input[type="checkbox"] {
  width: 20px;
  height: 20px;
  min-width: 20px;
  margin: 2px 0 0 0;
  cursor: pointer;
  accent-color: #143c74;
}

.customer.register .checkbox-wrapper label {
  font-size: 13px;
  color: #666;
  line-height: 1.5;
  cursor: pointer;
  position: static;
  background: none;
  padding: 0;
}

.customer.register .checkbox-wrapper a {
  color: #2d2d2d;
  text-decoration: underline;
}

/* Submit button */
.customer.register button,
.customer.register button[type="submit"] {
  width: 100%;
  padding: 16px;
  background: #143c74;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  margin: 0 0 24px 0;
  transition: background 0.2s;
  min-height: 50px;
}

.customer.register button:hover {
  background: #143c74;
}

.customer.register button:disabled {
  background: #e5e5e5;
  color: #999;
  cursor: not-allowed;
}

/* Sign in link at bottom */
.customer.register form ~ a,
.customer.register a[href*="login"] {
  display: inline-block;
  width: 100%;
  text-align: center;
  font-size: 14px;
  color: #2d2d2d;
  text-decoration: none;
  font-weight: 400;
  margin-top: 20px;
}

.customer.register form ~ a::before,
.customer.register a[href*="login"]::before {
  content: "Hesabınız var mı? ";
  font-weight: 400;
}

.customer.register form ~ a::after,
.customer.register a[href*="login"]::after {
  content: " →";
  font-weight: 500;
}

.customer.register form ~ a:hover,
.customer.register a[href*="login"]:hover {
  text-decoration: underline;
}

/* Error and success messages */
.customer.register .form__message,
.customer.register h2.form__message {
  padding: 12px 16px;
  margin: 0 0 20px 0;
  border-radius: 8px;
  font-size: 14px;
  background: #fef2f2;
  color: #dc2626;
  border: 1px solid #fecaca;
}

.customer.register .form__message .svg-wrapper,
.customer.register h2.form__message .svg-wrapper {
  display: none;
}

.customer.register .form__message ul {
  margin: 8px 0 0 20px;
  padding: 0;
}

.customer.register .form__message li {
  margin: 4px 0;
}

/* Privacy notice at bottom */
.customer.register form ~ p,
.customer.register > div:last-child {
  font-size: 12px;
  color: #999;
  text-align: center;
  line-height: 1.6;
  margin-top: 24px;
  max-width: 520px;
}

/* Responsive design for mobile */
@media screen and (max-width: 768px) {
  .customer.register {
    flex-direction: column;
  }

  .customer.register::before {
    position: absolute;
  }

  .customer.register::after {
    position: relative;
    width: 100%;
    height: 200px;
  }

  .customer.register > form,
  .customer.register > div {
    width: 100%;
    margin-left: 0;
    padding: 40px 24px;
    min-height: auto;
  }

  .customer.register form {
    padding: 32px 24px;
    max-width: 100%;
  }

  .customer.register .field:has(#RegisterForm-FirstName),
  .customer.register .field:has(#RegisterForm-LastName) {
    width: 100%;
    display: block;
    margin-right: 0;
  }
}

/* End of register page styles */