/**
 * Mi cuenta del cliente (WooCommerce) con el diseño del sitio.
 *
 * Lo carga AsistenciaVehicular_Account en todas las páginas de Mi cuenta
 * (también sin sesión: el ingreso y el registro). Los colores son los de la
 * marca y no los del tema, para que se vea igual con cualquier tema; la letra
 * es la del tema.
 *
 *   .av-acc            contenedor de Mi cuenta (menú + sección)
 *   .av-acc-*          componentes (tarjetas, botones, chips, listas…). Se
 *                      escriben sin depender de .av-acc: las plantillas que
 *                      también usa un shortcode se ven igual fuera de la cuenta.
 *
 * Las reglas que corrigen a WooCommerce o al tema llevan
 * ".woocommerce-account .av-acc" delante para ganarles sin !important.
 */

:root {
    --ava-navy: #0e2a66;
    --ava-ink: #0d1b3e;
    --ava-text: #153e8a;
    --ava-soft: #4a5a7a;
    --ava-muted: #64728e;
    --ava-blue: #0000ff;
    --ava-blue-d: #0000cc;
    --ava-blue-soft: #e8eeff;
    --ava-surface: #ffffff;
    --ava-surface-2: #f3f6fc;
    --ava-line: #e6eefb;
    --ava-border: #c9d6ee;
    --ava-red: #dc2626;
    --ava-red-d: #b42318;
    --ava-red-soft: #fdecec;
    --ava-amber-soft: #fff4db;
    --ava-amber-text: #8a4b00;
    --ava-green: #1f8a4c;
    --ava-green-soft: #e3f6ea;
    --ava-green-text: #146b3a;
    --ava-yellow: #ffc928;
    --ava-on-navy: #c9d6ee;
    --ava-radius: 20px;
    --ava-radius-md: 14px;
    --ava-radius-sm: 10px;
    --ava-shadow: 0 1px 2px rgba(13, 27, 62, 0.06), 0 2px 8px rgba(13, 27, 62, 0.04);
}

/* =========================================================================
   Página
   ========================================================================= */

/* El título "Mi cuenta" del tema queda para los lectores de pantalla: cada
   sección trae su encabezado (y el Resumen, el saludo). */
