/* My Account Page Styling */

/* Hero Banner Styles (Same as Cart & Checkout) */
.woocommerce-account .fm-hero.fm-hero_s5 {
  position: relative !important;
  width: 100vw !important;
  max-width: none !important;
  height: 320px !important;
  margin: 0 0 50px !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding: 0 !important;
  overflow: hidden !important;
  display: block !important;
  clear: both !important;
}

.woocommerce-account .fm-hero.fm-hero_s5 .fm-hero__img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  -o-object-fit: cover !important;
     object-fit: cover !important;
  -o-object-position: center top !important;
     object-position: center top !important;
  z-index: 1 !important;
}

.woocommerce-account .fm-hero.fm-hero_s5 .hero__heading_title {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 20px 28px !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  background: rgba(0, 0, 0, 0.35) !important;
  color: #ffffff !important;
  font-family: "Zangezi", serif !important;
  font-size: 40px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5) !important;
}

@media (min-width: 992px) {
  .woocommerce-account .fm-hero.fm-hero_s5 .hero__heading_title {
    font-size: 60px !important;
    padding-bottom: 40px !important;
  }
}

.woocommerce-account {
  overflow-x: hidden;
}

/* Page Container & Layout */
.woocommerce-account .ast-container,
.woocommerce-account .site-content .ast-container {
  max-width: 1296px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.woocommerce-account .woocommerce {
  display: flex !important;
  flex-direction: column !important;
  gap: 32px !important;
  margin-top: 20px !important;
  margin-bottom: 80px !important;
}

@media (min-width: 768px) {
  .woocommerce-account .woocommerce {
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 40px !important;
  }
}

/* Sidebar Navigation */
.woocommerce-account .woocommerce-MyAccount-navigation {
  flex: 0 0 260px !important;
  max-width: 260px !important;
  width: 100% !important;
  background-color: #FBFBFB !important;
  border: 1px solid #E2E2E2 !important;
  border-radius: 16px !important;
  padding: 16px !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
  float: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block !important;
  padding: 12px 18px !important;
  border-radius: 10px !important;
  font-family: "ZangeziSans Text", sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #111111 !important;
  text-decoration: none !important;
  transition: all 0.3s ease-in-out !important;
  background-color: transparent !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li:hover a,
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
  background-color: #FF4200 !important;
  color: #ffffff !important;
}

/* Main Content Area */
.woocommerce-account .woocommerce-MyAccount-content {
  flex: 1 1 auto !important;
  width: 100% !important;
  float: none !important;
  background-color: #ffffff !important;
  border: 1px solid #E2E2E2 !important;
  border-radius: 16px !important;
  padding: 32px !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
  font-family: "ZangeziSans Text", sans-serif !important;
  color: #111111 !important;
  line-height: 1.6 !important;
}

.woocommerce-account .woocommerce-MyAccount-content p {
  font-size: 16px !important;
  color: #4B5563 !important;
  margin-bottom: 20px !important;
}

.woocommerce-account .woocommerce-MyAccount-content a {
  color: #FF4200 !important;
  text-decoration: underline !important;
  font-weight: 500 !important;
  transition: color 0.2s ease !important;
}

.woocommerce-account .woocommerce-MyAccount-content a:hover {
  color: #d13600 !important;
}

/* Headings inside My Account */
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
  font-family: "Zangezi", serif !important;
  font-size: 28px !important;
  font-weight: 400 !important;
  color: #111111 !important;
  margin-top: 0 !important;
  margin-bottom: 20px !important;
}

/* Form Controls & Inputs */
.woocommerce-account .woocommerce-MyAccount-content fieldset {
  border: 1px solid #E5E7EB !important;
  border-radius: 12px !important;
  padding: 24px !important;
  margin-top: 24px !important;
  margin-bottom: 24px !important;
}

.woocommerce-account .woocommerce-MyAccount-content legend {
  font-family: "Zangezi", serif !important;
  font-size: 22px !important;
  color: #111111 !important;
  padding: 0 10px !important;
}

.woocommerce-account .woocommerce-MyAccount-content label {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  margin-bottom: 6px !important;
  display: block !important;
}

.woocommerce-account .woocommerce-MyAccount-content input.input-text,
.woocommerce-account .woocommerce-MyAccount-content select,
.woocommerce-account .woocommerce-MyAccount-content textarea {
  border: 1px solid #D1D5DB !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  font-size: 15px !important;
  width: 100% !important;
  outline: none !important;
  box-sizing: border-box !important;
  transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}

.woocommerce-account .woocommerce-MyAccount-content input.input-text:focus,
.woocommerce-account .woocommerce-MyAccount-content select:focus,
.woocommerce-account .woocommerce-MyAccount-content textarea:focus {
  border-color: #FF4200 !important;
  box-shadow: 0 0 0 3px rgba(255, 66, 0, 0.1) !important;
}

