/**
 * WooCommerce My Account Styles
 *
 * Custom styles for My Account navigation and pages
 */

/* ==========================================================================
   My Account Navigation
   ========================================================================== */

.woocommerce-MyAccount-navigation {
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(10px);
  border-radius: 16px;
  padding: 2rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Greeting */
.bh-account-greeting {
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-weight: 800;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.edit-account-title {
  font-size: 18px;
  font-weight: 800;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-bottom: 32px;
}

/* Separator */
.bh-account-separator {
  border: none;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  margin: 14px 0 20px;
  width: 100%;
}

/* Navigation List */
.woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 24px;
}

.woocommerce-MyAccount-navigation li {
  margin: 0;
  padding: 0;
}

.woocommerce-MyAccount-navigation li a {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  color: #fff;
  text-decoration: none;
  border-radius: 8px;
  transition: all 0.3s ease;
  font-family: "Inter", sans-serif;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.edit-account-wrap {
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  padding: 24px 24px 0;
  margin-bottom: 32px;
}

.woocommerce-MyAccount-navigation li a:hover svg path {
  stroke: #0096cf;
}

/* Active state */
.woocommerce-MyAccount-navigation li.is-active a svg path,
.woocommerce-MyAccount-navigation li a[aria-current="page"] svg path {
  stroke: #0096cf;
}
.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation li a[aria-current="page"] {
  font-weight: 700;
}
.woocommerce-MyAccount-navigation ul hr {
  margin: 0;
}

/* Icon */
.bh-account-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

.bh-account-icon svg {
  width: 24px;
  height: 24px;
  color: #fff;
}

/* Label */
.bh-account-label {
  flex: 1;
}

/* Logout link - special styling */
.woocommerce-MyAccount-navigation
  li.woocommerce-MyAccount-navigation-link--customer-logout
  a {
  color: #e22415;
}

.woocommerce-MyAccount-navigation
  li.woocommerce-MyAccount-navigation-link--customer-logout
  a:hover
  svg
  path {
  stroke: #e22415;
}

.woocommerce-MyAccount-navigation
  li.woocommerce-MyAccount-navigation-link--customer-logout
  .bh-account-icon
  svg {
  color: #e22415;
}

/* Background ellipse */
.bh-account-navigation-ellipse {
  position: absolute;
  bottom: -100px;
  left: 50%;
  transform: translateX(-50%);
  pointer-events: none;
  z-index: -1;
  opacity: 0.5;
}

.bhcar-account-legend {
  margin: 14px 0;
  font-size: 14px;
  font-weight: 400;
  font-family: "Inter", sans-serif;
  color: #fff;
}

.bhcar-account-section-title {
  margin: 32px 0 20px;
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter", sans-serif;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

/* Google Places Autocomplete styling */
#billing_address_1.pac-target-input,
#reg_billing_address_1.pac-target-input {
  background-image: none;
  position: relative;
}

/* Remove Google Places default powered by logo from dropdown */
.pac-container {
  background-color: #1a1a1a;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  margin-top: 4px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

.pac-item {
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  padding: 10px;
  color: #fff;
  cursor: pointer;
  font-family: "Inter", sans-serif;
}

.pac-item:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

.pac-item-query {
  color: #fff;
  font-weight: 600;
}

.pac-matched {
  font-weight: 700;
}

.bhcar-account-labels label {
  width: calc(100% - 25px);
}

/* ==========================================================================
   Edit Account Form - Desktop Layout
   ========================================================================== */

/* Desktop: Two columns layout for form fields */
@media (min-width: 769px) {
  .edit-account-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 24px;
  }

  /* Full width elements */
  .edit-account-wrap > .clear,
  .edit-account-wrap > fieldset,
  .edit-account-wrap > .bhcar-account-section-title,
  .edit-account-wrap .form-row-wide {
    grid-column: 1 / -1;
  }

  /* First name and Last name on the same row */
  .edit-account-wrap .woocommerce-form-row--first {
    grid-column: 1;
  }

  .edit-account-wrap .woocommerce-form-row--last {
    grid-column: 2;
  }

  /* Password fields - two columns layout */
  .bhcar-account-labels {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 0 24px;
  }

  .bhcar-account-labels > .woocommerce-form-row:first-child {
    grid-column: 1 / -1;
  }

  .bhcar-account-labels > .woocommerce-form-row:nth-child(2) {
    grid-column: 1;
  }

  .bhcar-account-labels > .woocommerce-form-row:nth-child(3) {
    grid-column: 2;
  }
}

/* ==========================================================================
   Responsive Design
   ========================================================================== */

@media (max-width: 768px) {
  button.woocommerce-Button.button {
    width: 100%;
  }
  .logged-in.woocommerce-account .bh-profile .woocommerce {
    gap: 32px;
  }
  .bhcar-account-labels .woocommerce-form-row input,
  .bhcar-register-row-split input {
    padding: 36px 16px 8px !important;
  }
  .woocommerce-MyAccount-navigation {
    padding: 1.5rem;
  }

  .bh-account-greeting {
    font-size: 1rem;
  }

  .woocommerce-MyAccount-navigation li a {
    padding: 0.75rem;
    font-size: 0.9rem;
  }

  .bh-account-icon {
    width: 20px;
    height: 20px;
  }

  .bh-account-icon svg {
    width: 20px;
    height: 20px;
  }
}

/* ---------- ORDERS styles ------------- */

.woocommerce-orders-table {
  margin: 0;
  border-spacing: 0 10px;
  border-collapse: unset;
}
.woocommerce-orders-table__header {
  padding: 8px 24px 16px;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  letter-spacing: 0.03em;
  color: #fff;
}
.woocommerce-orders-table__cell {
  padding: 6px 24px;
  vertical-align: middle;
}
.account-orders tbody .woocommerce-orders-table__row:nth-child(even) {
  border-radius: 16px;
  background-color: rgba(0, 150, 207, 0.2);
}
.woocommerce-orders-table__cell,
.woocommerce-orders-table__cell * {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 14px !important;
  line-height: 150%;
  letter-spacing: -0.01em;
  color: #fff;
}
.woocommerce-orders-table tbody tr:nth-of-type(2n) td,
.woocommerce-orders-table tbody tr:nth-of-type(2n) th {
  background: rgba(0, 150, 207, 0.2);
}
.woocommerce-orders-table tbody tr:nth-of-type(2n) th {
  border-radius: 16px 0 0 16px;
}
.woocommerce-orders-table tbody tr:nth-of-type(2n) td:last-of-type {
  border-radius: 0 16px 16px 0;
}
.woocommerce-orders-table__row {
  border-bottom: 0;
}
.woocommerce-button.button.view {
  border: 1px solid #0096cf;
  border-radius: 5px;
  padding: 8px 17px;
  display: block;
  width: fit-content;
  text-decoration: unset;
}
.woocommerce p,
.woocommerce p > * {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #fff;
}
@media (max-width: 1920px) {
  .woocommerce p, .woocommerce p > *{
    font-size: 14px;
  }
}
.woocommerce p > mark {
  background: transparent;
  color: #0096cf;
  font-weight: 700;
  margin: 0 5px;
}
.woocommerce-order-details__title {
  margin: 16px 0;
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}
.woocommerce-order-details {
  width: 100%;
}
.woocommerce-table.woocommerce-table--order-details {
  margin-top: 16px;
}
.woocommerce-table.woocommerce-table--order-details td,
.woocommerce-table.woocommerce-table--order-details th {
  padding: 16px 24px;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  color: #fff;
}
.woocommerce-table.woocommerce-table--order-details th {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
}
.woocommerce-table__line-item.order_item {
  border: 0 !important;
}
tbody .woocommerce-table__line-item.order_item,
tbody .woocommerce-table__line-item.order_item td {
  transition: 0.4s background linear;
}
tbody .woocommerce-table__line-item.order_item:hover,
tbody .woocommerce-table__line-item.order_item:hover td {
  background: #0096cf;
}
tfoot .woocommerce-Price-amount.amount {
  color: #0096cf !important;
  font-weight: 900 !important;
}
.woocommerce-column__title {
  margin: 16px 0;
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}
.woocommerce-customer-details {
  width: 100%;
}
.woocommerce-customer-details address {
  color: #fff;
  font-family: "Inter", sans-serif;
  font-size: 16px;
}
.woocommerce-columns.woocommerce-columns--2.woocommerce-columns--addresses.col2-set.addresses {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 16px;
  width: 100%;
}
.order-again * {
  display: block;
  color: #e22415 !important;
  margin: 24px 0;
}
.woocommerce-column > address {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #fff;
}
.woocommerce-customer-details--phone,
.woocommerce-customer-details--email {
  font-weight: 700 !important;
}

.account-orders {
  width: 100%;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  padding: 24px;
  thead {
    border-bottom: unset;
  }
}

@media (max-width: 768px) {
  .woocommerce-orders-table__header {
    font-size: 16px;
  }
  .woocommerce-MyAccount-navigation ul {
    gap: 16px;
  }
  .woocommerce-MyAccount-content {
    .form-row {
      margin-bottom: 16px;
    }
    .woocommerce-form-row label {
      font-size: 14px !important;
    }
    .woocommerce-form-row input {
      font-size: 14px;
    }
    .edit-account-wrap {
      padding-bottom: 8px;
      margin-bottom: 24px;
    }
  }
  .edit-account-title {
    text-align: center;
    margin-bottom: 24px;
  }
  .woocommerce-orders-table thead {
    border: none;
  }
  .woocommerce-orders-table thead tr {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .woocommerce-orders-table__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .woocommerce-orders-table__cell,
  .woocommerce-orders-table__header {
    padding: 13px 16px;
  }
  .woocommerce-orders-table__header {
    font-weight: 700;
  }
  .woocommerce-orders-table tbody tr:nth-of-type(2n) th {
    border-radius: 16px 0 0 0;
  }
  .woocommerce-orders-table tbody tr:nth-of-type(2n) td:nth-of-type(1) {
    border-radius: 0 16px 0 0;
  }
  .woocommerce-orders-table tbody tr:nth-of-type(2n) td:last-of-type {
    border-radius: 0 0 16px 16px;
    grid-column: 2 span;
  }
}
@media (max-width: 630px) {
  .woocommerce-columns.woocommerce-columns--2.woocommerce-columns--addresses.col2-set.addresses {
    grid-template-columns: 100%;
  }
  .woocommerce-table.woocommerce-table--order-details.shop_table.order_details
    tr {
    display: flex;
    flex-direction: column;
  }
}