body.woocommerce-account.logged-in:has(.av-acc) :is(h1.wp-block-post-title, h1.entry-title) {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* El tema limita el contenido de las páginas a un ancho de lectura: Mi cuenta
   (menú + columna) usa el ancho amplio. */
.woocommerce-account .is-layout-constrained > .woocommerce:has(> .av-acc) {
    max-width: var(--wp--style--global--wide-size, 1280px);
}

@media (max-width: 600px) {
    body.woocommerce-account:has(.av-acc) .wp-block-post-content.has-global-padding {
        padding-left: 16px;
        padding-right: 16px;
    }
}

.av-acc-sr {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* =========================================================================
   Estructura: menú a la izquierda, sección a la derecha
   ========================================================================= */

.woocommerce-account .av-acc {
    display: grid;
    grid-template-columns: 248px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    color: var(--ava-text);
    font-size: 15px;
    line-height: 1.55;
}

.woocommerce-account .av-acc > .woocommerce-MyAccount-navigation,
.woocommerce-account .av-acc > .woocommerce-MyAccount-content {
    float: none;
    width: auto;
    margin: 0;
}

.woocommerce-account .av-acc-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.woocommerce-account .av-acc-main > .woocommerce-notices-wrapper:empty {
    display: none;
}

/* =========================================================================
   Menú
   ========================================================================= */

.woocommerce-account .av-acc .av-acc-nav {
    padding: 14px;
    border-radius: var(--ava-radius);
    background: var(--ava-surface);
    box-shadow: var(--ava-shadow);
}

.woocommerce-account .av-acc .av-acc-nav-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.woocommerce-account .av-acc .av-acc-nav-item {
    margin: 0;
    padding: 0;
    list-style: none;
}

.woocommerce-account .av-acc .av-acc-nav-link {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 11px 12px;
    border-radius: 12px;
    color: var(--ava-text);
    font-weight: 600;
    line-height: 1.3;
    text-decoration: none;
}

.woocommerce-account .av-acc .av-acc-nav-link svg {
    flex: none;
}

.woocommerce-account .av-acc .av-acc-nav-link:hover,
.woocommerce-account .av-acc .av-acc-nav-link:focus-visible {
    background: var(--ava-surface-2);
    color: var(--ava-blue-d);
    text-decoration: none;
}

.woocommerce-account .av-acc .av-acc-nav-item.is-active .av-acc-nav-link {
    background: var(--ava-blue-soft);
    color: var(--ava-blue-d);
    font-weight: 800;
    text-decoration: none;
}

.woocommerce-account .av-acc .av-acc-nav-item.is-danger .av-acc-nav-link {
    color: var(--ava-red-d);
    font-weight: 800;
}

.woocommerce-account .av-acc .av-acc-nav-item.is-danger .av-acc-nav-link:hover,
.woocommerce-account .av-acc .av-acc-nav-item.is-danger.is-active .av-acc-nav-link {
    background: var(--ava-red-soft);
    color: var(--ava-red-d);
}

.woocommerce-account .av-acc .av-acc-nav-item.is-muted {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid var(--ava-line);
}

.woocommerce-account .av-acc .av-acc-nav-item.is-muted .av-acc-nav-link {
    color: var(--ava-soft);
}

.av-acc-nav-short {
    display: none;
}

/* =========================================================================
   Encabezado de cada sección y pestañas
   ========================================================================= */

.av-acc-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 12px 16px;
}

.av-acc-head-text {
    flex: 1 1 320px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.av-acc-title,
.av-acc-hello-title {
    margin: 0;
    color: var(--ava-text);
    font-size: clamp(26px, 3vw, 32px);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.15;
}

.av-acc-hello-title {
    font-size: clamp(28px, 3.4vw, 34px);
}

.av-acc-sub,
.av-acc-hello-sub {
    margin: 0;
    color: var(--ava-soft);
}

.av-acc-back {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 4px;
    color: var(--ava-blue);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.av-acc-back:hover {
    color: var(--ava-text);
    text-decoration: underline;
}

.av-acc-head-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.av-acc-tabs {
    display: flex;
    flex-wrap: wrap;
    align-self: flex-start;
    gap: 4px;
    padding: 4px;
    border-radius: 999px;
    background: var(--ava-surface);
    box-shadow: var(--ava-shadow);
}

.av-acc-tab {
    padding: 8px 16px;
    border-radius: 999px;
    color: var(--ava-text);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.av-acc-tab:hover {
    background: var(--ava-surface-2);
    color: var(--ava-blue-d);
    text-decoration: none;
}

.av-acc-tab.is-active,
.av-acc-tab.is-active:hover {
    background: var(--ava-blue);
    color: #fff;
}

/* =========================================================================
   Botones, enlaces, chips y patentes
   ========================================================================= */

.av-acc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-sizing: border-box;
    min-height: 46px;
    margin: 0;
    padding: 0 22px;
    border: 0;
    border-radius: 999px;
    font: inherit;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}

.av-acc-btn:hover,
.av-acc-btn:focus-visible {
    text-decoration: none;
}

.av-acc-btn svg {
    flex: none;
}

.av-acc-btn--primary {
    background: var(--ava-blue);
    color: #fff;
}

.av-acc-btn--primary:hover,
.av-acc-btn--primary:focus-visible {
    background: var(--ava-blue-d);
    color: #fff;
}

.av-acc-btn--danger {
    background: var(--ava-red);
    color: #fff;
}

.av-acc-btn--danger:hover,
.av-acc-btn--danger:focus-visible {
    background: var(--ava-red-d);
    color: #fff;
}

.av-acc-btn--light {
    background: #fff;
    color: var(--ava-blue);
}

.av-acc-btn--light:hover,
.av-acc-btn--light:focus-visible {
    background: var(--ava-blue-soft);
    color: var(--ava-blue-d);
}

.av-acc-btn--ghost {
    background: transparent;
    box-shadow: inset 0 0 0 1.5px var(--ava-border);
    color: var(--ava-text);
}

.av-acc-btn--ghost:hover,
.av-acc-btn--ghost:focus-visible {
    background: transparent;
    box-shadow: inset 0 0 0 1.5px var(--ava-text);
    color: var(--ava-text);
}

.av-acc-btn--lg {
    min-height: 54px;
    padding: 0 26px;
    font-size: 16px;
}

.av-acc-btn--sm {
    min-height: 38px;
    padding: 0 16px;
    font-size: 14px;
}

.av-acc-btn:disabled,
.av-acc-btn[disabled] {
    opacity: 0.6;
    cursor: wait;
}

.av-acc-link {
    color: var(--ava-blue);
    font-weight: 700;
    text-decoration: none;
}

.av-acc-link:hover,
.av-acc-link:focus-visible {
    color: var(--ava-text);
    text-decoration: underline;
}

/* Utilidades: ganan a los márgenes de cada componente (.av-acc-muted…). */
.av-acc-push {
    margin-left: auto !important;
}

.av-acc-start {
    align-self: flex-start !important;
}

.av-acc-chip {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.4;
    white-space: nowrap;
}

.av-acc-chip--ok {
    background: var(--ava-green-soft);
    color: var(--ava-green-text);
}

.av-acc-chip--wait {
    background: var(--ava-amber-soft);
    color: var(--ava-amber-text);
}

.av-acc-chip--info {
    background: var(--ava-blue-soft);
    color: var(--ava-blue-d);
}

.av-acc-chip--bad {
    background: var(--ava-red-soft);
    color: var(--ava-red-d);
}

.av-acc-chip--live {
    background: var(--ava-yellow);
    color: var(--ava-navy);
}

.av-acc-chip--lg {
    padding: 6px 14px;
    font-size: 14px;
}

.av-acc-plate {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 8px;
    background: var(--ava-ink);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.3;
    text-transform: uppercase;
    white-space: nowrap;
}

/* =========================================================================
   Tarjetas
   ========================================================================= */

.av-acc-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    box-sizing: border-box;
    min-width: 0;
    margin: 0;
    padding: 20px;
    border-radius: var(--ava-radius);
    background: var(--ava-surface);
    box-shadow: var(--ava-shadow);
    color: var(--ava-text);
}

.av-acc-card > * {
    margin: 0;
}

.av-acc-card-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
}

.av-acc-card-title {
    margin: 0;
    color: var(--ava-text);
    font-size: 17px;
    font-weight: 800;
    letter-spacing: -0.01em;
    line-height: 1.3;
}

.av-acc-card .av-acc-card-foot {
    margin-top: auto;
}

.av-acc-muted {
    margin: 0;
    color: var(--ava-soft);
    font-size: 14px;
}

.av-acc-muted.is-late {
    color: var(--ava-red-d);
    font-weight: 700;
}

.av-acc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
    gap: 20px;
}

.av-acc-empty {
    align-items: flex-start;
}

.av-acc-empty-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: var(--ava-blue-soft);
    color: var(--ava-blue-d);
}

/* =========================================================================
   Resumen
   ========================================================================= */

.av-acc-dash {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.av-acc-hello {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}

.av-acc-hello-text {
    flex: 1 1 300px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* Servicio en curso */
.av-acc-live {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 16px;
    padding: 18px 20px;
    border-radius: var(--ava-radius);
    background: var(--ava-navy);
    color: #fff;
}

.av-acc-live-icon {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: var(--ava-yellow);
    color: var(--ava-navy);
}

.av-acc-live-text {
    flex: 1 1 260px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.av-acc-live-title {
    margin: 0;
    color: #fff;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.3;
}

.av-acc-live-sub,
.av-acc-live-note {
    margin: 0;
    color: var(--ava-on-navy);
    font-size: 14px;
}

.av-acc-live-note:empty {
    display: none;
}

/* Cupos del plan */
.av-acc-usage {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.av-acc-usage-row {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin: 0;
}

.av-acc-usage-head {
    display: flex;
    gap: 8px;
    font-size: 14px;
}

.av-acc-usage-name {
    font-weight: 700;
}

.av-acc-usage-left {
    margin-left: auto;
    color: var(--ava-soft);
    white-space: nowrap;
}

.av-acc-usage-row.is-empty .av-acc-usage-left {
    color: var(--ava-red-d);
    font-weight: 700;
}

.av-acc-bar {
    display: block;
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--ava-line);
}

.av-acc-bar > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--ava-blue);
}

/* Pagos */
.av-acc-amount {
    color: var(--ava-ink);
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.1;
}

.av-acc-alert-line {
    color: var(--ava-red-d);
    font-size: 14px;
    font-weight: 700;
}

.av-acc-ok-line {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--ava-green-text);
    font-size: 20px;
    font-weight: 800;
}

