/* =====================================================
   MITT KONTO – Uppsala Vitvaror
   ===================================================== */

.uv-account-page {
    padding: var(--uv-spacing-xl) 0 var(--uv-spacing-3xl);
}

.woocommerce-MyAccount-navigation {
    background: var(--uv-color-light-background);
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-lg);
    padding: var(--uv-spacing-sm) 0;
    margin-bottom: var(--uv-spacing-xl);
}

.woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.woocommerce-MyAccount-navigation li a {
    display: flex;
    align-items: center;
    gap: var(--uv-spacing-sm);
    padding: 0.75rem var(--uv-spacing-lg);
    font-size: var(--uv-font-size-sm);
    font-weight: 600;
    color: var(--uv-color-text);
    text-decoration: none;
    transition: background-color var(--uv-transition-fast), color var(--uv-transition-fast);
    min-height: 44px;
}

.woocommerce-MyAccount-navigation li a:hover,
.woocommerce-MyAccount-navigation li.is-active a {
    background-color: rgba(230, 102, 12, 0.08);
    color: var(--uv-color-primary);
}

.woocommerce-MyAccount-navigation li.is-active a {
    border-left: 3px solid var(--uv-color-primary);
}

.woocommerce-MyAccount-content {
    background: var(--uv-color-white);
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-lg);
    padding: var(--uv-spacing-xl);
}

@media (min-width: 769px) {
    .woocommerce-account .woocommerce {
        display: grid;
        grid-template-columns: 220px 1fr;
        gap: var(--uv-spacing-xl);
        align-items: start;
    }
    .woocommerce-MyAccount-navigation { margin-bottom: 0; }
}

/* =====================================================
   v1.6.2 (punkt 5): utloggat läge – centrerad panel med
   flikar för Logga in / Registrera
   ===================================================== */
.uv-auth-panel {
    max-width: 480px;
    margin: 0 auto;
    background: var(--uv-color-white);
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-lg);
    padding: var(--uv-spacing-xl);
}

/* Utloggat läge: ingen tvåkolumnslayout (grid gäller inloggat konto) */
@media (min-width: 769px) {
    .woocommerce-account:not(.logged-in) .woocommerce {
        display: block;
    }
}

.uv-auth-panel__tabs {
    display: flex;
    gap: 0;
    margin-bottom: var(--uv-spacing-xl);
    border-bottom: 2px solid var(--uv-color-border);
}

.uv-auth-panel__tab {
    flex: 1;
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    padding: 0.875rem 1rem;
    font-family: var(--uv-font-family);
    font-size: var(--uv-font-size-base);
    font-weight: 600;
    color: var(--uv-color-muted);
    cursor: pointer;
    transition: color var(--uv-transition-fast), border-color var(--uv-transition-fast);
    min-height: 44px;
}

.uv-auth-panel__tab:hover {
    color: var(--uv-color-text);
}

.uv-auth-panel__tab.is-active {
    color: var(--uv-color-primary);
    border-bottom-color: var(--uv-color-primary);
}

.uv-auth-panel__heading {
    font-size: var(--uv-font-size-xl);
    margin: 0 0 var(--uv-spacing-lg);
}

.uv-auth-panel__actions {
    display: flex;
    flex-direction: column;
    gap: var(--uv-spacing-md);
    margin-top: var(--uv-spacing-lg);
}

.uv-auth-panel__remember {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--uv-font-size-sm);
    cursor: pointer;
}

.uv-auth-panel__remember input {
    width: 18px;
    height: 18px;
    accent-color: var(--uv-color-primary);
}

.uv-auth-panel .woocommerce-button,
.uv-auth-panel button[type="submit"] {
    width: 100%;
}

.uv-auth-panel__lost {
    margin-top: var(--uv-spacing-md);
    font-size: var(--uv-font-size-sm);
    text-align: center;
}

.uv-auth-panel__lost a {
    color: var(--uv-color-primary);
    text-decoration: underline;
}

/* =====================================================
   v1.6.3 (punkt 1): villkorsgodkännande i registreringsformuläret
   ===================================================== */
.uv-auth-panel__terms {
    /* v1.6.4 (punkt 1.2): mer luft mellan samtyckesrutan och
       Registrera-knappen. */
    margin: var(--uv-spacing-md) 0 var(--uv-spacing-lg);
}

.uv-auth-panel__terms-label {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    font-size: var(--uv-font-size-sm);
    line-height: 1.5;
    cursor: pointer;
}

.uv-auth-panel__terms-label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    flex-shrink: 0;
    accent-color: var(--uv-color-primary);
}

.uv-auth-panel__terms-label a {
    color: var(--uv-color-primary);
    text-decoration: underline;
}

