/* ================================================================
   ILZE Baltic — Customer account: Orders / Returns / Credit slips
   Cosmetic overlay only — no markup structure changes.
   Reuses the same palette as ilze-auth.css (blue / orange).
   ================================================================ */

:root {
  --ilze-acc-bl:  #2b5474;
  --ilze-acc-bl-light: #e8f0f7;
  --ilze-acc-or:  #f26f21;
  --ilze-acc-brd: #dde3ea;
  --ilze-acc-ibg: #f8fafc;
  --ilze-acc-r:   12px;
}

/* ── Overflow guard — page must never grow wider than the screen ── */
.page-history #content,
.page-order-detail #content,
.page-order-follow #content,
.page-order-slip #content,
.page-order-return #content {
  max-width: 100%;
  overflow-x: hidden;
}
.page-history #content *,
.page-order-detail #content *,
.page-order-follow #content *,
.page-order-slip #content *,
.page-order-return #content * {
  box-sizing: border-box;
  max-width: 100%;
}
.page-history table,
.page-order-detail table,
.page-order-follow table,
.page-order-slip table,
.page-order-return table {
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  white-space: nowrap;
}
.page-history .box,
.page-order-detail .box,
.page-order-detail .card,
.page-order-follow .box,
.page-order-slip .box,
.page-order-return .box,
.page-order-return .card {
  word-break: break-word;
  white-space: normal;
}

/* ── Card containers ── */
.page-history .box,
.page-order-detail .box,
.page-order-detail .card,
.page-order-follow .box,
.page-order-slip .box,
.page-order-return .box,
.page-order-return .card {
  background: #fff;
  border: 1px solid var(--ilze-acc-brd);
  border-radius: var(--ilze-acc-r);
  padding: 18px 20px;
  margin-bottom: 16px;
  box-shadow: 0 2px 10px rgba(43,84,116,.05);
}
.page-order-return .card-block { padding: 0; }
.page-order-return .card-title {
  color: var(--ilze-acc-bl); font-weight: 700; font-size: 1rem; margin-bottom: .5rem;
}

/* ── Headings inside cards ── */
.page-history h6,
.page-order-detail .box h3,
.page-order-detail #order-history h3,
.page-order-follow h6,
.page-order-slip h6,
.page-order-return h3 {
  font-size: .82rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: var(--ilze-acc-bl); margin: 0 0 12px;
}
.page-order-detail .order-message-form header h3 { margin-bottom: 4px; }
.page-order-detail .order-message-form header p { color: #6b7c8d; font-size: .85rem; margin: 0 0 16px; }

/* ── Order-info box: reference + reorder ── */
#order-infos .box:first-child strong {
  color: var(--ilze-acc-bl); font-size: .95rem;
}
#order-infos .button-primary,
.page-order-detail .button-primary {
  color: var(--ilze-acc-or) !important;
  font-weight: 700; font-size: .85rem; text-decoration: none;
}
#order-infos .button-primary:hover { text-decoration: underline; }
#order-infos ul { list-style: none; margin: 0; padding: 0; }
#order-infos ul li { font-size: .88rem; color: #444; padding: 4px 0; }
#order-infos ul li strong { color: var(--ilze-acc-bl); margin-right: 4px; }
#order-infos ul li a { color: var(--ilze-acc-or); text-decoration: none; }
#order-infos ul li a:hover { text-decoration: underline; }

/* ── Status pills (inline background-color from PS state, only shape/type styled) ── */
.label.label-pill {
  display: inline-block; padding: 5px 14px !important; border-radius: 999px !important;
  font-size: .78rem !important; font-weight: 700 !important; color: #fff !important;
  letter-spacing: .02em;
}