/* Filas (vehículos del Resumen) */
.av-acc-rows {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.av-acc-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 12px;
    border-radius: var(--ava-radius-md);
    background: var(--ava-surface-2);
}

.av-acc-row-main {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.av-acc-row-main strong {
    overflow: hidden;
    color: var(--ava-ink);
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.av-acc-row-line {
    font-size: 13px;
}

.av-acc-row-line.is-ok {
    color: var(--ava-green-text);
}

.av-acc-row-line.is-warn {
    color: var(--ava-amber-text);
}

.av-acc-row .av-acc-link {
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}

/* Lista (últimos servicios) */
.av-acc-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.av-acc-list-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
    margin: 0;
    padding: 12px 0;
    border-top: 1px solid var(--ava-line);
}

.av-acc-list-number {
    min-width: 96px;
    color: var(--ava-ink);
}

.av-acc-list-type {
    min-width: 150px;
}

.av-acc-list-date {
    min-width: 130px;
    color: var(--ava-soft);
    font-size: 14px;
}

.av-acc-list-row .av-acc-link {
    font-size: 14px;
    font-weight: 800;
}

/* =========================================================================
   Mis servicios: lista y detalle
   ========================================================================= */

.av-acc-svc-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.av-acc-svc-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
}

.av-acc-svc-number {
    color: var(--ava-ink);
    font-size: 16px;
}

.av-acc-svc-date {
    color: var(--ava-soft);
    font-size: 14px;
}

.av-acc-svc-type {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    font-weight: 700;
}

.av-acc-svc-type span:not(.av-acc-plate) {
    color: var(--ava-soft);
    font-weight: 600;
}

.av-acc-svc-place {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    color: var(--ava-soft);
    font-size: 14px;
}

.av-acc-svc-place svg {
    flex: none;
    margin-top: 2px;
}

.av-acc-svc-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
}

.av-acc-stars {
    margin: 0;
    color: #f59e0b;
    font-size: 18px;
    letter-spacing: 2px;
}

.av-acc-pager {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
}

.av-acc-service {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.av-acc-service-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    gap: 20px;
}

.av-acc-map {
    height: 340px;
    overflow: hidden;
    border-radius: var(--ava-radius-md);
    background: var(--ava-surface-2);
}

.av-acc-map-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    margin: 0;
    color: var(--ava-soft);
    font-size: 13px;
}

.av-acc-key::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 6px;
    border-radius: 50%;
    vertical-align: -1px;
}

.av-acc-key--origin::before {
    background: var(--ava-red);
}

.av-acc-key--dest::before {
    background: var(--ava-blue);
}

.av-acc-key--driver::before {
    background: var(--ava-navy);
    box-shadow: 0 0 0 2px var(--ava-yellow);
}

.av-acc-steps {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    list-style: none;
}

.av-acc-step {
    position: relative;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) auto;
    align-items: center;
    gap: 0 12px;
    margin: 0;
    padding: 9px 0;
}

.av-acc-step::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px;
    width: 2px;
    background: var(--ava-line);
}

.av-acc-step:first-child::before {
    top: 50%;
}

.av-acc-step:last-child::before {
    bottom: 50%;
}

.av-acc-step:only-child::before {
    display: none;
}

.av-acc-step-dot {
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    justify-self: center;
    width: 14px;
    height: 14px;
    border: 2px solid var(--ava-border);
    border-radius: 50%;
    background: #fff;
}

.av-acc-step-label {
    font-weight: 600;
}

.av-acc-step-time {
    color: var(--ava-soft);
    font-size: 13px;
    white-space: nowrap;
}

.av-acc-step.is-done .av-acc-step-dot {
    border-color: var(--ava-green);
    background: var(--ava-green);
}

.av-acc-step.is-current .av-acc-step-dot {
    border-color: var(--ava-blue);
    background: var(--ava-blue);
    box-shadow: 0 0 0 4px var(--ava-blue-soft);
}

.av-acc-step.is-current .av-acc-step-label {
    color: var(--ava-blue-d);
    font-weight: 800;
}

.av-acc-step.is-todo .av-acc-step-label {
    color: var(--ava-muted);
}

.av-acc-step.is-cancelled .av-acc-step-dot {
    border-color: var(--ava-red);
    background: var(--ava-red);
}

.av-acc-step.is-cancelled .av-acc-step-label {
    color: var(--ava-red-d);
    font-weight: 800;
}

.av-acc-facts {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0;
}

