/* =========================================================
RAWTAKES – MY ACCOUNT (FINAL – jak CART / HOME / OFERTA)
========================================================= */

/* =========================
0) HARD RESET (tylko konto)
========================= */
body.woocommerce-account .woocommerce,
body.woocommerce-account .woocommerce-account,
body.woocommerce-account .site-main,
body.woocommerce-account main,
body.woocommerce-account #primary,
body.woocommerce-account .content-area,
body.woocommerce-account .entry-content,
body.woocommerce-account .wp-site-blocks,
body.woocommerce-account .wp-block-group,
body.woocommerce-account .is-layout-constrained{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

/* WYŁĄCZ WP POST TITLE (TEN CO WRÓCIŁ) */
body.woocommerce-account h1.wp-block-post-title,
body.woocommerce-account .wp-block-post-title,
body.woocommerce-account .entry-title,
body.woocommerce-account h1.entry-title{
  display:none !important;
}

/* jeśli motyw daje alignfull offset */
body.woocommerce-account .alignfull{
  margin-left:0 !important;
  margin-right:0 !important;
  left:auto !important;
  right:auto !important;
}

/* UKRYJ DOMYŚLNY TEMPLATE WOO (żeby nie dublowało Twojego layoutu) */
body.woocommerce-account .woocommerce-MyAccount-navigation,
body.woocommerce-account .woocommerce-MyAccount-content{
  display:none !important;
}

/* =========================
1) GEOMETRIA = jak koszyk
(padding 80/40/24 tylko na containerze)
========================= */

/* wrapper bez paddingu */
body.woocommerce-account .rawtakes-account{
  width:100%;
  margin:0 !important;
  padding:0 !important;
}

/* jedyne miejsce na padding + szerokość */
body.woocommerce-account .rawtakes-account__container{
  width:100%;
  max-width:none !important;
  margin:0 !important;

  /* było: 80px top — H1 było za nisko */
  padding:60px 80px 120px !important;
  box-sizing:border-box;
}

@media (max-width:1024px){
  body.woocommerce-account .rawtakes-account__container{
    padding:60px 40px 120px !important;
  }
}

@media (max-width:768px){
  body.woocommerce-account .rawtakes-account__container{
    padding:44px 24px 100px !important;
  }
}

/* =========================
2) H1 (Twój, RAW)
========================= */
body.woocommerce-account .rawtakes-h1{
  font-size:clamp(2.6rem,6vw,5rem);
  font-weight:900;
  letter-spacing:-3px;
  text-transform:uppercase;
  margin:0 0 26px;
  line-height:1;
}

/* =========================
3) Layout 30/70 (NAPRAWA GUTTERÓW!)
========================= */
body.woocommerce-account .rawtakes-layout{
  display:grid;

  /* BYŁO: 30% 70% + gap => overflow i zjada prawy margines
     TERAZ: fr + minmax(0,…) => brak overflow, równe guttery */
  grid-template-columns: minmax(0, 0.30fr) minmax(0, 0.70fr);

  gap:60px;
  align-items:start;

  width:100%;
  max-width:100%;
  box-sizing:border-box;
}

@media(max-width:1024px){
  body.woocommerce-account .rawtakes-layout{
    grid-template-columns:1fr;
    gap:40px;
  }
}

/* =========================
4) Left nav
========================= */
body.woocommerce-account .rawtakes-nav{
  list-style:none;
  margin:0;
  padding:0;
}

body.woocommerce-account .rawtakes-nav li{ margin:0 0 18px; }

body.woocommerce-account .rawtakes-nav a{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:84px;
  padding:14px 26px;

  border:1.5px solid #000;
  background:transparent;

  font-weight:900;
  letter-spacing:2px;
  text-transform:uppercase;

  text-decoration:none !important;
  color:#000;

  transition:.2s;
}

body.woocommerce-account .rawtakes-nav a:hover,
body.woocommerce-account .rawtakes-nav .is-active a{
  background:#000;
  color:#fff;
}

@media(max-width:768px){
  body.woocommerce-account .rawtakes-nav a{
    min-height:74px;
    padding:14px 18px;
  }
}

/* =========================
5) Right frame (wypełnia 100%)
========================= */
body.woocommerce-account .rawtakes-main{
  min-width:0; /* ważne przy grid */
}

body.woocommerce-account .rawtakes-inner{
  width:100%;
  max-width:100%;
  box-sizing:border-box;

  position:relative;
  border:1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.35);

  padding:36px;
  min-height:240px;
}