/* =====================================================
   v1.6.3 (punkt 2): "Glömt lösenord"-sidorna i temats stil –
   samma centrerade panel som inloggnings-/registreringsvyn.
   Gäller både steget "ange e-post" (lost_reset_password) och
   steget "välj nytt lösenord" (woocommerce-ResetPassword).
   ===================================================== */
body.woocommerce-account .woocommerce-lost-password .woocommerce,
form.woocommerce-ResetPassword,
form.lost_reset_password {
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
}

form.woocommerce-ResetPassword,
form.lost_reset_password {
    background: var(--uv-color-white);
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-lg);
    padding: var(--uv-spacing-xl);
}

form.woocommerce-ResetPassword > p:first-of-type,
form.lost_reset_password > p:first-of-type {
    font-size: var(--uv-font-size-sm);
    color: var(--uv-color-muted);
    line-height: 1.6;
    margin: 0 0 var(--uv-spacing-lg);
}

form.woocommerce-ResetPassword .form-row,
form.lost_reset_password .form-row {
    margin: 0 0 var(--uv-spacing-md);
    padding: 0;
}

form.woocommerce-ResetPassword label,
form.lost_reset_password label {
    display: block;
    font-size: var(--uv-font-size-sm);
    font-weight: 600;
    color: var(--uv-color-text);
    margin-bottom: var(--uv-spacing-xs);
}

form.woocommerce-ResetPassword input[type="text"],
form.woocommerce-ResetPassword input[type="email"],
form.woocommerce-ResetPassword input[type="password"],
form.lost_reset_password input[type="text"],
form.lost_reset_password input[type="email"],
form.lost_reset_password input[type="password"] {
    width: 100%;
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-md);
    padding: 0.75rem 1rem;
    font-size: var(--uv-font-size-base);
    font-family: var(--uv-font-family);
    color: var(--uv-color-text);
    background: var(--uv-color-white);
    min-height: 44px;
    transition: border-color var(--uv-transition-fast), box-shadow var(--uv-transition-fast);
}

form.woocommerce-ResetPassword input:focus,
form.lost_reset_password input:focus {
    outline: none;
    border-color: var(--uv-color-primary);
    box-shadow: 0 0 0 3px rgba(230, 102, 12, 0.15);
}

form.woocommerce-ResetPassword .password-input,
form.lost_reset_password .password-input {
    position: relative;
    display: block;
    width: 100%;
}

form.woocommerce-ResetPassword .show-password-input,
form.lost_reset_password .show-password-input {
    position: absolute;
    top: 50%;
    right: 0.875rem;
    transform: translateY(-50%);
    cursor: pointer;
    color: var(--uv-color-muted);
}

form.woocommerce-ResetPassword button[type="submit"],
form.lost_reset_password button[type="submit"] {
    width: 100%;
    margin-top: var(--uv-spacing-sm);
}

/* v1.6.3 (punkt 2): ≥16px i formulärfält på mobil hindrar att iOS zoomar
   in vid fokus – gäller alla kontosidor inklusive glömt lösenord. */
@media (max-width: 768px) {
    body.woocommerce-account input[type="text"],
    body.woocommerce-account input[type="email"],
    body.woocommerce-account input[type="password"],
    body.woocommerce-account input[type="tel"],
    body.woocommerce-account select,
    body.woocommerce-account textarea {
        font-size: 16px;
    }
}

/* =====================================================
   v1.6.2 (punkt 8): luft mellan sidrubriken "Mitt konto"
   och kontonavigeringen/innehållet på alla kontosidor
   ===================================================== */
body.woocommerce-account .uv-page-article__header {
    margin-bottom: var(--uv-spacing-xl);
}

/* Formulär */
.woocommerce .woocommerce-form input[type="text"],
.woocommerce .woocommerce-form input[type="email"],
.woocommerce .woocommerce-form input[type="password"] {
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-md);
    padding: 0.75rem 1rem;
    font-size: var(--uv-font-size-base);
    font-family: var(--uv-font-family);
    width: 100%;
    transition: border-color var(--uv-transition-fast);
    min-height: 44px;
}

.woocommerce .woocommerce-form input:focus {
    outline: none;
    border-color: var(--uv-color-primary);
    box-shadow: 0 0 0 3px rgba(230, 102, 12, 0.15);
}

.woocommerce .button,
.woocommerce button.button {
    background-color: var(--uv-color-primary) !important;
    color: var(--uv-color-white) !important;
    border: 2px solid var(--uv-color-primary) !important;
    border-radius: var(--uv-radius-md) !important;
    font-size: var(--uv-font-size-sm) !important;
    font-weight: 700 !important;
    font-family: var(--uv-font-family) !important;
    padding: 0.75rem 1.5rem !important;
    min-height: 44px !important;
    cursor: pointer !important;
    transition: background-color var(--uv-transition-fast) !important;
}