.av-acc-fact {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.av-acc-fact dt {
    margin: 0;
    color: var(--ava-muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.av-acc-fact dd {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin: 0;
    color: var(--ava-ink);
}

.av-acc-photos-phase {
    margin: 4px 0 0;
    color: var(--ava-text);
    font-size: 14px;
    font-weight: 800;
}

.av-acc-photos {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.av-acc-photos li {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: 0;
    color: var(--ava-soft);
    font-size: 12px;
}

.av-acc-photos a {
    display: block;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: var(--ava-radius-sm);
    background: var(--ava-surface-2);
}

.av-acc-photos img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* =========================================================================
   Avisos de WooCommerce dentro de Mi cuenta
   ========================================================================= */

.woocommerce-account .av-acc :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) {
    margin: 0;
    padding: 14px 18px 14px 48px;
    border: 0;
    border-left: 4px solid var(--ava-blue);
    border-radius: var(--ava-radius-md);
    background: var(--ava-surface);
    box-shadow: var(--ava-shadow);
    color: var(--ava-text);
}

.woocommerce-account .av-acc .woocommerce-message {
    border-left-color: var(--ava-green);
}

.woocommerce-account .av-acc .woocommerce-error {
    border-left-color: var(--ava-red);
}

.woocommerce-account .av-acc :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)::before {
    top: 15px;
    left: 18px;
}

/* =========================================================================
   Botones de WooCommerce y de las secciones (los que llevan .button)
   ========================================================================= */

.woocommerce-account .woocommerce :is(a.button, button.button, input.button) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4em;
    min-height: 46px;
    padding: 0 22px;
    border: 0;
    border-radius: 999px;
    background-color: var(--ava-blue);
    color: #fff;
    font: inherit;
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
}

.woocommerce-account .woocommerce :is(a.button, button.button, input.button):is(:hover, :focus-visible) {
    background-color: var(--ava-blue-d);
    color: #fff;
}

/* Pedidos: "Pagar" lleno; "Ver" y "Cancelar", con borde. */
.woocommerce-account .av-acc .woocommerce-orders-table .button {
    min-height: 36px;
    margin: 2px 6px 2px 0;
    padding: 0 14px;
    font-size: 14px;
    white-space: nowrap;
}

.woocommerce-account .av-acc .woocommerce-orders-table .button:not(.pay) {
    background-color: transparent;
    box-shadow: inset 0 0 0 1.5px var(--ava-border);
    color: var(--ava-text);
}

.woocommerce-account .av-acc .woocommerce-orders-table .button:not(.pay):is(:hover, :focus-visible) {
    background-color: transparent;
    box-shadow: inset 0 0 0 1.5px var(--ava-text);
    color: var(--ava-text);
}

/* =========================================================================
   Tablas (pedidos, cuotas, reclamos, detalle de un pedido)
   ========================================================================= */

.woocommerce-account .av-acc table.shop_table,
.av-acc-table {
    width: 100%;
    margin: 0;
    overflow: hidden;
    border: 0;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: var(--ava-radius);
    background: var(--ava-surface);
    box-shadow: var(--ava-shadow);
    color: var(--ava-ink);
    font-size: 15px;
}

.woocommerce-account .av-acc table.shop_table thead th,
.av-acc-table thead th {
    padding: 12px 16px;
    border: 0;
    background: var(--ava-surface-2);
    color: var(--ava-soft);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-align: left;
    text-transform: uppercase;
}

.woocommerce-account .av-acc table.shop_table :is(td, tbody th, tfoot th),
.av-acc-table :is(td, tbody th) {
    padding: 14px 16px;
    border: 0;
    border-top: 1px solid var(--ava-line);
    text-align: left;
    vertical-align: middle;
}

.woocommerce-account .av-acc table.shop_table tbody tr:first-child :is(td, th),
.av-acc-table tbody tr:first-child :is(td, th) {
    border-top: 0;
}

.woocommerce-account .av-acc table.shop_table tfoot :is(td, th) {
    border-top: 1px solid var(--ava-line);
}

.woocommerce-account .av-acc table.my_account_orders {
    font-size: 15px;
}

.woocommerce-account .av-acc .woocommerce-orders-table__cell-order-number a {
    font-weight: 800;
    text-decoration: none;
}

/* Una tabla dentro de una tarjeta (cuotas, reclamos) no es otra tarjeta. */
.av-acc-card .av-acc-table,
.woocommerce-account .av-acc .av-acc-card table.shop_table {
    border: 1px solid var(--ava-line);
    border-radius: var(--ava-radius-md);
    box-shadow: none;
}

@media (max-width: 768px) {
    .woocommerce-account .av-acc .av-acc-card table.shop_table_responsive {
        border: 0;
    }

    .woocommerce-account .av-acc .av-acc-card table.shop_table_responsive tbody tr {
        border: 1px solid var(--ava-line);
        background: var(--ava-surface-2);
        box-shadow: none;
    }
}

/* Celular: cada fila es una tarjeta. WooCommerce oculta el número de pedido
   (es un <th>); acá se muestra como título de la tarjeta. */
@media (max-width: 768px) {
    .woocommerce-account .av-acc table.shop_table_responsive {
        overflow: visible;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .woocommerce-account .av-acc table.shop_table_responsive tbody tr {
        display: block;
        margin: 0 0 12px;
        padding: 6px 16px;
        border-radius: var(--ava-radius-md);
        background: var(--ava-surface);
        box-shadow: var(--ava-shadow);
    }

    .woocommerce-account .av-acc table.shop_table_responsive tbody tr td {
        padding: 10px 0;
        border-top: 1px solid var(--ava-line);
        background-color: transparent !important;
    }

    .woocommerce-account .av-acc table.shop_table_responsive tbody tr :is(td, th):first-child {
        border-top: 0;
    }

    .woocommerce-account .av-acc table.my_account_orders tbody th {
        display: block;
        padding: 10px 0 4px;
        border: 0;
        font-size: 16px;
    }
}

/* =========================================================================
   Formularios (Mis datos, direcciones, ingreso y los de las secciones)
   ========================================================================= */

.woocommerce-account .woocommerce form :is(input.input-text, input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"], input[type="search"], input[type="date"], select, textarea) {
    box-sizing: border-box;
    width: 100%;
    min-height: 48px;
    padding: 10px 14px;
    border: 1.5px solid var(--ava-border);
    border-radius: 12px;
    background-color: #fff;
    color: var(--ava-ink);
    font: inherit;
    font-size: 16px;
    line-height: 1.4;
}

.woocommerce-account .woocommerce form select {
    padding-right: 40px;
}

.woocommerce-account .woocommerce form textarea {
    min-height: 110px;
    resize: vertical;
}

.woocommerce-account .woocommerce form :is(input.input-text, input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"], input[type="search"], input[type="date"], select, textarea):focus {
    border-color: var(--ava-blue);
    outline: none;
    box-shadow: 0 0 0 3px var(--ava-blue-soft);
}

.woocommerce-account .woocommerce form label {
    color: var(--ava-text);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
}

.woocommerce-account .woocommerce form .form-row {
    margin: 0 0 14px;
    padding: 0;
}

.woocommerce-account .woocommerce form .form-row label {
    margin-bottom: 6px;
}

.woocommerce-account .woocommerce form .form-row .required {
    color: var(--ava-red);
    visibility: visible;
    text-decoration: none;
}

.woocommerce-account .woocommerce form fieldset {
    margin: 8px 0 18px;
    padding: 16px 18px 4px;
    border: 1.5px solid var(--ava-line);
    border-radius: var(--ava-radius-md);
}

.woocommerce-account .woocommerce form legend {
    padding: 0 6px;
    color: var(--ava-text);
    font-weight: 800;
}

.woocommerce-account .woocommerce form em {
    color: var(--ava-soft);
    font-size: 13px;
}

/* Lista de países (select2 de WooCommerce) con la misma forma. */
.woocommerce-account .woocommerce .select2-container .select2-selection--single {
    height: 48px;
    border: 1.5px solid var(--ava-border);
    border-radius: 12px;
}

/* La hoja de WooCommerce para temas de bloques le da .9rem arriba al texto
   (0,6,1) y lo empujaba al borde de abajo: acá gana por especificidad. */
.woocommerce-account .woocommerce form .form-row .select2-container .select2-selection--single .select2-selection__rendered,
.woocommerce-account .woocommerce .select2-container .select2-selection--single .select2-selection__rendered {
    padding: 0 40px 0 14px;
    color: var(--ava-ink);
    line-height: 45px;
}

.woocommerce-account .woocommerce .select2-container .select2-selection--single .select2-selection__arrow {
    height: 46px;
}

/* Mis datos y las direcciones: el formulario va en una tarjeta. */
.woocommerce-account .av-acc .av-acc-main > form,
.woocommerce-account .av-acc .woocommerce-Address {
    box-sizing: border-box;
    margin: 0;
    padding: 24px;
    border-radius: var(--ava-radius);
    background: var(--ava-surface);
    box-shadow: var(--ava-shadow);
}

.woocommerce-account .av-acc .av-acc-main > form > h2,
.woocommerce-account .av-acc .woocommerce-Address-title h2 {
    margin: 0 0 16px;
    color: var(--ava-text);
    font-size: 19px;
    font-weight: 800;
}

.woocommerce-account .av-acc .woocommerce-Addresses {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    gap: 20px;
}

.woocommerce-account .av-acc .woocommerce-Addresses::before,
.woocommerce-account .av-acc .woocommerce-Addresses::after {
    display: none;
}

.woocommerce-account .av-acc .woocommerce-Addresses .woocommerce-Address {
    float: none;
    width: auto;
}

.woocommerce-account .av-acc .woocommerce-Address-title {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.woocommerce-account .av-acc .woocommerce-Address-title::before,
.woocommerce-account .av-acc .woocommerce-Address-title::after {
    display: none;
}

.woocommerce-account .av-acc .woocommerce-Address address {
    color: var(--ava-ink);
    font-style: normal;
    line-height: 1.6;
}

@media (max-width: 600px) {
    .woocommerce-account .woocommerce form :is(.form-row-first, .form-row-last) {
        float: none;
        width: 100%;
    }

    .woocommerce-account .av-acc .av-acc-main > form {
        padding: 18px;
    }
}

/* Detalle de un pedido */
.woocommerce-account .av-acc .woocommerce-order-details,
.woocommerce-account .av-acc .woocommerce-customer-details {
    margin: 0;
}

.woocommerce-account .av-acc :is(.woocommerce-order-details__title, .woocommerce-column__title) {
    margin: 0 0 12px;
    color: var(--ava-text);
    font-size: 19px;
    font-weight: 800;
}

.woocommerce-account .av-acc .woocommerce-customer-details address {
    padding: 18px 20px;
    border: 0;
    border-radius: var(--ava-radius);
    background: var(--ava-surface);
    box-shadow: var(--ava-shadow);
    font-style: normal;
}

.woocommerce-account .av-acc .av-acc-main > p mark {
    background: transparent;
    color: var(--ava-ink);
    font-weight: 800;
}

/* =========================================================================
   Ingreso, registro y contraseña olvidada (sin sesión)
   ========================================================================= */

body.woocommerce-account:not(.logged-in) .woocommerce :is(form.woocommerce-form-login, form.woocommerce-form-register, form.lost_reset_password) {
    box-sizing: border-box;
    margin: 0 0 20px;
    padding: 24px;
    border: 0;
    border-radius: var(--ava-radius);
    background: var(--ava-surface);
    box-shadow: var(--ava-shadow);
}

body.woocommerce-account:not(.logged-in) .woocommerce #customer_login {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
    gap: 20px;
}

body.woocommerce-account:not(.logged-in) .woocommerce #customer_login::before,
body.woocommerce-account:not(.logged-in) .woocommerce #customer_login::after {
    display: none;
}

body.woocommerce-account:not(.logged-in) .woocommerce #customer_login > div {
    float: none;
    width: auto;
}