/* narożniki */
body.woocommerce-account .rawtakes-inner:before,
body.woocommerce-account .rawtakes-inner:after{
  content:"";
  position:absolute;
  width:16px;
  height:16px;
  border:1.5px solid #000;
  pointer-events:none;
}

body.woocommerce-account .rawtakes-inner:before{
  top:12px; left:12px;
  border-right:0; border-bottom:0;
}
body.woocommerce-account .rawtakes-inner:after{
  bottom:12px; right:12px;
  border-left:0; border-top:0;
}

@media(max-width:768px){
  body.woocommerce-account .rawtakes-inner{ padding:24px; }
}

/* =========================
6) Formy
========================= */
body.woocommerce-account .rawtakes-inner .woocommerce-form-row{
  float:none !important;
  width:100% !important;
  margin:0 0 16px !important;
}

body.woocommerce-account .rawtakes-inner label{
  display:block !important;
  margin:0 0 8px !important;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:.72rem;
}

body.woocommerce-account .rawtakes-inner input[type="text"],
body.woocommerce-account .rawtakes-inner input[type="email"],
body.woocommerce-account .rawtakes-inner input[type="tel"],
body.woocommerce-account .rawtakes-inner input[type="password"],
body.woocommerce-account .rawtakes-inner input[type="number"],
body.woocommerce-account .rawtakes-inner select,
body.woocommerce-account .rawtakes-inner textarea{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box;

  height:52px;
  padding:0 14px;

  border:1.5px solid #000;
  border-radius:0 !important;
  background:transparent;

  font-weight:900;
  letter-spacing:1px;

  outline:none;
  box-shadow:none !important;
}

body.woocommerce-account .rawtakes-inner textarea{
  min-height:120px;
  height:auto;
  padding:12px 14px;
}

/* =========================
7) Buttony (spójne)
========================= */
body.woocommerce-account .rawtakes-inner button,
body.woocommerce-account .rawtakes-inner .button,
body.woocommerce-account .rawtakes-inner input[type="submit"]{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;

  min-height:56px;
  padding:14px 32px;

  border:1.5px solid #000;
  background:transparent;
  color:#000;

  font-weight:900;
  letter-spacing:2px;
  text-transform:uppercase;

  border-radius:0 !important;
  box-shadow:none !important;

  transition:.2s;
}

body.woocommerce-account .rawtakes-inner button:hover,
body.woocommerce-account .rawtakes-inner .button:hover,
body.woocommerce-account .rawtakes-inner input[type="submit"]:hover{
  background:#000;
  color:#fff;
  transform: translateY(-1px);
}

@media(max-width:768px){
  body.woocommerce-account .rawtakes-inner button,
  body.woocommerce-account .rawtakes-inner .button,
  body.woocommerce-account .rawtakes-inner input[type="submit"]{
    width:100% !important;
  }
}

/* =========================
8) Pokaż hasło (jak RAW button)
========================= */
body.woocommerce-account .rawtakes-inner .password-input{
  display:grid !important;
  grid-template-columns: 1fr auto;
  gap:24px;
  align-items:stretch;
}

body.woocommerce-account .rawtakes-inner .show-password-input{
  text-indent:0 !important;
  overflow:visible !important;
  opacity:1 !important;
}

body.woocommerce-account .rawtakes-inner .show-password-input::after{
  display:none !important;
}

body.woocommerce-account .rawtakes-inner .show-password-input:empty::before{
  content:"Pokaż hasło";
}

