/* ============================================================
   The Lost Codex — WooCommerce / account dark-mystical theming
   Loads after style.css, so the --ink/--navy/--gold/--arcane/--parch vars are available.
   Styles login, register, my-account, cart, checkout, tables, notices.
   ============================================================ */

.woocommerce, .woocommerce-page, .woocommerce-account .entry-content { color: var(--parch); font-family: 'EB Garamond', Georgia, serif; }

/* page width inside our shell */
.woocommerce-account .site-content, .woocommerce .site-content { max-width: 1100px; margin: 0 auto; padding: 56px 24px 90px; }

/* headings */
.woocommerce h1, .woocommerce h2, .woocommerce h3,
.woocommerce-account h1, .woocommerce-account h2,
.woocommerce-MyAccount-content h2, .woocommerce-MyAccount-content h3 {
  font-family: 'Cinzel', serif; font-weight: 700; color: var(--gold-bright); letter-spacing: .03em;
}
.woocommerce a { color: var(--arcane); }
.woocommerce a:hover { color: var(--gold-bright); }

/* labels */
.woocommerce form .form-row label,
.woocommerce-account label, .woocommerce-checkout label {
  font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--gold); display: block; margin-bottom: 6px;
}

/* inputs / selects / textareas */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce input.input-text, .woocommerce-page input.input-text,
.woocommerce select, .woocommerce textarea, .woocommerce #s,
.select2-container--default .select2-selection--single,
.woocommerce-checkout input[type="text"], .woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"], .woocommerce-checkout input[type="password"] {
  background: rgba(8,11,21,.72); border: 1px solid var(--navy-line); color: var(--parch);
  border-radius: 6px; padding: 12px 14px; font-family: 'EB Garamond', serif; font-size: 16px;
  width: 100%; box-shadow: none;
}
.woocommerce input.input-text:focus, .woocommerce select:focus, .woocommerce textarea:focus,
.woocommerce-checkout input:focus {
  border-color: var(--gold); outline: none; box-shadow: 0 0 0 1px rgba(214,162,60,.45);
}
.woocommerce form .form-row { margin-bottom: 16px; }

/* buttons */
.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce button.button.alt, .woocommerce #place_order,
.woocommerce-account button.button, .woocommerce-cart .actions .button {
  background: linear-gradient(180deg, var(--gold-bright), var(--gold) 55%, var(--gold-deep));
  color: #241704; font-family: 'Cinzel', serif; font-weight: 600; text-transform: uppercase;
  letter-spacing: .12em; font-size: 13px; border: none; border-radius: 4px; padding: 13px 26px;
  cursor: pointer; box-shadow: 0 6px 22px -8px rgba(214,162,60,.55), inset 0 1px 0 rgba(255,255,255,.4);
  transition: transform .15s, filter .15s;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce #place_order:hover { transform: translateY(-2px); filter: brightness(1.07); color: #241704; }
.woocommerce a.button.alt, .woocommerce button.button.alt { background: linear-gradient(180deg, var(--gold-bright), var(--gold) 55%, var(--gold-deep)); }

/* login / register / lost-password panels */
.woocommerce form.login, .woocommerce form.register,
.woocommerce form.woocommerce-form-login, .woocommerce form.woocommerce-form-register,
.woocommerce-ResetPassword.lost_reset_password, .woocommerce-account .col2-set .col-1,
.woocommerce-account .col2-set .col-2 {
  background: linear-gradient(160deg, rgba(18,30,58,.85), rgba(9,14,28,.92));
  border: 1px solid var(--navy-line); border-radius: 10px; padding: 30px 32px;
  box-shadow: 0 0 0 1px rgba(214,162,60,.12) inset, 0 24px 60px -30px #000;
}
.woocommerce .col2-set { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 720px){ .woocommerce .col2-set { grid-template-columns: 1fr; } }

/* my-account DASHBOARD (logged in only): nav + content side by side */
body.woocommerce-account.logged-in .woocommerce { display: grid; grid-template-columns: 240px 1fr; gap: 28px; align-items: start; }
@media (max-width: 820px){ body.woocommerce-account.logged-in .woocommerce { grid-template-columns: 1fr; } }
/* login/register screen (logged out): center it, don't grid it */
body.woocommerce-account:not(.logged-in) .woocommerce { max-width: 940px; margin: 0 auto; display: block; }
.woocommerce form.login, .woocommerce form.register { max-width: 480px; margin: 28px auto; float: none; width: 100%; }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; border: 1px solid var(--navy-line); border-radius: 10px; overflow: hidden; background: rgba(11,20,41,.55); }
.woocommerce-MyAccount-navigation li { border-bottom: 1px solid rgba(35,55,95,.5); }
.woocommerce-MyAccount-navigation li:last-child { border-bottom: none; }
.woocommerce-MyAccount-navigation li a { display: block; padding: 13px 18px; color: var(--parch); font-family: 'Cinzel', serif; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; }
.woocommerce-MyAccount-navigation li.is-active a, .woocommerce-MyAccount-navigation li a:hover {
  background: linear-gradient(90deg, rgba(214,162,60,.18), transparent); color: var(--gold-bright);
}
.woocommerce-MyAccount-content { background: linear-gradient(165deg, rgba(20,33,63,.5), rgba(8,12,24,.6)); border: 1px solid var(--navy-line); border-radius: 10px; padding: 28px 30px; }