body.woocommerce-account:not(.logged-in) .woocommerce #customer_login h2 {
    margin: 0 0 12px;
    color: var(--ava-text);
    font-size: 22px;
    font-weight: 800;
}

body.woocommerce-account:not(.logged-in) .woocommerce .woocommerce-form-login__rememberme {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    font-weight: 600;
}

body.woocommerce-account:not(.logged-in) .woocommerce .lost_password {
    margin: 12px 0 0;
}

/* Los textos del registro ("te enviamos un enlace…", privacidad) con la letra
   de los campos y no con la del tema, más grande. */
body.woocommerce-account:not(.logged-in) .woocommerce form.woocommerce-form-register > p:not(.form-row),
body.woocommerce-account:not(.logged-in) .woocommerce form.woocommerce-form-register .woocommerce-privacy-policy-text p {
    margin: 0 0 14px;
    color: var(--ava-soft);
    font-size: 14px;
    line-height: 1.5;
}

/* =========================================================================
   Mis vehículos
   ========================================================================= */

.av-acc-vgrid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
    gap: 20px;
}

.av-acc-vcard-top {
    display: flex;
    align-items: center;
    gap: 8px;
}

.av-acc-vcard-photo {
    overflow: hidden;
    aspect-ratio: 16 / 9;
    border-radius: var(--ava-radius-md);
    background: var(--ava-surface-2);
}

.av-acc-vcard-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.av-acc-vcard-name {
    margin: 0;
    color: var(--ava-ink);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.25;
}

.av-acc-vcard-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: auto;
}

.av-acc-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 0;
    border-radius: 12px;
    background: var(--ava-surface-2);
    color: var(--ava-text);
    cursor: pointer;
}

.av-acc-icon-btn:hover,
.av-acc-icon-btn:focus-visible {
    background: var(--ava-blue-soft);
    color: var(--ava-blue-d);
}

.av-acc-icon-btn--danger:hover,
.av-acc-icon-btn--danger:focus-visible {
    background: var(--ava-red-soft);
    color: var(--ava-red-d);
}

.av-vehicle-card.is-removing {
    opacity: 0.5;
    pointer-events: none;
}

/* Ventanas (agregar/editar vehículo, elegir plan). No se cierran con un clic
   afuera: sólo con la X, "Cancelar" o Esc. */
.av-acc .av-modal {
    position: fixed;
    inset: 0;
    z-index: 100000;
}

.av-acc .av-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(13, 27, 62, 0.55);
}

.av-acc .av-modal-content {
    position: relative;
    box-sizing: border-box;
    width: calc(100% - 32px);
    max-width: 600px;
    max-height: 88vh;
    margin: 6vh auto 0;
    overflow-y: auto;
    border-radius: var(--ava-radius);
    background: #fff;
    box-shadow: 0 18px 44px rgba(13, 27, 62, 0.24);
    color: var(--ava-text);
}