@media(max-width:768px){
  body.woocommerce-account .rawtakes-inner .password-input{
    grid-template-columns:1fr;
  }
  body.woocommerce-account .rawtakes-inner .show-password-input{
    width:100% !important;
  }
}

/* =========================
9) Tabele
========================= */
body.woocommerce-account .rawtakes-inner table{
  width:100% !important;
  border-collapse:collapse;
  table-layout:fixed;
}

body.woocommerce-account .rawtakes-inner th,
body.woocommerce-account .rawtakes-inner td{
  border-bottom:1px solid rgba(0,0,0,.08);
  padding:14px 10px;
  overflow:hidden;
  text-overflow:ellipsis;
  vertical-align:top;
}

body.woocommerce-account .rawtakes-inner th{
  text-transform:uppercase;
  font-weight:900;
  letter-spacing:2px;
  font-size:.72rem;
  white-space:nowrap;
}

/* =========================================================
   RAW – LOGIN/REGISTER (Woo default) – spójne z CART/HOME
   Dotyczy tylko ekranu logowania: #customer_login
   ========================================================= */

/* 0) Ukryj WP tytuł (na wszelki wypadek) */
body.woocommerce-account h1.wp-block-post-title,
body.woocommerce-account .wp-block-post-title,
body.woocommerce-account .entry-title{
  display:none !important;
}

/* 1) Geometria jak CART: jeden kontener z gutterami 80/40/24 */
body.woocommerce-account .woocommerce{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
}

body.woocommerce-account .woocommerce:has(#customer_login){
  padding:60px 80px 120px !important; /* jak account, H1 wyżej */
  box-sizing:border-box;
}

@media (max-width:1024px){
  body.woocommerce-account .woocommerce:has(#customer_login){
    padding:60px 40px 120px !important;
  }
}
@media (max-width:768px){
  body.woocommerce-account .woocommerce:has(#customer_login){
    padding:44px 24px 100px !important;
  }
}

/* 2) Layout 2 kolumny = RAW grid */
body.woocommerce-account #customer_login{
  display:grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap:60px !important;
  align-items:start !important;

  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
}

@media (max-width:1024px){
  body.woocommerce-account #customer_login{
    grid-template-columns:1fr !important;
    gap:40px !important;
  }
}

/* usuń pływaki Woo */
body.woocommerce-account #customer_login .u-column1,
body.woocommerce-account #customer_login .u-column2{
  float:none !important;
  width:auto !important;
  margin:0 !important;
  padding:0 !important;
  min-width:0 !important;
}

/* 3) Nagłówki sekcji (Logowanie / Zarejestruj się) */
body.woocommerce-account #customer_login h2{
  margin:0 0 18px !important;
  font-weight:900 !important;
  letter-spacing:-0.5px !important;
}

/* 4) Formularz w “RAW frame” (jak prawa wkładka) */
body.woocommerce-account #customer_login form{
  position:relative;
  width:100%;
  box-sizing:border-box;

  border:1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.35);

  padding:36px;
  min-height:240px;
}

/* narożniki jak RAW */
body.woocommerce-account #customer_login form::before,
body.woocommerce-account #customer_login form::after{
  content:"";
  position:absolute;
  width:16px;
  height:16px;
  border:1.5px solid #000;
  pointer-events:none;
}
body.woocommerce-account #customer_login form::before{
  top:12px; left:12px;
  border-right:0; border-bottom:0;
}
body.woocommerce-account #customer_login form::after{
  bottom:12px; right:12px;
  border-left:0; border-top:0;
}

@media (max-width:768px){
  body.woocommerce-account #customer_login form{
    padding:24px;
  }
}

/* 5) Row/label/input – jak w panelu */
body.woocommerce-account #customer_login .woocommerce-form-row{
  float:none !important;
  width:100% !important;
  margin:0 0 16px !important;
}

