/* ============================================================
   CARPCORE — My Account skin.
   No original design exists for this page — it's a WordPress/WooCommerce
   concept with no Shopify Liquid equivalent (Shopify hosted customer
   accounts itself). Extends the same herbiary paper system as the cart
   and checkout onto WooCommerce's stable My Account classes. Pure CSS,
   no markup or JS changes. Scoped under .cc-herb--account.
   ============================================================ */

.cc-herb--account {
  font-family: 'Nunito', sans-serif;
}

.cc-herb--account .cc-acct__in {
  max-width: 1100px;
  margin-inline: auto;
}

/* Only grids into a nav+content sidebar layout when logged in (nav
   actually exists) — the logged-out login/register view is a single
   child here and lays out with its own .u-columns.col2-set rule below. */
.cc-herb--account .cc-acct__grid:has(.woocommerce-MyAccount-navigation) {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: clamp(20px, 3vw, 40px);
  align-items: start;
}
@media (max-width: 760px) {
  .cc-herb--account .cc-acct__grid:has(.woocommerce-MyAccount-navigation) {
    display: block;
  }
}

/* ---- nav ---- */
.cc-herb--account .woocommerce-MyAccount-navigation {
  background: var(--paper-l);
  border: 3px solid var(--ink);
  box-shadow: var(--sh-md);
  border-radius: 10px 7px 12px 6px;
  padding: 10px;
}
.cc-herb--account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.cc-herb--account .woocommerce-MyAccount-navigation li {
  margin: 0;
}
.cc-herb--account .woocommerce-MyAccount-navigation a {
  display: block;
  font-family: 'Dela Gothic One', sans-serif;
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
  padding: 10px 12px;
  border-radius: 6px 4px 7px 5px;
  transition: background 0.14s ease, color 0.14s ease;
}
.cc-herb--account .woocommerce-MyAccount-navigation a:hover {
  background: rgb(var(--color-brand-coral-rgb) / 0.14);
}
.cc-herb--account .woocommerce-MyAccount-navigation-link--dashboard.is-active a,
.cc-herb--account .woocommerce-MyAccount-navigation li.is-active a {
  background: var(--coral);
  color: var(--paper-l);
}
.cc-herb--account .woocommerce-MyAccount-navigation-link--customer-logout a {
  color: var(--coral);
}
@media (max-width: 760px) {
  .cc-herb--account .woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  .cc-herb--account .woocommerce-MyAccount-navigation li {
    flex: 1 1 auto;
  }
  .cc-herb--account .woocommerce-MyAccount-navigation a {
    text-align: center;
  }
}

/* ---- content wrapper ---- */
.cc-herb--account .woocommerce-MyAccount-content p {
  font-family: 'Nunito', sans-serif;
  line-height: 1.6;
  color: var(--ink);
}
.cc-herb--account .woocommerce-MyAccount-content a {
  color: var(--cer);
}
.cc-herb--account .woocommerce-MyAccount-content mark {
  background: none;
  font-weight: 700;
  color: var(--navy);
}

/* ---- orders table ---- */
.cc-herb--account table.woocommerce-orders-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--paper-l);
  border: 3px solid var(--ink);
  box-shadow: var(--sh-md);
  border-radius: 10px 7px 12px 6px;
  overflow: hidden;
}
.cc-herb--account table.woocommerce-orders-table thead {
  display: none;
}
.cc-herb--account table.woocommerce-orders-table tbody,
.cc-herb--account table.woocommerce-orders-table tr {
  display: block;
}
.cc-herb--account tr.woocommerce-orders-table__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  padding: 14px 16px;
  border-bottom: 1px solid rgb(var(--color-foreground-rgb) / 0.2);
}
.cc-herb--account tr.woocommerce-orders-table__row:last-child {
  border-bottom: none;
}
.cc-herb--account table.woocommerce-orders-table td {
  display: block;
  border: none;
  padding: 0;
  font-family: 'VT323', monospace;
  font-size: 16px;
  color: var(--ink);
}
.cc-herb--account td.woocommerce-orders-table__cell-order-number {
  font-family: 'Dela Gothic One', sans-serif;
  font-size: 12px;
}
.cc-herb--account td.woocommerce-orders-table__cell-order-status mark {
  display: inline-block;
  font-family: 'Dela Gothic One', sans-serif;
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink);
  background: rgb(var(--color-brand-mint-rgb) / 0.25);
  padding: 4px 9px;
  border-radius: 999px;
}
.cc-herb--account td.woocommerce-orders-table__cell-order-actions {
  margin-left: auto;
}
.cc-herb--account td.woocommerce-orders-table__cell-order-actions .button {
  display: inline-block;
  border: 2px solid var(--ink);
  border-radius: 5px;
  background: var(--paper);
  box-shadow: 2px 2px 0 var(--ink);
  font-family: 'Dela Gothic One', sans-serif;
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink);
  padding: 8px 12px;
  text-decoration: none;
  transition: transform 0.1s, box-shadow 0.1s;
}
.cc-herb--account td.woocommerce-orders-table__cell-order-actions .button:hover {
  transform: translate(-1px, -1px);
  box-shadow: 3px 3px 0 var(--ink);
}
.cc-herb--account td.woocommerce-orders-table__cell-order-actions .button.pay {
  background: var(--coral);
  color: var(--paper-l);
}

