/* Order lookup and the storefront account menu. */
:is(.pedidos-page, .account-menu--modern) {
    --cuenta-accent: var(--main-bg-color, #333);
    --cuenta-on-accent: var(--main-letra, #fff);
    --cuenta-border: #e3e6eb;
    --cuenta-muted: #68717e;
    color: #262b33;
}
:is(.pedidos-page, .account-menu--modern) :is(a, button, input):focus-visible { outline: 3px solid var(--cuenta-accent); outline-offset: 3px; }
:is(.pedidos-page, .account-menu--modern) .cuenta-eyebrow { display: block; margin-bottom: 6px; color: var(--cuenta-muted); font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
:is(.pedidos-page, .account-menu--modern) .cuenta-icon { display: flex; align-items: center; justify-content: center; flex: 0 0 46px; width: 46px; height: 46px; border-radius: 14px; background: #f3f5f7; color: var(--cuenta-accent); font-size: 20px; }
.pedidos-page { padding-bottom: 48px; }
.pedidos-page .page-header { margin-bottom: 28px; }
.pedidos-page .page-header__breadcrumb { padding: 18px 0 12px; }
.pedidos-page .breadcrumb { gap: 4px; margin: 0; font-size: 12px; }
.pedidos-page .pedidos-heading { margin: 0; padding-top: 16px; }
.pedidos-page .pedidos-heading h1 { margin: 0; color: #252a32; font-size: clamp(28px, 3vw, 36px); line-height: 1.2; font-weight: 750; letter-spacing: -.035em; }
.pedidos-heading p { margin: 12px 0 0; color: var(--cuenta-muted); font-size: 14px; line-height: 1.65; }
.pedidos-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 40px; align-items: start; }
.pedidos-page .cuenta-card { border: 1px solid var(--cuenta-border); border-radius: 18px; background: #fff; box-shadow: 0 3px 10px rgba(25, 30, 40, .025); }
.pedidos-search { min-width: 0; padding: 28px; }
.cuenta-section-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }
.pedidos-page h2 { margin: 0; color: #303741; font-size: 22px; line-height: 1.3; font-weight: 700; letter-spacing: -.025em; }
.cuenta-section-heading p { margin: 5px 0 0; color: var(--cuenta-muted); font-size: 13px; line-height: 1.5; }
.pedidos-form__hint { margin-bottom: 20px; padding: 12px 14px; border-radius: 10px; background: #f5f6f8; color: #68717e; font-size: 12px; line-height: 1.6; }
.pedidos-form__hint strong { color: #303741; font-weight: 650; }
.pedidos-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 14px; }
.pedidos-fields__code { grid-column: 1 / -1; }
.pedidos-page .form-group { min-width: 0; margin-bottom: 0; }
.pedidos-page label, .account-menu--modern .cuenta-auth__label { display: block; margin: 0 0 7px; color: #505967; font-size: 12px; line-height: 1.5; font-weight: 600; }
.cuenta-optional { margin-left: 5px; color: #8a939f; font-size: 10px; font-weight: 400; }
:is(.pedidos-page, .account-menu--modern) .form-control { width: 100%; min-width: 0; height: 46px; padding: 11px 13px; border: 1px solid #dce1e7; border-radius: 10px; background: #f8f9fb; color: #303741; font-size: 13px; line-height: 1.5; text-align: left; box-shadow: none; transition: border-color .15s, box-shadow .15s; }
:is(.pedidos-page, .account-menu--modern) .form-control::placeholder { color: #959da8; opacity: 1; }
:is(.pedidos-page, .account-menu--modern) .form-control:is(:focus, :focus-visible) { border-color: var(--cuenta-accent); background: #fff; outline: none; box-shadow: 0 0 0 3px rgba(30, 35, 45, .08); box-shadow: 0 0 0 3px color-mix(in srgb, var(--cuenta-accent) 15%, transparent); }
:is(.pedidos-page, .account-menu--modern) .input-validation-error { border-color: #c13d4b; }
:is(.pedidos-page, .account-menu--modern) .field-validation-error { display: block; margin-top: 6px; color: #bd3544; font-size: 11px; line-height: 1.5; }
.cuenta-field-hint { margin: 7px 0 0; color: var(--cuenta-muted); font-size: 11px; line-height: 1.5; }
.pedidos-page .pedidos-search__submit { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 48px; height: auto; margin-top: 24px; padding: 12px 16px; border-color: var(--cuenta-accent); border-radius: 10px; background: var(--cuenta-accent); color: var(--cuenta-on-accent); font-size: 14px; font-weight: 650; line-height: 1.5; }
.pedidos-status { margin: 12px 0 0; color: var(--cuenta-muted); font-size: 11px; line-height: 1.6; }
.pedidos-status:empty { display: none; }
.pedidos-help { min-width: 0; padding: 28px 0; }
.pedidos-steps { display: grid; gap: 22px; margin: 26px 0; padding: 0; list-style: none; }
.pedidos-steps li { display: flex; align-items: flex-start; gap: 14px; }
.pedidos-steps__number { display: flex; align-items: center; justify-content: center; flex: 0 0 32px; width: 32px; height: 32px; border: 1px solid var(--cuenta-border); border-radius: 10px; background: #fff; color: #68717e; font-size: 12px; font-weight: 650; }
.pedidos-steps h3 { margin: 0 0 5px; color: #303741; font-size: 14px; line-height: 1.5; font-weight: 650; }
.pedidos-steps p { margin: 0; color: var(--cuenta-muted); font-size: 13px; line-height: 1.65; }
.pedidos-help__link { display: flex; align-items: center; gap: 10px; padding-top: 20px; border-top: 1px solid var(--cuenta-border); color: #505967; font-size: 13px; line-height: 1.6; }
.pedidos-help__link > i:last-child { margin-left: auto; font-size: 11px; }
.pedidos-help__link:hover { color: var(--cuenta-accent); }
.pedidos-results:not(:empty) { margin-top: 32px; }
.pedidos-results__heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
.pedidos-results__heading > span { color: var(--cuenta-muted); font-size: 12px; }
.pedidos-results__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pedidos-page .pedido-result { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px 14px; padding: 22px; color: #303741; transition: border-color .15s, box-shadow .15s; }
.pedidos-page .pedido-result:hover { border-color: var(--cuenta-accent); color: #303741; box-shadow: 0 4px 14px rgba(25, 30, 40, .06); }
.pedido-result__heading { min-width: 0; }
.pedido-result__heading h3 { margin: 0 0 5px; font-size: 15px; line-height: 1.5; font-weight: 700; overflow-wrap: anywhere; }
.pedido-result__heading > span { color: var(--cuenta-muted); font-size: 12px; }
.pedido-result__state { align-self: start; max-width: 170px; padding: 5px 9px; border-radius: 7px; background: #f0f3f6; color: #505967; font-size: 11px; line-height: 1.5; font-weight: 600; overflow-wrap: anywhere; }
.pedido-result > p { min-width: 0; margin: 0; color: var(--cuenta-muted); font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.pedido-result__action { display: flex; align-items: center; justify-content: flex-end; gap: 8px; color: var(--cuenta-accent); font-size: 12px; font-weight: 650; }
.pedidos-empty { padding: 38px 24px; text-align: center; }
.pedidos-empty .cuenta-icon { width: 64px; height: 64px; margin: 0 auto 18px; border-radius: 20px; font-size: 24px; }
.pedidos-empty p { max-width: 520px; margin: 12px auto 20px; color: var(--cuenta-muted); font-size: 13px; line-height: 1.7; }
.pedidos-empty__link { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 10px 16px; border: 1px solid var(--cuenta-border); border-radius: 10px; background: #f8f9fb; color: #505967; font-size: 13px; font-weight: 600; line-height: 1.5; }
.pedidos-empty__link:hover { border-color: var(--cuenta-accent); color: var(--cuenta-accent); }
/* The dropdown is loaded by AJAX in both headers. Keep fields scoped to their form. */
.indicator__dropdown.divLoginHeader { width: 340px; max-width: calc(100vw - 24px); padding-top: 8px; }
.account-menu.account-menu--modern { width: 100%; max-height: calc(100vh - 240px); max-height: calc(100dvh - 240px); padding: 0; border: 1px solid var(--cuenta-border); border-radius: 18px; background: #fff; box-shadow: 0 12px 32px rgba(25, 30, 40, .15); overflow-x: hidden; overflow-y: auto; }
.account-menu--modern .account-menu__form { margin: 0; padding: 24px; }
.account-menu--modern .cuenta-auth__heading { margin-bottom: 22px; }
.account-menu--modern .cuenta-auth__heading .cuenta-icon { margin-bottom: 16px; }
.account-menu--modern .account-menu__form-title { margin: 0; padding: 0; color: #303741; font-size: 22px; font-weight: 700; line-height: 1.3; letter-spacing: -.025em; text-align: left; }
.account-menu--modern .cuenta-auth__heading p { margin: 10px 0 0; color: var(--cuenta-muted); font-size: 13px; line-height: 1.6; }
.account-menu--modern .account-menu__form .form-group { margin-bottom: 16px; }
.account-menu--modern .cuenta-auth__label { margin: 0; }
.account-menu--modern .cuenta-auth__label > span { display: block; margin-bottom: 7px; }
.account-menu--modern .cuenta-auth__recover { display: block; margin: -2px 0 20px auto; padding: 4px 0; border: 0; background: none; color: #68717e; font-size: 12px; line-height: 1.5; text-align: right; cursor: pointer; }
.account-menu--modern .cuenta-auth__recover:hover { color: var(--cuenta-accent); }
.account-menu--modern .btn { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; height: auto; margin: 0; padding: 11px 14px; border-radius: 10px; font-size: 13px; font-weight: 650; line-height: 1.5; }
.account-menu--modern .btn-primary { border-color: var(--cuenta-accent); background: var(--cuenta-accent); color: var(--cuenta-on-accent); }
.account-menu--modern .cuenta-auth__register { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--cuenta-border); }
.account-menu--modern .cuenta-auth__register > span { display: block; margin-bottom: 10px; color: var(--cuenta-muted); font-size: 12px; line-height: 1.5; text-align: center; }
.account-menu--modern .cuenta-auth__register-button { border: 1px solid var(--cuenta-border); background: #f7f8fa; color: #505967; }
.account-menu--modern .cuenta-auth__register-button:hover { border-color: #cdd2d9; background: #f0f2f5; }
.account-menu--modern .account-menu__divider:first-child { display: none; }
.account-menu--modern .account-menu__user { padding: 22px; }
.account-menu--modern .account-menu__user-avatar { display: flex; align-items: center; justify-content: center; flex-basis: 44px; height: 44px; border-radius: 12px; background: #f3f5f7; color: var(--cuenta-accent); fill: currentColor; }
.account-menu--modern .account-menu__user-info { min-width: 0; }
.account-menu--modern .account-menu__user-name { font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.account-menu--modern .account-menu__links { padding: 12px; }
.account-menu--modern .account-menu__links a { padding: 12px 10px; border-radius: 9px; font-size: 13px; line-height: 1.5; }
@media (max-width: 991px) {
    .pedidos-layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .pedidos-help { padding: 0 4px; }
    .pedidos-results__list { grid-template-columns: minmax(0, 1fr); }
    .indicator__dropdown.divLoginHeader { position: fixed; top: 60px; left: 12px !important; right: 12px !important; width: auto; max-width: none; padding-top: 0; }
    .account-menu.account-menu--modern { max-height: calc(100vh - 80px); max-height: calc(100dvh - 80px); }
}
@media (max-width: 575px) {
    .pedidos-page { padding-bottom: 32px; }
    .pedidos-page .page-header { margin-bottom: 22px; }
    .pedidos-page .page-header__breadcrumb { padding-top: 12px; }
    .pedidos-page .pedidos-heading { padding-top: 12px; }
    .pedidos-heading p { font-size: 13px; }
    .pedidos-search { padding: 20px; }
    .pedidos-page h2 { font-size: 20px; }
    .cuenta-section-heading { gap: 10px; }
    .cuenta-section-heading p { font-size: 12px; }
    .pedidos-page .cuenta-icon { flex-basis: 40px; width: 40px; height: 40px; border-radius: 12px; font-size: 18px; }
    .pedidos-fields { grid-template-columns: minmax(0, 1fr); }
    :is(.pedidos-page, .account-menu--modern) .form-control { font-size: 16px; }
    :is(.pedidos-page, .account-menu--modern) .form-control::placeholder { font-size: 12px; }
    .pedidos-page .pedido-result { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 20px; }
    .pedido-result__state { justify-self: start; }
    .pedido-result__action { justify-content: flex-start; }
    .pedidos-empty { padding: 28px 20px; }
}
@media (prefers-reduced-motion: reduce) {
    :is(.pedidos-page, .account-menu--modern) .form-control, .pedidos-page .pedido-result { transition: none; }
}