/* Buttons */
.woocommerce-account .woocommerce-MyAccount-content button.button,
.woocommerce-account .woocommerce-MyAccount-content input[type="submit"].button,
.woocommerce-account .woocommerce-MyAccount-content a.button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 24px !important;
  background-color: #FF4200 !important;
  color: #ffffff !important;
  border: 1px solid #FF4200 !important;
  border-radius: 8px !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: all 0.3s ease-in-out !important;
  box-shadow: 0 2px 8px rgba(255, 66, 0, 0.2) !important;
}

.woocommerce-account .woocommerce-MyAccount-content button.button:hover,
.woocommerce-account .woocommerce-MyAccount-content input[type="submit"].button:hover,
.woocommerce-account .woocommerce-MyAccount-content a.button:hover {
  background-color: #e03a00 !important;
  border-color: #e03a00 !important;
  color: #ffffff !important;
}

/* Tables (Orders, Subscriptions, Addresses) */
.woocommerce-account table.shop_table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  width: 100% !important;
  margin-top: 20px !important;
  margin-bottom: 24px !important;
}

.woocommerce-account table.shop_table th {
  background-color: #F9FAFB !important;
  color: #374151 !important;
  font-weight: 600 !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid #E5E7EB !important;
  text-align: left !important;
}

.woocommerce-account table.shop_table td {
  padding: 14px 18px !important;
  border-bottom: 1px solid #E5E7EB !important;
  color: #4B5563 !important;
  vertical-align: middle !important;
}

.woocommerce-account table.shop_table tr:last-child td {
  border-bottom: none !important;
}

/* Addresses Section Fixes & Padding Improvements */
.woocommerce-account .woocommerce-MyAccount-content .u-columns,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses,
.woocommerce-account .woocommerce-MyAccount-content .col2-set,
.woocommerce-account .woocommerce-MyAccount-content .addresses {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 24px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 24px !important;
  margin-bottom: 24px !important;
  clear: both !important;
}

.woocommerce-account .woocommerce-MyAccount-content .u-columns::before,
.woocommerce-account .woocommerce-MyAccount-content .u-columns::after,
.woocommerce-account .woocommerce-MyAccount-content .col2-set::before,
.woocommerce-account .woocommerce-MyAccount-content .col2-set::after {
  display: none !important;
}

/* Card Container */
.woocommerce-account .woocommerce-MyAccount-content .u-column1,
.woocommerce-account .woocommerce-MyAccount-content .u-column2,
.woocommerce-account .woocommerce-MyAccount-content .col-1,
.woocommerce-account .woocommerce-MyAccount-content .col-2,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  background-color: #FBFBFB !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 16px !important;
  padding: 28px !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

/* Outer header wrapper reset */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address header.title,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address .title,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address header {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 0 16px 0 !important;
  border-bottom: 1px solid #E5E7EB !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Inner header title */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address header.title h3,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address .title h3,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address h3,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address h4 {
  font-family: "Zangezi", serif !important;
  font-size: 26px !important;
  font-weight: 400 !important;
  color: #111111 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

/* Edit / Add address button */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address header.title a,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address .title a,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address a.edit,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address header a {
  display: inline-flex !important;
  align-items: center !important;
  padding: 8px 16px !important;
  background-color: #ffffff !important;
  border: 1px solid #FF4200 !important;
  border-radius: 8px !important;
  font-family: "ZangeziSans Text", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #FF4200 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address header.title a:hover,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address .title a:hover,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address a.edit:hover {
  background-color: #FF4200 !important;
  color: #ffffff !important;
}

/* Address body text card */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address address,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address div.address-content {
  background-color: #ffffff !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 12px !important;
  padding: 20px 24px !important;
  margin: 0 !important;
  font-style: normal !important;
  font-family: "ZangeziSans Text", sans-serif !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  color: #4B5563 !important;
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}

/* Edit Address & Account Details Form Layouts */
.woocommerce-account .woocommerce-MyAccount-content form .form-row {
  margin-bottom: 16px !important;
  width: 100% !important;
}

.woocommerce-account .woocommerce-MyAccount-content form .form-row-first {
  width: 48% !important;
  float: left !important;
}

.woocommerce-account .woocommerce-MyAccount-content form .form-row-last {
  width: 48% !important;
  float: right !important;
}

.woocommerce-account .woocommerce-MyAccount-content form .form-row-wide {
  clear: both !important;
  width: 100% !important;
}

/* Notices & Alerts */
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-info,
.woocommerce-account .woocommerce-error {
  border-radius: 10px !important;
  padding: 14px 20px !important;
  margin-bottom: 24px !important;
  font-size: 15px !important;
  border-top-width: 1px !important;
}

.woocommerce-account .woocommerce-message {
  background-color: #ECFDF5 !important;
  border: 1px solid #A7F3D0 !important;
  color: #065F46 !important;
}

.woocommerce-account .woocommerce-info {
  background-color: #EFF6FF !important;
  border: 1px solid #BFDBFE !important;
  color: #1E40AF !important;
}

.woocommerce-account .woocommerce-error {
  background-color: #FEF2F2 !important;
  border: 1px solid #FCA5A5 !important;
  color: #991B1B !important;
}
