/* =============================================================================
   DISPLAYARAMA theme — My Account
   1. Page + layout   2. Menu   3. Dashboard   4. Tables (orders, downloads)
   5. Addresses   6. Forms + buttons   7. Login / register / lost password   8. Notices   9. Phones
   ============================================================================= */

/* ---------- 1. PAGE + LAYOUT ---------- */
body.woocommerce-account .dra-page { font-family: var(--dra-font-body); color: var(--dra-text); }
body.woocommerce-account .entry-header .entry-title {
  font-family: var(--dra-font-display); font-weight: 400; text-transform: uppercase; letter-spacing: .02em;
  font-size: clamp(36px, 4.4vw, 56px); line-height: 1.05; margin-bottom: 28px;
}
body.woocommerce-account:not(.dra-account-guest) .entry-content > .woocommerce {
  display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 32px; align-items: start;
}
body.woocommerce-account .entry-content > .woocommerce::before,
body.woocommerce-account .entry-content > .woocommerce::after { content: none; }
body.woocommerce-account .woocommerce-MyAccount-navigation,
body.woocommerce-account .woocommerce-MyAccount-content { float: none; width: auto; margin: 0; }
body.woocommerce-account .woocommerce-MyAccount-content {
  background: #fff; border: 1px solid var(--dra-border); border-radius: var(--dra-radius); padding: 32px;
  min-height: 100%; font-size: 16px; line-height: 1.65;
}
body.woocommerce-account .woocommerce-MyAccount-content > *:last-child { margin-bottom: 0; }
body.woocommerce-account .woocommerce-MyAccount-content h2,
body.woocommerce-account .woocommerce-MyAccount-content h3,
body.woocommerce-account .woocommerce-column__title,
body.woocommerce-account .woocommerce-order-details__title {
  font-family: var(--dra-font-display); font-weight: 400; text-transform: uppercase; letter-spacing: .02em;
  font-size: 30px; line-height: 1.1; color: var(--dra-heading); margin: 0 0 16px;
}
body.woocommerce-account .woocommerce-MyAccount-content a:not(.button):not(.dra-btn):not(.dra-acc-card) { color: var(--dra-blue); font-weight: 600; }