.av-acc .av-plans-modal-content {
    max-width: 920px;
}

.av-acc .av-modal-header {
    position: sticky;
    top: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--ava-line);
    background: #fff;
}

.av-acc .av-modal-header h3 {
    margin: 0;
    color: var(--ava-text);
    font-size: 19px;
    font-weight: 800;
}

.av-acc .av-modal-close {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    border-radius: 12px;
    background: var(--ava-surface-2);
    color: var(--ava-text);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

.av-acc .av-modal-close:hover,
.av-acc .av-modal-close:focus-visible {
    background: var(--ava-blue-soft);
    color: var(--ava-blue-d);
}

.av-acc #av-vehicle-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 20px;
}

.av-acc-fields {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr));
    gap: 14px;
}

.av-acc-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.av-acc-field label {
    color: var(--ava-text);
    font-size: 14px;
    font-weight: 700;
}

.av-acc-field .required,
.av-acc-req {
    color: var(--ava-red);
}

.av-acc-help {
    color: var(--ava-soft);
    font-size: 13px;
}

/* Chapa y chasis fijos mientras se confirma el pago del plan del vehículo. */
.av-acc .av-vehicle-lock-note {
    margin: 0;
    padding: 12px 14px;
    border-radius: var(--ava-radius-md);
    background: var(--ava-amber-soft);
    color: var(--ava-amber-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.45;
}

.woocommerce-account .woocommerce form .av-acc-field input[readonly] {
    background: var(--ava-surface-2);
    color: var(--ava-soft);
    cursor: not-allowed;
}

/* Fotos del vehículo en la ventana: las que tiene y las nuevas, antes de
   guardar. La × marca una para quitar (se puede deshacer hasta guardar). */
.av-vphotos-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 4px 12px;
}

.av-vphotos-title {
    color: var(--ava-text);
    font-size: 14px;
    font-weight: 700;
}

.av-vphotos {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
    gap: 10px;
}

.av-vphotos[hidden] {
    display: none;
}

.av-vphoto {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    border: 1px solid var(--ava-border);
    border-radius: var(--ava-radius-sm);
    background: var(--ava-surface-2);
}

.av-vphoto img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.av-vphoto.is-new {
    border-color: var(--ava-blue);
}

.av-vphoto.is-removed img {
    opacity: 0.35;
    filter: grayscale(1);
}

.av-vphoto-tag {
    position: absolute;
    left: 6px;
    bottom: 6px;
    max-width: calc(100% - 12px);
    overflow: hidden;
    padding: 2px 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-radius: 999px;
    background: var(--ava-blue);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.5;
}

.av-vphoto.is-removed .av-vphoto-tag {
    background: var(--ava-red-d);
}

.av-acc .av-vphoto-btn {
    position: absolute;
    top: 6px;
    right: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 30px;
    padding: 0 8px;
    border: 0;
    border-radius: 999px;
    background: rgba(13, 27, 62, 0.78);
    color: #fff;
    font: inherit;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

.av-acc .av-vphoto-btn.is-undo {
    background: #fff;
    color: var(--ava-text);
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 1px 4px rgba(13, 27, 62, 0.25);
}

.av-acc .av-vphoto-btn:hover,
.av-acc .av-vphoto-btn:focus-visible {
    background: var(--ava-red-d);
    color: #fff;
}

.av-acc .av-vphoto-btn.is-undo:hover,
.av-acc .av-vphoto-btn.is-undo:focus-visible {
    background: var(--ava-blue-soft);
    color: var(--ava-blue-d);
}

.av-acc .av-vphoto-btn:focus-visible {
    outline: 2px solid var(--ava-blue);
    outline-offset: 2px;
}

/* El campo de archivo queda oculto: lo abre "Agregar fotos" (y el teclado). */
.av-vphotos-input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.av-acc .av-vphotos-add {
    align-self: flex-start;
    font-weight: 800;
    cursor: pointer;
}

.av-vphotos-input:focus-visible + .av-vphotos-add {
    outline: 2px solid var(--ava-blue);
    outline-offset: 2px;
}

.av-acc .av-vphotos-add.is-disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.av-acc .av-modal-footer {
    position: sticky;
    bottom: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    margin: 0 -20px -20px;
    padding: 14px 20px;
    border-top: 1px solid var(--ava-line);
    background: #fff;
}

.av-acc .av-btn-loading {
    display: none;
    align-items: center;
    gap: 8px;
}

/* Planes para elegir */
.av-acc .av-plans-modal-body {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
}

.av-acc .av-plans-vehicle-info {
    margin: 0;
    padding: 12px 16px;
    border-radius: var(--ava-radius-md);
    background: var(--ava-blue-soft);
    color: var(--ava-text);
}

.av-acc .av-plans-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr));
    gap: 16px;
}

.av-acc .av-plan-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 18px;
    border: 1.5px solid var(--ava-line);
    border-radius: var(--ava-radius);
    background: #fff;
}

.av-acc .av-plan-card:hover {
    border-color: var(--ava-blue);
}

/* El plan que se eligió en la página de planes (?plan=ID). */
.av-acc .av-plan-card.is-suggested {
    border-color: var(--ava-blue);
    box-shadow: 0 0 0 2px var(--ava-blue-soft);
}

.av-acc .av-plan-card.av-plan-processing {
    opacity: 0.7;
    pointer-events: none;
}

.av-acc .av-plan-header h4 {
    margin: 0 0 4px;
    color: var(--ava-text);
    font-size: 18px;
    font-weight: 800;
}

.av-acc .av-plan-price {
    color: var(--ava-ink);
    font-size: 24px;
    font-weight: 800;
}

.av-acc .av-plan-duration {
    color: var(--ava-soft);
    font-size: 14px;
    font-weight: 600;
}

.av-acc .av-plan-benefits {
    margin: 0;
    color: var(--ava-soft);
    font-size: 14px;
}

.av-acc .av-plan-services {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 14px;
}

.av-acc .av-plan-services li {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}

.av-acc .av-plan-services li::before {
    content: "";
    flex: none;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ava-green);
}

.av-acc .av-plan-feature {
    color: var(--ava-soft);
    font-size: 14px;
}

.av-acc .av-plan-header .av-plan-feature {
    margin: 4px 0 0;
}

.av-acc .av-plan-benefits > :first-child {
    margin-top: 0;
}