.woocommerce .button:hover {
    background-color: var(--uv-color-primary-dark) !important;
    border-color: var(--uv-color-primary-dark) !important;
}

/* Orderhistorik */
.woocommerce-orders-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--uv-font-size-sm);
}

.woocommerce-orders-table th {
    text-align: left;
    padding: 0.75rem 1rem;
    background: var(--uv-color-light-background);
    font-weight: 700;
    color: var(--uv-color-muted);
    border-bottom: 2px solid var(--uv-color-border);
    font-size: var(--uv-font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.woocommerce-orders-table td {
    padding: 0.875rem 1rem;
    border-bottom: 1px solid var(--uv-color-border);
    vertical-align: middle;
}

.woocommerce-orders-table .woocommerce-button {
    font-size: var(--uv-font-size-xs) !important;
    padding: 0.375rem 0.75rem !important;
    min-height: 32px !important;
}

/* E-postverifieringsmeddelande */
.uv-verification-notice {
    background: rgba(230, 102, 12, 0.08);
    border: 1.5px solid rgba(230, 102, 12, 0.2);
    border-radius: var(--uv-radius-md);
    padding: var(--uv-spacing-md) var(--uv-spacing-lg);
    margin-bottom: var(--uv-spacing-lg);
}

.uv-verification-notice__title {
    font-weight: 700;
    color: var(--uv-color-primary-dark);
    margin-bottom: var(--uv-spacing-xs);
}

.uv-verification-notice__text {
    font-size: var(--uv-font-size-sm);
    color: var(--uv-color-text);
    margin-bottom: var(--uv-spacing-md);
}

.uv-resend-verification-btn {
    font-size: var(--uv-font-size-sm);
    font-weight: 600;
    color: var(--uv-color-primary);
    background: none;
    border: none;
    cursor: pointer;
    font-family: var(--uv-font-family);
    text-decoration: underline;
    padding: 0;
}

/* =====================================================
   v1.6.1 (punkt 11): kompensera för fast/sticky header på
   ALLA kontosidor och ALLA skärmstorlekar (desktop, surfplatta,
   mobil) – v1.6.0 gällde bara mobil. Ingen överdriven lucka:
   endast headerhöjd + litet andrum.
   ===================================================== */
body.woocommerce-account .uv-page-content,
body.woocommerce-account #uv-main-content,
body.woocommerce-account .uv-account-page {
    padding-top: calc(var(--uv-header-height, 70px) + var(--uv-spacing-sm));
}

/* =====================================================
   v1.6.0 – Kontouppgifter: formulär i temats stil
   ===================================================== */
.woocommerce-EditAccountForm .form-row,
.woocommerce-MyAccount-content .form-row {
    margin: 0 0 var(--uv-spacing-md);
    padding: 0;
}

.woocommerce-EditAccountForm label,
.woocommerce-MyAccount-content .form-row label {
    display: block;
    font-size: var(--uv-font-size-sm);
    font-weight: 600;
    color: var(--uv-color-text);
    margin-bottom: var(--uv-spacing-xs);
}

.woocommerce-EditAccountForm .required {
    color: var(--uv-color-primary);
    text-decoration: none;
}

.woocommerce-MyAccount-content input[type="text"],
.woocommerce-MyAccount-content input[type="email"],
.woocommerce-MyAccount-content input[type="password"],
.woocommerce-MyAccount-content input[type="tel"],
.woocommerce-MyAccount-content select,
.woocommerce-MyAccount-content .woocommerce-Input {
    width: 100%;
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-md);
    padding: 0.75rem 1rem;
    font-size: var(--uv-font-size-base);
    font-family: var(--uv-font-family);
    color: var(--uv-color-text);
    background: var(--uv-color-white);
    min-height: 44px;
    transition: border-color var(--uv-transition-fast), box-shadow var(--uv-transition-fast);
}

.woocommerce-MyAccount-content input:focus,
.woocommerce-MyAccount-content select:focus {
    outline: none;
    border-color: var(--uv-color-primary);
    box-shadow: 0 0 0 3px rgba(230, 102, 12, 0.15);
}

.woocommerce-MyAccount-content input:disabled,
.woocommerce-MyAccount-content input[readonly] {
    background: var(--uv-color-light-background);
    color: var(--uv-color-muted);
    cursor: not-allowed;
}

.woocommerce-MyAccount-content .woocommerce-invalid input,
.woocommerce-MyAccount-content input[aria-invalid="true"] {
    border-color: #d63638;
}

/* Hjälptext under fält (t.ex. "Lämna tomt för att inte ändra") */
.woocommerce-EditAccountForm em,
.woocommerce-EditAccountForm span em {
    display: block;
    font-size: var(--uv-font-size-xs);
    color: var(--uv-color-muted);
    font-style: normal;
    margin-top: var(--uv-spacing-xs);
}

/* Lösenordsfält med visa/dölj-knapp */
.woocommerce-MyAccount-content .password-input {
    position: relative;
    display: block;
    width: 100%;
}

.woocommerce-MyAccount-content .password-input input {
    padding-right: 2.75rem;
}

.woocommerce-MyAccount-content .show-password-input {
    position: absolute;
    top: 50%;
    right: 0.875rem;
    transform: translateY(-50%);
    cursor: pointer;
    color: var(--uv-color-muted);
}

.woocommerce-MyAccount-content .show-password-input::after {
    color: var(--uv-color-muted);
}

/* Fieldset för lösenordsbyte */
.woocommerce-EditAccountForm fieldset {
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-md);
    padding: var(--uv-spacing-lg);
    margin: var(--uv-spacing-lg) 0;
}

