:root{
  --tuto-primary:#2563eb;
  --tuto-primary-10:#eff6ff;
  --tuto-primary-15:#e8f0ff;
  --tuto-primary-20:#dbeafe;
  --tuto-border:#cbd5e1;
  --tuto-muted:#64748b;
  --tuto-chip-radius:12px;
  --tuto-chip-pad:10px 14px;
  --tuto-card-radius:14px;

  --tuto-myacc-nav: clamp(200px, 18vw, 260px);
}

/* ===== WRAPPER „MOJE KONTO” ===== */
.tuto-myaccount .tuto-myaccount-wrap{
  display:grid;
  grid-template-columns: var(--tuto-myacc-nav) minmax(0,1fr);
  gap:24px;
  align-items:start;
}
@media (max-width: 980px){ .tuto-myaccount .tuto-myaccount-wrap{ grid-template-columns:1fr; } }
.tuto-myaccount .tuto-myaccount-wrap .woocommerce-MyAccount-navigation,
.tuto-myaccount .tuto-myaccount-wrap .woocommerce-MyAccount-content{ float:none!important;width:auto!important; }
.tuto-myaccount .tuto-myaccount-main .woocommerce-MyAccount-content{ max-width:none; }
.tuto-myaccount .tuto-myaccount-aside{ position:sticky; top: 90px; align-self:start; }

