/*
 * Siteskyline SaaS Account Styling
 * Only affects WooCommerce's My Account content. Change --ssa-primary to
 * recolour the complete interface.
 */
.woocommerce-account .woocommerce {
  --ssa-primary: #3282b8;
  --ssa-primary-hover: #286a96;
  --ssa-primary-soft: #eaf3f8;
  --ssa-ink: #172033;
  --ssa-muted: #65738a;
  --ssa-line: #e4eaf1;
  --ssa-surface: #ffffff;
  --ssa-canvas: #f7f9fc;
  --ssa-radius: 14px;
  --ssa-shadow: 0 10px 30px rgba(20, 40, 70, .07);
  color: var(--ssa-ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Two-column application shell */
.woocommerce-account .woocommerce::after { content: ""; display: table; clear: both; }
.woocommerce-account .woocommerce-MyAccount-navigation {
  float: left;
  width: 230px;
  margin: 0 32px 0 0;
  padding: 10px;
  background: var(--ssa-canvas);
  border: 1px solid var(--ssa-line);
  border-radius: var(--ssa-radius);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul { margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li { margin: 2px 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation a {
  display: block;
  padding: 11px 13px;
  border-radius: 9px;
  color: var(--ssa-muted);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  text-decoration: none;
  transition: color .18s ease, background-color .18s ease, transform .18s ease;
}
.woocommerce-account .woocommerce-MyAccount-navigation a:hover {
  background: #fff;
  color: var(--ssa-primary);
  transform: translateX(2px);
}
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation a[aria-current="page"] {
  background: var(--ssa-primary);
  color: #fff;
  box-shadow: 0 5px 14px rgba(50, 130, 184, .25);
}
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout { margin-top: 10px !important; padding-top: 10px !important; border-top: 1px solid var(--ssa-line); }
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a { color: #b84b4b; }
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a:hover { background: #fff0f0; color: #a93838; }

.woocommerce-account .woocommerce-MyAccount-content {
  float: none;
  width: auto;
  min-width: 0;
  overflow: hidden;
  padding: 30px;
  background: var(--ssa-surface);
  border: 1px solid var(--ssa-line);
  border-radius: var(--ssa-radius);
  box-shadow: var(--ssa-shadow);
}
.woocommerce-account .woocommerce-MyAccount-content > :first-child { margin-top: 0; }
.woocommerce-account .woocommerce-MyAccount-content > :last-child { margin-bottom: 0; }
.woocommerce-account .woocommerce-MyAccount-content p { color: var(--ssa-muted); line-height: 1.7; }
.woocommerce-account .woocommerce-MyAccount-content p + p { margin-top: 14px; }
.woocommerce-account .woocommerce-MyAccount-content a:not(.button) { color: var(--ssa-primary); font-weight: 600; text-underline-offset: 3px; }
.woocommerce-account .woocommerce-MyAccount-content a:not(.button):hover { color: var(--ssa-primary-hover); }
.woocommerce-account .woocommerce-MyAccount-content strong { color: var(--ssa-ink); }
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 { color: var(--ssa-ink); font-size: 20px; font-weight: 750; letter-spacing: -.02em; }

/* Buttons, alerts and form controls */
.woocommerce-account .woocommerce .button,
.woocommerce-account .woocommerce button.button,
.woocommerce-account .woocommerce input.button,
.woocommerce-account .woocommerce input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 15px;
  border: 1px solid var(--ssa-primary) !important;
  border-radius: 8px !important;
  background: var(--ssa-primary) !important;
  color: #fff !important;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  box-shadow: none;
  transition: background-color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.woocommerce-account .woocommerce .button:hover,
.woocommerce-account .woocommerce button.button:hover,
.woocommerce-account .woocommerce input.button:hover,
.woocommerce-account .woocommerce input[type="submit"]:hover {
  background: var(--ssa-primary-hover) !important;
  border-color: var(--ssa-primary-hover) !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(50, 130, 184, .22);
}
.woocommerce-account .woocommerce input[type="text"],
.woocommerce-account .woocommerce input[type="email"],
.woocommerce-account .woocommerce input[type="password"],
.woocommerce-account .woocommerce input[type="tel"],
.woocommerce-account .woocommerce select,
.woocommerce-account .woocommerce textarea {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #d8e1eb !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--ssa-ink) !important;
  box-shadow: none !important;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.woocommerce-account .woocommerce textarea { min-height: 110px; }
.woocommerce-account .woocommerce input:focus,
.woocommerce-account .woocommerce select:focus,
.woocommerce-account .woocommerce textarea:focus { border-color: var(--ssa-primary) !important; outline: 0; box-shadow: 0 0 0 3px rgba(50, 130, 184, .13) !important; }
.woocommerce-account .woocommerce label { display: block; margin-bottom: 7px; color: var(--ssa-ink); font-size: 13px; font-weight: 700; }
.woocommerce-account .woocommerce .form-row { margin-bottom: 19px; }
.woocommerce-account .woocommerce fieldset { margin: 28px 0 22px; padding: 22px; border: 1px solid var(--ssa-line); border-radius: 10px; background: var(--ssa-canvas); }
.woocommerce-account .woocommerce legend { padding: 0 8px; color: var(--ssa-ink); font-size: 15px; font-weight: 750; }
.woocommerce-account .woocommerce .woocommerce-info,
.woocommerce-account .woocommerce .woocommerce-message,
.woocommerce-account .woocommerce .woocommerce-error {
  position: relative;
  margin: 0 0 22px;
  padding: 14px 16px 14px 50px;
  border: 1px solid #c9e1ef;
  border-left: 4px solid var(--ssa-primary);
  border-radius: 9px;
  background: var(--ssa-primary-soft);
  color: #27516b;
  box-shadow: none;
}
/*
 * WooCommerce normally uses a webfont for these icons. Some themes prevent that
 * font from loading, leaving a square glyph. Use plain, accessible CSS symbols
 * instead, so notices work with every theme and cache configuration.
 */
.woocommerce-account .woocommerce .woocommerce-info::before,
.woocommerce-account .woocommerce .woocommerce-message::before,
.woocommerce-account .woocommerce .woocommerce-error::before {
  position: absolute !important;
  top: 50% !important;
  left: 15px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 21px !important;
  height: 21px !important;
  margin: 0 !important;
  border: 2px solid currentColor;
  border-radius: 50%;
  background: transparent !important;
  color: var(--ssa-primary) !important;
  content: "i" !important;
  font-family: Arial, sans-serif !important;
  font-size: 13px !important;
  font-style: normal !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-align: center !important;
  transform: translateY(-50%);
}
.woocommerce-account .woocommerce .woocommerce-message::before {
  border: 0;
  color: #21734d !important;
  content: "✓" !important;
  font-size: 23px !important;
}
.woocommerce-account .woocommerce .woocommerce-error { border-color: #f1caca; border-left-color: #c84242; background: #fff5f5; color: #7f3434; }
.woocommerce-account .woocommerce .woocommerce-error::before { border-color: #c84242; color: #c84242 !important; content: "!" !important; }
.woocommerce-account .woocommerce .show-password-input::after {
  font-family: Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

/* Data tables and account cards */
.woocommerce-account .woocommerce table.shop_table,
.woocommerce-account .woocommerce table.woocommerce-orders-table {
  width: 100%;
  margin: 0;
  border: 1px solid var(--ssa-line);
  border-radius: 10px;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  background: #fff;
  font-size: 14px;
}
.woocommerce-account .woocommerce table.shop_table th,
.woocommerce-account .woocommerce table.woocommerce-orders-table th { padding: 13px 15px; border: 0; border-bottom: 1px solid var(--ssa-line); background: var(--ssa-canvas); color: var(--ssa-muted); font-size: 11px; font-weight: 800; letter-spacing: .055em; text-transform: uppercase; }
.woocommerce-account .woocommerce table.shop_table td,
.woocommerce-account .woocommerce table.woocommerce-orders-table td { padding: 16px 15px; border: 0; border-bottom: 1px solid var(--ssa-line); color: var(--ssa-ink); vertical-align: middle; }
.woocommerce-account .woocommerce table.shop_table tbody tr:last-child td { border-bottom: 0; }
.woocommerce-account .woocommerce table.shop_table tbody tr:hover { background: #fbfdff; }
.woocommerce-account .woocommerce .woocommerce-orders-table__cell-order-status { color: #21734d; font-weight: 700; }
.woocommerce-account .woocommerce .woocommerce-orders-table .button { min-height: 34px; margin: 2px 3px 2px 0; padding: 7px 10px; font-size: 12px; }
.woocommerce-account .woocommerce .woocommerce-Address {
  margin-top: 20px;
  padding: 23px;
  border: 1px solid var(--ssa-line);
  border-radius: 10px;
  background: var(--ssa-canvas);
}
.woocommerce-account .woocommerce .woocommerce-Address-title { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.woocommerce-account .woocommerce .woocommerce-Address-title h2 { margin: 0; }
.woocommerce-account .woocommerce .woocommerce-Address-title .edit { font-size: 13px; }
.woocommerce-account .woocommerce address { color: var(--ssa-muted); font-style: normal; line-height: 1.75; }

@media (max-width: 768px) {
  .woocommerce-account .woocommerce-MyAccount-navigation { float: none; width: 100%; margin: 0 0 18px; padding: 7px; overflow-x: auto; }
  .woocommerce-account .woocommerce-MyAccount-navigation ul { display: flex; min-width: max-content; gap: 3px; }
  .woocommerce-account .woocommerce-MyAccount-navigation li { margin: 0; }
  .woocommerce-account .woocommerce-MyAccount-navigation a { padding: 9px 11px; white-space: nowrap; }
  .woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout { margin: 0 !important; padding: 0 !important; border: 0; }
  .woocommerce-account .woocommerce-MyAccount-content { padding: 22px 18px; overflow: visible; }
  .woocommerce-account .woocommerce table.shop_table_responsive thead { display: none; }
  .woocommerce-account .woocommerce table.shop_table_responsive tr { display: block; margin: 0; padding: 12px 0; border-bottom: 1px solid var(--ssa-line); }
  .woocommerce-account .woocommerce table.shop_table_responsive tr:last-child { border: 0; }
  .woocommerce-account .woocommerce table.shop_table_responsive td,
  .woocommerce-account .woocommerce table.shop_table_responsive th { display: flex; justify-content: space-between; gap: 16px; padding: 7px 14px; border: 0; text-align: right; }
  .woocommerce-account .woocommerce table.shop_table_responsive td::before { color: var(--ssa-muted); font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
}