body.woocommerce-account #customer_login label{
  display:block !important;
  margin:0 0 8px !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:2px !important;
  font-size:.72rem !important;
}

/* inputy */
body.woocommerce-account #customer_login input[type="text"],
body.woocommerce-account #customer_login input[type="email"],
body.woocommerce-account #customer_login input[type="password"]{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;

  height:52px !important;
  padding:0 14px !important;

  border:1.5px solid #000 !important;
  border-radius:0 !important;
  background:transparent !important;

  font-weight:900 !important;
  letter-spacing:1px !important;

  outline:none !important;
  box-shadow:none !important;
}

/* 6) Remember me + submit: wyrównanie i RAW look */
body.woocommerce-account #customer_login .form-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;

  margin-top:10px !important;
}

body.woocommerce-account #customer_login .woocommerce-form-login__rememberme{
  margin:0 !important;
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:700;
}

/* checkbox RAW */
body.woocommerce-account #customer_login input[type="checkbox"]{
  width:18px;
  height:18px;
  accent-color:#000;
}

/* 7) Buttony – identyczne jak RAW */
body.woocommerce-account #customer_login button,
body.woocommerce-account #customer_login .button,
body.woocommerce-account #customer_login input[type="submit"]{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;

  min-height:56px !important;
  padding:14px 32px !important;

  border:1.5px solid #000 !important;
  background:transparent !important;
  color:#000 !important;

  font-weight:900 !important;
  letter-spacing:2px !important;
  text-transform:uppercase !important;

  border-radius:0 !important;
  box-shadow:none !important;

  cursor:pointer !important;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}

body.woocommerce-account #customer_login button:hover,
body.woocommerce-account #customer_login .button:hover,
body.woocommerce-account #customer_login input[type="submit"]:hover{
  background:#000 !important;
  color:#fff !important;
  transform: translateY(-1px);
}

@media (max-width:768px){
  body.woocommerce-account #customer_login button,
  body.woocommerce-account #customer_login .button,
  body.woocommerce-account #customer_login input[type="submit"]{
    width:100% !important;
  }
  body.woocommerce-account #customer_login .form-row{
    flex-direction:column;
    align-items:stretch;
  }
}

/* 8) “Pokaż hasło” jako RAW button obok inputa */
body.woocommerce-account #customer_login .password-input{
  display:grid !important;
  grid-template-columns: 1fr auto !important;
  gap:24px !important;
  align-items:stretch !important;
}

body.woocommerce-account #customer_login .password-input input{
  width:100% !important;
}

body.woocommerce-account #customer_login .show-password-input{
  position:static !important;
  transform:none !important;
  text-indent:0 !important;
  overflow:visible !important;
  opacity:1 !important;

  min-height:52px !important; /* równo z inputem */
  padding:14px 18px !important;

  border:1.5px solid #000 !important;
  background:transparent !important;
  color:#000 !important;

  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:2px !important;
  line-height:1 !important;

  border-radius:0 !important;
  box-shadow:none !important;
}

body.woocommerce-account #customer_login .show-password-input::after{
  display:none !important;
}

/* jeśli Woo nie wstawia tekstu */
body.woocommerce-account #customer_login .show-password-input:empty::before{
  content:"Pokaż hasło";
}

body.woocommerce-account #customer_login .show-password-input:hover{
  background:#000 !important;
  color:#fff !important;
  transform: translateY(-1px);
}

@media (max-width:768px){
  body.woocommerce-account #customer_login .password-input{
    grid-template-columns:1fr !important;
    gap:12px !important;
  }
  body.woocommerce-account #customer_login .show-password-input{
    width:100% !important;
  }
}

/* 9) Lost password / privacy – RAW link */
body.woocommerce-account #customer_login .lost_password,
body.woocommerce-account #customer_login .woocommerce-privacy-policy-text{
  margin:14px 0 0 !important;
  opacity:.9;
}

body.woocommerce-account #customer_login a{
  text-decoration:none !important;
  border-bottom:1px solid rgba(0,0,0,.25);
}
body.woocommerce-account #customer_login a:hover{
  border-bottom-color:#000;
}