.woocommerce-EditAccountForm fieldset legend {
    font-weight: 700;
    font-size: var(--uv-font-size-base);
    padding: 0 var(--uv-spacing-xs);
}

/* Full bredd på mobil, halv bredd sida vid sida på desktop */
@media (min-width: 769px) {
    .woocommerce-EditAccountForm .form-row-first,
    .woocommerce-EditAccountForm .form-row-last {
        width: calc(50% - var(--uv-spacing-sm));
        display: inline-block;
        vertical-align: top;
    }
    .woocommerce-EditAccountForm .form-row-first { margin-right: var(--uv-spacing-md); }
}

@media (max-width: 768px) {
    .woocommerce-EditAccountForm .form-row-first,
    .woocommerce-EditAccountForm .form-row-last {
        width: 100%;
    }
}

/* =====================================================
   v1.6.4 (punkt 1.3 + 1.5): WooCommerce-meddelanden på kontosidan
   i temats stil – nära formulärpanelen (samma bredd, centrerade).
   Gäller bekräftelsen efter registrering (grön), felmeddelanden som
   "verifiera din e-post innan du loggar in" (röd) samt info-notiser.
   ===================================================== */
body.woocommerce-account .woocommerce-message,
body.woocommerce-account .woocommerce-error,
body.woocommerce-account .woocommerce-info {
    max-width: 480px;
    margin: 0 auto var(--uv-spacing-lg);
    padding: var(--uv-spacing-md) var(--uv-spacing-lg);
    border-radius: var(--uv-radius-md);
    font-size: var(--uv-font-size-sm);
    font-weight: 500;
    line-height: 1.6;
    list-style: none;
    background-image: none;
}

body.woocommerce-account .woocommerce-message::before,
body.woocommerce-account .woocommerce-error::before,
body.woocommerce-account .woocommerce-info::before,
body.woocommerce-account .woocommerce-error li::before {
    display: none; /* dölj WooCommerce standardikoner */
}

body.woocommerce-account .woocommerce-error li {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Grönt bekräftelsemeddelande – t.ex. efter lyckad registrering
   ("kontrollera din e-post och verifiera kontot"). */
body.woocommerce-account .woocommerce-message {
    background-color: rgba(40, 122, 67, 0.1);
    border: 1px solid rgba(40, 122, 67, 0.25);
    color: var(--uv-color-success);
}

/* Rött felmeddelande – t.ex. inloggningsförsök före verifiering. */
body.woocommerce-account .woocommerce-error {
    background-color: rgba(180, 35, 24, 0.1);
    border: 1px solid rgba(180, 35, 24, 0.25);
    color: var(--uv-color-error);
}

body.woocommerce-account .woocommerce-info {
    background-color: rgba(230, 102, 12, 0.08);
    border: 1px solid rgba(230, 102, 12, 0.25);
    color: var(--uv-color-dark);
}

/* v1.8.8: kömeddelanden ligger före konto-navigationen och ska därför
   spänna över hela kontogridden. Åtgärdsknappen får egen flexyta i stället
   för WooCommerces float, så text och knapp aldrig kan överlappa. */
body.woocommerce-account .woocommerce > .woocommerce-notices-wrapper {
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
}

/* v1.8.12: bekräftelser och valideringsfel efter adress-, konto- och
   lösenordsändringar använder hela den tillgängliga kontobredden.
   Färg, typografi och vänsterställd presentation behålls. */
body.woocommerce-account .woocommerce-notices-wrapper .woocommerce-message,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message,
body.woocommerce-account .woocommerce-notices-wrapper .woocommerce-error,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error {
    width: 100%;
    max-width: 100%;
    margin-right: 0;
    margin-left: 0;
    box-sizing: border-box;
    text-align: left;
}

/* WooCommerce skriver sparbekräftelser före konto-navigationen i DOM:en.
   På desktop placeras därför just vanliga bekräftelser i innehållskolumnen,
   med navigationen kvar till vänster och själva kontopanelen direkt under.
   Kö-/åtgärdsmeddelanden med knapp behåller v1.8.8-layouten över båda kolumner. */
@media (min-width: 769px) {
    body.logged-in.woocommerce-account
    .woocommerce:has(> .woocommerce-notices-wrapper > :is(.woocommerce-message, .woocommerce-error)):not(:has(> .woocommerce-notices-wrapper > .woocommerce-message > .button))
    > .woocommerce-notices-wrapper {
        grid-column: 2;
        grid-row: 1;
    }

    body.logged-in.woocommerce-account
    .woocommerce:has(> .woocommerce-notices-wrapper > :is(.woocommerce-message, .woocommerce-error)):not(:has(> .woocommerce-notices-wrapper > .woocommerce-message > .button))
    > .woocommerce-MyAccount-navigation {
        grid-column: 1;
        grid-row: 1 / span 2;
    }

    body.logged-in.woocommerce-account
    .woocommerce:has(> .woocommerce-notices-wrapper > :is(.woocommerce-message, .woocommerce-error)):not(:has(> .woocommerce-notices-wrapper > .woocommerce-message > .button))
    > .woocommerce-MyAccount-content {
        grid-column: 2;
        grid-row: 2;
    }
}

body.woocommerce-account .woocommerce-notices-wrapper .woocommerce-message:has(> .button) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--uv-spacing-md);
    width: 100%;
    max-width: 100%;
    padding: var(--uv-spacing-lg);
    line-height: 1.6;
    overflow-wrap: anywhere;
}