.cc-herb--account .woocommerce-pagination {
  margin-top: 16px;
  font-family: 'VT323', monospace;
  font-size: 16px;
}
.cc-herb--account .woocommerce-pagination a {
  color: var(--navy);
}

/* ---- addresses ---- */
.cc-herb--account .woocommerce-Addresses {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
@media (max-width: 600px) {
  .cc-herb--account .woocommerce-Addresses {
    grid-template-columns: 1fr;
  }
}
.cc-herb--account .woocommerce-Address {
  background: var(--paper-l);
  border: 2px solid var(--ink);
  box-shadow: var(--sh-sm);
  border-radius: 9px 6px 10px 7px;
  padding: 16px;
}
.cc-herb--account .woocommerce-Address-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 10px;
}
.cc-herb--account .woocommerce-Address-title h2,
.cc-herb--account .woocommerce-Address-title h3 {
  font-family: 'Dela Gothic One', sans-serif;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink);
  margin: 0;
}
.cc-herb--account .woocommerce-Address-title a {
  font-family: 'VT323', monospace;
  font-size: 16px;
  color: var(--cer);
}
.cc-herb--account address {
  font-style: normal;
  font-family: 'Nunito', sans-serif;
  line-height: 1.6;
  color: var(--ink);
}

/* ---- edit-account / edit-address forms, login + register ---- */
.cc-herb--account form .form-row label,
.cc-herb--account fieldset legend {
  display: block;
  font-family: 'Dela Gothic One', sans-serif;
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink);
  margin-bottom: 7px;
}
.cc-herb--account form .form-row .required {
  color: var(--coral);
  text-decoration: none;
}
.cc-herb--account form .input-text,
.cc-herb--account form select {
  width: 100%;
  font-family: 'Nunito', sans-serif;
  font-weight: 700;
  font-size: 1rem;
  color: var(--ink);
  background: var(--paper);
  border: 3px solid var(--ink);
  border-radius: 8px 5px 9px 6px;
  padding: 11px 13px;
  box-shadow: inset 3px 3px 0 rgb(var(--color-foreground-rgb) / 0.1);
  outline: none;
}
.cc-herb--account form .input-text:focus,
.cc-herb--account form select:focus {
  border-color: var(--cer);
  background: var(--color-brand-white);
}
.cc-herb--account fieldset {
  border: 2px dashed rgb(var(--color-foreground-rgb) / 0.3);
  border-radius: 9px 6px 10px 7px;
  padding: 16px;
  margin-top: 20px;
}
.cc-herb--account button.woocommerce-Button,
.cc-herb--account input.woocommerce-Button {
  display: inline-block;
  background: var(--coral);
  color: var(--paper-l);
  border: 3px solid var(--ink);
  box-shadow: 5px 5px 0 var(--ink);
  font-family: 'Dela Gothic One', sans-serif;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 12px 20px;
  border-radius: 8px;
  cursor: pointer;
  transition: transform 0.1s, box-shadow 0.1s;
}
.cc-herb--account button.woocommerce-Button:hover,
.cc-herb--account input.woocommerce-Button:hover {
  background: var(--pink);
  transform: translate(-1px, -1px);
  box-shadow: 6px 6px 0 var(--ink);
}

/* logged-out state: login + register side by side */
.cc-herb--account .u-columns.col2-set {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
@media (max-width: 700px) {
  .cc-herb--account .u-columns.col2-set {
    grid-template-columns: 1fr;
  }
}
.cc-herb--account .woocommerce-form-login,
.cc-herb--account .woocommerce-form-register {
  background: var(--paper-l);
  border: 3px solid var(--ink);
  box-shadow: var(--sh-md);
  border-radius: 10px 7px 12px 6px;
  padding: 18px;
}
.cc-herb--account .woocommerce-form-login-toggle,
.cc-herb--account .woocommerce-form-register-toggle {
  font-family: 'Nunito', sans-serif;
}
.cc-herb--account .woocommerce-form__label-for-checkbox {
  font-family: 'VT323', monospace;
  font-size: 16px;
  color: var(--ink);
}
.cc-herb--account .lost_password a {
  font-family: 'VT323', monospace;
  font-size: 15px;
  color: var(--navy);
}