/* =========================================================
   LOGIN FIX: "Hasło" = label na górze, input + button w 1 linii
   Wklej na końcu pliku
   ========================================================= */

body.woocommerce-account #customer_login .woocommerce-form-row{
  position: relative;
}

/* 1) Wiersz hasła: robimy 2-rzędowy układ */
body.woocommerce-account #customer_login .woocommerce-form-row:has(.password-input){
  display:grid !important;
  grid-template-columns: 1fr auto !important;   /* input | button */
  grid-template-areas:
    "label label"
    "field toggle";
  column-gap: 24px !important;
  row-gap: 14px !important;
  align-items:end !important;
}

/* label zawsze pełna szerokość u góry */
body.woocommerce-account #customer_login .woocommerce-form-row:has(.password-input) > label{
  grid-area: label !important;
  margin: 0 !important;
}

/* wrapper z inputem w lewej kolumnie */
body.woocommerce-account #customer_login .woocommerce-form-row:has(.password-input) .password-input{
  grid-area: field !important;
  display:block !important;                  /* bez wewn. grida */
  width:100% !important;
}

/* input hasła pełna szerokość */
body.woocommerce-account #customer_login .woocommerce-form-row:has(.password-input) .password-input > input{
  width:100% !important;
  max-width:100% !important;
}

/* toggle jako przycisk w prawej kolumnie (ta sama linia co input) */
body.woocommerce-account #customer_login .woocommerce-form-row:has(.password-input) .password-input > .show-password-input{
  grid-area: toggle !important;
  justify-self:end !important;

  min-height:56px !important;
  padding:14px 26px !important;
  width:auto !important;

  /* RAW look (jeśli gdzieś się rozjeżdża) */
  border:1.5px solid #000 !important;
  background:transparent !important;
  color:#000 !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:2px !important;
  border-radius:0 !important;
}

/* usuń ikonę oka + dodaj tekst */
body.woocommerce-account #customer_login .show-password-input::after{
  display:none !important;
}
body.woocommerce-account #customer_login .show-password-input:empty::before{
  content:"Pokaż hasło";
}

/* 2) Mobile: w kolumnie (input, potem button) */
@media (max-width:768px){
  body.woocommerce-account #customer_login .woocommerce-form-row:has(.password-input){
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "label"
      "field"
      "toggle";
  }

  body.woocommerce-account #customer_login .woocommerce-form-row:has(.password-input) .password-input > .show-password-input{
    width:100% !important;
    justify-self:stretch !important;
  }
}

/* 3) Żeby nie było tego małego pola (czasem motyw/woo nadaje width na input password) */
body.woocommerce-account #customer_login input#password{
  width:100% !important;
  max-width:100% !important;
}

/* 4) Register/login opisy i linki - RAW */
body.woocommerce-account #customer_login .woocommerce-LostPassword,
body.woocommerce-account #customer_login .woocommerce-privacy-policy-text{
  margin: 18px 0 0 !important;
  padding-top: 18px;
  border-top: 1px solid rgba(0,0,0,.10);
}

body.woocommerce-account #customer_login .woocommerce-privacy-policy-text p{
  margin: 0 !important;
  font-size:16px;
  line-height:1.6;
  opacity:.9;
}

body.woocommerce-account #customer_login a{
  text-decoration:none !important;
  border-bottom: 1px solid rgba(0,0,0,.25) !important;
}
body.woocommerce-account #customer_login a:hover{
  border-bottom-color:#000 !important;
}

/* odstęp między polem hasła a przyciskiem "Pokaż hasło" */
body.woocommerce-account #customer_login .password-input > .show-password-input{
  margin-top:14px !important;
}

/* ======================================
   MOBILE – opuść nagłówek MOJE KONTO
====================================== */
@media (max-width:768px){

  body.woocommerce-account h1.rawtakes-h1{
    margin-top:40px !important;
  }

}