body.woocommerce-account .woocommerce-notices-wrapper .woocommerce-message:has(> .button) > .button {
    order: 2;
    flex: 0 0 auto;
    float: none;
    margin: 0 0 0 auto;
    white-space: nowrap;
}

/* Länkar i meddelanden (t.ex. "Skicka verifieringsmailet igen"). */
body.woocommerce-account .woocommerce-message a,
body.woocommerce-account .woocommerce-error a,
body.woocommerce-account .woocommerce-info a {
    color: inherit;
    font-weight: 700;
    text-decoration: underline;
}

body.woocommerce-account .woocommerce-message a:hover,
body.woocommerce-account .woocommerce-error a:hover,
body.woocommerce-account .woocommerce-info a:hover {
    text-decoration: none;
}

/* =====================================================
   v1.6.7 (punkt 2): tom-lägen under Mitt konto – "Ingen beställning
   har gjorts ännu." (Beställningar) och "Inga nedladdningar
   tillgängliga ännu." (Nedladdningar). Endast dessa info-notiser
   (WooCommerce-mallarnas --info-varianter samt info-notiser med
   åtgärdsknapp) visas som ett kort i temats stil, i innehållsytans
   fulla bredd. Desktop: text till vänster, knapp till höger på samma
   rad. Mobil: staplat med knapp i full bredd. Knappen trycks aldrig
   ihop. Övriga konto-notiser (sparat, fel, validering) behåller sin
   tidigare stil.
   ===================================================== */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message.woocommerce-message--info,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Message.woocommerce-Message--info,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info:has(> .button) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--uv-spacing-md);
    max-width: 100%;
    margin: 0 0 var(--uv-spacing-lg);
    padding: var(--uv-spacing-lg);
    background-color: var(--uv-color-light-background);
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-lg);
    color: var(--uv-color-dark);
    font-size: var(--uv-font-size-base);
    font-weight: 500;
}

