/* PrintKit Accounts: the account area. Follows the theme's colours and type. */
.pk-dashboard section { margin: 1.75rem 0; }
.pk-dashboard h2 { font-size: 1.2em; margin: 0 0 0.5rem; }
.pk-dashboard__awaiting { padding: 1rem; border: 2px solid #b32d2e; border-radius: 6px; }
.pk-dashboard__awaiting ul { list-style: none; margin: 0; padding: 0; }
.pk-dashboard__awaiting li { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; align-items: center; justify-content: space-between; padding: 0.6rem 0; border-top: 1px solid color-mix(in srgb, currentColor 12%, transparent); }
.pk-dashboard__order { display: grid; gap: 0.1rem; }
.pk-dashboard__meta { font-size: 0.9em; }
.pk-dashboard .pk-dashboard__artwork { background: #b32d2e; border-color: #b32d2e; color: #fff; }
.pk-dashboard__details ul { margin: 0 0 0 1.25rem; }
/* Registering: the field only bots fill in, kept off the screen */
.pk-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.pk-confirm .button { margin-top: 0.25rem; }
/* My Account > Addresses: the delivery address book */
.pk-addresses__delivery { margin-top: 2rem; }
.pk-address-hint { display: block; margin-top: 0.35rem; font-size: 0.875rem; opacity: 0.75; }
.pk-addresses__list { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: 0.75rem; }
.pk-address { display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem; justify-content: space-between; padding: 1rem; border: 1px solid color-mix(in srgb, currentColor 20%, transparent); border-radius: 6px; }
.pk-address--default { border-width: 2px; border-color: currentColor; }
.pk-address address { margin: 0.25rem 0 0; font-style: normal; }
.pk-address__label { display: block; }
.pk-address__default { display: inline-block; font-size: 0.8em; font-weight: 600; padding: 0.1rem 0.5rem; border: 1px solid currentColor; border-radius: 999px; }
.pk-address__actions { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: flex-start; }
.pk-address__actions form { margin: 0; }
.pk-address-form .woocommerce-address-fields__field-wrapper { margin-bottom: 1rem; }
.pk-address-form p a { margin-left: 1rem; }
/* Order again: the confirmation on the order page */
.pk-order-again { margin: 0 0 2rem; padding: 1rem; border: 2px solid currentColor; border-radius: 6px; }
.pk-order-again h2 { margin-top: 0; }
.pk-order-again__lines { list-style: none; margin: 0 0 1rem; padding: 0; }
.pk-order-again__lines li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.25rem 1rem; padding: 0.5rem 0; border-top: 1px solid color-mix(in srgb, currentColor 12%, transparent); }
.pk-order-again__off { opacity: 0.6; }
.pk-order-again form a { margin-left: 1rem; }
/* WooCommerce's order details table: in Firefox on a phone, a long word in an item's details made the table wider
   than the screen (found by the Firefox test run); words may break rather than push it out */
.woocommerce-table--order-details { width: 100%; }
.woocommerce-table--order-details th, .woocommerce-table--order-details td { overflow-wrap: anywhere; }
/* My Account > Invoices (stage 7, section 11): numbers and dates never break; each PDF on its own line; a refund
   under the total instead of WooCommerce's crossed-out total */
.pk-invoices__number, .pk-invoices__date, .pk-invoices__order, .pk-invoices__total { white-space: nowrap; }
.pk-invoices__pdf { display: block; white-space: nowrap; line-height: 1.6; }
.pk-invoices__refunded { display: block; font-size: 0.85em; opacity: 0.8; }
@media (max-width: 768px) {
  .pk-invoices__number, .pk-invoices__date, .pk-invoices__order, .pk-invoices__total { white-space: normal; }
  .pk-invoices td.pk-invoices__files { text-align: right; }
}
.pk-invoice-links { display: flex; flex-wrap: wrap; gap: 0.5rem; }
/* Waiting for your artwork: on wider screens the button stays on the right of every row and a long product name wraps
   beside it (Carl's try-out); on phones the button sits under each order, as before */
@media (min-width: 600px) {
  .pk-dashboard__awaiting li { flex-wrap: nowrap; }
  .pk-dashboard__awaiting .pk-dashboard__order { flex: 1 1 auto; min-width: 0; }
  .pk-dashboard__awaiting .pk-dashboard__artwork { flex: 0 0 auto; white-space: nowrap; }
}
/* As WooCommerce's own action buttons (bold) */
.pk-invoice-links .button, .pk-confirm__resend { font-weight: 600; }

/* Buttons in order tables (the dashboard's latest orders, My Account > Orders): a little smaller than the theme's
   standard button, with room above and below, so a column of them doesn't run together (Carl, 21 October) */
.woocommerce table.shop_table.woocommerce-orders-table td, .woocommerce-account table.woocommerce-orders-table td { padding-top: 0.6rem; padding-bottom: 0.6rem; vertical-align: middle; }
.woocommerce-orders-table .button { display: inline-block; padding: 0.45rem 1.1rem; line-height: 1.3; }
/* On a phone the table becomes label: value rows; the View button's cell needs no label (it showed a lone ":") */
.woocommerce table.shop_table_responsive.pk-dashboard__table tr td.pk-dashboard__actions::before { content: none; }
/* WooCommerce hides a responsive table's row headings on a phone; the dashboard's has the order number, so it shows */
@media (max-width: 768px) {
	.woocommerce table.shop_table_responsive.pk-dashboard__table tbody th { display: block; text-align: right; }
	.woocommerce table.shop_table_responsive.pk-dashboard__table tbody th::before { content: attr(data-title) ": "; font-weight: 700; float: left; }
}
/* The order page's Actions row (WooCommerce 11: Order again, Pay, Cancel, Awaiting artwork): the same smaller buttons
   as the orders table, on one line each, with room between them. On a phone the heading sits above the buttons and
   each button is the full width, one under the other (Carl, 22 October) */
.woocommerce-table--order-details tfoot th.order-actions--heading + td .order-actions-button { display: inline-block; padding: 0.45rem 1.1rem; line-height: 1.3; white-space: nowrap; margin: 0.25rem 0.5rem 0.25rem 0; text-align: center; }
@media (max-width: 768px) {
	.woocommerce-table--order-details tfoot th.order-actions--heading, .woocommerce-table--order-details tfoot th.order-actions--heading + td { display: block; width: auto; text-align: left; }
	.woocommerce-table--order-details tfoot th.order-actions--heading { border-bottom: 0; padding-bottom: 0.25rem; }
	.woocommerce-table--order-details tfoot th.order-actions--heading + td { display: flex; flex-direction: column; gap: 0.5rem; }
	.woocommerce-table--order-details tfoot th.order-actions--heading + td .order-actions-button { display: block; width: 100%; box-sizing: border-box; margin: 0; }
}