/* tables: cart / checkout / orders */
.woocommerce table.shop_table { border: 1px solid var(--navy-line); border-radius: 10px; background: rgba(11,20,41,.45); color: var(--parch); border-collapse: separate; border-spacing: 0; overflow: hidden; }
.woocommerce table.shop_table th { color: var(--gold-bright); font-family: 'Cinzel', serif; letter-spacing: .04em; text-transform: uppercase; font-size: 12px; padding: 14px 16px; border-bottom: 1px solid var(--navy-line); }
.woocommerce table.shop_table td { border-top: 1px solid rgba(35,55,95,.4); padding: 14px 16px; }
.woocommerce table.shop_table tfoot th, .woocommerce table.shop_table tfoot td { color: var(--gold-bright); }
.woocommerce .cart_totals h2, .woocommerce-checkout #order_review_heading { font-family: 'Cinzel', serif; color: var(--gold-bright); }
.woocommerce-checkout #payment, #order_review { background: linear-gradient(160deg, rgba(18,30,58,.7), rgba(9,14,28,.85)); border: 1px solid var(--navy-line); border-radius: 10px; }
.woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid var(--navy-line); }

/* notices */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews {
  background: rgba(11,20,41,.7); border-top: 3px solid var(--gold); color: var(--parch); border-radius: 6px;
}
.woocommerce-error { border-top-color: #e24b4a; }
.woocommerce-message::before, .woocommerce-info::before { color: var(--gold); }
.woocommerce-error::before { color: #e98080; }

/* misc cleanup */
.woocommerce-account .u-columns.col2-set .col-1 h2, .woocommerce-account .col2-set .col-2 h2 { margin-top: 0; }
.woocommerce form .form-row .required { color: var(--gold); }
mark, .woocommerce mark { background: transparent; color: var(--gold-bright); }

/* ---- Account Portal (tabbed login/register built by snippet #14 "TLC - Account UI") ---- */
/* WC defaults .u-columns to ~47% floated columns; this is a tabbed one-at-a-time UI, so center a single column */
.woocommerce-account .u-columns, .woocommerce-account .col2-set {
  display: block !important; max-width: 460px; margin: 0 auto !important; float: none !important;
}
.woocommerce-account .u-column1, .woocommerce-account .u-column2,
.woocommerce-account .col2-set .col-1, .woocommerce-account .col2-set .col-2 {
  width: 100% !important; max-width: none !important; float: none !important; padding: 0 !important;
}
.tlc-auth-tabs {
  display: flex; max-width: 460px; margin: 8px auto 22px; border: 1px solid var(--navy-line);
  border-radius: 8px; overflow: hidden; background: rgba(11,20,41,.5);
}
.tlc-auth-tabs button {
  flex: 1; background: transparent; border: none; color: var(--muted); cursor: pointer;
  font-family: 'Cinzel', serif; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; padding: 13px 10px;
  transition: background .15s, color .15s;
}
.tlc-auth-tabs button:hover { color: var(--gold-bright); }
.tlc-auth-tabs button.is-active {
  background: linear-gradient(180deg, var(--gold-bright), var(--gold) 60%, var(--gold-deep)); color: #241704;
}
.tlc-auth-head { text-align: center; margin-bottom: 16px; }
.tlc-auth-head img { width: 66px; height: auto; margin: 0 auto 8px; display: block; filter: drop-shadow(0 0 14px rgba(95,168,224,.35)); }
.tlc-auth-title { font-family: 'Cinzel', serif; font-size: 13px; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-bright); }

/* ---- single clean card: the column IS the card, the form inside is transparent (no box-in-box) ---- */
.woocommerce-account .u-column1, .woocommerce-account .u-column2,
.woocommerce-account .col2-set .col-1, .woocommerce-account .col2-set .col-2 {
  background: linear-gradient(160deg, rgba(18,30,58,.88), rgba(9,14,28,.94)) !important;
  border: 1px solid var(--navy-line) !important; border-radius: 12px !important;
  padding: 28px 30px 34px !important;
  box-shadow: 0 0 0 1px rgba(214,162,60,.12) inset, 0 24px 60px -30px #000 !important;
}
.woocommerce form.login, .woocommerce form.register,
.woocommerce form.woocommerce-form-login, .woocommerce form.woocommerce-form-register {
  background: transparent !important; border: none !important; box-shadow: none !important;
  padding: 0 !important; margin: 6px 0 0 !important; max-width: none !important;
}
.woocommerce-account .u-column1 > h2, .woocommerce-account .u-column2 > h2 { text-align: center; margin: 2px 0 8px; }