/* Knappen ("Bläddra bland produkter" / "Till butiken") i temats
   primärstil – behåller sin storlek och radbryts aldrig. */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message.woocommerce-message--info .button,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Message.woocommerce-Message--info .button,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info:has(> .button) .button {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    background: var(--uv-color-primary);
    color: var(--uv-color-white);
    border: 1.5px solid var(--uv-color-primary);
    border-radius: var(--uv-radius-md);
    padding: 0.625rem 1.25rem;
    min-height: var(--uv-control-height, 48px);
    font-family: var(--uv-font-family);
    font-size: var(--uv-font-size-sm);
    font-weight: 600;
    text-decoration: none;
    transition: background-color var(--uv-transition-fast), border-color var(--uv-transition-fast);
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message.woocommerce-message--info .button:hover,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Message.woocommerce-Message--info .button:hover,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info:has(> .button) .button:hover {
    background: var(--uv-color-dark);
    border-color: var(--uv-color-dark);
    color: var(--uv-color-white);
}

/* Mobil: staplat – text överst, knapp i full bredd under. */
@media (max-width: 600px) {
    body.woocommerce-account .woocommerce-notices-wrapper .woocommerce-message:has(> .button) {
        flex-direction: column;
        align-items: stretch;
        gap: var(--uv-spacing-md);
        padding: var(--uv-spacing-md);
    }

    body.woocommerce-account .woocommerce-notices-wrapper .woocommerce-message:has(> .button) > .button {
        width: 100%;
        margin: 0;
        text-align: center;
    }

    body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message.woocommerce-message--info,
    body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Message.woocommerce-Message--info,
    body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info:has(> .button) {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }

    body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message.woocommerce-message--info .button,
    body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Message.woocommerce-Message--info .button,
    body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info:has(> .button) .button {
        width: 100%;
    }
}

/* =====================================================
   v1.7.0 (punkt 1): Mitt konto – adresser och kontouppgifter
   ===================================================== */

/* 1.1 – tydligare vertikalt avstånd mellan Faktureringsadress och
   Leveransadress (sektionerna visas staplade). Måttfullt och lika på
   alla brytpunkter. */
.woocommerce-MyAccount-content .col2-set.addresses .u-column1,
.woocommerce-MyAccount-content .col2-set.addresses .col-1 {
    margin-bottom: var(--uv-spacing-xl, 2.5rem);
}

/* 1.2 – Land/region-rullgardinen (och alla andra select-fält) i samma
   formstil som övriga fält: egen chevron i stället för webbläsarens
   standardpil, temats kant, radie, höjd och padding. */
.woocommerce-MyAccount-content select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 2.5rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23697174' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.875rem center;
    background-size: 16px;
    cursor: pointer;
}

.woocommerce-MyAccount-content select:hover {
    border-color: var(--uv-color-muted);
}

.woocommerce-MyAccount-content .woocommerce-invalid select,
.woocommerce-MyAccount-content select[aria-invalid="true"] {
    border-color: #d63638;
}

/* Select2 (WooCommerce förbättrar landsfältet dynamiskt): samma
   utseende som temats övriga fält – höjd, kant, radie, fokus. */
.woocommerce-MyAccount-content .select2-container {
    width: 100% !important;
}

.woocommerce-MyAccount-content .select2-container .select2-selection--single {
    min-height: 44px;
    height: auto;
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-md);
    background: var(--uv-color-white);
    transition: border-color var(--uv-transition-fast), box-shadow var(--uv-transition-fast);
}

.woocommerce-MyAccount-content .select2-container .select2-selection--single:hover {
    border-color: var(--uv-color-muted);
}

.woocommerce-MyAccount-content .select2-container .select2-selection--single .select2-selection__rendered {
    line-height: 41px;
    padding-left: 1rem;
    padding-right: 2.25rem;
    color: var(--uv-color-text);
    font-family: var(--uv-font-family);
    font-size: var(--uv-font-size-base);
}

.woocommerce-MyAccount-content .select2-container .select2-selection--single .select2-selection__arrow {
    height: 41px;
    right: 0.5rem;
}

.woocommerce-MyAccount-content .select2-container--focus .select2-selection--single,
.woocommerce-MyAccount-content .select2-container--open .select2-selection--single {
    border-color: var(--uv-color-primary);
    box-shadow: 0 0 0 3px rgba(230, 102, 12, 0.15);
}

.woocommerce-MyAccount-content .woocommerce-invalid .select2-container .select2-selection--single {
    border-color: #d63638;
}

/* Själva rullgardinsmenyn läggs av Select2 direkt i body. */
body.woocommerce-account .select2-dropdown {
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-md);
    font-family: var(--uv-font-family);
    overflow: hidden;
}

body.woocommerce-account .select2-dropdown .select2-search__field {
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-sm);
    padding: 0.375rem 0.625rem;
    font-family: var(--uv-font-family);
}

body.woocommerce-account .select2-results__option--highlighted[aria-selected],
body.woocommerce-account .select2-results__option--highlighted[data-selected] {
    background: var(--uv-color-primary);
    color: var(--uv-color-white);
}

/* 1.2.3 – Kontouppgifter: Förnamn och Efternamn i full formulärbredd
   på desktop (under varandra), i linje med övriga fält. Regeln ligger
   efter 50 %-regeln ovan och vinner därför på ordning. */
@media (min-width: 769px) {
    .woocommerce-EditAccountForm .form-row-first,
    .woocommerce-EditAccountForm .form-row-last {
        width: 100%;
        display: block;
        float: none;
    }

    .woocommerce-EditAccountForm .form-row-first {
        margin-right: 0;
    }
}

/* =====================================================
   v1.7.6 (punkt 3.1) – Mitt konto > Beställningar > Visa
   beställning: putsad kvittolayout i temats stil. Allt
   innehåll vänsterställt, tydliga sektionskort med temats
   radie, jämna avstånd och en ordertabell som matchar den
   förbättrade tacksidan. Ingen orderdata tas bort.
   ===================================================== */