/* ── History table / mobile lines ── */
#order-history table th { color: var(--ilze-acc-bl); font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }
#order-history table td { font-size: .88rem; }
.history-lines .history-line,
.shipping-lines .shipping-line,
.order-returns .order-return,
.credit-slips .credit-slip {
  border: 1px solid var(--ilze-acc-brd); border-radius: 10px;
  padding: 12px 14px; margin-bottom: 10px; background: var(--ilze-acc-ibg);
}
.history-lines .history-line { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.history-lines .history-line .date { font-size: .82rem; color: #6b7c8d; }
.shipping-lines .shipping-line ul,
.order-returns .order-return ul,
.credit-slips .credit-slip ul {
  list-style: none; margin: 0; padding: 0;
}
.shipping-lines .shipping-line li,
.order-returns .order-return li,
.credit-slips .credit-slip li {
  font-size: .85rem; color: #444; padding: 3px 0;
}
.shipping-lines .shipping-line li strong,
.order-returns .order-return li strong,
.credit-slips .credit-slip li strong {
  color: var(--ilze-acc-bl); margin-right: 4px;
}
.order-returns .order-return li a,
.credit-slips .credit-slip li a {
  color: var(--ilze-acc-or); text-decoration: none; font-weight: 600;
}

/* ── Addresses (delivery / invoice) ── */
.addresses article.box h4 {
  font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em;
  color: var(--ilze-acc-bl); margin: 0 0 8px;
}
.addresses article.box address {
  font-style: normal; font-size: .85rem; line-height: 1.6; color: #555; margin: 0;
}

/* ── Order product tables (desktop) ── */
#order-products th {
  color: var(--ilze-acc-bl); font-size: .76rem; text-transform: uppercase; letter-spacing: .04em;
  background: var(--ilze-acc-ibg) !important;
}
#order-products td { font-size: .85rem; vertical-align: middle; }
#order-products tfoot td { font-weight: 700; color: var(--ilze-acc-bl); }
#order-products tfoot .line-total td { font-size: .95rem; color: var(--ilze-acc-or); }

/* ── Mobile order items / totals ── */
.order-items .order-item {
  border: 1px solid var(--ilze-acc-brd); border-radius: 10px;
  padding: 12px 14px; margin-bottom: 10px; background: #fff;
}
.order-items .order-item .name { font-weight: 700; font-size: .88rem; color: #1a2530; }
.order-items .order-item .ref { font-size: .78rem; color: #929aaa; margin-top: 2px; }
.order-totals { background: var(--ilze-acc-ibg); border-radius: 10px; padding: 10px 14px; }
.order-totals .order-total { padding: 4px 0; font-size: .88rem; }
.order-totals .order-total:last-child { border-top: 1px solid var(--ilze-acc-brd); margin-top: 6px; padding-top: 10px; font-size: .95rem; }
.order-totals .order-total:last-child strong { color: var(--ilze-acc-or); }

/* ── Messages ── */
.messages .message {
  border-bottom: 1px solid var(--ilze-acc-brd); padding: 12px 0; font-size: .85rem;
}
.messages .message:last-child { border-bottom: none; }

/* ── Message / return form fields (reuse auth-page input look) ── */
.order-message-form .form-control,
.page-order-return .form-control,
.page-order-detail .form-control {
  width: 100%; border: 1.5px solid var(--ilze-acc-brd); border-radius: 8px;
  padding: .55rem .8rem; font-size: .9rem; background: var(--ilze-acc-ibg);
  transition: border-color .2s, background .2s;
}
.order-message-form .form-control:focus,
.page-order-return .form-control:focus,
.page-order-detail .form-control:focus {
  border-color: var(--ilze-acc-bl); background: #fff; outline: none; box-shadow: 0 0 0 3px rgba(43,84,116,.12);
}
.order-message-form .form-group.row,
.page-order-return .form-group { margin-bottom: 14px; }
.order-message-form .form-control-label { font-size: .78rem; font-weight: 700; color: var(--ilze-acc-bl); text-transform: uppercase; letter-spacing: .04em; }

/* ── Submit buttons ── */
.order-message-form .form-control-submit,
.page-order-return .form-control-submit {
  background: var(--ilze-acc-or) !important; border: none !important; border-radius: 8px !important;
  color: #fff !important; font-weight: 700 !important; padding: 11px 26px !important;
  text-transform: uppercase; letter-spacing: .04em; font-size: .85rem !important;
  box-shadow: 0 3px 12px rgba(242,111,33,.30);
}
.order-message-form .form-control-submit:hover,
.page-order-return .form-control-submit:hover { background: #d95e18 !important; }

/* ── Return table checkbox column tidy ── */
#order-products.return .head-checkbox { width: 34px; }

@media (max-width: 767px) {
  .page-history .box,
  .page-order-detail .box,
  .page-order-detail .card,
  .page-order-follow .box,
  .page-order-slip .box,
  .page-order-return .box,
  .page-order-return .card {
    padding: 16px; border-radius: 10px;
  }
}

/* ================================================================
   history.tpl — order list
   ================================================================ */

/* ── Desktop table ── */
.page-history table th { color: var(--ilze-acc-bl); font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; }
.page-history table td, .page-history table th[scope="row"] { font-size: .85rem; }
.page-history .order-actions a {
  color: var(--ilze-acc-or); text-decoration: none; font-weight: 600; font-size: .82rem; margin-right: 10px;
}
.page-history .order-actions a:last-child { margin-right: 0; }
.page-history .order-actions a:hover { text-decoration: underline; }

/* ── Mobile order cards ── */
.orders .order {
  background: #fff;
  border: 1px solid var(--ilze-acc-brd);
  border-radius: var(--ilze-acc-r);
  padding: 16px 16px 14px;
  margin-bottom: 12px;
  box-shadow: 0 2px 10px rgba(43,84,116,.05);
}
.orders .order h3 {
  margin: 0 0 4px; font-size: .95rem; font-weight: 700; color: var(--ilze-acc-bl);
}
.orders .order a h3 { color: var(--ilze-acc-bl); }
.orders .order .date { font-size: .78rem; color: #929aaa; margin-bottom: 6px; }
.orders .order .total { font-size: .95rem; font-weight: 700; color: #1a2530; margin-bottom: 8px; }
.orders .order .status .label-pill { display: inline-block; }
.orders .order .col-xs-2 { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.orders .order .col-xs-2 a {
  width: 34px; height: 34px; border-radius: 9px;
  background: var(--ilze-acc-ibg); color: var(--ilze-acc-bl);
  display: flex; align-items: center; justify-content: center;
  transition: background .15s, color .15s;
}
.orders .order .col-xs-2 a:hover { background: var(--ilze-acc-or); color: #fff; }
.orders .order .col-xs-2 .material-icons { font-size: 18px; }