.av-acc .av-plan-benefits > :last-child {
    margin-bottom: 0;
}

/* Cómo se paga en la web: semestral o anual, con el monto y lo que se ahorra. */
.av-acc .av-plan-freqs {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.av-acc .av-plan-freqs-title {
    margin: 0 0 2px;
    padding: 0;
    color: var(--ava-text);
    font-size: 13px;
    font-weight: 800;
}

.av-acc .av-plan-freq {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 2px 10px;
    align-items: center;
    padding: 10px 12px;
    border: 1.5px solid var(--ava-border);
    border-radius: var(--ava-radius-sm);
    background: #fff;
    cursor: pointer;
}

.av-acc .av-plan-freq:has(input:checked) {
    border-color: var(--ava-blue);
    background: var(--ava-blue-soft);
}

.av-acc .av-plan-freq input {
    grid-row: span 2;
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--ava-blue);
}

.av-acc .av-plan-freq-main {
    display: flex;
    flex-direction: column;
    gap: 1px;
    color: var(--ava-text);
    font-size: 15px;
}

.av-acc .av-plan-freq-amount {
    color: var(--ava-ink);
    font-weight: 800;
}

.av-acc .av-plan-freq-sub {
    grid-column: 2;
    color: var(--ava-soft);
    font-size: 13px;
}

.av-acc .av-plan-freq-save {
    color: var(--ava-green-text);
    font-weight: 700;
}

.av-acc .av-plan-footer {
    margin-top: auto;
}

.av-acc .av-plan-footer .av-acc-btn {
    width: 100%;
}

@media (max-width: 600px) {
    .av-acc .av-modal-content {
        width: 100%;
        max-height: 100vh;
        height: 100%;
        margin: 0;
        border-radius: 0;
    }
}

/* =========================================================================
   Mi membresía
   ========================================================================= */

.av-acc-membership {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.av-acc-pills {
    display: flex;
    gap: 8px;
    margin: 0;
    padding: 0 0 4px;
    overflow-x: auto;
    list-style: none;
    scrollbar-width: thin;
}

.av-acc-pill {
    display: inline-flex;
    flex: none;
    align-items: center;
    gap: 10px;
    padding: 8px 14px 8px 8px;
    border-radius: 999px;
    background: var(--ava-surface);
    box-shadow: var(--ava-shadow);
    color: var(--ava-text);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.av-acc-pill:hover {
    color: var(--ava-blue-d);
    text-decoration: none;
}

.av-acc-pill.is-active {
    background: var(--ava-blue);
    color: #fff;
}

.av-acc-pill.is-active .av-acc-plate {
    background: #fff;
    color: var(--ava-blue-d);
}

.av-acc-details {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(160px, 100%), 1fr));
    gap: 14px;
    margin: 0;
}

.av-acc-detail {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 12px 14px;
    border-radius: var(--ava-radius-md);
    background: var(--ava-surface-2);
}

.av-acc-detail dt {
    color: var(--ava-muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.av-acc-detail dd {
    margin: 0;
    color: var(--ava-ink);
    font-weight: 700;
}

.av-acc-detail.is-warn dd {
    color: var(--ava-amber-text);
}

.av-acc-detail.is-bad dd {
    color: var(--ava-red-d);
}

.av-acc-membership .av-acc-table td:last-child {
    text-align: right;
}

@media (max-width: 600px) {
    .av-acc-membership .av-acc-table thead {
        display: none;
    }

    .av-acc-membership .av-acc-table tbody tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 2px 12px;
        padding: 12px 16px;
        border-top: 1px solid var(--ava-line);
    }

    .av-acc-membership .av-acc-table tbody tr:first-child {
        border-top: 0;
    }

    .av-acc-membership .av-acc-table tbody td {
        padding: 0;
        border: 0;
    }

    .av-acc-membership .av-acc-table tbody td:last-child {
        grid-column: 1 / -1;
        text-align: left;
    }

    .av-acc-membership .av-acc-table tbody td:last-child:empty {
        display: none;
    }
}

/* =========================================================================
   Pedir asistencia (el formulario de emergencia dentro de Mi cuenta)
   ========================================================================= */

.av-acc .av-emergency-widget {
    margin: 0;
}

.av-acc .av-emergency-form {
    margin: 0;
    padding: 24px;
    border: 0;
    border-radius: var(--ava-radius);
    background: var(--ava-surface);
    box-shadow: var(--ava-shadow);
    animation: none;
}

.av-acc #av-emergency-request-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px;
}

.av-acc #av-emergency-request-form > * {
    grid-column: 1 / -1;
    margin: 0;
}

.av-acc #av-emergency-request-form > .av-form-row--half {
    grid-column: auto;
}

.av-acc .av-emergency-form .av-form-row label {
    display: block;
    margin-bottom: 6px;
    color: var(--ava-text);
    font-size: 14px;
    font-weight: 700;
}

.av-acc .av-emergency-form .av-form-row :is(input, select, textarea) {
    border: 1.5px solid var(--ava-border);
    border-radius: 12px;
    font-size: 16px;
}

.av-acc .av-emergency-form .av-form-row :is(input, select, textarea):focus {
    border-color: var(--ava-blue);
    box-shadow: 0 0 0 3px var(--ava-blue-soft);
}

.av-acc .av-emergency-form .av-get-location {
    margin-top: 10px;
}

.av-acc .av-emergency-form .av-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-sizing: border-box;
    min-height: 46px;
    padding: 0 20px;
    border-radius: 999px;
    font: inherit;
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
}

.av-acc .av-emergency-form .av-btn-secondary {
    background: transparent;
    box-shadow: inset 0 0 0 1.5px var(--ava-border);
    color: var(--ava-text);
}

.av-acc .av-emergency-form .av-btn-secondary:hover {
    box-shadow: inset 0 0 0 1.5px var(--ava-text);
    color: var(--ava-text);
}

.av-acc .av-emergency-form .av-btn-danger {
    background: var(--ava-red);
    color: #fff;
}

.av-acc .av-emergency-form .av-btn-danger:hover {
    background: var(--ava-red-d);
}

.av-acc .av-emergency-form .av-form-actions {
    justify-content: flex-end;
    margin-top: 4px;
    padding-top: 16px;
    border-top: 1px solid var(--ava-line);
}

.av-acc .av-selected-vehicle-info {
    border: 0;
    border-radius: var(--ava-radius-md);
    background: var(--ava-surface-2);
}