/* Inledningsraden "Beställning #1234 skapades ..." – WooCommerce
   <mark>-markeringar utan gul standardbakgrund. */
.woocommerce-MyAccount-content > p mark {
    background: transparent;
    color: var(--uv-color-primary);
    font-weight: 700;
    padding: 0;
}

/* Sektionskort: orderdetaljer och adresser. */
.woocommerce-MyAccount-content section.woocommerce-order-details,
.woocommerce-MyAccount-content section.woocommerce-customer-details {
    background: var(--uv-color-white);
    border: 1.5px solid var(--uv-color-border);
    border-radius: var(--uv-radius-lg);
    padding: var(--uv-spacing-lg);
    margin: 0 0 var(--uv-spacing-lg);
    text-align: left;
}

/* Sektionsrubriker. */
.woocommerce-MyAccount-content .woocommerce-order-details__title,
.woocommerce-MyAccount-content section.woocommerce-customer-details > h2,
.woocommerce-MyAccount-content .woocommerce-column__title,
.woocommerce-MyAccount-content .uvc-removal-order-info h2 {
    font-size: 1.15rem;
    margin: 0 0 var(--uv-spacing-sm);
    padding-bottom: 8px;
    border-bottom: 1px solid var(--uv-color-border);
    text-align: left;
}

/* Bortforsling-blocket (renderas efter ordertabellen i samma kort). */
.woocommerce-MyAccount-content .uvc-removal-order-info {
    margin-top: var(--uv-spacing-md);
    text-align: left;
}

/* Ordertabellen – samma uttryck som tacksidan. */
.woocommerce-MyAccount-content table.woocommerce-table--order-details {
    width: 100%;
    border-collapse: collapse;
    border: 0;
    margin: 0;
    font-size: var(--uv-font-size-base);
}

.woocommerce-MyAccount-content table.woocommerce-table--order-details th,
.woocommerce-MyAccount-content table.woocommerce-table--order-details td {
    border: 0;
    border-bottom: 1px solid var(--uv-color-border);
    padding: 10px 8px;
    text-align: left;
    vertical-align: top;
    overflow-wrap: anywhere;
    background: transparent;
}

.woocommerce-MyAccount-content table.woocommerce-table--order-details thead th {
    font-size: var(--uv-font-size-xs);
    font-weight: 700;
    color: var(--uv-color-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Belopp konsekvent högerställda. */
.woocommerce-MyAccount-content table.woocommerce-table--order-details thead th:last-child,
.woocommerce-MyAccount-content table.woocommerce-table--order-details td.woocommerce-table__product-total,
.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot td {
    text-align: right;
}

/* Summeringsrader: etiketter dämpade, sista raden (Totalt) betonad. */
.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot th {
    font-weight: 500;
    color: var(--uv-color-muted);
    white-space: nowrap;
}

.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot tr:last-child th,
.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot tr:last-child td {
    border-bottom: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--uv-color-dark);
}

/* v1.7.6 högerställde "Totalt:"; UTGICK i v1.7.8 (punkt 2.1): alla
   radetiketter ska börja på samma vänsterposition – se v1.7.8-sektionen
   längst ned. Radbrytningsregeln behålls. */
.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot tr:last-child th {
    white-space: normal;
}

.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot tr:last-child td .woocommerce-Price-amount {
    color: var(--uv-color-primary);
}

/* Radmeta (t.ex. Installation-gruppen) grupperad under sin produkt. */
.woocommerce-MyAccount-content .wc-item-meta {
    list-style: none;
    margin: 6px 0 0;
    padding: 0;
    font-size: var(--uv-font-size-sm);
    color: var(--uv-color-muted);
}

.woocommerce-MyAccount-content .wc-item-meta li {
    margin: 2px 0;
}

.woocommerce-MyAccount-content .wc-item-meta .wc-item-meta-label {
    display: inline;
    float: none;
    margin: 0 4px 0 0;
    color: var(--uv-color-text);
    font-weight: 600;
}

/* Adresser: sida vid sida på desktop, läsbara och vänsterställda. */
.woocommerce-MyAccount-content .woocommerce-columns--addresses {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--uv-spacing-lg);
}

.woocommerce-MyAccount-content .woocommerce-columns--addresses .woocommerce-column {
    width: 100%;
    float: none;
    min-width: 0;
}