/* ---------- 2. MENU ---------- */
.woocommerce-MyAccount-navigation {
  position: sticky; top: calc(var(--dra-nav-h) + 20px);
  background: #fff; border: 1px solid var(--dra-border); border-radius: var(--dra-radius); padding: 10px;
}
.admin-bar .woocommerce-MyAccount-navigation { top: calc(var(--dra-nav-h) + 52px); }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; }
.woocommerce-MyAccount-navigation li { margin: 0; }
.woocommerce-MyAccount-navigation li a {
  display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-radius: 8px;
  font: 600 15px/1.3 var(--dra-font-body); color: var(--dra-heading); text-decoration: none;
  transition: background-color .2s, color .2s;
}
.dra-acc-nav__icon { display: inline-flex; color: var(--dra-blue); flex-shrink: 0; }
.woocommerce-MyAccount-navigation li a:hover { background: #f1f5fc; color: var(--dra-blue); }
.woocommerce-MyAccount-navigation li.is-active a { background: var(--dra-blue); color: #fff; }
.woocommerce-MyAccount-navigation li.is-active .dra-acc-nav__icon { color: #fff; }
.woocommerce-MyAccount-navigation-link--customer-logout { border-top: 1px solid var(--dra-border); margin-top: 6px !important; padding-top: 6px; }
.woocommerce-MyAccount-navigation-link--customer-logout a { color: var(--dra-muted); }
.woocommerce-MyAccount-navigation-link--customer-logout .dra-acc-nav__icon { color: var(--dra-muted); }

/* ---------- 3. DASHBOARD ---------- */
.dra-acc-welcome { margin-bottom: 28px; }
.dra-acc-welcome .dra-eyebrow { margin-bottom: 12px; }
.dra-acc-welcome__title {
  font-family: var(--dra-font-display) !important; font-weight: 400 !important; text-transform: uppercase;
  font-size: clamp(32px, 3.6vw, 48px) !important; line-height: 1.05 !important; letter-spacing: .02em; margin: 0 0 6px !important;
}
.dra-acc-welcome__title span { color: var(--dra-blue); }
.dra-acc-welcome__sub { color: var(--dra-muted); margin: 0; }

.dra-acc-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; margin-bottom: 24px; }
.dra-acc-card {
  position: relative; display: flex; flex-direction: column; gap: 6px; padding: 22px 22px 24px;
  border: 1px solid var(--dra-border); border-radius: var(--dra-radius); background: #fff;
  text-decoration: none !important; color: var(--dra-text); transition: border-color .25s, box-shadow .25s, transform .25s;
}
.dra-acc-card:hover { border-color: rgba(31,77,164,.35); box-shadow: 0 14px 30px -18px rgba(31,77,164,.4); transform: translateY(-2px); }
.dra-acc-card__icon {
  display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-bottom: 8px;
  border-radius: 10px; background: #eef3fb; color: var(--dra-blue);
}
.dra-acc-card__label { font-size: 17px; font-weight: 700; color: var(--dra-heading); }
.dra-acc-card__text { font-size: 14px; color: var(--dra-muted); line-height: 1.5; }
.dra-acc-card__go { position: absolute; top: 22px; right: 22px; color: var(--dra-blue); transition: transform .2s; }
.dra-acc-card:hover .dra-acc-card__go { transform: translateX(3px); }

.dra-acc-help {
  display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap;
  padding: 22px 24px; border-radius: var(--dra-radius);
  background: linear-gradient(120deg, var(--dra-navy) 0%, var(--dra-blue) 100%); color: #fff;
}
.dra-acc-help__title { font-family: var(--dra-font-display); font-size: 26px; letter-spacing: .02em; text-transform: uppercase; margin: 0 0 2px; color: #fff; }
.dra-acc-help__text { margin: 0; color: rgba(255,255,255,.85); font-size: 15px; }
.dra-acc-help .dra-btn { background: #fff; border-color: #fff; color: var(--dra-blue) !important; }
.dra-acc-help .dra-btn:hover { background: #eef3fb; }

/* ---------- 4. TABLES (orders, downloads, order details) ---------- */
body.woocommerce-account table.shop_table {
  width: 100%; border-collapse: separate; border-spacing: 0; margin: 0 0 24px;
  border: 1px solid var(--dra-border); border-radius: 10px; overflow: hidden; font-size: 15px;
}
body.woocommerce-account table.shop_table th,
body.woocommerce-account table.shop_table td { padding: 14px 16px; border: 0; border-top: 1px solid var(--dra-border); text-align: left; vertical-align: middle; }
body.woocommerce-account table.shop_table thead th {
  border-top: 0; background: #f4f7fd; color: var(--dra-heading); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
}
body.woocommerce-account table.shop_table tbody tr:hover td { background: #fafbfe; }
body.woocommerce-account table.shop_table tfoot th { font-weight: 600; }
body.woocommerce-account table.shop_table tfoot tr:last-child td,
body.woocommerce-account table.shop_table tfoot tr:last-child th { font-weight: 700; color: var(--dra-heading); font-size: 16px; }
.woocommerce-orders-table__cell-order-number a { font-weight: 700; }
.woocommerce-orders-table__cell-order-status { font-weight: 600; }
.woocommerce-orders-table__cell-order-actions .button { margin: 2px 4px 2px 0; }
mark.order-number, mark.order-date, mark.order-status { background: none; color: var(--dra-heading); font-weight: 700; }
.woocommerce-pagination { display: flex; gap: 10px; justify-content: space-between; }

/* ---------- 5. ADDRESSES ---------- */
body.woocommerce-account .woocommerce-Addresses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
body.woocommerce-account .woocommerce-Addresses::before, body.woocommerce-account .woocommerce-Addresses::after { content: none; }
body.woocommerce-account .woocommerce-Addresses .woocommerce-Address { float: none; width: auto; margin: 0; padding: 22px; border: 1px solid var(--dra-border); border-radius: 10px; }
body.woocommerce-account .woocommerce-Address-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
body.woocommerce-account .addresses .woocommerce-Address-title.title::before,
body.woocommerce-account .addresses .woocommerce-Address-title.title::after { content: none; display: none; }
body.woocommerce-account .woocommerce-Address-title h2,
body.woocommerce-account .woocommerce-Address-title h3 { font-size: 24px; margin: 0; width: auto; float: none; text-align: left; }
body.woocommerce-account .woocommerce-Address-title .edit { white-space: nowrap; }
body.woocommerce-account .woocommerce-Address-title .edit { float: none; font-size: 14px; }
body.woocommerce-account address { font-style: normal; line-height: 1.7; color: var(--dra-text); }
body.woocommerce-account .woocommerce-customer-details address { border: 1px solid var(--dra-border); border-radius: 10px; padding: 18px 20px; }
body.woocommerce-account .woocommerce-columns--addresses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
body.woocommerce-account .woocommerce-columns--addresses::before, body.woocommerce-account .woocommerce-columns--addresses::after { content: none; }
body.woocommerce-account .woocommerce-columns--addresses .woocommerce-column { float: none; width: auto; }

/* ---------- 6. FORMS + BUTTONS ---------- */
body.woocommerce-account form .form-row { margin: 0 0 16px; padding: 0; }
body.woocommerce-account form .form-row label { display: block; font-size: 14px; font-weight: 600; color: var(--dra-heading); margin-bottom: 6px; line-height: 1.4; }
body.woocommerce-account form .form-row .required { color: #c0392b; text-decoration: none; }
body.woocommerce-account form input.input-text,
body.woocommerce-account form input[type="email"],
body.woocommerce-account form input[type="password"],
body.woocommerce-account form input[type="text"],
body.woocommerce-account form input[type="tel"],
body.woocommerce-account form textarea,
body.woocommerce-account form select,
body.woocommerce-account .select2-container .select2-selection--single {
  width: 100%; min-height: 48px; padding: 10px 14px; border: 1px solid #d5dae3; border-radius: 8px; background: #fff;
  font: 400 16px/1.4 var(--dra-font-body); color: var(--dra-text); box-shadow: none; transition: border-color .2s, box-shadow .2s;
}
body.woocommerce-account form input:focus, body.woocommerce-account form textarea:focus, body.woocommerce-account form select:focus,
body.woocommerce-account .select2-container--focus .select2-selection--single,
body.woocommerce-account .select2-container--open .select2-selection--single { outline: 0; border-color: var(--dra-blue); box-shadow: 0 0 0 3px rgba(31,77,164,.15); }
body.woocommerce-account .select2-container .select2-selection--single { display: flex; align-items: center; }
body.woocommerce-account .select2-container .select2-selection--single .select2-selection__rendered { padding: 0; line-height: 1.4; color: var(--dra-text); }
body.woocommerce-account .select2-container .select2-selection--single .select2-selection__arrow { height: 46px; right: 8px; }
body.woocommerce-account form .form-row-first, body.woocommerce-account form .form-row-last { width: calc(50% - 8px); }
body.woocommerce-account form .password-input { display: block; position: relative; }
body.woocommerce-account form .show-password-input { top: 50%; transform: translateY(-50%); right: 12px; }
body.woocommerce-account fieldset { margin: 28px 0 8px; padding: 22px; border: 1px solid var(--dra-border); border-radius: 10px; }
body.woocommerce-account fieldset legend { padding: 0 8px; font: 400 24px/1 var(--dra-font-display); letter-spacing: .02em; text-transform: uppercase; color: var(--dra-heading); }
body.woocommerce-account #account_display_name_description { display: block; margin-top: 6px; font-size: 13px; color: var(--dra-muted); }
.woocommerce-password-strength { margin-top: 8px; padding: 8px 12px; border-radius: 6px; font-size: 13px; }

body.woocommerce-account .button,
body.woocommerce-account button.button,
body.woocommerce-account a.button,
body.woocommerce-account input.button {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 10px 20px;
  font: 600 14.5px/1.2 var(--dra-font-body); color: #fff !important; text-decoration: none !important;
  background: var(--dra-blue) !important; border: 1px solid var(--dra-blue); border-radius: 8px; cursor: pointer; transition: background-color .2s;
}
body.woocommerce-account .button:hover { background: var(--dra-blue-dark) !important; }
body.woocommerce-account .woocommerce-orders-table .button.view,
body.woocommerce-account .woocommerce-orders-table .button.cancel,
body.woocommerce-account .order-again .button { min-height: 38px; padding: 8px 14px; font-size: 13.5px; }
body.woocommerce-account .woocommerce-orders-table .button.cancel { background: #fff !important; color: var(--dra-blue) !important; }
body.woocommerce-account .woocommerce-orders-table .button.cancel:hover { background: #f1f5fc !important; }

/* ---------- 7. LOGIN / REGISTER / LOST PASSWORD ---------- */
body.dra-account-guest .entry-header { text-align: center; }
body.dra-account-guest #customer_login {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; max-width: 1040px; margin: 0 auto;
}
body.dra-account-guest #customer_login::before, body.dra-account-guest #customer_login::after { content: none; }
body.dra-account-guest #customer_login > .u-column1,
body.dra-account-guest #customer_login > .u-column2 { float: none; width: auto; }
body.dra-account-guest #customer_login h2 {
  font-family: var(--dra-font-display); font-weight: 400; text-transform: uppercase; letter-spacing: .02em; font-size: 32px; margin: 0 0 14px;
}
body.dra-account-guest .entry-content > .woocommerce > h2 {
  max-width: 560px; margin: 0 auto 14px; text-align: center;
  font-family: var(--dra-font-display); font-weight: 400; text-transform: uppercase; letter-spacing: .02em; font-size: 32px;
}
body.dra-account-guest form.woocommerce-form-login,
body.dra-account-guest form.woocommerce-form-register,
body.dra-account-guest form.woocommerce-ResetPassword,
body.dra-account-guest .entry-content > .woocommerce > form.login {
  margin: 0; padding: 28px; border: 1px solid var(--dra-border); border-radius: var(--dra-radius); background: #fff;
  box-shadow: 0 18px 40px -30px rgba(24,51,103,.45);
}
body.dra-account-guest form.woocommerce-ResetPassword,
body.dra-account-guest .entry-content > .woocommerce > form.login { max-width: 560px; margin: 0 auto; }
body.dra-account-guest form.woocommerce-ResetPassword > p:first-child { color: var(--dra-muted); }
body.dra-account-guest form .form-row-first, body.dra-account-guest form .form-row-last { width: 100%; float: none; }
body.dra-account-guest .woocommerce-form-login__rememberme { display: inline-flex; align-items: center; gap: 8px; font-weight: 500 !important; margin: 4px 16px 4px 0; }
body.dra-account-guest .woocommerce-form-login__submit,
body.dra-account-guest .woocommerce-form-register__submit { width: 100%; min-height: 48px !important; font-size: 15.5px !important; margin-top: 8px; }
body.dra-account-guest .woocommerce-LostPassword { margin: 14px 0 0; font-size: 14px; }
body.dra-account-guest .woocommerce-LostPassword a { color: var(--dra-blue); font-weight: 600; }
body.dra-account-guest .woocommerce-privacy-policy-text { font-size: 13px; color: var(--dra-muted); }
body.dra-account-guest .woocommerce-privacy-policy-text a { color: var(--dra-blue); }

/* ---------- 8. NOTICES ---------- */
body.woocommerce-account .woocommerce-message,
body.woocommerce-account .woocommerce-info,
body.woocommerce-account .woocommerce-error {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; position: relative; list-style: none;
  margin: 0 0 22px; padding: 14px 18px 14px 48px; border: 1px solid rgba(31,77,164,.2); border-left: 4px solid var(--dra-blue);
  border-radius: 10px; background: #f4f7fd; color: var(--dra-text); font: 500 15px/1.5 var(--dra-font-body);
}
body.woocommerce-account .woocommerce-message::before,
body.woocommerce-account .woocommerce-info::before,
body.woocommerce-account .woocommerce-error::before { top: 50%; left: 18px; transform: translateY(-50%); color: var(--dra-blue); }
body.woocommerce-account .woocommerce-message { border-left-color: var(--dra-green); background: #f2fbf5; border-color: rgba(34,197,94,.3); }
body.woocommerce-account .woocommerce-message::before { color: #1f9d4f; }
body.woocommerce-account .woocommerce-error { border-left-color: #c0392b; background: #fdf4f3; border-color: rgba(192,57,43,.25); flex-direction: column; align-items: flex-start; }
body.woocommerce-account .woocommerce-error::before { color: #c0392b; top: 24px; }
body.woocommerce-account .woocommerce-message .button,
body.woocommerce-account .woocommerce-info .button { order: 2; margin-left: auto; min-height: 38px; padding: 8px 14px; font-size: 13.5px; }

/* ---------- 9. PHONES + TABLETS ---------- */
@media (max-width: 960px) {
  body.woocommerce-account:not(.dra-account-guest) .entry-content > .woocommerce { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .woocommerce-MyAccount-navigation { position: static; padding: 6px; min-width: 0; }
  .woocommerce-MyAccount-navigation ul { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
  .woocommerce-MyAccount-navigation li a { white-space: nowrap; padding: 10px 12px; font-size: 14px; gap: 8px; }
  .woocommerce-MyAccount-navigation-link--customer-logout { border-top: 0; margin-top: 0 !important; padding-top: 0; }
}
@media (max-width: 760px) {
  body.dra-account-guest #customer_login { grid-template-columns: 1fr; }
  body.woocommerce-account .woocommerce-Addresses,
  body.woocommerce-account .woocommerce-columns--addresses { grid-template-columns: 1fr; }
  body.woocommerce-account form .form-row-first, body.woocommerce-account form .form-row-last { width: 100%; float: none; }
}
@media (max-width: 600px) {
  body.woocommerce-account .woocommerce-MyAccount-content { padding: 20px 16px; }
  body.dra-account-guest form.woocommerce-form-login,
  body.dra-account-guest form.woocommerce-form-register,
  body.dra-account-guest form.woocommerce-ResetPassword { padding: 20px 16px; }
  .dra-acc-help { flex-direction: column; align-items: flex-start; }
  .dra-acc-help .dra-btn { width: 100%; }
  /* WooCommerce's responsive tables: each row becomes a card */
  body.woocommerce-account table.shop_table_responsive thead { display: none; }
  body.woocommerce-account table.shop_table_responsive tbody tr { display: block; border-top: 1px solid var(--dra-border); }
  body.woocommerce-account table.shop_table_responsive tbody tr:first-child { border-top: 0; }
  body.woocommerce-account table.shop_table_responsive tbody td,
  body.woocommerce-account table.shop_table_responsive tbody th { display: flex; justify-content: space-between; gap: 12px; padding: 8px 16px; border-top: 0; text-align: right !important; }
  body.woocommerce-account table.shop_table_responsive tbody td::before { content: attr(data-title); font-weight: 600; color: var(--dra-heading); text-align: left; float: none; }
  body.woocommerce-account table.shop_table_responsive tbody td.woocommerce-orders-table__cell-order-actions { flex-wrap: wrap; justify-content: flex-end; padding-bottom: 14px; }
  body.woocommerce-account table.shop_table_responsive tbody td.woocommerce-orders-table__cell-order-actions::before { content: none; }
}