.av-acc .av-emergency-info {
    margin-top: 18px;
    padding: 16px;
    border-radius: var(--ava-radius-md);
    background: var(--ava-surface-2);
    text-align: left;
}

.av-acc .av-emergency-info h4 {
    margin: 0 0 4px;
    color: var(--ava-text);
}

.av-acc .av-emergency-result {
    margin: 0;
    padding: 24px;
    border: 0;
    border-left: 4px solid var(--ava-green);
    border-radius: var(--ava-radius);
    background: var(--ava-surface);
    box-shadow: var(--ava-shadow);
    text-align: left;
    animation: none;
}

.av-acc .av-emergency-result.av-result-error {
    border-left-color: var(--ava-red);
}

.av-acc .av-emergency-result h3 {
    margin: 0 0 8px;
    font-size: 19px;
}

.av-acc .av-emergency-result .av-result-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

@media (max-width: 600px) {
    .av-acc #av-emergency-request-form {
        grid-template-columns: minmax(0, 1fr);
    }

    .av-acc #av-emergency-request-form > .av-form-row--half {
        grid-column: 1 / -1;
    }

    .av-acc .av-emergency-form {
        padding: 18px;
    }

    /* El pedido primero; "Cancelar" debajo. */
    .av-acc .av-emergency-form .av-form-actions {
        flex-direction: column-reverse;
        gap: 10px;
    }

    .av-acc .av-emergency-form .av-form-actions .av-btn {
        width: 100%;
        margin: 0;
    }
}

/* =========================================================================
   Reclamos
   ========================================================================= */

.av-acc-complaints {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.av-acc-complaints .av-cf-form {
    max-width: 640px;
}

.av-acc-complaints .av-cf-result:empty {
    display: none;
}

.av-cf-result .is-ok {
    color: var(--ava-green-text);
    font-weight: 700;
}

.av-cf-result .is-error {
    color: var(--ava-red-d);
    font-weight: 700;
}

/* =========================================================================
   Celular y tableta
   ========================================================================= */

@media (max-width: 1100px) {
    .av-acc-service-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 900px) {
    .woocommerce-account .av-acc {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }

    /* El menú pasa a ser una fila de píldoras que se desliza. */
    .woocommerce-account .av-acc .av-acc-nav {
        padding: 0;
        background: transparent;
        box-shadow: none;
    }

    .woocommerce-account .av-acc .av-acc-nav-list {
        flex-direction: row;
        gap: 8px;
        padding: 2px 2px 6px;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .woocommerce-account .av-acc .av-acc-nav-list::-webkit-scrollbar {
        display: none;
    }

    .woocommerce-account .av-acc .av-acc-nav-item {
        flex: none;
    }

    .woocommerce-account .av-acc .av-acc-nav-item.is-muted {
        margin: 0;
        padding: 0;
        border: 0;
    }

    /* position: relative para que la etiqueta larga (oculta, sólo para lectores
       de pantalla) quede dentro de la fila que se desliza. Sin esto se ubicaba
       respecto de la página, a la derecha de la pantalla, y la ensanchaba (en
       el celular la página medía 863 px y las ventanas fijas salían cortadas). */
    .woocommerce-account .av-acc .av-acc-nav-link {
        position: relative;
        gap: 0;
        padding: 9px 14px;
        border-radius: 999px;
        background: var(--ava-surface);
        box-shadow: var(--ava-shadow);
        font-size: 14px;
        font-weight: 700;
        white-space: nowrap;
    }

    .woocommerce-account .av-acc .av-acc-nav-link svg {
        display: none;
    }

    .woocommerce-account .av-acc .av-acc-nav-item.is-active .av-acc-nav-link {
        background: var(--ava-blue);
        color: #fff;
    }

    .woocommerce-account .av-acc .av-acc-nav-item.is-danger .av-acc-nav-link {
        background: var(--ava-red-soft);
        color: var(--ava-red-d);
    }

    .woocommerce-account .av-acc .av-acc-nav-item.is-danger.is-active .av-acc-nav-link {
        background: var(--ava-red);
        color: #fff;
    }

    .woocommerce-account .av-acc .av-acc-nav-label {
        position: absolute !important;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .woocommerce-account .av-acc .av-acc-nav-short {
        display: inline;
    }
}

@media (max-width: 600px) {
    .av-acc-hello .av-acc-btn {
        flex: 1 1 100%;
        min-height: 58px;
        font-size: 17px;
    }

    .av-acc-card {
        padding: 16px;
        border-radius: 18px;
    }

    .av-acc-live {
        padding: 16px;
        border-radius: 18px;
    }

    .av-acc-live-icon {
        display: none;
    }

    .av-acc-live .av-acc-btn {
        flex: 1 1 100%;
    }

    .av-acc-map {
        height: 260px;
    }

    .av-acc-head-actions .av-acc-btn {
        flex: 1 1 100%;
    }

    .av-acc-list-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 2px 12px;
    }

    .av-acc-list-number {
        grid-column: 1;
        grid-row: 1;
        min-width: 0;
    }

    .av-acc-list-row .av-acc-chip {
        grid-column: 2;
        grid-row: 1;
        justify-self: end;
    }

    .av-acc-list-type {
        grid-column: 1;
        grid-row: 2;
        min-width: 0;
    }

    .av-acc-list-date {
        grid-column: 1;
        grid-row: 3;
        min-width: 0;
    }

    .av-acc-list-row .av-acc-link {
        grid-column: 2;
        grid-row: 2 / span 2;
        align-self: center;
        margin: 0;
    }

    .av-acc-amount {
        font-size: 28px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .av-acc-btn {
        transition: none;
    }
}

/* ========== Servicio particular (sin plan, se paga aparte) ========== */
.av-acc-svc-charge {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    margin: 0;
    font-size: 14px;
    font-weight: 700;
}

.av-acc-charge {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    border-color: #c9d6ff;
    background: #f7f9ff;
}

.av-acc-charge-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
}

.av-acc-charge-head .av-acc-card-title {
    margin: 0;
}

.av-acc-charge-amount {
    margin: 0;
    font-size: 26px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.av-acc-charge-text {
    margin: 0;
    font-weight: 600;
}

.av-acc-charge .av-acc-btn {
    margin-top: 6px;
}

@media (max-width: 600px) {
    .av-acc-charge .av-acc-btn {
        align-self: stretch;
        justify-content: center;
    }
}