.woocommerce-MyAccount-content section.woocommerce-customer-details address {
    border: 0;
    padding: 0;
    margin: 0;
    font-style: normal;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

.woocommerce-MyAccount-content .woocommerce-customer-details--phone,
.woocommerce-MyAccount-content .woocommerce-customer-details--email {
    margin: 6px 0 0;
    padding-left: 0;
}

/* Mobil: staplade adresser med avdelare, tätare tabell – utan
   horisontell overflow. */
@media (max-width: 768px) {
    .woocommerce-MyAccount-content section.woocommerce-order-details,
    .woocommerce-MyAccount-content section.woocommerce-customer-details {
        padding: var(--uv-spacing-md);
    }

    .woocommerce-MyAccount-content .woocommerce-columns--addresses {
        grid-template-columns: 1fr;
        gap: var(--uv-spacing-lg);
    }

    .woocommerce-MyAccount-content .woocommerce-columns--addresses .woocommerce-column + .woocommerce-column {
        padding-top: var(--uv-spacing-md);
        border-top: 1px solid var(--uv-color-border);
    }

    .woocommerce-MyAccount-content table.woocommerce-table--order-details th,
    .woocommerce-MyAccount-content table.woocommerce-table--order-details td {
        padding: 8px 6px;
        font-size: 0.92rem;
    }

    .woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot th {
        white-space: normal;
    }
}

/* =====================================================
   v1.7.7 (punkt 2.0) – Mitt konto-kvittot: "Observera"-raden
   (kundens ordernotering) är beskrivande information och ska
   vänsterställas – den får inte ärva Totalt-radens högerställda,
   fetstilta utseende. Summeringsradernas th har scope="row";
   noteringsradens th saknar scope och särskiljs så.
   ===================================================== */
.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot tr:last-child th:not([scope="row"]) {
    text-align: left;
    font-size: var(--uv-font-size-base);
    font-weight: 500;
    color: var(--uv-color-muted);
    white-space: normal;
}

.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot tr:last-child th:not([scope="row"]) + td {
    font-size: var(--uv-font-size-base);
    font-weight: 400;
}

/* När Observera-raden är sist är Totalt näst sist – behåll betoningen
   på raden direkt före noteringen. (Högerställningen av etiketten
   utgick i v1.7.8 – alla etiketter vänsterställs.) */
.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot tr:has(+ tr > th:not([scope="row"])) th[scope="row"],
.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot tr:has(+ tr > th:not([scope="row"])) td {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--uv-color-dark);
}

.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot tr:has(+ tr > th:not([scope="row"])) td .woocommerce-Price-amount {
    color: var(--uv-color-primary);
}

/* =====================================================
   v1.7.8 – Mitt konto-kvittot: enhetliga radetiketter
   och Bortforsling i temats stil
   ===================================================== */

/* 2.1 – ALLA etiketter i summeringen (Delsumma, Frakt, Moms,
   Betalningsmetod, Totalt) börjar på exakt samma vänsterposition:
   vänsterställda, utan extra indrag/marginal, med samma vänster-
   padding som tabellens grundregel (8px desktop, 6px mobil).
   Värdena i högerkolumnen påverkas inte. */
.woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot tr > th:first-child {
    text-align: left;
    text-indent: 0;
    margin: 0;
    padding-left: 8px;
}

@media (max-width: 768px) {
    .woocommerce-MyAccount-content table.woocommerce-table--order-details tfoot tr > th:first-child {
        padding-left: 6px;
    }
}

/* 2.3 – Bortforsling-blockets rubrik utan inline-stilar (v1.7.8) ärver
   nu sektionsrubriksregeln ovan och matchar därmed "Faktureringsadress"
   i typsnitt, vikt, storlek, färg och luft. Stycket hålls tätt. */
.woocommerce-MyAccount-content .uvc-removal-order-info p {
    margin: 0;
    line-height: 1.6;
}

/* =====================================================
   v1.7.9 – Adresser under Mitt konto (mobil)
   ===================================================== */

/* 1.4 – Mer luft mellan rubrikerna (Faktureringsadress/Leveransadress)
   och länken under ("Lägg till …"/"Redigera …") samt mellan länken och
   nästa block. Endast mobil – desktop oförändrad. */
@media (max-width: 768px) {
    .woocommerce-MyAccount-content .woocommerce-Address-title h2 {
        margin: 0 0 10px;
    }

    .woocommerce-MyAccount-content .woocommerce-Address-title a.edit {
        display: inline-block;
        margin-bottom: var(--uv-spacing-sm, 12px);
    }

    .woocommerce-MyAccount-content .woocommerce-Address + .woocommerce-Address,
    .woocommerce-MyAccount-content .woocommerce-Addresses .u-column2 {
        margin-top: var(--uv-spacing-md, 16px);
    }

    /* 1.6 – Adressformulären (Redigera faktureringsadress/leveransadress):
       luft mellan rubriken och första fältet ("Förnamn"). */
    .woocommerce-MyAccount-content form > h2:first-child {
        margin: 0 0 var(--uv-spacing-md, 16px);
    }
}