/* ===== NAWIGACJA ===== */
.woocommerce-account .woocommerce-MyAccount-navigation ul{
  list-style:none!important;margin:0!important;padding:0!important;
  display:flex!important;flex-direction:column!important;gap:8px!important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li{margin:0!important;padding:0!important}
.woocommerce-account .woocommerce-MyAccount-navigation a{
  position:relative!important;display:flex!important;align-items:center!important;gap:10px!important;
  padding:var(--tuto-chip-pad)!important;border:1px solid var(--tuto-border)!important;border-radius:var(--tuto-chip-radius)!important;
  background:#fff!important;color:#0f172a!important;text-decoration:none!important;font-weight:600!important;line-height:1.2!important;
  transition:border-color .15s ease, background-color .15s ease, box-shadow .15s ease, transform .04s ease;
  will-change: box-shadow, transform;
}
.woocommerce-account .woocommerce-MyAccount-navigation a:hover{
  border-color:var(--tuto-primary)!important;background:var(--tuto-primary-10)!important;box-shadow:0 8px 18px rgba(2,6,23,.08);
}
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a{
  border-color:var(--tuto-primary)!important;background:var(--tuto-primary-15)!important;color:#0f172a!important;
}

/* Ikony */
.woocommerce-account .woocommerce-MyAccount-navigation a::before{
  content:"";flex:0 0 auto;width:18px;height:18px;color:currentColor;opacity:.9;
  -webkit-mask-image:var(--tuto-icon-current, none);mask-image:var(--tuto-icon-current, none);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain;background:currentColor;
}
.woocommerce-account .woocommerce-MyAccount-navigation-link--dashboard a{ --tuto-icon-current: var(--tuto-icon-dashboard); }
.woocommerce-account .woocommerce-MyAccount-navigation-link--orders a{ --tuto-icon-current: var(--tuto-icon-orders); }
.woocommerce-account .woocommerce-MyAccount-navigation-link--edit-address a{ --tuto-icon-current: var(--tuto-icon-edit-address); }
.woocommerce-account .woocommerce-MyAccount-navigation-link--edit-account a{ --tuto-icon-current: var(--tuto-icon-edit-account); }
.woocommerce-account .woocommerce-MyAccount-navigation-link--marketing-consents a{ --tuto-icon-current: var(--tuto-icon-marketing-consents); }
.woocommerce-account .woocommerce-MyAccount-navigation-link--discount-codes a{ --tuto-icon-current: var(--tuto-icon-discount-codes); } /* NOWE */
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a{ --tuto-icon-current: var(--tuto-icon-customer-logout); }

/* Badże */
.woocommerce-account .woocommerce-MyAccount-navigation a.has-badge::after{
  content:attr(data-badge);position:absolute;right:10px;top:8px;min-width:18px;height:18px;padding:0 6px;border-radius:999px;
  background:var(--tuto-primary);color:#fff;font-weight:700;font-size:12px;display:inline-flex;align-items:center;justify-content:center;
}
.woocommerce-account .woocommerce-MyAccount-navigation a.has-badge[data-badge]:not([data-badge="0"])::after{
  animation:tutoPulse 1.8s ease-out infinite;
}
@keyframes tutoPulse{ 0%{box-shadow:0 0 0 0 rgba(37,99,235,.45)} 70%{box-shadow:0 0 0 8px rgba(37,99,235,0)} 100%{box-shadow:0 0 0 0 rgba(37,99,235,0)} }

/* ===== Przyciski ===== */
.woocommerce-account .button,
.woocommerce-account button.button,
.woocommerce-account a.button{
  display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;border:1px solid var(--tuto-border);
  background:var(--tuto-primary);color:#fff;text-decoration:none;font-weight:600;cursor:pointer;
  transition:filter .15s ease, transform .05s ease, box-shadow .15s ease;
}
.woocommerce-account .button:hover{filter:brightness(0.98);box-shadow:0 10px 24px rgba(37,99,235,.18)}
.woocommerce-account .button:active{transform:translateY(1px)}

/* Wariant ALT – jasny (jak „Wyloguj”/„Zmień ustawienia”) */
.woocommerce-account .button.alt,
.woocommerce-account button.button.alt,
.woocommerce-account a.button.alt{
  background:#fff;
  color:var(--tuto-primary);
  border-color:var(--tuto-primary);
}

/* HOVER dla ALT – neutralny szary, bez fioletu Woo */
.woocommerce-account .button.alt:hover,
.woocommerce-account button.button.alt:hover,
.woocommerce-account a.button.alt:hover{
  background:#f1f5f9;
  color:var(--tuto-primary);
  border-color:var(--tuto-primary);
  box-shadow:0 10px 24px rgba(2,6,23,.10);
  filter:none; /* wyłącz rozjaśnianie z .button:hover */
}

/* ACTIVE/FOCUS dla ALT – spójnie z resztą */
.woocommerce-account .button.alt:active,
.woocommerce-account button.button.alt:active,
.woocommerce-account a.button.alt:active{
  transform:translateY(1px);
}

/* >>> Skopiuj – zawsze czytelny (nadpisuje .button.alt) */
.tuto-copy-billing,
.tuto-copy-billing.button,
.tuto-copy-billing.button.alt{
  background:linear-gradient(90deg,#7c3aed,#2563eb) !important;
  border-color:transparent !important;
  color:#fff !important;
  text-shadow:0 1px 0 rgba(0,0,0,.18);
}
.tuto-copy-billing:hover{ filter:brightness(.97); }

/* Focus (WCAG) */
.woocommerce-account a:focus-visible,
.woocommerce-account button:focus-visible,
.woocommerce-account input:focus-visible,
.woocommerce-account select:focus-visible,
.woocommerce-account textarea:focus-visible{
  outline: 2px solid transparent;
  box-shadow: 0 0 0 3px var(--tuto-primary-20), 0 0 0 2px var(--tuto-primary);
  border-color: var(--tuto-primary) !important;
}

/* Pola formularza */
.woocommerce-account .form-row input.input-text,
.woocommerce-account .form-row textarea,
.woocommerce-account .form-row select,
.woocommerce-account .form-row input[type="text"],
.woocommerce-account .form-row input[type="email"],
.woocommerce-account .form-row input[type="tel"]{
  width:100%;
  padding:12px 14px;
  border:1px solid var(--tuto-border);
  border-radius:10px;
  background:#f8fafc;
  color:#0f172a;
  line-height:1.45;
  transition:box-shadow .15s ease, background-color .15s ease;
}
.woocommerce-account .form-row input.input-text:focus,
.woocommerce-account .form-row textarea:focus,
.woocommerce-account .form-row select:focus{ background:#fff; box-shadow:inset 0 1px 0 rgba(15,23,42,.06); }
.woocommerce-account ::placeholder{color:#94a3b8}

/* Alerty (bazowe) */
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-error,
.woocommerce-account .woocommerce-info{
  border:1px solid var(--tuto-border);border-radius:12px;padding:12px 14px;margin:10px 0;background:#fff;
  box-shadow:0 6px 18px rgba(2,6,23,.06);
}
.woocommerce-account .woocommerce-message{border-color:#22c55e3d;background:linear-gradient(180deg,#f0fdf4,#fff)}
.woocommerce-account .woocommerce-error{border-color:#ef44443d;background:linear-gradient(180deg,#fef2f2,#fff)}
.woocommerce-account .woocommerce-info{border-color:#2563eb3d;background:linear-gradient(180deg,#eff6ff,#fff)}

/* Karty + akcent gradientowy */
.tuto-card{
  position:relative;
  background:#fff;border:1px solid var(--tuto-border);border-radius:var(--tuto-card-radius);padding:20px;
  box-shadow:0 12px 28px rgba(2,6,23,.06);
}
.tuto-card::before{
  content:"";position:absolute;left:12px;right:12px;top:-1px;height:3px;border-radius:999px;
  background:linear-gradient(90deg,#60a5fa,#7c3aed 60%, #22c55e);
  opacity:.75;
}

/* Ikona w kaflach – maska (ticket.svg z --tuto-icon-discount-codes) */
.tuto-card__icon--mask{
  width:24px;height:24px;display:inline-block;color:currentColor;
  background:currentColor;
  -webkit-mask-image:var(--tuto-icon-discount-codes);mask-image:var(--tuto-icon-discount-codes);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain;
}

.woocommerce-MyAccount-content>p{display:none!important}
.logged-in.woocommerce-account .tuto-account__title,
.logged-in.woocommerce-account .tuto-account__greeting{display:none!important}

/* ====== Woo notices (My Account) – card + icons + animation ====== */
.tuto-myaccount .woocommerce-notices-wrapper{ margin: 8px 0 14px; }

.tuto-myaccount .woocommerce-message,
.tuto-myaccount .woocommerce-error,
.tuto-myaccount .woocommerce-info{
  position: relative;
  display: flex; align-items: center; gap: 10px;
  padding: 12px 44px 12px 14px;  /* miejsce na przycisk X */
  border: 1px solid var(--tuto-border);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(2,6,23,.08);
  line-height: 1.35;
  opacity: 0; transform: translateY(-6px);
  transition: opacity .2s ease, transform .2s ease, box-shadow .2s ease;
}
.tuto-myaccount .woocommerce-message.is-visible,
.tuto-myaccount .woocommerce-error.is-visible,
.tuto-myaccount .woocommerce-info.is-visible{
  opacity: 1; transform: translateY(0);
}
@media (prefers-reduced-motion: reduce){
  .tuto-myaccount .woocommerce-message,
  .tuto-myaccount .woocommerce-error,
  .tuto-myaccount .woocommerce-info{ transition: none; }
}

/* Success / Info / Error – delikatne tła + ikony (maski) */
.tuto-myaccount .woocommerce-message{
  border-color:#16a34a33;
  background: linear-gradient(180deg,#ecfdf5,#fff);
}
.tuto-myaccount .woocommerce-info{
  border-color:#2563eb33;
  background: linear-gradient(180deg,#eff6ff,#fff);
}
.tuto-myaccount .woocommerce-error{
  border-color:#ef444433;
  background: linear-gradient(180deg,#fef2f2,#fff);
}

/* Ikona po lewej (mask image z CSS variable) */
.tuto-myaccount .woocommerce-message::before,
.tuto-myaccount .woocommerce-info::before,
.tuto-myaccount .woocommerce-error::before{
  content:""; flex:0 0 auto; width:18px; height:18px;
  background: currentColor;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-position:center; mask-position:center;
  -webkit-mask-size:contain; mask-size:contain;
}
.tuto-myaccount .woocommerce-message{ color:#16a34a; }
.tuto-myaccount .woocommerce-info{ color:#2563eb;  }
.tuto-myaccount .woocommerce-error{ color:#ef4444;  }

.tuto-myaccount .woocommerce-message::before{ -webkit-mask-image: var(--tuto-icon-check); mask-image: var(--tuto-icon-check); }
.tuto-myaccount .woocommerce-info::before   { -webkit-mask-image: var(--tuto-icon-info);  mask-image: var(--tuto-icon-info);  }
.tuto-myaccount .woocommerce-error::before  { -webkit-mask-image: var(--tuto-icon-alert); mask-image: var(--tuto-icon-alert); }

/* --- FIX: reset pozycji ikon Woo w komunikatach --- */
.tuto-myaccount .woocommerce-message::before,
.tuto-myaccount .woocommerce-info::before,
.tuto-myaccount .woocommerce-error::before{
  position: static !important;
  float: none !important;
  left: auto !important;
  top: auto !important;
  margin: 0 !important;
  flex: 0 0 18px;
  display: inline-block;
}

/* Linki wewnątrz komunikatu */
.tuto-myaccount .woocommerce-message a,
.tuto-myaccount .woocommerce-info a,
.tuto-myaccount .woocommerce-error a{
  color: currentColor; font-weight: 700; text-decoration: underline;
}

/* Przycisk zamykania (dodaje JS) */
.tuto-notice__close{
  position:absolute; right:8px; top:8px;
  width:28px; height:28px; border-radius:8px;
  border:1px solid transparent; background:#fff;
  box-shadow: 0 2px 8px rgba(2,6,23,.08);
  cursor:pointer;
}
.tuto-notice__close::before{
  content:""; display:block; width:100%; height:100%; background:#0f172a;
  -webkit-mask-image: var(--tuto-icon-x); mask-image: var(--tuto-icon-x);
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-position:center; mask-position:center;
  -webkit-mask-size: 14px 14px; mask-size: 14px 14px;
  opacity:.7;
}
.tuto-notice__close:hover{ border-color: var(--tuto-border); }
.tuto-notice__close:focus-visible{
  outline:2px solid transparent;
  box-shadow:0 0 0 3px var(--tuto-primary-20),0 0 0 2px var(--tuto-primary);
}

/* Wyjście */
.tuto-myaccount .woocommerce-message.is-leaving,
.tuto-myaccount .woocommerce-info.is-leaving,
.tuto-myaccount .woocommerce-error.is-leaving{
  opacity:0; transform: translateY(-6px);
}
